/* ══════════════════════════════════════════════════════════════
   ELEVON — páginas legais (termos e privacidade)
   Complementa css/style.css. Mesma direção: papel claro,
   filetes de 1px, cantos retos, sem cards com borda.
   ══════════════════════════════════════════════════════════════ */

/* header sólido: aqui não há hero escuro para se sobrepor */
.header--solido {
  position: relative;
  background: var(--grafite);
  padding-top: 24px;
  padding-bottom: 24px;
}

/* ─── CAPA DO DOCUMENTO ──────────────────────────────────────── */
.doc-capa {
  background: var(--grafite);
  color: #fff;
  padding: 88px var(--pad-x) 72px;
}
.doc-capa__inner { max-width: 820px; margin: 0 auto; }

.doc-capa h1 {
  font-size: 52px;
  line-height: 1.04;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #fff;
  margin-bottom: 28px;
  text-wrap: balance;
}

.doc-datas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 28px;
  border-top: 1px solid var(--filete-br);
  padding-top: 24px;
}
.doc-datas dt {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sinal);
  margin-bottom: 8px;
}
.doc-datas dd { margin: 0; font-size: 16px; color: var(--br-1); }

/* ─── CORPO ──────────────────────────────────────────────────── */
.doc {
  padding: 0 var(--pad-x) 112px;
}
.doc__inner {
  max-width: 820px;
  margin: 0 auto;
}

/* índice */
.doc-indice {
  border-bottom: 1px solid var(--filete);
  padding: 40px 0 36px;
  margin-bottom: 8px;
}
.doc-indice h2 {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--verde-texto);
  margin-bottom: 20px;
}
.doc-indice ol {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 40px;
}
.doc-indice li { margin-bottom: 9px; break-inside: avoid; }
.doc-indice a { font-size: 15px; color: var(--grafite); }
.doc-indice a:hover { color: var(--verde-texto); }
.doc-indice span { color: var(--tx-4); margin-right: 8px; }

/* seção */
.doc-sec {
  border-top: 1px solid var(--filete);
  padding: 44px 0;
}
.doc-sec:first-of-type { border-top: none; }

.doc-sec h2 {
  font-size: 26px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.01em;
  margin-bottom: 20px;
  scroll-margin-top: 24px;
}
.doc-sec h2 .num {
  color: var(--sinal);
  font-weight: 500;
  margin-right: 12px;
}

.doc-sec h3 {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  margin: 32px 0 14px;
}

.doc-sec p {
  font-size: 16px;
  line-height: 1.7;
  color: var(--tx-2);
  margin-bottom: 16px;
  text-wrap: pretty;
}
.doc-sec p:last-child { margin-bottom: 0; }
.doc-sec strong { color: var(--grafite); font-weight: 600; }

.doc-sec ul {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}
.doc-sec ul li {
  position: relative;
  font-size: 16px;
  line-height: 1.7;
  color: var(--tx-2);
  padding-left: 22px;
  margin-bottom: 10px;
}
.doc-sec ul li::before {
  content: "";
  position: absolute;
  left: 0; top: 12px;
  width: 7px; height: 1px;
  background: var(--sinal);
}

.doc-sec ol {
  margin: 0 0 16px;
  padding-left: 22px;
}
.doc-sec ol li {
  font-size: 16px;
  line-height: 1.7;
  color: var(--tx-2);
  margin-bottom: 10px;
  padding-left: 6px;
}
.doc-sec ol li::marker { color: var(--sinal); font-weight: 500; }

/* tabela técnica */
.doc-tabela {
  width: 100%;
  border-collapse: collapse;
  margin: 4px 0 20px;
  font-size: 15px;
}
.doc-tabela th {
  text-align: left;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tx-4);
  padding: 0 16px 12px 0;
  border-bottom: 1px solid var(--filete);
  vertical-align: bottom;
}
.doc-tabela th:last-child, .doc-tabela td:last-child { padding-right: 0; }
.doc-tabela td {
  padding: 14px 16px 14px 0;
  border-bottom: 1px solid rgba(8, 13, 26, 0.08);
  vertical-align: top;
  line-height: 1.55;
  color: var(--tx-2);
}
.doc-tabela td:first-child { color: var(--grafite); }
.doc-tabela tr:last-child td { border-bottom: none; }

/* bloco de destaque — sem borda, apenas fundo verde translúcido */
.doc-nota {
  background: var(--verde-fundo);
  border-left: 2px solid var(--verde);
  padding: 22px 26px;
  margin: 4px 0 20px;
}
.doc-nota p { margin-bottom: 12px; }
.doc-nota p:last-child { margin-bottom: 0; }

/* bloco crítico — cláusula de responsabilidade técnica */
.doc-nota--forte {
  background: var(--grafite);
  border-left-color: var(--sinal);
  color: #fff;
}
.doc-nota--forte p { color: var(--br-2); }
.doc-nota--forte strong { color: #fff; }

/* placeholder pendente de preenchimento */
.pendente {
  background: #FFF3C4;
  color: #6B4E00;
  padding: 1px 7px;
  font-size: 0.94em;
  font-weight: 500;
  border-bottom: 1px solid #E0B700;
}

/* rodapé do documento */
.doc-fim {
  border-top: 1px solid var(--filete);
  padding-top: 36px;
  margin-top: 8px;
}
.doc-fim__contato {
  font-size: 16px;
  line-height: 1.8;
  color: var(--tx-2);
}
.doc-fim__contato strong { color: var(--grafite); font-weight: 600; }

.doc-voltar {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 32px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--verde-texto);
}
.doc-voltar:hover { color: var(--verde); }

/* par de links entre os dois documentos */
.doc-par {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 0;
  border-top: 1px solid var(--filete);
  margin-top: 44px;
}
.doc-par a {
  padding: 28px 0;
  border-bottom: 1px solid var(--filete);
  color: var(--grafite);
}
.doc-par a + a { border-left: 1px solid var(--filete); padding-left: 32px; }
.doc-par a:hover { background: var(--verde-fundo); }
.doc-par .rot {
  display: block;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tx-4);
  margin-bottom: 8px;
}
.doc-par .tit { display: block; font-size: 19px; font-weight: 600; }

/* ─── RESPONSIVO ─────────────────────────────────────────────── */
@media (max-width: 1000px) {
  .doc-capa { padding-top: 64px; padding-bottom: 56px; }
  .doc-capa h1 { font-size: 40px; }
  .doc { padding-bottom: 80px; }
}

@media (max-width: 640px) {
  .doc-capa h1 { font-size: 31px; }
  .doc-indice ol { columns: 1; }
  .doc-sec { padding: 34px 0; }
  .doc-sec h2 { font-size: 21px; }
  .doc-sec h2 .num { display: block; margin: 0 0 4px; font-size: 12px; }
  .doc-sec p, .doc-sec ul li, .doc-sec ol li { font-size: 15px; }

  /* tabelas viram blocos empilhados */
  .doc-tabela, .doc-tabela tbody, .doc-tabela tr, .doc-tabela td { display: block; width: 100%; }
  .doc-tabela thead { display: none; }
  .doc-tabela tr {
    border-bottom: 1px solid var(--filete);
    padding: 16px 0;
  }
  .doc-tabela tr:last-child { border-bottom: none; }
  .doc-tabela td { border: none; padding: 0 0 6px; }
  .doc-tabela td:first-child { font-weight: 600; }
  .doc-tabela td[data-rot]::before {
    content: attr(data-rot);
    display: block;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--tx-4);
    margin-bottom: 3px;
  }

  .doc-nota { padding: 18px 20px; }
  .doc-par a + a { border-left: none; padding-left: 0; }
}

@media print {
  .header, .doc-indice, .doc-voltar, .doc-par { display: none; }
  .doc-capa { background: #fff; color: #000; padding: 24px 0; }
  .doc-capa h1 { color: #000; }
  .doc-capa dd { color: #000; }
  .doc-nota--forte { background: #fff; color: #000; border-left-color: #000; }
  .doc-nota--forte p, .doc-nota--forte strong { color: #000; }
  .doc-sec { break-inside: avoid; }
}