:root{--verde:#9dffc4;--folha:#5fd38e;--sol:#ffd27a;--sol2:#fff1c4;--urucum:#ff8a4c;--noite:#06110c;--creme:#f4f1e4;--vidro:rgba(8,26,19,.42);--borda:rgba(157,255,196,.28);
  --disp:"Unbounded",system-ui,sans-serif;--fonte:"Instrument Sans",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--noite)}
body{margin:0;color:var(--creme);font:16.5px/1.6 var(--fonte);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
#mundo{position:fixed;inset:0;width:100vw;height:100vh;display:block;z-index:0}
.vinheta{position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 50% 55%,transparent 55%,rgba(3,10,7,.55) 100%)}
main{position:relative;z-index:2}
.tela{min-height:100vh;display:flex;align-items:center;padding:110px 6vw;position:relative}

/* carregando */
.carregando{position:fixed;inset:0;z-index:50;background:var(--noite);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;font:12px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--verde);transition:opacity 1.2s ease}
body.pronto .carregando{opacity:0;pointer-events:none}
.semente-load{width:22px;height:34px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 70%,var(--sol2),var(--sol) 40%,var(--folha) 100%);box-shadow:0 0 30px var(--sol),0 0 80px rgba(157,255,196,.5);animation:pulsa 1.4s ease-in-out infinite}
@keyframes pulsa{50%{transform:scale(1.25);box-shadow:0 0 50px var(--sol),0 0 120px rgba(157,255,196,.7)}}

/* hud */
.hud-topo{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:20px 4vw;background:linear-gradient(180deg,rgba(4,12,8,.6),transparent)}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 17px var(--disp);letter-spacing:.22em}
.marca img{width:32px;height:32px;filter:drop-shadow(0 0 10px rgba(157,255,196,.6))}
.hud-topo nav{display:flex;gap:28px;align-items:center;font:500 13px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.hud-topo nav a{text-decoration:none;color:rgba(244,241,228,.78)}
.hud-topo nav a:hover{color:var(--verde);text-shadow:0 0 12px var(--verde)}
.hud-botao{border:1px solid var(--sol);color:var(--sol)!important;padding:9px 18px;border-radius:2px;box-shadow:0 0 18px rgba(255,210,122,.25),inset 0 0 12px rgba(255,210,122,.15)}
.hud-lado{position:fixed;left:2.2vw;bottom:28px;z-index:20;display:flex;flex-direction:column;gap:4px;font:11px var(--mono);letter-spacing:.12em;color:rgba(157,255,196,.6);text-transform:uppercase}

/* herói */
.heroi{flex-direction:column;align-items:flex-start;justify-content:center}
.h-kicker,.p-kicker,.rh-kicker{display:flex;align-items:center;gap:10px;font:500 12px var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--verde)}
.h-kicker i,.rh-kicker i{width:8px;height:8px;border-radius:50%;background:var(--verde);box-shadow:0 0 12px var(--verde);animation:pulsa 2s infinite}
.titulo{margin:14px 0 0;font:900 clamp(64px,13.5vw,220px)/.86 var(--disp);letter-spacing:-.02em;display:flex}
.titulo span{display:inline-block;background:linear-gradient(180deg,#fffbe8 10%,var(--sol) 55%,var(--folha) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 28px rgba(255,210,122,.35));opacity:0;transform:translateY(40px) rotateX(70deg);animation:nasce 1.3s cubic-bezier(.2,.8,.2,1) forwards}
.titulo span:nth-child(2){animation-delay:.08s}.titulo span:nth-child(3){animation-delay:.16s}.titulo span:nth-child(4){animation-delay:.24s}.titulo span:nth-child(5){animation-delay:.32s}.titulo span:nth-child(6){animation-delay:.4s}
@keyframes nasce{to{opacity:1;transform:none}}
body:not(.pronto) .titulo span{animation-play-state:paused}
.h-lema{font:300 clamp(26px,3.2vw,44px) var(--disp);margin:16px 0 8px;color:var(--sol2);letter-spacing:.02em}
.h-sub{max-width:560px;font-size:18px;color:rgba(244,241,228,.84);margin:0 0 30px;text-shadow:0 1px 18px rgba(0,0,0,.5)}
.h-acoes{display:flex;gap:14px;flex-wrap:wrap}
.b-sol,.b-vidro{display:inline-flex;align-items:center;height:52px;padding:0 26px;text-decoration:none;font:600 15px var(--fonte);letter-spacing:.02em;transition:transform .2s,box-shadow .2s;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.b-sol{background:linear-gradient(90deg,var(--sol),#ffe7a6);color:#1a1405;box-shadow:0 0 30px rgba(255,210,122,.45)}
.b-vidro{background:rgba(157,255,196,.1);border:1px solid var(--borda);color:var(--creme);backdrop-filter:blur(10px)}
.b-sol:hover,.b-vidro:hover{transform:translateY(-2px)}
.rolar{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font:11px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:rgba(244,241,228,.6)}
.rolar span{width:1px;height:46px;background:linear-gradient(var(--verde),transparent);animation:desce 2s infinite}
@keyframes desce{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* painéis de vidro com cantos de HUD */
.painel{position:relative;max-width:560px;padding:34px 36px;background:var(--vidro);backdrop-filter:blur(16px) saturate(1.3);border:1px solid var(--borda);box-shadow:0 30px 80px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06)}
.painel::before,.painel::after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--sol)}
.painel::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.painel::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.painel.direita{margin-left:auto}
.painel.largo{max-width:1040px;margin:0 auto}
.painel h2{font:700 clamp(28px,3.2vw,44px)/1.1 var(--disp);margin:14px 0 16px;letter-spacing:-.01em}
.painel h2 em{font-style:normal;color:var(--sol);text-shadow:0 0 24px rgba(255,210,122,.45)}
.painel p{color:rgba(244,241,228,.82);margin:0}
.painel small{display:block;margin-top:10px;font:12px var(--mono);color:rgba(157,255,196,.6)}
.eq{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 18px}
.eq div{border:1px solid var(--borda);padding:12px 16px;text-align:center;background:rgba(0,0,0,.18)}
.eq b{display:block;font:700 24px var(--disp)}
.eq span{font:11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--verde)}
.eq i{font:300 26px var(--disp);color:var(--sol);font-style:normal}
.eq .eq-fim{border-color:var(--sol);box-shadow:0 0 24px rgba(255,210,122,.25)}
.eq .eq-fim b{color:var(--sol)}

/* raízes: painel fixo e rótulos dos galhos */
.raiz-hud{position:fixed;left:4vw;top:50%;transform:translate(-30px,-50%);width:min(380px,90vw);z-index:15;padding:22px 22px 18px;background:rgba(4,14,10,.62);backdrop-filter:blur(14px);border:1px solid var(--borda);opacity:0;pointer-events:none;transition:opacity .6s,transform .6s}
body.na-raiz .raiz-hud{opacity:1;transform:translate(0,-50%)}
.rh-msg{margin:14px 0;padding:12px 14px;background:rgba(244,241,228,.94);color:#14231b;border-radius:14px 14px 14px 3px}
.rh-msg span{font:600 12px var(--fonte);color:#2f7a4c}
.rh-msg p{margin:4px 0 0;font-size:15px;line-height:1.45}
.rh-perg{font:12px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(244,241,228,.6)}
.rh-saida{margin-top:8px;min-height:44px;display:flex;align-items:baseline;gap:12px}
.rh-saida b{font:700 26px var(--disp);color:var(--sol);text-shadow:0 0 22px rgba(255,210,122,.6)}
.rh-saida span{font:13px var(--mono);color:var(--verde)}
#rotulos{position:fixed;inset:0;pointer-events:none;z-index:14}
.rot-galho{position:absolute;left:0;top:0;opacity:0;transition:opacity .4s;text-align:center;font:500 12px var(--mono);letter-spacing:.06em;white-space:nowrap;text-shadow:0 0 10px #000}
.rot-galho b{display:block;font:500 12px var(--fonte);color:rgba(244,241,228,.85)}
.rot-galho span{color:var(--verde)}
.rot-galho.venc b{color:var(--sol);font-weight:600;font-size:14px}
.rot-galho.venc span{color:var(--sol)}

/* contraste */
.duas{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.lado-a,.lado-b{padding:20px;border:1px solid rgba(157,255,196,.3);background:rgba(0,0,0,.2)}
.lado-b{border-color:var(--sol);box-shadow:0 0 30px rgba(255,210,122,.15),inset 0 0 30px rgba(157,255,196,.05)}
.duas b{font:700 14px var(--disp);letter-spacing:.18em;text-transform:uppercase}
.lado-b b{color:var(--sol)}
.lado-a p{color:rgba(244,241,228,.8)!important;margin:6px 0!important}
.lado-a .grande{font:900 64px/1 var(--disp);margin:12px 0 4px!important;background:linear-gradient(180deg,#fffbe8,var(--sol) 60%,var(--folha));-webkit-background-clip:text;background-clip:text;color:transparent!important}
.lado-b pre{font:14px/1.6 var(--mono);color:var(--verde);margin:10px 0;text-shadow:0 0 12px rgba(157,255,196,.4)}
.duas ul{margin:0;padding-left:18px;font-size:14.5px;color:rgba(244,241,228,.78)}

/* casos holográficos */
.holos{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:10px}
.holo{position:relative;padding:16px 16px 14px;border:1px solid rgba(157,255,196,.22);background:linear-gradient(160deg,rgba(157,255,196,.08),rgba(255,210,122,.04));overflow:hidden;transition:transform .3s,border-color .3s}
.holo::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(157,255,196,.04) 3px 4px);pointer-events:none}
.holo:hover{transform:translateY(-4px);border-color:var(--sol)}
.holo b{display:block;font:600 15px var(--disp);margin-bottom:6px}
.holo p{font-size:13.5px!important;line-height:1.45}
.holo code{display:block;margin-top:10px;font:11.5px var(--mono);color:var(--sol)}
.holo .med{position:absolute;top:12px;right:12px;font:11px var(--mono);color:var(--verde)}

/* números */
.nums{display:grid;grid-template-columns:1fr 1fr;gap:22px 28px;margin-top:16px}
.nums b{font:900 64px/1 var(--disp);background:linear-gradient(180deg,#fffbe8,var(--sol) 60%,var(--folha));-webkit-background-clip:text;background-clip:text;color:transparent}
.nums i{font:300 30px var(--disp);color:var(--sol);font-style:normal;margin-left:4px}
.nums span{display:block;font-size:14px;color:rgba(244,241,228,.75);margin-top:6px}

/* fim */
.fim{align-items:flex-end;padding-bottom:60px}
.fim-dentro{width:100%;max-width:1100px;margin:0 auto}
.fim h2{font:900 clamp(34px,5vw,74px)/1 var(--disp);letter-spacing:-.02em;margin:0 0 28px;color:#fffbe8;text-shadow:0 2px 40px rgba(0,0,0,.35)}
.portas{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.portas a{text-decoration:none;padding:20px;background:rgba(6,20,14,.5);backdrop-filter:blur(12px);border:1px solid var(--borda);transition:transform .25s,border-color .25s,box-shadow .25s}
.portas a:hover{transform:translateY(-4px);border-color:var(--sol);box-shadow:0 0 30px rgba(255,210,122,.25)}
.portas b{display:block;font:600 17px var(--disp);margin-bottom:4px}
.portas span{font-size:14px;color:rgba(244,241,228,.72)}
.fim footer{margin-top:34px;font:12px var(--mono);letter-spacing:.06em;color:rgba(244,241,228,.6)}
.fim footer a{color:var(--sol)}

.surge{opacity:0;transform:translateY(30px);transition:opacity 1s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
.surge.visto{opacity:1;transform:none}
@media (max-width:900px){
  .holos,.portas{grid-template-columns:1fr 1fr}.duas{grid-template-columns:1fr}
  .hud-topo nav a:not(.hud-botao){display:none}.hud-lado{display:none}
  .painel{padding:26px 22px}.raiz-hud{left:50%;top:auto;bottom:16px;transform:translate(-50%,20px)}body.na-raiz .raiz-hud{transform:translate(-50%,0)}
}
@media (max-width:520px){.holos,.portas,.nums{grid-template-columns:1fr}.tela{padding:96px 16px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.titulo span{opacity:1;transform:none}.surge{opacity:1;transform:none}}

/* IA de decisão: três passos */
.tres{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px;counter-reset:t}
.tres li{counter-increment:t;display:grid;grid-template-columns:34px 1fr;column-gap:12px;align-items:baseline}
.tres li::before{content:counter(t);grid-row:span 2;width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--sol);color:var(--sol);font:700 13px var(--disp);box-shadow:0 0 14px rgba(255,210,122,.25)}
.tres b{font:600 15px var(--disp)}
.tres span{font-size:14px;color:rgba(244,241,228,.72)}

/* faixas de exemplos */
.casos{display:block;padding:110px 0}
.casos-dentro{width:100%}
.casos-cab{max-width:1040px;margin:0 auto 26px;padding:0 6vw}
.casos-cab h2{font:700 clamp(28px,3.2vw,44px)/1.1 var(--disp);margin:14px 0 0;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.faixa{overflow:hidden;padding:8px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.trilho{display:flex;gap:14px;width:max-content;animation:corre 90s linear infinite}
.faixa.ao-contrario .trilho{animation-direction:reverse;animation-duration:110s}
.faixa:hover .trilho{animation-play-state:paused}
@keyframes corre{to{transform:translateX(-50%)}}
.ex{position:relative;width:300px;flex:none;padding:16px 18px 14px;background:rgba(6,22,15,.55);backdrop-filter:blur(12px);border:1px solid rgba(157,255,196,.22);transition:border-color .3s,transform .3s}
.ex:hover{border-color:var(--sol);transform:translateY(-3px)}
.ex .area{font:11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--verde)}
.ex .q{font:600 16px/1.3 var(--disp);margin:8px 0 10px}
.ex .ops{display:flex;flex-wrap:wrap;gap:6px}
.ex .ops span{font:12px var(--mono);padding:3px 8px;border:1px solid rgba(244,241,228,.18);color:rgba(244,241,228,.85)}

.ex .med{position:absolute;top:14px;right:14px;font:11px var(--mono);color:var(--sol)}
.ex .img{position:absolute;top:14px;right:14px;font:11px var(--mono);color:var(--verde)}
.aberto{display:block;max-width:1040px;margin:26px auto 0;padding:0 6vw;font:500 clamp(18px,1.8vw,24px) var(--disp);color:var(--sol2);text-decoration:none;text-shadow:0 0 24px rgba(255,210,122,.4)}
.aberto:hover{color:var(--sol)}

.marca .logo{height:26px;width:auto;filter:none}

/* a mecânica: máquina de combinações */
.combo{display:grid;grid-template-columns:1.35fr 18px 1fr 18px 1fr 18px .9fr;align-items:stretch;gap:8px;margin:22px 0 16px}
.cb-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.cb-rot{font:11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--verde)}
.cb-jan{flex:1;min-height:132px;border:1px solid rgba(157,255,196,.2);background:rgba(0,0,0,.22);padding:14px;overflow:hidden}
.cb-fim .cb-jan{border-color:rgba(255,210,122,.45)}
.cb-item{transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .32s;display:flex;flex-direction:column;gap:8px}
.cb-item.sai{transform:translateY(-14px);opacity:0}
.cb-fonte{font:11px var(--mono);color:rgba(244,241,228,.5);text-transform:uppercase;letter-spacing:.1em}
.cb-txt{font-size:14px;line-height:1.45;color:rgba(244,241,228,.88)}
.cb-q{font:500 16px/1.35 var(--disp)}
#cb-o{flex-direction:row;flex-wrap:wrap;align-content:flex-start}
.cb-op{display:inline-block;font:12.5px var(--mono);padding:3px 8px;border:1px solid rgba(244,241,228,.16);color:rgba(244,241,228,.75)}
.cb-item b{font:600 20px var(--disp);color:var(--sol)}
.cb-cert{height:2px;background:rgba(244,241,228,.12)}
.cb-cert i{display:block;height:100%;background:var(--sol)}
.cb-pct{font:12px var(--mono);color:rgba(244,241,228,.65)}
.cb-seta{align-self:center;height:1px;background:linear-gradient(90deg,rgba(157,255,196,.15),rgba(157,255,196,.7));position:relative;top:10px}
.cb-seta::after{content:"";position:absolute;right:-1px;top:-3px;border:3.5px solid transparent;border-left:5px solid rgba(157,255,196,.8)}
.cb-pe{font-size:16px!important;color:var(--sol2)!important}
@media (max-width:900px){.combo{grid-template-columns:1fr}.cb-seta{display:none}.cb-jan{min-height:auto}}