/* ==========================================================
   animations.css — scroll reveals, keyframes, reduced motion
   Reveal states only apply when JS is running (html.js)
   ========================================================== */
.js [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal="left"]{transform:translateX(-44px)}
.js [data-reveal="right"]{transform:translateX(44px)}
.js [data-reveal="scale"]{transform:scale(.94)}
.js [data-reveal="fade"]{transform:none}
.js [data-reveal="img"]{opacity:1;transform:none}
.js [data-reveal="img"] img{clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--ease)}
.js [data-reveal].in{opacity:1;transform:none}
.js [data-reveal="img"].in img{clip-path:inset(0 0 0 0)}
.line{display:block;overflow:hidden;padding-bottom:.08em}
.line>span{display:block;transform:translateY(110%);animation:rise 1.1s var(--ease) forwards;animation-delay:calc(.25s + var(--i,0)*.14s)}
.hero .eyebrow,.hero .lead,.hero__actions,.scroll-cue{opacity:0;animation:fadeUp .9s var(--ease) forwards}
.hero .eyebrow{animation-delay:.1s}.hero .lead{animation-delay:.7s}.hero__actions{animation-delay:.9s}.scroll-cue{animation:fadeIn 1s 1.4s forwards}
@keyframes rise{to{transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes fadeIn{to{opacity:1}}
@keyframes kenburns{from{transform:scale(1.02)}to{transform:scale(1.12) translate(-1.5%,1%)}}
@keyframes floatUp{0%{opacity:0;transform:translateY(0)}15%{opacity:.7}100%{opacity:0;transform:translateY(-70vh) translateX(30px)}}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@keyframes dash{to{stroke-dashoffset:-260}}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(1.9);opacity:0}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js [data-reveal]{opacity:1;transform:none}.js [data-reveal="img"] img{clip-path:none}
  .line>span,.hero .eyebrow,.hero .lead,.hero__actions,.scroll-cue{opacity:1;transform:none}
  
}

/* Hero slider text transitions (replace one-time load animation) */
.hero .slide .line>span{animation:none;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.hero .slide.is-active .line>span{transform:none;transition-delay:calc(.35s + var(--i,0)*.14s)}
.hero .slide .eyebrow,.hero .slide .lead,.hero .slide .hero__actions{animation:none;opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.hero .slide.is-active .eyebrow{opacity:1;transform:none;transition-delay:.2s}
.hero .slide.is-active .lead{opacity:1;transform:none;transition-delay:.75s}
.hero .slide.is-active .hero__actions{opacity:1;transform:none;transition-delay:.95s}
@keyframes fill{to{width:100%}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@media (prefers-reduced-motion:reduce){
  .hero .slide .line>span,.hero .slide .eyebrow,.hero .slide .lead,.hero .slide .hero__actions{transform:none;opacity:1}
  .hero .slide:not(.is-active) .line>span,.hero .slide:not(.is-active) .eyebrow,.hero .slide:not(.is-active) .lead,.hero .slide:not(.is-active) .hero__actions{opacity:0}
}

@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker{overflow-x:auto}.ticker__track{animation:none}.ticker__list[aria-hidden="true"]{display:none}.ticker::before,.ticker::after{display:none}}

/* Slide crossfade stays on for reduced-motion users (opacity only, no movement) so the slider still advances visibly */
@media (prefers-reduced-motion:reduce){.hero .slide{transition-duration:1.2s,0s!important}}