:root{--bg:#0e1116;--s1:#151922;--s2:#1c2230;--line:#273042;--tx:#eef1f6;--mu:#9aa5b8;--ac:#c6f23b;--acd:#0e1116;--star:#ffbf3c;--r:14px;--max:1180px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--ac);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{line-height:1.2;letter-spacing:-.01em;margin:0 0 .6em}h1{font-size:clamp(1.9rem,4.4vw,3rem);font-weight:800}
h2{font-size:clamp(1.3rem,2.6vw,1.7rem);font-weight:750}h3,.h3{font-size:1.1rem;font-weight:700}
.wrap{max-width:var(--max);margin:0 auto;padding:0 16px}.narrow{max-width:860px}
.muted{color:var(--mu)}.mt{margin-top:24px}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:8px;background:var(--ac);color:var(--acd);padding:8px 12px;border-radius:8px;z-index:99}
.ic{width:1em;height:1em;fill:currentColor;flex:none}
/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(14,17,22,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;gap:20px;height:64px}
.logo{display:flex;align-items:center;gap:10px;color:var(--tx);font-weight:800;letter-spacing:.06em}.logo:hover{text-decoration:none}
.logo-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--ac);color:var(--acd);font-size:1.15rem}
.logo-txt b{color:var(--ac);margin-left:3px}
.nav{display:flex;gap:4px;margin-left:auto}.nav a{color:var(--tx);padding:8px 11px;border-radius:8px;font-size:.95rem;font-weight:550}
.nav a:hover,.nav a[aria-current]{background:var(--s2);text-decoration:none}
.menu-btn{display:none;margin-left:auto;background:none;border:0;padding:10px;cursor:pointer}.menu-btn span{display:block;width:22px;height:2px;background:var(--tx);margin:4px 0;border-radius:2px}
@media(max-width:980px){.menu-btn{display:block}.nav{position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--s1);border-bottom:1px solid var(--line);padding:8px 16px 16px;display:none}.nav.open{display:flex}.top .top-cta{display:none}}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:700;border:1px solid transparent;transition:transform .15s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}.btn .ic{width:1.15em;height:1.15em}
.btn-pri{background:var(--ac);color:var(--acd)}.btn-sec{background:var(--s2);color:var(--tx);border-color:var(--line)}.btn-sec .ic{color:var(--star)}
.btn-sm{padding:9px 15px;font-size:.92rem}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
/* hero */
.hero{background:radial-gradient(900px 420px at 85% 0%,rgba(198,242,59,.12),transparent 60%),linear-gradient(180deg,#121722,var(--bg));border-bottom:1px solid var(--line)}
.hero-in{display:grid;grid-template-columns:1.25fr 1fr;gap:40px;align-items:center;padding:56px 16px}
.eyebrow{color:var(--ac);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem;margin:0 0 12px}
.hl{color:var(--ac)}.lead{font-size:1.1rem;color:#c9d1de;max-width:62ch}
.ticks{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--mu);font-size:.93rem}.ticks li:before{content:"✓ ";color:var(--ac);font-weight:800}
.hero-art{position:relative;height:420px}
.hero-art img{position:absolute;width:52%;border-radius:12px;box-shadow:0 24px 60px rgba(0,0,0,.55);border:1px solid var(--line)}
.hero-art img:nth-child(1){left:0;top:40px;transform:rotate(-6deg)}.hero-art img:nth-child(2){left:24%;top:0;z-index:2}.hero-art img:nth-child(3){right:0;top:50px;transform:rotate(6deg)}
@media(max-width:860px){.hero-in{grid-template-columns:1fr;padding:36px 16px}.hero-art{height:300px;max-width:420px}}
/* sections */
.sec{padding:36px 0}.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px}.sec-h h2{margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:18px}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,170px);gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}.rail .card{scroll-snap-align:start}
.card{display:flex;flex-direction:column;background:var(--s1);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--tx);transition:border-color .2s,transform .2s}
.card:hover{text-decoration:none;border-color:var(--ac);transform:translateY(-2px)}
.card img{aspect-ratio:2/3;object-fit:cover;width:100%}
.card-b{display:flex;flex-direction:column;gap:3px;padding:10px 12px 14px}.card-t{font-weight:700;line-height:1.25}.card-m{color:var(--mu);font-size:.85rem}
.rate{display:inline-flex;align-items:center;gap:5px;color:var(--tx)}.rate .ic{color:var(--star)}.rate b{font-weight:800}.rate small{color:var(--mu)}
.rate.big{font-size:1.5rem}.rate.big small{font-size:.9rem}.rate.empty .ic{color:var(--mu)}
.split{display:grid;grid-template-columns:1.6fr 1fr;gap:32px;align-items:start}@media(max-width:860px){.split{grid-template-columns:1fr}}
.box{background:var(--s1);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.steps li{background:var(--s1);border:1px solid var(--line);border-radius:var(--r);padding:20px;counter-increment:s;display:flex;flex-direction:column;gap:6px}
.steps li:before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ac);color:var(--acd);font-weight:800}
.steps span{color:var(--mu)}@media(max-width:760px){.steps{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.chip{padding:6px 13px;border-radius:999px;border:1px solid var(--line);background:var(--s2);color:var(--tx);font-size:.9rem}.chip:hover{border-color:var(--ac);text-decoration:none}
.faq details{background:var(--s1);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:0 18px}
.faq summary{cursor:pointer;padding:15px 0;font-weight:650;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";float:right;color:var(--ac);font-weight:800}
.faq details[open] summary:after{content:"–"}.faq p{margin:0 0 16px;color:#c9d1de}
.band{background:linear-gradient(90deg,#1b2410,#15200e);border-top:1px solid #2c3a17;border-bottom:1px solid #2c3a17;margin-top:28px}
.band-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:32px 16px;flex-wrap:wrap}.band h2{margin:0 0 4px}.band p{margin:0;color:#c9d1de}
/* page */
.crumbs{font-size:.88rem;color:var(--mu);padding:18px 0 6px;display:flex;flex-wrap:wrap;gap:6px}.crumbs a{color:var(--mu)}.crumbs .sep{opacity:.5}
.phead{padding:10px 0 18px}.byline{color:var(--mu);font-size:.88rem}
.prose{font-size:1.04rem}.prose p,.prose li{color:#d3dae6}.prose h2{margin-top:1.6em}.prose li{margin-bottom:6px}
.facts{width:100%;border-collapse:collapse;font-size:.95rem}.facts th,.facts td{text-align:left;padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top}
.facts th{color:var(--mu);font-weight:600;width:42%;padding-right:12px}.facts.wide th{width:auto}
/* ranking */
.ranking{list-style:none;padding:0;margin:0}
.rk{display:grid;grid-template-columns:36px 60px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.rk-n{font-weight:800;font-size:1.2rem;color:var(--mu);text-align:center}.rk img{border-radius:8px}
.rk-b{display:flex;flex-direction:column;gap:2px;min-width:0}.rk-t{color:var(--tx);font-weight:700;font-size:1.05rem}.rk-l{font-size:.9rem}
@media(max-width:600px){.rk{grid-template-columns:28px 52px 1fr}.rk .rate{grid-column:3}.rk-l{display:none}}
.note{margin-top:18px;font-size:.92rem}
/* ficha */
.title{background:radial-gradient(800px 360px at 20% 0%,hsla(var(--hue),70%,45%,.22),transparent 65%),linear-gradient(180deg,#121722,var(--bg));border-bottom:1px solid var(--line)}
.title-in{display:grid;grid-template-columns:260px 1fr;gap:36px;padding:22px 16px 36px;align-items:start}
.title-poster{border-radius:14px;border:1px solid var(--line);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.yr{color:var(--mu);font-weight:500}.logline{font-size:1.12rem;color:#d3dae6;max-width:60ch}
.scores{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:12px 36px;margin:18px 0 4px}
.score{display:flex;flex-direction:column;gap:4px}.score-l{text-transform:uppercase;letter-spacing:.07em;font-size:.74rem;color:var(--mu);font-weight:700}
.pub-n,.vmsg{font-size:.85rem}
.vstars{display:flex;gap:1px}.vstars button{background:none;border:0;padding:3px 1px;cursor:pointer;color:#3a4458;font-size:1.25rem;line-height:0}
.vstars button.on{color:var(--star)}.vstars button:focus-visible{outline:2px solid var(--ac);border-radius:4px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.two{display:grid;grid-template-columns:1fr 340px;gap:36px;padding-top:28px}.cta-box{border-color:#3a4d1a;background:linear-gradient(180deg,#18210f,var(--s1))}
@media(max-width:900px){.title-in{grid-template-columns:150px 1fr;gap:20px}.two{grid-template-columns:1fr}.scores{grid-template-columns:1fr 1fr}.vote{grid-column:1/-1}}
@media(max-width:520px){.title-in{grid-template-columns:1fr}.title-poster{width:160px}}
/* planos e gêneros */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin:24px 0}
.plan{background:var(--s1);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:flex;flex-direction:column}.plan ul{padding-left:18px;flex:1}
.gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.gcard{background:var(--s1);border:1px solid var(--line);border-radius:var(--r);padding:20px;color:var(--tx);display:flex;flex-direction:column;gap:6px}.gcard span{color:var(--mu);font-size:.9rem}.gcard:hover{border-color:var(--ac);text-decoration:none}
/* footer */
.foot{border-top:1px solid var(--line);margin-top:48px;background:#0b0d12}
.foot-in{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px;padding:40px 16px 20px}.foot h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mu)}
.foot-in div>a:not(.logo){display:block;color:var(--tx);padding:3px 0;font-size:.95rem}.foot p{font-size:.92rem}
.legal{font-size:.8rem;padding-bottom:28px}@media(max-width:760px){.foot-in{grid-template-columns:1fr 1fr}.foot-in>div:first-child{grid-column:1/-1}}
