/* ==========================================================================
   LOVEVENT : tokens de typographie, d'espacement et de composants
   Calibrés sur expression-event.fr (mesures du 31/10/2026, voir le journal).
   Les COULEURS sont dans couleurs.css (séparées exprès).
   [mesuré] = lu dans le CSS d'Expression ; [estimé] = lu sur capture, à valider.
   ========================================================================== */
:root {
  /* --- Police ---
     Expression charge des fichiers « TT Firs Neue Trial » (essai du fabricant).
     LICENCE À CONFIRMER avant toute mise en ligne de Lovevent. En attendant :
     pile de secours sans empattement, de poids proche. */
  --font-sans: "TT Firs Neue", "Inter", "Helvetica Neue", Arial, sans-serif;
  /* Rôles de graisse (Expression : texte courant = DemiBold, titres = Black) */
  --fw-leger: 300;      /* Regular [mesuré] */
  --fw-corps: 400;      /* DemiBold [mesuré] */
  --fw-titre: 700;      /* Black [mesuré] (les poids 600 et 800 y retombent) */

  /* --- Titres --- */
  --fs-h1: clamp(46px, 38.25px + 2.066vw, 68px);   /* 46 px à 375, 68 px à 1440 [mesuré] */
  --lh-h1: 1.05;                                    /* 71,4 / 68 [mesuré] */
  --ls-h1: -1.4px;                                  /* [mesuré] */
  --fs-h2: 44px;  --lh-h2: 1.08;  --ls-h2: -0.5px;  /* [mesuré] ; même taille en mobile sur Expression */
  --fs-h3: 22px;  --lh-h3: 1.15;  --ls-h3: -0.2px;  /* [mesuré] */
  --casse-titres: none;                             /* titres en phrase, jamais en capitales [mesuré] */

  /* --- Texte --- */
  --fs-corps: 17px;  --lh-corps: 1.55;  --ls-corps: normal;   /* [mesuré] */
  --fs-intro: 20px;  --lh-intro: 1.5;                          /* sous-titre du hero [estimé] */
  --fs-petit: 15px;                                            /* libellés de formulaire, mentions [mesuré] */

  /* --- Surtitre (toujours plus fin et plus discret que les titres) --- */
  --fs-surtitre: 13px;  --fw-surtitre: 600;  --ls-surtitre: 1.8px;  --casse-surtitre: uppercase;   /* [mesuré] */

  /* --- Menu --- */
  --fs-menu: 20px;  --fw-menu: 600;  --ls-menu: -0.5px;       /* [mesuré] */

  /* --- Boutons (pilule) --- */
  --btn-radius: 999px;                                         /* [mesuré] */
  --btn-fs: 15px;  --btn-fw: 600;                              /* [mesuré] */
  --btn-pad-entete: 13px 26px;                                 /* [mesuré] */
  --btn-pad-hero: 17px 32px;                                   /* [mesuré] */
  --btn-pad-formulaire: 16px 30px;                             /* [mesuré] */
  --btn-bordure-secondaire: 1px;                               /* bouton téléphone : fond transparent, filet fin [estimé] */

  /* --- Mise en page --- */
  --conteneur-max: 1320px;                                     /* [estimé] texte de 60 px à 1380 px sur 1440 */
  --gouttiere-bureau: 60px;                                    /* [estimé] */
  --gouttiere-mobile: 16px;                                    /* [mesuré] */
  --section-pad-bureau: 112px;                                 /* 110 à 120 px [mesuré] */
  --section-pad-mobile: 68px;                                  /* 64 à 72 px [mesuré] */
  --rayon-carte: 28px;                                         /* carte du formulaire [estimé] */
  --rayon-image: 24px;                                         /* images de section [estimé] */

  /* --- En-tête --- */
  --entete-pos: fixed;                                         /* [mesuré] */
  --entete-h-bureau: 104px;  --entete-h-defile: 90px;          /* [mesuré] */
  --entete-h-mobile: 156px;                                    /* [mesuré] (logo grand + bouton menu de 38 px) */
}

/* Mobile : valeurs qui changent sous 768 px */
@media (max-width: 767px) {
  :root { --section-pad: var(--section-pad-mobile); --gouttiere: var(--gouttiere-mobile); }
}
@media (min-width: 768px) {
  :root { --section-pad: var(--section-pad-bureau); --gouttiere: var(--gouttiere-bureau); }
}

/* --- Mouvement (un seul endroit pour tout ajuster) --- */
:root {
  --motion-fast: 200ms;          /* survols : boutons, flèche, soulignement du menu */
  --motion-medium: 250ms;        /* cartes, en-tête au défilement */
  --motion-menu: 280ms;          /* menu mobile : ouverture et fermeture */
  --motion-slow: 400ms;          /* zoom léger de l'image d'une carte */
  --motion-base: 500ms;          /* apparition au défilement (450 à 550 ms, jamais plus de 600) */
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);   /* ease-out doux */
  --motion-distance: 16px;       /* montée maximale à l'apparition */
  --motion-stagger: 70ms;        /* décalage entre éléments d'un groupe (4 maximum en cascade) */
  --motion-skip-speed: 900;      /* px/s : au-delà, on n'anime plus (défilement rapide) */
  --motion-anticipation: 20%;    /* l'apparition démarre avant l'entrée à l'écran (lu par le script) */
}