/* ==========================================================================
   Noel Plus — páginas de documentos (Termos de Uso, Política de Privacidade)
   Texto longo para ler com calma: coluna estreita, letra maior, índice no topo. Páginas fora da guarda (quem ainda não tem conta lê antes de aceitar).
   ========================================================================== */
body { margin: 0; background: var(--color-bg-page); color: var(--color-text-primary); font-family: var(--font-body); -webkit-text-size-adjust: 100%; }
.doc { max-width: 760px; margin: 0 auto; padding: var(--space-6) var(--space-5) var(--space-10); }
.doc-top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-9); }
.doc-top img { display: block; height: 26px; width: auto; }
.doc-back { color: var(--color-text-secondary); font-weight: 600; font-size: var(--text-body-md-size); text-decoration: none; }
.doc-back:hover { color: var(--color-green-primary); }
.doc-kicker { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-green-primary); }
.doc h1 { margin: var(--space-3) 0 var(--space-3); font-family: var(--font-display); font-size: 34px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; }
.doc-meta { margin: 0 0 var(--space-7); color: var(--color-text-tertiary); font-size: var(--text-body-sm-size); }
.doc-sum { margin: 0 0 var(--space-7); padding: var(--space-5) var(--space-6); border-radius: 18px; background: var(--color-surface-1); border: 1px solid var(--color-border); }
.doc-sum h2 { margin: 0 0 var(--space-3) !important; font-size: var(--text-heading-md-size) !important; }
.doc-sum ul { margin: 0; padding-left: 20px; }
.doc-toc { margin: 0 0 var(--space-8); padding: 0; list-style: none; columns: 1; column-gap: var(--space-6); counter-reset: toc; }
@media (min-width: 640px) { .doc-toc { columns: 2; } }
.doc-toc li { break-inside: avoid; margin: 0 0 var(--space-2); font-size: var(--text-body-md-size); }
.doc-toc a { color: var(--color-text-secondary); text-decoration: none; }
.doc-toc a:hover { color: var(--color-green-primary); }
.doc h2 { margin: var(--space-9) 0 var(--space-3); font-family: var(--font-display); font-size: 22px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.25; scroll-margin-top: var(--space-6); }
.doc h3 { margin: var(--space-6) 0 var(--space-2); font-size: var(--text-heading-md-size); font-weight: 700; }
.doc p, .doc li { font-size: 16px; line-height: 1.7; color: var(--color-text-primary); }
.doc p { margin: 0 0 var(--space-4); }
.doc ul, .doc ol { margin: 0 0 var(--space-4); padding-left: 22px; }
.doc li { margin-bottom: var(--space-2); }
.doc a { color: var(--color-green-primary); text-underline-offset: 3px; }
.doc strong { font-weight: 700; }
.doc-beta { display: inline-block; margin-left: var(--space-2); padding: 2px 8px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--color-accent-gold) 60%, var(--color-border));
  color: var(--color-accent-gold); font-size: 10px; letter-spacing: 0.12em; vertical-align: 1px; }
.doc-betanote { margin: 0 0 var(--space-6); padding: var(--space-4) var(--space-5); border-radius: 14px; border-left: 3px solid var(--color-accent-gold);
  background: color-mix(in srgb, var(--color-accent-gold) 8%, var(--color-surface-1)); color: var(--color-text-primary); font-size: var(--text-body-md-size); line-height: 1.6; }
.doc-note { color: var(--color-text-secondary) !important; font-size: var(--text-body-md-size) !important; }
.doc-table { width: 100%; overflow-x: auto; margin: 0 0 var(--space-5); }
.doc-table table { width: 100%; border-collapse: collapse; font-size: var(--text-body-md-size); }
.doc-table th, .doc-table td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--color-border); line-height: 1.5; }
.doc-table th { color: var(--color-text-tertiary); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 700; }
.doc-foot { margin-top: var(--space-10); padding-top: var(--space-6); border-top: 1px solid var(--color-border); color: var(--color-text-secondary); font-size: var(--text-body-sm-size); line-height: 1.7; }
.doc-foot p { font-size: var(--text-body-sm-size); color: var(--color-text-secondary); }
