/* ===================================================================
   IUT GEXT — Design tokens
   Source unique de vérité pour couleurs, espacements, ombres et
   animations. Toute nouvelle règle CSS doit référencer ces variables
   plutôt que des valeurs codées en dur, pour qu'un changement de
   marque (couleur, rayon, rythme d'animation) se propage partout.
   =================================================================== */
:root {
  /* Couleurs de marque — le bleu est historiquement nommé "purple" dans
     les classes existantes (.text-purple, section.shape3.purple...) :
     on garde ces noms de classes pour ne pas casser le CSS existant,
     mais les tokens ci-dessous portent des noms sémantiques corrects. */
  --color-primary: #2563EB;
  --color-primary-dark: #1D4ED8;
  --color-ink: #0F172A;       /* overlay sombre sur photos */
  --color-text: #696969;
  --color-text-muted: #9CA3AF;
  --color-white: #FFFFFF;
  --color-grey-light: #EDEDED;
  --color-accent-tint: #EFF6FF; /* fond très clair pour accents décoratifs */
  --color-border: #E2E8F0;

  /* Typographie */
  --font-family-base: 'Roboto', sans-serif;
  --tracking-tight: 1px;
  --tracking-wide: 2px;

  /* Rayon — la marque reste sobre et anguleuse sur les grandes surfaces
     (header, hero, footer, sections pleine largeur), mais les petits
     éléments (cartes, boutons, champs) gagnent un léger arrondi pour
     adoucir l'ensemble, sans aller jusqu'au style "pilule". Un seul
     endroit pour changer d'avis. */
  --radius-none: 0;
  --radius-sm: 6px;
  --radius-md: 10px;

  /* Ombres */
  --shadow-card: 3px 3px 10px rgba(0, 0, 0, 0.16);
  --shadow-card-hover: 6px 6px 14px rgba(0, 0, 0, 0.20);

  /* Espacements (échelle 4px) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 80px; /* rythme vertical des grandes sections de la home */

  /* Mouvement — un seul rythme d'animation pour toute interaction */
  --motion-fast: 200ms;
  --motion-base: 500ms;
  --motion-ease: ease-out;
  --transition-base: all var(--motion-base) var(--motion-ease);

  /* Habillage sections */
  --header-height: 70px;
}
