/* Motion system (/assets/motion.js): what waits hidden for its reveal, the word masks, and the hand-over from the page's older entrance effects */
html.has-motion :is(#why h2,#howh,section.end h2,[data-reveal]){visibility:hidden}
html.has-motion :is(#why .lead,#process .lead,section.end p,section.end .cta){visibility:hidden}
.mm{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.mw{display:inline-block}
/* the benefits and the steps had their own fade-ins; the motion system now owns their entrance */
html.has-motion #why .gl .slot .card{opacity:1;transition:none}
html.has-motion #process .road .ti{opacity:1;transform:none;transition:none}
/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
/* the review switch sits bottom left */
.vs.vsm{left:16px;right:auto;transform:none;bottom:16px}
.vs.vsm button.on{background:#C21F2E}
@media (max-width:900px){.vs.vsm{bottom:66px}}

/* the first screen, animated by the browser itself so nothing waits for a download: the headline word by word, then the copy and the
   button, then the four partner cards rise (no fade on the cards: they are glass, and fading glass makes its blur switch on with a jump) */
@keyframes inWord{from{transform:translateY(110%);opacity:0}to{transform:none;opacity:1}}
@keyframes inUp{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@keyframes inRise{from{transform:translateY(40px)}to{transform:none}}
@keyframes inFade{from{opacity:0}to{opacity:1}}
html.intro #h1 .mw{animation:inWord 1s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.1s + var(--i,0) * 70ms)}
html.intro #scan .sub{animation:inUp .9s cubic-bezier(.22,1,.36,1) .55s both}
html.intro #scan .row{animation:inUp .9s cubic-bezier(.22,1,.36,1) .68s both}
@media (prefers-reduced-motion:reduce){html.intro *{animation:none!important}}
