/* Evrima Live Map — site. Gavazzi Labs.
   Fontes servidas daqui mesmo (nada de terceiros rastreando quem visita). */
@font-face{ font-family:"Geist"; src:url(fonts/geist.woff2) format("woff2"); font-weight:300 700; font-display:swap; }
@font-face{ font-family:"Geist Mono"; src:url(fonts/geist-mono.woff2) format("woff2"); font-weight:400 600; font-display:swap; }
@font-face{ font-family:"Russo One"; src:url(fonts/russo-one.woff2) format("woff2"); font-weight:400; font-display:swap; }

:root{
  --bg:#07090c; --bg-2:#0b0f14; --bg-3:#10161d;
  --ink:#e9efe9; --ink-2:#aab4ad; --mute:#7f8a83;
  --line:rgba(233,239,233,.08); --line-2:rgba(233,239,233,.14);
  --acc:#2ee87a; --acc-2:#8dffbd; --acc-3:#0fb35a; --acc-ink:#03170b;
  --hud:#6fe9df; --hud-bg:rgba(6,12,20,.86); --hud-line:rgba(111,233,223,.34);
  --raio:14px; --faixa:1160px; --gut:24px;
  --sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"Geist Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --marca:"Russo One","Geist",sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:84px; }
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }
body{ margin:0; background:var(--bg); color:var(--ink); font:400 17px/1.6 var(--sans);
      -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:clip; }
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,p,dl,dd,ul,ol,figure{ margin:0; }
ul,ol{ padding:0; list-style:none; }
button{ font:inherit; color:inherit; }
::selection{ background:rgba(46,232,122,.28); color:#fff; }
:focus-visible{ outline:2px solid var(--acc); outline-offset:3px; border-radius:6px; }
.mono{ font-family:var(--mono); }
.faixa{ width:100%; max-width:var(--faixa); margin:0 auto; padding:0 var(--gut); }
.pular{ position:absolute; left:16px; top:-60px; z-index:100; background:var(--acc); color:var(--acc-ink);
        padding:10px 14px; border-radius:10px; font-weight:600; transition:top .2s var(--ease); }
.pular:focus{ top:12px; }

/* ---------- botoes ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:0 22px;
      border-radius:12px; border:1px solid transparent; cursor:pointer; white-space:nowrap;
      font:600 15.5px/1 var(--sans); letter-spacing:-.005em;
      background:var(--acc); color:var(--acc-ink);
      box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 10px 30px -10px rgba(46,232,122,.55);
      transition:transform .18s var(--ease), box-shadow .18s var(--ease), background-color .18s; }
.btn:hover{ background:#4cf08f; transform:translateY(-1px); box-shadow:0 1px 0 rgba(255,255,255,.35) inset, 0 14px 34px -10px rgba(46,232,122,.7); }
.btn:active{ transform:translateY(0); }
.btn .ic{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.btn-sm{ min-height:40px; padding:0 16px; font-size:14px; border-radius:10px; }
.btn-lg{ min-height:56px; padding:0 30px; font-size:16.5px; border-radius:14px; }
.btn-sec{ background:transparent; color:var(--ink); border-color:var(--line-2); box-shadow:none; }
.btn-sec:hover{ background:rgba(233,239,233,.05); border-color:rgba(46,232,122,.5); box-shadow:none; }
.link-seta{ font-weight:500; color:var(--ink-2); display:inline-flex; align-items:center; gap:8px; min-height:48px; transition:color .18s; }
.link-seta::after{ content:""; width:8px; height:8px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(45deg) translate(-2px,-2px); transition:transform .25s var(--ease); }
.link-seta:hover{ color:var(--ink); }
.link-seta:hover::after{ transform:rotate(45deg) translate(1px,1px); }

/* ---------- topo ---------- */
.topo{ position:fixed; inset:0 0 auto; z-index:50; transition:background-color .3s, border-color .3s, backdrop-filter .3s;
       border-bottom:1px solid transparent; }
.topo.solido{ background:rgba(7,9,12,.78); border-color:var(--line); backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2); }
.topo-in{ display:flex; align-items:center; gap:28px; height:68px; }
.marca{ display:flex; align-items:center; gap:10px; margin-right:auto; min-height:44px; }
.marca-rex{ width:38px; height:auto; }
.marca-nome{ font:400 16px/1 var(--marca); letter-spacing:.02em; }
.menu{ display:flex; gap:26px; }
.menu a{ font-size:14.5px; color:var(--ink-2); padding:10px 0; position:relative; transition:color .18s; }
.menu a::after{ content:""; position:absolute; left:0; right:0; bottom:4px; height:1.5px; background:var(--acc);
                transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.menu a:hover{ color:var(--ink); }
.menu a:hover::after,.menu a.atual::after{ transform:scaleX(1); }
.menu a.atual{ color:var(--ink); }
.topo-acoes{ display:flex; align-items:center; gap:14px; }
.idioma{ display:flex; border:1px solid var(--line-2); border-radius:999px; padding:3px; }
.idioma button{ border:0; background:none; cursor:pointer; min-width:44px; min-height:40px; padding:0 10px; border-radius:999px;
                font:500 12.5px/1 var(--mono); color:var(--mute); transition:color .18s, background-color .18s; }
.idioma button[aria-pressed="true"]{ background:rgba(233,239,233,.09); color:var(--ink); }
.idioma button:hover{ color:var(--ink); }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; overflow:hidden; isolation:isolate; padding:120px 0 120px; }
.hero-bg{ position:absolute; inset:-6% -2% -6% -2%; z-index:-1; will-change:transform; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:60% 50%;
              filter:saturate(.92) contrast(1.04); animation:respira 28s ease-in-out infinite alternate; }
.hero-bg::after{ content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(7,9,12,.96) 0%, rgba(7,9,12,.86) 34%, rgba(7,9,12,.38) 62%, rgba(7,9,12,.2) 100%),
    linear-gradient(180deg, rgba(7,9,12,.55) 0%, rgba(7,9,12,0) 22%, rgba(7,9,12,0) 70%, var(--bg) 100%); }
@keyframes respira{ from{ transform:scale(1.04) translate3d(0,0,0); } to{ transform:scale(1.11) translate3d(-1.6%,-1%,0); } }
.trilha{ position:absolute; inset:0; width:100%; height:100%; z-index:1; }
.trilha path{ fill:none; stroke:url(#trilhaCor); stroke-width:2.4; stroke-linecap:round; stroke-dasharray:2 9;
              vector-effect:non-scaling-stroke; opacity:.9; filter:drop-shadow(0 0 4px rgba(46,232,122,.7));
              animation:anda 2.4s linear infinite; }
@keyframes anda{ to{ stroke-dashoffset:-22; } }
.jogador{ position:absolute; left:73.5%; top:50%; z-index:2; width:16px; height:16px; margin:-8px 0 0 -8px; }
.jogador i{ position:absolute; inset:0; border-radius:50%; background:var(--acc); border:2.5px solid #eafff2;
            box-shadow:0 0 0 1px rgba(3,23,11,.6), 0 0 18px rgba(46,232,122,.9); }
.jogador::before,.jogador::after{ content:""; position:absolute; inset:-14px; border-radius:50%; border:1.5px solid rgba(46,232,122,.7);
            animation:pulso 2.4s var(--ease) infinite; }
.jogador::after{ animation-delay:1.2s; }
@keyframes pulso{ from{ transform:scale(.3); opacity:1; } to{ transform:scale(1.6); opacity:0; } }
.hero-in{ position:relative; z-index:3; }
.hero-txt{ max-width:600px; }
.hero-rex{ width:150px; margin:0 0 22px -8px; }
.olho-mono{ font:500 12px/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--acc); margin-bottom:18px; }
.hero h1{ font-weight:600; font-size:clamp(42px,6.4vw,84px); line-height:.98; letter-spacing:-.045em; text-wrap:balance; }
.hero-sub{ margin-top:22px; font-size:clamp(17px,1.6vw,20px); line-height:1.55; color:var(--ink-2); max-width:520px; text-wrap:pretty; }
.hero-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 26px; margin-top:34px; }
.hero-meta{ margin-top:18px; font-size:12.5px; color:var(--mute); letter-spacing:.02em; }
.hero-coords{ position:absolute; z-index:3; left:0; right:0; bottom:28px; display:flex; flex-wrap:wrap; gap:8px 26px;
              max-width:var(--faixa); margin:0 auto; padding:0 var(--gut); font-size:12px; letter-spacing:.08em; color:var(--mute); }
.hero-coords b{ font-weight:500; color:var(--ink-2); font-variant-numeric:tabular-nums; margin-left:4px; }
.vivo{ display:inline-flex; align-items:center; gap:8px; color:var(--acc); text-transform:uppercase; }
.vivo i{ width:7px; height:7px; border-radius:50%; background:var(--acc); box-shadow:0 0 10px var(--acc); animation:pisca 1.6s ease-in-out infinite; }
@keyframes pisca{ 50%{ opacity:.3; } }
/* entrada do hero (so CSS: aparece mesmo sem JS) */
.hero-txt > *{ animation:sobe .9s var(--ease) both; }
.hero-txt > :nth-child(2){ animation-delay:.08s; } .hero-txt > :nth-child(3){ animation-delay:.14s; }
.hero-txt > :nth-child(4){ animation-delay:.22s; } .hero-txt > :nth-child(5){ animation-delay:.3s; } .hero-txt > :nth-child(6){ animation-delay:.36s; }
.hero-coords{ animation:sobe 1s .5s var(--ease) both; }
@keyframes sobe{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

/* ---------- secoes ---------- */
.secao{ padding:140px 0; position:relative; }
.secao-cab{ max-width:760px; margin-bottom:64px; }
.secao h2{ font-weight:600; font-size:clamp(32px,4.2vw,56px); line-height:1.04; letter-spacing:-.038em; text-wrap:balance; }
.secao-lead{ margin-top:20px; font-size:clamp(17px,1.4vw,19px); color:var(--ink-2); max-width:620px; text-wrap:pretty; }

/* revelar ao rolar: so quem comeca FORA da tela ganha o estado escondido (sem JS, tudo aparece) */
[data-r].pre{ opacity:0; transform:translateY(28px); }
[data-r].vis{ opacity:1; transform:none; transition:opacity .9s var(--ease), transform .9s var(--ease); transition-delay:var(--d,0s); }

/* ---------- historia (rolagem que conta) ---------- */
.historia{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:72px; align-items:start; }
.historia-passos{ padding:8vh 0 24vh; }
.passo{ min-height:58vh; display:flex; flex-direction:column; justify-content:center; padding-left:28px; border-left:1px solid var(--line-2);
        opacity:.35; transition:opacity .5s var(--ease), border-color .5s; position:relative; }
.passo::before{ content:""; position:absolute; left:-1px; top:50%; width:1px; height:0; background:var(--acc); transform:translateY(-50%);
                transition:height .6s var(--ease); }
.passo.ativo{ opacity:1; }
.passo.ativo::before{ height:100%; }
.passo-n{ font-size:12px; letter-spacing:.14em; color:var(--acc); margin-bottom:14px; }
.passo h3{ font-size:clamp(24px,2.4vw,32px); font-weight:600; letter-spacing:-.025em; line-height:1.15; }
.passo p:last-child{ margin-top:12px; color:var(--ink-2); max-width:420px; }
.historia-palco{ position:sticky; top:0; height:100vh; display:flex; align-items:center; }
.historia-palco .palco{ width:100%; }
.palco{ position:relative; aspect-ratio:16/10; border-radius:20px; overflow:hidden; border:1px solid var(--line-2);
        background:var(--bg-3); box-shadow:0 40px 120px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(0,0,0,.4); }
.palco-fundo{ position:absolute; inset:-20px; background:url(img/ilha-1200.webp) 30% 60%/cover;
              filter:blur(3px) brightness(.42) saturate(.75); }
.palco-fundo::after{ content:""; position:absolute; inset:0; background:radial-gradient(120% 90% at 50% 40%, transparent 40%, rgba(0,0,0,.55)); }
.palco-leg{ position:absolute; left:16px; bottom:12px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:rgba(233,239,233,.42); }

/* janelinhas (replica fiel dos overlays do app) */
.ov{ position:absolute; color:var(--hud); font-family:var(--mono); background:var(--hud-bg); border:1px solid var(--hud-line);
     border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.45); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
     transition:opacity .55s var(--ease), transform .55s var(--ease), filter .55s var(--ease), box-shadow .55s; opacity:.32; filter:saturate(.4); }
.palco[data-ativo="0"] .ov[data-ov="0"], .palco[data-ativo="1"] .ov[data-ov="1"], .palco[data-ativo="2"] .ov[data-ov="2"]{
  opacity:1; filter:none; transform:scale(1.04); box-shadow:0 0 0 1px rgba(111,233,223,.25), 0 18px 50px rgba(0,0,0,.55), 0 0 40px -6px rgba(111,233,223,.35); }
.ov-stats{ left:3.5%; top:5%; width:31%; padding:12px 14px; transform-origin:top left; }
.ov-especie{ font:600 13px/1.2 var(--sans); color:#eafffb; }
.ov-serv{ font-size:9.5px; color:rgba(111,233,223,.6); margin:2px 0 10px; letter-spacing:.04em; }
.barras{ display:grid; gap:7px; }
.barras li{ display:grid; grid-template-columns:1fr auto; align-items:center; gap:3px 8px; font-size:10px; }
.barras span{ color:rgba(234,255,251,.75); }
.barras b{ font-weight:500; color:#eafffb; font-variant-numeric:tabular-nums; }
.barras .b{ grid-column:1/-1; height:4px; border-radius:99px; background:rgba(255,255,255,.08); position:relative; overflow:hidden; }
.barras .b::after{ content:""; position:absolute; inset:0 auto 0 0; width:var(--v); border-radius:inherit; background:var(--c); box-shadow:0 0 8px var(--c);
                   transition:width 1.2s var(--ease); }
.b-cresc{ --v:65%; --c:#6fe9df; } .b-vida{ --v:81%; --c:#ef4444; } .b-fome{ --v:52%; --c:#f59e0b; } .b-sede{ --v:43%; --c:#38bdf8; }
.ov-relogio{ margin-top:10px; font-size:9.5px; color:rgba(111,233,223,.6); }
.ov-relogio b{ color:#eafffb; font-weight:500; }
.ov-coords{ right:3.5%; top:5%; padding:10px 14px; transform-origin:top right; }
.ov-coords p{ display:flex; gap:14px; justify-content:space-between; font-size:11.5px; line-height:1.55; }
.ov-coords span{ color:rgba(111,233,223,.65); }
.ov-coords b{ font-weight:500; color:#eafffb; font-variant-numeric:tabular-nums; }
.ov-vivo{ justify-content:flex-end !important; font-size:9px !important; color:var(--hud); text-transform:uppercase; letter-spacing:.12em; margin-top:2px; }
.ov-mini{ right:3.5%; top:36%; width:26%; padding:0; background:none; border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none;
          display:flex; flex-direction:column; align-items:center; gap:8px; transform-origin:top right; }
.palco[data-ativo="0"] .ov-mini{ box-shadow:none; }
.mini-disco{ position:relative; width:100%; aspect-ratio:1; border-radius:50%; overflow:hidden; border:2px solid var(--hud-line);
             box-shadow:0 0 0 1px rgba(0,0,0,.5), 0 12px 30px rgba(0,0,0,.5), inset 0 0 30px rgba(0,0,0,.45); }
.palco[data-ativo="0"] .mini-disco{ border-color:rgba(111,233,223,.7); box-shadow:0 0 30px -4px rgba(111,233,223,.45), 0 12px 30px rgba(0,0,0,.5); }
.mini-mapa{ position:absolute; inset:-18%; background:url(img/mini.webp) center/cover; animation:gira 26s linear infinite; }
@keyframes gira{ to{ transform:rotate(360deg); } }
.mini-n{ position:absolute; top:6px; left:50%; transform:translateX(-50%); font:600 9px/1 var(--mono); color:#eafffb; text-shadow:0 1px 2px #000; }
.mini-seta{ position:absolute; left:50%; top:50%; width:20%; transform:translate(-50%,-50%); filter:drop-shadow(0 0 6px rgba(46,232,122,.9)) drop-shadow(0 1px 1px #000); }
.mini-seta path{ fill:var(--acc); stroke:#03170b; stroke-width:1.2; stroke-linejoin:round; }
.mini-leg{ font-size:9.5px; color:#eafffb; background:var(--hud-bg); border:1px solid var(--hud-line); border-radius:99px; padding:3px 9px; white-space:nowrap; }

/* ---------- mapa HD ---------- */
.secao-hd{ background:linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 18%, var(--bg-2) 82%, var(--bg) 100%); }
.hd-grade{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:80px; align-items:center; }
.numeros{ display:grid; gap:0; margin-top:40px; border-top:1px solid var(--line); }
.numeros div{ display:flex; justify-content:space-between; align-items:baseline; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); }
.numeros dt{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); }
.numeros dd{ font-weight:500; font-variant-numeric:tabular-nums; text-align:right; }
.cmp{ position:relative; aspect-ratio:1; border-radius:20px; overflow:hidden; border:1px solid var(--line-2); touch-action:pan-y;
      box-shadow:0 40px 120px -40px rgba(0,0,0,.9); --p:50%; background:var(--bg-3); user-select:none; -webkit-user-select:none; }
.cmp-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none; }
.cmp-depois{ position:absolute; inset:0; clip-path:inset(0 0 0 var(--p)); }
.cmp-linha{ position:absolute; top:0; bottom:0; left:var(--p); width:2px; margin-left:-1px; background:#eafff2;
            box-shadow:0 0 0 1px rgba(0,0,0,.25), 0 0 16px rgba(0,0,0,.5); pointer-events:none; }
.cmp-puxador{ position:absolute; top:50%; left:50%; width:46px; height:46px; margin:-23px 0 0 -23px; border-radius:50%;
              background:#eafff2; display:grid; place-items:center; box-shadow:0 6px 20px rgba(0,0,0,.45); transition:transform .2s var(--ease); }
.cmp-puxador svg{ width:20px; height:20px; fill:none; stroke:#03170b; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.cmp:hover .cmp-puxador, .cmp.arrastando .cmp-puxador{ transform:scale(1.08); }
.cmp{ cursor:ew-resize; }
.cmp-range{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.cmp-range:focus-visible + figcaption{ color:var(--ink); }
.cmp:has(.cmp-range:focus-visible){ outline:2px solid var(--acc); outline-offset:4px; }
.cmp-rot{ position:absolute; top:16px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; padding:6px 10px; border-radius:8px;
          background:rgba(7,9,12,.72); color:var(--ink); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); pointer-events:none; }
.cmp-rot-a{ left:16px; } .cmp-rot-b{ right:16px; color:var(--acc-2); }
.cmp figcaption{ position:absolute; left:0; right:0; bottom:0; padding:28px 18px 14px; font-size:11.5px; color:rgba(233,239,233,.7);
                 background:linear-gradient(transparent, rgba(7,9,12,.8)); pointer-events:none; text-align:center; letter-spacing:.04em; }

/* ---------- seguranca ---------- */
.garantias{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--line-2); counter-reset:g; }
.garantias li{ padding:36px 32px 8px 0; position:relative; counter-increment:g; }
.garantias li + li{ padding-left:32px; border-left:1px solid var(--line); }
.garantias li::before{ content:"0" counter(g); display:block; font:500 12px/1 var(--mono); letter-spacing:.14em; color:var(--acc); margin-bottom:22px; }
.garantias h3{ font-size:22px; font-weight:600; letter-spacing:-.02em; line-height:1.2; }
.garantias p{ margin-top:12px; color:var(--ink-2); font-size:16px; }
.fatos{ display:flex; flex-wrap:wrap; gap:10px; margin-top:64px; }
.fatos li{ font-size:12.5px; letter-spacing:.04em; color:var(--ink-2); border:1px solid var(--line-2); border-radius:999px; padding:9px 15px;
           display:flex; align-items:center; gap:9px; }
.fatos li::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--acc); }

/* ---------- baixar ---------- */
.secao-baixar{ padding-top:60px; }
.baixar-card{ position:relative; text-align:center; padding:80px 32px 64px; border-radius:28px; overflow:hidden; isolation:isolate;
              border:1px solid var(--line-2);
              background:radial-gradient(70% 90% at 50% 0%, rgba(46,232,122,.13), transparent 70%), var(--bg-2); }
.baixar-card::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:.18;
  background:url(img/ilha-1200.webp) center/cover; mask-image:linear-gradient(180deg, #000, transparent 75%); -webkit-mask-image:linear-gradient(180deg, #000, transparent 75%); }
.baixar-rex{ width:132px; height:auto; margin:0 auto 26px; filter:drop-shadow(0 0 22px rgba(46,232,122,.35)); }
.baixar-card .secao-lead{ margin:16px auto 34px; }
.primeira{ margin-top:96px; }
.primeira h3{ font-size:clamp(22px,2.2vw,28px); font-weight:600; letter-spacing:-.022em; }
.primeira-lead{ margin-top:10px; color:var(--ink-2); max-width:640px; }
.avisos{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:36px; }
.aviso figcaption{ margin-top:16px; color:var(--ink-2); font-size:15.5px; }
.aviso figcaption b{ color:var(--acc); font-family:var(--mono); font-weight:500; margin-right:4px; }
.aviso em{ font-style:normal; color:var(--ink); font-weight:500; }
.win{ position:relative; aspect-ratio:16/10; border-radius:14px; overflow:hidden; border:1px solid var(--line-2);
      font-family:"Segoe UI",var(--sans); box-shadow:0 24px 70px -30px rgba(0,0,0,.85); }
/* SmartScreen (ilustracao simplificada) */
.win-ss{ background:#0b5394; color:#fff; padding:7% 8%; }
.ss-a,.ss-b{ position:absolute; inset:0; padding:7% 8%; transition:opacity .35s; }
.ss-b{ opacity:0; }
.win-ss.passo2 .ss-a{ opacity:0; } .win-ss.passo2 .ss-b{ opacity:1; }
.ss-t{ font-size:clamp(15px,1.7vw,21px); font-weight:300; line-height:1.2; }
.ss-p{ margin-top:10px; font-size:clamp(10px,1vw,12.5px); line-height:1.5; opacity:.92; }
.ss-link{ display:inline-block; margin-top:10px; font-size:clamp(10px,1vw,12.5px); text-decoration:underline; text-underline-offset:2px; }
.ss-bts{ position:absolute; right:8%; bottom:9%; display:flex; gap:8px; }
.ss-bt{ font-size:clamp(9.5px,.95vw,12px); padding:6px 12px; border:1px solid rgba(255,255,255,.75); }
.ss-run{ transition:background-color .2s; }
.win-ss.clique2 .ss-run{ background:rgba(255,255,255,.25); }
/* UAC (ilustracao simplificada) */
.win-uac{ background:#1f1f1f; color:#fff; display:flex; flex-direction:column; }
.uac-topo{ background:#f2c94c; color:#1b1b1b; padding:6% 7%; }
.uac-topo p{ font-size:clamp(12px,1.35vw,16.5px); line-height:1.3; }
.uac-corpo{ padding:5% 7%; flex:1; position:relative; }
.uac-app{ font-size:clamp(11px,1.1vw,14px); }
.uac-forn{ margin-top:6px; font-size:clamp(9.5px,.95vw,12px); color:#c8c8c8; }
.uac-bts{ position:absolute; left:7%; right:7%; bottom:12%; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.uac-bt{ text-align:center; font-size:clamp(9.5px,.95vw,12px); padding:7px 0; background:#3a3a3a; }
.uac-sim{ background:#3a3a3a; outline:1.5px solid rgba(46,232,122,.85); outline-offset:2px; animation:convida 2.2s ease-in-out infinite; }
@keyframes convida{ 50%{ outline-color:rgba(46,232,122,.25); } }
.cursor{ position:absolute; left:20%; top:96%; width:18px; height:22px; z-index:3; pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 22'%3E%3Cpath d='M1 1v17l4.5-4 3 7 3-1.3-3-6.8H15z' fill='%23fff' stroke='%23000' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat;
  transition:left .8s var(--ease), top .8s var(--ease), transform .12s; }
.cursor.aperta{ transform:scale(.85); }

/* ---------- apoiar ---------- */
.formas{ border-top:1px solid var(--line-2); }
.forma{ display:grid; grid-template-columns:110px minmax(0,1fr) auto; align-items:center; gap:24px; padding:28px 0; border-bottom:1px solid var(--line); }
.forma-tag{ font-size:12px; letter-spacing:.16em; color:var(--acc); }
.forma h3{ font-size:20px; font-weight:600; letter-spacing:-.015em; }
.forma-txt p{ margin-top:4px; color:var(--ink-2); font-size:15.5px; }
.forma-acao{ display:flex; justify-content:flex-end; min-width:150px; }
.breve{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); border:1px dashed var(--line-2); border-radius:999px; padding:9px 14px; }
.forma .btn, .forma.pronta .breve{ display:none; }
.forma.pronta .btn{ display:inline-flex; }
.forma.aberta .btn{ border-color:rgba(46,232,122,.6); background:rgba(46,232,122,.08); }
.painel-doacao{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:32px; align-items:center; margin-top:24px; padding:28px; border-radius:18px;
                border:1px solid var(--line-2); background:var(--bg-2); animation:abre .45s var(--ease); }
.painel-doacao[hidden]{ display:none; }
@keyframes abre{ from{ opacity:0; transform:translateY(-8px); } }
.pd-rot{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); margin-bottom:12px; }
.valores, .abas-cripto{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.valores button, .abas-cripto button{ min-height:40px; padding:0 16px; border-radius:10px; border:1px solid var(--line-2); background:transparent;
                  cursor:pointer; font:500 14px/1 var(--mono); color:var(--ink-2); transition:all .18s; }
.valores button:hover, .abas-cripto button:hover{ color:var(--ink); border-color:rgba(233,239,233,.3); }
.valores button[aria-pressed="true"], .abas-cripto button[aria-selected="true"]{ color:var(--acc-ink); background:var(--acc); border-color:var(--acc); }
.endereco{ display:block; font:400 13.5px/1.5 var(--mono); color:var(--ink); word-break:break-all; padding:12px 14px; border-radius:10px;
           background:var(--bg); border:1px solid var(--line); margin-bottom:16px; }
.pd-ok{ min-height:20px; margin-top:10px; font-size:12.5px; color:var(--acc); }
.qr{ width:200px; height:200px; padding:12px; background:#fff; border-radius:14px; }
.qr svg, .qr img{ width:100%; height:100%; }

/* ---------- rodape ---------- */
.rodape{ border-top:1px solid var(--line); padding:56px 0 64px; margin-top:40px; }
.rodape-in{ display:grid; grid-template-columns:auto 1fr; gap:28px 40px; align-items:center; }
.rodape-marca{ display:flex; align-items:center; gap:14px; }
.rodape-marca img{ width:44px; height:auto; }
.rodape-labs{ margin-top:6px; font-size:12px; color:var(--mute); letter-spacing:.04em; }
.rodape-links{ display:flex; flex-wrap:wrap; gap:6px 26px; justify-content:flex-end; }
.rodape-links a{ color:var(--ink-2); font-size:14.5px; min-height:44px; display:inline-flex; align-items:center; transition:color .18s; }
.rodape-links a:hover{ color:var(--ink); }
.rodape-legal{ grid-column:1/-1; font-size:12.5px; line-height:1.6; color:var(--mute); max-width:760px; padding-top:24px; border-top:1px solid var(--line); }

/* ---------- rex (componente do app; o CSS dele mora aqui por causa do CSP) ---------- */
.rexl{ position:relative; width:100%; pointer-events:none; user-select:none; }
.rexl svg{ display:block; width:100%; height:auto; overflow:visible; }
.rexl .f{ fill:#0b1726; }
.rexl .e{ fill:none; stroke-width:2.2; stroke-linejoin:round; stroke-linecap:round; }
.rexl .lg{ fill:none; stroke-linecap:round; stroke-linejoin:round; }
.rexl .lf{ fill:none; stroke-linecap:round; stroke-linejoin:round; }
.rexl .th{ stroke-width:1.2; }
.rexl.logo .f{ fill:var(--rexl-fill,#2ee87a); }
.rexl.logo .lf{ stroke:var(--rexl-fill,#2ee87a); }
.rexl.logo .lf.tras{ stroke:#0e9a4f; }
.rexl.logo .e, .rexl.logo .lg{ stroke:#032a17; }
.rexl.logo .th{ fill:#effff5; stroke:#032a17; }
.rexl.logo .olho{ fill:#032a17; }
.rexl.logo .lg.perna{ display:none; }
.rexl .lo{ fill:none; stroke:#032a17; stroke-linecap:round; stroke-linejoin:round; }
.rexl.logo .gl{ filter:drop-shadow(0 0 6px rgba(46,232,122,.45)) drop-shadow(0 6px 8px rgba(0,0,0,.6)); }

/* ---------- responsivo ---------- */
@media (max-width: 980px){
  .menu{ display:none; }
  .historia{ grid-template-columns:1fr; gap:0; }
  .historia-palco{ position:sticky; top:62px; height:auto; display:block; z-index:2; order:-1; margin:0 calc(var(--gut) * -1); padding:14px var(--gut) 18px;
                   background:linear-gradient(180deg, var(--bg) 88%, rgba(7,9,12,0)); }
  .historia-passos{ padding:24px 0 0; }
  .passo{ min-height:46vh; }
  .hd-grade{ grid-template-columns:1fr; gap:48px; }
  .garantias{ grid-template-columns:1fr; }
  .garantias li, .garantias li + li{ padding:28px 0 4px; border-left:0; }
  .garantias li + li{ border-top:1px solid var(--line); }
  .avisos{ grid-template-columns:1fr; }
}
@media (max-width: 640px){
  :root{ --gut:16px; }
  body{ font-size:16px; }
  .topo-in{ gap:12px; height:62px; }
  .marca-nome{ font-size:14px; }
  .topo-acoes .btn{ display:none; }
  .hero{ padding:104px 0 140px; align-items:flex-end; }
  .hero-bg::after{ background:linear-gradient(180deg, rgba(7,9,12,.55) 0%, rgba(7,9,12,.5) 22%, rgba(7,9,12,.9) 48%, var(--bg) 78%); }
  .jogador{ left:74%; top:24%; }
  .hero-rex{ width:118px; }
  .hero-coords{ gap:6px 16px; font-size:11px; bottom:22px; }
  .secao{ padding:96px 0; }
  .secao-cab{ margin-bottom:44px; }
  .palco{ aspect-ratio:4/3; border-radius:16px; }
  .palco-leg{ display:none; }
  .ov{ border-radius:9px; }
  .ov-stats{ width:43%; padding:8px 9px; left:3%; top:4%; }
  .ov-especie{ font-size:10.5px; } .ov-serv{ font-size:8px; margin-bottom:6px; }
  .barras{ gap:4px; } .barras li{ font-size:8px; gap:2px 6px; } .barras .b{ height:3px; }
  .ov-relogio{ font-size:8px; margin-top:6px; }
  .ov-coords{ padding:7px 9px; right:3%; top:4%; }
  .ov-coords p{ font-size:8.5px; gap:8px; line-height:1.5; }
  .ov-mini{ width:34%; top:44%; right:4%; }
  .mini-leg{ font-size:7.5px; padding:2px 7px; }
  .trilha{ display:none; }
  .forma{ grid-template-columns:1fr; gap:10px; padding:24px 0; }
  .forma-acao{ justify-content:flex-start; min-width:0; }
  .painel-doacao{ grid-template-columns:1fr; padding:20px; }
  .qr{ width:180px; height:180px; }
  .baixar-card{ padding:60px 20px 48px; border-radius:22px; }
  .rodape-in{ grid-template-columns:1fr; }
  .rodape-links{ justify-content:flex-start; }
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .hero-bg{ transform:none !important; }
  [data-r].pre{ opacity:1; transform:none; }
}