:root {
  /* ==========================================================================
     PALETA INSTITUCIONAL OFICIAL - PROYECTO MANCHA BLANCA
     Especificación del equipo (Brit)
     ========================================================================== */

  /* 1. Fondo Neutro Principal (60% del lienzo) */
  --color-white: #FFFFFF;
  --color-bg-base: #FFFFFF;
  --color-bg-subtle: #F8FAFB;

  /* 2. Color Predominante de la Identidad */
  --color-turquesa: #46B3B0;            /* Turquesa institucional del logotipo */
  --color-turquesa-glow: rgba(70, 179, 176, 0.18);

  /* 3. Títulos, Encabezados y Máximo Contraste (30%) */
  --color-azul-marino: #203B59;
  --color-heading: #203B59;
  --color-text-body: #475569;
  --color-text-muted: #64748B;

  /* 4. Botones y Llamadas a la Acción (CTAs) */
  --color-turquesa-profundo: #357F80;
  --color-cta-hover: #2a696a;

  /* 5. Espacios y Bloques Informativos Cálidos */
  --color-beige-arena: #E9D9BF;
  --color-beige-arena-light: #F9F5EE;

  /* 6. Bloques de Contenido, Tarjetas de Datos e Infografías */
  --color-verde-salvia: #A9B8A5;
  --color-salvia-light: #EFF4EE;

  /* 7. Iconos, Detalles Gráficos y Acentos Complementarios */
  --color-verde-oliva: #7E8969;

  /* Tipografía */
  --font-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Espaciado Modular 8pt */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* Bordes y Sombras */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 9999px;
  --shadow-sm: 0 2px 8px rgba(32, 59, 89, 0.04);
  --shadow-md: 0 10px 25px -5px rgba(32, 59, 89, 0.08);
  --shadow-cta: 0 10px 24px -4px rgba(53, 127, 128, 0.4);
}