/* MARSA shared animation layer — loaded on every page except index (which inlines its own).
   High-specificity `html body` selectors so premium easing overrides any page's inline .reveal
   regardless of source order. Hiding is gated on html.anim-ready so content is never stuck
   invisible if JS fails to run. */

/* scroll reveal — premium easing, standardized site-wide */
html.anim-ready body .reveal{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}
html.anim-ready body .reveal.in{opacity:1;transform:none}
/* optional stagger: data-d="1..6" on a .reveal */
html.anim-ready body .reveal[data-d="1"]{transition-delay:.08s}
html.anim-ready body .reveal[data-d="2"]{transition-delay:.16s}
html.anim-ready body .reveal[data-d="3"]{transition-delay:.24s}
html.anim-ready body .reveal[data-d="4"]{transition-delay:.32s}
html.anim-ready body .reveal[data-d="5"]{transition-delay:.4s}
html.anim-ready body .reveal[data-d="6"]{transition-delay:.48s}

/* hero staggered entrance — add .hero-stage to the hero's H1-containing column */
.hero-stage>*{animation:msHeroRise .9s cubic-bezier(.22,1,.36,1) both}
.hero-stage>*:nth-child(1){animation-delay:.05s}
.hero-stage>*:nth-child(2){animation-delay:.16s}
.hero-stage>*:nth-child(3){animation-delay:.27s}
.hero-stage>*:nth-child(4){animation-delay:.38s}
.hero-stage>*:nth-child(5){animation-delay:.49s}
.hero-stage>*:nth-child(6){animation-delay:.6s}
.hero-stage>*:nth-child(7){animation-delay:.71s}
@keyframes msHeroRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* ambient glow breathing — add .hero-glow to a soft radial-gradient layer */
.hero-glow{animation:msGlow 9s ease-in-out infinite;will-change:opacity,transform}
@keyframes msGlow{0%,100%{opacity:.45;transform:scale(1)}50%{opacity:.9;transform:scale(1.1)}}

/* CTA light-sweep — add .anim-cta to a button/link */
.anim-cta{position:relative;overflow:hidden}
.anim-cta::after{content:"";position:absolute;top:0;left:-80%;width:45%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);opacity:0;pointer-events:none}
.anim-cta:hover::after{animation:msBtnShine .75s ease}
@keyframes msBtnShine{0%{left:-80%;opacity:1}100%{left:140%;opacity:1}}

/* stat count-up target */
.stat-num{font-variant-numeric:tabular-nums}

/* meaning-matched icon motion for benefit/feel cards */
.fx-draw{stroke-dasharray:100;stroke-dashoffset:100}
.in .fx-draw,.reveal.in .fx-draw,.fx-draw.go{animation:msDraw 1.1s cubic-bezier(.16,1,.3,1) forwards}
@keyframes msDraw{to{stroke-dashoffset:0}}
.fx-pulse{transform-box:fill-box;transform-origin:center;animation:msPulse 3.6s ease-in-out infinite}
@keyframes msPulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.14);opacity:1}}
.fx-flash{animation:msFlash 3.8s ease-in-out infinite}
@keyframes msFlash{0%,70%,100%{filter:none;opacity:.92}75%{filter:drop-shadow(0 0 7px rgba(62,207,142,.95));opacity:1}79%{opacity:.5}83%{filter:drop-shadow(0 0 5px rgba(62,207,142,.8));opacity:1}}
.fx-sweep{transform-box:view-box;transform-origin:12px 12px;animation:msSweep 6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes msSweep{to{transform:rotate(360deg)}}
.fx-glow{animation:msIcoGlow 4.4s ease-in-out infinite}
@keyframes msIcoGlow{0%,100%{box-shadow:0 0 0 0 rgba(62,207,142,0)}50%{box-shadow:0 0 0 1px rgba(62,207,142,.16),0 0 15px -3px rgba(62,207,142,.3)}}

/* soft lift on hover — add .anim-lift to a card */
.anim-lift{transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s,border-color .35s;will-change:transform}
.anim-lift:hover{transform:translateY(-3px)}

@media(prefers-reduced-motion:reduce){
  html.anim-ready body .reveal{opacity:1;transform:none;transition:none}
  .hero-stage>*{animation:none;opacity:1;transform:none}
  .hero-glow,.fx-draw,.fx-pulse,.fx-flash,.fx-sweep,.fx-glow{animation:none}
  .fx-draw{stroke-dashoffset:0}
  .anim-cta::after{display:none}
}

