/* Realinea las páginas legales con la home (landing/index.html):
   misma paleta (piedra + coral), misma tipografía (Hanken Grotesk) y el
   mismo header. Se carga DESPUÉS de styles.css para ganar en cascada. */

:root {
  --c-primary: #292524; --c-primary-600: #1c1917; --c-primary-700: #1c1917;
  --c-primary-50: #f5f5f4; --c-primary-100: #e7e5e4;
  --c-ink: #1c1917; --c-ink-2: #44403c; --c-muted: #78716c; --c-muted-2: #a8a29e;
  --c-line: #e7e5e4; --c-line-2: #f5f5f4;
  --c-bg: #fafaf9; --c-surface: #ffffff; --c-surface-2: #f5f5f4;
  --c-ok: #15803d; --c-err: #b91c1c; --c-warn: #b0701a;
  --ff-sans: "Hanken Grotesk", system-ui, sans-serif;
  --ff-mono: "IBM Plex Mono", ui-monospace, monospace;
}

:root:not([data-theme="light"]) {
  --c-primary: #e7e5e4; --c-primary-600: #fafaf9; --c-primary-700: #fafaf9;
  --c-primary-50: #292524; --c-primary-100: #44403c;
  --c-ink: #fafaf9; --c-ink-2: #d6d3d1; --c-muted: #a8a29e; --c-muted-2: #78716c;
  --c-line: #44403c; --c-line-2: #292524;
  --c-bg: #1c1917; --c-surface: #292524; --c-surface-2: #292524;
}

body { font-family: var(--ff-sans); }

/* Header idéntico al de la home */
.container { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--c-bg) 90%, transparent);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c-line);
}
.site-header__inner { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand__mark {
  display: grid; place-items: center; width: 28px; height: 28px;
  background: var(--c-primary); color: var(--c-surface);
  font-weight: 700; font-size: 15px; border-radius: 8px;
}
.brand__type { font-weight: 700; font-size: 19px; letter-spacing: -.02em; color: var(--c-ink); }
.brand__type strong, .brand__type span { color: inherit; font-weight: inherit; }
.nav { display: flex; align-items: center; gap: 24px; font-size: 15px; }
.nav a { text-decoration: none; color: var(--c-ink-2); }
.nav a:hover { color: var(--c-ink); }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--ff-sans); font-weight: 600; font-size: 15px;
  padding: 9px 16px; border-radius: 10px; border: 1px solid transparent; text-decoration: none;
}
.btn--primary,
.site-header .nav a.btn--primary { background: var(--c-primary); color: var(--c-surface); border-color: var(--c-primary); }
.btn--primary:hover,
.site-header .nav a.btn--primary:hover { background: var(--c-primary-600); border-color: var(--c-primary-600); }
@media (max-width: 720px) { .nav a:not(.btn) { display: none; } }
