/* Jetons de design — Railborn Guide
   Source : direction visuelle verrouillee le 25.08.2026 (12 planches, docs/direction-visuelle/planches/).
   ⛔ Les couleurs et les polices ne se decident PAS ici : elles sont relevees sur les planches.
      Toute valeur ci-dessous est recoupee sur une planche nommee. En cas d'ecart, l'image gagne.
   ⛔⛔ Aucun hote externe : la politique de securite stricte du site les bloque sans erreur visible. */

:root {
  /* --- Palette. Les huit couleurs, et rien d'autre. --- */
  --ink:            #0E1A24;  /* titres, texte important, pictogrammes sombres */
  --petrole:        #164E50;  /* fonds sombres, pied de page, colonnes laterales */
  --rail:           #2D6A6A;  /* liens secondaires, pictogrammes, metadonnees importantes */
  --rouille:        #E66F18;  /* ⛔ ACCENT SEUL : etat actif, appels a l'action, numeros */
  --papier:         #F4EFE6;  /* fond principal */
  --papier-clair:   #FAF7F0;  /* cartes et surfaces detachees du fond */
  --sable:          #C79A6B;  /* illustration secondaire, chiffres fantomes */
  --gris-bleu:      #8BA7AD;  /* metadonnees secondaires, separateurs */

  /* --- Quatre teintes de TEXTE que le gabarit emploie, relevees sur l'export du 03.09.2026.
         ⛔ Ce ne sont pas des couleurs de marque : ce sont les gris du corps de texte.
         Les mettre ici evite qu'elles soient reecrites au juge dans chaque gabarit. --- */
  --texte-corps:    #2A3B44;  /* paragraphes — ⭐ plus doux que --ink, qui reste aux titres */
  --texte-attenue:  #5A6B72;  /* notes, legendes, URL brute */
  --papier-fonce:   #EBE5D8;  /* l'encart de citation verbatim, un cran sous le papier */
  --petrole-texte:  #B9CFCC;  /* texte courant POSE sur un aplat petrole */

  /* --- Familles. Les trois, auto-hebergees, avec une repli reelle. --- */
  --titre:      'Bebas Neue', 'Oswald', 'Arial Narrow', sans-serif;
  --sous-titre: 'Barlow Condensed', 'Roboto Condensed', 'Arial Narrow', sans-serif;
  --texte:      'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;

  /* --- Formes. Rayon modere, ombres tres douces ou rien. --- */
  --rayon-petit:  4px;
  --rayon:        8px;
  --rayon-grand: 10px;
  --filet: 1px solid rgba(14, 26, 36, .14);
  --ombre-douce: 0 1px 2px rgba(14, 26, 36, .06);

  /* --- Rythme --- */
  --p1: 4px;  --p2: 8px;  --p3: 12px; --p4: 16px;
  --p5: 24px; --p6: 32px; --p7: 48px; --p8: 64px;

  /* --- Mise en page --- */
  --contenu-max: 1560px;   /* conteneur bureau */
  --texte-max: 72ch;       /* ⛔ un paragraphe ne s'etire jamais sur un 16:9 entier */
  --bascule-mobile: 768px;

  /* --- Mouvement. Discret, ou rien. --- */
  --transition: 180ms ease;
}

/* ⛔ Respecter le reglage systeme : une animation imposee est un defaut d'accessibilite. */
@media (prefers-reduced-motion: reduce) {
  :root { --transition: 0ms; }
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}