/* Scroll motion layer (inspired by the reference video). Additive only — layout & colors unchanged.
   Everything is visible without JS; html.motion is set by motion.js unless reduced motion is requested. */
@keyframes mRise{from{opacity:0;transform:translateY(42px)}to{opacity:1;transform:none}}
@keyframes mClip{from{clip-path:inset(0 0 100% 0);transform:translateY(38px)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes mFade{from{opacity:0}to{opacity:1}}

/* stronger, staggered reveal */
html.motion .reveal.in{animation:mRise .95s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--d,0s)}

/* hero entrance: headline wipes up, then role/lead/actions follow */
html.motion .hero h1,html.motion .hero-text h1{animation:mClip 1.1s cubic-bezier(.16,1,.3,1) both .05s}
html.motion .hero-text .hello,html.motion .hero .badge{animation:mRise .8s cubic-bezier(.16,1,.3,1) both}
html.motion .hero-text .role{animation:mRise .9s cubic-bezier(.16,1,.3,1) both .18s}
html.motion .hero-text .lead,html.motion .hero .lead{animation:mRise .9s cubic-bezier(.16,1,.3,1) both .28s}
html.motion .hero-cta{animation:mRise .9s cubic-bezier(.16,1,.3,1) both .38s}
html.motion .hero-audit-wrap{animation:mRise 1s cubic-bezier(.16,1,.3,1) both .5s}
html.motion .hero-points>*{animation:mRise .8s cubic-bezier(.16,1,.3,1) both}
html.motion .hero-points>*:nth-child(1){animation-delay:.45s}html.motion .hero-points>*:nth-child(2){animation-delay:.55s}html.motion .hero-points>*:nth-child(3){animation-delay:.65s}

/* section titles wipe in with their block */
html.motion .sec-head.reveal.in h2{animation:mClip 1s cubic-bezier(.16,1,.3,1) both .08s}
html.motion .eyebrow::before{transform:scaleX(0);transform-origin:right;transition:transform 1s cubic-bezier(.16,1,.3,1) .15s}
html.motion .reveal.in .eyebrow::before,html.motion .eyebrow.in::before{transform:scaleX(1)}

/* grids & lists: children cascade in one after another */
html.motion .grid-3.reveal.in,html.motion .cases.reveal.in,html.motion .faq-list.reveal.in,html.motion .info-list.in{animation:none}
html.motion .grid-3.reveal.in>*,html.motion .cases.reveal.in>*,html.motion .faq-list.reveal.in>*,html.motion .info-list.in>*{animation:mRise .9s cubic-bezier(.16,1,.3,1) both}
html.motion .grid-3.reveal.in>*:nth-child(1),html.motion .cases.reveal.in>*:nth-child(1),html.motion .faq-list.reveal.in>*:nth-child(1){animation-delay:0s}
html.motion .grid-3.reveal.in>*:nth-child(2),html.motion .cases.reveal.in>*:nth-child(2),html.motion .faq-list.reveal.in>*:nth-child(2){animation-delay:.07s}
html.motion .grid-3.reveal.in>*:nth-child(3),html.motion .cases.reveal.in>*:nth-child(3),html.motion .faq-list.reveal.in>*:nth-child(3){animation-delay:.14s}
html.motion .grid-3.reveal.in>*:nth-child(4),html.motion .cases.reveal.in>*:nth-child(4),html.motion .faq-list.reveal.in>*:nth-child(4){animation-delay:.21s}
html.motion .grid-3.reveal.in>*:nth-child(5),html.motion .faq-list.reveal.in>*:nth-child(5){animation-delay:.28s}
html.motion .grid-3.reveal.in>*:nth-child(6),html.motion .faq-list.reveal.in>*:nth-child(6){animation-delay:.35s}
html.motion .grid-3.reveal.in>*:nth-child(7),html.motion .faq-list.reveal.in>*:nth-child(7){animation-delay:.42s}
html.motion .grid-3.reveal.in>*:nth-child(8),html.motion .faq-list.reveal.in>*:nth-child(8){animation-delay:.49s}
html.motion .faq-list.reveal.in>*:nth-child(9){animation-delay:.56s}html.motion .faq-list.reveal.in>*:nth-child(10){animation-delay:.63s}

/* process rows: a line draws across the top as each step arrives */
html.motion .step{position:relative}
html.motion .step::after{content:"";position:absolute;inset-inline:18px;top:-1px;height:2px;border-radius:2px;background:hsl(var(--primary));transform:scaleX(0);transform-origin:right;transition:transform 1.1s cubic-bezier(.16,1,.3,1) calc(var(--d,0s) + .2s);opacity:.55}
html.motion .step.in::after{transform:scaleX(1)}

/* big blocks rise & settle while scrolling (transform driven by motion.js) */
.m-panel{will-change:transform;transform-origin:50% 0}

/* numbers keep their width while counting */
[data-count]{font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion:reduce){
  html.motion *{animation:none!important;transition:none!important}
  .m-panel{transform:none!important}
}