/* Páginas legales: lectura larga. Columna de ~68 caracteres, índice al inicio, encabezados con ancla. */

.legal { padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(3.5rem, 8vw, 6rem); }
.legal h1 { font-size: clamp(2rem, 4.4vw, 3rem); max-width: 20ch; }
.legal .updated { margin-top: .875rem; color: var(--muted); font-size: .9375rem; }
.legal .intro { margin-top: 1.5rem; }

.prose { max-width: 42rem; }
.prose h2 {
  font-size: clamp(1.25rem, 2.2vw, 1.5rem); line-height: 1.25; letter-spacing: -0.015em;
  margin: 2.75rem 0 .875rem; scroll-margin-top: calc(var(--nav-h) + 1.5rem);
}
.prose h3 { font-size: 1.0625rem; margin: 1.5rem 0 .5rem; }
.prose p, .prose li { color: color-mix(in srgb, var(--ink) 88%, var(--bg)); }
.prose p + p { margin-top: .875rem; }
.prose ul, .prose ol { margin: .75rem 0 0; padding-left: 1.25rem; }
.prose li + li { margin-top: .5rem; }
.prose li::marker { color: var(--muted); }
.prose strong { color: var(--ink); font-weight: 600; }
.prose a { color: var(--ink); text-underline-offset: 3px; }

.toc {
  margin-top: 2rem; padding: 1.25rem 1.5rem; max-width: 42rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card);
}
.toc h2 { font: 600 .9375rem/1.3 var(--font-b); margin: 0 0 .5rem; color: var(--muted); }
.toc ol { margin: 0; padding-left: 1.25rem; columns: 1; column-gap: 2rem; }
@media (min-width: 768px) { .toc ol { columns: 2; } }
.toc li { break-inside: avoid; padding-block: .1875rem; }
.toc a { display: inline-block; min-height: 1.75rem; color: var(--ink); text-decoration: none; }
@media (hover: hover) and (pointer: fine) { .toc a:hover { text-decoration: underline; text-underline-offset: 3px; } }

/* Datos que el dueño debe completar: visibles a propósito */
.fill {
  font: 500 .875em/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: color-mix(in srgb, var(--line) 70%, transparent); padding: .0625rem .375rem; border-radius: 6px;
}

.footer .legal-note { max-width: 52rem; line-height: 1.55; }
