/* Páginas legales públicas (fuera de la SPA). Mismos colores que tokens.css, en claro y oscuro. */
:root {
  color-scheme: light dark;
  --bg: #0a101c; --surface: #111a2b; --text: #e7ecf5; --muted: #9aa8bf; --subtle: #8391ab;
  --border: rgb(148 170 210 / 0.18); --primary: #7aa2ff; --accent: #3ddc97;
}
@media (prefers-color-scheme: light) {
  :root { --bg: #f6f7fa; --surface: #ffffff; --text: #0e1726; --muted: #4f5c70; --subtle: #5f6b7e; --border: rgb(15 23 42 / 0.12); --primary: #2f5fe0; --accent: #0a7a53; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.6 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif; }
header, main, footer { max-width: 46rem; margin: 0 auto; padding: 0 1rem; }
header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1.25rem; padding-bottom: 1.25rem; }
header a.marca { display: inline-flex; align-items: center; gap: .6rem; color: var(--text); text-decoration: none; font-weight: 600; letter-spacing: -0.01em; }
header a.marca img { width: 28px; height: 28px; border-radius: 7px; }
header nav a { color: var(--muted); text-decoration: none; font-size: .875rem; margin-left: 1rem; }
header nav a[aria-current], header nav a:hover { color: var(--text); }
main { padding-bottom: 3rem; }
h1 { font-size: 1.75rem; line-height: 1.2; letter-spacing: -0.02em; margin: 1.5rem 0 .25rem; }
.fecha { color: var(--subtle); font-size: .875rem; margin: 0 0 1.5rem; }
h2 { font-size: 1.125rem; margin: 2rem 0 .5rem; letter-spacing: -0.01em; }
p, li { color: var(--text); }
ul { padding-left: 1.25rem; }
li { margin: .25rem 0; }
.resumen { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 1rem 1.25rem; margin: 1rem 0 1.5rem; }
.resumen p { margin: .35rem 0; }
a { color: var(--primary); }
footer { border-top: 1px solid var(--border); padding-top: 1rem; padding-bottom: 2rem; color: var(--subtle); font-size: .8125rem; }
footer a { color: var(--muted); }
@media (max-width: 480px) { header { flex-direction: column; align-items: flex-start; } header nav a { margin: 0 1rem 0 0; } }
button { font: 600 .9375rem/1 inherit; font-family: inherit; height: 44px; padding: 0 1.25rem; border-radius: 8px; border: 0; cursor: pointer; background: var(--accent); color: var(--bg); }
button:disabled { opacity: .6; cursor: default; }
button:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }