/* ==========================================================================
   LISTE DES ACCOMPAGNATEURS (`accompagnateurs_liste`) — barre de filtres,
   grille des portraits, viseur reflex.

   ⚠️⚠️ L'EN-TÊTE DE CE BLOC DANS LA MAQUETTE EST FAUX. `style.css:2202` affirme
   « AUCUN obturateur (classes .gd-*, jamais .eq-carte__pic / .pg-dest__pic) ».
   Mesuré le 2026-10-06 : c'est l'inverse. `accompagnateurs.js:128` dit en toutes
   lettres « obturateur (composant partagé) : cartes injectées après main.js -> on
   (ré)équipe » et appelle `ON_applyIris()`, et `main.js:164` liste `.gd-carte`
   parmi les déclencheurs. Notre `iris.js` cible d'ailleurs `.gd-carte__pic`
   nommément depuis le lot `pg_dest`. ⇒ **L'obturateur EST sur ces cartes.**
   Énième commentaire périmé de la maquette : seul le code fait foi.

   ⚠️ TROIS RÈGLES DE LA MAQUETTE NE SONT PAS ICI, ET C'EST VOULU — `style.css:2242-2244`
   portent `[data-guide]{cursor:pointer}` et son survol, MÉLANGÉS avec `.trip__guide`
   et `.voy-table__guide`, qui appartiennent à des pages non découpées. C'est le
   piège de la règle mixte, rencontré six fois sur ce projet. Elles iront avec le
   bloc `feature`, seul consommateur porté de `data-guide`.

   ⚠️ `.gd-carte.is-leaving` / `.is-entering` SERVENT AU FILTRE, elles ne sont pas
   mortes : notre JS les pose pour animer la sortie et l'entrée des cartes. Et leur
   `@media (prefers-reduced-motion)` les neutralise — à garder.

   ⚠️ `.gd-fbtn` N'EST PAS ICI : c'est le composant de filtre PARTAGÉ avec les
   récits, promu dans `components.css` le 2026-10-06 au titre de second consommateur
   — comme la note de `recits-liste.css` l'annonçait.

   Source : `style.css:2219-2241` et `2245-2293` (bornes calculées), plus trois
   règles de `mobile.css`.
   ========================================================================== */
/* barre filtres par zone (sticky, mêmes pilules que la page offres) */
.gd-barre{ position:sticky; top:var(--header-h, 112px); z-index:300;
  background:var(--noir); }
.site-content .gd-barre{ padding-top:0; padding-bottom:0; }
/* filtres CENTRÉS (retour Fix) : le groupe de filtres est centré ; le compteur passe en absolu à
   droite pour ne pas décaler le centrage. */
.gd-barre__inner{ position:relative; display:flex; align-items:center; justify-content:center; gap:14px;
  padding-top:12px; padding-bottom:12px; flex-wrap:wrap; }
.gd-filtres{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.gd-count{ position:absolute; right:0; top:50%; transform:translateY(-50%); }
@media (max-width:820px){ .gd-count{ position:static; transform:none; width:100%; text-align:center; } }
.gd-count{ font-size:var(--fs-small); font-weight:600; color:rgba(255,255,255,.75); margin:0; }

/* GRILLE des portraits */
.gd-listing{ background:var(--creme); }
.site-content .gd-listing{ padding-top:26px; padding-bottom:clamp(48px,6vw,90px); }   /* espace avant la section suivante : demande cliente 2026-11-12 n° 7 (maquette : 0) */
.gd-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2vw,28px); }
.gd-carte{ display:block; color:inherit; text-decoration:none;   /* carte = lien vers la fiche accompagnateur */
  background:var(--blanc); border-radius:16px; overflow:hidden;
  box-shadow:0 14px 40px -20px rgba(0,0,0,.35);
  transition:box-shadow .2s var(--ease), opacity .32s var(--ease), transform .38s var(--ease); }
.gd-carte:hover{ box-shadow:0 22px 54px -22px rgba(0,0,0,.45); }   /* pas de remontée (retour Fix) — juste l'ombre */
/* lignes/portraits d'accompagnateur CLIQUABLES (data-guide) -> fiche accompagnateur. */
/* ANIMATION FILTRES (retour Fix) : sortie (fondu + léger repli) puis entrée en fondu/stagger.
   La réorganisation des cartes restantes est fluidifiée par transition:transform (FLIP en JS). */
.gd-carte.is-leaving{ opacity:0; transform:scale(.92); pointer-events:none; }
.gd-carte.is-entering{ opacity:0; transform:translateY(14px) scale(.96); }
@media (prefers-reduced-motion: reduce){
  .gd-carte, .gd-carte.is-leaving, .gd-carte.is-entering{ transition:none; transform:none; }
}
/* CADRE CARRÉ 1:1 : colle aux portraits réels (paysage/carré) recadrés sans pad gris.
   overflow:hidden = MASQUE (retour Fix) : l'obturateur .iris (agrandi 140% pour couvrir les coins)
   s'anime À L'INTÉRIEUR du cadre photo, ne dépasse plus en hauteur/largeur. */
.gd-carte__pic{ position:relative; aspect-ratio:1/1; background:#241d12 center/cover no-repeat; overflow:hidden; }
.gd-carte__pic img{ width:100%; height:100%; object-fit:cover; display:block; }
/* fallback placeholder si portrait manquant (onerror -> .is-ph) : dégradé neutre */
.gd-carte__pic img.is-ph{ background:linear-gradient(135deg,#3a3226,#6b5c45); object-fit:cover; min-height:100%; }
.gd-carte__pic::after{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(20,17,12,.55) 0%, rgba(20,17,12,0) 45%); }
/* ---- VISEUR reflex (retour Fix 07/07) : équerres de cadrage aux coins + mire centrale +
   ligne d'infos façon œilleton (f/ · vitesse · ISO · focale) en bas à droite. Superposé à la
   photo, sous le dégradé et l'obturateur (z-index 2). Purement décoratif (aria-hidden). ---- */
.gd-vis{ position:absolute; inset:0; z-index:2; pointer-events:none; }
/* 4 équerres de cadrage (coins) : un carré central évidé, coins tracés en bordures */
.gd-vis__frame{ position:absolute; inset:11px; }
.gd-vis__frame::before, .gd-vis__frame::after,
.gd-vis__corner::before, .gd-vis__corner::after{ content:""; position:absolute; width:16px; height:16px;
  border:2px solid rgba(255,255,255,.9); }
.gd-vis__frame::before{ top:0; left:0; border-right:0; border-bottom:0; }
.gd-vis__frame::after{ top:0; right:0; border-left:0; border-bottom:0; }
.gd-vis__corner::before{ bottom:0; left:0; border-right:0; border-top:0; }
.gd-vis__corner::after{ bottom:0; right:0; border-left:0; border-top:0; }
/* (réticule central RETIRÉ — retour Fix : gênait sur les visages) */
/* (point rouge « REC » RETIRÉ - A7, retour Nicolas 18/07) */
/* ligne EXIF en bas à droite (f/ · vitesse · ISO · focale), monospace façon écran d'appareil */
.gd-vis__exif{ position:absolute; right:18px; bottom:18px; z-index:3;
  font-family:"Inter",monospace; font-size:11px; font-weight:600; letter-spacing:.02em;
  color:var(--blanc); text-shadow:0 1px 3px rgba(0,0,0,.75); text-align:right; }
.gd-vis__exif b{ color:var(--jaune); font-weight:700; }

.gd-carte__zone{ position:absolute; left:12px; bottom:12px; z-index:2;
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--blanc); background:rgba(20,17,12,.6); border:1px solid rgba(255,255,255,.35);
  padding:5px 11px; border-radius:3px; }   /* angles droits : informatif */
.gd-carte__body{ padding:18px 18px 22px; }
.gd-carte__nom{ font-size:var(--fs-h3); color:var(--noir); margin:0 0 3px; line-height:1.15; }
.gd-carte__role{ font-size:var(--fs-small); font-weight:600; color:var(--jaune-d); margin:0 0 10px; }
.gd-carte__bio{ font-size:var(--fs-small); color:var(--noir-50); margin:0; line-height:1.5; }

@media (max-width:1100px){ .gd-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:760px){ .gd-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:440px){ .gd-grid{ grid-template-columns:1fr; } }

/* ==========================================================================
   AJOUT PROPRE AU PROJET — la maquette n'en a pas besoin.
   ========================================================================== */

/* État vide : la maquette ne l'a pas, son jeu de données étant toujours peuplé.
   Une page de liste doit pourtant dire qu'elle est vide. Jumeau de `.rc-vide`. */
.gd-vide{ margin:0; text-align:center; font-size:var(--fs-body); color:var(--noir-50); }

/* ==========================================================================
   MOBILE — repris de `mobile.css`.
   ⚠️ Règles MIXTES dans la maquette : `.gd-fbtn` y partage ses deux `@media` avec
   `.rc-fbtn`, et elles sont donc parties avec le composant promu dans
   `components.css`. Seul le survol de la carte reste ici.
   ========================================================================== */

/* `mobile.css:782` — au doigt, un survol qui change l'ombre reste collé après le tap. */
@media (hover:none){
  .gd-carte:hover{ box-shadow:0 14px 40px -20px rgba(0,0,0,.35); }
}
