/* Caderno grifado — mesmos tokens de mobile/lib/tema.ts */
:root {
  --papel: #F6F4EE;
  --cartao: #FFFEFA;
  --borda: #E7E2D6;
  --texto: #22252B;
  --apoio: #45464B;
  --mudo: #6D6A63;
  --tinta: #1F3A6E;
  --grifo: rgba(242, 223, 111, 0.78);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--papel);
  color: var(--texto);
  font: 17px/1.65 "Literata", Georgia, "Times New Roman", serif;
}
main { max-width: 42rem; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; }
header { margin-bottom: 2rem; }
.marca {
  font: 700 0.95rem/1 "Manrope", system-ui, -apple-system, sans-serif;
  letter-spacing: 0.02em;
  color: var(--tinta);
  text-decoration: none;
}
h1 { font-size: 1.9rem; line-height: 1.2; margin: 1.25rem 0 0.25rem; }
h2 {
  font: 700 1.05rem/1.3 "Manrope", system-ui, -apple-system, sans-serif;
  margin: 2.25rem 0 0.5rem;
}
p, li { color: var(--apoio); }
ul { padding-left: 1.2rem; }
li { margin: 0.35rem 0; }
strong { color: var(--texto); }
mark { background: var(--grifo); color: var(--texto); padding: 0 0.1em; }
a { color: var(--tinta); }
.atualizado { font: 500 0.9rem/1.4 "Manrope", system-ui, sans-serif; color: var(--mudo); margin: 0; }
.caixa {
  background: var(--cartao);
  border: 1px solid var(--borda);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  margin: 1.25rem 0;
}
.tabela { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
th, td { text-align: left; vertical-align: top; padding: 0.55rem 0.5rem; border-bottom: 1px solid var(--borda); }
th { font: 700 0.85rem/1.3 "Manrope", system-ui, sans-serif; color: var(--texto); }
td { color: var(--apoio); }
footer { margin-top: 3rem; font: 500 0.9rem/1.5 "Manrope", system-ui, sans-serif; color: var(--mudo); }
footer a { margin-right: 1rem; }

/* ---------------------------------------------------------------------------
   Landing (index.html). Tudo escopado em `.lp` de propósito: os Termos e a
   Privacidade usam os seletores de cima e não podem mudar de aparência por
   causa daqui.
   --------------------------------------------------------------------------- */
.lp { max-width: 44rem; padding-top: 2rem; }

.lp-topo { display: flex; align-items: center; gap: 0.55rem; margin-bottom: 2.5rem; }
.simbolo { width: 34px; height: 34px; display: block; }

.lp h1 {
  font-size: clamp(2.05rem, 7.5vw, 3.1rem);
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 0 0 1rem;
  color: var(--texto);
}
.lp .sub { font-size: 1.12rem; line-height: 1.6; margin: 0 0 1.75rem; }

/* Ação primária. É a única da página — as repetições abaixo são a MESMA ação
   (docs/03: um CTA primário; @richardrx: repetir a cada ~1,5 seção). */
.cta {
  display: block;
  text-align: center;
  background: var(--tinta);
  color: #FFFEFA;
  text-decoration: none;
  font: 700 1.05rem/1.2 "Manrope", system-ui, -apple-system, sans-serif;
  padding: 1.05rem 1.5rem;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(60, 50, 30, 0.10);
}
.cta:hover { background: #18305c; }
.cta:focus-visible { outline: 3px solid var(--texto); outline-offset: 3px; }
.microcopy {
  font: 500 0.92rem/1.5 "Manrope", system-ui, sans-serif;
  color: var(--mudo);
  margin: 0.7rem 0 0;
  text-align: center;
}

.fatos {
  margin: 2.25rem 0 0;
  padding: 1rem 1.1rem;
  background: var(--cartao);
  border: 1px solid var(--borda);
  border-radius: 12px;
  font-size: 1rem;
}

/* Recorte real do corpus: é a prova do mecanismo, não ilustração. */
.correcao {
  background: var(--cartao);
  border: 1px solid var(--borda);
  border-radius: 12px;
  padding: 1.1rem 1.2rem 1.25rem;
  box-shadow: 0 8px 20px rgba(60, 50, 30, 0.06);
}
.correcao .veredito {
  font: 700 1.1rem/1.4 "Literata", Georgia, serif;
  color: var(--texto);
  margin: 0 0 0.9rem;
}
.correcao .ref {
  font: 700 0.85rem/1.3 "Manrope", system-ui, sans-serif;
  color: var(--tinta);
  margin: 0 0 0.35rem;
}
.correcao .lei { font-size: 1.02rem; line-height: 1.75; color: var(--texto); margin: 0; }
.legenda { font: 500 0.9rem/1.55 "Manrope", system-ui, sans-serif; color: var(--mudo); margin-top: 0.75rem; }

.passos { list-style: none; padding: 0; margin: 0.75rem 0 0; counter-reset: passo; }
.passos li {
  counter-increment: passo;
  position: relative;
  padding-left: 2.4rem;
  margin: 0.85rem 0;
}
.passos li::before {
  content: counter(passo);
  position: absolute;
  left: 0;
  top: 0.1em;
  width: 1.65rem;
  height: 1.65rem;
  border: 1.5px solid var(--tinta);
  border-radius: 50%;
  color: var(--tinta);
  font: 700 0.85rem/1.55rem "Manrope", system-ui, sans-serif;
  text-align: center;
}

.abre, .naoe { list-style: none; padding: 0; margin: 0.75rem 0 0; }
.abre li, .naoe li { position: relative; padding-left: 1.2rem; margin: 0.7rem 0; }
.abre li::before, .naoe li::before { content: "·"; position: absolute; left: 0.25rem; color: var(--tinta); font-weight: 700; }

.lp .mudo { color: var(--mudo); font-size: 0.95rem; }
.lp h2 { margin-top: 2.75rem; }
.lp .cta + h2 { margin-top: 3rem; }

@media (min-width: 40rem) {
  .lp { padding-top: 3rem; }
  .cta { display: inline-block; padding-left: 2.25rem; padding-right: 2.25rem; }
  .microcopy { text-align: left; }
}