/* ============================================================
   sections.css — section-specific composition
   ============================================================ */

/* ---- HERO (signature moment) ---- */
.hero{position:relative;padding-top:clamp(8rem,12vh,11rem);padding-bottom:var(--section);overflow:clip}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(110% 75% at 82% -8%, var(--sun-1), transparent 56%),
    radial-gradient(120% 90% at 8% 2%, var(--sun-3), transparent 58%),
    linear-gradient(180deg, var(--sun-2), var(--cream) 76%)}
.hero-bg .blob{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5}
.hero-bg .b1{width:42vw;height:42vw;left:-10vw;top:8vw;background:radial-gradient(circle,var(--sun-4),transparent 70%)}
.hero-bg .b2{width:30vw;height:30vw;right:-6vw;top:-4vw;background:radial-gradient(circle,var(--sun-1),transparent 70%)}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{margin-top:1.6rem;font-weight:500}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 em{color:var(--clay);font-style:italic}
.hero .lead{margin-top:1.6rem;max-width:36ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2.3rem}
.hero-trust{display:flex;flex-wrap:wrap;gap:.7rem 1.5rem;margin-top:2.4rem}
.hero-trust span{display:inline-flex;align-items:center;gap:.55rem;font-size:.9rem;font-weight:600;color:var(--ink-soft)}
.hero-trust svg{width:18px;height:18px;color:var(--clay);flex:0 0 auto}

/* framed sunset art with parallax layers */
.hero-art{position:relative;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-3);
  background:linear-gradient(175deg,var(--sun-1),var(--sun-3) 48%,var(--sun-5))}
.hero-art .frame{position:absolute;inset:18px;border:2px solid var(--frame);border-radius:calc(var(--r-lg) - 12px);z-index:3;pointer-events:none}
.hero-art svg{position:absolute;inset:0;width:100%;height:100%}
.hero-art .sun{top:16%;left:auto;right:14%;width:30%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fdeec6,#f6d5a8 70%);opacity:.92}
.hero-art .ridge{height:auto}
.hero-art .cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:1.5rem 1.7rem;color:var(--ink);
  background:linear-gradient(0deg,rgba(253,247,238,.92),transparent)}
.hero-art .cap b{font-family:var(--font-display);font-weight:500;font-size:1.2rem;font-style:italic;display:block}
.hero-art .cap small{color:var(--ink-soft);font-size:.88rem}

/* ---- Section heading block ---- */
.sec-head{max-width:62ch}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head h2{margin-top:1.1rem}
.sec-head p{margin-top:1.1rem;font-size:var(--step-1);color:var(--ink-soft)}

/* ---- APPROACH (editorial modality cards) ---- */
.tint{background:linear-gradient(180deg,var(--cream),var(--surface-2) 50%,var(--cream))}
.modal-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.1rem;margin-top:3rem}
.modal{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.6rem 1.4rem;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.modal:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.modal .abbr{font-family:var(--font-display);font-weight:600;font-size:1.7rem;font-style:italic;color:var(--clay);
  display:block;line-height:1;margin-bottom:1rem}
.modal h3{font-size:1.05rem;font-family:var(--font-body);font-weight:700}
.modal p{font-size:.9rem;color:var(--ink-soft);margin-top:.5rem;line-height:1.55}

/* ---- SERVICES (bento) ---- */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:3rem}
.svc{position:relative;border-radius:var(--r);padding:1.9rem 1.6rem;background:var(--surface);border:1px solid var(--line);overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.svc:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.svc.feature{grid-column:span 2;grid-row:span 1;background:linear-gradient(150deg,var(--sun-2),var(--sun-3));border-color:transparent}
.svc .icon{margin-bottom:1.1rem}
.svc.feature .icon{background:var(--frame)}
.svc h3{font-size:1.3rem}
.svc.feature h3{font-size:var(--step-2)}
.svc p{color:var(--ink-soft);margin-top:.6rem;font-size:.96rem}
.svc.feature p{color:var(--ink);max-width:42ch}

/* ---- WHO WE HELP ---- */
.who{display:grid;grid-template-columns:.95fr 1.05fr;gap:1.3rem;margin-top:3rem}
.who-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.7rem,3vw,2.4rem)}
.who-card h3{display:flex;align-items:center;gap:.8rem;font-family:var(--font-display)}
.who-card .icon{flex:0 0 auto}
.who-card>p{color:var(--ink-soft);margin-top:.9rem}
.who-card .chips{margin-top:1.3rem}
.who-card .btn{margin-top:1.6rem}

/* ---- TRUST band ---- */
.trust{background:linear-gradient(150deg,var(--sun-2),var(--sun-5));border-radius:var(--r-lg);padding:clamp(2.2rem,4vw,3.6rem);box-shadow:var(--shadow-2)}
.trust .sec-head h2,.trust .sec-head p{color:var(--ink)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:2.6rem}
.trust-item{background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.7);border-radius:var(--r);padding:1.5rem;text-align:center}
.trust-item .icon{margin:0 auto .9rem;width:48px;height:48px;border-radius:50%;background:var(--surface)}
.trust-item b{font-family:var(--font-display);font-weight:600;font-size:1.06rem;color:var(--ink);display:block}
.trust-item small{font-size:.84rem;color:var(--ink-soft);display:block;margin-top:.3rem;line-height:1.45}
.trust-note{margin-top:1.7rem;text-align:center;font-family:var(--font-display);font-style:italic;font-size:var(--step-1);color:var(--ink)}

/* ---- REFER + CONTACT split ---- */
.cta-split{display:grid;grid-template-columns:1.05fr .95fr;gap:1.3rem;margin-top:3rem;align-items:start}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.7rem,3vw,2.6rem);box-shadow:var(--shadow-1)}
.panel.refer{background:linear-gradient(160deg,var(--surface),var(--surface-2));border-color:transparent;box-shadow:var(--shadow-2)}
.panel h3{font-size:var(--step-2)}
.panel>p{color:var(--ink-soft);margin-top:.6rem}

/* ---- Responsive ---- */
@media (max-width:1000px){
  .hero-in{grid-template-columns:1fr;gap:2.6rem}
  .hero-art{max-width:min(440px,82vw);margin-inline:auto}
  .modal-grid{grid-template-columns:repeat(3,1fr)}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .svc.feature{grid-column:span 2}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .who,.cta-split{grid-template-columns:1fr}
  .form .row{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .nav-toggle{display:inline-flex}
  .nav-links{position:fixed;top:84px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:rgba(253,247,238,.97);backdrop-filter:blur(16px) saturate(150%);padding:.6rem var(--gutter) 1.4rem;border-bottom:1px solid var(--line);box-shadow:var(--shadow-1);transform:translateY(-14px);opacity:0;visibility:hidden;transition:transform .35s var(--ease),opacity .35s,visibility .35s}
  .nav.open .nav-links{transform:none;opacity:1;visibility:visible}
  .nav-links a{width:100%;padding:.8rem 0;font-size:1.06rem;border-bottom:1px solid var(--line)}
  .nav-links a::after{display:none}
}
@media (max-width:600px){
  .hero-trust{flex-direction:column;align-items:flex-start;gap:.6rem}
  .modal-grid,.svc-grid{grid-template-columns:1fr}
  .svc.feature{grid-column:span 1}
  .form .row{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .nav-cta .btn-soft{display:none}
  .foot-bottom{flex-direction:column}
}
/* referring card gets visual primacy */
.who .who-card:nth-child(2){background:linear-gradient(160deg,var(--surface),var(--surface-2))}

/* ===== v3: living background, hero video/glass, micro-interactions ===== */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.95;pointer-events:none}
.hero-overlay{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(100deg,rgba(253,247,238,.92) 0%,rgba(253,247,238,.66) 34%,rgba(253,247,238,.2) 64%,transparent 88%),linear-gradient(0deg,rgba(253,247,238,.42),transparent 26%)}
.hero-bg .b3{width:24vw;height:24vw;left:34vw;top:-6vw;background:radial-gradient(circle,var(--sun-2),transparent 70%);opacity:.45}
.sun-glow{position:absolute;z-index:0;top:-14%;right:6%;width:46vw;height:46vw;max-width:660px;max-height:660px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,237,198,.85),rgba(247,213,168,.25) 45%,transparent 70%);filter:blur(6px)}
.hero-art{transition:transform .35s var(--ease)}
.trust-item{transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.trust-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-1)}
.trust-item .icon{transition:transform .5s var(--ease)}
.trust-item.in .icon{animation:iconPop .65s var(--ease) .12s both}
.modal .abbr{transition:transform .4s var(--ease)}
.modal:hover .abbr{transform:rotate(-4deg) scale(1.08)}
.svc .icon,.who-card .icon{transition:transform .45s var(--ease)}
.svc:hover .icon,.who-card:hover .icon{transform:scale(1.08) rotate(-3deg)}
@media (prefers-reduced-motion:no-preference){
  .hero-bg{background-size:200% 200%;animation:bgDrift 48s ease-in-out infinite}
  .hero-bg .blob{animation:floaty 42s ease-in-out infinite}
  .hero-bg .b2{animation:floaty 52s ease-in-out infinite reverse}
  .hero-bg .b3{animation:floaty 60s ease-in-out infinite}
  .sun-glow{animation:breathe 16s ease-in-out infinite}
}
@keyframes bgDrift{0%,100%{background-position:0% 0%}50%{background-position:100% 55%}}
@keyframes floaty{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(2vw,-2.2vw,0) scale(1.06)}}
@keyframes breathe{0%,100%{opacity:.65;transform:scale(1)}50%{opacity:1;transform:scale(1.07)}}
@keyframes iconPop{0%{transform:scale(.5);opacity:0}60%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}

/* ===== v6: balanced services (feature + list) ===== */
.svc-layout{display:grid;grid-template-columns:1.12fr .88fr;gap:1.3rem;margin-top:3rem;align-items:stretch}
.svc-feature{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(150deg,var(--sun-2),var(--sun-3) 58%,var(--sun-4));border-radius:var(--r-lg);padding:clamp(1.9rem,3vw,2.8rem);box-shadow:var(--shadow-2)}
.svc-feature .icon{background:var(--frame);margin-bottom:1.3rem}
.svc-feature h3{font-size:var(--step-3)}
.svc-feature p{color:var(--ink);margin-top:.8rem;max-width:44ch}
.svc-feature .btn{margin-top:1.5rem;align-self:flex-start}
.svc-list{display:flex;flex-direction:column;gap:1rem}
.svc-row{display:flex;gap:1.1rem;align-items:flex-start;flex:1;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.4rem 1.5rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.svc-row:hover{transform:translateX(5px);box-shadow:var(--shadow-1);border-color:transparent}
.svc-row .icon{flex:0 0 auto}
.svc-row h3{font-size:1.12rem;font-family:var(--font-display)}
.svc-row p{color:var(--ink-soft);font-size:.93rem;margin-top:.3rem;line-height:1.5}

/* ===== v6: drenched sunset band (unmistakable POV) ===== */
.section.drenched{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--sun-1),var(--sun-3) 46%,var(--sun-5))}
.drench-glow{position:absolute;z-index:0;top:-22%;right:-6%;width:52vw;height:52vw;max-width:700px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,240,205,.7),transparent 65%);filter:blur(10px)}
.section.drenched .container{position:relative;z-index:1}
.section.drenched .sec-head h2,.section.drenched .sec-head p,.section.drenched .trust-note{color:var(--ink)}
.section.drenched .eyebrow{color:var(--clay-deep)}
.section.drenched .trust-grid{margin-top:2.6rem}
.section.drenched .trust-item{background:rgba(255,255,255,.55);border-color:rgba(255,255,255,.65);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

@media (max-width:1000px){.svc-layout{grid-template-columns:1fr}}

/* ===== v7: real photography ===== */
.hero-art-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.svc-feature{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:360px;background:var(--sun-3);padding:clamp(1.7rem,3vw,2.4rem)}
.svc-feature-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.svc-feature::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(56,42,34,.9),rgba(56,42,34,.46) 48%,rgba(56,42,34,.05))}
.svc-feature-body{position:relative;z-index:2}
.svc-feature .icon{background:rgba(255,255,255,.22);color:#fff;box-shadow:none;margin-bottom:1rem}
.svc-feature h3{color:#fff;font-size:var(--step-3)}
.svc-feature p{color:rgba(255,255,255,.92);max-width:44ch}
.svc-feature .btn.btn-soft{background:#fff;color:var(--clay-deep);border-color:transparent}
.approach-head{display:grid;grid-template-columns:1.5fr .82fr;gap:clamp(1.5rem,3vw,2.6rem);align-items:center;margin-bottom:.5rem}
.approach-art{margin:0}
.approach-art img{width:100%;border-radius:var(--r);box-shadow:var(--shadow-1)}
.section.drenched{background:#e9b8ad}
.section.drenched::before{content:"";position:absolute;inset:0;z-index:0;background-image:linear-gradient(180deg,rgba(253,247,238,.82) 0%,rgba(253,247,238,.5) 38%,rgba(253,247,238,.32) 100%),url("../hills.webp");background-size:cover;background-position:center}
@media (max-width:760px){.approach-head{grid-template-columns:1fr}}

/* ===== v8: mobile sticky Call / Book bar ===== */
.mobile-bar{display:none}
@media (max-width:700px){
  .mobile-bar{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;position:fixed;left:0;right:0;bottom:0;z-index:75;
    padding:.7rem .9rem calc(.7rem + env(safe-area-inset-bottom,0px));background:rgba(253,247,238,.93);
    -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);
    border-top:1px solid var(--line);box-shadow:0 -8px 26px rgba(135,70,39,.1)}
  .mobile-bar-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-body);font-weight:700;font-size:.98rem;padding:.9rem;border-radius:var(--r-pill);min-height:48px}
  .mobile-bar-btn svg{width:18px;height:18px;flex:0 0 auto}
  .mobile-bar-btn.call{background:var(--surface);color:var(--ink);border:1.5px solid var(--line-2)}
  .mobile-bar-btn.book{background:linear-gradient(135deg,var(--clay),var(--clay-deep));color:#fff}
  body{padding-bottom:5.2rem}
}

/* ===== v9: review fixes (mobile sizing) ===== */
@media (max-width:760px){.approach-art img{max-width:440px;margin-inline:auto;display:block}}
@media (max-width:600px){.svc-feature{min-height:300px}}