/**
 * themes.css — Variations d'ambiance par section
 * Motmot Treks — Design System V1, section 2.4.
 *
 * Une classe posée sur une <section> surcharge localement les
 * tokens sémantiques. Mécanisme central de variation d'ambiance,
 * sans JavaScript.
 */

/* --- Section claire (fond crème) : thème inversé --- */
/* Fond texturé (grain de papier crème, 2026-08-02, retraité 2026-08-06)
   plutôt que l'aplat --sand-50 nu : posé en propriétés longhand (pas le
   raccourci `background`) pour se superposer à la background-color que
   chaque composant déclare déjà via --surface-primary, sans la
   remplacer.
   `background-size: 100% auto` (pas `cover`, pas de largeur fixe) : le
   grain occupe toute la largeur du conteneur, sans jamais se répéter
   horizontalement — donc jamais de jointure verticale visible côté
   droit, quelle que soit la largeur (mobile ou fiche tour desktop).
   Seule la hauteur se répète (`repeat-y`), la largeur s'adapte au
   conteneur. `cover` avait été essayé d'abord et zoomait le grain de
   façon spectaculaire sur les sections très hautes (fiche tour
   détaillée), car il calait son échelle sur la hauteur à couvrir.
   Le fichier lui-même n'est pas une simple tuile : c'est un aller-retour
   vertical (image du haut, puis la même retournée verticalement en
   dessous), pour que le raccord `repeat-y` tombe toujours sur deux
   bords identiques. Deux pièges rencontrés en le construisant, tous
   deux corrigés dans le fichier actuel :
   1) la photo source a un vignettage (plus claire au centre) ; un
      simple retournement rend les bords identiques en valeur, mais si
      le vignettage n'est pas parfaitement neutralisé, il reste une
      pente résiduelle qui change de sens pile au pli — invisible en
      valeur absolue, mais une cassure de pente (bande de Mach) reste
      perceptible comme un fin trait. Un ajustement approché (modèle
      quadratique sur un échantillonnage épars) ne suffisait pas à
      l'annuler ; il faut neutraliser exactement la moyenne réelle de
      chaque ligne puis de chaque colonne (pas un modèle, une mesure
      directe) pour que le résidu soit du bruit et non une tendance.
   2) un retournement pur fait que le grain se reflète sur lui-même à
      quelques lignes d'écart, ce qui crée un écho perceptible (le même
      grain individuel qui se répond). Le bras retour est donc en plus
      décalé horizontalement (dans une image source plus large, sans
      modulo) : mêmes statistiques, mais les grains individuels ne se
      superposent plus.
   Ne pas ré-exporter ce fichier depuis la médiathèque
   (fond-texture-creme.png) sans repasser par ces deux traitements, la
   jointure réapparaîtrait.
   Un composant qui a besoin d'un fond spécifique (ex. .explore--hero et
   son papier illustré) garde la main : sa propre déclaration
   `background` (raccourci) arrive plus tard dans main.css et l'emporte
   sur ces longhand de themes.css.
   Le `?v=N` dans l'URL ci-dessous n'est pas cosmétique : contrairement
   au CSS (versionné via `?ver=` par wp_enqueue_style, cf. MOTMOT_VERSION
   dans functions.php), cette image référencée par `url()` n'a aucun
   cache-busting automatique. Le CDN Hostinger la met en cache par edge,
   indépendamment les uns des autres — sans changer l'URL, purger dans
   hPanel ne suffit pas forcément à toucher tous les nœuds d'un coup, et
   des visiteurs peuvent voir des versions différentes selon le nœud qui
   les sert. Incrémenter ce `?v=` à chaque nouvel export du fichier. */
.section--light {
	--surface-primary: var(--sand-50);
	--surface-raised:  var(--sand-100);
	--text-primary:    var(--green-800);
	--text-muted:      var(--sand-500);
	--border-subtle:   var(--sand-200);
	background-image: url('../img/fond-texture-creme.webp?v=3');
	background-position: top;
	background-size: 100% auto;
	background-repeat: repeat-y;
}

/* --- Ambiance Birdwatching : vert plus profond, immersif --- */
.section--bird {
	--surface-primary: var(--green-900);
	--surface-raised:  var(--green-800);
}