/* =========================================================
   ANIM — opt-in animation utilities (Cave Spring Baptist)
   ---------------------------------------------------------
   Nothing here selects broad tags: an element animates ONLY
   if you tag it AND the trigger script accepts it (adding .aa).
   Existing custom transitions are never touched.

   USAGE
     Text (masked, staggered, blur-to-focus):
       <h2 class="anim-text">Buttery smooth heading</h2>
       <p  class="anim-text" data-anim-split="line">Longer copy…</p>
     Blocks:
       <div class="anim-fade-up">…</div>
     Cards / image containers (scale 0.95 → 1 + fade):
       <article class="anim-card">
         …
         <span class="anim-pop">badge</span>   ← springs in after the card,
         <span class="anim-pop">pill</span>       auto-staggered
       </article>
     Hovers (pure CSS, use anywhere):
       .anim-hover-press  → tactile scale-down to .98
       .anim-hover-lift   → smooth shadow expansion + 3px lift
     Modifiers:
       data-anim-delay=".15"    extra delay (s) — text/blocks/cards
       data-anim-stagger=".08"  per-word/line step (text only)
     Exclusions:
       .custom-transition / [data-anim-off] on the element OR any
       ancestor = hard skip. [data-reveal] elements are refused too,
       so this can never double-fire with the site's other systems.
   ========================================================= */

:root{
  /* the feel — extended deceleration + a soft spring for pops */
  --ae-out:cubic-bezier(0.16, 1, 0.3, 1);        /* easeOutExpo-ish  */
  --ae-spring:cubic-bezier(0.34, 1.56, 0.64, 1); /* subtle overshoot */
  --ad-fast:.45s;
  --ad-base:.8s;
  --ad-slow:1.1s;
  --anim-stagger:.05s;
}

/* ── text reveal: words/lines mask in from the bottom, blur → focus ──
   anim.js wraps each unit as <span class="aw"><span class="aw__in">…  */
.anim-text .aw{display:inline-block;overflow:clip;vertical-align:top;padding-block:.08em;margin-block:-.08em}
.anim-text.is-split .aw__in{display:inline-block;transform:translateY(115%);filter:blur(4px);opacity:0;will-change:transform,filter,opacity}
.anim-text.is-split.is-in .aw__in{
  transform:none;filter:blur(0);opacity:1;
  transition:
    transform var(--ad-base) var(--ae-out),
    filter    var(--ad-base) var(--ae-out),
    opacity   var(--ad-fast) ease-out;
  transition-delay:calc(var(--ad0,0s) + var(--i,0) * var(--st,var(--anim-stagger)));
}

/* ── block primitive: fade up ── */
.anim-fade-up.aa{opacity:0;transform:translateY(26px);will-change:transform,opacity}
.anim-fade-up.aa.is-in{
  opacity:1;transform:none;
  transition:transform var(--ad-base) var(--ae-out),opacity var(--ad-fast) ease-out;
  transition-delay:var(--ad0,0s);
}

/* ── cards & image containers: gentle scale-up + fade ── */
.anim-card.aa{opacity:0;transform:scale(.95);will-change:transform,opacity}
.anim-card.aa.is-in{
  opacity:1;transform:none;
  transition:transform var(--ad-slow) var(--ae-out),opacity var(--ad-base) ease-out;
  transition-delay:var(--ad0,0s);
}

/* ── inner badges / pills / icons: delayed spring pop ──
   Inside an .anim-card they fire off the card's arrival;
   standalone they observe on their own. */
.anim-pop.aa{opacity:0;transform:scale(.4);will-change:transform,opacity}
.anim-card.aa.is-in .anim-pop.aa,
.anim-pop.aa.is-in{
  opacity:1;transform:none;
  transition:transform .55s var(--ae-spring),opacity .25s ease-out;
  transition-delay:calc(var(--ad0,0s) + .28s + var(--i,0) * .07s);
}

/* ── hovers: minimal, tactile (pure CSS — no arming needed) ── */
.anim-hover-press{transition:transform .35s var(--ae-out)}
.anim-hover-press:hover{transform:scale(.98)}
.anim-hover-press:active{transform:scale(.962);transition-duration:.12s}
.anim-hover-lift{transition:transform .45s var(--ae-out),box-shadow .45s var(--ae-out)}
.anim-hover-lift:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(13,37,65,.16)}

/* ── calm mode: everything lands instantly, hovers stop moving ── */
@media(prefers-reduced-motion:reduce){
  .anim-text .aw__in,.anim-fade-up,.anim-card,.anim-pop{transform:none !important;filter:none !important;opacity:1 !important;transition:none !important}
  .anim-hover-press:hover,.anim-hover-press:active,.anim-hover-lift:hover{transform:none}
}