:root {
  /* ===== Couleurs principales ===== */
  --color-navy: #101B2D;
  --color-navy-soft: #1B2A41;
  --color-ivory: #F4F0E7;
  --color-paper: #FAF8F3;
  --color-stone: #77756F;
  --color-line: #D8D1C5;
  --color-brass: #A88C58;
  --color-white: #FFFFFF;
  --color-black: #111111;

  /* ===== Typographie ===== */
  --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans: 'Manrope', Arial, Helvetica, sans-serif;

  /* ===== Échelle d'espacement ===== */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* ===== Largeurs de mise en page ===== */
  --content-max: 1200px;
  --content-narrow: 760px;

  /* ===== Rayons (discrets, esprit éditorial) ===== */
  --radius-sm: 2px;
  --radius-md: 4px;

  /* ===== Ombre unique, utilisée avec parcimonie ===== */
  --shadow-soft: 0 8px 24px rgba(16, 27, 45, 0.08);

  /* ===== Vitesses d'animation ===== */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-lift: 240ms cubic-bezier(.22,.61,.36,1);

  /* ===== Z-index principaux ===== */
  --z-header: 100;
  --z-mobile-menu: 200;

  /* ===== Points de rupture (référence — valeurs en dur dans responsive.css) ===== */
  --breakpoint-mobile: 480px;
  --breakpoint-tablet: 768px;
  --breakpoint-desktop: 1024px;
  --breakpoint-wide: 1280px;
}