@font-face{font-family:"Titan One";src:url("/fonts/titan-one.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans";src:url("/fonts/noto-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans";src:url("/fonts/noto-sans-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Noto Sans";src:url("/fonts/noto-sans-800.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}

:root{
  --hb-noite:#14010f;
  --hb-uva:#1a0518;
  --hb-flap:#2a0830;
  --hb-vermelho:#c01010;
  --hb-sangue:#8a0808;
  --hb-ouro:#ffd24a;
  --hb-ambar:#f0b040;
  --hb-laranja:#f07000;
  --hb-creme:#fff4d2;
  --hb-jade:#2ecc71;
  --hb-max:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--hb-noite);color:var(--hb-creme);font-family:"Noto Sans",system-ui,sans-serif;font-size:18px;line-height:1.55;-webkit-text-size-adjust:100%}
body{background:radial-gradient(1200px 700px at 70% 20%,#3a0a28 0%,var(--hb-uva) 42%,var(--hb-noite) 100%);min-height:100%;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--hb-ouro);text-decoration:none}
a:hover{color:#ffe9a0}
:focus-visible{outline:2px solid var(--hb-ouro);outline-offset:3px}

/* ===== HEADER ===== */
.hb-topo{position:relative;z-index:20;height:62px;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:linear-gradient(180deg,#2a0a18 0%,#14010f 100%);border-bottom:2px solid #f0b040;box-shadow:0 4px 18px #000a}
.hb-marca{display:flex;align-items:center;gap:8px;flex:0 0 auto;color:var(--hb-creme)}
.hb-logo-cabeca{width:60px;height:60px;object-fit:contain;flex:0 0 60px;filter:drop-shadow(0 0 6px #ffd24a88)}
.hb-marca-txt{display:flex;flex-direction:column;line-height:1.05}
.hb-wordmark{font-family:"Titan One",sans-serif;font-size:20px;color:var(--hb-ouro);letter-spacing:.02em}
.hb-etiqueta-mini{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#ffc9c9}
.hb-nav{display:flex;align-items:center;gap:6px;flex:1 1 auto;justify-content:center}
.hb-nav a{display:inline-flex;align-items:center;gap:4px;height:36px;padding:0 10px;border-radius:999px;background:#2a0818;border:1px solid #f0b04066;color:var(--hb-creme);font-weight:700;font-size:13px}
.hb-nav a[aria-current="page"],.hb-nav a:hover{background:#c01010;border-color:var(--hb-ouro);color:#fff8d0}
.hb-nav svg{width:14px;height:14px;fill:currentColor}
.hb-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:40px;padding:0 16px;border-radius:999px;
  background:linear-gradient(180deg,#ffd24a 0%,#f07000 55%,#c01010 100%);
  color:#3a0210;font-weight:800;font-size:14px;letter-spacing:.03em;
  border:2px solid #ffe27a;box-shadow:0 0 16px #ffd24a88,0 3px 0 #6a0508;
  white-space:nowrap;
}
.hb-cta:hover{color:#1a0108;filter:brightness(1.08)}
.hb-cta-rec{margin-top:10px}
.hb-burger{display:none;width:40px;height:36px;border:1px solid var(--hb-ouro);background:#2a0818;color:var(--hb-ouro);border-radius:8px;font-size:20px}
.hb-ticker{position:relative;z-index:15;height:18px;overflow:hidden;width:100%;background:#0a0008;border-bottom:1px solid #f0b04055;color:#ffd24a;font-size:12px;font-weight:700;letter-spacing:.06em;display:flex;align-items:center}
.hb-ticker-track{display:flex;gap:48px;white-space:nowrap;animation:hb-marquee 36s linear infinite;padding-left:130%;will-change:transform}
@keyframes hb-marquee{to{transform:translateX(-100%)}}

/* ===== LOBBY FOLD — 1280x800 ===== */
.hb-lobby{position:relative;width:100%;max-width:100%;background:#14010f}
.hb-palco{position:relative;width:100%;height:720px;overflow:hidden;background:#14010f}
.hb-cena{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;pointer-events:none;user-select:none}
.hb-selos{position:absolute;left:0;top:0;width:28%;height:62%;z-index:5}
.hb-selo{position:absolute;width:118px;text-align:center;color:var(--hb-creme);text-decoration:none;filter:drop-shadow(0 6px 10px #000a)}
.hb-selo img{width:96px;height:96px;margin:0 auto;object-fit:contain}
.hb-selo strong{display:block;margin-top:2px;font-family:"Titan One",sans-serif;font-size:22px;line-height:1.05;color:var(--hb-ouro);-webkit-text-stroke:3px #5a0408;paint-order:stroke fill;text-shadow:0 2px 0 #3a0210}
.hb-selo-1{left:38%;top:4%}
.hb-selo-2{left:8%;top:32%}
.hb-selo-3{left:30%;top:58%}
.hb-leque{position:absolute;left:24%;top:6%;width:74%;height:58%;z-index:4}
.hb-nota{position:absolute;width:150px;height:168px;display:flex;flex-direction:column;align-items:stretch;text-decoration:none;color:var(--hb-creme);filter:drop-shadow(0 8px 10px #000c)}
.hb-nota img{width:150px;height:150px;object-fit:cover;border-radius:8px}
.hb-placa{position:absolute;left:6px;right:6px;bottom:20px;background:linear-gradient(180deg,#5a0408,#8a0808);border:1px solid #ffd24a;border-radius:6px;padding:2px 4px;font-weight:800;font-size:15px;line-height:1.1;text-align:center;color:#fff4d2;text-shadow:0 1px 0 #000;hyphens:none}
.hb-badge{position:absolute;top:6px;right:6px;z-index:2;min-width:46px;height:22px;padding:0 6px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.04em;display:flex;align-items:center;justify-content:center;color:#1a0108;background:var(--hb-ouro);border:1px solid #fff4d2;box-shadow:0 2px 0 #5a0408}
.hb-badge.novo{background:#2ecc71;color:#06210e}
.hb-n1{left:2%;top:8%;transform:rotate(-8deg)}
.hb-n2{left:24%;top:0;transform:rotate(3deg)}
.hb-n3{left:46%;top:2%;transform:rotate(-4deg)}
.hb-n4{left:68%;top:10%;transform:rotate(7deg)}
.hb-n5{left:0%;top:48%;transform:rotate(6deg)}
.hb-n6{left:22%;top:42%;transform:rotate(-5deg)}
.hb-n7{left:44%;top:38%;transform:rotate(4deg)}
.hb-n8{left:66%;top:46%;transform:rotate(-6deg)}
.hb-h1{
  position:absolute;left:40%;right:3%;bottom:4%;z-index:6;
  font-family:"Titan One",sans-serif;font-weight:400;letter-spacing:.01em;
  line-height:.88;text-align:left;margin:0;
  color:#ffd24a;
  -webkit-text-stroke:6px #4a0208;
  paint-order:stroke fill;
  text-shadow:0 4px 0 #3a0210, 0 0 22px #ffd24a66;
}
.hb-h1 .hb-linha{display:block;font-size:52px}
.hb-h1 .hb-numero{display:block;font-size:100px}
.hb-placa-logo{
  position:absolute;left:12.5%;bottom:8%;z-index:7;
  width:170px;display:flex;flex-direction:column;align-items:center;gap:4px;
  background:linear-gradient(180deg,#2a0818cc,#14010fcc);border:2px solid var(--hb-ouro);
  border-radius:16px;padding:8px 8px 6px;box-shadow:0 8px 20px #000a,0 0 16px #ffd24a44;
}
.hb-placa-logo img{width:160px;height:160px;object-fit:contain}
.hb-placa-logo p{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--hb-ouro);text-align:center}

/* ===== INNER PAGES ===== */
.hb-miolo{max-width:var(--hb-max);margin:0 auto;padding:24px 20px 64px}
.hb-migalha{font-size:14px;color:#f0c9a0;margin-bottom:12px}
.hb-kicker{font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--hb-ouro);font-size:12px}
.hb-artigo h1,.hb-sec h1,.hb-dossie h1{
  font-family:"Titan One",sans-serif;font-size:44px;line-height:1.05;color:var(--hb-ouro);
  -webkit-text-stroke:3px #5a0408;paint-order:stroke fill;margin:8px 0 16px;
}
.hb-lead{font-size:20px;color:#ffe9c4;margin-bottom:18px}
.hb-figura{margin:16px 0 24px;background:#0a0008;border:1px solid #f0b04066;border-radius:12px;overflow:hidden}
.hb-figura figcaption{padding:8px 12px;font-size:14px;color:#f0c9a0}
.hb-artigo p,.hb-sec p,.hb-dossie p{margin:0 0 14px}
.hb-artigo h2,.hb-sec h2,.hb-dossie h2{font-family:"Titan One",sans-serif;font-size:28px;color:var(--hb-ambar);margin:28px 0 10px;-webkit-text-stroke:2px #5a0408;paint-order:stroke fill}
.hb-nota-ver{display:inline;background:#3a0210;color:#ffd24a;padding:0 4px;border-radius:4px;font-weight:800;font-size:.9em}
.hb-comissao{font-size:13px;color:#f0c9a0;margin-top:6px}
.hb-grade-jogo{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0}
.hb-card-jogo{background:#1a0518;border:1px solid #f0b04066;border-radius:12px;overflow:hidden;color:var(--hb-creme)}
.hb-card-jogo img{width:100%;aspect-ratio:1;object-fit:cover}
.hb-card-jogo p{padding:8px 10px;font-weight:800}
.hb-rodape{background:#0a0008;border-top:2px solid #f0b040;padding:28px 20px 40px;margin-top:20px;color:#f0c9a0;font-size:14px}
.hb-rodape-in{max-width:var(--hb-max);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:24px}
.hb-rodape h2{font-family:"Titan One",sans-serif;font-size:18px;color:var(--hb-ouro);margin-bottom:8px}
.hb-rodape a{display:inline-block;margin:2px 0;color:#ffe9c4}
.hb-18{margin-top:16px;font-weight:800;color:var(--hb-ouro)}

/* home sections below fold */
.hb-abaixo{max-width:var(--hb-max);margin:0 auto;padding:28px 20px 56px}
.hb-abaixo h2{font-family:"Titan One",sans-serif;font-size:32px;color:var(--hb-ouro);margin:8px 0 12px;-webkit-text-stroke:2px #5a0408;paint-order:stroke fill}
.hb-faixa{margin:28px 0;padding:20px;background:#1a0518cc;border:1px solid #f0b04055;border-radius:16px}
.hb-dossie-lista{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.hb-dossie-card{background:#14010f;border:1px solid #f0b04066;border-radius:12px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:var(--hb-creme)}
.hb-dossie-card img{width:96px;height:96px;object-fit:contain}
.hb-dossie-card strong{font-size:14px}

/* reviews hub: opened envelopes */
.hb-hub-intro{margin-bottom:20px}
.hb-hub-grade{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.hb-envelope{
  background:
    linear-gradient(180deg,#c01010 0%,#8a0808 100%);
  border:2px solid var(--hb-ouro);
  border-radius:10px 10px 4px 4px;
  padding:12px;
  color:var(--hb-creme);
  min-height:140px;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  box-shadow:0 6px 0 #3a0210;
  position:relative;
}
.hb-envelope::before{
  content:"";position:absolute;top:-14px;left:10%;right:10%;height:16px;
  background:linear-gradient(180deg,#f07000,#c01010);
  clip-path:polygon(0 100%,50% 0,100% 100%);
  border-top:2px solid var(--hb-ouro);
}
.hb-envelope img{width:72px;height:72px;object-fit:contain;background:#fff8;border-radius:10px;padding:4px}
.hb-envelope .hb-badge-txt{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:10px;background:#2a0818;border:1px solid var(--hb-ouro);font-weight:800;font-size:14px;text-align:center}
.hb-envelope h2{font-size:15px;color:var(--hb-ouro);text-align:center;margin:0}
.hb-envelope .hb-etiqueta-mini{margin-top:0}
.hb-hero-dossie{display:flex;gap:20px;align-items:center;margin:0 0 20px;background:#1a0518;border:1px solid #f0b04066;border-radius:16px;padding:16px}
.hb-hero-dossie img.hb-logo-dossie{width:176px;height:176px;object-fit:contain;background:#fff8;border-radius:16px;padding:8px}
.hb-faq details{background:#1a0518;border:1px solid #f0b04044;border-radius:10px;padding:10px 14px;margin:0 0 8px}
.hb-faq summary{font-weight:800;cursor:pointer;color:var(--hb-ouro)}

@media (max-width:1100px){
  .hb-nav a span{display:none}
  .hb-h1 .hb-linha{font-size:34px}
  .hb-h1 .hb-numero{font-size:80px}
  .hb-nota,.hb-nota img{width:132px}
  .hb-nota{height:150px}
  .hb-dossie-lista,.hb-hub-grade,.hb-grade-jogo{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:860px){
  .hb-cta{padding:0 10px;font-size:12px;height:34px}
  .hb-wordmark{font-size:16px}
  .hb-burger{display:inline-flex;align-items:center;justify-content:center}
  .hb-nav{display:none;position:absolute;top:62px;left:0;right:0;background:#14010f;flex-direction:column;padding:10px;border-bottom:2px solid var(--hb-ouro);z-index:30}
  .hb-nav.hb-aberto{display:flex}
  .hb-nav a{width:100%;height:40px;justify-content:flex-start}
  .hb-palco{height:auto;min-height:920px}
  .hb-cena{height:100%;object-position:left center}
  .hb-selos{position:relative;width:100%;height:auto;display:flex;justify-content:center;gap:8px;padding-top:8px}
  .hb-selo{position:relative;left:auto;top:auto;width:30%}
  .hb-selo img{width:72px;height:72px}
  .hb-selo strong{font-size:16px}
  .hb-leque{position:relative;left:auto;top:auto;width:100%;height:auto;display:grid;grid-template-columns:repeat(2,150px);justify-content:center;gap:12px;padding:12px 8px 8px}
  .hb-nota{position:relative;left:auto;top:auto;transform:none}
  .hb-placa-logo{position:relative;left:auto;bottom:auto;margin:8px auto}
  .hb-h1{position:relative;left:auto;right:auto;bottom:auto;text-align:center;padding:8px 12px 16px}
  .hb-h1 .hb-linha{font-size:28px}
  .hb-h1 .hb-numero{font-size:72px}
  .hb-dossie-lista,.hb-hub-grade,.hb-grade-jogo,.hb-rodape-in{grid-template-columns:1fr}
  .hb-artigo h1,.hb-sec h1,.hb-dossie h1{font-size:32px}
  .hb-hero-dossie{flex-direction:column}
}
@media (min-width:1280px){
  .hb-lobby{width:1280px;margin:0 auto}
  .hb-palco{width:1280px;height:720px}
}
