/* ==========================================================================
   Estados iniciais das animações.
   Só valem com html.js-motion, que o boot.js liga quando há JS e a pessoa
   não pediu movimento reduzido. Sem essa classe, tudo aparece parado e
   completo. O motion.js leva cada elemento do estado daqui até o final.
   ========================================================================== */

/* revelação genérica ao entrar na tela */
.js-motion [data-reveal]:not(.is-in){ opacity:0; transform:translate3d(0, 32px, 0); }

/* hero: some até a timeline de entrada começar (evita piscar) */
.js-motion [data-hero]{ opacity:0; }
.js-motion .hero-home h1{ opacity:0; }
.js-motion .hero-home h1.is-split{ opacity:1; }
.line-mask{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.line-mask > span{ display:inline-block; will-change:transform; }

/* celular do hero: estado antes do fluxo de agendamento */
.js-motion .phone{ opacity:0; }
.js-motion [data-chip]{ opacity:0; }
.js-motion .notif{ opacity:0; }

/* antes e depois: passos entram pela timeline */
.js-motion .ba__step:not(.is-in){ opacity:0; transform:translate3d(0, 24px, 0); }
.ba--pinned{ height:100vh; padding-block:calc(var(--hdr-h) + 8px) 32px; display:flex; align-items:center; }
.ba--pinned > .container{ width:100%; }
.ba--pinned .ba__progress{ display:flex; }

/* como funciona: números apagados até a linha chegar */
.js-motion .how__n{ background:var(--white); color:var(--gray-400); border-color:var(--gray-200); }
.js-motion .how__n.is-lit{ background:var(--navy); color:#fff; border-color:var(--navy); transform:scale(1.06); }
.js-motion .how__line .prg{ stroke-dashoffset:1; }

/* ícones do "por que a GLR": traço se desenha */
.js-motion .why__ico path,
.js-motion .why__ico rect,
.js-motion .why__ico circle,
.js-motion .why__ico line,
.js-motion .why__ico polyline{ stroke-dashoffset:1; }

/* elementos com parallax ganham camada própria */
[data-speed]{ will-change:transform; }

/* Lenis (scroll suave) — regras recomendadas pela biblioteca */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }