/* activism-seva.css — /activism-seva. Static image hero (no slider); the intro
   hub, the tile/popup grid and the closing reuse prana-vinyasa.css +
   teacher-training.css. Only the hero + a couple of tweaks live here. */

/* ============ HERO (static seva image, full height like /about) ============ */
.as-hero{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--black);color:#fff}
.as-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.as-hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,7,11,.5) 0%,rgba(8,7,11,.26) 42%,rgba(8,7,11,.44) 72%,rgba(8,7,11,.76) 100%)}
.as-hero__in{position:relative;z-index:2;text-align:center;max-width:62rem;padding:12vh var(--pad)}
.as-hero__kick{color:#fff;font-weight:600;margin-bottom:1.05rem;text-shadow:0 1px 12px rgba(0,0,0,.55)}
.as-hero__h{font-family:"Cinzel Decorative",serif;font-weight:700;font-size:clamp(2.6rem,7vw,5rem);line-height:1.05;color:#fff;text-shadow:0 2px 26px rgba(0,0,0,.5)}
.as-hero__tag{margin:1.35rem auto 0;max-width:42rem;font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.18rem,2.1vw,1.62rem);line-height:1.5;color:#fff;text-shadow:0 1px 16px rgba(0,0,0,.6)}
.as-hero__cta{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:2rem}
.as-hero__cue{position:absolute;left:50%;bottom:2.6%;transform:translateX(-50%);z-index:2;color:#fff;opacity:.85}
.as-hero__cue svg{width:32px;height:auto;animation:as-bob 2.3s linear infinite}
@keyframes as-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

/* intro block (ABOVE the squares): Buddha quote + mantra + diamond */
.pv-about--intro{padding-bottom:clamp(1rem,2.6vh,1.9rem)}
.as-mantra{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1.1rem,1.9vw,1.45rem);line-height:1.5;color:rgba(58,42,30,.78);margin:clamp(1.3rem,3.2vh,2rem) auto 0;max-width:36ch}

/* heading + description block (BELOW the squares) */
body.as .tt-programs--pv{padding-bottom:clamp(1.5rem,4vh,3rem)}
.pv-about--btm{padding-top:clamp(1.6rem,4vh,2.8rem)}

/* tile sub-titles are short context lines here — keep them subtle */
.tt-programs--pv .tt-card__sub{text-transform:none}

/* the popup bodies carry rich activism copy (h4 sections, lists, donate links) */
.tt-modal__body h4{font-family:"Julius Sans One",sans-serif;text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;color:var(--gold);margin:1.8rem 0 .5rem}
.tt-modal__body ul{margin:.4rem 0 1rem;padding-left:1.2rem}
.tt-modal__body li{margin:.2rem 0;line-height:1.5}

@media (prefers-reduced-motion:reduce){.as-hero__cue svg{animation:none}}
