/* ============================================================
   TOKENS CORE : les echelles neutres de la plateforme.
   AUCUNE COULEUR ICI. Aucune reference a un style.
   Couche 1 sur 3 : core (echelles) > semantic (roles) > pack (style).
   Un bloc ne consomme JAMAIS ces tokens directement pour la
   couleur : il passe par les roles semantiques.
   ============================================================ */
:root {

  /* ---- Espacements (base 4, progression reguliere) ---- */
  --sp-1: 0.25rem;   /*  4px : micro ecarts */
  --sp-2: 0.5rem;    /*  8px */
  --sp-3: 0.75rem;   /* 12px */
  --sp-4: 1rem;      /* 16px : unite de respiration standard */
  --sp-5: 1.5rem;    /* 24px */
  --sp-6: 2rem;      /* 32px */
  --sp-7: 3rem;      /* 48px */
  --sp-8: 4.5rem;    /* 72px : entre sous-sections */
  --sp-9: 7rem;      /* 112px : entre sections, l'air qui fait premium */

  /* ---- Conteneurs ---- */
  --container: 72rem;        /* 1152px : largeur de page standard */
  --container-narrow: 46rem; /* 736px : colonnes de lecture */
  --gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* ---- Rayons ---- */
  --r-0: 0;
  --r-1: 0.375rem;   /*  6px : champs, petits elements */
  --r-2: 0.75rem;    /* 12px : boutons, cartes discretes */
  --r-3: 1.25rem;    /* 20px : cartes majeures */
  --r-full: 999px;   /* pastilles */

  /* ---- Ombres (neutres, teintees par les packs via --shadow-tint) ---- */
  --sh-1: 0 1px 2px rgb(0 0 0 / 0.06);
  --sh-2: 0 4px 16px rgb(0 0 0 / 0.08);
  --sh-3: 0 16px 48px rgb(0 0 0 / 0.14);

  /* ---- Epaisseurs de filet ---- */
  --bw-1: 1px;
  --bw-2: 2px;
  --bw-3: 3px;

  /* ---- Echelle typographique fluide ---- */
  --fs-xs: 0.8125rem;                          /* 13px : mentions */
  --fs-sm: 0.9375rem;                          /* 15px : secondaire */
  --fs-base: 1.0625rem;                        /* 17px : texte courant */
  --fs-lg: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);    /* sous-titres */
  --fs-xl: clamp(1.375rem, 1.15rem + 1.1vw, 1.875rem); /* titres de carte */
  --fs-2xl: clamp(1.75rem, 1.4rem + 1.8vw, 2.625rem);  /* titres de section */
  --fs-3xl: clamp(2.375rem, 1.8rem + 3vw, 4.25rem);    /* hero */

  /* ---- Hauteurs de ligne ---- */
  --lh-tight: 1.08;   /* display */
  --lh-snug: 1.25;    /* titres */
  --lh-body: 1.6;     /* texte courant */

  /* ---- Mouvement ---- */
  --dur-1: 160ms;     /* micro feedback (hover) */
  --dur-2: 320ms;     /* transitions d'etat */
  --dur-3: 700ms;     /* reveals d'entree */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);      /* sortie douce, signature maison */
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --stagger: 90ms;    /* pas de cascade entre elements reveles */

  /* ---- Points de rupture (reference, a utiliser dans les media queries) ----
     --bp-sm: 640px   --bp-md: 900px   --bp-lg: 1200px
     (les custom properties ne marchent pas dans @media : valeurs documentees ici,
      dupliquees en dur dans les feuilles, changement = grep sur bp-) */
}