/* =========================================================
   NYTHERA — Noite de Éter
   Paleta extraída da logo (cristal no altar da floresta)
   ========================================================= */
:root{
  --deep:#070818;
  --night:#0b0d26;
  --night-2:#0e112d;     /* céu da logo */
  --forest:#10253c;      /* pinheiros */
  --stone:#20314d;       /* altar */
  --ether:#a1fafa;       /* brilho do éter / runa */
  --cyan:#69e0ee;
  --blue:#69b4e6;        /* corpo do cristal */
  --violet:#9773dd;      /* base do cristal */
  --indigo:#4f43a0;      /* contorno do cristal */
  --rose:#e7b2ec;        /* ponta do cristal */
  --moss:#8e9647;        /* musgo */
  --text:#e9ecff;
  --muted:#9aa3c9;
  --line:rgba(161,250,250,.12);
  --grad:linear-gradient(100deg,#a1fafa 0%,#69b4e6 32%,#9773dd 66%,#e7b2ec 100%);
  --px:"Pixelify Sans",ui-monospace,monospace;
  --px-s:"Silkscreen",ui-monospace,monospace;
  --body:"Outfit",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  --wrap:min(1240px,100% - 48px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--night);color:var(--text);font:400 17px/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.is-loading{overflow:hidden}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,p{margin:0}
::selection{background:var(--violet);color:#fff}
:focus-visible{outline:2px solid var(--ether);outline-offset:4px}
.skip{position:fixed;left:16px;top:-60px;z-index:200;background:var(--ether);color:var(--deep);padding:10px 16px;font-family:var(--px)}
.skip:focus{top:16px}
.wrap{width:var(--wrap);margin-inline:auto}

/* ---------- type ---------- */
.label{font:400 12px/1.4 var(--px-s);letter-spacing:.08em;text-transform:uppercase;color:var(--ether);display:flex;align-items:center;gap:12px;margin-bottom:22px}
.label::before{content:"";width:8px;height:8px;background:var(--grad);box-shadow:0 0 12px var(--cyan);flex:none}
.h2{font:600 clamp(40px,5.6vw,84px)/.98 var(--px);letter-spacing:-.01em;margin-bottom:28px}
.h2-xl{font-size:clamp(48px,8vw,128px)}
.h3{font:600 clamp(28px,3vw,40px)/1.05 var(--px);margin-bottom:28px}
.grad{background:var(--grad);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 8s linear infinite}
@keyframes shimmer{to{background-position:-200% 0}}
.sec-head{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:end;margin-bottom:64px}
.sec-lead{color:var(--muted);font-size:clamp(17px,1.4vw,20px);font-weight:300;max-width:46ch}

/* ---------- buttons (pixel-cut corners) ---------- */
.btn{--bg:var(--grad);position:relative;display:inline-flex;align-items:center;gap:12px;padding:16px 26px;font:500 16px/1 var(--px);color:var(--deep);background:var(--bg);background-size:200% 100%;
  clip-path:polygon(0 6px,6px 6px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 6px,100% 6px,100% calc(100% - 6px),calc(100% - 6px) calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,6px calc(100% - 6px),0 calc(100% - 6px));
  transition:background-position .6s var(--ease),transform .25s var(--ease),filter .25s}
.btn:hover{background-position:100% 0;transform:translateY(-2px);filter:drop-shadow(0 0 18px rgba(161,250,250,.45))}
.btn svg{width:14px;height:14px;fill:currentColor}
.btn-ghost{--bg:linear-gradient(var(--ether),var(--ether));color:var(--text);background:transparent}
.btn-ghost::before{content:"";position:absolute;inset:0;background:var(--grad);clip-path:inherit;z-index:-1;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:2px}
.btn-ghost{isolation:isolate}
.btn-ghost:hover{background:rgba(161,250,250,.08)}
.btn-sm{padding:11px 18px;font-size:14px}

/* ---------- intro ---------- */
.intro{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:var(--deep);transition:visibility 0s 1.2s}
.intro-inner{display:grid;justify-items:center;gap:22px;transition:opacity .4s}
.intro-eg{width:min(260px,60vw);opacity:0;animation:fadeInOut 1.3s .1s var(--ease) forwards}
.intro-crystal{position:absolute;width:60px;image-rendering:pixelated;opacity:0;animation:crystalIn .8s 1.25s var(--ease) forwards;filter:drop-shadow(0 0 24px var(--cyan))}
.intro-text{position:absolute;margin-top:150px;font:400 12px var(--px-s);letter-spacing:.2em;color:var(--ether);opacity:0;animation:fadeIn .4s 1.4s forwards}
.intro-bar{position:absolute;bottom:12vh;width:160px;height:4px;background:rgba(161,250,250,.12)}
.intro-bar span{display:block;height:100%;width:0;background:var(--grad);animation:bar 2.2s steps(16) forwards}
.intro-pixels{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--cols,16),1fr);pointer-events:none}
.intro-pixels i{background:var(--deep);transition:opacity .01s}
.intro.done{visibility:hidden;background:transparent}
.intro.done .intro-inner{opacity:0}
@keyframes fadeInOut{0%{opacity:0;transform:scale(.96)}30%,70%{opacity:1;transform:none}100%{opacity:0}}
@keyframes crystalIn{from{opacity:0;transform:translateY(20px) scale(.6)}to{opacity:1;transform:none}}
@keyframes fadeIn{to{opacity:1}}
@keyframes bar{to{width:100%}}

/* ---------- header ---------- */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;background:var(--grad);transform-origin:0 50%;transform:scaleX(0);z-index:120}
.site-header{position:fixed;inset:0 0 auto;z-index:100;height:76px;padding:0 max(24px,4vw);display:flex;align-items:center;gap:40px;transition:background .4s,backdrop-filter .4s,border-color .4s;border-bottom:1px solid transparent}
.site-header.scrolled{background:rgba(11,13,38,.72);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-color:var(--line)}
.site-header.hide{transform:translateY(-100%)}
.site-header{transition:transform .45s var(--ease),background .4s,border-color .4s}
.brand{display:flex;align-items:center;gap:12px;font:700 24px/1 var(--px);letter-spacing:.12em}
.brand img{width:15px;height:25px;image-rendering:pixelated;filter:drop-shadow(0 0 8px rgba(105,224,238,.7));transition:transform .5s var(--ease)}
.brand:hover img{transform:translateY(-3px) rotate(8deg)}
.site-header nav{display:flex;gap:6px;margin-left:auto}
.site-header nav a{position:relative;padding:8px 14px;font:400 15px var(--px);color:var(--muted);transition:color .25s}
.site-header nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .35s steps(6)}
.site-header nav a:hover,.site-header nav a.active{color:var(--text)}
.site-header nav a:hover::after,.site-header nav a.active::after{transform:scaleX(1)}
.menu{display:none;width:44px;height:44px;flex-direction:column;justify-content:center;gap:5px;align-items:center}
.menu i{display:block;width:22px;height:3px;background:var(--text);transition:transform .3s,opacity .3s}
.menu[aria-expanded="true"] i:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu[aria-expanded="true"] i:nth-child(2){opacity:0}
.menu[aria-expanded="true"] i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;isolation:isolate;padding:110px 24px 150px}
.hero-bg{position:absolute;inset:-6%;z-index:-3;will-change:transform}
.hero-bg img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;filter:saturate(1.15) brightness(.75);transform:scale(1.08);animation:heroZoom 2.4s 1.6s var(--ease) both}
@keyframes heroZoom{from{transform:scale(1.25);filter:saturate(1.15) brightness(.2) blur(6px)}}
.hero-shade{position:absolute;inset:0;z-index:-2;background:
  radial-gradient(ellipse 60% 50% at 50% 42%,rgba(79,67,160,.25),transparent 70%),
  linear-gradient(180deg,rgba(11,13,38,.55) 0%,rgba(11,13,38,.15) 35%,rgba(11,13,38,.6) 70%,var(--night) 100%)}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero-center{position:relative;display:grid;justify-items:center;text-align:center}

.sigil{position:relative;width:200px;height:200px;margin-bottom:6px;display:grid;place-items:center}
.ring{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-width:1;overflow:visible}
.ring circle{stroke:var(--ether);opacity:.35;transform-origin:center}
.ring-1 circle{stroke-dasharray:2 10;animation:spin 40s linear infinite}
.ring-2 circle{stroke:var(--violet);opacity:.6;stroke-dasharray:24 8 4 8;animation:spin 26s linear infinite reverse}
.ring-3 circle{stroke:var(--rose);opacity:.25;stroke-dasharray:1 5;animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.sigil-glow{position:absolute;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(161,250,250,.55),rgba(151,115,221,.25) 45%,transparent 70%);filter:blur(10px);animation:pulse 3.2s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.25);opacity:.7}}
.sigil-crystal{position:relative;width:66px;height:110px;image-rendering:pixelated;animation:float 4s ease-in-out infinite;filter:drop-shadow(0 0 16px rgba(105,224,238,.8)) drop-shadow(0 0 40px rgba(151,115,221,.6))}
@keyframes float{50%{transform:translateY(-10px)}}
.sigil-altar{position:absolute;bottom:22px;width:56px;height:8px;border-radius:50%;background:radial-gradient(ellipse,var(--ether),transparent 70%);filter:blur(3px);animation:altar 4s ease-in-out infinite}
@keyframes altar{50%{transform:scaleX(.7);opacity:.5}}

.kicker{font:400 13px var(--px-s);letter-spacing:.24em;color:var(--ether);margin-bottom:10px;text-shadow:0 0 14px rgba(161,250,250,.6)}
.title{display:flex;font:700 clamp(68px,15vw,210px)/.86 var(--px);letter-spacing:.04em;margin:0 0 14px;
  filter:drop-shadow(0 0 30px rgba(105,180,230,.35)) drop-shadow(0 6px 0 rgba(79,67,160,.9))}
.title span{display:inline-block;background:var(--grad);background-size:700% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:letterIn .9s var(--ease) both,shimmer 10s linear infinite}
.title span:nth-child(1){background-position:0 0;animation-delay:1.9s,0s}
.title span:nth-child(2){background-position:16.6% 0;animation-delay:1.96s,0s}
.title span:nth-child(3){background-position:33.3% 0;animation-delay:2.02s,0s}
.title span:nth-child(4){background-position:50% 0;animation-delay:2.08s,0s}
.title span:nth-child(5){background-position:66.6% 0;animation-delay:2.14s,0s}
.title span:nth-child(6){background-position:83.3% 0;animation-delay:2.2s,0s}
.title span:nth-child(7){background-position:100% 0;animation-delay:2.26s,0s}
@keyframes letterIn{from{opacity:0;transform:translateY(40px) scale(.8);filter:blur(8px)}}
.subtitle{font:500 clamp(14px,1.6vw,20px) var(--px);letter-spacing:.42em;color:var(--text);margin-bottom:26px;padding-left:.42em}
.hero-lead{color:#c6cdf0;font-weight:300;font-size:clamp(16px,1.4vw,19px);margin-bottom:34px;max-width:44ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.hero .kicker,.hero .subtitle,.hero-lead,.hero-actions,.sigil{animation:rise 1s var(--ease) both}
.sigil{animation-delay:1.7s}
.hero .kicker{animation-delay:1.8s}
.hero .subtitle{animation-delay:2.35s}
.hero-lead{animation-delay:2.5s}
.hero-actions{animation-delay:2.65s}
@keyframes rise{from{opacity:0;transform:translateY(24px)}}

.hero-stats{position:absolute;left:0;right:0;bottom:0;margin:0;padding:0 max(24px,4vw);list-style:none;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);background:linear-gradient(transparent,rgba(7,8,24,.5));animation:rise 1s 2.9s var(--ease) both}
.hero-stats li{padding:20px 0 24px;display:flex;align-items:baseline;gap:12px}
.hero-stats li+li{padding-left:24px;border-left:1px solid var(--line)}
.hero-stats b{font:600 30px/1 var(--px);color:var(--ether)}
.hero-stats span{font:400 11px var(--px-s);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.live{display:inline-flex;align-items:center;gap:8px;font-size:18px!important}
.live i,.status i,.nova-dot{width:8px;height:8px;background:var(--moss);box-shadow:0 0 0 0 rgba(142,150,71,.7);animation:ping 2s infinite}
.live i{background:#b6d65a}
@keyframes ping{70%{box-shadow:0 0 0 10px rgba(142,150,71,0)}100%{box-shadow:0 0 0 0 rgba(142,150,71,0)}}
.scroll-cue{position:absolute;right:max(24px,4vw);bottom:100px;width:24px;height:40px;border:2px solid rgba(233,236,255,.4);border-radius:12px;display:flex;justify-content:center;padding-top:6px}
.scroll-cue span{width:4px;height:8px;background:var(--ether);animation:cue 1.8s infinite}
@keyframes cue{0%{transform:translateY(0);opacity:1}80%{transform:translateY(14px);opacity:0}100%{opacity:0}}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(90deg,rgba(79,67,160,.18),rgba(16,37,60,.4),rgba(79,67,160,.18));padding:18px 0;transform:rotate(-1.2deg) scale(1.02);margin:30px 0}
.marquee-track{display:flex;gap:34px;width:max-content;animation:marquee 32s linear infinite;align-items:center}
.marquee span{font:600 clamp(22px,2.6vw,36px)/1 var(--px);white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(161,250,250,.55)}
.marquee span:nth-of-type(3n+1){color:var(--text);-webkit-text-stroke:0}
.marquee i{font-style:normal;color:var(--rose);font-size:20px}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- story ---------- */
.story{padding:140px 0}
.story-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,7vw,110px);align-items:center}
.story-visual{position:sticky;top:110px}
.frame{position:relative;aspect-ratio:1;overflow:hidden;background:var(--night-2);box-shadow:0 0 0 1px var(--line),0 40px 90px -30px rgba(79,67,160,.7)}
.frame img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.frame:hover img{transform:scale(1.14)}
.scan{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0,rgba(161,250,250,.16) 50%,transparent 52%);background-size:100% 240%;animation:scan 5s linear infinite;mix-blend-mode:screen;pointer-events:none}
@keyframes scan{from{background-position:0 -120%}to{background-position:0 220%}}
.corner{position:absolute;width:22px;height:22px;border:3px solid var(--ether)}
.corner.tl{top:12px;left:12px;border-right:0;border-bottom:0}.corner.tr{top:12px;right:12px;border-left:0;border-bottom:0}
.corner.bl{bottom:12px;left:12px;border-right:0;border-top:0}.corner.br{bottom:12px;right:12px;border-left:0;border-top:0}
.caption{margin-top:14px;font:400 11px var(--px-s);color:var(--muted);letter-spacing:.08em}
.words{font:400 clamp(22px,2.3vw,32px)/1.4 var(--body);font-weight:300;margin-bottom:44px}
.words .w{opacity:.18;transition:opacity .4s,color .4s}
.words .w.on{opacity:1}
.words .w.hl{color:var(--ether)}
.nova{border:1px solid rgba(161,250,250,.25);background:linear-gradient(135deg,rgba(16,37,60,.7),rgba(79,67,160,.18));padding:22px 24px;position:relative;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.nova-head{display:flex;align-items:center;gap:10px;font:400 11px var(--px-s);color:var(--ether);letter-spacing:.08em;margin-bottom:10px}
.nova-dot{background:var(--ether);animation:none;box-shadow:0 0 10px var(--ether)}
.nova-line{font:500 20px/1.4 var(--px);min-height:1.4em}
.nova-line::after{content:"";display:inline-block;width:10px;height:18px;margin-left:4px;vertical-align:-2px;background:var(--ether);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* ---------- dimensions ---------- */
.dims{position:relative;height:620vh;--c:#7ff6c8}
.dims-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:36px;padding-top:70px;
  background:radial-gradient(ellipse 70% 60% at 70% 60%,color-mix(in srgb,var(--c) 18%,transparent),transparent 70%),var(--night);transition:background .8s}
.dims-head{display:flex;justify-content:space-between;align-items:end;gap:30px}
.dims-head .h2{margin:0}
.dims-progress{display:flex;align-items:center;gap:16px;font:400 13px var(--px-s);color:var(--muted)}
.dims-progress b{color:var(--text);font-weight:400}
.dims-bar{width:180px;height:4px;background:var(--line);position:relative}
.dims-bar i{position:absolute;inset:0;background:var(--c);transform-origin:left;transform:scaleX(.2);box-shadow:0 0 12px var(--c);transition:background .5s}
.dims-track{display:flex;gap:4vw;padding-inline:calc((100vw - min(1240px,100vw - 48px))/2);will-change:transform}
.dim{--c:inherit;flex:none;width:min(1000px,82vw);display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:center;opacity:.35;transform:scale(.94);transition:opacity .6s,transform .6s var(--ease)}
.dim.is-active{opacity:1;transform:none}
.dim-img{position:relative;aspect-ratio:16/10;overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 40%,transparent),0 30px 80px -20px color-mix(in srgb,var(--c) 45%,transparent)}
.dim-img img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transform:scale(1.1);transition:transform 1.2s var(--ease)}
.dim.is-active .dim-img img{transform:scale(1)}
.dim-img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,13,38,.5),transparent 40%)}
.dim-n{font:700 120px/1 var(--px);color:transparent;-webkit-text-stroke:1px var(--c);opacity:.6;display:block;margin-bottom:-20px}
.dim .label{color:var(--c)}
.dim .label::before{background:var(--c);box-shadow:0 0 12px var(--c)}
.dim h3{font:700 clamp(44px,5vw,76px)/1 var(--px);margin-bottom:16px;color:var(--text);text-shadow:0 0 30px color-mix(in srgb,var(--c) 50%,transparent)}
.dim p{color:var(--muted)}
.rule{margin-top:22px;padding:14px 16px;border-left:3px solid var(--c);background:color-mix(in srgb,var(--c) 7%,transparent);color:var(--text)!important;font-size:15px}
.rule b{display:block;font:400 10px var(--px-s);letter-spacing:.08em;color:var(--c);margin-bottom:4px;text-transform:uppercase}

/* ---------- features ---------- */
.features,.biomes,.media{padding:140px 0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{--mx:50%;--my:50%;position:relative;background:linear-gradient(160deg,rgba(32,49,77,.55),rgba(14,17,45,.8));border:1px solid var(--line);overflow:hidden;transform-style:preserve-3d;transition:transform .5s var(--ease),border-color .3s}
.card::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(420px circle at var(--mx) var(--my),rgba(161,250,250,.14),transparent 45%);opacity:0;transition:opacity .3s}
.card::after{content:"";position:absolute;inset:-1px;z-index:3;pointer-events:none;padding:1px;background:radial-gradient(300px circle at var(--mx) var(--my),var(--ether),var(--violet) 40%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s}
.card:hover::before,.card:hover::after{opacity:1}
.card-img{aspect-ratio:4/3;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform .9s var(--ease)}
.card:hover .card-img img{transform:scale(1.07)}
.card-body{padding:26px 26px 30px;position:relative}
.card-n{position:absolute;top:-26px;right:22px;font:700 48px/1 var(--px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.card h3{font:600 28px/1.1 var(--px);margin-bottom:12px}
.card p{color:var(--muted);font-size:16px;margin-bottom:22px}
.tag{font:400 10px var(--px-s);letter-spacing:.08em;color:var(--ether);padding:6px 10px;border:1px solid rgba(161,250,250,.25)}

/* ---------- biomes bento ---------- */
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:14px}
.tile{position:relative;overflow:hidden;text-align:left;background:var(--night-2)}
.t-big{grid-column:span 2;grid-row:span 2}
.t-wide{grid-column:span 4}
.tile img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform 1s var(--ease),filter .5s}
.tile:hover img{transform:scale(1.08);filter:saturate(1.2)}
.tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,8,24,.85),transparent 50%);transition:opacity .4s}
.tile-cap{position:absolute;left:20px;bottom:16px;z-index:2;font:600 26px/1 var(--px);display:flex;align-items:baseline;gap:10px;transition:transform .4s var(--ease)}
.tile-cap small{font:400 11px var(--px-s);color:var(--ether)}
.tile:hover .tile-cap{transform:translateX(8px)}
.tile::before{content:"↗";position:absolute;right:16px;top:14px;z-index:2;width:34px;height:34px;display:grid;place-items:center;background:var(--ether);color:var(--deep);font-weight:700;transform:scale(0) rotate(-45deg);transition:transform .4s var(--ease)}
.tile:hover::before{transform:none}
/* pixel dissolve reveal */
.pix-reveal{--p:0}
.pix-cover{position:absolute;inset:0;z-index:4;display:grid;grid-template-columns:repeat(10,1fr);pointer-events:none}
.pix-cover i{background:var(--night);transition:opacity .05s}

/* ---------- media ---------- */
.media-grid{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:14px;height:min(620px,70vw)}
.vid{position:relative;overflow:hidden;text-align:left;background:var(--night-2)}
.vid-main{grid-row:span 2}
.vid img,.vid video{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;transition:transform 1s var(--ease)}
.vid:hover img,.vid:hover video{transform:scale(1.05)}
.vid::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,8,24,.9),transparent 55%)}
.play{position:absolute;left:50%;top:50%;z-index:2;width:76px;height:76px;margin:-38px 0 0 -38px;display:grid;place-items:center;background:var(--grad);color:var(--deep);
  clip-path:polygon(0 8px,8px 8px,8px 0,calc(100% - 8px) 0,calc(100% - 8px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 8px) calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 8px),0 calc(100% - 8px));transition:transform .4s var(--ease)}
.play svg{width:22px;height:22px;fill:currentColor;margin-left:4px}
.vid:not(.vid-main) .play{width:54px;height:54px;margin:-27px 0 0 -27px}
.vid:hover .play{transform:scale(1.12)}
.play::before{content:"";position:absolute;inset:-12px;border:2px solid var(--ether);opacity:0;animation:ripple 2.4s infinite}
@keyframes ripple{0%{transform:scale(.7);opacity:.8}100%{transform:scale(1.4);opacity:0}}
.vid-cap{position:absolute;left:24px;bottom:20px;z-index:2;display:grid;gap:6px}
.vid-cap small{font:400 11px var(--px-s);color:var(--ether);letter-spacing:.06em}
.vid-cap strong{font:600 clamp(20px,2.2vw,32px)/1.05 var(--px)}

/* ---------- demo ---------- */
.demo{position:relative;padding:180px 0;overflow:hidden;text-align:center;
  background:radial-gradient(ellipse 50% 45% at 50% 45%,rgba(79,67,160,.4),transparent 70%),radial-gradient(ellipse 80% 60% at 50% 110%,rgba(16,37,60,.9),transparent),var(--deep)}
.demo-inner{position:relative;display:grid;justify-items:center}
.demo .label{justify-content:center}
.demo-crystal{width:48px;height:80px;image-rendering:pixelated;margin-bottom:40px;animation:float 4s ease-in-out infinite;filter:drop-shadow(0 0 22px var(--cyan)) drop-shadow(0 0 50px var(--violet))}
.demo-rings{position:absolute;left:50%;top:45%;pointer-events:none}
.demo-rings i{position:absolute;left:50%;top:50%;border:1px solid rgba(161,250,250,.14);border-radius:50%;transform:translate(-50%,-50%)}
.demo-rings i:nth-child(1){width:420px;height:420px;border-style:dashed;animation:spinC 50s linear infinite}
.demo-rings i:nth-child(2){width:680px;height:680px;border-color:rgba(151,115,221,.2);animation:spinC 80s linear infinite reverse}
.demo-rings i:nth-child(3){width:960px;height:960px;border-color:rgba(231,178,236,.1);border-style:dotted}
@keyframes spinC{to{transform:translate(-50%,-50%) rotate(360deg)}}
.demo .sec-lead{margin:0 auto 36px;text-align:center}
.demo-specs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:30px}
.demo-specs span{font:400 12px var(--px-s);padding:8px 14px;border:1px solid var(--line);background:rgba(16,37,60,.5)}
.status{display:inline-flex;align-items:center;gap:12px;font:500 18px var(--px);padding:14px 22px;border:1px solid rgba(182,214,90,.35);background:rgba(142,150,71,.1);color:#d7ec98}
.status i{background:#b6d65a}
.fine{margin-top:14px;color:var(--muted);font-size:14px}

/* ---------- info ---------- */
.info{padding:130px 0;border-top:1px solid var(--line)}
.info-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(40px,7vw,110px);align-items:start}
.log-entry{border:1px solid var(--line);padding:28px;background:linear-gradient(160deg,rgba(32,49,77,.4),transparent)}
.log-meta{display:flex;gap:14px;align-items:center;font:400 11px var(--px-s);color:var(--muted);margin-bottom:16px}
.ver{background:var(--grad);color:var(--deep);padding:5px 10px}
.log-entry h3{font:600 28px var(--px);margin-bottom:10px}
.log-entry p{color:var(--muted);font-size:16px}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;font:500 clamp(18px,1.6vw,22px)/1.3 var(--px);transition:color .25s}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font:400 26px var(--px);color:var(--ether);transition:transform .3s var(--ease)}
details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
summary:hover{color:var(--ether)}
details p{color:var(--muted);padding:0 0 24px;max-width:62ch;animation:rise .5s var(--ease)}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);background:var(--deep);padding:70px 0 30px}
.footer-top{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;padding-bottom:40px;border-bottom:1px solid var(--line)}
.brand-lg{font-size:40px}
.brand-lg img{width:24px;height:40px}
.footer-top p{font:500 16px var(--px);letter-spacing:.2em;text-transform:uppercase}
.footer-top small{font:300 14px var(--body);letter-spacing:0;text-transform:none;color:var(--muted)}
.eg{width:170px;mix-blend-mode:screen}
.footer-bottom{display:flex;gap:30px;flex-wrap:wrap;padding-top:24px;font:400 11px var(--px-s);color:var(--muted);text-transform:uppercase}
.footer-bottom a:hover{color:var(--ether)}
.footer-bottom a:last-child{margin-left:auto}

/* ---------- viewer ---------- */
dialog{width:min(1100px,94vw);padding:20px;border:1px solid rgba(161,250,250,.3);background:var(--night-2);color:var(--text)}
dialog::backdrop{background:rgba(7,8,24,.86);backdrop-filter:blur(6px)}
dialog[open]{animation:pop .4s var(--ease)}
@keyframes pop{from{opacity:0;transform:scale(.95)}}
dialog video,dialog img{width:100%;max-height:78vh;object-fit:contain;background:#000;image-rendering:pixelated}
dialog .label{margin-bottom:14px}
.close{position:absolute;right:14px;top:10px;width:36px;height:36px;font-size:18px;color:var(--ether)}

/* ---------- scroll reveal ---------- */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
.js .reveal.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .site-header nav{position:fixed;inset:76px 0 auto;flex-direction:column;gap:0;padding:12px 24px 24px;background:rgba(11,13,38,.97);border-bottom:1px solid var(--line);transform:translateY(-120%);transition:transform .45s var(--ease);margin:0}
  .site-header nav.open{transform:none}
  .site-header nav a{font-size:22px;padding:14px 0;border-bottom:1px solid var(--line)}
  .site-header nav a::after{display:none}
  .site-header .btn-sm{margin-left:auto}
  .menu{display:flex}
  .sec-head,.story-grid,.info-grid{grid-template-columns:1fr}
  .story-visual{position:relative;top:0;max-width:520px}
  .cards{grid-template-columns:1fr 1fr}
  .cards .card:last-child{grid-column:span 2}
  .cards .card:last-child .card-img{aspect-ratio:16/7}
  .dim{grid-template-columns:1fr;gap:20px;width:78vw}
  .dim-n{font-size:70px;margin-bottom:-10px}
}
@media (max-width:700px){
  :root{--wrap:calc(100% - 32px)}
  body{font-size:16px}
  .site-header{padding:0 16px;gap:12px;height:66px}
  .site-header nav{inset:66px 0 auto}
  .site-header .btn-sm{display:none}
  .menu{margin-left:auto}
  .brand{font-size:20px}
  .hero{padding:96px 16px 210px}
  .sigil{width:150px;height:150px}
  .sigil-crystal{width:48px;height:80px}
  .hero-stats{grid-template-columns:1fr 1fr;padding:0 16px}
  .hero-stats li{padding:14px 0}
  .hero-stats li+li{padding-left:0;border-left:0}
  .hero-stats li:nth-child(even){padding-left:16px;border-left:1px solid var(--line)}
  .hero-stats li:nth-child(n+3){border-top:1px solid var(--line)}
  .hero-stats b{font-size:24px}
  .scroll-cue{display:none}
  .subtitle{letter-spacing:.24em}
  .story,.features,.biomes,.media,.info{padding:90px 0}
  .cards{grid-template-columns:1fr}
  .cards .card:last-child{grid-column:auto}
  .cards .card:last-child .card-img{aspect-ratio:4/3}
  .bento{grid-template-columns:1fr 1fr;grid-auto-rows:150px}
  .t-wide{grid-column:span 2}
  .media-grid{grid-template-columns:1fr;grid-template-rows:260px 200px 200px;height:auto}
  .vid-main{grid-row:auto}
  /* dimensions: vertical stack on phones */
  .dims{height:auto}
  .dims-sticky{position:relative;height:auto;padding:90px 0;gap:30px}
  .dims-progress{display:none}
  .dims-track{flex-direction:column;padding-inline:16px;gap:56px;transform:none!important}
  .dim{width:100%;opacity:1;transform:none}
  .demo{padding:120px 0}
  .demo-rings i:nth-child(3){display:none}
  .footer-bottom a:last-child{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .intro{display:none}
  .js .reveal{opacity:1;transform:none}
}

/* visitas repetidas (sem intro): animações do hero começam logo */
.no-intro .hero-bg img{animation-delay:0s}
.no-intro .sigil{animation-delay:.1s}
.no-intro .hero .kicker{animation-delay:.2s}
.no-intro .title span:nth-child(1){animation-delay:.3s,0s}
.no-intro .title span:nth-child(2){animation-delay:.36s,0s}
.no-intro .title span:nth-child(3){animation-delay:.42s,0s}
.no-intro .title span:nth-child(4){animation-delay:.48s,0s}
.no-intro .title span:nth-child(5){animation-delay:.54s,0s}
.no-intro .title span:nth-child(6){animation-delay:.6s,0s}
.no-intro .title span:nth-child(7){animation-delay:.66s,0s}
.no-intro .hero .subtitle{animation-delay:.75s}
.no-intro .hero-lead{animation-delay:.9s}
.no-intro .hero-actions{animation-delay:1.05s}
.no-intro .hero-stats{animation-delay:1.3s}

/* ---------- estrela cadente das dimensões ---------- */
.comet{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.dims-head,.dims-track{position:relative;z-index:2}
.dims-track{padding-inline:0}
.dims-hint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:4;font:400 11px var(--px-s);letter-spacing:.08em;color:var(--muted);text-transform:uppercase;display:flex;gap:10px;align-items:center;white-space:nowrap}
.dims-hint span{color:var(--c);animation:cue2 1.6s infinite}
@keyframes cue2{50%{transform:translateY(5px)}}
.dim-img.hit::before{content:"";position:absolute;inset:0;z-index:2;background:radial-gradient(circle at 50% 42%,rgba(255,255,255,.75),color-mix(in srgb,var(--c) 50%,transparent) 30%,transparent 70%);animation:hit .9s var(--ease) forwards;pointer-events:none}
@keyframes hit{from{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(1.4)}}
.rail{display:none}

/* ---------- celular ---------- */
@media (max-width:700px){
  .comet,.dims-hint{display:none}
  .dims-head{flex-direction:column;align-items:flex-start}
  .dims-track{position:relative;padding:0 16px 0 44px!important;--rail:0;--rc:#7ff6c8}
  .rail{display:block;position:absolute;left:18px;top:0;bottom:0;width:2px;background:var(--line)}
  .rail-fill{position:absolute;inset:0;background:linear-gradient(var(--ether),var(--rc));transform-origin:top;transform:scaleY(var(--rail));box-shadow:0 0 10px var(--rc)}
  .rail-star{position:absolute;left:50%;top:calc(var(--rail) * 100%);width:10px;height:10px;margin:-5px 0 0 -5px;background:#fff;box-shadow:0 0 0 3px var(--rc),0 0 18px 6px var(--rc);
    clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);transform:scale(1.8)}
  .dim{opacity:.45;transform:none;transition:opacity .5s}
  .dim.is-active{opacity:1}
  .dim h3{font-size:44px}
  .dim-n{font-size:56px;margin-bottom:-6px}
  .h2{font-size:clamp(36px,11vw,52px)}
  .h2-xl{font-size:clamp(42px,13vw,64px)}
  .title{font-size:clamp(56px,19vw,96px);letter-spacing:.02em}
  .kicker{font-size:10px;letter-spacing:.16em}
  .subtitle{font-size:12px;letter-spacing:.2em;padding-left:.2em}
  .hero-lead{font-size:16px}
  .hero-lead br{display:none}
  .hero-actions{flex-direction:column;width:100%;max-width:320px}
  .hero-actions .btn{justify-content:center}
  .words{font-size:21px}
  .story-visual{max-width:none}
  .sec-head{gap:16px;margin-bottom:40px}
  .marquee{padding:12px 0;margin:10px 0}
  .card-body{padding:22px}
  .card h3{font-size:24px}
  .tile-cap{font-size:18px;left:12px;bottom:10px}
  .tile::before{width:28px;height:28px;right:10px;top:10px}
  .play{width:60px;height:60px;margin:-30px 0 0 -30px}
  .vid-cap{left:16px;bottom:14px}
  .demo-rings i:nth-child(1){width:300px;height:300px}
  .demo-rings i:nth-child(2){width:480px;height:480px}
  .status{font-size:15px;padding:12px 16px}
  .log-entry{padding:22px}
  .footer-top{flex-direction:column;align-items:flex-start}
  .brand-lg{font-size:32px}
  .footer-bottom{gap:14px 24px}
  dialog{padding:14px;width:96vw}
}
.nav-demo{display:none!important}
@media (max-width:700px){.nav-demo{display:block!important;color:var(--ether)!important}}

/* =========================================================
   Melhorias v2
   ========================================================= */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* intro: só com JS; some sozinha se algo falhar */
.intro{display:none}
.js .intro{display:grid;animation:introFailsafe 0s 4.5s forwards}
.no-intro .intro{display:none}
@keyframes introFailsafe{to{visibility:hidden;opacity:0}}

/* hero em telas baixas (notebooks 1366×768 etc.) */
@media (min-width:701px) and (max-height:860px){
  .sigil{width:150px;height:150px}
  .sigil-crystal{width:48px;height:80px}
  .title{font-size:clamp(64px,12vw,150px)}
  .subtitle{margin-bottom:18px}
  .hero-lead{margin-bottom:24px}
  .hero{padding-bottom:120px}
  .hero-stats li{padding:14px 0 16px}
}

/* personagens */
.cast{margin-top:110px}
.cast-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.who{position:relative;padding:26px 22px;border:1px solid var(--line);background:linear-gradient(160deg,rgba(32,49,77,.45),rgba(14,17,45,.6));transition:border-color .3s,transform .4s var(--ease)}
.who:hover{border-color:rgba(161,250,250,.4);transform:translateY(-4px)}
.who-ico{display:grid;place-items:center;width:44px;height:44px;margin-bottom:18px;font-size:20px;color:var(--deep);background:var(--grad);
  clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}
.who h3{font:600 22px/1.1 var(--px);margin-bottom:8px}
.who p{color:var(--muted);font-size:15px}
.who-dark{background:linear-gradient(160deg,rgba(79,67,160,.25),rgba(7,8,24,.9))}
.who-dark .who-ico{background:linear-gradient(135deg,#4f43a0,#1a1440);color:var(--rose)}
.who-dark h3{color:var(--rose)}

/* guardião de cada dimensão */
.boss{display:flex;align-items:center;gap:10px;margin:-6px 0 14px;font:500 15px var(--px);color:var(--text)!important}
.boss span{font:400 9px var(--px-s);letter-spacing:.08em;color:var(--deep);background:var(--c);padding:3px 7px}

/* chips */
.chips{list-style:none;padding:0;margin:44px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.chips li{font:400 15px var(--px);padding:9px 14px;border:1px solid var(--line);background:rgba(16,37,60,.45);color:#cdd3f3;transition:border-color .3s,color .3s,background .3s}
.chips li:hover{border-color:rgba(161,250,250,.5);color:var(--ether);background:rgba(161,250,250,.06)}
.chips li::before{content:"✦";margin-right:8px;color:var(--violet);font-size:11px}
.chips-biomes{margin-top:24px}

/* números */
.numbers{padding:90px 0;border-block:1px solid var(--line);background:radial-gradient(ellipse 60% 100% at 50% 0%,rgba(79,67,160,.22),transparent 70%),var(--night-2)}
.num-grid{display:grid;grid-template-columns:repeat(6,1fr);margin:0}
.num{padding:10px 20px;border-left:1px solid var(--line);display:flex;flex-direction:column-reverse;gap:6px}
.num:first-child{border-left:0;padding-left:0}
.num dd{margin:0;font:700 clamp(40px,4.4vw,64px)/1 var(--px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.num dt{font:400 11px var(--px-s);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.num-note{margin-top:34px;color:var(--muted);font-size:14px}

/* demo */
.demo-list{list-style:none;padding:0;margin:0 0 30px;display:grid;grid-template-columns:repeat(2,auto);gap:10px 34px;text-align:left;justify-content:center}
.demo-list li{display:flex;gap:10px;align-items:baseline;color:var(--muted)}
.demo-list li::before{content:"";width:8px;height:8px;flex:none;background:var(--grad);transform:translateY(-1px)}
.demo-list b{color:var(--text);font-weight:500}
.share{margin-top:34px}

/* imprensa */
.press{padding:130px 0;border-top:1px solid var(--line)}
.press-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,110px);align-items:start}
.facts{margin:0;border-top:1px solid var(--line)}
.facts div{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
.facts dt{font:400 11px var(--px-s);color:var(--ether);letter-spacing:.06em;text-transform:uppercase;padding-top:4px}
.facts dd{margin:0}
.press-assets{display:grid;gap:10px}
.asset{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:18px;padding:10px 18px 10px 10px;border:1px solid var(--line);background:rgba(16,37,60,.35);transition:border-color .3s,background .3s,transform .3s var(--ease)}
.asset:hover{border-color:rgba(161,250,250,.45);background:rgba(161,250,250,.05);transform:translateX(6px)}
.asset img{width:72px;height:54px;object-fit:cover;image-rendering:pixelated;background:var(--deep)}
.asset img.px{object-fit:contain;padding:8px}
.asset b{display:block;font:500 17px var(--px)}
.asset span{color:var(--muted);font-size:14px}
.asset i{font-style:normal;font:600 20px var(--px);color:var(--ether)}

/* voltar ao topo */
.to-top{position:fixed;right:20px;bottom:20px;z-index:90;width:46px;height:46px;display:grid;place-items:center;background:var(--grad);color:var(--deep);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .3s,transform .3s var(--ease);
  clip-path:polygon(0 5px,5px 5px,5px 0,calc(100% - 5px) 0,calc(100% - 5px) 5px,100% 5px,100% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,5px calc(100% - 5px),0 calc(100% - 5px))}
.to-top svg{width:18px;height:18px;fill:currentColor}
.to-top.show{opacity:1;transform:none;pointer-events:auto}

/* galeria no visualizador */
.nav-prev,.nav-next{display:none;position:absolute;top:50%;z-index:2;width:48px;height:64px;margin-top:-20px;font:600 40px/1 var(--px);color:var(--ether);background:rgba(7,8,24,.7);transition:background .2s}
.nav-prev{left:20px}.nav-next{right:20px}
.nav-prev:hover,.nav-next:hover{background:rgba(161,250,250,.15)}
#viewer.is-gallery .nav-prev,#viewer.is-gallery .nav-next{display:block}
dialog{position:fixed}

/* menos movimento: dimensões em lista vertical, sem scroll fixado */
@media (prefers-reduced-motion:reduce){
  .dims{height:auto}
  .dims-sticky{position:relative;height:auto;padding:110px 0}
  .dims-progress,.comet,.dims-hint{display:none}
  .dims-track{flex-direction:column;align-items:center;gap:70px;transform:none!important}
  .dim{opacity:1;transform:none}
}

@media (max-width:1000px){
  .cast-grid{grid-template-columns:1fr 1fr}
  .num-grid{grid-template-columns:repeat(3,1fr);row-gap:30px}
  .num:nth-child(4){border-left:0;padding-left:0}
  .press-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .cast{margin-top:70px}
  .cast-grid{grid-template-columns:1fr}
  .num-grid{grid-template-columns:1fr 1fr}
  .num{padding:10px 14px}
  .num:nth-child(odd){border-left:0;padding-left:0}
  .num:nth-child(4){border-left:1px solid var(--line);padding-left:14px}
  .numbers{padding:70px 0}
  .chips li{font-size:14px;padding:7px 11px}
  .demo-list{grid-template-columns:1fr;gap:8px}
  .facts div{grid-template-columns:1fr;gap:4px}
  .press{padding:90px 0}
  .asset{grid-template-columns:60px 1fr auto;gap:14px}
  .asset img{width:60px;height:46px}
  .nav-prev,.nav-next{width:38px;height:52px;font-size:30px}
  .nav-prev{left:6px}.nav-next{right:6px}
  .to-top{right:14px;bottom:14px;width:42px;height:42px}
  .boss{font-size:14px}
}
/* tablets deitados: mundos em duas colunas para caber na altura */
@media (min-width:701px) and (max-width:1000px) and (orientation:landscape){.dim{grid-template-columns:1.2fr 1fr;width:88vw;gap:28px}.dim h3{font-size:44px}.dim-n{font-size:64px}.dim p{font-size:15px}}
/* personagens viram carrossel deslizante no celular */
@media (max-width:700px){.cast-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:-16px;padding:0 16px 8px;scrollbar-width:none}.cast-grid::-webkit-scrollbar{display:none}.who{flex:0 0 80%;scroll-snap-align:center}.who:hover{transform:none}}

/* requisitos do sistema */
.reqs{display:grid;gap:14px}
.req{border:1px solid var(--line);background:linear-gradient(160deg,rgba(32,49,77,.45),rgba(14,17,45,.6))}
.req header{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid var(--line)}
.req h3{font:600 22px/1 var(--px)}
.req header span{font:400 10px var(--px-s);letter-spacing:.06em;color:var(--muted);text-transform:uppercase}
.req-rec{border-color:rgba(161,250,250,.3);box-shadow:0 20px 60px -30px rgba(105,180,230,.5)}
.req-rec h3{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.req dl{margin:0;padding:6px 20px 10px}
.req dl div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:10px 0;border-bottom:1px solid rgba(161,250,250,.07)}
.req dl div:last-child{border-bottom:0}
.req dt{font:400 10px var(--px-s);letter-spacing:.06em;color:var(--ether);text-transform:uppercase;padding-top:4px}
.req dd{margin:0;font-size:15px;line-height:1.5}
.req small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
details p a{color:var(--ether);text-decoration:underline;text-underline-offset:3px}
@media (max-width:700px){
  .req header{padding:14px 16px}
  .req dl{padding:4px 16px 8px}
  .req dl div{grid-template-columns:1fr;gap:2px}
}

/* =========================================================
   v3 — download, apoio (Pix), criadores, redes e contato
   ========================================================= */
.btn svg{flex:none}
.btn-sm svg{width:12px;height:12px;fill:currentColor}
.is-soon{opacity:.55;cursor:not-allowed}
.btn.is-soon:hover{transform:none;filter:none;background-position:0 0}

/* download */
.demo .sec-lead{max-width:52ch}
.dl{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,48px);width:100%;max-width:1040px;margin-top:10px;text-align:left;align-items:stretch}
.dl-kicker{font:400 11px var(--px-s);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.dl-info{padding:28px 0}
.dl-info .demo-list{grid-template-columns:1fr;justify-content:start;text-align:left;margin-bottom:24px}
.dl-info .demo-specs{justify-content:flex-start;margin:0}
.dl-card{position:relative;display:flex;flex-direction:column;gap:18px;padding:30px;border:1px solid rgba(161,250,250,.3);
  background:linear-gradient(160deg,rgba(32,49,77,.7),rgba(14,17,45,.92));box-shadow:0 40px 90px -40px rgba(79,67,160,.8)}
.dl-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.dl-free{font:700 30px/1 var(--px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.dl-meta{display:flex;gap:8px;flex-wrap:wrap}
.dl-meta>span{font:400 11px var(--px-s);letter-spacing:.06em;padding:6px 9px;border:1px solid var(--line);color:var(--muted)}
.btn-dl{justify-content:center;padding:20px 26px;font-size:19px;width:100%}
.btn-dl svg{width:16px;height:16px}
.dl-thanks{font-size:15px;color:#d7ec98;padding:12px 14px;border:1px solid rgba(182,214,90,.35);background:rgba(142,150,71,.1)}
.dl-thanks a{color:var(--ether);text-decoration:underline;text-underline-offset:3px}
.dl-help{border-bottom:0;border-top:1px solid var(--line)}
.dl-help summary{font-size:16px;padding:16px 36px 4px 0;color:var(--muted)}
.dl-help summary::after{font-size:22px}
.dl-help p{font-size:14px;padding:6px 0 0}
.dl-share{align-self:flex-start;font:400 11px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--ether);padding:8px 0;border-bottom:1px dashed rgba(161,250,250,.4)}
.dl-share:hover{color:var(--text)}

/* apoio — Pix */
.support{position:relative;padding:140px 0;border-top:1px solid var(--line);
  background:radial-gradient(ellipse 50% 60% at 85% 40%,rgba(79,67,160,.28),transparent 70%),var(--night)}
.support-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(40px,6vw,96px);align-items:center}
.support .sec-lead{margin-bottom:40px}
.goals ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.goals li{display:flex;gap:14px;padding:18px;border:1px solid var(--line);background:rgba(16,37,60,.4)}
.goal-ico{flex:none;width:34px;height:34px;display:grid;place-items:center;font-size:16px;color:var(--deep);background:var(--grad);
  clip-path:polygon(0 4px,4px 4px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px))}
.goals b{display:block;font:500 17px/1.2 var(--px);margin-bottom:4px}
.goals li span:not(.goal-ico){color:var(--muted);font-size:14px;line-height:1.45}
.pix{display:flex;flex-direction:column;gap:20px;padding:30px;background:var(--deep);border:1px solid rgba(161,250,250,.28);
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}
.pix-head{display:flex;align-items:center;gap:12px;font:400 11px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pix-badge{font:700 14px var(--px);color:var(--deep);background:#4fd1c5;padding:5px 10px;letter-spacing:.06em}
.pix-qr{align-self:center;width:232px;height:232px;display:grid;place-items:center;background:#fff;padding:16px;box-sizing:border-box}
.pix-qr img,.pix-qr canvas{width:200px!important;height:200px!important;image-rendering:pixelated}
.pix-qr:not(.is-ready){background:repeating-conic-gradient(rgba(161,250,250,.08) 0 25%,transparent 0 50%) 0 0/16px 16px,var(--night);border:1px dashed rgba(161,250,250,.3)}
.pix-qr-empty{font:400 12px/1.6 var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:center}
.pix-key{display:grid;gap:6px}
.pix-key-label{font:400 11px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--ether)}
.pix-key code{font:500 18px/1.3 var(--px);color:var(--text);padding:12px 14px;background:var(--night);border:1px solid var(--line);overflow-wrap:anywhere;user-select:all}
.pix-actions{display:flex;flex-wrap:wrap;gap:10px}
.pix-actions .btn{flex:1 1 180px;justify-content:center}
.pix-actions .btn:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}
.pix-note{font-size:14px;color:var(--muted);line-height:1.55}
.pix-thanks{font:500 17px var(--px);color:var(--rose)}
.pix-thanks b{font-weight:600}

/* criadores */
.creators{padding:120px 0;border-top:1px solid var(--line);background:linear-gradient(180deg,var(--night),var(--night-2))}
.creators-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(40px,6vw,96px);align-items:center}
.creators .sec-lead b{color:var(--text);font-weight:500}
.creators .sec-lead b.handle{color:var(--ether)}
.steps{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px}
.steps li{display:flex;align-items:center;gap:10px;font:500 16px var(--px);padding:10px 16px 10px 10px;border:1px solid var(--line);background:rgba(16,37,60,.45)}
.steps li span{width:28px;height:28px;display:grid;place-items:center;font:700 14px var(--px);color:var(--deep);background:var(--grad)}
.steps b{color:var(--ether);font-weight:500}
.socials{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.social{display:flex;align-items:center;gap:14px;padding:18px;border:1px solid var(--line);background:rgba(16,37,60,.45);transition:border-color .3s,background .3s,transform .3s var(--ease)}
.social svg{width:30px;height:30px;fill:var(--ether);flex:none}
.social b{display:block;font:500 18px var(--px)}
.social small{font:400 10px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.social.is-live:hover{border-color:rgba(161,250,250,.5);background:rgba(161,250,250,.06);transform:translateY(-3px)}
.social.is-soon{opacity:.6}

/* rodapé: redes e contato */
.footer-mid{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:26px 0;border-bottom:1px solid var(--line)}
.footer-social{display:flex;gap:10px}
.footer-social a{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);transition:border-color .3s,background .3s}
.footer-social svg{width:20px;height:20px;fill:var(--ether)}
.footer-social a:hover:not(.is-soon){border-color:rgba(161,250,250,.5);background:rgba(161,250,250,.06)}
.footer-social a.is-soon{opacity:.45}
.footer-contact{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.footer-contact-label{font:400 11px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.footer-contact a{font:500 17px var(--px);color:var(--text)}
.footer-contact a:not(.is-soon):hover{color:var(--ether)}
.footer-contact a.is-soon{color:var(--muted)}
.copy-mini{font:400 10px var(--px-s);letter-spacing:.06em;text-transform:uppercase;color:var(--ether);padding:6px 9px;border:1px solid rgba(161,250,250,.3)}

@media (max-width:1000px){
  .dl,.support-grid,.creators-inner{grid-template-columns:1fr}
  .dl-info{padding:0}
}
@media (max-width:700px){
  .support,.creators{padding:90px 0}
  .goals ul{grid-template-columns:1fr}
  .dl-card,.pix{padding:22px}
  .btn-dl{font-size:16px;padding:18px 16px}
  .social{padding:14px;gap:10px}
  .social svg{width:24px;height:24px}
  .social b{font-size:16px}
  .steps li{width:100%}
  .footer-mid{flex-direction:column;align-items:flex-start}
}

/* corrige rolagem lateral: corta o que vaza (marquee inclinado, trilho das dimensões) sem permitir scroll horizontal */
html,body{overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
main{overflow-x:clip}

/* seletor de idioma */
.lang{position:relative;flex:none}
.lang-btn{display:flex;align-items:center;gap:8px;height:40px;padding:0 12px;font:400 12px var(--px-s);letter-spacing:.06em;color:var(--text);border:1px solid var(--line);background:rgba(11,13,38,.4);transition:border-color .25s,color .25s}
.lang-btn svg{width:14px;height:14px;fill:var(--ether)}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{border-color:rgba(161,250,250,.45);color:var(--ether)}
.lang-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:130;min-width:210px;margin:0;padding:6px;list-style:none;background:rgba(11,13,38,.97);border:1px solid rgba(161,250,250,.25);box-shadow:0 24px 60px -20px rgba(0,0,0,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.lang-menu button,.lang-soon{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;padding:10px 12px;font:500 15px var(--px);color:var(--text);text-align:left}
.lang-menu button:hover{background:rgba(161,250,250,.08);color:var(--ether)}
.lang-menu button[aria-checked="true"]{color:var(--ether)}
.lang-menu button[aria-checked="true"]::after{content:"✦";font-size:11px}
.lang-menu small{font:400 10px var(--px-s);letter-spacing:.06em;color:var(--muted);text-transform:uppercase}
.lang-menu button small{margin-left:auto}
.lang-menu button[aria-checked="true"] small{margin-left:auto}
.lang-soon{color:var(--muted);cursor:default;opacity:.7}
.lang-menu li+li{border-top:1px solid rgba(161,250,250,.06)}
.lang-menu li:nth-child(3){border-top:1px solid var(--line);margin-top:4px;padding-top:4px}
.pix-intl{font-size:14px;line-height:1.55;color:#d7ec98;padding:12px 14px;border:1px solid rgba(182,214,90,.35);background:rgba(142,150,71,.1)}
.steps em{font-style:normal}
@media (max-width:1000px){.site-header .lang{margin-left:auto}.site-header .btn-sm{margin-left:0}}
@media (max-width:700px){.site-header .menu{margin-left:0}.lang-btn{height:40px;padding:0 10px}.lang-menu{right:-52px}}
/* cabeçalho em telas médias: tudo numa linha só */
.site-header .btn-sm,.site-header nav a,.lang-btn{white-space:nowrap}
@media (min-width:1001px) and (max-width:1280px){.site-header{gap:18px}.site-header nav{gap:0}.site-header nav a{padding:8px 10px;font-size:14px}.site-header nav a::after{left:10px;right:10px}.brand{font-size:21px}}