/* Espacements, rayons, mouvements (charte §4 et §6). Base 4 px. */
:root {
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;

  --section: clamp(72px, 10vw, 144px);   /* rythme vertical entre sections */
  --gutter: clamp(16px, 4vw, 56px);
  --max: 1280px;
  --header-h: 76px;

  --r-sm: 6px;     /* champs */
  --r-md: 12px;    /* cartes, images */
  --r-lg: 20px;    /* grands panneaux */
  --r-pill: 999px; /* boutons */

  /* Mouvement : verbe « entrer » de la grammaire DataLift, adapté au web */
  --ease-out: cubic-bezier(.25, 1, .5, 1);      /* easeOutQuart */
  --ease-inout: cubic-bezier(.65, 0, .35, 1);   /* easeInOutCubic */
  --d-enter: 560ms;
  --d-stagger: 90ms;
  --d-fast: 160ms;
}