/* ═══════════════════════════════════════════════════════════════════════════════
   legal-030.css — páginas legais no padrão SITE-030 · 30/08/2026
   ═══════════════════════════════════════════════════════════════════════════════
   Carrega DEPOIS de styles.min.css (que já traz fontes v1, tokens, e as camadas 029/030).
   Aqui mora só o que é de página interna e de documento: o cabeçalho próprio (a home tem
   o dela dentro da hero, que não serve para páginas internas) e o layout editorial de
   leitura — coluna confortável, numeração discreta, índice âncora.

   Princípio: documento legal não é landing. Sem card de marketing, sem CTA agressivo,
   sem cor gritando. A identidade vem da tipografia e do papel, como no resto do site.
   ═══════════════════════════════════════════════════════════════════════════════ */

.pag-interna{background:var(--paper-100);color:var(--ink-900)}

/* ── cabeçalho de página interna ─────────────────────────────────────────────── */
.pag-topo{position:sticky;top:0;z-index:20;background:var(--ink-900);color:var(--paper-50)}
.pag-topo__linha{display:flex;align-items:center;gap:var(--space-6);min-height:64px}
.pag-topo__marca{font-family:var(--font-serif);font-size:22px;color:var(--paper-50);text-decoration:none;letter-spacing:-.01em}
.pag-topo__marca em{font-style:italic;color:var(--accent-gold)}
.pag-topo__nav{display:none;gap:var(--space-6);margin-left:auto;font-size:13.5px}
.pag-topo__nav a{color:var(--paper-200);text-decoration:none}
.pag-topo__nav a:hover{color:var(--paper-50)}
.pag-topo__cta{margin-left:auto;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-gold);text-decoration:none;border:1px solid rgba(201,162,93,.5);border-radius:4px;padding:9px 13px;white-space:nowrap}
.pag-topo__cta:hover{background:rgba(201,162,93,.12)}

/* ── documento ───────────────────────────────────────────────────────────────── */
.doc{padding:var(--space-12) 0 var(--space-16);max-width:100%}
.doc-hero{padding-bottom:var(--space-8);border-bottom:var(--frame)}
.doc-hero__titulo{font-family:var(--font-serif);font-weight:400;font-size:34px;line-height:1.12;letter-spacing:-.015em;
  color:var(--ink-900);margin:var(--space-4) 0 0;max-width:18ch}
.doc-hero__sub{margin-top:var(--space-4);font-size:16.5px;line-height:1.55;color:var(--ink-500);max-width:52ch}
.doc-meta{margin-top:var(--space-6);display:grid;gap:10px}
.doc-meta__par{display:flex;gap:10px;align-items:baseline;font-size:13px}
.doc-meta__k{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent-gold-graf);flex:0 0 auto;min-width:12ch}
.doc-meta__v{color:var(--ink-700);word-break:break-word}

/* índice: âncoras, não cartão */
.doc-indice{margin-top:var(--space-8);padding:var(--space-6);background:var(--paper-50);border:var(--frame);border-radius:6px}
.doc-indice__k{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-gold-graf);margin-bottom:var(--space-3)}
.doc-indice ol{list-style:none;counter-reset:idx;display:grid;gap:7px;margin:0;padding:0}
.doc-indice li{counter-increment:idx;display:flex;gap:10px;font-size:14.5px;line-height:1.4}
.doc-indice li::before{content:counter(idx,decimal-leading-zero);font-family:var(--font-mono);font-size:11px;color:var(--ink-500);flex:0 0 auto;padding-top:2px}
.doc-indice a{color:var(--ink-700);text-decoration:none;border-bottom:1px solid transparent}
.doc-indice a:hover{color:var(--ink-900);border-bottom-color:var(--accent-gold-graf)}

/* seções */
.doc-sec{margin-top:var(--space-12);scroll-margin-top:80px}
.doc-sec__titulo{font-family:var(--font-serif);font-weight:400;font-size:23px;line-height:1.25;color:var(--ink-900);
  display:flex;gap:12px;align-items:baseline;max-width:30ch}
.doc-sec__num{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--accent-gold-graf);flex:0 0 auto}
.doc-sec__corpo{margin-top:var(--space-4);padding-left:calc(11px + 12px)}
.doc-sec__corpo p{font-size:15.5px;line-height:1.65;color:var(--ink-700);max-width:62ch}
.doc-sec__corpo p + p{margin-top:var(--space-4)}
.doc-sec__corpo strong{color:var(--ink-900);font-weight:600}
.doc-sec__corpo a{color:var(--ink-900);text-decoration:none;border-bottom:1px solid var(--accent-gold-graf)}
.doc-sec__corpo a:hover{border-bottom-width:2px}
.doc-sec__corpo ul{margin:var(--space-4) 0 0;padding:0;list-style:none;display:grid;gap:12px;max-width:62ch}
.doc-sec__corpo li{position:relative;padding-left:18px;font-size:15.5px;line-height:1.6;color:var(--ink-700)}
.doc-sec__corpo li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:1.5px;background:var(--accent-gold-graf)}

/* fecho */
.doc-fim{margin-top:var(--space-16);padding-top:var(--space-6);border-top:var(--frame)}
.doc-fim p{font-size:14.5px;line-height:1.6;color:var(--ink-500)}
.doc-fim a{color:var(--ink-700);border-bottom:1px solid var(--accent-gold-graf);text-decoration:none}
.doc-fim__irmas{margin-top:var(--space-3);font-size:13.5px}
.footer-interno{margin-top:0}

/* ── DESKTOP ≥ 900 ───────────────────────────────────────────────────────────── */
@media (min-width:900px){
  .pag-topo__linha{min-height:72px}
  .pag-topo__nav{display:flex}
  .pag-topo__cta{margin-left:0}
  .doc{padding:var(--space-16) 0 var(--space-24)}
  .doc-hero__titulo{font-size:46px}
  .doc-hero__sub{font-size:18px}
  .doc-meta{grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
  .doc-meta__par{flex-direction:column;gap:4px}
  .doc-indice ol{grid-template-columns:1fr 1fr;gap:8px var(--space-8)}
  .doc-sec{margin-top:var(--space-16);display:grid;grid-template-columns:minmax(0,22ch) minmax(0,1fr);gap:var(--space-8);align-items:start}
  .doc-sec__titulo{font-size:24px;position:sticky;top:96px}
  .doc-sec__corpo{margin-top:0;padding-left:0}
  .doc-fim{display:flex;justify-content:space-between;gap:var(--space-8);align-items:baseline}
}

/* o footer das páginas internas usa h3 (a home usa h4): evita o salto h2→h4 na
   hierarquia de títulos. O estilo é o mesmo — herdado de .footer-col h4 na camada 029. */
.footer-029 .footer-col h3{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent-gold);font-weight:500;margin-bottom:var(--space-2)}

/* foco de teclado visível — ver nota na blog-030.css */
a:focus-visible,button:focus-visible{outline:2px solid var(--accent-gold);outline-offset:3px;border-radius:2px}