/*
  tokens.css
  Sistema de tokens visuales. Paleta neutra y editorial (blanco, negro, grises), tipografía
  del sistema, superficies redondeadas y espaciado generoso, inspirados en la limpieza,
  jerarquía y orden de la referencia aprobada (gabrielvaldivia.com): tipografía muy grande
  y ajustada, texto secundario en gris, tarjetas en gris muy claro con esquinas amplias,
  controles en forma de píldora y ausencia de líneas divisorias entre secciones (el ritmo
  lo da el espacio, no los bordes). Sin colores, tipografías, composiciones ni código
  copiados de la referencia; la identidad final es propia.
*/

/*
  Inter (SIL Open Font License 1.1, uso comercial libre, no requiere atribución).
  Autohospedada en site/public/fonts/inter/ — 4 cortes estáticos (400/500/600/700),
  subconjunto "latin" (cubre español: vocales acentuadas y ñ están en U+0000-00FF),
  descargados desde Google Fonts (fonts.googleapis.com, familia "Inter", v20) para que el
  sitio no dependa de una CDN externa ni de conexión a internet en la versión local.
  Elegida por Santiago entre Inter / General Sans / Space Grotesk / Manrope: es la más
  neutra y editorial de las cuatro, con pesos reales más ligeros que la pila de fuentes del
  sistema (evita que los titulares grandes se vean pesados).
*/
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/inter/inter-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/inter/inter-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/inter/inter-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/inter/inter-700.woff2') format('woff2');
}

:root {
  color-scheme: light;

  /* Color */
  --color-bg: #ffffff;
  --color-surface: #f5f5f3;
  --color-surface-strong: #eeeeea;
  --color-text: #111111;
  --color-text-muted: #6b6b66;
  --color-border: #e7e7e2;
  --color-border-strong: #111111;
  --color-accent: #111111;
  --color-focus: #1955ff;
  --color-draft-bg: #fff4d6;
  --color-draft-text: #5c4500;

  /* Tipografía: Inter autohospedada primero, con la pila de fuentes del sistema como
     respaldo si por algún motivo el archivo no carga. */
  --font-sans:
    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Helvetica,
    Arial, sans-serif;
  --line-height-tight: 1.08;
  --line-height-base: 1.7;

  /* Escala tipográfica fluida: titulares muy grandes y ajustados, texto de cuerpo cómodo */
  --font-size-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --font-size-small: 0.875rem;
  --font-size-h1: clamp(2.5rem, 1.9rem + 2vw, 4rem);
  --font-size-h2: clamp(1.75rem, 1.5rem + 1.2vw, 2.75rem);
  --font-size-h3: clamp(1.125rem, 1.05rem + 0.5vw, 1.375rem);

  /* Espaciado: aire generoso entre bloques, el ritmo editorial lo da el espacio */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: 2.5rem;
  --space-xl: 4.5rem;
  --space-2xl: 7rem;
  --space-3xl: 9rem;

  /* Layout */
  --content-max-width: 72rem;
  --measure-max-width: 38rem;
  --radius-s: 0.5rem;
  --radius-m: 1rem;
  --radius-l: 1.5rem;
  --radius-full: 999px;

  /* Movimiento (sutil, nunca obligatorio para comprender el contenido) */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}