/**
 * Tokens del Design System — sitio público.
 *
 * A propósito NO define colores institucionales aquí: esos son distintos
 * por escuela y se inyectan en tiempo de renderizado (ver renderTemplate.js
 * y contraste.js). Este archivo solo trae lo que es igual para TODAS las
 * escuelas: tipografía, espaciado, radios — consistente con
 * 04-interfaces.md, sección 2.2 (una sola familia tipográfica, nunca una
 * por escuela, para no penalizar performance).
 */
:root {
  --fuente-base: 'Inter', system-ui, sans-serif;

  --texto-xs: 0.75rem;
  --texto-sm: 0.875rem;
  --texto-base: 1rem;
  --texto-lg: 1.125rem;
  --texto-xl: 1.5rem;
  --texto-2xl: 2rem;

  --espacio-2: 8px;
  --espacio-4: 16px;
  --espacio-6: 24px;
  --espacio-8: 32px;
  --espacio-12: 48px;

  --radio-base: 8px;
  --radio-card: 12px;

  --color-texto-cuerpo: #1f2937;
  --color-texto-secundario: #6b7280;
  --color-fondo-pagina: #ffffff;
}

body {
  font-family: var(--fuente-base);
  color: var(--color-texto-cuerpo);
  margin: 0;
  background-color: var(--color-page-bg, #f2f2f7);
}

section {
  padding: var(--espacio-8) var(--espacio-4);
}

@media (min-width: 768px) {
  section {
    padding: var(--espacio-12) var(--espacio-8);
  }
}