:root{
  --ceu:#05060d; --ceu-2:#090914; --painel:#0c1022; --painel-2:#11162d;
  --linha:rgba(150,175,230,.13); --linha-2:rgba(150,175,230,.24);
  --azul:#66a0c5; --azul-vivo:#5b95d6; --azul-fundo:#0f3d9d;
  --ouro:#e3a34c; --ouro-claro:#f7cf77; --ouro-linha:#f5cf6b; --bronze:#b27421;
  --prata:#ececef; --t2:#a8b0c6; --t3:#8a93ad;
  --verde:#5fd39a; --amarelo:#f2c14e; --vermelho:#ef6b6b;
  --f-titulo:"Unbounded",system-ui,sans-serif; --f-texto:"Geist",system-ui,sans-serif; --f-mono:"Geist Mono",ui-monospace,monospace;
  --raio:18px; --borda:1px solid var(--linha);
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ceu);color:var(--prata);-webkit-font-smoothing:antialiased;scroll-behavior:auto}
body{font-family:var(--f-texto);font-size:17px;line-height:1.6;background:var(--ceu);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img,svg{display:block}
::selection{background:var(--ouro);color:#1a1205}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* céu fixo atrás de tudo */
#ceu{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none}
.brilho-fundo{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(60vw 60vw at 72% 42%,rgba(47,91,211,.16),transparent 60%),
             radial-gradient(40vw 40vw at 82% 30%,rgba(245,207,107,.10),transparent 60%),
             radial-gradient(70vw 50vw at 10% 110%,rgba(15,61,157,.22),transparent 60%)}
.grao{position:fixed;inset:-10%;z-index:1;pointer-events:none;opacity:.06;will-change:transform;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grao 1.2s steps(4) infinite}
@keyframes grao{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}}
html.sem-webgl #ceu{display:none}
/* sem a estrela em 3D: um céu estrelado desenhado só com CSS (nunca a imagem da logo no fundo) */
html.sem-webgl body{background-color:var(--ceu);
  background-image:radial-gradient(1px 1px at 12px 18px,rgba(255,255,255,.7),transparent 60%),radial-gradient(1px 1px at 83px 64px,rgba(143,195,234,.8),transparent 60%),
  radial-gradient(1.4px 1.4px at 140px 22px,rgba(255,217,138,.8),transparent 60%),radial-gradient(1px 1px at 47px 120px,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1.2px 1.2px at 170px 150px,rgba(143,195,234,.7),transparent 60%),radial-gradient(1px 1px at 105px 175px,rgba(255,255,255,.6),transparent 60%);
  background-size:190px 190px}

main,header,footer{position:relative;z-index:2}
.wrap{width:min(1240px,100% - 48px);margin-inline:auto}

/* abertura */
.abertura{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:var(--ceu);transition:opacity .9s var(--ease),visibility .9s}
.abertura.fora{opacity:0;visibility:hidden}
.abertura .marca{font-family:var(--f-titulo);font-size:clamp(28px,5vw,54px);letter-spacing:.32em;font-weight:500;display:flex}
.abertura .marca span{opacity:0;transform:translateY(30%);display:inline-block;animation:letra .8s var(--ease) forwards}
.abertura .barra{position:absolute;bottom:18vh;width:140px;height:1px;background:var(--linha-2);overflow:hidden}
.abertura .barra i{position:absolute;inset:0;background:linear-gradient(90deg,var(--azul),var(--ouro));transform:scaleX(0);transform-origin:left;animation:carga 1.6s var(--ease) .2s forwards}
@keyframes letra{to{opacity:1;transform:none}}
@keyframes carga{to{transform:scaleX(1)}}

/* marca LumnIA */
.logo{font-family:var(--f-titulo);font-weight:500;letter-spacing:.22em;font-size:15px;display:flex;align-items:center;gap:10px}
.logo-img{height:38px;width:auto}
.logo b{font-weight:500;background:linear-gradient(90deg,#8fc3ea,var(--ouro) 60%,var(--ouro-claro));-webkit-background-clip:text;background-clip:text;color:transparent}
.logo svg{width:22px;height:22px}
.dourado{background:linear-gradient(100deg,var(--ouro-claro),var(--ouro) 45%,#ffd98a 70%,var(--ouro));-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:reflexo 6s linear infinite}
@keyframes reflexo{to{background-position:-200% 0}}
/* 08/10/2026 (desempenho): o brilho dos textos dourados só corre com o texto na tela (pagina.js marca .na-tela) */
html.anima-ao-ver .dourado:not(.na-tela){animation-play-state:paused}
.dourado div,.dourado .palavra{background:inherit;background-size:inherit;-webkit-background-clip:text;background-clip:text;color:transparent;animation:inherit}
.troca{opacity:0}
html.reduzir .troca,html.sem-js .troca{opacity:1}

/* topo */
.topo{position:fixed;top:14px;left:50%;transform:translateX(-50%);width:min(1240px,100% - 24px);z-index:40;
  display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 20px;border-radius:999px;
  background:rgba(9,10,22,.55);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  border:var(--borda);transition:transform .5s var(--ease),background .4s}
.topo.some{transform:translate(-50%,-140%)}
.topo nav{display:flex;gap:26px;font-size:14px;color:var(--t2)}
.topo nav a{position:relative;transition:color .25s}
.topo nav a:hover{color:var(--prata)}
.topo nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--ouro-linha);transform:scaleX(0);transition:transform .35s var(--ease)}
.topo nav a:hover::after{transform:scaleX(1)}

/* botões */
.btn{position:relative;display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;font-weight:500;font-size:15px;
  transition:transform .35s var(--ease),box-shadow .35s,background .35s;will-change:transform;isolation:isolate}
.btn-ouro{background:linear-gradient(180deg,#ffd98a,var(--ouro));color:#1d1306;box-shadow:0 0 0 1px rgba(255,217,138,.5) inset,0 10px 40px -10px rgba(245,207,107,.75)}
.btn-ouro:hover{box-shadow:0 0 0 1px rgba(255,217,138,.8) inset,0 14px 60px -8px rgba(245,207,107,.95)}
.btn-vidro{background:rgba(255,255,255,.04);border:1px solid var(--linha-2);color:var(--prata)}
.btn-vidro:hover{background:rgba(255,255,255,.08)}
.btn .seta{transition:transform .35s var(--ease)}
.btn:hover .seta{transform:translateX(4px)}
.btn-peq{padding:10px 16px;font-size:14px}

/* textos de seção */
.rotulo{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--azul);display:inline-flex;align-items:center;gap:10px}
.rotulo::before{content:"";width:22px;height:1px;background:currentColor;opacity:.7}
.h-gigante{font-family:var(--f-titulo);font-weight:500;font-size:clamp(40px,6.4vw,92px);line-height:1.02;letter-spacing:-.02em}
.h-secao{font-family:var(--f-titulo);font-weight:500;font-size:clamp(32px,4.4vw,62px);line-height:1.06;letter-spacing:-.015em}
.lead{font-size:clamp(17px,1.35vw,20px);color:var(--t2);max-width:56ch}
.fonte{font-family:var(--f-mono);font-size:13px;color:var(--t3);letter-spacing:.02em}
section{position:relative}

/* HERO */
.hero{min-height:100svh;display:flex;align-items:center;padding:140px 0 90px}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center}
.hero h1{margin:22px 0 26px;font-size:clamp(38px,4.7vw,70px)}
.troca{display:inline-grid;vertical-align:bottom;overflow:hidden;height:1.08em}
.troca > span{grid-area:1/1}
.troca > span:not(:first-child){opacity:0}
.hero .lead{max-width:44ch}
.hero .acoes{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}
.canais{display:flex;gap:10px;margin-top:44px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:var(--borda);background:rgba(255,255,255,.025);font-size:13.5px;color:var(--t2)}
.chip i{width:7px;height:7px;border-radius:50%}
.rolar{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;color:var(--t3);text-transform:uppercase}
.rolar i{width:1px;height:46px;background:linear-gradient(var(--ouro-linha),transparent);animation:pinga 2.2s var(--ease) infinite;transform-origin:top}
@keyframes pinga{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* 23h47 */
.madrugada{height:300vh}
.madrugada .fixa{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.madrugada .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:60px;align-items:center}
.relogio{font-family:var(--f-titulo);font-weight:500;font-size:clamp(70px,11vw,170px);line-height:.9;letter-spacing:-.04em;
  color:transparent;-webkit-text-stroke:1px rgba(236,236,239,.35);position:relative}
.relogio .cheio{position:absolute;inset:0;color:var(--prata);-webkit-text-stroke:0;clip-path:inset(0 100% 0 0)}
.frase-madrugada{font-size:clamp(20px,1.9vw,28px);line-height:1.35;margin-top:26px;max-width:24ch}
.frase-madrugada .apaga{color:var(--t3)}
.caixa-msgs{position:relative;height:min(540px,70vh);display:flex;flex-direction:column;gap:12px;justify-content:center}
.msg{align-self:flex-start;max-width:86%;padding:14px 16px;border-radius:16px 16px 16px 4px;background:rgba(22,30,62,.85);border:1px solid rgba(91,149,214,.28);
  font-size:15px;position:relative}
.msg small{display:flex;gap:8px;align-items:center;font-family:var(--f-mono);font-size:12px;color:var(--t2);margin-bottom:4px}
.msg .espera{position:absolute;right:-10px;top:-12px;font-family:var(--f-mono);font-size:12px;padding:4px 8px;border-radius:999px;background:#2a1414;color:#ff9b9b;border:1px solid rgba(239,107,107,.35)}
.msg .resp{display:none}
.msg.respondida{border-color:#ffe7a3;background:linear-gradient(135deg,#ffe9a8,#f5cf6b 55%,#f2c14e);color:#241a04;box-shadow:0 0 0 1px rgba(255,231,163,.4),0 0 40px -6px rgba(255,214,102,.7)}
.msg.respondida small{color:#4a3608}
.msg.respondida .espera{background:linear-gradient(180deg,#ffe8a3,#f5cf6b);color:#2a1f05;border-color:#ffe08a;font-weight:500;box-shadow:0 0 18px -4px rgba(255,214,102,.8)}
.numeros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.numero b{display:block;font-family:var(--f-titulo);font-weight:500;font-size:clamp(28px,3vw,42px);line-height:1.1}
.numero > span{font-size:14px;color:var(--t2);display:block;line-height:1.4;margin-top:4px}

/* DEMO */
.demo{padding:150px 0 120px}
.demo-cab{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:38px}
.segmentos{display:flex;gap:6px;padding:6px;border-radius:999px;border:var(--borda);background:rgba(255,255,255,.03);flex-wrap:wrap}
.segmentos button{padding:9px 16px;border-radius:999px;font-size:14px;color:var(--t2);transition:all .3s var(--ease)}
.segmentos button.ativo{background:var(--prata);color:#0b0d18}
.palco{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr);gap:18px;align-items:stretch}
.cartao{position:relative;border-radius:var(--raio);border:var(--borda);background:linear-gradient(180deg,rgba(19,24,48,.9),rgba(11,14,30,.93));overflow:hidden;display:flex;flex-direction:column}
.cartao-cab{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:var(--borda);gap:10px;font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--t3)}
.vivo{display:inline-flex;align-items:center;gap:7px;color:var(--verde)}
.vivo::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 0 rgba(95,211,154,.6);animation:pulso 1.8s infinite}
@keyframes pulso{70%{box-shadow:0 0 0 9px rgba(95,211,154,0)}100%{box-shadow:0 0 0 0 rgba(95,211,154,0)}}
/* celular */
.celular{padding:16px;display:flex;flex-direction:column;height:640px}
.celular .tela{flex:1;border-radius:26px;background:#0b141a;border:1px solid rgba(255,255,255,.06);display:flex;flex-direction:column;overflow:hidden}
.tela-topo{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#121f27;font-size:14px}
.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,#ffd98a,#e3a34c 50%,#5b95d6);color:#0b0d18;font-size:13px;font-weight:600}
.tela-topo small{display:block;font-size:12px;color:#7fbf9b}
.conversa{flex:1;overflow:hidden;padding:14px 12px;display:flex;flex-direction:column;gap:8px;justify-content:flex-end;
  background-image:radial-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:18px 18px}
.bolha{max-width:84%;padding:8px 11px 6px;border-radius:12px;font-size:14px;line-height:1.45;position:relative;animation:entra .45s var(--ease)}
.bolha.eu{align-self:flex-end;background:#005c4b;border-top-right-radius:4px}
.bolha.bot{align-self:flex-start;background:#1f2c34;border-top-left-radius:4px}
.bolha .hora{display:block;text-align:right;font-size:12px;color:rgba(255,255,255,.45);margin-top:2px}
.bolha.bot .fonte-ref{display:inline-flex;margin-top:6px;font-family:var(--f-mono);font-size:10.5px;color:var(--ouro-claro);gap:6px;align-items:center}
.digitando{align-self:flex-start;background:#1f2c34;border-radius:12px;padding:10px 12px;display:flex;gap:4px}
.digitando i{width:6px;height:6px;border-radius:50%;background:#8696a0;animation:pula 1s infinite}
.digitando i:nth-child(2){animation-delay:.15s}.digitando i:nth-child(3){animation-delay:.3s}
@keyframes pula{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
@keyframes entra{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.perguntas{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.pergunta{text-align:left;padding:11px 14px;border-radius:12px;border:1px solid var(--linha-2);background:rgba(255,255,255,.03);font-size:14px;transition:all .3s var(--ease);display:flex;justify-content:space-between;gap:10px;align-items:center}
.pergunta:hover:not(:disabled){border-color:var(--ouro-linha);background:rgba(245,207,107,.08)}
.pergunta:disabled{opacity:.35;cursor:default}
.pergunta.proxima{border-color:rgba(245,207,107,.65);box-shadow:0 0 0 4px rgba(245,207,107,.08)}
.pergunta .seta{color:var(--ouro-linha)}
/* cérebro */
.cerebro{padding:18px;display:flex;flex-direction:column;gap:14px;flex:1;min-height:0}
.docs{display:flex;flex-direction:column;gap:8px}
.doc{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start;padding:11px 12px;border-radius:12px;border:1px solid var(--linha);background:rgba(255,255,255,.02);transition:all .5s var(--ease);position:relative;overflow:hidden}
.doc .ic{width:36px;height:38px;border-radius:6px;background:rgba(102,160,197,.12);border:1px solid rgba(102,160,197,.3);display:grid;place-items:center;font-family:var(--f-mono);font-size:12px;color:var(--azul)}
.doc b{font-weight:500;font-size:14px;display:block}
.doc p{font-size:13px;color:var(--t3);line-height:1.45}
.doc mark{background:none;color:inherit;transition:all .5s}
.doc.acesa{border-color:rgba(245,207,107,.6);background:rgba(245,207,107,.07);box-shadow:0 0 40px -10px rgba(245,207,107,.45)}
.doc.acesa .ic{background:rgba(245,207,107,.16);border-color:rgba(245,207,107,.6);color:var(--ouro-claro)}
.doc.acesa mark{background:rgba(247,207,119,.22);color:var(--ouro-claro);border-radius:4px;padding:0 3px}
.doc.acesa::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,217,138,.18),transparent 70%);transform:translateX(-100%);animation:varre 1.2s var(--ease)}
@keyframes varre{to{transform:translateX(100%)}}
.passos{margin-top:auto;display:flex;flex-direction:column;gap:8px;font-family:var(--f-mono);font-size:13px}
.passo{display:flex;align-items:center;gap:10px;color:var(--t3);transition:color .3s}
.passo i{width:20px;height:20px;border-radius:50%;border:1px solid var(--linha-2);display:grid;place-items:center;font-style:normal;font-size:12px;flex:none}
.passo.ok{color:var(--prata)}
.passo.ok i{background:var(--ouro-linha);border-color:var(--ouro-linha);color:#1a1205}
.passo.rodando i{border-color:var(--azul);border-top-color:transparent;animation:gira .8s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
/* ficha */
.ficha{padding:18px;display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}
.placar{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center}
.anel{position:relative;width:110px;height:110px}
.anel svg{width:110px;height:110px;transform:rotate(-90deg)}
.anel .valor{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-titulo);font-size:26px}
.anel .valor small{display:block;font-family:var(--f-mono);font-size:12px;color:var(--t3);letter-spacing:.1em;text-align:center;margin-top:-4px}
.estado{font-size:14px;color:var(--t2)}
.estado b{display:block;font-family:var(--f-titulo);font-weight:500;font-size:17px;color:var(--prata);margin-bottom:2px}
.campos{display:flex;flex-direction:column;border-top:var(--borda)}
.campo{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:var(--borda);font-size:14px}
.campo span{color:var(--t3)}
.campo b{font-weight:500;text-align:right;transition:color .4s}
.campo b.novo{color:var(--ouro-claro)}
.campo b.vazio{color:var(--t3);font-weight:400}
.destino{border-radius:14px;border:1px dashed var(--linha-2);padding:14px;font-size:14px;color:var(--t3);transition:all .6s var(--ease)}
.destino.pronto{border-style:solid;border-color:rgba(245,207,107,.6);background:linear-gradient(135deg,rgba(245,207,107,.14),rgba(91,149,214,.08));color:var(--prata)}
.destino b{font-family:var(--f-titulo);font-weight:500;display:block;font-size:15px;margin-bottom:4px}
.aviso-sim{margin-top:18px;text-align:center}
.perguntas-wrap{grid-column:1/-1}
.reiniciar{font-family:var(--f-mono);font-size:12px;color:var(--t2);text-decoration:underline;text-underline-offset:4px}

/* CANAIS */
.canais-sec{height:260vh}
.canais-sec .fixa{position:sticky;top:0;height:100vh;display:flex;align-items:center;overflow:hidden}
.canais-sec .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:50px;align-items:center}
.orbita-canais{position:relative;height:min(560px,72vh)}
.no-canal{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;border:var(--borda);background:rgba(13,17,36,.9);font-size:14px;white-space:nowrap}
.no-canal .bola{width:30px;height:30px;border-radius:9px;display:grid;place-items:center}
.caixa-unica{position:absolute;left:50%;top:50%;width:min(380px,90%);transform:translate(-50%,-50%);border-radius:18px;border:1px solid rgba(245,207,107,.45);
  background:rgba(12,15,32,.92);box-shadow:0 30px 80px -30px rgba(245,207,107,.45);overflow:hidden}
.linha-conv{display:grid;grid-template-columns:10px 26px 1fr auto;gap:10px;align-items:center;padding:11px 14px;border-bottom:var(--borda);font-size:13.5px}
.linha-conv .sem{width:8px;height:8px;border-radius:50%}
.linha-conv small{color:var(--t2);font-size:12.5px;display:block;line-height:1.3}
.linha-conv .ag{font-family:var(--f-mono);font-size:12px;padding:3px 8px;border-radius:999px;background:rgba(102,160,197,.12);color:var(--azul)}
.fios{position:absolute;inset:0;width:100%;height:100%;overflow:visible}

/* MOSAICO */
.modulos{padding:150px 0}
.bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(210px,auto);gap:16px;margin-top:56px}
.tile{position:relative;border-radius:22px;padding:26px;background:rgba(12,15,32,.78);border:var(--borda);overflow:hidden;isolation:isolate;
  transition:transform .5s var(--ease)}

.tile h3{font-family:var(--f-titulo);font-weight:500;font-size:21px;letter-spacing:-.01em;margin-bottom:8px}
.tile p{color:var(--t2);font-size:15px;max-width:42ch}
.t-a{grid-column:span 4;grid-row:span 2}.t-b{grid-column:span 2;grid-row:span 2}.t-c{grid-column:span 2}.t-d{grid-column:span 2}.t-e{grid-column:span 2}.t-f{grid-column:span 3}.t-g{grid-column:span 3}
.mini{margin-top:22px}
.mini-inbox{display:flex;flex-direction:column;gap:8px}
.mini-inbox .l{display:grid;grid-template-columns:8px 1fr auto auto;gap:12px;align-items:center;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.03);border:var(--borda);font-size:14px}
.mini-inbox .l i{width:8px;height:8px;border-radius:50%}
.mini-inbox .l small{font-family:var(--f-mono);font-size:12px;color:var(--t3)}
.barras{display:flex;align-items:flex-end;gap:8px;height:120px}
.barras i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,var(--ouro),rgba(91,149,214,.5));transform-origin:bottom}
.liga li{list-style:none;display:grid;grid-template-columns:22px 26px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:var(--borda);font-size:14px}
.liga li .av{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#2a3970,#5b95d6)}
.liga li:first-child .av{background:linear-gradient(135deg,#ffd98a,#e3a34c)}
.liga li b{font-family:var(--f-mono);font-weight:500;font-size:12.5px;color:var(--ouro-claro)}
.estrelas{display:flex;gap:6px;font-size:26px;color:var(--ouro-linha)}
.estrelas span{opacity:.18}
.estrelas span.on{opacity:1}
.grafico path{fill:none;stroke-width:2.2}

/* ENSINO */
.ensino{padding:130px 0}
.ensino .grade{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:70px;align-items:start}
.quem{display:flex;flex-direction:column;gap:14px}
.quem-item{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:22px;border-radius:20px;border:var(--borda);background:rgba(12,15,32,.7)}
.quem-item .ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-family:var(--f-titulo);font-size:18px}
.quem-item h4{font-family:var(--f-titulo);font-weight:500;font-size:18px;margin-bottom:4px}
.quem-item p{font-size:15px;color:var(--t2)}
.rota{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-family:var(--f-mono);font-size:12px;color:var(--ouro-claro)}

/* SEGURANÇA e PASSOS */
.seguranca{padding:110px 0}
.selos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:48px}
.selo{padding:24px;border-radius:20px;border:var(--borda);background:rgba(12,15,32,.7)}
.selo svg{width:30px;height:30px;margin-bottom:16px;color:var(--ouro-linha)}
.selo h4{font-family:var(--f-titulo);font-weight:500;font-size:17px;margin-bottom:6px}
.selo p{font-size:14.5px;color:var(--t2)}
.comeca{padding:110px 0}
.trilha{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:60px}
.trilha .linha{position:absolute;top:27px;left:6%;right:6%;height:1px;background:var(--linha-2)}
.trilha .linha i{position:absolute;inset:0;background:linear-gradient(90deg,var(--azul),var(--ouro));transform:scaleX(0);transform-origin:left}
.etapa{position:relative}
.etapa .n{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-titulo);background:var(--ceu);border:1px solid var(--linha-2);margin-bottom:22px;position:relative;z-index:1}
.etapa h4{font-family:var(--f-titulo);font-weight:500;font-size:20px;margin-bottom:8px}
.etapa p{color:var(--t2);font-size:15.5px}

/* FINAL */
.final{min-height:120vh;display:flex;align-items:flex-end;text-align:center;padding:50vh 0 100px}
.final .h-gigante{max-width:15ch;margin:24px auto 30px}
.final .acoes{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
footer{border-top:var(--borda);padding:40px 0 50px;color:var(--t3);font-size:14px;background:rgba(5,6,13,.85)}
footer .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:center}
footer nav{display:flex;gap:22px;flex-wrap:wrap}
footer a:hover{color:var(--prata)}

/* cursor próprio */
/* cursor próprio: uma estrela de 4 pontas (a mesma faísca da logo) + uma lente de vidro que segue com atraso */
html.cursor-proprio,html.cursor-proprio *{cursor:none!important}
/* sobre a janela do chat (widget) volta o cursor normal e a estrela some */
html.cursor-proprio [data-lumnia-chat]{cursor:auto!important}
html.sobre-widget .cursor{opacity:0!important}
.cursor{position:fixed;left:0;top:0;pointer-events:none;z-index:60;opacity:0;transition:opacity .3s;will-change:transform}
html.cursor-proprio .cursor{opacity:1}
.cursor{width:22px;height:22px;margin:-11px 0 0 -11px;filter:drop-shadow(0 0 6px rgba(255,214,102,.95)) drop-shadow(0 0 18px rgba(255,214,102,.55)) drop-shadow(0 0 36px rgba(255,214,102,.25))}
.cursor svg{width:100%;height:100%;transition:transform .45s var(--ease)}
.cursor.sobre svg{transform:rotate(45deg) scale(1.25)}
/* a estrela do cursor emite luz: um halo dourado suave que acompanha o mouse e acende as bordas dos painéis por perto */
.luz-do-cursor{position:fixed;left:0;top:0;width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;pointer-events:none;z-index:1;
  background:radial-gradient(circle,rgba(255,214,102,.13),rgba(255,214,102,.05) 32%,transparent 64%);opacity:0;transition:opacity .5s;will-change:transform}
html.cursor-proprio .luz-do-cursor{opacity:1}
html.sobre-widget .luz-do-cursor{opacity:0!important}
@media (hover:none){.cursor,.luz-do-cursor{display:none}}

/* revelar */
.revela{opacity:0;transform:translateY(28px)}
html.reduzir .revela,html.sem-js .revela{opacity:1;transform:none}

/* celular */
@media (max-width:1000px){
  .topo nav{display:none}
  .hero .wrap,.madrugada .wrap,.canais-sec .wrap,.ensino .grade{grid-template-columns:1fr}
  .hero{padding-top:52vh;align-items:flex-start}
  .palco{grid-template-columns:1fr}
  .palco > .cartao:nth-child(1){order:1}.perguntas-wrap{order:2}.palco > .cartao:nth-child(2){order:3}.palco > .cartao:nth-child(3){order:4}
  .perguntas{margin-top:0!important}
  .celular{height:520px}
  .bento{grid-template-columns:1fr 1fr}
  .t-a,.t-b,.t-c,.t-d,.t-e,.t-f,.t-g{grid-column:span 2;grid-row:auto}
  .selos{grid-template-columns:1fr 1fr}
  .trilha{grid-template-columns:1fr}.trilha .linha{display:none}
  .madrugada{height:auto}.madrugada .fixa{position:relative;height:auto;padding:110px 0}
  .canais-sec{height:auto}.canais-sec .fixa{position:relative;height:auto;padding:100px 0}
  .numeros{grid-template-columns:1fr}
  .orbita-canais{height:auto;display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start}
  .no-canal{position:static}
  .fios{display:none}
  .caixa-unica{position:relative;left:auto;top:auto;transform:none;width:100%;margin-top:6px}
}
@media (max-width:560px){
  .wrap{width:calc(100% - 32px)}
  .bento,.selos{grid-template-columns:1fr}
  .t-a,.t-b,.t-c,.t-d,.t-e,.t-f,.t-g{grid-column:span 1}
  .topo{padding:8px 8px 8px 16px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* painéis com luz (pedido do Matheus, 07/10): borda dourada nos cantos, sempre; brilho suave onde o cursor passa */
.luz{position:relative;isolation:isolate;transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
.luz::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:2;
  background:radial-gradient(340px circle at var(--x,-999px) var(--y,-999px),rgba(255,228,150,.85),rgba(245,207,107,.25) 45%,transparent 70%),linear-gradient(135deg,rgba(245,207,107,.55),rgba(245,207,107,.08) 28%,transparent 45%,transparent 70%,rgba(245,207,107,.28));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.luz::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:.55;transition:opacity .6s var(--ease);
  background:radial-gradient(520px circle at var(--x,50%) var(--y,50%),rgba(255,214,102,.12),rgba(245,207,107,.04) 40%,transparent 65%)}
.luz:hover::after{opacity:1}
.luz:hover{box-shadow:0 0 0 1px rgba(245,207,107,.35),0 24px 70px -34px rgba(255,214,102,.55)}
.selo,.quem-item{position:relative}

/* celular e telas de toque: conteúdo sempre visível (sem esperar animação de entrada), cabeçalho que cabe */
.so-celular{display:none}
@media (max-width:560px){.so-largo{display:none}.so-celular{display:inline}.topo .logo-img{height:30px}}
@media (max-width:1000px),(hover:none){
  .revela{opacity:1!important;transform:none!important}
  .troca{opacity:1}
}

/* 08/10/2026 — com o link "Preços", o menu não cabe entre 1001 e 1120 px: um link sai nessa faixa (abaixo de 1000 o menu já some) */
@media (max-width:1120px){.so-menu-largo{display:none}}
/* 08/10/2026 (pedido do Matheus) — chamada da demonstração: deixa claro que clicar na mensagem começa a demonstração */
.chamada-demo{display:flex;align-items:flex-end;justify-content:center;gap:4px;margin:22px auto 0;max-width:640px;
  color:var(--ouro-claro);font-family:var(--f-mono);font-size:14px;letter-spacing:.06em;text-transform:uppercase;
  transition:opacity .4s var(--ease)}
.chamada-demo span{padding-bottom:30px;text-shadow:0 0 18px rgba(245,207,107,.45)}
.chamada-demo svg{flex:none;filter:drop-shadow(0 0 6px rgba(245,207,107,.5));animation:chamada 1.8s var(--ease) infinite}
@keyframes chamada{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.chamada-demo.espera{opacity:.35}
.chamada-demo.fim svg{visibility:hidden}
.chamada-demo.fim span{margin-left:48px}   /* a seta escondida ainda ocupa 48 px: o texto volta ao centro */
@media (prefers-reduced-motion:reduce){.chamada-demo svg{animation:none}}
@media (max-width:520px){.chamada-demo{font-size:13px}.chamada-demo span{padding-bottom:26px}}
/* 08/10/2026 (desempenho, medido: na Demonstração a máquina fraca desenhava 8 quadros por segundo) — a borda dourada
   com máscara e o brilho dos painéis viram camadas próprias: o que se mexe DENTRO do painel (pontinhos, ícone girando)
   deixa de redesenhar a borda a cada quadro. O visual é o mesmo. */
.luz::before,.luz::after{will-change:transform;transform:translateZ(0)}
/* o pulso do "ao vivo" era sombra animada (redesenho a cada quadro); agora é um anel que cresce e some (só composição) */
.vivo{position:relative}
.vivo::before{animation:none;box-shadow:none}
.vivo::after{content:"";position:absolute;left:0;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;
  background:rgba(95,211,154,.55);animation:pulso-anel 1.8s infinite;will-change:transform,opacity;pointer-events:none}
@keyframes pulso-anel{0%{transform:scale(1);opacity:.7}70%{transform:scale(3.6);opacity:0}100%{transform:scale(3.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.vivo::after{animation:none;opacity:0}}
/* 08/10/2026 — máquina fraca (a estrela mediu e desceu ao 3º degrau, ver estrela.js): saem só efeitos quase invisíveis
   que custam desenho a cada quadro. Máquina rápida continua com todos. */
html.maquina-lenta .grao{animation:none}
html.maquina-lenta .luz::after{display:none}
html.maquina-lenta .topo{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(9,10,22,.9)}
/* 08/10/2026 — o aviso "role" ficava por cima dos selos dos canais (centro da base do hero, em telas de até ~1080 px de
   altura): vai para o canto direito, embaixo da estrela, onde não há texto; em tela estreita não aparece */
.rolar{left:auto;right:clamp(16px,4vw,56px);transform:none}
@media (max-width:1000px){.rolar{display:none}}