/* ==========================================================================
   variables.css — Custom properties (couleurs, typographies, espacements)
   Rôle : centraliser les valeurs de design du site pour garder une
   cohérence visuelle et faciliter les futures modifications de thème.
   ========================================================================== */

@font-face {
  font-family: "Helvetica Neue LT Pro";
  src: url("../assets/fonts/Helvetica_Neue_LT_Pro_55_Roman.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Couleurs principales */
  --color-primary: #2563eb;
  --color-primary-dark: #1d4ed8;
  --color-secondary: #f59e0b;
  --color-accent: #10b981;

  /* Couleurs neutres */
  --color-bg: #ffffff;
  --color-bg-alt: #f3f4f6;
  --color-text: #1f2937;
  --color-text-light: #6b7280;
  --color-border: #e5e7eb;

  /* Typographie */
  --font-primary: "Helvetica Neue LT Pro", "Helvetica Neue", Arial, sans-serif;
  --font-heading: "Helvetica Neue LT Pro", "Helvetica Neue", Arial, sans-serif;

  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-md: 1.25rem;
  --font-size-lg: 1.75rem;
  --font-size-xl: 2.5rem;

  /* Espacements */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;

  /* Divers */
  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --transition-base: 0.2s ease-in-out;
  --max-width: 1100px;
}