:root {
  /* Noir — couleur dominante : structure, navigation, confiance.
     (Ces variables gardent leur ancien nom "blue-*" pour ne pas casser les
     centaines de références existantes — seule la valeur a changé, du bleu
     marine d'origine vers un noir/gris neutre.) */
  --epoo-blue-900: #111111;
  --epoo-blue-700: #2e2e2e;
  --epoo-blue-600: #16a34a; /* rôle "interactif" (liens, focus, hover) — vert, pas noir */
  --epoo-blue-500: #6b6b6b;
  --epoo-blue-100: #f2f2f2;

  /* Vert — couleur unique d'accent : CTA, liens, succès, points forts */
  --epoo-green-500: #22c55e;
  --epoo-green-600: #16a34a;
  --epoo-green-100: #e3f9ec;

  /* États fonctionnels (hors palette de marque, par convention universelle) */
  --epoo-red-500: #ef4444;
  --epoo-red-100: #fdeaea;
  --epoo-amber-700: #92650b;
  --epoo-amber-100: #fff5da;

  /* Neutres */
  --epoo-white: #ffffff;
  --epoo-bg: #fafafa;
  --epoo-surface: #ffffff;
  --epoo-border: #e5e5e5;
  --epoo-text: #171717;
  --epoo-text-muted: #525252;
  --epoo-text-faint: #a3a3a3;

  /* Typo / rythme */
  --epoo-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --epoo-font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  --epoo-radius-sm: 6px;
  --epoo-radius-md: 12px;
  --epoo-radius-lg: 20px;
  --epoo-shadow-sm: 0 1px 2px rgba(17, 17, 17, 0.06);
  --epoo-shadow-md: 0 8px 24px rgba(17, 17, 17, 0.08);
  --epoo-shadow-lg: 0 20px 48px rgba(17, 17, 17, 0.14);
  --epoo-container: 1140px;
}