/**
 * Jetons de la charte.
 *
 * Fichier isolé volontairement : c'est le seul à corriger si la charte évolue.
 * Le reste du thème s'appuie sur ces variables et n'écrit jamais une couleur
 * ni une police en dur.
 *
 * Valeurs relevées dans la maquette Figma le 27 août 2026, nœuds 5992:1547
 * (pied de page), 5992:5688 (titre de section) et 5992:1454 (bouton).
 */

:root {

  /* ------------------------------------------------------------------
     Couleurs
     ------------------------------------------------------------------ */

  /* Noir de la marque, relevé dans Logo DEF.svg. Chaud, jamais #000. */
  --safir-noir: #161412;

  /* Bordeaux du pied de page et du menu déplié. */
  --safir-bordeaux: #3f212b;

  /* Accent : la maquette applique un dégradé, pas un aplat. Les trois arrêts
     sont conservés pour pouvoir le reproduire, et le ton médian sert de
     couleur pleine partout où un dégradé n'a pas de sens (focus, liens). */
  --safir-accent-sombre: #770e3c;
  --safir-accent: #98164e;
  --safir-accent-clair: #b81e61;
  --safir-degrade-accent: linear-gradient(90deg, var(--safir-accent-sombre) 0%, var(--safir-accent) 39%, var(--safir-accent-clair) 78%);

  /* Neutres. Les gris sombres sont chauds, dans la teinte du noir de marque. */
  --safir-blanc: #ffffff;
  --safir-gris-05: #f7f6f5;
  --safir-gris-10: #ebe9e7;
  --safir-gris-30: #b8afb1;
  --safir-gris-40: #9a9691;
  --safir-gris-70: #4a4643;
  --safir-gris-85: #2a2523;
  --safir-gris-90: #221e1c;

  /* Le ton d'accent lisible en texte sur fond sombre : #98164e n'atteint
     que 2,2:1 sur le noir, celui-ci 5,6:1. Les boutons gardent le dégradé. */
  --safir-accent-texte: #e2648f;

  /* Dégradés décoratifs des sections. Les aplats de la section auteur sont
     exportés en image dans la maquette : ces valeurs approchent leur teinte
     et seront remplacées par les visuels définitifs à l'intégration. */
  --safir-degrade-chaud: linear-gradient(90deg, #a8214f 0%, #6b3c86 28%, #2f6f8f 50%, #22a094 68%, #8fb04a 88%, #c9b93a 100%);
  --safir-degrade-braise: linear-gradient(135deg, #8f1a4a 0%, #b8352f 45%, #c8722a 100%);
  --safir-degrade-froid: linear-gradient(135deg, #1c7f8d 0%, #22a094 60%, #3fb8a0 100%);
  /* Rose pâle du menu déplié : entrée courante (nœud 5992:1641). */
  --safir-rose-pale: #c199a7;
  /* Pied de page : tiret des réseaux et ligne des mentions (nœud 5992:1547). */
  --safir-rose-doux: #a67a89;
  --safir-bordure-pied: #5c3b46;

  /* Rôles, pour ne jamais appeler une couleur par son nom dans un composant.
     Site sombre, comme la maquette Usabilis validée par la Safir : noir chaud
     en fond, gris chaud sombre pour les surfaces de lecture, bordeaux pour les
     panneaux (auteur au hasard, espace membres, menu, pied de page). Décision
     du 3 septembre 2026, après une première intégration en blanc. */
  --safir-fond: var(--safir-noir);
  --safir-fond-alt: var(--safir-gris-90);
  --safir-fond-media: var(--safir-gris-85);
  --safir-fond-panneau: var(--safir-bordeaux);
  --safir-fond-sombre: var(--safir-noir);
  --safir-texte: var(--safir-gris-05);
  --safir-texte-doux: var(--safir-gris-30);
  --safir-texte-inverse: var(--safir-blanc);
  --safir-bordure: rgba(255, 255, 255, .14);
  --safir-bordure-inverse: rgba(255, 255, 255, .35);
  /* État positif (message envoyé), tiré du dégradé froid. */
  --safir-succes: #1f8a8c;

  /* ------------------------------------------------------------------
     Typographie
     ------------------------------------------------------------------ */

  /*
    La maquette emploie trois familles : Montserrat Alternates pour les titres,
    Asap pour le texte courant et les boutons, Inter pour le seul bloc de
    coordonnées du pied de page. Inter n'est pas repris : une famille entière
    pour quatre lignes ne se justifie pas, Asap fait le même travail.

    À DÉPOSER dans assets/fonts/ au format woff2, puis à déclarer ci-dessous :
      - MontserratAlternates 600
      - Asap 400, 500, 600
    Hébergement local voulu : un appel à Google transmet l'adresse IP du
    visiteur à un tiers, ce que la proposition commerciale s'engage à éviter.
    Tant que les fichiers ne sont pas là, les piles de repli s'appliquent.
  */
  --safir-police-titre: "Montserrat Alternates", "Trebuchet MS", Verdana, sans-serif;
  --safir-police-texte: "Asap", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;

  --safir-graisse-fine: 300;
  --safir-graisse-normale: 400;
  --safir-graisse-moyenne: 500;
  --safir-graisse-forte: 600;

  /* Échelle fluide, calée sur la maquette dessinée en 1920 :
     titre de section 36px, liens de réseaux 24px, boutons 16px,
     baseline 18px, mentions 12px. */
  --safir-t-xs: clamp(.75rem, .73rem + .1vw, .8125rem);
  --safir-t-s: clamp(.875rem, .85rem + .12vw, 1rem);
  --safir-t-m: clamp(1rem, .97rem + .15vw, 1.125rem);
  --safir-t-l: clamp(1.125rem, 1.05rem + .3vw, 1.5rem);
  --safir-t-xl: clamp(1.5rem, 1.25rem + 1vw, 2.25rem);
  --safir-t-2xl: clamp(1.875rem, 1.5rem + 1.6vw, 3rem);
  --safir-t-3xl: clamp(2.5rem, 1.8rem + 3vw, 4.5rem);

  --safir-interligne-titre: 1.15;
  --safir-interligne-texte: 1.55;

  /* La maquette espace nettement les capitales des titres et des mentions. */
  --safir-interlettre-titre: .01em;
  --safir-interlettre-mention: .06em;

  /* ------------------------------------------------------------------
     Rythme et mise en page
     ------------------------------------------------------------------ */

  --safir-esp-3xs: .25rem;
  --safir-esp-2xs: .5rem;
  --safir-esp-xs: .75rem;
  --safir-esp-s: 1rem;
  --safir-esp-m: 1.5rem;
  --safir-esp-l: 2.5rem;
  --safir-esp-xl: 4rem;
  --safir-esp-2xl: 6rem;
  --safir-esp-3xl: 8rem;

  /* Grille de 1280 px utiles, décision du 3 septembre 2026. La maquette est
     dessinée en 1920 avec 1680 utiles, trop large pour un site de lecture :
     les lignes de texte et les cartes s'étiraient. Les gouttières s'ajoutent
     aux 1280, le conteneur ne les rogne jamais. */
  --safir-gouttiere: clamp(1rem, 6.25vw - 1rem, 7.5rem);
  --safir-largeur-utile: 1280px;
  --safir-largeur-max: calc(var(--safir-largeur-utile) + 2 * var(--safir-gouttiere));
  --safir-largeur-texte: 68ch;

  /* Les boutons de la maquette sont arrondis à 12 px, pas en pilule. */
  --safir-rayon-s: 4px;
  --safir-rayon-m: 12px;
  --safir-rayon-bouton: 12px;

  --safir-ombre-carte: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35);

  --safir-transition: 200ms cubic-bezier(.2, .6, .3, 1);
}

/**
 * Déclinaisons de fond à l'essai (retour Safir du 24 septembre 2026 : « un
 * peu trop sombre »). Seuls les trois rôles de fond et l'accent en texte
 * changent ; panneaux bordeaux, fonds exportés de la maquette et boutons
 * « vitre » restent tels quels, ils sont conçus pour un fond sombre.
 * Contrastes vérifiés sur les cinq teintes : texte ≥ 9:1, texte doux
 * ≥ 4,6:1 partout, accent en texte ≥ 4,5:1 partout (fond, surfaces, médias).
 * L'attribut est posé par inc/fond-essai.php, en préprod seulement. Une fois
 * la teinte choisie, la reporter dans les rôles ci-dessus et retirer ceci.
 */
:root[data-safir-fond="ardoise"] {
  --safir-fond: #302c36;
  --safir-fond-alt: #3b3742;
  --safir-fond-media: #45404c;
  --safir-fond-sombre: #302c36;
  --safir-accent-texte: #f095b3;
}

/* Bleus demandés par la Safir le 29 septembre 2026, en plus de l'ardoise
   retenue. Luminance alignée sur l'ardoise (0,027, écart < 5 %) pour comparer
   la teinte, pas la clarté. Pétrole : bleu sombre tiré vers le vert (200°). */
:root[data-safir-fond="nuit"] {
  --safir-fond: #222e43;
  --safir-fond-alt: #2c3950;
  --safir-fond-media: #35435b;
  --safir-fond-sombre: #222e43;
  --safir-accent-texte: #f095b3;
}

:root[data-safir-fond="petrole"] {
  --safir-fond: #1b323b;
  --safir-fond-alt: #223c46;
  --safir-fond-media: #284550;
  --safir-fond-sombre: #1b323b;
  --safir-accent-texte: #f095b3;
}

/**
 * Respect des préférences système : aucune animation pour qui n'en veut pas.
 */
@media (prefers-reduced-motion: reduce) {
  :root { --safir-transition: 1ms; }
}