/* Hipocampo · tokens de diseño. Autor: Marcelo Rodríguez Aguilar */
@font-face{font-family:'Figtree';src:url('/fonts/Figtree-variable.woff2') format('woff2');font-weight:300 900;font-display:swap}
:root{
  --navy: #20274C;  /* Azul noche de Hipocampo. Fondo de portadas, tarjetas oscuras y texto principal en temas cl */
  --naranja: #F28C28;  /* Naranja hipocampo: el acento de la marca. Relleno de chips, botones, subtítulos de Melissa */
  --naranja-tinta: #A34E0B;  /* Naranja para texto pequeño sobre fondos claros (5.4:1 sobre crema, 4.8:1 sobre durazno). E */
  --crema: #FBF7F0;  /* Fondo claro por defecto de publicaciones, reels y folletos. */
  --durazno: #FDE7D3;  /* Tinte cálido para cajas de consejo, el fondo de Escuela y resaltados suaves. Texto navy en */
  --lavanda: #C9CDE3;  /* Tinte frío: barras de comparación, bordes punteados y texto secundario sobre navy (9.2:1). */
  --niebla: #E9EBF5;  /* Fondo sobrio del tema Trabajo y de tablas. Texto navy encima (12:1). */
  --pizarra: #5A5F73;  /* Gris azulado para texto secundario y fuentes sobre crema o blanco (5.9:1). */
  --borde: #E2DED4;  /* Líneas finas, separadores y pistas vacías de barras. */
  --blanco: #FFFFFF;  /* Tarjetas sobre crema y texto sobre navy (14.4:1). */
  --sol: #FFC94A;  /* Amarillo de apoyo SOLO para el tema Escuela y stickers de Colegio. Relleno con texto navy  */
  --menta: #8ED8C0;  /* Verde de apoyo SOLO para el tema Escuela. Relleno con texto navy (8.8:1); nunca texto. */
  --surface: var(--crema);  /* Fondo de página. */
  --surface-raised: var(--blanco);  /* Tarjetas y paneles sobre el fondo. */
  --ink: var(--navy);  /* Texto principal sobre surface y surface-raised en ambos temas. */
  --ink-muted: var(--pizarra);  /* Texto secundario, fuentes y notas, sobre surface en ambos temas (5.9:1 y 9.2:1). */
  --accent: var(--naranja);  /* Relleno de acento: chips, botones, subtítulos F. Texto encima: on-accent. */
  --on-accent: var(--navy);  /* Texto sobre un relleno naranja (5.9:1). Nunca blanco sobre naranja (2.5:1). */
  --accent-text: var(--naranja-tinta);  /* Palabra destacada en un titular o texto de acento sobre surface en ambos temas. */
  --caption-j: var(--navy);  /* Fondo del subtítulo de José (voz secundaria). Texto blanco encima. */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 40px;
  --space-5: 64px;
  --space-6: 80px;
  --radius-sm: 14px;
  --radius-md: 24px;
  --radius-lg: 40px;
  --radius-pill: 999px;
  --shadow-folleto: 0 20px 50px rgba(32,39,76,0.25);
  --font-sans: Figtree, system-ui, -apple-system, "Segoe UI", sans-serif;
}