:root {
  /* === COLORES (Manual de Identidad Visual SAM) === */

  /* Azul institucional */
  --color-blue-50: #F0F3F8;
  --color-blue-100: #C5D0E3;
  --color-blue-600: #1B2B4B;
  --color-blue-900: #0F1A30;

  /* Dorado / Oro */
  --color-gold-50: #FDF6E3;
  --color-gold-300: #E8C860;
  --color-gold-500: #C9A83A;
  --color-gold-800: #7A5C1A;

  /* Neutros */
  --color-white: #FFFFFF;
  --color-cream: #F7F6F3;
  --color-graphite: #555555;
  --color-black: #1A1A1A;

  /* Funcionales */
  --color-green-bg: #D4E8D4;
  --color-green: #2E7D3A;
  --color-red-bg: #FDEAEA;
  --color-red: #C0392B;

  /* Aliases semánticos */
  --color-primary: var(--color-blue-600);
  --color-primary-dark: var(--color-blue-900);
  --color-primary-light: var(--color-blue-100);
  --color-accent: var(--color-gold-500);
  --color-accent-light: var(--color-gold-300);
  --color-bg: var(--color-white);
  --color-bg-alt: var(--color-cream);
  --color-text: var(--color-black);
  --color-text-secondary: var(--color-graphite);
  --border-color: var(--color-blue-100);
  --border-color-secondary: #D0D5DD;

  /* === TIPOGRAFÍA === */
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans: 'Source Sans 3', 'Source Sans Pro', -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Escala tipográfica (manual) */
  --font-size-hero: clamp(28px, 5vw, 36px);
  --font-size-h2: clamp(20px, 3vw, 24px);
  --font-size-h3: 18px;
  --font-size-body: 15px;
  --font-size-small: 12px;
  --font-size-micro: 11px;

  --line-height-body: 1.65;
  --line-height-heading: 1.2;
  --letter-spacing-heading: -0.5px;

  /* === ESPACIADO (sistema de 8px) === */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-6: 48px;
  --space-8: 64px;
  --space-10: 80px;

  /* === LAYOUT === */
  --container-max: 1200px;
  --container-padding: 32px;
  --grid-gap: 24px;
  --header-height: 72px;

  /* === BORDES Y FORMAS === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-full: 50%;
  --border-width: 0.5px;
  --border-width-hover: 1px;
  --border-width-featured: 2px;

  /* === TRANSICIONES === */
  --transition: ease 200ms;
}