/* about.css — About / Shiva Rea. Mirrors the home design language on top of
   shared.css. Light (--bone) body sections; dark hero, films & closing.
   Brand accent = favicon gradient (amber->copper) via .gx (shared.css). */

.wrap--narrow{max-width:960px}
.br-d{display:inline}

/* snappy reveal (override shared.css's slower .6s/26px) */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* brand accent (amber) on the light sections (kickers, labels) */
.ab-head .kicker,.ab-path__stamp,.ab-path__creator-label,.ab-defs b,.ab-rootsA__also,.ab-quote__kick,.ab-quote__cite{color:var(--gold)}
.ab-quote__cite span{color:rgba(58,42,30,.55)}

/* shared section header — light sections (ink) */
.ab-head{text-align:center;margin-bottom:clamp(2.2rem,5vh,3.6rem)}
.ab-head__h{font-family:"Cinzel",serif;font-weight:500;color:var(--ink);font-size:clamp(1.7rem,3.6vw,2.7rem);line-height:1.18;margin-top:.7rem}
.ab-head__sub{font-weight:300;font-size:clamp(.92rem,1.4vw,1.04rem);color:rgba(58,42,30,.72);margin-top:.85rem;letter-spacing:.03em;max-width:54ch;margin-inline:auto}

/* ============ HERO (dark — all text white, accent word gradient) ============ */
.ab-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--black);color:#fff}
.ab-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ab-hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,7,11,.46) 0%,rgba(8,7,11,.22) 40%,rgba(8,7,11,.4) 72%,rgba(8,7,11,.72) 100%)}
.ab-hero__in{position:relative;z-index:2;text-align:center;max-width:62rem;padding-top:12vh;padding-bottom:12vh}
.ab-hero__kick{color:#fff;margin-bottom:1.1rem;text-shadow:0 1px 12px rgba(0,0,0,.6);     font-weight: 600;}
.ab-hero__h{font-family:"Cinzel Decorative",serif;font-weight:700;font-size:clamp(2.5rem,6.4vw,4.8rem);line-height:1.04;color:#fff;text-shadow:0 2px 26px rgba(0,0,0,.5),0 1px 5px rgba(0,0,0,.4)}
.ab-hero__h em{font-style:normal}
.ab-hero__tag{margin:1.4rem auto 0;max-width:42rem;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.18rem,2.1vw,1.65rem);line-height:1.5;color:#fff;text-shadow:0 1px 16px rgba(0,0,0,.6)}
.ab-hero__cta{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:2.1rem}
.ab-hero__cue{position:absolute;left:50%;bottom:2.4%;transform:translateX(-50%);z-index:2;color:#fff;opacity:.85}
.ab-hero__cue svg{width:32px;height:auto;animation:ab-bob 2.3s linear infinite}
@keyframes ab-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

/* ============ A LETTER FROM SHIVA (light) ============ */
.ab-letter{background:var(--bone);color:var(--ink);padding:clamp(5rem,13vh,9rem) 0}
.ab-letter__body{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1.2rem,2.1vw,1.6rem);line-height:1.6;color:rgba(58,42,30,.92);text-align:center}
.ab-letter__body p{margin-bottom:1em}
.ab-letter__pillars{list-style:none;margin:clamp(2.4rem,6vh,4rem) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 2.4rem}
.ab-letter__pillars li{border-top:1px solid rgba(233,170,54,.4);padding-top:1rem}
.ab-letter__tag{display:block;font-family:"Julius Sans One",sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:.66rem;color:var(--gold);margin-bottom:.55rem}
.ab-letter__pillars p{font-weight:300;font-size:.96rem;line-height:1.55;color:rgba(58,42,30,.74)}
.ab-letter__sign{text-align:center;margin-top:clamp(2.4rem,6vh,3.6rem)}
.ab-letter__valed{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.1rem,1.8vw,1.4rem);color:rgba(58,42,30,.78);line-height:1.5;margin-bottom:.4rem}
.ab-letter__sign img{display:block;width:clamp(150px,18vw,210px);height:auto;margin:.4em auto 0}

/* ============ IMAGE BAND (dark image punctuation) ============ */
.ab-band{position:relative;display:grid;place-items:center;min-height:clamp(360px,54vh,560px);overflow:hidden;text-align:center;padding:2rem var(--pad)}
.ab-band__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ab-band__veil{position:absolute;inset:0;background:radial-gradient(120% 100% at 50% 50%,rgba(8,7,11,.32),rgba(8,7,11,.62))}
.ab-band__quote{position:relative;z-index:1;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.45rem,3.4vw,2.5rem);line-height:1.3;color:#fff;max-width:20ch;text-shadow:0 1px 18px rgba(0,0,0,.6)}

/* ============ THE PATH / BIO (light) ============ */
.ab-path{position:relative;background:var(--bone);color:var(--ink);padding:clamp(4rem,11vh,8rem) 0}
.ab-path__split{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;max-width:1180px;margin-inline:auto}
.ab-path__stamp{font-family:"Julius Sans One",sans-serif;font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;margin-bottom:1.4rem}
.ab-path__h{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(1.85rem,3.6vw,2.85rem);line-height:1.14;color:var(--ink)}
.ab-path__h em{font-style:italic;color:#E9AA36}
.ab-path__lede{margin-top:1.25rem;font-weight:300;font-size:clamp(1.02rem,1.5vw,1.18rem);line-height:1.65;color:rgba(58,42,30,.82);max-width:54ch}
.ab-path__creator-label{margin-top:1.9rem;font-family:"Julius Sans One",sans-serif;text-transform:uppercase;letter-spacing:.24em;font-size:.66rem}
.ab-path__creator{list-style:none;display:flex;flex-wrap:wrap;gap:.55rem;margin:.95rem 0 0;padding:0}
.ab-path__creator li{font-family:"Julius Sans One",sans-serif;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(58,42,30,.78);border:1px solid rgba(58,42,30,.2);border-radius:999px;padding:.5em .95em;background:rgba(255,255,255,.55)}
.ab-path__media{margin:0;position:relative}
.ab-path__media img{width:100%;height:auto;border-radius:20px;box-shadow:0 36px 84px -32px rgba(0,0,0,.5)}
.ab-path__creds{display:flex;gap:1.1rem;align-items:center;justify-content:center;margin-top:1.4rem}
.ab-path__creds img{width:74px;height:74px;filter:brightness(0) saturate(100%);opacity:.42}

/* ============ ROOTS — version A (old shivarea about, verbatim) ============ */
.ab-rootsA{background:var(--cream);color:var(--ink);padding:clamp(4.5rem,12vh,8rem) 0;text-align:center}
.ab-rootsA__intro{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.2rem,2.2vw,1.6rem);color:rgba(58,42,30,.78);margin-bottom:clamp(1.8rem,4vh,2.6rem)}
.ab-defs{list-style:none;margin:0 auto clamp(1.8rem,4vh,2.6rem);padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem 2.4rem;max-width:780px}
.ab-defs li{max-width:18rem}
.ab-defs b{display:block;font-family:"Cinzel Decorative",serif;font-weight:400;font-size:1.3rem;margin-bottom:.3rem}
.ab-defs span{font-weight:300;font-size:.92rem;line-height:1.5;color:rgba(58,42,30,.72)}
.ab-rootsA__p{font-weight:300;font-size:clamp(1rem,1.45vw,1.14rem);line-height:1.7;color:rgba(58,42,30,.8);max-width:60ch;margin:0 auto}
.ab-rootsA__also{font-family:"Julius Sans One",sans-serif;text-transform:uppercase;letter-spacing:.24em;font-size:.7rem;margin:clamp(2rem,5vh,3rem) 0 1.2rem}
.ab-poem{list-style:none;margin:0 auto;padding:0;max-width:54ch;display:flex;flex-direction:column;gap:.55rem}
.ab-poem li{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.05rem,1.7vw,1.3rem);line-height:1.4;color:rgba(58,42,30,.82)}

/* ============ TESTIMONIAL · Sally Kempton — light ============ */
.ab-quote{background:var(--bone);color:var(--ink);padding:clamp(5rem,13vh,9rem) 0}
.ab-quote__in{text-align:center}
.ab-quote__kick{margin-bottom:.7rem}
.ab-quote__h{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.18;color:var(--ink);margin-bottom:clamp(1.8rem,4.5vh,2.6rem)}
.ab-quote__q{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.28rem,2.5vw,2rem);line-height:1.5;color:rgba(58,42,30,.92);max-width:30em;margin:0 auto}
.ab-quote__q p{margin-bottom:.85em}
.ab-quote__cite{display:block;margin-top:2rem;font-family:"Cinzel",serif;font-weight:500;font-size:clamp(1.05rem,1.7vw,1.3rem);font-style:normal}
.ab-quote__cite span{display:block;margin-top:.6rem;font-family:"Julius Sans One",sans-serif;font-weight:400;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase}
.ab-quote__cite em{font-style:italic}

/* ============ TEND THE FIRE · full-bleed film band (compact) ============ */
.ab-tend{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--black);padding:clamp(7rem,20vh,13rem) 0}
.ab-tend__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ab-tend__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,7,11,.5),rgba(8,7,11,.4) 50%,rgba(8,7,11,.6) 100%)}
.ab-tend__in{position:relative;z-index:2;text-align:center;color:#fff;max-width:54rem}
.ab-tend__h{font-family:"Cinzel",serif;font-weight:500;font-size:clamp(1.9rem,4vw,3.2rem);line-height:1.22;text-shadow:0 1px 16px rgba(0,0,0,.55)}
.ab-tend__cta{margin-top:1.8rem}

/* ============ CLOSING CTA (dark) ============ */
.ab-final{position:relative;min-height:88vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--black)}
.ab-final__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ab-final__veil{position:absolute;inset:0;background:linear-gradient(180deg,var(--black) 0%,rgba(8,7,11,.7) 16%,rgba(8,7,11,.42) 42%,rgba(8,7,11,.72) 74%,#08070b 100%)}
.ab-final__in{position:relative;z-index:2;text-align:center;color:#fff;padding-top:10vh;padding-bottom:10vh}
.ab-final__logo{margin:0 auto 12px;filter:drop-shadow(0 2px 10px rgba(0,0,0,.5))}
.ab-final .kicker{color:rgba(255, 255, 255, 0.92);font-weight:600;font-size:.8rem;letter-spacing:.3em;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.ab-final__h{font-family:"Cinzel Decorative",serif;font-weight:700;font-size:clamp(2.1rem,5.4vw,4rem);line-height:1.1;margin-top:1rem;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.ab-final__sub{margin-top:1.1rem;font-weight:300;font-size:clamp(.95rem,1.5vw,1.12rem);letter-spacing:.04em;color:rgba(255,255,255,.92);text-shadow:0 1px 12px rgba(0,0,0,.5)}
.ab-final__cta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:2rem}

/* curve divider (light testimonial -> dark closing) */
.ab-curve{line-height:0;margin-top:-1px;margin-bottom:-1px;background:#08070b}
.ab-curve svg{display:block;width:100%;height:clamp(66px,7.6vw,120px)}

/* ============ responsive ============ */
@media (max-width:880px){
  .ab-path__split{grid-template-columns:1fr;gap:2.4rem}
  .ab-path__media{order:-1;max-width:420px;margin-inline:auto}
}
@media (max-width:620px){
  .ab-letter__pillars{grid-template-columns:1fr;gap:1.3rem}
}
@media (prefers-reduced-motion:reduce){ .ab-hero__cue svg{animation:none} }
