/* ============================================================
   HAPPINESS CORNER — THEME
   Edit the values in :root to change colors and fonts sitewide.
   ============================================================ */

/* 1) Load fonts — swap these URLs/names to change typefaces */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,400;0,600;0,700;1,400;1,600&family=DM+Sans:wght@300;400;500&display=swap');

:root {
  /* ---------- FONTS ---------- */
  --serif: 'Cormorant Infant', Georgia, serif;  /* Headings, logo, quotes, numbers */
  --sans:  'DM Sans', sans-serif;        /* Body text, nav, buttons, forms */

  /* ---------- BRAND COLORS ---------- */
  --sun:       #ffd923;   /* Yellow accent — tags, buttons on dark, avatars */
  --sun-dark:  #E8A000;   /* Darker gold — testimonial stars */
  --coral:     #D94A3C;   /* Primary accent — italic text, hover states */
  --mint:      #d2de26;   /* Green/lime — pillar card, avatar */
  --sky:       #0da1e9;   /* Blue — pillars bg */

  /* ---------- NEUTRALS ---------- */
  --ink:       #1A1A2E;   /* Primary text + dark section backgrounds */
  --ink-soft:  #3D3D5C;   /* Secondary text */
  --cream:     #FFFBF0;   /* Page background + light text on dark */
  --white:     #FFFFFF;   /* Cards, buttons on dark */

  /* ---------- SECTION BACKGROUNDS ---------- */
  --bg-body:       var(--cream);   /* Body / about / testimonials */
  --bg-services:   var(--mint);    /* Services section — green/lime */
  --bg-dark:       #2A1B3D;        /* Pillars / contact / footer — deep plum */

  /* ---------- DERIVED (rgba) ----------
     Ink channel = 26,26,46  |  Cream channel = 255,251,240  |  Coral channel = 255,107,107
     If you change --ink / --cream / --coral, also update the rgba() values below to match. */
  --nav-bg:           var(--white);             /* solid white nav ribbon */
  --nav-border:       rgba(26,26,46,0.08);
  --card-border:      rgba(26,26,46,0.07);
  --card-shadow:      rgba(26,26,46,0.12);
  --card-shadow-hover:rgba(217,74,60,0.12);

  --on-dark-strong:   rgba(255,251,240,0.8);   /* contact items */
  --on-dark-medium:   rgba(255,251,240,0.7);   /* pillars intro */
  --on-dark-soft:     rgba(255,251,240,0.65);  /* contact subtitle */
  --on-dark-muted:    rgba(255,251,240,0.5);   /* pillars tag */
  --on-dark-faint:    rgba(255,251,240,0.4);   /* footer, contact tag */
  --on-dark-placeholder: rgba(255,251,240,0.35);

  --input-bg:         rgba(255,251,240,0.07);
  --input-border:     rgba(255,251,240,0.15);
  --footer-border:    rgba(255,251,240,0.08);

}

/* ============================================================
   STYLES — these consume the variables above.
   You normally won't need to edit below this line.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 14pt; }   /* +2pt over browser default of 12pt */

body {
  font-family: var(--sans);
  background: var(--bg-body);
  color: var(--ink);
  overflow-x: hidden;
}

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.2rem 3rem;
  background: var(--nav-bg);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--nav-border);
}
.nav-logo {
  display: flex; align-items: center; gap: 8px;
  text-decoration: none;
}
.nav-logo img { height: 1.82rem; width: auto; display: block; }
.nav-logo span { color: var(--coral); }
.nav-links { display: flex; gap: 2rem; list-style: none; }
.nav-links a {
  font-size: 0.875rem; font-weight: 500;
  color: var(--ink-soft); text-decoration: none;
  transition: color 0.2s;
}
.nav-links a:hover { color: var(--coral); }
.nav-cta {
  background: var(--ink); color: var(--cream);
  padding: 0.5rem 1.25rem; border-radius: 100px;
  font-size: 0.875rem; font-weight: 500;
  text-decoration: none; transition: background 0.2s;
}
.nav-cta:hover { background: var(--coral); }

/* HERO */
.hero {
  min-height: 100vh;
  display: flex; flex-direction: row;
  justify-content: space-between; align-items: center;
  gap: 3rem;
  padding: 8rem 3rem 4rem;
  position: relative; overflow: hidden;
  background: var(--sun);
}
.hero-photo {
  flex: 0 1 50%;
  max-width: 50%;
  max-height: 80vh;
  width: auto; height: auto;
  object-fit: cover;
  border-radius: 24px;
  box-shadow: 0 20px 60px var(--card-shadow);
}
.hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.blob {
  position: absolute; border-radius: 50%;
  filter: blur(80px); opacity: 0.4;
  animation: float 4s ease-in-out infinite;
}
.blob-1 { width: 760px; height: 760px; background: var(--sun);   top: -160px;  right: -140px; animation-delay: 0s;   }
.blob-2 { width: 540px; height: 540px; background: var(--mint);  bottom: -80px; left: 45%;   animation-delay: 1.2s; }
.blob-3 { width: 420px; height: 420px; background: var(--coral); top: 40%;     left: 60%;    animation-delay: 2.4s; }

@keyframes float {
  0%, 100% { transform: translateY(0) translateX(0) scale(1); }
  50%      { transform: translateY(-70px) translateX(20px) scale(1.12); }
}

.hero-content { position: relative; z-index: 1; max-width: 780px; }
.hero-tag {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--coral); color: var(--cream);
  padding: 6px 16px; border-radius: 100px;
  font-size: 0.8rem; font-weight: 500;
  margin-bottom: 2rem;
  animation: fadeUp 0.6s ease both;
}
.hero-tag::before { content: '✦'; font-size: 10px; }

.hero h1 {
  font-family: var(--serif);
  font-size: clamp(3rem, 7vw, 5.5rem);
  font-weight: 600; line-height: 1.1;
  margin-bottom: 1.5rem;
  animation: fadeUp 0.6s ease 0.1s both;
}
.hero h1 em { font-style: italic; color: var(--coral); }
.hero-sub {
  font-size: 1.15rem; font-weight: 300;
  color: var(--ink-soft); line-height: 1.7;
  max-width: 560px; margin-bottom: 2.5rem;
  animation: fadeUp 0.6s ease 0.2s both;
}
.hero-actions {
  display: flex; gap: 1rem; flex-wrap: wrap;
  animation: fadeUp 0.6s ease 0.3s both;
}
.btn-primary {
  background: var(--ink); color: var(--cream);
  padding: 0.85rem 2rem; border-radius: 100px;
  font-size: 0.95rem; font-weight: 500;
  text-decoration: none; transition: all 0.2s;
  border: 2px solid var(--ink);
}
.btn-primary:hover { background: var(--coral); border-color: var(--coral); }
.btn-secondary {
  background: transparent; color: var(--ink);
  padding: 0.85rem 2rem; border-radius: 100px;
  font-size: 0.95rem; font-weight: 500;
  text-decoration: none; transition: all 0.2s;
  border: 2px solid var(--ink);
}
.btn-secondary:hover { background: var(--ink); color: var(--cream); }

.hero-scroll {
  position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%);
  z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 6px;
  font-size: 0.75rem; color: var(--ink-soft); letter-spacing: 0.1em;
  text-transform: uppercase;
  animation: fadeUp 0.6s ease 0.5s both;
}
.scroll-line {
  width: 1px; height: 40px; background: var(--ink-soft);
  animation: scrollDrop 1.5s ease infinite;
}
@keyframes scrollDrop {
  0%   { transform: scaleY(0); transform-origin: top; }
  50%  { transform: scaleY(1); transform-origin: top; }
  51%  { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* SECTIONS shared */
section { padding: 6rem 3rem; }
.section-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 0.75rem; font-weight: 500; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--ink-soft);
  margin-bottom: 1.2rem;
}
.section-tag::before { content: ''; display: block; width: 24px; height: 2px; background: var(--coral); }
h2 {
  font-family: var(--serif);
  font-size: clamp(2.3rem, 4.6vw, 3.45rem);   /* +15% */
  font-weight: 600; line-height: 1.2;
  margin-bottom: 1rem;
}
h2 em { font-style: italic; color: var(--coral); }

/* PILLARS */
.pillars { background: var(--sky); color: var(--cream); }
.pillars .section-tag { color: var(--on-dark-muted); }
.pillars .section-tag::before { background: var(--sun); }
.pillars h2 { color: var(--cream); }
.pillars h2 em { color: var(--sun); }
.pillars-intro { font-size: 1.05rem; color: var(--on-dark-medium); max-width: 560px; margin-bottom: 3.5rem; line-height: 1.7; }
.pillars-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.pillar-card {
  border-radius: 20px; padding: 2rem;
  position: relative; overflow: hidden;
  transition: transform 0.3s ease;
}
.pillar-card:hover { transform: translateY(-6px); }
.pillar-card.p1 { background: var(--sun);   color: var(--ink); }
.pillar-card.p2 { background: var(--mint);  color: var(--ink); }
.pillar-card.p3 { background: var(--coral); color: var(--white); }
.pillar-num {
  font-family: var(--serif); font-size: 4rem;
  font-weight: 400;
  color: var(--white); opacity: 0.5;   /* white @ 0.5 blends with tile bg → lighter tint */
  position: absolute; top: 1rem; right: 1.5rem;
  line-height: 1;
}
.pillar-icon { margin-bottom: 1rem; }

/* ---------- PILLAR ICONS (embedded SVG masks) ---------- */
.pillar-icon--partneri,
.pillar-icon--teamwork,
.pillar-icon--happiness {
  height: 6rem;                           /* same height for all three */
  background-color: var(--white);         /* icon color */
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}
.pillar-icon--partneri {
  aspect-ratio: 95.9202 / 59.646;
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2095.9202%2059.646%22%3E%20%3Cpath%20d%3D%22M33.8325%2C15.055c.133.234.051.532-.183.665-.234.132-.532.05-.665-.184l-6.246-10.978c-.133-.234-.051-.531.184-.664.234-.133.531-.051.664.183l6.246%2C10.978ZM38.6545%2C13.579c.039.267-.145.515-.412.554-.267.039-.515-.146-.554-.413l-1.848-12.494c-.039-.267.146-.515.413-.554.266-.039.515.146.553.413l1.848%2C12.494ZM54.0645%2C15.536c-.133.234-.431.316-.665.184-.234-.133-.316-.431-.183-.665l6.246-10.978c.133-.234.43-.316.665-.183.234.133.316.43.183.664l-6.246%2C10.978ZM49.3605%2C13.72c-.039.267-.287.452-.554.413-.267-.039-.451-.287-.412-.554l1.848-12.494c.039-.267.287-.452.553-.413.267.039.452.287.413.554l-1.848%2C12.494ZM43.5285%2C13.119c0%2C.27-.219.489-.489.489s-.488-.219-.488-.489V.489C42.5515.219%2C42.7695%2C0%2C43.0395%2C0s.489.219.489.489v12.63ZM34.7655%2C54.472c-.52.628-1.031%2C1.059-1.027%2C1.948.001.297.056.612.173.911.114.288.288.56.529.78.732.667%2C1.876.823%2C2.566.073.045-.05.089-.097.163-.177.414-.439.863-.944%2C1.288-1.455.371-.448.716-.892.99-1.288.682-.987.844-2.028.618-2.8-.091-.308-.243-.569-.447-.757-.195-.18-.443-.297-.733-.328-1.923-.207-3.105%2C1.87-4.12%2C3.093M31.7825%2C50.173c-.299.433-.66.898-1.04%2C1.357-.322.388-.665.779-.999%2C1.144-.362.396-.452.447-.449%2C1.043.001.297.056.612.174.911.113.289.287.56.528.78.732.667%2C1.876.824%2C2.566.073.045-.049.089-.096.163-.176.414-.439.864-.944%2C1.288-1.456.371-.447.716-.891.99-1.287.682-.988.844-2.028.618-2.801-.091-.308-.243-.568-.447-.757-.195-.18-.443-.296-.733-.328-.546-.058-1.243.167-2.051.796-.287.223-.406.408-.608.701M25.6795%2C49.541c-.021.058-.054.113-.098.162-.198.217-.313.617-.311%2C1.072.002.297.056.612.174.911.113.288.287.56.529.78.372.339.917.564%2C1.672.561.659-.003%2C1.969-1.668%2C2.344-2.12.911-1.098%2C2.059-2.551%2C1.608-4.088-.09-.308-.242-.569-.447-.757-.195-.18-.443-.297-.733-.328-.606-.065-1.398.219-2.322%2C1.019-.923.799-1.582%2C1.883-2.416%2C2.788M21.9595%2C49.224c.371.337.93.563%2C1.723.56.504-.002.752-.336%2C1.055-.662.798-.798%2C1.632-1.81%2C2.279-2.745.702-1.017.889-2.089.68-2.871-.079-.298-.217-.548-.404-.725-.174-.165-.399-.271-.666-.294-.626-.056-1.478.3-2.506%2C1.278-.414.395-.843.939-1.294%2C1.512-.369.468-.754.956-1.178%2C1.422-.202.222-.32.607-.318%2C1.036.001.262.05.538.154.798.102.254.258.493.475.691M91.9415%2C18.61c.265-.05.52.123.571.388.05.264-.123.52-.388.571-5.733%2C1.109-13.018%2C2.238-19.751%2C3.132-7.077.939-13.542%2C1.618-16.952%2C1.738-.033.002-.066-.001-.099-.006v.001c-5.725-.979-15.113-2.363-18.609%2C4.048-.514%2C1.491-1.16%2C2.814-1.726%2C3.975-.977%2C2.005-1.694%2C3.476-.968%2C4.185.916.122%2C2.535-.133%2C4.397-1.32%2C1.398-.891%2C2.917-2.305%2C4.36-4.47.098-.145.259-.221.422-.216.01%2C0%2C3.441.096%2C7.602.362.269.017.473.249.456.517-.016.269-.248.474-.517.457-.743-.047-1.459-.089-2.134-.126%2C1.154%2C1.118%2C2.432%2C2.324%2C3.747%2C3.565%2C2.653%2C2.503%2C5.461%2C5.153%2C7.802%2C7.611l.011.012v-.001c.53.594%2C1.022%2C1.171%2C1.466%2C1.723.035-.014.073-.024.112-.03%2C5.353-.774%2C11.15-1.314%2C16.974-1.578%2C5.689-.259%2C11.399-.256%2C16.741.045.269.015.475.245.461.514-.015.269-.245.475-.514.46-5.314-.299-10.991-.302-16.646-.045-5.628.256-11.239.77-16.449%2C1.509.229.308.439.605.628.89.718%2C1.087%2C1.137%2C2.027%2C1.139%2C2.741.001.487-.088.887-.258%2C1.202l-.001.001.001.001c-.159.292-.385.511-.673.657-.265.134-.577.201-.933.201-.878.002-2.068-.413-3.499-1.185l.075.114c.629.969.956%2C1.786.957%2C2.498.001.487-.087.886-.258%2C1.201v.002c-.158.293-.384.511-.672.657-.265.135-.578.201-.934.202-.884.001-2.086-.42-3.532-1.203-.024-.014-.048-.029-.069-.046-.317-.232-.645-.478-.986-.738l.017.027c.548.904.82%2C1.669.821%2C2.314.001.451-.08.821-.239%2C1.114l-.018.03c-.148.26-.354.454-.612.585-.246.125-.537.187-.867.187-.81.002-1.907-.382-3.225-1.097l-.013-.007c.111.316.17.607.17.87.001.451-.08.821-.239%2C1.113l-.018.03c-.148.26-.354.455-.612.585-.246.125-.537.187-.867.188-.811.001-1.907-.383-3.225-1.097-.025-.013-.048-.028-.069-.045-.55-.403-1.13-.845-1.743-1.328-.559-.44-1.152-.919-1.779-1.437-.135.323-.31.645-.528.96-.299.432-.66.898-1.04%2C1.356-.429.518-.895%2C1.04-1.329%2C1.502l-.156.168c-.481.524-.733.798-1.607.802-1.03.004-1.794-.322-2.334-.814-.359-.327-.615-.725-.781-1.146-.133-.34-.208-.698-.231-1.046-.263.198-.565.301-1.098.303-1.03.005-1.794-.321-2.334-.813-.359-.327-.615-.726-.78-1.147-.137-.347-.212-.713-.233-1.069-.181.057-.397.085-.677.087-1.029.005-1.794-.322-2.333-.813-.359-.328-.616-.726-.781-1.147-.162-.411-.237-.848-.239-1.263l.001-.087c-.167.043-.364.066-.611.067-1.068.005-1.847-.323-2.384-.813-.332-.302-.569-.665-.723-1.049-.151-.377-.222-.775-.223-1.157-.003-.604.17-1.178.469-1.575-1.564-.85-10.82-5.691-20.388-6.669-.267-.028-.462-.268-.435-.535.027-.268.267-.463.535-.435%2C10.223%2C1.045%2C20.071%2C6.401%2C20.936%2C6.88.2-.243.394-.49.585-.732.47-.597.917-1.164%2C1.39-1.614%2C1.254-1.193%2C2.378-1.621%2C3.262-1.543.5.045.923.245%2C1.255.558.319.303.549.709.675%2C1.18.152.571.152%2C1.248-.026%2C1.953.703-.375%2C1.348-.503%2C1.906-.443.51.054.946.261%2C1.291.58.336.309.582.722.722%2C1.2.142.483.174%2C1.037.081%2C1.618.712-.385%2C1.366-.517%2C1.93-.456.509.055.945.262%2C1.29.58.336.31.582.723.722%2C1.201.143.487.175%2C1.046.079%2C1.632.877-.581%2C1.679-.783%2C2.353-.711.509.055.945.262%2C1.29.58.336.31.582.723.722%2C1.201.146.497.177%2C1.068.073%2C1.667.037.017.072.04.105.067.704.583%2C1.364%2C1.118%2C1.981%2C1.604.613.483%2C1.179.915%2C1.7%2C1.297%2C1.166.629%2C2.098.968%2C2.734.967.173-.001.317-.029.428-.085.082-.041.149-.105.199-.19l.01-.02c.083-.152.126-.367.125-.647%2C0-.247-.107-.58-.302-.98h.001l-.001-.002c-.197-.407-.48-.865-.83-1.362-.765-.605-1.59-1.28-2.482-2.027-1.682-1.41-3.597-3.077-5.78-5.019-.201-.18-.219-.488-.04-.69.18-.201.488-.219.69-.04%2C2.182%2C1.942%2C4.09%2C3.603%2C5.757%2C5%2C1.391%2C1.167%2C2.828%2C2.338%2C4.295%2C3.413%2C1.166.63%2C2.098.968%2C2.734.967.174%2C0%2C.317-.028.428-.084.082-.042.149-.105.199-.19l.011-.02c.082-.153.125-.368.124-.648-.001-.462-.226-1.061-.68-1.81-.271-.448-.623-.944-1.056-1.491-.622-.786-1.193-1.485-1.948-2.118-1.854-1.554-3.964-3.391-6.37-5.532-.201-.179-.219-.488-.04-.69.179-.201.488-.219.689-.04%2C2.406%2C2.141%2C4.51%2C3.972%2C6.347%2C5.513%2C1.827%2C1.531%2C3.395%2C2.78%2C4.74%2C3.766%2C1.294.699%2C2.331%2C1.075%2C3.041%2C1.073.199%2C0%2C.366-.032.494-.098.106-.053.191-.137.253-.252h.001c.094-.175.143-.42.142-.737-.001-.51-.274-1.156-.801-1.967-.377-.581-.881-1.238-1.506-1.981-.864-1.028-1.619-1.672-2.66-2.544-1.853-1.554-3.964-3.39-6.37-5.532-.201-.179-.219-.488-.04-.689.179-.201.488-.219.69-.04%2C2.406%2C2.141%2C4.509%2C3.972%2C6.347%2C5.512%2C1.827%2C1.532%2C3.394%2C2.781%2C4.739%2C3.767%2C1.295.698%2C2.331%2C1.074%2C3.042%2C1.073.199%2C0%2C.365-.033.494-.098.105-.054.19-.138.252-.253l.001.001c.094-.175.143-.42.143-.738-.002-.507-.362-1.269-.979-2.202-.653-.988-1.586-2.141-2.688-3.377v-.001c-2.318-2.434-5.113-5.07-7.752-7.56-1.508-1.423-2.966-2.799-4.272-4.077-.076-.075-.123-.17-.139-.268-1.867-.092-3.274-.141-3.838-.158-1.482%2C2.163-3.046%2C3.6-4.496%2C4.524-2.188%2C1.395-4.15%2C1.633-5.213%2C1.439l-.006-.001h-.003c-.075-.014-.148-.046-.212-.096-1.489-1.163-.61-2.966.604-5.456.56-1.149%2C1.199-2.459%2C1.691-3.895.009-.028.021-.055.035-.082%2C1.023-1.891%2C2.422-3.243%2C4.264-4.126-3.495-.093-8.875-.348-12.4-1.037-5.615-1.099-17.202-7.978-17.236-7.998-.232-.137-.309-.437-.172-.669s.437-.309.669-.172c.033.02%2C11.475%2C6.814%2C16.926%2C7.88%2C4.681.916%2C12.761%2C1.05%2C15.046%2C1.07%2C3.169-.649%2C7.271-.429%2C12.509.463%2C3.393-.124%2C9.794-.798%2C16.806-1.729%2C6.7-.889%2C13.963-2.015%2C19.694-3.124%22%2F%3E%20%3C%2Fsvg%3E");
}
.pillar-icon--teamwork {
  aspect-ratio: 56.2958 / 68.6299;
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2056.2958%2068.6299%22%3E%20%3Cpath%20d%3D%22M32.0011%2C66.5588c1.4914-.1714%2C1.3035-1.6786%2C1.173-2.813-.427.068-.794.126-1.216.193.014.872.028%2C1.686.043%2C2.62M32.1531%2C31.4238c1.9274-.4769%2C4.4891-3.686%2C2.3152-5.1213-1.8286.3004-2.3265%2C3.5676-2.3152%2C5.1213M24.2101%2C31.3488c-.117-1.411-.7175-5.7716-2.7817-4.8185-1.2661%2C1.8416.8721%2C4.5612%2C2.7817%2C4.8185M29.1831%2C64.0188c-2.0797-.1164-4.0674.026-6.144-.217-.6646%2C3.4828%2C3.6397%2C3.5485%2C6.143%2C3.44.03-1.073.031-2.116.001-3.223M23.0331%2C54.2918c-.9155%2C3.2774-2.6239%2C2.5131-1.228-.47-.8116-.3595-1.8513-.4771-1.885-1.542-.007-.12-.002-.255-.233-.251-5.7744%2C8.2181%2C23.1849%2C7.7398%2C16.767.019-.0562%2C1.1234-.8018%2C1.3325-1.97%2C1.804%2C1.3946%2C3.0007-.188%2C3.7445-1.229.472-3.3633.3737-6.8546.4337-10.222-.032M37.2511%2C57.1118c-5.4618%2C3.0112-12.8206%2C2.9542-18.284-.024-.343%2C1.1829-.3564%2C3.2441.935%2C3.564-.1639-.8369.7259-2.5355%2C1.2673-1.083.015.7523-.1142%2C1.4457.0317%2C2.223%2C4.3585%2C1.348%2C9.5882%2C1.4103%2C13.921-.043.2975-.8242-.4929-2.3317.4808-2.7181%2C1.0141-.0678.4653%2C1.2445.9212%2C1.6941%2C1.03-.877%2C1.321-2.319.727-3.613M30.2141%2C53.2448c-.5988-6.6484-.3966-13.5016-.084-20.028-1.321.001-2.68.002-4.103.003.7304%2C6.6532.5171%2C13.3508.064%2C20.017%2C1.363.002%2C2.693.005%2C4.123.008M30.5671%2C31.7958c1.3226-13.7062%2C12.0769-2.6943%2C1.162%2C1.211-.9552%2C6.6096-.7802%2C13.5486-.177%2C20.132%2C1.008.059%2C2.406-.316%2C3.46-.935-.271-8.421%2C6.2341-14.9405%2C7.8492-22.8709%2C2.4522-9.4644-5.1142-19.3038-15.1578-17.5715-10.8402-1.4975-17.2322%2C10.3658-13.7388%2C19.7507%2C2.3484%2C6.9547%2C7.5269%2C13.1438%2C7.3533%2C20.8147%2C1.166.374%2C2.234.907%2C3.496.855.4044-6.6955.7684-13.5169-.232-20.175-10.7338-3.8717-.6385-15.0984%2C1.278-1.198%2C1.06.142%2C3.51.143%2C4.707-.013M30.5721%2C66.4348c.0981-.621.2956-1.8627-.023-2.353-.176.682-.155%2C1.611.052%2C2.359-.1717.097-.0718.1985-.002.327.0706-.1303.1131-.2319-.027-.333M36.4161%2C49.8928c2.3054%2C1.7404%2C2.4663%2C4.0649%2C2.1171%2C6.5822%2C1.2294%2C3.2301-.9341%2C6.0646-4.0291%2C6.9948.7568%2C3.7595-2.3821%2C4.9859-5.5815%2C5.1367-3.4515.1556-8.0598-.7083-7.1095-5.1437-3.1791-.8782-5.2933-3.9192-3.9877-7.1432-.5456-2.4491-.1232-4.7387%2C2.0487-6.3918-1.1302-8.4671-8.0433-14.9592-8.091-23.684-.3682-7.8677%2C4.7853-15.1343%2C12.9101-15.7708%2C12.907-2.9594%2C23.5531%2C9.0261%2C18.8689%2C21.4728-2.0301%2C6.128-6.2168%2C11.4176-7.146%2C17.9469M39.8027.3739c.1934.9034-4.6664%2C12.1256-4.1832%2C6.919%2C1.15-1.3731%2C2.2303-8.1693%2C4.1832-6.919M19.6288%2C8.1287c-.588-2.549-3.6444-5.7616-2.7751-8.0899.9811-.7342%2C6.0134%2C11.2736%2C2.7751%2C8.0899M.4038%2C22.3607c1.1079.2117%2C10.8807-.8227%2C8.2354%2C1.3777-1.2582-.3271-10.2565.9015-8.2354-1.3777M56.1672%2C22.568c.5603%2C1.7106-2.4235.8739-3.3768%2C1.1072-1.643-.3399-4.7154.9389-5.6465-.5565.4644-1.268%2C7.6204-.8452%2C9.0233-.5507M8.6324%2C41.32c.8937-.4051%2C4.3977-3.1745%2C3.7924-.7311-1.8858%2C1.2403-3.9291%2C2.2549-5.8744%2C3.4031-.3854.2314-1.0069.4199-1.253-.0871-.0719-1.4375%2C2.3779-1.7544%2C3.316-2.617.007.01.013.021.019.032M51.0436%2C43.3069c.1479.9098-.6432%2C1.1675-1.3141.6598-1.674-1.4305-5.4374-2.0189-5.9486-4.1122%2C2.1627-.5525%2C5.1119%2C2.5118%2C7.2627%2C3.4524M39.4751%2C17.0787c3.0377%2C6.1622%2C2.947%2C13.9512-.4446%2C19.923-.2654.8483-1.7176%2C1.2274-1.5135.0028%2C3.6157-5.9217%2C3.94-14.2937.1806-20.2249-.7078-.5488-.0965-1.7335.7037-1.121.4151.3612.8157%2C1.0246%2C1.0739%2C1.42%22%2F%3E%20%3C%2Fsvg%3E");
}
.pillar-icon--happiness {
  aspect-ratio: 56.2958 / 68.6299;
  mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2056.2958%2068.6299%22%3E%20%3Cpath%20d%3D%22M54.8195%2C49.3193c-.9768%2C5.9789-9.0792%2C6.7513-13.6046%2C9.1411-7.0441-5.4568-10.8097-14.291-15.807-21.6228-1.2577-.8393-1.1409-5.2596-2.1223-4.6601-.9977%2C8.1749-2.7158%2C16.9766-3.0674%2C25.0568%2C2.347-.4455%2C5.7419-1.8378%2C7.9857.0076%2C5.0253%2C5.194-12.0425%2C9.2073-16.8789%2C2.8505%2C1.3154-9.1908%2C2.2566-18.446%2C3.1633-27.6871.1906-.5162.3589-2.0087-.4952-1.8041-4.5662-1.3893-8.1187-5.676-10.8733-9.4168.0328.0516.0662.1032.0991.1547C-.31%2C16.2406%2C1.7579%2C8.2154%2C8.3749%2C7.3824c5.7177-1.1439%2C10.1902%2C3.1508%2C13.9787%2C6.8941.9384.7656%2C1.314-1.1564%2C1.7755-1.6939.8603-1.4491%2C1.9368-2.5473%2C3.4686-3.6295%2C4.3908-3.4044%2C16.8581-5.1408%2C15.6533%2C3.1985.0164-.0791.0334-.1583.0498-.2374-9.8402%2C24.8591-20.4934%2C11.6299-.0997%2C37.725%2C1.3129%2C1.8355%2C3.6321-1.309%2C5.3163-1.573%2C2.157-1.0118%2C6.3736-2.2198%2C6.302%2C1.2531M55.7819%2C48.5263c-.6851-6.6868-8.4289-1.988-11.7566-.1788-3.8809-5.2233-8.1981-10.8798-11.7977-16.1889C59.993%2C1.2477%2C31.7585-2.601%2C22.7311%2C12.4482%2C1.8253-8.9005-9.487%2C22.5366%2C13.4403%2C32.5589c.5225%2C5.879-5.1288%2C27.8287-1.7582%2C30.0206%2C15.3328%2C11.1273%2C27.9655-11.4986%2C9.4149-7.5102%2C1.3126-6.1954%2C1.7061-12.5357%2C2.5673-18.8008%2C5.1989%2C7.8823%2C9.6908%2C18.9545%2C17.8031%2C24.192%2C5.4133-2.7653%2C14.9579-4.061%2C14.3146-11.9342%22%2F%3E%20%3Cpath%20d%3D%22M21.1429%2C17.9666c-1.2714-1.7502-1.0429%2C3.3266.0307%2C1.1289.1024-.3634.1117-.7755-.0307-1.1289%22%2F%3E%20%3Cpath%20d%3D%22M27.667%2C17.7651c-.252-2.8439-2.4941%2C1.7596-.7655%2C1.8621.3874-.5.7145-1.211.7655-1.8621%22%2F%3E%20%3Cpath%20d%3D%22M29.798%2C22.2476c-2.3879%2C2.0306-5.7109%2C3.0301-8.8312%2C2.2683.0434.0117.0873.0234.1307.0352-2.9108-.6494-5.462-2.7926-6.329-5.692-.1513-.3326-.5378-.2195-.6448.0781-.425%2C3.9294%2C3.9666%2C7.1572%2C7.5344%2C7.707%2C2.3535.5387%2C10.309-1.0931%2C8.1399-4.3966%22%2F%3E%20%3C%2Fsvg%3E");
}
.pillar-card h3 { font-family: var(--serif); font-size: 2.28rem; font-weight: 600; margin-bottom: 0.75rem; } /* +15% x3 */
.pillar-card p { font-size: 0.9rem; line-height: 1.7; opacity: 0.85; }

/* ABOUT */
.about { background: var(--white); }
.about-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.about-visual {
  position: relative; aspect-ratio: 3/4;
  border-radius: 24px; overflow: hidden;
  background: var(--coral);
  display: flex; align-items: center; justify-content: center;
}
.about-photo {
  position: absolute;
  inset: 0;
  margin: auto;            /* centers inside the box */
  height: 80%;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
.about-badge {
  position: absolute; bottom: 1.5rem; left: 1.5rem;
  background: var(--white); border-radius: 14px;
  padding: 1rem 1.25rem;
  box-shadow: 0 8px 32px var(--card-shadow);
}
.badge-num { font-family: var(--serif); font-size: 2rem; font-weight: 600; color: var(--coral); }
.badge-text { font-size: 0.8rem; color: var(--ink-soft); margin-top: 2px; }
.about-text h2 { margin-bottom: 1.5rem; }
.about-text p { font-size: 1rem; line-height: 1.8; color: var(--ink-soft); margin-bottom: 1rem; }
.about-text p strong { color: var(--ink); font-weight: 500; }
.about-values { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 1.5rem; }
.about-value {
  background: var(--sun); color: var(--ink);
  padding: 6px 14px; border-radius: 100px;
  font-size: 0.8rem; font-weight: 500;
}

/* SERVICES */
.services { background: var(--bg-services); }
.services h2 { margin-bottom: 0.5rem; }
.services-sub { font-size: 1rem; color: var(--ink-soft); margin-bottom: 3rem; line-height: 1.7; max-width: 520px; }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; }
.service-card {
  background: var(--white); border-radius: 20px;
  padding: 2rem; border: 1.5px solid transparent;
  transition: all 0.3s ease;
  position: relative;
}
.service-card:hover { border-color: var(--coral); transform: translateY(-4px); box-shadow: 0 12px 40px var(--card-shadow-hover); }
.service-num {
  font-family: var(--serif); font-size: 0.9rem;
  font-style: italic; color: var(--coral); margin-bottom: 1rem;
}
.service-card h3 { font-family: var(--serif); font-size: 2.05rem; font-weight: 600; margin-bottom: 0.75rem; } /* +15% x3 */
.service-card p { font-size: 0.9rem; color: var(--ink-soft); line-height: 1.7; }
.service-tag {
  display: inline-block; margin-top: 1.25rem;
  font-size: 0.75rem; font-weight: 500;
  color: var(--coral); letter-spacing: 0.05em;
}

/* TESTIMONIALS */
.testimonials { background: var(--sun); }
.testimonials h2 { margin-bottom: 3rem; }
.testi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.testi-card {
  background: var(--white); border-radius: 20px;
  padding: 2rem; border: 1px solid var(--card-border);
  transition: transform 0.3s;
}
.testi-card:hover { transform: translateY(-4px); }
.testi-stars { color: var(--sun-dark); font-size: 1rem; margin-bottom: 1rem; letter-spacing: 2px; }
.testi-quote {
  font-family: var(--serif); font-style: italic;
  font-size: 1.05rem; line-height: 1.7; color: var(--ink);
  margin-bottom: 1.5rem;
}
.testi-author { display: flex; align-items: center; gap: 12px; }
.testi-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; font-weight: 500;
  flex-shrink: 0;
}
.av1 { background: var(--sun);      color: var(--ink); }
.av2 { background: var(--mint);     color: var(--ink); }
.av3 { background: var(--coral); color: var(--cream); }
.testi-name { font-size: 0.9rem; font-weight: 500; color: var(--ink); }
.testi-role { font-size: 0.8rem; color: var(--ink-soft); }

/* CONTACT */
.contact { background: var(--coral); color: var(--cream); }
.contact .section-tag { color: var(--on-dark-faint); }
.contact .section-tag::before { background: var(--sun); }
.contact-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 5rem; align-items: start; }
.contact h2 { color: var(--cream); margin-bottom: 1rem; }
.contact h2 em { color: var(--sun); }
.contact-sub { color: var(--on-dark-soft); line-height: 1.7; font-size: 1rem; margin-bottom: 2rem; }
.contact-info { display: flex; flex-direction: column; gap: 1rem; }
.contact-item { display: flex; align-items: center; gap: 12px; color: var(--on-dark-strong); font-size: 0.95rem; }
.contact-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sun); flex-shrink: 0; }

form { display: flex; flex-direction: column; gap: 1rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
input, textarea, select {
  width: 100%; padding: 0.9rem 1.1rem;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: 12px; color: var(--cream);
  font-family: var(--sans); font-size: 0.9rem;
  outline: none; transition: border-color 0.2s;
}
input::placeholder, textarea::placeholder { color: var(--on-dark-placeholder); }
input:focus, textarea:focus, select:focus { border-color: var(--sun); }
select option { background: var(--ink); }
textarea { resize: vertical; min-height: 130px; }
.form-submit {
  background: var(--sun); color: var(--ink);
  padding: 0.9rem 2rem; border-radius: 100px;
  font-size: 0.95rem; font-weight: 500;
  border: none; cursor: pointer;
  transition: all 0.2s; align-self: flex-start;
}
.form-submit:hover { background: var(--coral); color: var(--white); }

/* FOOTER */
footer {
  background: var(--white); color: var(--ink-soft);
  padding: 2rem 3rem;
  display: flex; justify-content: space-between; align-items: center;
  border-top: 1px solid var(--card-border);
  font-size: 0.82rem;
}
.footer-logo { font-family: var(--serif); font-size: 1rem; color: var(--ink); }
.footer-logo span { color: var(--coral); }

/* ANIMATIONS */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* RESPONSIVE */
@media (max-width: 768px) {
  nav { padding: 1rem 1.5rem; }
  .nav-links { display: none; }
  section { padding: 4rem 1.5rem; }
  .hero { padding: 7rem 1.5rem 4rem; flex-direction: column; align-items: flex-start; }
  .hero-photo { flex: 0 0 auto; max-width: 100%; width: 100%; }
  .about-inner, .contact-inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .form-row { grid-template-columns: 1fr; }
  footer { flex-direction: column; gap: 1rem; text-align: center; }
}