/* BAIT GAMES — paleta oficial (docs/GAMEDESIGN_marca.md §3) */
:root{
  --isca:#2EE6C4;
  --polpa:#FF3D7F;
  --fundo:#0E1520;
  --osso:#DFF2FF;
  --fundo-claro:#16202e;
  --texto:#9FB3C8;
}

*{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth}

body{
  background:var(--fundo);
  color:var(--osso);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

/* o pixel nunca borra: escala inteira, sem suavizacao */
img{image-rendering:pixelated;image-rendering:crisp-edges}

a{color:var(--isca);text-decoration:none}
a:hover{text-decoration:underline}

.env{max-width:880px;margin:0 auto;padding:0 24px}

/* ---- topo ---- */
header{padding:72px 0 56px;text-align:center}
.lockup{width:min(420px,88vw);height:auto}
.lema{
  margin-top:20px;
  color:var(--texto);
  font-size:1.05rem;
  letter-spacing:.02em;
}
.lema b{color:var(--polpa);font-weight:600}

/* ---- faixa divisoria: a linha da mordida ---- */
.risco{
  height:3px;
  background:linear-gradient(90deg,transparent,var(--isca) 30%,var(--polpa) 70%,transparent);
  opacity:.5;
  margin:0 0 56px;
}

/* ---- card do jogo ---- */
.jogo{
  display:flex;
  gap:28px;
  align-items:center;
  flex-wrap:wrap;
  background:var(--fundo-claro);
  border:1px solid rgba(46,230,196,.18);
  border-radius:14px;
  padding:28px;
}
.jogo img{width:104px;height:104px;flex:none}
.jogo-txt{flex:1;min-width:240px}
.jogo h2{
  font-size:1.5rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--osso);
}
.tag{
  display:inline-block;
  margin:6px 0 10px;
  padding:2px 10px;
  border-radius:99px;
  background:rgba(255,61,127,.14);
  color:var(--polpa);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.jogo p{color:var(--texto);font-size:1rem}

/* ---- secoes ---- */
section{margin:56px 0}
h3{
  font-size:.8rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--isca);
  margin-bottom:14px;
}
section p{color:var(--texto)}

/* ---- rodape ---- */
footer{
  border-top:1px solid rgba(223,242,255,.08);
  margin-top:72px;
  padding:32px 0 56px;
  text-align:center;
  color:var(--texto);
  font-size:.9rem;
}
footer img{width:24px;height:24px;vertical-align:middle;margin-right:8px}
footer nav{margin-top:10px}
footer nav a{margin:0 10px}

/* ---- paginas de texto (privacidade) ---- */
.doc h1{font-size:1.9rem;margin-bottom:8px}
.doc h2{
  font-size:1rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--isca);
  margin:36px 0 10px;
}
.doc p,.doc li{color:var(--texto);font-size:1rem}
.doc ul{margin:0 0 0 22px}
.doc li{margin:6px 0}
.doc code{
  background:rgba(46,230,196,.1);
  color:var(--isca);
  padding:1px 6px;
  border-radius:4px;
  font-size:.92em;
}
.voltar{display:inline-block;margin-bottom:28px;font-size:.9rem}

@media(max-width:560px){
  body{font-size:17px}
  header{padding:48px 0 40px}
  .jogo{padding:22px;gap:20px}
}

/* ---- chamada de teste fechado ---- */
.teste{
  background:var(--fundo-claro);
  border:1px solid rgba(255,61,127,.28);
  border-radius:14px;
  padding:28px;
  text-align:center;
}
.teste h3{margin-bottom:10px}
.botao{
  display:inline-block;
  margin:22px 0 6px;
  padding:15px 38px;
  border-radius:10px;
  background:var(--polpa);
  color:var(--fundo);
  font-size:1.05rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.botao:hover{background:#ff5c93;text-decoration:none}
.passos{font-size:.88rem;opacity:.75;margin-top:14px}
