/* Direção visual "Noite Dourada" — briefing aprovado em 20/10/2026 */
:root {
  --noite: #0B0907;
  --noite-2: #120E0A;
  --carvao: #1A1510;
  --borda: #2E261D;
  --borda-forte: #4A3F33;
  --dourado: #F2B63D;
  --dourado-escuro: #2A1E0C;
  --creme: #FFF4E0;
  --texto-2: #D9CCB6;
  --texto-3: #BFB09A;
  --raio: 14px;
  --titulo: 'Poppins', system-ui, sans-serif;
  --corpo: 'Nunito Sans', system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--noite);
  color: var(--creme);
  font-family: var(--corpo);
  font-size: 16px;
  line-height: 1.5;
}
img { max-width: 100%; height: auto; display: block; }
.conteudo { max-width: 560px; margin: 0 auto; padding: 0 20px; }

/* ---------- Faixa e topo ---------- */
.faixa {
  background: var(--dourado);
  color: var(--noite);
  text-align: center;
  padding: 9px 16px;
  font-family: var(--titulo);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.06em;
  line-height: 1.4;
}
.topo {
  background: radial-gradient(120% 50% at 50% 0%, var(--dourado-escuro) 0%, var(--noite) 70%);
  padding: 28px 0 32px;
}
.topo .conteudo { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.selo {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 14px;
  border: 1.5px solid var(--dourado);
  border-radius: 999px;
  color: var(--dourado);
  font-family: var(--titulo); font-weight: 700; font-size: 12px; letter-spacing: 0.1em;
}
h1, h2 { font-family: var(--titulo); font-weight: 800; margin: 0; line-height: 1.22; }
h1 { font-style: italic; font-size: clamp(24px, 6.4vw, 34px); }
h2 { font-size: clamp(22px, 5.8vw, 28px); }
.destaque { color: var(--dourado); }
.sub { margin: 0; color: var(--texto-2); font-size: 15px; line-height: 1.55; }
.nota { color: var(--texto-3); font-size: 13px; margin: 0; }

/* ---------- Formulário ---------- */
.form {
  width: 100%; text-align: left;
  padding: 20px 18px;
  border-radius: 18px;
  background: var(--carvao);
  border: 1px solid #3A3127;
  display: flex; flex-direction: column; gap: 12px;
}
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; color: var(--texto-2); }
.campo input {
  width: 100%; height: 50px; padding: 0 14px;
  border-radius: 12px; border: 1px solid var(--borda-forte);
  background: var(--noite); color: var(--creme);
  font: 16px var(--corpo);
}
.campo input::placeholder { color: #8A7D6B; }
.campo input:focus { outline: 2px solid var(--dourado); outline-offset: 1px; }
.campo.erro input { border-color: #F07A6A; }
.msg-erro { color: #F5A497; font-size: 13px; font-weight: 600; min-height: 0; margin: 0; }
.msg-erro:empty { display: none; }
.seguro { text-align: center; font-size: 12px; color: var(--texto-3); }

/* intl-tel-input no tema escuro */
.iti { width: 100%; }
.iti input { padding-left: 96px !important; }
.iti__country-container { color: var(--creme); }
.iti__selected-country { background: #17120D; border-radius: 12px 0 0 12px; border-right: 1px solid var(--borda-forte); }
.iti__dropdown-content { background: var(--carvao); color: var(--creme); border: 1px solid var(--borda-forte); }
.iti__search-input { background: var(--noite); color: var(--creme); }
.iti__country.iti__highlight { background: var(--dourado-escuro); }
.iti__dial-code { color: var(--texto-3); }

/* ---------- Botões ---------- */
.botao {
  display: block; width: 100%;
  text-align: center; text-decoration: none;
  padding: 17px 14px;
  border: 0; border-radius: var(--raio);
  background: var(--dourado); color: var(--noite);
  font: 800 15px/1.3 var(--titulo);
  cursor: pointer;
  box-shadow: 0 0 26px rgba(242, 182, 61, 0.35);
}
.botao:hover { background: #FFC85A; }
.botao:disabled { opacity: 0.6; cursor: wait; }
.botao:focus-visible { outline: 3px solid var(--creme); outline-offset: 2px; }

/* ---------- Blocos ---------- */
.bloco { padding: 40px 0; }
.bloco .conteudo { display: flex; flex-direction: column; gap: 16px; }
.bloco--escuro { background: var(--noite-2); }
.bloco--linha { border-top: 1px solid #2A231B; }
.foto-filhos { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.foto-filhos img { width: 100%; aspect-ratio: 7 / 5; object-fit: cover; object-position: center 30%; border-radius: 18px; }
.foto-filhos figcaption { font-size: 13px; color: var(--texto-3); }

.lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.lista li { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: var(--raio); background: var(--carvao); font-size: 15px; }
.lista svg { flex: none; }

.aulas { display: flex; flex-direction: column; gap: 10px; }
.aula { display: flex; gap: 14px; padding: 16px; border-radius: var(--raio); background: var(--carvao); border: 1px solid var(--borda); }
.aula--black { border-color: var(--dourado); }
.data {
  flex: none; width: 58px; padding: 8px 0; border-radius: 10px;
  text-align: center; font-family: var(--titulo);
  background: var(--dourado-escuro); color: var(--dourado);
}
.aula--black .data { background: var(--dourado); color: var(--noite); }
.data b { display: block; font-size: 22px; line-height: 1.1; }
.data span { display: block; font-size: 11px; font-weight: 700; }
.aula h3 { margin: 0 0 4px; font: 700 15px/1.35 var(--titulo); }
.aula p { margin: 0; font-size: 14px; line-height: 1.45; color: var(--texto-2); }
.aula .tag { margin-top: 6px; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; color: var(--dourado); }

.centro { text-align: center; align-items: center; }
.logo-grande { width: 240px; height: 240px; object-fit: cover; border-radius: 20px; box-shadow: 0 0 40px rgba(242, 182, 61, 0.25); margin: 0 auto; }

.sorteio {
  padding: 22px; border-radius: 18px;
  background: linear-gradient(160deg, var(--dourado-escuro), var(--carvao));
  border: 1px solid #5A4220;
  display: flex; flex-direction: column; gap: 8px;
}
.rotulo { font-size: 12px; font-weight: 800; letter-spacing: 0.14em; color: var(--dourado); }
.sorteio h2 { font-size: 20px; }

.colagem { width: 100%; border-radius: 16px; background: var(--carvao); }
.numeros { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.numeros div { padding: 14px; border-radius: var(--raio); background: var(--carvao); }
.numeros b { display: block; font: 800 22px var(--titulo); color: var(--dourado); }
.numeros span { font-size: 13px; color: var(--texto-2); }

/* Carrosséis de depoimentos: rolagem lateral com encaixe, setas e bolinhas */
.carrossel { display: flex; flex-direction: column; gap: 12px; }
.trilho {
  display: flex; gap: 12px;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
  margin: 0 -20px; padding: 0 20px;
}
.trilho::-webkit-scrollbar { display: none; }
.trilho > * { flex: 0 0 86%; scroll-snap-align: center; }
.depo {
  display: flex; flex-direction: column; gap: 10px;
  padding: 20px; border-radius: 18px;
  background: var(--carvao); border: 1px solid var(--borda);
}
.depo img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid var(--dourado); }
.depo h3 { margin: 0; font: 800 17px/1.3 var(--titulo); color: var(--creme); }
.depo p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--texto-2); }
.autora { font-size: 13px; font-weight: 800; color: var(--dourado); }
.carrossel--prints .trilho > * { flex-basis: 72%; }
.carrossel--prints img { width: 100%; border-radius: 14px; background: #fff; }
.controles { display: flex; align-items: center; justify-content: center; gap: 14px; }
.seta {
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--borda-forte); background: var(--carvao); color: var(--creme);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.seta:hover { border-color: var(--dourado); color: var(--dourado); }
.pontos { display: flex; gap: 6px; }
.pontos button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #4A3F33; cursor: pointer; }
.pontos button[aria-current="true"] { background: var(--dourado); width: 20px; border-radius: 999px; }

.faq { display: flex; flex-direction: column; gap: 10px; }
.faq details { border-radius: var(--raio); background: var(--carvao); padding: 16px; }
.faq summary { font-weight: 800; font-size: 15px; cursor: pointer; }
.faq p { margin: 8px 0 0; font-size: 14px; color: var(--texto-2); }

.final { background: radial-gradient(120% 80% at 50% 100%, var(--dourado-escuro) 0%, var(--noite) 70%); }
.final h2 { font-style: italic; }

.rodape { padding: 24px 0 40px; text-align: center; font-size: 12px; line-height: 1.6; color: #A89A84; border-top: 1px solid #2A231B; }
.rodape a { color: #A89A84; }

/* ---------- Pesquisa ---------- */
.pesquisa { min-height: 100vh; padding: 20px 0 28px; }
.pesquisa .conteudo { display: flex; flex-direction: column; gap: 18px; min-height: calc(100vh - 48px); }
.pesquisa .marca { text-align: center; font: 700 11px var(--titulo); letter-spacing: 0.1em; color: var(--dourado); }
.barra { height: 8px; border-radius: 999px; background: #2A231B; overflow: hidden; }
.barra div { height: 8px; border-radius: 999px; background: var(--dourado); transition: width 0.25s; }
.progresso { display: flex; justify-content: space-between; font-size: 12px; color: var(--texto-3); }
.aviso { padding: 14px 16px; border-radius: var(--raio); background: var(--carvao); font-size: 13px; color: var(--texto-2); }
.contador { font-size: 12px; font-weight: 800; letter-spacing: 0.14em; color: var(--texto-3); }
.pergunta { font-size: 21px; line-height: 1.3; font-style: normal; }
.opcoes { display: flex; flex-direction: column; gap: 10px; }
.opcao {
  display: flex; align-items: center; gap: 12px;
  min-height: 54px; padding: 12px 16px;
  border-radius: var(--raio); border: 1.5px solid var(--borda);
  background: var(--carvao); color: var(--creme);
  font: 15px var(--corpo); cursor: pointer;
}
.opcao input { width: 18px; height: 18px; accent-color: var(--dourado); flex: none; margin: 0; }
.opcao:has(input:checked) { border-color: var(--dourado); background: var(--dourado-escuro); font-weight: 700; }
.resposta-aberta {
  width: 100%; min-height: 140px; padding: 14px;
  border-radius: var(--raio); border: 1.5px solid var(--borda-forte);
  background: var(--carvao); color: var(--creme);
  font: 16px/1.5 var(--corpo); resize: vertical;
}
.navegacao { margin-top: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.voltar {
  height: 52px; border-radius: var(--raio); border: 1px solid var(--borda-forte);
  background: transparent; color: var(--creme); font: 700 15px var(--titulo); cursor: pointer;
}
.navegacao .botao { box-shadow: none; padding: 0; height: 52px; }
.whats { background: #25D366; color: #06240F; box-shadow: none; display: flex; align-items: center; justify-content: center; gap: 10px; }
.whats:hover { background: #3BE07A; }
.oculto { display: none !important; }