/* ==========================================================================
   JETONS — le seul endroit ou vivent les valeurs de design
   --------------------------------------------------------------------------
   Toutes les valeurs sont RELEVEES dans la reference, jamais estimees.
   Source : OYA/10_Documentation_Dev/05_References/site-vitrine/
   ========================================================================== */

:root {
  /* ---------------------------------------------------------------- */
  /* COULEURS — elles ne vivent plus ici                               */
  /* ------------------------------------------------------------------
     Toutes les couleurs de la V4 sont dans `styles/palette.css`, charge
     AVANT ce fichier. C'est la difference d'avec la V3 : on y change la
     teinte du site entier en tournant un seul nombre.

     Les anciens noms `--c-bleu`, `--c-bleu-lien` et `--c-or` ont disparu au
     profit de `--c-marque-vif`, `--c-marque` et `--c-accent` : un role se
     traverse quand la couleur change, un nom de couleur ment.
     ------------------------------------------------------------------ */

  /* ---------------------------------------------------------------- */
  /* TYPOGRAPHIE                                                       */
  /* ---------------------------------------------------------------- */
  /* MANROPE porte les titres, SWITZER le texte courant et l'interface.
     C'est l'inverse de ce qu'on suppose en lisant les noms : verifie sur les
     presets de la reference — H1 Manrope 65/700, H2 Manrope 40/600, tandis
     que la navigation, le bandeau et les cartes sont en Switzer.
     Les deux sont servies depuis assets/ — voir polices.css. */
  --f-titre: "Manrope", "Switzer", "Helvetica Neue", Arial, sans-serif;
  --f-texte: "Switzer", "Manrope", "Helvetica Neue", Arial, sans-serif;

  --t-12: 12px;  --t-14: 14px;  --t-15: 15px;  --t-16: 16px;  --t-18: 18px;
  --t-20: 20px;  --t-22: 22px;  --t-24: 24px;  --t-25: 25px;  --t-26: 26px;
  --t-28: 28px;  --t-30: 30px;  --t-36: 36px;  --t-40: 40px;  --t-54: 54px;  --t-65: 65px;

  --g-400: 400;  --g-500: 500;  --g-600: 600;  --g-700: 700;

  --i-serre: 1.1;  --i-titre: 1.2;  --i-moyen: 1.4;
  --i-texte: 1.5;  --i-ample: 1.6;

  --a-titre: -0.02em;  --a-grand: -0.03em;

  /* ---------------------------------------------------------------- */
  /* FORMES                                                            */
  /* ---------------------------------------------------------------- */
  --r-06: 6px;  --r-10: 10px;  --r-12: 12px;
  --r-15: 15px;  /* dominant : 35 occurrences dans la reference */
  --r-18: 18px;  --r-70: 70px;  --r-pilule: 99px;

  /* ---------------------------------------------------------------- */
  /* MISE EN PAGE                                                      */
  /* ---------------------------------------------------------------- */
  --l-page:      1200px;   /* largeur du <nav> et du contenu, relevee */
  --l-lecture:    720px;   /* colonne de lecture des pages de texte */
  --l-gouttiere: 60px;     /* padding horizontal du nav en bureau */

  /* ---------------------------------------------------------------- */
  /* COURBES D'ACCELERATION                                            */
  /* ------------------------------------------------------------------
     La reference n'ecrit jamais de cubic-bezier pour ses apparitions :
     elle emploie des ressorts {type:"spring", duration, bounce}. Une fois
     normalisee sur sa duree, la courbe ne depend QUE de `bounce`, et toute
     la page n'utilise que deux valeurs : 0.2 et 0.

     Ces deux courbes sont donc suffisantes. Elles sont sans dimension :
     on les applique a n'importe quelle duree. 32 points, erreur < 0,8 %.
     Obtenues en rejouant le solveur de ressort de Motion.
     ------------------------------------------------------------------ */

  /* bounce:0.2 — leger depassement (+1,5 % a 58 % de la duree) */
  --e-ressort: linear(
    0 0%, 0.034 3.12%, 0.1167 6.25%, 0.2253 9.38%, 0.3435 12.5%,
    0.4604 15.62%, 0.5691 18.75%, 0.6657 21.88%, 0.7484 25%,
    0.817 28.12%, 0.8724 31.25%, 0.9158 34.38%, 0.9487 37.5%,
    0.973 40.62%, 0.9902 43.75%, 1.0018 46.88%, 1.0091 50%,
    1.0131 53.12%, 1.0149 56.25%, 1.0151 59.38%, 1.0142 62.5%,
    1.0128 65.62%, 1.0111 68.75%, 1.0093 71.88%, 1.0076 75%,
    1.006 78.12%, 1.0046 81.25%, 1.0034 84.38%, 1.0024 87.5%,
    1.0017 90.62%, 1.0011 93.75%, 1.0006 96.88%, 1 100%
  );

  /* bounce:0 — arrivee nette, aucun depassement */
  --e-ressort-net: linear(
    0 0%, 0.0344 3.12%, 0.1144 6.25%, 0.215 9.38%, 0.3208 12.5%,
    0.4228 15.62%, 0.5164 18.75%, 0.5993 21.88%, 0.6711 25%,
    0.732 28.12%, 0.7831 31.25%, 0.8254 34.38%, 0.8601 37.5%,
    0.8884 40.62%, 0.9113 43.75%, 0.9297 46.88%, 0.9445 50%,
    0.9563 53.12%, 0.9656 56.25%, 0.973 59.38%, 0.9789 62.5%,
    0.9835 65.62%, 0.9871 68.75%, 0.99 71.88%, 0.9922 75%,
    0.994 78.12%, 0.9953 81.25%, 0.9964 84.38%, 0.9972 87.5%,
    0.9978 90.62%, 0.9983 93.75%, 0.9987 96.88%, 1 100%
  );

  --e-survol: cubic-bezier(0.44, 0, 0.56, 1);
  --e-jauge:  cubic-bezier(0.33, 0.31, 0.66, 0.66);

  /* Vitesse commune aux quatre marquees de la page. */
  --v-marquee: 50px;   /* par seconde */
}

/* `linear()` n'est pas reconnu par les moteurs anciens. Le repli perd le
   depassement, le reste tient. */
@supports not (animation-timing-function: linear(0, 1)) {
  :root {
    --e-ressort:     cubic-bezier(0.16, 1, 0.3, 1);
    --e-ressort-net: cubic-bezier(0.16, 1, 0.3, 1);
  }
}