/* VoltByte — base compartilhada por todas as páginas (tokens, circuito, atmosfera, topo, CTA final, rodapé) */
/* ===== Tokens ===== */
/* fonte reserva com a largura da Geist: o texto não muda de linha quando a Geist termina de carregar */
@font-face{font-family:"Geist Fallback";src:local("Arial"),local("Helvetica"),local("Roboto");size-adjust:102.2%}
:root{
  --grafite:#0E1311; --superficie:#151A18; --aluminio:#E4E7E3; --papel:#F4F6F3;
  --tinta-clara:#EEF1EE; --tinta-escura:#0C0F0E; --verde:#00C16A; --verde-fundo:#00A85C;
  --display:"Geist", "Geist Fallback", system-ui, sans-serif; --serif:"Newsreader", Georgia, serif; --mono:"Geist Mono", ui-monospace, monospace;
  --pad:clamp(20px, 5vw, 72px); --larg:1360px;
  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:104px; --s7:168px;
  --suave:color-mix(in srgb, currentColor 64%, transparent);
  --linha:color-mix(in srgb, currentColor 14%, transparent);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
body{background:var(--grafite);color:var(--tinta-clara);font:400 17px/1.6 var(--display);-webkit-font-smoothing:antialiased;overflow-x:hidden;font-feature-settings:"ss01"}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--verde);color:var(--grafite)}
.casca{width:100%;max-width:var(--larg);margin-inline:auto;padding-inline:var(--pad)}
.olho{font:500 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;display:flex;align-items:center;gap:12px;color:var(--suave)}
.serif{font-family:var(--serif);font-style:italic;font-weight:350;letter-spacing:-.01em}
h1,h2,h3{font-weight:500;letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
h2{font-size:clamp(36px,5.4vw,80px)}
h3{font-size:24px;letter-spacing:-.02em;line-height:1.15}
p{text-wrap:pretty}
.lede{font-size:clamp(17px,1.35vw,20px);line-height:1.6;color:var(--suave);max-width:58ch}
.num{font:500 12px/1 var(--mono);letter-spacing:.08em;font-variant-numeric:tabular-nums}

/* botões */
.btn{display:inline-flex;align-items:center;gap:12px;height:56px;padding:0 26px;border-radius:2px;font:500 15px/1 var(--display);letter-spacing:-.005em;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease);border:1px solid var(--linha)}
.btn:hover{transform:translateY(-2px)}
.btn--cheio{background:var(--tinta-clara);color:var(--grafite);border-color:transparent}
.btn--cheio:hover{background:var(--verde)}
.btn .seta{font-family:var(--mono);transition:transform .35s var(--ease)}
.btn:hover .seta{transform:translateX(4px)}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.pular{position:fixed;z-index:100;left:16px;top:-60px;padding:12px 18px;border-radius:4px;background:var(--verde);color:#0C0F0E;font-weight:500;transition:top .2s}
.pular:focus{top:12px}

/* ===== Atmosfera: luz de bancada, malha técnica e grão ===== */
.atmosfera{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .8s ease}
html[data-tom="escuro"] .atmosfera{opacity:1}
.atmosfera .luz{position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 50% at 50% -12%,rgba(0,193,106,.11),transparent 70%),
    radial-gradient(ellipse 90% 60% at 50% -6%,rgba(238,241,238,.045),transparent 75%),
    radial-gradient(ellipse 120% 90% at 50% 45%,transparent 55%,rgba(0,0,0,.5) 100%)}
.atmosfera .malha{position:absolute;inset:-28px 0;will-change:transform;
  background:radial-gradient(circle at 1px 1px,rgba(238,241,238,.075) 1px,transparent 1.5px) 0 0/28px 28px;
  -webkit-mask:radial-gradient(ellipse 85% 70% at 50% 30%,#000 25%,transparent 85%);mask:radial-gradient(ellipse 85% 70% at 50% 30%,#000 25%,transparent 85%)}
.grao{position:fixed;inset:0;z-index:45;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1.2 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-tom="claro"] .grao{opacity:.09;mix-blend-mode:multiply}

/* ===== Pads do circuito ===== */
.pad{position:relative;flex:none;width:11px;height:11px;border:1.5px solid color-mix(in srgb,currentColor 38%,transparent);background:transparent;border-radius:1px;transition:background .4s var(--ease),border-color .4s var(--ease),box-shadow .5s var(--ease)}
.pad.pendurado{margin-left:-29px;margin-right:18px}
.pad.energizado{background:var(--verde);border-color:var(--verde);box-shadow:0 0 0 5px color-mix(in srgb,var(--verde) 16%,transparent)}
.ancora-borda{height:0;position:relative}
.ancora-borda .pad{position:absolute;left:calc(var(--pad) - 29px);top:-6px}
@media (max-width:760px){
  .pad.pendurado{margin-left:-17px;margin-right:6px;width:9px;height:9px}
  .ancora-borda .pad{left:calc(var(--pad) - 17px);width:9px;height:9px}
}

/* ===== Circuito (assinatura) ===== */
.placa{position:relative}
#circuito{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}
#circuito .trilha{fill:none;stroke:currentColor;stroke-opacity:.13;stroke-width:1.25}
#circuito .viva{fill:none;stroke:var(--verde);stroke-width:2;stroke-linecap:square}
#circuito .cabeca{fill:var(--verde)}
#circuito .halo{fill:none;stroke:var(--verde);stroke-opacity:.35;stroke-width:1}
.placa > section, .placa > footer, .placa > .ancora-borda{position:relative;z-index:2}

/* ===== Cabeçalho ===== */
.topo{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:50;width:min(calc(100% - 24px), 1180px);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 10px 10px 22px;background:color-mix(in srgb,#0C0F0E 78%,transparent);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border:1px solid rgba(255,255,255,.07);border-radius:4px;color:var(--tinta-clara)}
.topo .marca img{height:26px;width:auto}
.topo nav{display:flex;gap:28px;font-size:14px}
.topo nav a{color:rgba(238,241,238,.72);transition:color .25s}
.topo nav a:hover,.topo nav a[aria-current]{color:#fff}
.topo .btn{height:42px;padding:0 18px;font-size:14px}
.menu-btn{display:none}
@media (max-width:860px){
  .topo{gap:8px;padding-left:16px}
  .topo .btn{margin-left:auto}
  .menu-btn{display:grid;place-content:center;gap:5px;flex:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.14);border-radius:2px;background:transparent;color:inherit;cursor:pointer}
  .menu-btn span{display:block;width:16px;height:1.5px;background:currentColor;transition:transform .35s var(--ease)}
  .menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(3.25px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] span:nth-child(2){transform:translateY(-3.25px) rotate(-45deg)}
  .topo nav{position:absolute;left:-1px;right:-1px;top:calc(100% + 8px);display:flex;flex-direction:column;gap:0;padding:6px 20px 14px;background:#0E1311;border:1px solid rgba(255,255,255,.08);border-radius:4px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);counter-reset:menu;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s .4s}
  .topo.aberto nav{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s}
  .topo nav a{counter-increment:menu;display:flex;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:28px;letter-spacing:-.03em;color:var(--tinta-clara)}
  .topo nav a:last-child{border-bottom:0}
  .topo nav a::before{content:"0" counter(menu);font:500 11px/1 var(--mono);letter-spacing:.1em;color:rgba(238,241,238,.4)}
  .topo nav a[aria-current]{color:var(--verde)}
}

.btn--escuro{background:var(--grafite);color:var(--tinta-clara);border-color:transparent}
.btn--escuro:hover{background:#1d2422}
.faixa{margin-top:var(--s6);padding-block:18px;border-block:1px solid var(--linha);font:500 12px/1 var(--mono);letter-spacing:.16em;text-align:center;color:var(--suave);overflow:hidden;white-space:nowrap}
@media (max-width:760px){.faixa{white-space:normal;line-height:1.8}}

/* ===== Raio-x: mostra a estrutura da própria página ===== */
.raio-x-btn{cursor:pointer;background:transparent;color:inherit}
.raio-x-btn .led{width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,currentColor 30%,transparent);transition:background .3s,box-shadow .3s}
.raio-x-btn .rx-on{display:none}
html.raio-x .raio-x-btn .rx-on{display:inline}
html.raio-x .raio-x-btn .rx-off{display:none}
html.raio-x .raio-x-btn{border-color:var(--verde)}
html.raio-x .raio-x-btn .led{background:var(--verde);box-shadow:0 0 8px var(--verde)}
.grade-rx{position:fixed;inset:0;z-index:44;pointer-events:none;opacity:0;transition:opacity .5s var(--ease)}
.grade-rx .casca{height:100%;background:repeating-linear-gradient(90deg,rgba(0,193,106,.08) 0 calc((100% + 24px) / 12 - 24px),transparent calc((100% + 24px) / 12 - 24px) calc((100% + 24px) / 12));background-clip:content-box;border-inline:1px dashed rgba(0,193,106,.35)}
html.raio-x .grade-rx{opacity:1}
html.raio-x .placa > section,html.raio-x .placa > footer{outline:1px dashed rgba(0,193,106,.6);outline-offset:-1px}
html.raio-x .placa :is(h1,h2,.lede,.btn,img,.olho){outline:1px dashed rgba(0,193,106,.5);outline-offset:3px}
html.raio-x .placa > section :is(h1,h2){position:relative}
html.raio-x .placa > section h1::after,html.raio-x .placa > section h2::after{position:absolute;left:0;top:-18px;font:500 10px/1 var(--mono);letter-spacing:.08em;color:var(--verde)}
html.raio-x .placa > section h1::after{content:"<h1> Geist 500"}
html.raio-x .placa > section h2::after{content:"<h2> Geist 500"}
.selo-rx{position:fixed;left:50%;bottom:18px;z-index:46;display:flex;align-items:center;gap:14px;padding:10px 10px 10px 16px;transform:translate(-50%,24px);opacity:0;visibility:hidden;background:#0C0F0E;color:var(--tinta-clara);border:1px solid rgba(0,193,106,.5);border-radius:3px;font:500 11px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s .45s;white-space:nowrap}
.selo-rx b{color:var(--verde);font-weight:500}
.selo-rx button{height:30px;padding:0 12px;border:1px solid rgba(255,255,255,.2);border-radius:2px;background:transparent;color:inherit;font:inherit;cursor:pointer}
html.raio-x .selo-rx{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s}
@media (max-width:600px){.selo-rx .rx-dica{display:none}}

/* ===== Antes e depois ===== */
.ad{--pos:50%;margin:0}
.ad-palco{position:relative;overflow:hidden;aspect-ratio:1350/600;border-radius:4px;border:1px solid rgba(255,255,255,.1);background:#0A0D0C;box-shadow:0 60px 100px -50px rgba(0,0,0,.9);user-select:none;-webkit-user-select:none;touch-action:pan-y}
.ad-palco img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;pointer-events:none}
.ad-depois{clip-path:inset(0 0 0 var(--pos))}
.ad-linha{position:absolute;top:0;bottom:0;left:var(--pos);width:0;pointer-events:none}
.ad-linha::before{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:var(--verde);box-shadow:0 0 18px rgba(0,193,106,.7)}
.ad-pega{position:absolute;left:0;top:50%;display:flex;align-items:center;justify-content:center;gap:10px;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--verde);color:#04120A;font:500 18px/1 var(--mono);box-shadow:0 10px 30px -6px rgba(0,0,0,.6),0 0 0 6px rgba(0,193,106,.18);transition:transform .3s var(--ease)}
.ad-pega i{font-style:normal}
.ad-palco:hover .ad-pega,.ad-controle:focus-visible ~ .ad-linha .ad-pega{transform:scale(1.08)}
.ad-rot{position:absolute;top:14px;padding:7px 10px;border-radius:2px;background:rgba(10,13,12,.82);color:var(--tinta-clara);font-size:10px;letter-spacing:.14em;text-transform:uppercase;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:opacity .3s}
.ad-rot--antes{left:14px;opacity:calc(min(1, (var(--p, 50) - 14) / 10))}
.ad-rot--depois{right:14px;color:var(--verde);opacity:calc(min(1, (86 - var(--p, 50)) / 10))}
.ad-controle{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none}
.ad-controle:focus-visible{opacity:0}
.ad-palco:has(.ad-controle:focus-visible){outline:2px solid var(--verde);outline-offset:3px}
.ad-abas{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--s3)}
.ad-abas button{height:40px;padding:0 14px;border:1px solid var(--linha);border-radius:2px;background:transparent;color:inherit;font:500 14px/1 var(--display);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.ad-abas button[aria-selected="true"]{background:var(--tinta-clara);color:var(--grafite);border-color:transparent}
@media (max-width:760px){
  .ad-palco{aspect-ratio:4/3}
  .ad-palco img{object-position:left top}
  .ad-pega{width:42px;height:42px;margin:-21px 0 0 -21px;font-size:15px;gap:6px}
  .ad-rot{top:10px;font-size:9px;padding:6px 8px}
  .ad-rot--antes{left:10px}.ad-rot--depois{right:10px}
}

/* ===== 7. Próximo passo ===== */
.final{padding-block:var(--s7) var(--s6)}
.final h2{font-size:clamp(44px,7.8vw,132px);letter-spacing:-.05em;margin-top:var(--s4);max-width:14ch;line-height:.96}
.final .linha{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s5);margin-top:var(--s5);align-items:end}
.final .lede{grid-column:2}
.cta-final{height:72px;padding:0 34px;font-size:17px;background:transparent;color:var(--tinta-clara);border:1.5px solid rgba(238,241,238,.3);transition:background .6s var(--ease),color .6s var(--ease),border-color .6s var(--ease),transform .35s var(--ease)}
.cta-final .led{width:9px;height:9px;border-radius:50%;background:rgba(238,241,238,.25);transition:background .5s}
.cta-final.energizado{background:var(--verde);color:#04120A;border-color:var(--verde)}
.cta-final.energizado .led{background:#04120A}
.cta-final:hover{background:var(--tinta-clara);color:var(--grafite);border-color:var(--tinta-clara)}
.cta-final.energizado:hover{background:#19D27E;border-color:#19D27E;color:#04120A}
.cta-wrap{margin-top:var(--s5);display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3)}
.cta-wrap .alt{font:500 14px/1.4 var(--mono);color:var(--suave)}
.cta-wrap .alt a{border-bottom:1px solid var(--linha)}
@media (max-width:900px){.final .linha{grid-template-columns:1fr}.final .lede{grid-column:1}.cta-final{height:64px;padding:0 24px}}

/* ===== Rodapé ===== */
.rodape-site{padding-block:var(--s6) var(--s4);border-top:1px solid var(--linha)}
.rodape-site .colunas{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:var(--s4)}
.rodape-tit{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--suave);margin-bottom:var(--s3)}
.rodape-site ul{list-style:none;display:grid;gap:10px;font-size:15px}
.rodape-site ul a{color:color-mix(in srgb,currentColor 82%,transparent);transition:color .25s}
.rodape-site ul a:hover{color:var(--verde)}
.rodape-site .marca img{height:30px;width:auto}
.rodape-site .sobre{margin-top:var(--s3);font-size:15px;color:var(--suave);max-width:34ch}
.rodape-site .contato{margin-top:var(--s3);display:grid;gap:6px;font:400 14px/1.5 var(--mono)}
.rodape-site address{font-style:normal;font-size:14px;line-height:1.7;color:var(--suave)}
.rodape-site .redes{display:flex;gap:10px;margin-top:var(--s2)}
.rodape-site .redes a{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--linha);border-radius:2px;transition:border-color .25s,color .25s}
.rodape-site .redes a:hover{border-color:var(--verde);color:var(--verde)}
.rodape-site .redes svg{width:18px;height:18px}
.assinatura{margin-top:var(--s6);font-size:clamp(28px,6.4vw,104px);font-weight:500;letter-spacing:-.05em;line-height:.95;color:color-mix(in srgb,currentColor 24%,transparent)}
.legal{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--linha);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;font:400 13px/1.5 var(--mono);color:var(--suave)}
.legal nav{display:flex;flex-wrap:wrap;gap:20px}
.legal a:hover{color:var(--verde)}
@media (max-width:900px){.rodape-site .colunas{grid-template-columns:1fr 1fr}.rodape-site .colunas > :first-child{grid-column:1 / -1}}

/* ===== Movimento reduzido ===== */
.fx-reduzido .clara{background:#E4E7E3;color:#0C0F0E}

/* ===== Consentimento de cookies (só aparece com a medição configurada) ===== */
.link-cookies{padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
.link-cookies:hover{color:var(--verde)}
.cookies{position:fixed;z-index:60;left:16px;right:16px;bottom:16px;max-width:560px;margin-inline:auto;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;padding:18px 20px;border:1px solid rgba(255,255,255,.12);border-radius:8px;background:#151A18;color:#EEF1EE;box-shadow:0 30px 80px -30px rgba(0,0,0,.9)}
.cookies p{flex:1 1 280px;font-size:14px;line-height:1.5;color:rgba(238,241,238,.78)}
.cookies a{color:var(--verde);text-decoration:underline;text-underline-offset:3px}
.cookies-acoes{display:flex;gap:10px}
.cookies .btn{height:42px;padding:0 18px;font-size:14px}
