/* SD-3 « La gravure », charte B « Nocturne » : jetons du système de design des Taxi Vézère.
   Charte CHOISIE par le client le 20/09/2026, depuis la maquette taxi-vezere-home-palette-B-nocturne.
   SEULES LES COULEURS CHANGENT : polices, axes variables, échelle, grille, espacements, rayons,
   traits, durées et courbes restent ceux qui étaient là.
   Les NOMS des jetons sont gardés tels quels (--ocre-rouge porte le vert pâle, --noir porte le blanc
   cassé) : décision de Thomas du 20/09/2026, pour que le retour en arrière tienne en une copie de
   fichiers. Le renommage viendra quand la charte sera confirmée en ligne.
   Charte précédente, SD-3 claire : ~/sites/sauvegardes-taxivezere/2026-09-20_avant-charte-B-nocturne/
   Ratios calculés par la formule WCAG de luminance relative, sur les valeurs ci-dessous. */

:root {
  /* Couleurs, par rôle. Ratio de contraste en commentaire. */
  --paroi: #0E1A15;          /* vert nuit. Fond de page, en-tête collant, halo et fond des cartes */
  --paroi-claire: #18291F;   /* vert sourd. Aplats de section, surfaces légèrement détachées du fond */
  --ocre-rouge: #8CC2A5;     /* vert pâle. Le trait, les grands titres, le bouton d'appel, l'aplat fauteuil (8,81 sur paroi) */
  --ocre-jaune: #4A7462;     /* vert gravure. Brin fin du trait, eau des cartes, trame des encadrés. Décor seul (3,37 sur paroi) */
  --lavis-ocre: #18291F;     /* vert sourd. Aplats soutenus, filets et texte du bloc fauteuil */
  --souris: #527A62;         /* gris souris. Filets d'interface (3,67 sur paroi), jamais de texte courant */
  --brun: #A9BCB1;           /* souris clair. Texte secondaire (8,93 sur paroi, 7,64 sur aplat), bordures de champ */
  --noir: #EDF3EF;           /* blanc cassé. Texte courant (15,86 sur paroi, 13,57 sur aplat), contours, anneau de focus */

  /* Le texte porté par un aplat PLEIN de --ocre-rouge. Sur la charte claire, l'accent était sombre
     et ce texte était clair ; sur la charte sombre, l'accent est pâle et ce texte est sombre.
     Sans ce jeton, la règle ne survit pas au changement de charte. (8,81 sur --ocre-rouge) */
  --sur-plein: #0E1A15;

  /* Le texte porté par un VOILE sombre posé sur une photo (légendes des volets villages).
     Toujours clair, quelle que soit la charte : le voile, lui, est sombre par construction. */
  --sur-voile: #EDF3EF;

  /* Pire cas de la matière : paroi multipliée par 0,94 (relief) puis 0,975 (grain). */
  --paroi-pire-cas: #0D1813;

  /* Familles. Aucune police système en secours visible : le secours générique n'est là que pour ne
     jamais laisser la page sans texte si Google Fonts ne répond pas. */
  --famille-titre: "Bricolage Grotesque", sans-serif;
  --famille-texte: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible", sans-serif;

  /* Axes variables retenus */
  --axes-affiche: "opsz" 96, "wdth" 80;
  --axes-titre: "opsz" 96, "wdth" 82;
  --axes-intertitre: "opsz" 36, "wdth" 85;
  --axes-marque: "opsz" 24, "wdth" 82;
  --graisse-affiche: 690;
  --graisse-titre: 650;
  --graisse-intertitre: 640;

  /* Échelle fluide, du téléphone 390 px à l'écran 1440 px et au-delà */
  --t-affiche: clamp(4rem, 1.4rem + 9.6vw, 11.25rem);        /* 64 px à 180 px */
  --t-titre: clamp(3rem, 1.1rem + 6.6vw, 7.5rem);             /* 48 px à 120 px */
  --t-intertitre: clamp(1.75rem, 1.35rem + 1.3vw, 2.625rem);   /* 28 px à 42 px */
  --t-chapeau: clamp(1.375rem, 1.1rem + 0.95vw, 1.9375rem);    /* 22 px à 31 px */
  --t-texte: clamp(1.1875rem, 1.12rem + 0.28vw, 1.3125rem);    /* 19 px à 21 px */
  --t-mention: 1.1875rem;                                       /* 19 px, plancher du texte */

  --interligne-affiche: 0.86;
  --interligne-titre: 0.9;
  --interligne-texte: 1.55;
  --approche-affiche: -0.028em;
  --approche-titre: -0.022em;
  --approche-intertitre: -0.015em;

  /* Grille : 12 colonnes, marges et gouttières fluides */
  --colonnes: 12;
  /* 26/09/2026 (RGAA 10.4) : texte seul agrandi, marge et gouttière en rem doublaient et
     écrasaient la page en mobile. Chacune est bornée par son équivalent en px : à taille de texte
     normale (1 rem = 16 px), les deux termes sont égaux et la valeur ne change pas. */
  --marge: min(clamp(1rem, 0.2rem + 4.1vw, 4.5rem), clamp(16px, 3.2px + 4.1vw, 72px));       /* 16 px à 72 px */
  --gouttiere: min(clamp(1rem, 0.6rem + 1.6vw, 2rem), clamp(16px, 9.6px + 1.6vw, 32px));     /* 16 px à 32 px */
  --largeur-max: 100rem;                               /* 1 600 px, la grille ne s'étire plus au-delà */
  --mesure: 38rem;                                     /* longueur de ligne du texte courant */

  /* Espacements, suite de raison 1,5 environ */
  --e-1: 0.25rem;
  --e-2: 0.5rem;
  --e-3: 0.75rem;
  --e-4: 1rem;
  --e-5: 1.5rem;
  --e-6: 2.25rem;
  --e-7: 3.5rem;
  --e-8: 5rem;
  --e-9: clamp(5rem, 2rem + 9vw, 11rem);               /* respiration entre blocs, jamais uniforme */

  /* Rayons : la paroi n'a pas d'angle vif, mais aucun arrondi de carte */
  --rayon-0: 0;
  --rayon-champ: 0.25rem;
  --rayon-bouton: 0.375rem 1.25rem 0.375rem 1.25rem;   /* biseau irrégulier, comme un éclat de roche */

  /* Traits et bordures */
  --trait-principal: 6px;
  --trait-brin: 3.5px;
  --trait-brin-jaune: 1.6px;
  --sillon: clamp(3.5rem, 2.6rem + 2.2vw, 4.75rem);    /* 56 px à 76 px, la saignée où passe le trait */
  --bordure-champ: 2px;
  --focus-anneau: 3px;
  --focus-ecart: 3px;

  /* Durées */
  --d-survol: 180ms;
  --d-etat: 260ms;
  --d-intro: 1.6s;

  /* Courbes. « trait » est la courbe dessinée pour le tracé (CustomEase, points écrits dans
     systeme.html). Son équivalent CSS approché sert aux transitions de survol. */
  --courbe-trait: "M0,0 C0.14,0 0.24,0.12 0.36,0.36 C0.48,0.6 0.6,0.9 0.78,0.97 C0.88,1 0.94,1 1,1";
  --courbe-survol: cubic-bezier(0.3, 0.05, 0.25, 1);
}