/* ───────── Páginas legales (legal.html, cookies.html) ─────────
   Cada página trae el texto completo en los dos idiomas (.lang-en / .lang-es); se ve el del idioma activo. */
html:not([lang="es"]) .lang-es, html[lang="es"] .lang-en { display: none; }

.legal-page main { max-width: calc(46rem + 2 * var(--pad-x)); margin: 0 auto; padding: clamp(2.5rem, 7vw, 5rem) var(--pad-x) clamp(3rem, 8vw, 6rem); }
.legal { color: var(--ink); line-height: 1.65; }
.legal-kicker { margin: 0 0 .6rem; font-size: .75rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--mute); }
.legal h1 { margin: 0 0 .75rem; font: 800 clamp(2rem, 5vw, 3.2rem)/1.05 var(--font-display); letter-spacing: -.035em; text-wrap: balance; }
.legal-updated { margin: 0 0 1.75rem; font-size: .875rem; color: var(--mute); }
.legal h2 { margin: 3rem 0 1rem; padding-top: 1.5rem; border-top: 1px solid var(--line); font: 700 clamp(1.35rem, 2.6vw, 1.75rem)/1.2 var(--font-display); letter-spacing: -.02em; }
.legal h3 { margin: 1.75rem 0 .5rem; font-size: 1rem; font-weight: 700; }
.legal p, .legal li { color: var(--mute); text-wrap: pretty; }
.legal p { margin: 0 0 1rem; }
.legal strong { color: var(--ink); }
.legal a { color: var(--accent); text-underline-offset: 2px; }
.legal section { scroll-margin-top: 5rem; }

/* índice */
.legal-toc { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.legal-toc a {
  padding: .45rem .9rem; border: 1px solid var(--line); border-radius: var(--r-pill);
  color: var(--ink); font-size: .8125rem; font-weight: 600; text-decoration: none;
}
.legal-toc a:hover { background: var(--bg2); }

.legal-data { margin: 0 0 1.5rem; padding: 1.1rem 1.25rem; list-style: none; display: grid; gap: .35rem; border-radius: var(--r-inner); background: var(--bg2); }

/* datos que faltan por completar: bien visibles hasta que se rellenen */
mark.todo { padding: 0 .3em; border-radius: 4px; background: #ffe066; color: #1d1d1f; font-weight: 600; }

.legal-table { margin: 0 0 1.25rem; overflow-x: auto; }
.legal table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.legal th, .legal td { padding: .6rem .75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.legal th { font-weight: 700; color: var(--ink); }
.legal td { color: var(--mute); }
.legal td:first-child { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--ink); white-space: nowrap; }