@font-face { font-family: "Inter"; src: url("fonts/Inter-SemiBold.otf") format("opentype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-Bold.otf") format("opentype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Inter Display"; src: url("fonts/InterDisplay-Black.otf") format("opentype"); font-weight: 900; font-display: swap; }

:root {
  --escuro: #0E1A24;
  --escuro-2: #16273A;
  --texto: #1B2A36;
  --texto-claro: #F0F4F7;
  --cinza: #5E7282;
  --cinza-claro: #9AAEBD;
  --laranja: #FF8A3D;
  --laranja-escuro: #C85A12;
  --verde: #2E9E62;
  --verde-claro: #5CC38A;
  --fundo: #F6F8FA;
  --cartao: #FFFFFF;
  --borda: #DDE4EA;
  --largura: 760px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font: 17px/1.65 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
}
img { max-width: 100%; height: auto; }
a { color: var(--laranja-escuro); }
h1, h2, h3 { font-family: "Inter", "Segoe UI", sans-serif; line-height: 1.2; color: var(--escuro); }
h2 { font-size: 1.55rem; margin: 2.6rem 0 .8rem; }
h3 { font-size: 1.15rem; margin: 1.6rem 0 .4rem; }
.conteudo { max-width: var(--largura); margin: 0 auto; padding: 0 16px; }

/* topo */
.barra { height: 6px; background: var(--laranja); }
.topo { background: var(--escuro); }
.topo .conteudo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 14px; padding-bottom: 14px; }
.marca { display: flex; align-items: center; gap: 10px; color: var(--texto-claro); text-decoration: none; font: 700 1rem "Inter", sans-serif; letter-spacing: .04em; }
.marca img { width: 34px; height: 34px; border-radius: 50%; }
.topo nav a { color: var(--cinza-claro); text-decoration: none; font: 600 .9rem "Inter", sans-serif; margin-left: 14px; }
.topo nav a:hover { color: var(--texto-claro); }

/* abertura */
.capa { background: var(--escuro); color: var(--texto-claro); padding: 40px 0 56px; }
.etiqueta { display: inline-block; font: 700 .78rem "Inter", sans-serif; letter-spacing: .12em; color: var(--laranja); margin-bottom: 10px; }
.capa h1 { font: 900 clamp(2.1rem, 7vw, 3.4rem)/1.05 "Inter Display", "Inter", sans-serif; color: var(--texto-claro); margin: 0 0 16px; }
.capa h1 em { font-style: normal; color: var(--laranja); }
.capa p { color: #C9D5DE; font-size: 1.1rem; max-width: 600px; margin: 0 0 24px; }
.botao { display: inline-block; background: var(--laranja); color: var(--escuro); font: 700 1rem "Inter", sans-serif; text-decoration: none; padding: 14px 22px; border-radius: 10px; border: 0; cursor: pointer; }
.botao:hover { background: #FF9C59; }
.botao.secundario { background: transparent; color: var(--texto-claro); border: 2px solid #34495C; margin-left: 8px; }
.botao.desligado { background: #E4E9EE; color: var(--cinza); cursor: default; pointer-events: none; }

/* blocos */
.cartao { background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px; padding: 20px; margin: 18px 0; }
.destaque { border-left: 5px solid var(--laranja); }
.fonte { font-size: .85rem; color: var(--cinza); }
.numeros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 18px 0; }
.numero { background: var(--escuro); color: var(--texto-claro); border-radius: 14px; padding: 16px; text-align: center; }
.numero b { display: block; font: 900 2.1rem/1 "Inter Display", "Inter", sans-serif; color: var(--laranja); margin-bottom: 6px; }
.numero span { font-size: .9rem; color: #C9D5DE; }

/* checklist */
.lista-kit { list-style: none; padding: 0; margin: 0; }
.lista-kit li { border-bottom: 1px solid var(--borda); }
.lista-kit li:last-child { border-bottom: 0; }
.lista-kit label { display: flex; gap: 12px; align-items: flex-start; padding: 12px 4px; cursor: pointer; }
.lista-kit input { width: 22px; height: 22px; accent-color: var(--verde); flex: none; margin-top: 3px; }
.lista-kit small { display: block; color: var(--cinza); font-size: .9rem; }
.placar { margin-top: 12px; font: 700 1.05rem "Inter", sans-serif; color: var(--escuro); }
.placar b { color: var(--verde); }

/* calculadora */
.calc { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.calc input { width: 90px; font-size: 1.2rem; padding: 10px; border: 2px solid var(--borda); border-radius: 10px; text-align: center; }
.calc .resultado { font: 900 1.6rem "Inter Display", "Inter", sans-serif; color: var(--escuro); }

/* produtos */
.produtos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.produto { background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; }
.produto h3 { margin-top: 0; }
.produto ul { padding-left: 18px; margin: 6px 0 14px; font-size: .95rem; }
.produto .por-que { font-size: .95rem; color: var(--cinza); margin: 0 0 6px; }
.produto .botao { margin-top: auto; text-align: center; font-size: .95rem; padding: 12px; }
.aviso-afiliado { font-size: .85rem; color: var(--cinza); background: #EEF2F5; border-radius: 10px; padding: 10px 14px; }

/* e-book */
.ebook { background: var(--escuro); color: var(--texto-claro); border-radius: 16px; padding: 26px; margin: 30px 0; }
.ebook h2 { color: var(--texto-claro); margin-top: 0; }
.ebook li { margin: 4px 0; }

/* rodapé */
.rodape { background: var(--escuro); color: var(--cinza-claro); margin-top: 60px; padding: 30px 0; font-size: .9rem; }
.rodape a { color: var(--texto-claro); margin-right: 14px; display: inline-block; margin-bottom: 6px; }
.rodape p { margin: 10px 0 0; }

/* páginas legais */
.legal h1 { font-size: 2rem; margin-top: 36px; }
.legal p, .legal li { color: #2C3E4C; }

.fontes { font-size: .85rem; color: var(--cinza); }
.fontes li { margin-bottom: 6px; word-break: break-word; }

@media (max-width: 560px) {
  body { font-size: 16px; }
  .numeros { grid-template-columns: 1fr; }
  .topo nav { display: none; }
  .botao.secundario { margin: 10px 0 0; }
}
