/* =========================================================
   Teodoro & Fonseca · teodoroefonseca.com.br  (v2, 07/10/2026)
   Preto, branco e verde elétrico. Letra reta (Geist).
   Nada de dourado nem serifa: isso era a cara do site da Larissa.
   ========================================================= */
:root{
  --preto:#0A0A0A;
  --preto-2:#111111;
  --preto-3:#1A1A1A;
  --branco:#FFFFFF;
  --gelo:#F2F2EE;
  --txt-2:#A3A3A3;
  --txt-3:#737373;
  --verde:#B6FF3B;
  --verde-escuro:#4D7A00;
  --linha:rgba(255,255,255,.10);
  --linha-forte:rgba(255,255,255,.22);
  --verde-linha:rgba(182,255,59,.35);

  --f:'Geist',system-ui,-apple-system,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,Menlo,monospace;

  --gutter:clamp(16px,4vw,64px);
  --raio:16px;
  --ease:cubic-bezier(.16,.86,.28,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--preto);color:var(--branco);font-family:var(--f);font-size:16px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.is-loading{overflow:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.035em}
.verde{color:var(--verde);font-style:normal}
.mono{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.02em}
.skip{position:absolute;left:-999px;top:8px;z-index:1000;background:var(--verde);color:var(--preto);padding:10px 16px;border-radius:8px}
.skip:focus{left:16px}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px;border-radius:4px}
::selection{background:var(--verde);color:var(--preto)}

.kicker{display:inline-flex;align-items:center;gap:8px;color:var(--txt-2);text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;margin-bottom:1.4rem}
.kicker::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--verde)}
h2{font-size:clamp(2.4rem,5.6vw,5.6rem);line-height:.98}
.resposta{color:var(--txt-2);font-size:1.05rem;max-width:36rem;margin:1.4rem 0 0}
.ponto{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 0 rgba(182,255,59,.7);animation:pulso 1.8s infinite}
@keyframes pulso{70%{box-shadow:0 0 0 10px rgba(182,255,59,0)}100%{box-shadow:0 0 0 0 rgba(182,255,59,0)}}
.cursor{display:inline-block;width:2px;height:1.05em;background:var(--verde);vertical-align:-2px;margin-left:2px;animation:pisca 1s steps(1) infinite}
@keyframes pisca{50%{opacity:0}}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;gap:.55em;min-height:48px;padding:.8em 1.5em;border-radius:999px;font-family:var(--f);font-weight:600;font-size:.95rem;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .3s,color .3s,border-color .3s,box-shadow .3s,transform .3s var(--ease)}
.btn-verde{background:var(--verde);color:var(--preto)}
.btn-verde:hover{box-shadow:0 0 0 6px rgba(182,255,59,.18),0 10px 40px -8px rgba(182,255,59,.6)}
.btn-linha{border-color:var(--linha-forte);color:var(--branco);background:rgba(10,10,10,.4);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.btn-linha:hover{border-color:var(--verde);color:var(--verde)}
.btn-sm{min-height:44px;padding:.55em 1.15em;font-size:.85rem}
.seta{transition:transform .3s var(--ease)}
.btn:hover .seta{transform:translate(2px,-2px)}

/* =========================================================
   0. CARREGAMENTO (a evolução)
   ========================================================= */
#loader{position:fixed;inset:0;z-index:999;background:#000;display:grid;grid-template-rows:auto 1fr auto auto;padding:clamp(20px,5vw,56px);color:var(--txt-2);clip-path:inset(0 0 0 0);transition:clip-path .8s var(--ease-io)}
#loader.saiu{clip-path:inset(0 0 100% 0)}
#loader.fim{display:none}
.ld-hello{margin:0;text-align:center;font-size:clamp(1rem,1.6vw,1.25rem);opacity:0;animation:aparece .9s .2s forwards}
.ld-hello b{color:var(--branco);font-weight:600}
.ld-stage{position:relative;align-self:center;width:min(1100px,100%);margin:0 auto;aspect-ratio:16/9;max-height:62vh}
/* preto do vídeo some no preto da tela: blend 'screen' + bordas esfumadas, sem cara de player */
.ld-video{width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .6s;mix-blend-mode:screen;-webkit-mask-image:radial-gradient(ellipse 70% 75% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 70% 75% at 50% 50%,#000 55%,transparent 100%);filter:contrast(1.15) brightness(.95)}
.ld-video.tocando{opacity:1}
.ld-march{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ld-chao{stroke:var(--linha-forte);stroke-width:1;stroke-dasharray:640;stroke-dashoffset:640;animation:traca 1.6s .3s var(--ease) forwards}
.ev{fill:none;stroke:var(--branco);stroke-width:8.5;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.ev circle,.ev .tronco{fill:var(--branco);stroke:none}
.ev .tras{opacity:.45}
.ev .mov{stroke-width:3;opacity:.6}
.ev .tela{stroke:var(--verde);stroke-width:4;filter:drop-shadow(0 0 6px rgba(182,255,59,.9))}
.ev{transform-box:fill-box;animation:anda .7s var(--ease) forwards,esfria .5s forwards}
.ev1{animation-delay:.5s,1.4s}.ev2{animation-delay:1s,1.9s}.ev3{animation-delay:1.5s,2.4s}.ev4{animation-delay:2s,2.9s}.ev5{animation-delay:2.5s,99s}
@keyframes anda{from{opacity:0;translate:-28px 0}to{opacity:1;translate:0 0}}
@keyframes esfria{to{opacity:.25}}
@keyframes traca{to{stroke-dashoffset:0}}
@keyframes aparece{to{opacity:1}}
.ld-final{position:absolute;right:9%;bottom:6%;height:92%;aspect-ratio:3/4;opacity:0;pointer-events:none}
.ld-final img{width:100%;height:100%;object-fit:contain;object-position:bottom}
.ld-note{position:absolute;left:78%;top:52%;width:52%;overflow:visible;fill:none;stroke-linecap:round}
.ld-note .mesa{stroke:var(--txt-2);stroke-width:2;opacity:.6}
.ld-note .note-base{stroke:var(--branco);stroke-width:4}
.ld-note .note-tela{stroke:var(--verde);stroke-width:4.5;filter:drop-shadow(0 0 8px rgba(182,255,59,.95))}
.ld-brilho{position:absolute;left:95%;top:46%;width:40%;height:30%;background:radial-gradient(closest-side,rgba(182,255,59,.45),transparent);filter:blur(10px);opacity:0}
#loader.ultima .ld-final{animation:aparece 1s var(--ease) forwards}
#loader.ultima .ld-brilho{animation:aparece 1.2s .3s forwards}
#loader.ultima .ev5{animation:none;opacity:0;transition:opacity .6s}
#loader.ultima .ev1,#loader.ultima .ev2,#loader.ultima .ev3,#loader.ultima .ev4{animation:none;opacity:.14;transition:opacity .6s}
.ld-foot{display:flex;justify-content:space-between;margin-top:22px}
.ld-etapa b,.ld-pct b{color:var(--verde);font-weight:500}
.ld-pular{background:none;border:1px solid var(--linha-forte);color:var(--txt-2);border-radius:999px;padding:6px 12px;margin-right:12px;cursor:pointer;font-size:.68rem}
.ld-pular:hover{color:var(--verde);border-color:var(--verde)}
.ld-bar{height:1px;background:var(--linha);margin-top:12px}
.ld-bar i{display:block;height:100%;width:0;background:var(--verde);transition:width .25s linear}

/* =========================================================
   CABEÇALHO
   ========================================================= */
.topo{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px var(--gutter);transition:background .4s,padding .4s,border-color .4s;border-bottom:1px solid transparent}
.topo.solido{background:rgba(10,10,10,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding-top:10px;padding-bottom:10px;border-bottom-color:var(--linha)}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none}
.marca-mono{font-weight:700;font-size:.9rem;color:var(--preto);background:var(--verde);width:40px;height:40px;border-radius:10px;display:grid;place-items:center;letter-spacing:-.04em}
.marca-nome{font-weight:600;font-size:1rem;letter-spacing:-.02em}
.menu{display:flex;gap:4px;padding:4px;border:1px solid var(--linha);border-radius:999px;background:rgba(17,17,17,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.menu a{font-size:.85rem;text-decoration:none;color:var(--txt-2);padding:8px 14px;border-radius:999px;transition:color .3s,background .3s}
.menu a:hover{color:var(--branco);background:var(--preto-3)}

/* =========================================================
   1. HERO: a máquina ao vivo
   ========================================================= */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;padding:120px var(--gutter) 150px;overflow:hidden;text-align:center;isolation:isolate}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.08);opacity:.95}
.hero-veu{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 55% at 50% 48%,rgba(10,10,10,.82),rgba(10,10,10,.35) 70%,rgba(10,10,10,.1)),linear-gradient(180deg,rgba(10,10,10,.6),transparent 25%,transparent 70%,var(--preto))}
.hero-centro{position:relative;z-index:2;max-width:1200px}
.h1-kicker{display:inline-flex;align-items:center;gap:10px;color:var(--branco);padding:8px 14px;border:1px solid var(--linha-forte);border-radius:999px;background:rgba(10,10,10,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);margin-bottom:2rem;min-height:36px;font-size:.78rem}
.h1-main{display:block;font-size:clamp(3rem,8.6vw,9.6rem);line-height:.92;letter-spacing:-.055em;font-weight:600}
.h1-main .linha{display:block;overflow:hidden;padding-bottom:.06em}
.h1-main .linha>*{display:inline-block;transform:translateY(105%)}
.pronto .h1-main .linha>*{transform:none;transition:transform 1.2s var(--ease)}
.pronto .h1-main .linha:nth-child(2)>*{transition-delay:.1s}
.hero-sub{max-width:40rem;margin:1.8rem auto 2rem;color:#D4D4D4;font-size:clamp(1rem,1.3vw,1.18rem)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hero-sub,.hero-ctas,.feed,.hero-placar{opacity:0;transform:translateY(24px);transition:opacity 1s .5s,transform 1s .5s var(--ease)}
.pronto .hero-sub,.pronto .hero-ctas,.pronto .feed,.pronto .hero-placar{opacity:1;transform:none}

.vivo{position:absolute;inset:0;z-index:1;pointer-events:none}
.busca-flut{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:rgba(17,17,17,.82);border:1px solid var(--linha-forte);font-size:.85rem;color:var(--branco);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 20px 50px -20px #000;min-width:260px;text-align:left}
.b1{left:6%;top:24%;animation:flutua 7s ease-in-out infinite}
.b2{right:6%;top:58%;animation:flutua 8s 1s ease-in-out infinite}
.lupa{width:14px;height:14px;border:2px solid var(--txt-2);border-radius:50%;position:relative;flex:0 0 auto}
.lupa::after{content:"";position:absolute;width:6px;height:2px;background:var(--txt-2);right:-6px;bottom:-3px;transform:rotate(45deg)}
.seta-cur{position:absolute;display:flex;align-items:flex-start;gap:2px}
.seta-cur svg{width:18px;height:18px}
.seta-cur b{font-size:.72rem;font-weight:600;padding:3px 8px;border-radius:6px;margin-top:12px;white-space:nowrap}
.c1{left:18%;top:68%;animation:passeia1 11s ease-in-out infinite}
.c1 svg{fill:var(--verde)} .c1 b{background:var(--verde);color:var(--preto)}
.c2{right:20%;top:20%;animation:passeia2 13s ease-in-out infinite}
.c2 svg{fill:#7AB8FF} .c2 b{background:#7AB8FF;color:var(--preto)}
.c3{right:12%;top:40%;animation:passeia1 9s 2s ease-in-out infinite reverse}
.c3 svg{fill:#25D366} .c3 b{background:#25D366;color:var(--preto)}
@keyframes flutua{50%{transform:translateY(-14px)}}
@keyframes passeia1{0%,100%{transform:translate(0,0)}33%{transform:translate(60px,-30px)}66%{transform:translate(-30px,20px)}}
@keyframes passeia2{0%,100%{transform:translate(0,0)}50%{transform:translate(-80px,40px)}}

.feed{position:absolute;right:var(--gutter);bottom:28px;z-index:2;width:300px;text-align:left}
.feed-cab{display:flex;align-items:center;gap:8px;color:var(--txt-2);margin-bottom:10px;text-transform:uppercase;letter-spacing:.12em;font-size:.64rem}
.feed ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column-reverse;gap:8px;height:186px;overflow:hidden;mask:linear-gradient(180deg,transparent,#000 40%);-webkit-mask:linear-gradient(180deg,transparent,#000 40%)}
.feed li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(17,17,17,.88);border:1px solid var(--linha);font-size:.82rem;animation:entraFeed .6s var(--ease)}
.feed li i{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-style:normal;background:rgba(182,255,59,.12);color:var(--verde);flex:0 0 auto;font-size:.9rem}
.feed li small{display:block;color:var(--txt-3);font-size:.72rem}
@keyframes entraFeed{from{opacity:0;transform:translateY(16px) scale(.96)}}
.hero-placar{position:absolute;left:var(--gutter);bottom:30px;z-index:2;display:flex;gap:clamp(18px,3vw,44px);text-align:left;flex-wrap:wrap}
.hero-placar div{display:flex;flex-direction:column}
.hero-placar b{font-size:clamp(1.4rem,2.2vw,2rem);font-weight:500;color:var(--verde);letter-spacing:-.02em}
.hero-placar span{font-size:.78rem;color:var(--txt-2)}

/* =========================================================
   2. ENGRENAGEM (vídeo quadro a quadro + 4 quadrantes)
   ========================================================= */
.engrenagem{position:relative}
.eng-pin{position:relative;height:100vh;height:100svh;overflow:hidden;background:#000}
#gear{position:absolute;inset:0;width:100%;height:100%}
.eng-veu{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.7));pointer-events:none}
.eng-cruz i{position:absolute;background:var(--verde-linha)}
.eng-cruz .h{left:0;right:0;top:50%;height:1px;transform:scaleX(var(--cruz,0))}
.eng-cruz .v{top:0;bottom:0;left:50%;width:1px;transform:scaleY(var(--cruz,0))}
.eng-medidas span{position:absolute;color:var(--txt-3);opacity:var(--cruz,0);font-size:.66rem}
.eng-medidas .m1{left:calc(50% + 12px);top:calc(50% - 24px)}
.eng-medidas .m2{right:var(--gutter);top:calc(50% + 10px)}
.eng-medidas .m3{left:var(--gutter);top:calc(50% + 10px)}
.eng-medidas .m4{left:calc(50% + 12px);bottom:24px}
.eng-intro{position:absolute;left:var(--gutter);bottom:12vh;max-width:min(760px,88vw);z-index:3}
.eng-intro h2{font-size:clamp(2.4rem,5.4vw,5.4rem)}
.eng-quad{list-style:none;margin:0;padding:0;position:absolute;inset:0;z-index:3;pointer-events:none}
.q{position:absolute;width:min(26vw,320px);opacity:0;text-shadow:0 2px 18px #000,0 0 2px #000}
.q figure{margin:0 0 14px;width:min(100%,230px);aspect-ratio:4/3;border-radius:12px;overflow:hidden;border:1px solid var(--linha);opacity:0;transform:scale(.94);transition:opacity .5s,transform .6s var(--ease)}
.q figure img{width:100%;height:100%;object-fit:cover}
.q.ativo figure{opacity:1;transform:none;border-color:var(--verde-linha)}
.q span{color:var(--verde);display:block;margin-bottom:.4rem}
.q h3{font-size:clamp(1.4rem,2.2vw,2.1rem);line-height:1.05;margin-bottom:.5rem}
.q p{margin:0;color:var(--txt-3);font-size:.9rem;transition:color .4s}
.q.ativo p{color:#D4D4D4}
.q1{left:var(--gutter);top:12%}
.q2{right:var(--gutter);top:12%;text-align:right}
.q3{left:var(--gutter);bottom:7%}
.q4{right:var(--gutter);bottom:7%;text-align:right}
.q1 figure,.q3 figure{transform-origin:left}
.q2 figure,.q4 figure{transform-origin:right;margin-left:auto}
.q3 figure,.q4 figure{margin-bottom:14px}
.eng-desc{display:none}

/* =========================================================
   3. NÚMEROS
   ========================================================= */
.numeros{padding:clamp(100px,16vh,180px) var(--gutter);background:var(--preto)}
.num-cab{max-width:62rem}
.num-grade{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(48px,8vh,90px)}
.num{display:flex;flex-direction:column;padding:28px 24px;border:1px solid var(--linha);border-radius:var(--raio);background:linear-gradient(180deg,var(--preto-2),var(--preto));position:relative;overflow:hidden}
.num::after{content:"";position:absolute;left:0;top:0;height:2px;width:0;background:var(--verde);transition:width 1.8s var(--ease)}
.num.rv-ok::after{width:100%}
.n-linha{display:flex;align-items:baseline;gap:.15em}
.num .n{font-size:clamp(3rem,5.6vw,5.6rem);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--branco);font-variant-numeric:tabular-nums}
.num .u{font-size:clamp(1.4rem,2.4vw,2.4rem);font-weight:600;color:var(--verde)}
.num b{font-weight:600;margin-top:18px;font-size:1.05rem}
.num small{color:var(--txt-3);font-size:.82rem;margin-top:2px}
.ranking{margin-top:16px;border:1px solid var(--linha);border-radius:var(--raio);padding:24px clamp(18px,3vw,36px);background:var(--preto-2)}
.rk-cab{display:flex;justify-content:space-between;gap:12px;color:var(--txt-3);text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;margin-bottom:14px}
.ranking ol{list-style:none;margin:0;padding:0}
.ranking li{display:grid;grid-template-columns:minmax(150px,240px) 1fr 70px;align-items:center;gap:18px;padding:11px 0;border-top:1px solid var(--linha)}
.rk-nome{font-weight:500;display:flex;flex-direction:column;line-height:1.2}
.rk-nome small{color:var(--txt-3);font-size:.74rem;font-weight:400}
.rk-barra{height:10px;border-radius:99px;background:var(--preto-3);overflow:hidden}
.rk-barra i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--verde-escuro),var(--verde));transition:width 1.6s var(--ease)}
.ranking.vis .rk-barra i{width:var(--w)}
.rk-n{text-align:right;font-size:1rem;color:var(--verde)}
.fonte{color:var(--txt-3);margin-top:22px;max-width:60rem}

/* =========================================================
   4. VITRINE (rola pro lado)
   ========================================================= */
.vitrine{position:relative;background:var(--preto-2);border-top:1px solid var(--linha)}
.vit-pin{height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:90px 0 40px}
.vit-cabeca{padding:0 var(--gutter);margin-bottom:4vh}
.vit-trilho{display:flex;align-items:center;gap:clamp(20px,3vw,48px);padding:0 var(--gutter);width:max-content;will-change:transform}
.cel{margin:0;flex:0 0 auto;width:clamp(160px,15vw,230px)}
.cel.alto{transform:translateY(-5vh)}
.cel.baixo{transform:translateY(5vh)}
.cel-tela{border-radius:28px;overflow:hidden;border:5px solid #222;box-shadow:0 0 0 1px var(--linha),0 30px 60px -20px #000;aspect-ratio:9/19;background:#000}
.cel-tela img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 1.2s var(--ease)}
.cel:hover .cel-tela img{transform:scale(1.04)}
.cel figcaption{display:flex;flex-direction:column;margin-top:12px;gap:2px}
.cel figcaption b{font-weight:600}
.cel figcaption span{color:var(--txt-3)}
.ficha{flex:0 0 auto;width:clamp(250px,21vw,320px);padding:24px;border-radius:var(--raio);border:1px solid var(--linha);background:linear-gradient(180deg,#151515,#0D0D0D);transition:border-color .3s}
.ficha:nth-of-type(odd){transform:translateY(-3vh)}
.ficha:nth-of-type(even){transform:translateY(3vh)}
.ficha:hover{border-color:var(--verde-linha)}
.ficha header{display:flex;align-items:center;gap:8px;color:var(--txt-3);margin-bottom:18px}
.f-pin{width:12px;height:12px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--verde);box-shadow:0 0 12px rgba(182,255,59,.7)}
.ficha h3{font-size:1.6rem;letter-spacing:-.03em;line-height:1.1}
.f-ramo{color:var(--txt-3);font-size:.82rem;margin:.3rem 0 1.2rem}
.f-dados{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--txt-2)}
.f-dados b{color:var(--branco);font-family:var(--f-mono);font-weight:500;font-size:1.35rem}
.f-barra{height:4px;border-radius:9px;background:var(--preto-3);margin-top:16px;overflow:hidden}
.f-barra i{display:block;height:100%;width:var(--w);background:var(--verde);border-radius:9px}
.vit-fim{flex:0 0 auto;width:clamp(240px,24vw,360px);padding-left:20px}
.vit-fim p{font-size:clamp(1.6rem,2.6vw,2.4rem);font-weight:600;letter-spacing:-.03em;line-height:1.05;margin:0 0 1.4rem}

/* =========================================================
   5. POR DENTRO
   ========================================================= */
.maquina{padding:clamp(100px,16vh,180px) var(--gutter);background:var(--preto)}
.maq-cabeca{max-width:62rem;margin-bottom:clamp(40px,7vh,80px)}
.trilha{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative}
.et{position:relative;border:1px solid var(--linha);border-radius:var(--raio);padding:20px;min-height:220px;background:var(--preto-2);display:flex;flex-direction:column;gap:16px;opacity:.35;transition:opacity .6s,border-color .6s}
.et.vis{opacity:1;border-color:var(--verde-linha)}
.et:not(:last-child)::after{content:"→";position:absolute;right:-14px;top:50%;transform:translateY(-50%);z-index:2;width:22px;height:22px;border-radius:50%;background:var(--verde);color:var(--preto);display:grid;place-items:center;font-size:.75rem;font-weight:700}
.et-n{color:var(--verde);text-transform:uppercase;letter-spacing:.1em;font-size:.66rem}
.busca{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:999px;background:var(--preto-3);border:1px solid var(--linha);font-size:.86rem;min-height:48px}
.ia-card{display:flex;flex-direction:column;gap:3px;padding:14px;border:1px solid var(--verde);border-radius:12px;background:rgba(182,255,59,.06)}
.ia-tag{color:var(--verde)}
.ia-card span{font-size:.8rem;color:var(--txt-2)}
.ia-linhas{display:block}
.ia-linhas i{display:block;height:7px;border-radius:4px;background:#222;margin-top:7px}
.ia-linhas i+i{width:60%}
.acoes{display:flex;gap:8px;flex-wrap:wrap}
.acoes span{padding:8px 14px;border-radius:999px;border:1px solid var(--linha-forte);font-size:.82rem}
.acoes span:first-child{background:var(--verde);color:var(--preto);border-color:var(--verde);font-weight:600}
.et-dado{margin:auto 0 0;color:var(--txt-2);font-size:.86rem}
.et-dado b{color:var(--verde);font-size:1.4rem;font-weight:500}
.zap{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px;border-radius:12px;background:#0B1A10}
.zap-bolha{background:#1F3B26;color:#E8F5EA;padding:10px 12px;border-radius:12px 12px 12px 2px;font-size:.88rem}
.zap-hora{color:#6FCF8A}
.mapa-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(24px,5vw,80px);align-items:center;margin-top:clamp(60px,10vh,120px);padding-top:clamp(40px,7vh,80px);border-top:1px solid var(--linha)}
.mapa-txt h3{font-size:clamp(1.8rem,3.4vw,3.2rem);line-height:1.02}
.mapa-txt p{color:var(--txt-2)}
.mapa{width:100%;height:auto;max-height:440px}
.mapa .rota{stroke:var(--verde);stroke-width:1;fill:none;opacity:.6;stroke-dasharray:4 4;animation:fluxo 1.6s linear infinite}
@keyframes fluxo{to{stroke-dashoffset:-16}}
.mapa .no{fill:var(--branco)}
.mapa .no.centro{fill:var(--verde)}
.mapa .onda{fill:none;stroke:var(--verde);animation:onda 2.6s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes onda{from{transform:scale(1);opacity:.9}to{transform:scale(5);opacity:0}}
.mapa text{fill:var(--txt-2);font-family:var(--f-mono);font-size:8.5px}

/* =========================================================
   6. CLIENTES (fromanother)
   ========================================================= */
.clientes{position:relative;padding:clamp(100px,16vh,180px) var(--gutter);background:var(--preto-2);border-top:1px solid var(--linha)}
.cli-cab{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(40px,7vh,80px)}
.cli-cab .kicker{width:100%;margin:0}
.cli-cab p{color:var(--txt-3);margin:0}
.cli-preview{position:fixed;left:0;top:0;z-index:40;width:260px;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .25s,transform .35s var(--ease);border-radius:14px;overflow:hidden;background:var(--preto-3);border:1px solid var(--verde-linha);box-shadow:0 30px 60px -20px #000}
.cli-preview.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.cli-preview img{width:100%;aspect-ratio:4/3;object-fit:cover}
.cli-preview.sem-img img{display:none}
.cli-preview span{display:block;padding:10px 12px;color:var(--verde)}

/* =========================================================
   7. PROCESSO (zona clara)
   ========================================================= */
.processo{background:var(--gelo);color:var(--preto);padding:clamp(100px,16vh,180px) var(--gutter)}
.processo .kicker{color:#525252}
.passos{list-style:none;margin:clamp(40px,7vh,80px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.passos li{padding:24px;border-radius:var(--raio);background:#fff;border:1px solid rgba(0,0,0,.08);transition:transform .4s var(--ease),box-shadow .4s}
.passos li:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px rgba(0,0,0,.35)}
.p-n{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--preto);color:var(--verde);margin-bottom:28px;font-size:.85rem}
.passos h3{font-size:1.6rem;margin-bottom:.5rem}
.passos p{color:#525252;margin:0;font-size:.95rem}

/* =========================================================
   8. QUEM FAZ
   ========================================================= */
.sobre{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,100px);align-items:center;padding:clamp(100px,16vh,180px) var(--gutter)}
.sobre-foto{position:relative;aspect-ratio:3/4}
.sobre-foto img{width:100%;height:100%;object-fit:cover;border-radius:var(--raio);filter:grayscale(1) contrast(1.08)}
.selo{position:absolute;right:-50px;bottom:12%;width:130px;height:130px;display:grid;place-items:center}
.selo svg{position:absolute;inset:0;width:100%;height:100%;animation:gira 16s linear infinite}
.selo text{font-family:var(--f-mono);font-size:12.5px;letter-spacing:2.4px;fill:var(--branco)}
.selo span{width:60px;height:60px;border-radius:50%;background:var(--verde);color:var(--preto);display:grid;place-items:center;font-weight:700}
@keyframes gira{to{transform:rotate(360deg)}}
.sobre-texto p{color:var(--txt-2);max-width:36rem}
.sobre-texto h2{margin-bottom:1.6rem}
.gravidade{position:relative;height:240px;margin-top:2rem;border:1px dashed var(--linha-forte);border-radius:var(--raio);overflow:hidden;touch-action:none}
.grav-anel{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;border:1px solid var(--verde-linha);box-shadow:inset 0 0 40px rgba(182,255,59,.1)}
.grav-dica{position:absolute;left:14px;top:12px;color:var(--txt-3)}
.peca{position:absolute;left:0;top:0;padding:8px 14px;min-height:40px;border-radius:999px;border:1px solid var(--linha-forte);background:var(--preto-3);color:var(--branco);font-family:var(--f-mono);font-size:.75rem;cursor:grab;user-select:none;will-change:transform}
.peca:active{cursor:grabbing;background:var(--verde);color:var(--preto);border-color:var(--verde)}

/* =========================================================
   9. PERGUNTAS · 10. CONTATO · RODAPÉ
   ========================================================= */
.perguntas{padding:clamp(100px,16vh,180px) var(--gutter);background:var(--preto-2);border-top:1px solid var(--linha)}
.faq{margin-top:clamp(32px,6vh,64px);max-width:62rem}
.faq details{border-bottom:1px solid var(--linha)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:24px;padding:24px 0;font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:500;letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--verde);font-family:var(--f-mono);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{color:var(--txt-2);margin:0 0 24px;max-width:46rem}
.contato{position:relative;padding:clamp(100px,16vh,180px) var(--gutter);text-align:center;overflow:hidden;background:radial-gradient(ellipse 50% 60% at 50% 100%,rgba(182,255,59,.16),transparent 70%),var(--preto)}
.contato h2{font-size:clamp(3rem,8vw,8rem)}
.form{max-width:640px;margin:3rem auto 0;display:grid;gap:14px;text-align:left}
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-size:.72rem;color:var(--txt-2);font-family:var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.campo input,.campo select{min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--linha-forte);background:var(--preto-2);color:var(--branco);font:inherit;font-size:1rem}
.campo input:focus,.campo select:focus{outline:none;border-color:var(--verde);box-shadow:0 0 0 3px rgba(182,255,59,.2)}
.form .btn{justify-self:start;margin-top:8px}
.form-nota{min-height:1.2em;color:#FF8A73;margin:0}
.cont-alt{color:var(--txt-3);margin-top:2.4rem}
.cont-alt a{color:var(--verde)}
.rodape{padding:60px var(--gutter) 90px;border-top:1px solid var(--linha);color:var(--txt-3);font-size:.86rem}
.rod-marca{font-size:clamp(2.6rem,9vw,9rem);font-weight:700;letter-spacing:-.06em;color:var(--branco);line-height:.9;margin-bottom:1.4rem}
.rodape p{max-width:52rem}
.wa-flutua{position:fixed;right:18px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;box-shadow:0 10px 30px -8px rgba(0,0,0,.6);transition:transform .3s var(--ease)}
.wa-flutua svg{width:30px;height:30px}
.wa-flutua:hover{transform:scale(1.08)}

/* reveal escalonado */
[data-rv]{opacity:0;transform:translateY(40px)}
[data-rv="esq"]{transform:translateX(-50px)}
[data-rv="dir"]{transform:translateX(50px)}
[data-rv="zoom"]{transform:scale(.92)}
[data-rv="clip"]{transform:none;clip-path:inset(100% 0 0 0)}
.rv-ok{opacity:1!important;transform:none!important;clip-path:inset(0 0 0 0)!important;transition:opacity 1s var(--ease),transform 1.1s var(--ease),clip-path 1.2s var(--ease-io)}
/* o deslocamento lateral do reveal não pode alargar a página.
   Só em seções sem pin: clip em ancestral de seção fixa quebrou a engrenagem na v1. */
.numeros,.maquina,.clientes,.processo,.sobre,.perguntas,.contato,.rodape,.nossa,.brasil{overflow-x:clip}

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width:1024px){
  .menu{display:none}
  .num-grade{grid-template-columns:repeat(2,1fr)}
  .trilha{grid-template-columns:1fr 1fr}
  .et:nth-child(2)::after{display:none}
  .passos{grid-template-columns:1fr 1fr}
  .feed{display:none}
}
@media (max-width:767px){
  .marca-nome{display:none}
  .hero{padding:100px var(--gutter) 170px}
  .busca-flut{min-width:0;font-size:.78rem;padding:8px 12px}
  .b1{display:none}
  .b2{right:16px;top:auto;bottom:24%}
  .c2,.c3{display:none}
  .c1{top:auto;bottom:34%}
  .hero-placar{left:16px;right:16px;bottom:22px;justify-content:space-between;gap:10px}
  .hero-placar span{font-size:.68rem}
  .hero-placar div:nth-child(3){display:none}
  .q{width:calc(50vw - 24px)}
  .q p,.q figure{display:none}
  .q1,.q2{top:11%}
  .q3,.q4{bottom:auto;top:58%}
  .eng-desc{display:block;position:absolute;left:16px;right:16px;bottom:22px;z-index:4;margin:0;color:var(--branco);font-size:.9rem;border-left:2px solid var(--verde);padding-left:12px;opacity:var(--cruz,0)}
  .eng-medidas .m2,.eng-medidas .m3,.eng-medidas .m4{display:none}
  .eng-intro{bottom:auto;top:16vh}
  .num-grade{grid-template-columns:1fr 1fr;gap:10px}
  .num{padding:20px 16px}
  .ranking li{grid-template-columns:1fr 60px;gap:8px 12px}
  .rk-barra{grid-column:1/-1;grid-row:2}
  .trilha{grid-template-columns:1fr}
  .et::after{display:none}
  .mapa-wrap{grid-template-columns:1fr}
  .passos{grid-template-columns:1fr}
  .sobre{grid-template-columns:1fr}
  .selo{right:-10px;width:100px;height:100px}
  .selo span{width:46px;height:46px;font-size:.85rem}
  .cli-preview{display:none}
    .ld-final{right:50%;transform:translateX(50%)}
}

/* =========================================================
   v2.1 · fichas em formato de celular (tela do Google)
   ========================================================= */
.gp{display:flex;flex-direction:column;background:#121212;font-family:var(--f);text-align:left}
.gp-status{display:flex;justify-content:space-between;padding:8px 14px 4px;color:#d4d4d4;font-size:.58rem}
.gp-busca{display:flex;align-items:center;gap:8px;margin:4px 10px 8px;padding:7px 12px;border-radius:999px;background:#262626;font-size:.66rem;color:#e5e5e5;white-space:nowrap;overflow:hidden}
.gp-busca .lupa{width:10px;height:10px;border-width:1.5px}
.gp-busca .lupa::after{width:4px;right:-4px;bottom:-2px}
.gp-capa{height:28%;background:#1d1d1d center/cover no-repeat;position:relative;flex:0 0 auto}
.gp-mapa{background-color:#16201a;background-image:linear-gradient(rgba(182,255,59,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(182,255,59,.09) 1px,transparent 1px),linear-gradient(35deg,transparent 46%,rgba(255,255,255,.08) 47%,rgba(255,255,255,.08) 53%,transparent 54%);background-size:18px 18px,18px 18px,100% 100%}
.gp-pin{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-14px 0 0 -9px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--verde);box-shadow:0 0 16px rgba(182,255,59,.8);animation:pinPula 2.4s ease-in-out infinite}
@keyframes pinPula{50%{margin-top:-20px}}
.gp-corpo{padding:10px 12px 12px;display:flex;flex-direction:column;gap:7px;flex:1;min-height:0}
.gp-corpo h3{font-size:.95rem;letter-spacing:-.02em;line-height:1.1}
.gp-ramo{margin:0;color:#a3a3a3;font-size:.6rem}
.gp-botoes{display:flex;gap:5px}
.gp-botoes span{flex:1;text-align:center;padding:5px 0;border-radius:999px;border:1px solid #333;font-size:.56rem;color:#d4d4d4}
.gp-botoes span:first-child{background:var(--verde);border-color:var(--verde);color:var(--preto);font-weight:600}
.gp-tabs{display:flex;gap:10px;font-size:.56rem;color:#737373;border-bottom:1px solid #262626;padding-bottom:5px}
.gp-tabs b{color:var(--verde);font-weight:600}
.gp-desemp{margin-top:auto;padding:9px;border-radius:10px;background:#0b0b0b;border:1px solid #222}
.gp-desemp>.mono{font-size:.52rem;color:#737373;text-transform:uppercase;letter-spacing:.08em}
.gp-nums{display:flex;gap:12px;margin:6px 0}
.gp-nums div{display:flex;flex-direction:column}
.gp-nums b{font-family:var(--f-mono);font-weight:500;font-size:.95rem;color:#fff}
.gp-nums small{font-size:.52rem;color:#a3a3a3}
.gp-barras{display:flex;align-items:flex-end;gap:3px;height:30px}
.gp-barras i{flex:1;height:var(--h);border-radius:2px;background:linear-gradient(180deg,var(--verde),var(--verde-escuro));opacity:.85;transform-origin:bottom;animation:barra 2.8s ease-in-out infinite}
.gp-barras i:nth-child(odd){animation-delay:.4s}
.gp-barras i:nth-child(3n){animation-delay:.9s}
@keyframes barra{50%{transform:scaleY(.82)}}
.gp-serv{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.gp-serv li{font-size:.62rem;color:#d4d4d4;padding:7px 9px;border-radius:8px;background:#0b0b0b;border:1px solid #222}
.gp-serv li::before{content:"✓ ";color:var(--verde)}
.ficha-cel .cel-tela{aspect-ratio:9/19}

/* =========================================================
   v2.1 · quadrantes com vídeo
   ========================================================= */
.q figure video{width:100%;height:100%;object-fit:cover;display:block}

/* =========================================================
   v2.1 · Brasil
   ========================================================= */
.brasil{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,80px);align-items:center;padding:clamp(100px,16vh,180px) var(--gutter);background:radial-gradient(ellipse 50% 60% at 75% 50%,rgba(182,255,59,.07),transparent 70%),var(--preto);border-top:1px solid var(--linha);overflow-x:clip}
.br-chips{list-style:none;margin:2rem 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.br-chips li{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--linha);border-radius:12px;background:var(--preto-2);color:var(--txt-2)}
.br-chips b{color:var(--verde);font-size:1.3rem;min-width:62px}
.br-cidades{color:var(--txt-3);margin-top:1.4rem;line-height:1.8}
.br-mapa{position:relative;aspect-ratio:1/1;width:100%;max-width:620px;justify-self:center}
#brasilMapa{width:100%;height:100%;display:block}
.br-legenda{position:absolute;left:0;bottom:0;display:flex;align-items:center;gap:8px;color:var(--txt-2)}
.br-legenda i{width:10px;height:10px;border-radius:50%;background:var(--verde);box-shadow:0 0 12px var(--verde)}

/* =========================================================
   v2.1 · clientes em faixas correndo
   ========================================================= */
.lista-cli{display:flex;flex-direction:column;gap:6px;margin:0 calc(var(--gutter) * -1);overflow:hidden;mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.faixa{display:flex;width:max-content;animation:corre 60s linear infinite}
.faixa.f2{animation-direction:reverse;animation-duration:70s}
.faixa.f3{animation-duration:55s}
.faixa:hover{animation-play-state:paused}
@keyframes corre{to{transform:translateX(-50%)}}
.faixa-trilho{list-style:none;margin:0;padding:0;display:flex}
.faixa-trilho li{font-size:clamp(2rem,5vw,5rem);font-weight:600;letter-spacing:-.045em;line-height:1.15;color:rgba(255,255,255,.16);cursor:default;transition:color .3s;white-space:nowrap;padding:0 .35em}
.faixa-trilho li::after{content:"✦";font-size:.35em;vertical-align:middle;color:rgba(182,255,59,.35);margin-left:.7em}
.faixa-trilho li:hover{color:var(--branco)}
.faixa-trilho li:hover::after{color:var(--verde)}
.cli-preview{width:280px}
.cp-capa{height:150px;background:#16201a;overflow:hidden}
.cp-capa img{width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.cli-preview.sem-img .cp-capa{background-image:linear-gradient(rgba(182,255,59,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(182,255,59,.1) 1px,transparent 1px);background-size:18px 18px;position:relative}
.cli-preview.sem-img .cp-capa::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-16px 0 0 -11px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--verde);box-shadow:0 0 18px var(--verde)}
.cp-corpo{padding:14px;display:flex;flex-direction:column;gap:3px}
.cp-nome{font-size:1.1rem;letter-spacing:-.02em}
.cp-info{color:var(--txt-3);font-size:.78rem}
.cp-nums{display:flex;gap:16px;margin-top:8px}
.cp-nums span{display:flex;flex-direction:column;font-size:.68rem;color:var(--txt-2)}
.cp-nums b{font-family:var(--f-mono);color:var(--verde);font-weight:500;font-size:1.05rem}

/* =========================================================
   v2.1 · a nossa ficha
   ========================================================= */
.nossa{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(32px,6vw,100px);align-items:center;padding:clamp(100px,16vh,180px) var(--gutter);border-top:1px solid var(--linha);background:radial-gradient(ellipse 40% 60% at 80% 50%,rgba(182,255,59,.1),transparent 70%),var(--preto);overflow-x:clip}
.nossa-ctas{justify-content:flex-start;margin-top:2rem}
.nossa-cel{width:clamp(220px,22vw,300px);justify-self:center;transform:rotate(-4deg);transition:transform .6s var(--ease)}
.nossa-cel:hover{transform:rotate(0)}
.nossa-cel .gp-corpo h3{font-size:1.1rem}

@media (max-width:767px){
  .brasil,.nossa{grid-template-columns:1fr}
  .faixa-trilho li{color:rgba(255,255,255,.35)}
  .nossa-cel{width:72%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-rv]{opacity:1;transform:none;clip-path:none}
}