/* ==========================================================================
   GE LUMIÈRE — app.css — « le moment où le courant revient »
   DA : ~/Desktop/JOURNEES/2026-10-02/beau-site-groupes-electrogenes.net/DIRECTION-ARTISTIQUE.md
   Mode clair uniquement (sujet local Seine-et-Marne/Paris, pas d'exigence sombre ici —
   cf. mission : seuls les blocs partagés du réseau portent du contraste double).
   ========================================================================== */

/* ---------- 0. RESET MINIMAL ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--ge-brume); color:var(--ge-carbone); font-family:var(--ge-f-texte); }
img{ max-width:100%; display:block; }
a{ color:inherit; }
button{ font:inherit; cursor:pointer; background:none; border:0; color:inherit; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3{ margin:0; font-family:var(--ge-f-titre); color:var(--ge-carbone); }
p{ margin:0; }
.ge-visually-hidden{ position:absolute!important; width:1px;height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ge-sauter{ position:absolute; left:-9999px; top:0; z-index:200; background:#fff; padding:12px 18px; border-radius:0 0 10px 0; }
.ge-sauter:focus{ left:0; }
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; scroll-behavior:auto!important; } }

/* ---------- 1. JETONS (DA §2-4) ---------- */
:root{
	--ge-brume:#EFEEF3; --ge-blanc:#FFFFFF; --ge-carbone:#171615; --ge-carbone-releve:#24221F;
	--ge-fumee:#615E66; --ge-violet:#6B3FEE; --ge-violet-profond:#5229D6; --ge-lueur:#ECE6FF;
	--ge-lueur-claire:#CDBDFF; --ge-halo:#FFC970; --ge-coupure:#D2402B; --ge-retabli:#1E8F5A;
	--ge-filet:#E2E0E8; --ge-fond-logo:#171615;

	--ge-f-titre:'Stack Sans Headline', system-ui, sans-serif;
	--ge-f-texte:'Fustat', system-ui, sans-serif;

	--ge-conteneur:1312px; --ge-gouttiere:24px;
	--ge-rayon-panneau:28px; --ge-rayon-carte:20px; --ge-rayon-tuile:14px; --ge-rayon-champ:10px; --ge-rayon-pilule:999px;

	--ge-ombre-repos: 0 1px 2px rgba(23,22,21,.06), 0 12px 32px -12px rgba(23,22,21,.18);
	--ge-ombre-survol: 0 2px 4px rgba(23,22,21,.06), 0 24px 48px -18px rgba(23,22,21,.28);
	--ge-ombre-formulaire: 0 2px 6px rgba(23,22,21,.12), 0 40px 80px -24px rgba(23,22,21,.55);
	--ge-ombre-lueur: 0 0 0 1px rgba(255,201,112,.22), 0 30px 80px -30px rgba(255,201,112,.45);

	--ge-degrade-fil: linear-gradient(90deg,#6B3FEE 0%,#9C7BFF 100%);
	--ge-degrade-halo: radial-gradient(circle, rgba(255,201,112,.55) 0%, rgba(255,201,112,0) 70%);

	/* Mappage pour les blocs figés du réseau (assets/css/blocs-figes.css) */
	--sb-conteneur:1312px; --sb-lecture:720px; --sb-rail:340px; --sb-gouttiere:24px;
	--sb-accent:#6B3FEE; --sb-accent-clair:#CDBDFF; --sb-encre:#171615; --sb-doux:#615E66;
	--sb-filet:#E2E0E8; --sb-fond-carte:#FFFFFF; --sb-surf:#EFEEF3; --sb-fonce:#171615; --sb-sur-fonce:#FFFFFF;
	--sb-rayon:20px; --sb-rayon-grand:28px;
	--sb-ombre: 0 1px 2px rgba(23,22,21,.06), 0 12px 32px -12px rgba(23,22,21,.18);
	--sb-ombre-forte: 0 2px 4px rgba(23,22,21,.06), 0 24px 48px -18px rgba(23,22,21,.28);
	--sb-titre:'Stack Sans Headline', system-ui, sans-serif; --sb-texte:'Fustat', system-ui, sans-serif;
}

/* ---------- 2. TYPOGRAPHIE FLUIDE (DA §3) ---------- */
h1{ font-weight:700; letter-spacing:-.02em; line-height:1.02; font-size:clamp(2.125rem,1.5rem + 3vw,5rem); }
h2.ge-titre-section,h2{ font-weight:600; letter-spacing:-.02em; line-height:1.08; font-size:clamp(1.75rem,1.3rem + 2vw,3rem); }
h3{ font-weight:600; line-height:1.22; font-size:clamp(1.25rem,1.1rem + .6vw,1.625rem); }
.ge-accent-clair{ color:var(--ge-violet); }
section .ge-hero h1 .ge-accent-clair, .ge-entete-article__texte h1 .ge-accent-clair{ color:var(--ge-lueur-claire); }
/* CORRECTION bloquant 1 (passe 1) : un h1{color:carbone} global gagnait sur tout en-tête
   posé sur photo/fond sombre. Spécificité relevée + couverture de TOUS les en-têtes
   (accueil, ville, qui-sommes-nous, 404, contact) qui partagent .ge-hero__texte. */
.ge-hero__texte h1, .ge-entete-contact__texte h1{ color:#fff; }
.ge-hero__texte h1 .ge-accent-clair, .ge-entete-contact__texte h1 .ge-accent-clair{ color:var(--ge-lueur-claire); }

.ge-conteneur{ max-width:var(--ge-conteneur); margin-inline:auto; padding-inline:var(--ge-gouttiere); }
@media (min-width:1600px){ .ge-conteneur{ max-width:1440px; padding-inline:64px; } }
/* CORRECTION bloquant 4b (passe 1, "erreur n°7") : gouttière DA = 16px sous 420, jamais 0. */
@media (max-width:420px){ .ge-conteneur{ padding-inline:16px; } }

.ge-bande{ padding-block:64px; position:relative; }
@media (min-width:1024px){ .ge-bande{ padding-block:96px; } }
@media (min-width:1920px){ .ge-bande{ padding-block:120px; } }
.ge-bande--sans-haut{ padding-top:0; }
.ge-bande--brume{ background:var(--ge-brume); }
.ge-bande--blanc{ background:var(--ge-blanc); }
.ge-bande--carbone{ background:var(--ge-carbone); color:#fff; }
.ge-bande--carbone h2,.ge-bande--carbone h1,.ge-bande--carbone p{ color:#fff; }
.ge-bande--lueur{ background:var(--ge-lueur); }
.ge-bande--violet{ background:var(--ge-violet); color:#fff; }
.ge-bande--violet h2{ color:#fff; }
.ge-bande--tole{ background:#F4F2F8; }

.ge-titre-section{ margin-top:16px; margin-bottom:20px; }
.ge-titre-section--clair{ color:#fff; }

/* ---------- 3. PASTILLE TÉMOIN (DA §5-6) ---------- */
.ge-pastille{ display:inline-flex; align-items:center; gap:8px; height:32px; padding:0 14px; border-radius:var(--ge-rayon-pilule);
	background:var(--ge-lueur); color:var(--ge-violet-profond); font:600 .875rem var(--ge-f-texte); margin-bottom:16px; }
.ge-pastille--verre{ background:rgba(255,255,255,.12); backdrop-filter:blur(10px); color:#fff; }
.ge-pastille__temoin{ width:8px; height:8px; border-radius:50%; background:var(--ge-violet); flex:none; }
.ge-pastille--verre .ge-pastille__temoin{ background:var(--ge-halo); animation:ge-pulse 2.4s ease-in-out infinite; }
.ge-temoin{ width:8px; height:8px; border-radius:50%; background:var(--ge-halo); display:inline-block; flex:none; }
@keyframes ge-pulse{ 0%,100%{opacity:.6;} 50%{opacity:1;} }

/* ---------- 4. BOUTONS / LIENS ---------- */
.ge-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; height:52px; padding:0 26px;
	border-radius:var(--ge-rayon-pilule); font:600 1rem var(--ge-f-texte); text-decoration:none; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
.ge-btn--violet{ background:var(--ge-violet); color:#fff; }
.ge-btn--violet:hover{ background:var(--ge-violet-profond); }
.ge-btn--blanc{ background:#fff; color:var(--ge-carbone); }
.ge-btn--blanc:hover{ transform:translateY(-2px); box-shadow:var(--ge-ombre-survol); }
.ge-btn--pleine{ width:100%; }
.ge-lien-fort{ color:var(--ge-violet-profond); font-weight:600; text-decoration:none; }
.ge-lien-fort:hover{ text-decoration:underline; }
.ge-lien-retour{ color:var(--ge-fumee); font:600 .9375rem var(--ge-f-texte); }

/* ---------- 5. EN-TÊTE (DA §B) ---------- */
.ge-header{ position:fixed; inset:0 0 auto 0; z-index:100; height:72px; display:flex; align-items:center; transition:background .2s ease, box-shadow .2s ease; }
@media (max-width:640px){ .ge-header{ height:60px; } }
/* CORRECTION bloquant 6 (passe 1) : l'en-tête fixe ne doit jamais recouvrir le H1 sur
   les pages sans héros plein cadre (article, auteur, recherche, archives, légales) :
   on réserve sa hauteur au-dessus du contenu. */
.ge-sans-heros{ padding-top:72px; }
@media (max-width:640px){ .ge-sans-heros{ padding-top:60px; } }
.ge-header__corps{ display:flex; align-items:center; justify-content:space-between; width:100%; gap:24px; }
.ge-header.est-plein,.ge-sans-heros .ge-header{ background:var(--ge-blanc); box-shadow:0 1px 0 rgba(23,22,21,.08); }
.ge-header.est-plein .ge-logo,.ge-sans-heros .ge-header .ge-logo,.ge-header.est-plein .ge-nav__lien,.ge-sans-heros .ge-header .ge-nav__lien{ color:var(--ge-carbone); }

.ge-logo{ display:flex; align-items:center; gap:10px; text-decoration:none; color:#fff; }
.ge-logo__pictogramme{ color:currentColor; flex:none; }
.ge-logo__texte{ font:700 20px/1 var(--ge-f-titre); letter-spacing:-.01em; white-space:nowrap; }
.ge-logo__tld{ font:600 20px/1 var(--ge-f-texte); color:var(--ge-violet); }
/* CORRECTION bloquant 6 (passe 1) : le nom passait sur 2 lignes et chevauchait la
   pastille/le H1 à 390 ; une seule ligne, taille réduite, « .net » peut disparaître si
   l'espace manque vraiment (très petits écrans). */
@media (max-width:420px){
	.ge-logo__texte{ font-size:15px; }
	.ge-logo__tld{ font-size:15px; }
}
.ge-header.est-plein .ge-logo__tld,.ge-sans-heros .ge-logo__tld{ color:var(--ge-violet); }
.ge-logo--blanc{ color:#fff; }
.ge-footer .ge-logo__tld{ color:var(--ge-lueur-claire); }

.ge-nav__liste{ display:flex; align-items:center; gap:28px; }
.ge-nav__lien{ font:500 16px var(--ge-f-texte); color:#fff; text-decoration:none; }
.ge-nav__lien--bouton{ display:flex; align-items:center; gap:4px; }
@media (max-width:980px){ .ge-nav{ display:none; } }

.ge-nav__communes{ position:relative; }
.ge-mega{ position:absolute; top:calc(100% + 16px); left:50%; transform:translateX(-50%); width:640px;
	background:#fff; border-radius:var(--ge-rayon-panneau); box-shadow:var(--ge-ombre-survol); padding:28px;
	display:grid; grid-template-columns:1fr 220px; gap:24px; opacity:0; visibility:hidden; translate:0 8px; transition:.2s ease; }
.ge-nav__communes:hover .ge-mega,.ge-nav__communes:focus-within .ge-mega,.ge-nav__communes.est-ouvert .ge-mega{ opacity:1; visibility:visible; translate:0 0; }
.ge-mega__colonnes{ display:grid; grid-template-columns:1fr 1fr; gap:4px 16px; }
.ge-mega__colonnes a{ display:block; padding:7px 0; color:var(--ge-carbone); text-decoration:none; font-size:.9375rem; }
.ge-mega__colonnes a:hover{ color:var(--ge-violet-profond); }
.ge-mega__carte{ border-radius:16px; overflow:hidden; }
.ge-mega__carte svg{ width:100%; height:auto; display:block; background:var(--ge-carbone); }

.ge-header__actions{ display:flex; align-items:center; gap:14px; }
.ge-header__devis{ height:44px; padding:0 22px; }
@media (max-width:640px){ .ge-header__devis{ display:none; } }
.ge-header__burger{ display:none; width:40px; height:40px; border-radius:50%; align-items:center; justify-content:center; flex-direction:column; gap:5px; }
.ge-header__burger span{ width:18px; height:2px; background:currentColor; border-radius:2px; }
.ge-header.est-plein .ge-header__burger,.ge-sans-heros .ge-header__burger{ color:var(--ge-carbone); }
.ge-header__burger{ color:#fff; }
@media (max-width:980px){ .ge-header__burger{ display:flex; } }

.ge-fond-assombri{ position:fixed; inset:0; background:rgba(23,22,21,.6); z-index:150; opacity:0; visibility:hidden; transition:.2s ease; }
.ge-fond-assombri.est-ouvert{ opacity:1; visibility:visible; }
.ge-tiroir{ position:fixed; top:0; right:0; bottom:0; width:min(88vw,380px); background:#fff; z-index:160; padding:24px; overflow-y:auto;
	translate:100% 0; transition:translate .25s ease; }
.ge-tiroir.est-ouvert{ translate:0 0; }
.ge-tiroir__fermer{ font-size:28px; line-height:1; margin-bottom:16px; }
.ge-tiroir__liste > li{ border-bottom:1px solid var(--ge-filet); padding:12px 0; }
.ge-tiroir__liste > li > a{ text-decoration:none; font-weight:600; }
.ge-tiroir__sous{ margin-top:10px; display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; }
.ge-tiroir__sous a{ text-decoration:none; font-size:.875rem; color:var(--ge-fumee); padding:4px 0; display:block; }
.ge-tiroir__liste .ge-btn{ margin-top:8px; }

/* ---------- 6. HÉROS ACCUEIL — la lumière qui revient (DA §B, §5-1) ---------- */
/* CORRECTION bloquant 3 (passe 1) : overflow:hidden vivait sur .ge-hero et rognait le
   formulaire qui doit déborder de 40-64 px SOUS le héros (DA §B/§F). Déplacé sur le
   cadre photo seul : la photo reste coupée au bord, plus rien d'autre. */
.ge-hero{ position:relative; min-height:680px; max-height:900px; height:calc(100svh - 56px); overflow:visible; }
.ge-hero__photo-cadre{ position:absolute; inset:0; overflow:hidden; }
.ge-hero__photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ge-hero__photo--coupure{ filter:brightness(.36) saturate(.3) contrast(1.05); }
.ge-hero__photo--allumee{ clip-path:inset(0 100% 0 0); filter:none; transition:clip-path 1.4s cubic-bezier(.65,0,.35,1); }
.ge-hero.est-allumee .ge-hero__photo--allumee{ clip-path:inset(0 0 0 0); }
/* CORRECTION bloquant 2 (passe 1) : état final net — la coupure filtrée disparaît
   complètement derrière la couche nette (plus de bord flouté/pixelisé visible). */
.ge-hero.est-allumee .ge-hero__photo--coupure{ opacity:0; }
.ge-hero__front{ position:absolute; top:0; bottom:0; left:0; width:2px; background:var(--ge-halo); box-shadow:0 0 28px 8px rgba(255,201,112,.55);
	opacity:0; transition:left 1.4s cubic-bezier(.65,0,.35,1), opacity .3s ease; }
.ge-hero.est-allumage .ge-hero__front{ opacity:1; left:100%; }
.ge-hero.est-allumee .ge-hero__front{ opacity:0; }
/* CORRECTION bloquant 2 (passe 1) : voile renforcé (lisibilité sur photo de jour claire). */
/* CORRECTION passe 3 §2 : voile resserré à GAUCHE seulement (DA §B) — la photo doit se
   voir entre le titre et la carte, plus de bande uniforme qui mange le bord droit. */
.ge-hero__voile{ position:absolute; inset:0; pointer-events:none;
	background: linear-gradient(90deg, rgba(23,22,21,.80) 0%, rgba(23,22,21,.45) 38%, rgba(23,22,21,0) 62%),
		linear-gradient(0deg, rgba(23,22,21,.35) 0%, rgba(23,22,21,0) 35%); }
.ge-hero__photo{ object-position:var(--ge-hero-pos, 70% 50%); }
.ge-hero__voile--404{ background:linear-gradient(0deg, rgba(23,22,21,.8) 0%, rgba(23,22,21,.5) 100%); }
.ge-hero__corps{ position:relative; height:100%; display:grid; grid-template-columns:1fr 456px; align-items:end; gap:24px; padding-bottom:40px; z-index:2; }
@media (max-width:1100px){ .ge-hero__corps{ grid-template-columns:1fr; } }
.ge-hero__texte{ color:#fff; max-width:700px; padding-bottom:80px; }
@media (max-width:1100px){ .ge-hero__texte{ padding-bottom:0; } }
.ge-hero__sous-titre{ display:block; margin-top:16px; font-size:clamp(1.125rem,1rem + .4vw,1.25rem); line-height:1.5; color:rgba(255,255,255,.88); max-width:600px; }
.ge-hero__preuves{ display:flex; flex-wrap:wrap; gap:16px 24px; margin-top:24px; }
.ge-hero__preuves li{ display:flex; align-items:center; gap:8px; font:500 15px var(--ge-f-texte); color:#fff; }
.ge-hero__formulaire{ position:relative; translate:0 40px; z-index:3; }
@media (max-width:1100px){ .ge-hero__formulaire{ translate:0; margin-top:-48px; } }
.ge-hero__credit{ position:absolute; right:16px; bottom:8px; z-index:2; margin:0; font-size:11px; color:rgba(255,255,255,.6); }

/* CORRECTION important 16 (passe 1) : mini-carte flottante bas-gauche de la photo ville. */
.ge-carte-panneau--flottante{ display:none; }
@media (min-width:961px){
	.ge-carte-panneau--flottante{ display:block; position:absolute; left:24px; bottom:24px; width:200px; z-index:2; padding:10px; }
}
.ge-hero--ville,.ge-hero--page,.ge-hero--404{ min-height:auto; height:560px; }
@media (min-width:1920px){ .ge-hero--ville,.ge-hero--page{ height:640px; } }
@media (max-width:640px){ .ge-hero--page,.ge-hero--404{ height:300px; } }
.ge-hero__corps--ville{ grid-template-columns:1fr 456px; }
.ge-hero__corps--page{ grid-template-columns:1fr; }
@media (max-width:1100px){ .ge-hero__corps--ville{ grid-template-columns:1fr; } }

/* CORRECTION bloquant 4a (passe 1) : à 390, le héros ville pris en hauteur fixe (300px)
   forçait le formulaire par-dessus le H1. La photo garde 280px, le reste (fil, H1,
   preuves, formulaire) repasse en flux normal SOUS la photo, lisible, sans recouvrement. */
@media (max-width:640px){
	.ge-hero--ville{ height:auto; overflow:visible; background:#fff; }
	.ge-hero--ville .ge-hero__photo-cadre,
	.ge-hero--ville .ge-hero__voile{ height:180px; }
	.ge-hero--ville .ge-hero__corps--ville{ position:relative; height:auto; display:block; padding-top:196px; padding-bottom:24px; }
	.ge-hero--ville .ge-hero__texte{ color:var(--ge-carbone); padding-bottom:0; }
	.ge-hero--ville .ge-hero__texte h1{ color:var(--ge-carbone); }
	.ge-hero--ville .ge-hero__texte h1 .ge-accent-clair{ color:var(--ge-violet); }
	.ge-hero--ville .ge-hero__texte .sbt-fil-ariane{ color:var(--ge-fumee) !important; }
	.ge-hero--ville .ge-hero__texte .sbt-fil-ariane a{ color:inherit !important; }
	.ge-hero--ville .ge-hero__formulaire{ margin-top:20px; translate:0; }
	.ge-hero--ville .ge-hero__credit{ color:rgba(255,255,255,.8); }
}
/* CORRECTION passe 3 §9 : le nom de commune ne se coupe jamais ; le H1 descend en taille
   plutôt que de passer à la ligne (Champs-sur-Marne, Montereau-Fault-Yonne…). */
.ge-hero--ville .ge-hero__texte h1{ font-size:clamp(2.1rem,1.5rem + 2vw,3.25rem); }
.ge-hero--ville .ge-hero__texte h1 .ge-accent-clair{ white-space:nowrap; }
/* CORRECTION passe 3 §9 : carte de nuit du rail plus courte que l'écran. */
.sbt-rail .ge-carte-panneau--mini{ max-width:260px; }
/* CORRECTION passe 3 §5 : barre latérale ≤700px (1440) — sommaire en max-height avec
   défilement interne fin, formulaire compact sous lui (hauteur déjà auto depuis passe 2). */
.sbt-rail-carte--sommaire{ max-height:340px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--ge-violet) transparent; }
.sbt-rail-carte--sommaire::-webkit-scrollbar{ width:6px; }
.sbt-rail-carte--sommaire::-webkit-scrollbar-thumb{ background:var(--ge-violet); border-radius:999px; }

/* ---------- 7. L'INVERSEUR (DA §5-2) ---------- */
.ge-inverseur{ display:flex; align-items:center; gap:14px; margin:24px 0; }
.ge-inverseur__curseur{ position:relative; width:168px; height:44px; }
.ge-inverseur__piste{ position:absolute; inset:0; border-radius:999px; background:#E7E4EE; transition:background .25s ease; }
.ge-inverseur__rond{ position:absolute; top:4px; left:4px; width:36px; height:36px; border-radius:50%; background:#fff; box-shadow:var(--ge-ombre-repos); transition:translate .25s ease; }
.ge-inverseur__curseur[aria-pressed="true"] .ge-inverseur__piste{ background:var(--ge-violet); }
.ge-inverseur__curseur[aria-pressed="true"] .ge-inverseur__rond{ translate:124px 0; }
.ge-inverseur__libelles{ display:flex; gap:10px; font:600 14px var(--ge-f-texte); color:var(--ge-fumee); }
.ge-inverseur__libelles span[data-etat="groupe"]{ color:var(--ge-violet); }
.ge-panneau-inverseur{ background:#fff; border-radius:var(--ge-rayon-panneau); box-shadow:var(--ge-ombre-repos); padding:40px; display:grid; grid-template-columns:5fr 7fr; gap:40px; align-items:center; }
@media (max-width:860px){ .ge-panneau-inverseur{ grid-template-columns:1fr; padding:28px; } }
.ge-panneau-inverseur__photo{ position:relative; border-radius:var(--ge-rayon-carte); overflow:hidden; aspect-ratio:4/3; }
.ge-panneau-inverseur__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .4s ease; }
.ge-panneau-inverseur__img--groupe{ opacity:0; }
.ge-inverseur__curseur[aria-pressed="true"] ~ * .ge-panneau-inverseur__img--groupe,
.est-groupe .ge-panneau-inverseur__img--groupe{ opacity:1; }
.est-groupe .ge-panneau-inverseur__img--secteur{ opacity:0; }
/* CORRECTION bloquant 10 (passe 1) : l'étiquette débordait hors du cadre photo (coin
   arrondi qui la rognait) ; posée DANS la photo, en pastille verre, jamais coupée. */
.ge-panneau-inverseur__etiquette{ position:absolute; left:16px; bottom:16px; right:16px; width:fit-content;
	background:rgba(255,255,255,.14); backdrop-filter:blur(10px); color:#fff; border-radius:999px;
	padding:10px 16px; font:600 14px var(--ge-f-texte); box-shadow:0 1px 2px rgba(23,22,21,.2); }

/* ---------- 8. GRILLES DE CARTES ---------- */
.ge-grille-cartes{ display:grid; gap:var(--ge-gouttiere); }
.ge-grille-cartes--2{ grid-template-columns:repeat(2,1fr); }
.ge-grille-cartes--3{ grid-template-columns:repeat(3,1fr); }
.ge-grille-cartes--4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:980px){ .ge-grille-cartes--3,.ge-grille-cartes--4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .ge-grille-cartes--2,.ge-grille-cartes--3,.ge-grille-cartes--4{ grid-template-columns:1fr; } }

.ge-carte-besoin{ display:flex; flex-direction:column; text-align:left; background:#fff; border-radius:var(--ge-rayon-carte); overflow:hidden; box-shadow:var(--ge-ombre-repos); transition:.2s ease; width:100%; }
.ge-carte-besoin:hover{ transform:translateY(-3px); box-shadow:var(--ge-ombre-survol); }
.ge-carte-besoin__photo{ position:relative; height:240px; }
.ge-carte-besoin__photo img{ width:100%; height:100%; object-fit:cover; }
.ge-carte-besoin__photo .ge-pastille{ position:absolute; left:14px; bottom:14px; margin:0; }
.ge-carte-besoin__bas{ padding:18px 20px 22px; display:flex; flex-direction:column; gap:10px; }

.ge-carte-article{ display:flex; flex-direction:column; text-decoration:none; background:#fff; border-radius:var(--ge-rayon-carte); overflow:hidden; box-shadow:var(--ge-ombre-repos); transition:.2s ease; }
.ge-carte-article:hover{ transform:translateY(-3px); box-shadow:var(--ge-ombre-survol); }
.ge-carte-article__photo{ position:relative; aspect-ratio:16/9; }
.ge-carte-article__photo img{ width:100%; height:100%; object-fit:cover; }
.ge-carte-article__photo .ge-pastille{ position:absolute; left:14px; top:14px; margin:0; }
.ge-carte-article__corps{ padding:18px 20px 22px; display:flex; flex-direction:column; gap:8px; }
.ge-carte-article__meta{ font-size:12px; color:var(--ge-fumee); }
.ge-carte-article__titre{ font:600 1.0625rem var(--ge-f-titre); color:var(--ge-carbone); }

.ge-carte-auteur{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; text-decoration:none; background:#fff; border-radius:var(--ge-rayon-carte); padding:24px; box-shadow:var(--ge-ombre-repos); }
.ge-carte-auteur strong{ font:600 18px var(--ge-f-titre); color:var(--ge-carbone); }
.ge-carte-auteur span{ color:var(--ge-fumee); font-size:14px; }

/* ---------- 9. MONOGRAMME AUTEUR ---------- */
.ge-mono{ --ge-mono-taille:88px; width:var(--ge-mono-taille); height:var(--ge-mono-taille); border-radius:50%; flex:none;
	display:flex; align-items:center; justify-content:center; background:var(--ge-lueur); color:var(--ge-violet-profond);
	font:700 calc(var(--ge-mono-taille) * .34) var(--ge-f-titre); }
.ge-mono--avatar{ width:32px; height:32px; font-size:13px; }

/* ---------- 10. PLAQUES DE PUISSANCE (DA §5-4) ---------- */
.ge-plaque{ position:relative; display:flex; flex-direction:column; text-align:left; border-radius:var(--ge-rayon-carte); overflow:hidden; background:var(--ge-carbone-releve); box-shadow:var(--ge-ombre-lueur); width:100%; transition:.2s ease; }
.ge-plaque:hover{ transform:translateY(-3px); }
.ge-plaque__photo{ position:relative; height:220px; }
.ge-plaque__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
/* CORRECTION bloquant 11 (passe 1) : chiffre blanc + "kVA" directement sur une photo
   claire = illisible. Dégradé Carbone en bas de la photo pour porter le chiffre. */
.ge-plaque__photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(23,22,21,.85) 0%, rgba(23,22,21,0) 70%); }
.ge-plaque__chiffre{ margin-top:-44px; position:relative; z-index:1; padding-left:20px; font:700 56px/1 var(--ge-f-titre); color:#fff; text-shadow:0 2px 24px rgba(23,22,21,.5); }
.ge-plaque__chiffre small{ font:600 18px var(--ge-f-texte); color:var(--ge-lueur-claire); margin-left:4px; }
.ge-plaque__usage{ padding:12px 20px 22px; color:rgba(255,255,255,.75); font-size:14px; line-height:1.45; }

/* ---------- 11. CARTE DE NUIT (DA §5-5, §E) ---------- */
.ge-carte-panneau{ background:var(--ge-carbone); border-radius:var(--ge-rayon-panneau); padding:32px; box-shadow:var(--ge-ombre-lueur); position:relative; }
.ge-carte-panneau--mini{ padding:16px; }
.ge-carte-panneau svg.ge-carte-nuit{ width:100%; height:auto; display:block; }
.ge-carte-nuit path{ fill:var(--ge-carbone-releve); stroke:#3A372F; stroke-width:1.5; }
.ge-carte-nuit a path{ fill:#2E2B27; transition:fill .2s ease; }
.ge-carte-nuit a:hover path,.ge-carte-nuit a:focus path,.ge-carte-nuit a.est-actif path{ fill:#36322C; }
.ge-carte-nuit a circle{ fill:var(--ge-halo); filter:drop-shadow(0 0 10px rgba(255,201,112,.6)); }
.ge-carte-nuit a:hover circle,.ge-carte-nuit a:focus circle,.ge-carte-nuit a.est-actif circle{ stroke:var(--ge-violet); stroke-width:2; }
.ge-carte-nuit a text{ fill:rgba(255,255,255,.7); font:500 11px var(--ge-f-texte); opacity:0; transition:opacity .15s ease; }
.ge-carte-nuit a:hover text,.ge-carte-nuit a:focus text,.ge-carte-nuit a.est-actif text{ opacity:1; fill:#fff; font-weight:600; }
/* CORRECTION important 17 (passe 1) : la pilule touchait le bord gauche du cadre et se
   faisait rogner. Décalée de 24px avec white-space:nowrap, jamais hors cadre. */
.ge-carte-panneau__paris{ position:absolute; left:24px; top:50%; translate:0 -50%; background:rgba(255,255,255,.14); backdrop-filter:blur(10px);
	color:#fff; font:600 12px var(--ge-f-texte); padding:6px 14px; border-radius:999px; white-space:nowrap; z-index:2; }
.ge-carte-panneau--mini .ge-carte-panneau__paris{ left:16px; font-size:11px; padding:5px 10px; }

.ge-section-carte{ display:grid; grid-template-columns:7fr 5fr; gap:32px; align-items:start; }
@media (max-width:980px){ .ge-section-carte{ grid-template-columns:1fr; } }
/* CORRECTION passe 3 §7 : carte de nuit plafonnée à 520px de haut (section ≤700px en
   1440) — le SVG (viewBox 800×996) est mis à l'échelle par la hauteur et centré plutôt
   que par la largeur, sinon il dépassait largement. */
.ge-section-carte__carte .ge-carte-panneau{ max-height:520px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ge-section-carte__carte .ge-carte-panneau svg.ge-carte-nuit{ width:auto; height:100%; max-width:none; }
/* CORRECTION passe 3 §7 : les communes en 3 colonnes (au lieu d'un empilement vertical
   de 4 groupes qui allongeait la bande). */
.ge-section-carte__liste{ display:grid; grid-template-columns:repeat(3,1fr); gap:0 24px; align-content:start; }
.ge-section-carte__liste .ge-section-carte__note{ grid-column:1 / -1; margin-top:8px; color:var(--ge-fumee); font-size:14px; }
@media (max-width:760px){ .ge-section-carte__liste{ grid-template-columns:1fr 1fr; } }
.ge-liste-communes__groupe{ margin-bottom:22px; }
.ge-liste-communes__groupe strong{ display:block; margin-bottom:10px; font:600 13px var(--ge-f-texte); text-transform:uppercase; letter-spacing:.04em; color:var(--ge-fumee); }
.ge-liste-communes__groupe a{ display:flex; align-items:center; gap:8px; padding:7px 0; text-decoration:none; font:600 16px var(--ge-f-texte); color:var(--ge-carbone); }
.ge-liste-communes__groupe a:hover{ color:var(--ge-violet-profond); }
.ge-liste-communes__cp{ color:var(--ge-fumee); font-weight:500; font-size:13px; }
.ge-section-carte__note{ color:var(--ge-fumee); font-size:14px; margin-top:8px; }

/* ---------- 12. FIL SOUS TENSION — étapes « comment ça marche » (DA §5-3) ---------- */
.ge-etapes-fil{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:32px; }
@media (max-width:860px){ .ge-etapes-fil{ grid-template-columns:1fr; } }
.ge-etapes-fil__piste{ display:none; }
@media (min-width:861px){
	.ge-etapes-fil__piste{ display:block; position:absolute; top:110px; left:16.6%; right:16.6%; height:4px; border-radius:999px; background:#E7E4EE; z-index:0; }
	.ge-etapes-fil__remplissage{ display:block; height:100%; width:66%; border-radius:999px; background:var(--ge-degrade-fil); }
}
.ge-etapes-fil__item{ position:relative; z-index:1; }
.ge-etapes-fil__photo{ position:relative; border-radius:var(--ge-rayon-carte); overflow:visible; aspect-ratio:4/3; margin-bottom:16px; }
.ge-etapes-fil__photo img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
/* CORRECTION important 12 (passe 1) : le chiffre mordait le haut de la photo (texte nu
   posé dessus) → pastille ronde Violet d'arc à cheval sur le coin haut-gauche, dedans. */
.ge-etapes-fil__numero{ position:absolute; top:16px; left:16px; translate:0 -50%; width:44px; height:44px; border-radius:50%;
	background:var(--ge-violet); color:#fff; display:flex; align-items:center; justify-content:center;
	font:700 20px var(--ge-f-titre); box-shadow:0 4px 12px rgba(23,22,21,.3); }
.ge-etapes-fil__item h3{ margin-bottom:8px; }
.ge-etapes-fil__item p{ color:var(--ge-fumee); line-height:1.6; }
/* CORRECTION passe 3 §7 : padding bas = padding haut (l'override fixe à 96px cassait la
   symétrie à 1920 où le haut passe à 120px — supprimé, la bande suit le rythme standard
   des deux côtés comme toutes les autres). */

/* ---------- 13. FAQ ACCUEIL ---------- */
.ge-section-faq{ display:grid; grid-template-columns:7fr 5fr; gap:32px; align-items:start; }
@media (max-width:980px){ .ge-section-faq{ grid-template-columns:1fr; } }
.ge-faq-accueil{ display:grid; gap:10px; }
.ge-faq-accueil__item{ background:#fff; border:1px solid var(--ge-filet); border-radius:14px; }
.ge-faq-accueil__item summary{ list-style:none; cursor:pointer; padding:18px 20px; font:600 16px var(--ge-f-texte); display:flex; justify-content:space-between; gap:16px; }
.ge-faq-accueil__item summary::-webkit-details-marker{ display:none; }
.ge-faq-accueil__item summary::after{ content:"+"; color:var(--ge-violet); font-size:20px; flex:none; }
.ge-faq-accueil__item[open] summary::after{ content:"–"; }
.ge-faq-accueil__item div{ padding:0 20px 18px; color:var(--ge-fumee); line-height:1.65; }
.ge-carte-question{ background:#fff; border-radius:var(--ge-rayon-panneau); overflow:hidden; box-shadow:var(--ge-ombre-repos); padding-bottom:24px; text-align:center; }
.ge-carte-question__photo{ aspect-ratio:1; width:100%; object-fit:cover; margin-bottom:16px; }
.ge-carte-question h3{ margin-bottom:16px; padding-inline:16px; }

/* ---------- 14. APPEL FINAL ---------- */
/* CORRECTION important 9 (passe 1) : 540 px de violet pour un titre + un bouton = vide.
   Hauteur réduite au contenu (padding ramené au rythme standard), 3 témoins Halo ajoutés. */
.ge-bande--violet{ padding-block:64px; }
/* CORRECTION passe 3 §7 : hauteur ≈380, contenu centré verticalement (plus de vide
   résiduel sous le bouton en desktop large). */
.ge-appel-final{ display:grid; grid-template-columns:1fr 340px; gap:40px; align-items:center; min-height:380px; }
@media (max-width:860px){ .ge-appel-final{ grid-template-columns:1fr; } }
@media (max-width:640px){ .ge-appel-final__photo img{ aspect-ratio:auto; height:220px; border-radius:20px; translate:0; } }
.ge-appel-final h2{ color:#fff; margin-bottom:16px; max-width:560px; }
.ge-appel-final__texte p{ color:rgba(255,255,255,.85); margin-bottom:24px; }
.ge-appel-final__preuves{ display:flex; flex-wrap:wrap; gap:16px 24px; margin-top:24px; }
.ge-appel-final__preuves li{ display:flex; align-items:center; gap:8px; font:500 14px var(--ge-f-texte); color:#fff; }
.ge-appel-final__photo img{ width:100%; border-radius:var(--ge-rayon-panneau); box-shadow:0 2px 6px rgba(23,22,21,.12), 0 40px 80px -24px rgba(23,22,21,.55); aspect-ratio:1; object-fit:cover; translate:0 -48px; }
@media (max-width:860px){ .ge-appel-final__photo img{ translate:0; } }
.ge-appel-final--simple{ text-align:center; display:block; }
.ge-appel-final--simple h2{ margin-bottom:24px; }

/* ---------- 15. PIED DE PAGE ---------- */
.ge-footer{ background:var(--ge-carbone); color:rgba(255,255,255,.8); padding-top:1px; }
.ge-footer__fil{ height:1px; background:var(--ge-degrade-fil); }
/* CORRECTION passe 3 §7 : colonnes équilibrées — communes (3 sous-colonnes) a plus de
   contenu, la colonne cta n'a plus qu'un bouton. */
.ge-footer__grille{ display:grid; grid-template-columns:1.1fr 1.6fr 1.1fr .9fr; gap:40px; padding-block:80px 48px; }
@media (max-width:900px){ .ge-footer__grille{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .ge-footer__grille{ grid-template-columns:1fr; } }
.ge-footer__phrase{ margin:16px 0; max-width:320px; line-height:1.6; color:rgba(255,255,255,.65); }
.ge-footer__titre-widget{ display:block; margin-bottom:14px; font:600 13px var(--ge-f-texte); text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,.5); }
.ge-footer__communes{ display:grid; grid-template-columns:repeat(3,1fr); gap:4px 12px; }
.ge-footer__legal{ margin-top:18px; padding-top:18px; border-top:1px solid rgba(255,255,255,.12); }
@media (max-width:900px){ .ge-footer__communes{ grid-template-columns:1fr 1fr; } }
.ge-footer__communes a,.ge-footer li a{ display:block; padding:4px 0; text-decoration:none; color:rgba(255,255,255,.72); font-size:14px; }
.ge-footer__communes a:hover,.ge-footer li a:hover{ color:#fff; }
.ge-footer__cta{ display:flex; flex-direction:column; align-items:flex-start; gap:16px; }
.ge-footer__cta ul{ display:flex; flex-direction:column; gap:4px; }
.ge-footer__bas{ border-top:1px solid rgba(255,255,255,.12); padding-block:20px; font-size:13px; color:rgba(255,255,255,.5); }

/* CORRECTION passe 3 §8 : réassurances contact — carte + icône Lucide inline. */
.ge-carte-reassurance{ background:#fff; border:1px solid var(--ge-filet); border-radius:var(--ge-rayon-carte); padding:24px; display:flex; flex-direction:column; gap:14px; box-shadow:var(--ge-ombre-repos); }
.ge-carte-reassurance .ge-icone{ color:var(--ge-violet); width:28px; height:28px; }
.ge-carte-reassurance p{ margin:0; font-weight:600; color:var(--ge-carbone); line-height:1.4; }
.ge-grille-cartes--3 + .ge-photo-pleine,
.ge-carte-reassurance + .ge-photo-pleine{ margin-top:var(--ge-gouttiere); }

/* CORRECTION passe 3 §6 : grande carte « une » (rubrique à 1 seul article), photo
   2/3 à gauche, texte 1/3 à droite. */
.ge-carte-une{ display:grid; grid-template-columns:2fr 1fr; background:#fff; border-radius:var(--ge-rayon-panneau); overflow:hidden; box-shadow:var(--ge-ombre-repos); transition:.2s ease; text-decoration:none; }
.ge-carte-une:hover{ box-shadow:var(--ge-ombre-survol); translate:0 -2px; }
.ge-carte-une__photo{ display:block; min-height:360px; }
.ge-carte-une__photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.ge-carte-une__corps{ padding:32px; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.ge-carte-une__titre{ font:600 26px var(--ge-f-titre); color:var(--ge-carbone); line-height:1.2; }
.ge-carte-une__chapo{ color:var(--ge-fumee); line-height:1.5; }
@media (max-width:760px){ .ge-carte-une{ grid-template-columns:1fr; } .ge-carte-une__photo{ min-height:220px; } }

/* CORRECTION passe 3 §10 : le monogramme n'avait AUCUN style (disque, taille, anneau) —
   simple texte brut. Disque Lueur + anneau Violet d'arc, taille pilotée par la variable
   posée par ge_monogramme()/le filtre get_avatar (88 « Écrit par », 120 fiche auteur). */
.ge-mono{ --ge-mono-taille:88px; display:inline-flex; flex-shrink:0; align-items:center; justify-content:center;
	width:var(--ge-mono-taille); height:var(--ge-mono-taille); border-radius:50%; background:var(--ge-lueur);
	border:2px solid var(--ge-violet); color:var(--ge-violet-profond); font:700 calc(var(--ge-mono-taille) * .36) var(--ge-f-titre); }

/* CORRECTION passe 3 §4 : « Points à retenir » / « Le saviez-vous » n'avaient aucune
   règle dans ce thème (carte noire par défaut du socle) — fond Lueur, filet gauche
   Violet d'arc, coches violettes, même traitement sur les pages ville. */
.sbt-encadre{ background:var(--ge-lueur); border-radius:var(--ge-rayon-carte); border-left:4px solid var(--ge-violet); padding:24px 28px; margin:32px 0; }
.sbt-encadre-titre{ font:700 15px var(--ge-f-titre); color:var(--ge-carbone); margin:0 0 12px; text-transform:none; }
.sbt-retenir-liste{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.sbt-retenir-liste li{ position:relative; padding-left:28px; color:var(--ge-carbone); line-height:1.5; }
.sbt-retenir-liste li::before{ content:""; position:absolute; left:0; top:.3em; width:16px; height:16px; border-radius:50%; background:var(--ge-violet); }
.sbt-retenir-liste li::after{ content:""; position:absolute; left:4px; top:.55em; width:8px; height:5px; border-left:2px solid #fff; border-bottom:2px solid #fff; rotate:-45deg; }
.sbt-encadre--saviez{ background:var(--ge-carbone); color:#fff; }
.sbt-encadre--saviez .sbt-encadre-titre{ color:#fff; }
.sbt-encadre--saviez p:not(.sbt-encadre-titre){ color:rgba(255,255,255,.85); margin:0; }
.sbt-encadre--saviez::before{ content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--ge-halo); margin-right:8px; box-shadow:0 0 10px 2px rgba(255,201,112,.5); }

/* ---------- 16. FORMULAIRE — « Votre courant en 5 questions » (DA §C) ---------- */
/* CORRECTION bloquant 7 (passe 1) : la carte est posée sur des bandes Carbone (contact,
   plaques) qui imposent color:#fff par héritage → libellés de tuiles blancs sur fond
   blanc = invisibles. On fixe l'encre ici, une fois pour toutes les instances. */
.ge-form-carte{ width:456px; max-width:92vw; background:#fff; color:var(--ge-carbone); border-radius:var(--ge-rayon-panneau); box-shadow:var(--ge-ombre-formulaire); padding:28px; }
@media (max-width:1920px) and (min-width:1600px){ .ge-form-carte{ width:480px; } }
@media (max-width:640px){ .ge-form-carte{ width:100%; padding:20px; } }
/* DA §F contact : formulaire « version large », tuiles plus hautes. */
.ge-form-carte--large{ width:620px; max-width:94vw; }
.ge-form-carte--large .ge-form__tuile-photo{ height:108px; }
@media (max-width:640px){ .ge-form-carte--large{ width:100%; } .ge-form-carte--large .ge-form__tuile-photo{ height:72px; } }
/* CORRECTION bloquant 15 (passe 1) : la barre latérale d'article affichait un bouton
   vide ; DA §F = formulaire compact étape 1 visible tout de suite (tuiles 2×2
   compactes), qui ouvre la suite normalement au clic. */
.ge-form-carte--compacte{ width:100%; padding:20px; box-shadow:none; border-radius:var(--ge-rayon-carte); border:1px solid var(--ge-filet); }
.ge-form-carte--compacte .ge-form__haut-ligne1,.ge-form-carte--compacte .ge-form__fil{ margin-bottom:10px; }
.ge-form-carte--compacte .ge-form__question{ font-size:17px; }
.ge-form-carte--compacte .ge-form__corps{ min-height:0; }
.ge-form-carte--compacte .ge-form__tuile-photo{ height:52px; }
.ge-form-carte--compacte .ge-form__tuile-libelle{ font-size:13px; }
/* CORRECTION passe 3 §1 : tuiles HORIZONTALES — sous 640px partout, et en permanence
   dans la barre latérale (contexte compact) à toutes largeurs. Vignette 48×48 r12 à
   gauche, libellé à droite, cible tactile 64px de haut. */
@media (max-width:640px){
	.ge-form__tuile--photo{ flex-direction:row; align-items:center; gap:12px; min-height:64px; }
	.ge-form__tuile--photo .ge-form__tuile-photo{ width:48px; height:48px; border-radius:12px; margin-bottom:0; flex-shrink:0; }
}
.ge-form-carte--compacte .ge-form__tuile--photo{ flex-direction:row; align-items:center; gap:12px; min-height:64px; }
.ge-form-carte--compacte .ge-form__tuile--photo .ge-form__tuile-photo{ width:48px; height:48px; border-radius:12px; margin-bottom:0; flex-shrink:0; }

.ge-form__piege{ position:absolute; left:-9999px; }
.ge-form__haut{ margin-bottom:20px; }
.ge-form__haut-ligne1{ display:flex; justify-content:space-between; font:600 13px var(--ge-f-texte); color:var(--ge-fumee); margin-bottom:10px; }
.ge-form__fil{ position:relative; height:6px; border-radius:999px; background:#E7E4EE; margin-bottom:16px; }
.ge-form__fil-remplissage{ display:block; height:100%; width:20%; border-radius:999px; background:var(--ge-degrade-fil); transition:width .42s cubic-bezier(.2,.8,.2,1); }
.ge-form__fil-tete{ position:absolute; top:50%; left:20%; translate:-50% -50%; width:12px; height:12px; border-radius:50%; background:var(--ge-halo);
	box-shadow:0 0 0 4px rgba(255,201,112,.35), 0 0 16px 4px rgba(255,201,112,.5); transition:left .42s cubic-bezier(.2,.8,.2,1); }
.ge-form__question{ font:600 24px var(--ge-f-titre); }
@media (max-width:640px){ .ge-form__question{ font-size:20px; } }

/* CORRECTION importants 7 (passe 1) : la hauteur fixe laissait ~140 px de vide sous les
   tuiles quand l'étape était courte ; la carte se cale maintenant sur son contenu. */
.ge-form__corps{ min-height:0; position:relative; }
.ge-form__etape{ border:0; margin:0; padding:0; display:none; animation:ge-form-entre .24s cubic-bezier(.2,.8,.2,1); }
.ge-form__etape.est-active{ display:block; }
@keyframes ge-form-entre{ from{ opacity:0; translate:24px 0; } to{ opacity:1; translate:0 0; } }

.ge-form__tuiles{ display:grid; gap:10px; }
.ge-form__tuiles--2x2{ grid-template-columns:1fr 1fr; }
.ge-form__tuiles--puissance{ grid-template-columns:1fr 1fr; }
.ge-form__tuiles--delai{ grid-template-columns:repeat(4,1fr); gap:8px; }
@media (max-width:640px){ .ge-form__tuiles--delai{ grid-template-columns:1fr 1fr; } }

.ge-form__tuile{ position:relative; display:flex; flex-direction:column; justify-content:center; gap:6px; min-height:56px; padding:14px;
	border-radius:var(--ge-rayon-tuile); border:1.5px solid var(--ge-filet); background:#fff; cursor:pointer; transition:.16s ease; }
.ge-form__tuile:hover{ border-color:#C9BEF5; translate:0 -2px; box-shadow:var(--ge-ombre-repos); }
.ge-form__tuile input{ position:absolute; opacity:0; width:1px; height:1px; }
.ge-form__tuile input:focus-visible ~ *{ outline:3px solid rgba(107,63,238,.35); outline-offset:2px; border-radius:inherit; }
.ge-form__tuile:has(input:checked){ border-color:var(--ge-violet); background:var(--ge-lueur); }
.ge-form__tuile-coche{ position:absolute; top:10px; right:10px; width:22px; height:22px; border-radius:50%; background:var(--ge-violet); display:none; }
.ge-form__tuile-coche::after{ content:""; position:absolute; inset:0; margin:auto; width:10px; height:7px; border-left:2px solid #fff; border-bottom:2px solid #fff; rotate:-45deg; translate:1px -1px; }
.ge-form__tuile:has(input:checked) .ge-form__tuile-coche{ display:block; }
.ge-form__tuile-libelle{ font:600 17px var(--ge-f-titre); }
.ge-form__tuile--photo .ge-form__tuile-libelle{ font-size:15px; }
.ge-form__tuile--photo{ padding:14px; }
/* CORRECTION bloquant 7 (passe 1) : .ge-form__tuile-photo est un <span> — height ne
   s'applique pas aux éléments inline sans display:block (racine du bug "images seules,
   grand vide, libellé disparu"). */
.ge-form__tuile-photo{ display:block; width:100%; height:72px; border-radius:10px; overflow:hidden; margin-bottom:8px; }
@media (max-width:640px){ .ge-form__tuile-photo{ height:64px; } }
.ge-form__tuile-photo img{ width:100%; height:100%; object-fit:cover; }
.ge-form__tuile--chiffre{ align-items:flex-start; }
.ge-form__tuile--pleine{ grid-column:1 / -1; flex-direction:row; align-items:center; }
.ge-form__tuile-chiffre{ font:700 28px var(--ge-f-titre); color:var(--ge-carbone); }
.ge-form__tuile-chiffre small{ font:600 14px var(--ge-f-texte); color:var(--ge-fumee); margin-left:4px; }

.ge-form__pastille{ position:relative; display:flex; align-items:center; justify-content:center; height:40px; padding:0 14px; border-radius:999px;
	border:1.5px solid var(--ge-filet); background:#fff; font:600 14px var(--ge-f-texte); cursor:pointer; }
.ge-form__pastille input{ position:absolute; opacity:0; }
.ge-form__pastille:has(input:checked){ border-color:var(--ge-violet); background:var(--ge-lueur); color:var(--ge-violet-profond); }
.ge-form__pastille--urgent{ border-color:rgba(210,64,43,.4); }
.ge-form__pastille--urgent:has(input:checked){ border-color:var(--ge-coupure); background:#FBE7E3; color:var(--ge-coupure); }

.ge-form__label{ display:block; font:600 14px var(--ge-f-texte); color:var(--ge-carbone); margin-bottom:14px; }
.ge-form__input{ display:block; width:100%; height:52px; margin-top:6px; padding:0 14px; border-radius:var(--ge-rayon-champ);
	border:1.5px solid var(--ge-filet); font:400 16px var(--ge-f-texte); background:#fff; }
.ge-form__input:focus{ outline:none; border-color:var(--ge-violet); box-shadow:0 0 0 3px rgba(107,63,238,.15); }
.ge-form__textarea{ height:auto; padding:12px 14px; resize:vertical; }
.ge-form__sous-legende{ font:600 14px var(--ge-f-texte); margin:18px 0 10px; color:var(--ge-carbone); }
.ge-form__facultatif,.ge-form__requis{ font-weight:400; color:var(--ge-fumee); font-size:12px; }
.ge-form__rgpd{ display:flex; gap:10px; align-items:flex-start; font-size:13px; color:var(--ge-fumee); margin-top:6px; }
.ge-form__rgpd a{ color:var(--ge-violet-profond); }

.ge-form__bas{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; height:52px; }
.ge-form__rgpd-mini{ font-size:12px; color:var(--ge-fumee); text-align:center; margin-top:12px; }
.ge-form__rgpd-mini a{ color:var(--ge-violet-profond); }

.ge-form__succes{ text-align:center; padding-top:20px; }
.ge-form__succes h3{ margin:16px 0 12px; }
.ge-form__succes-recap{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin-bottom:16px; }
.ge-form__succes-recap li{ background:var(--ge-lueur); color:var(--ge-violet-profond); border-radius:999px; padding:5px 12px; font-size:13px; font-weight:600; }
.ge-form__succes p{ color:var(--ge-fumee); margin-bottom:16px; }
.ge-form__mini-inverseur{ display:inline-flex; width:48px; height:28px; border-radius:999px; background:var(--ge-violet); position:relative; margin:0 auto; }
.ge-form__mini-curseur{ position:absolute; top:3px; right:3px; width:22px; height:22px; border-radius:50%; background:#fff; }

/* ---------- 17. EN-TÊTE D'ARTICLE — capsule de nuit (DA §F) ---------- */
.ge-entete-article{ background:var(--ge-brume); padding-top:56px; padding-bottom:0; }
/* CORRECTION passe 3 §3 : la photo passe à DROITE et prend ≈58% (DA §F) — colonnes
   inversées (texte 5fr, photo 7fr, pas l'inverse comme avant cette passe). */
.ge-entete-article__grille{ display:grid; grid-template-columns:5fr 7fr; gap:40px; align-items:start; padding-bottom:64px; }
@media (max-width:960px){ .ge-entete-article__grille{ grid-template-columns:1fr; padding-bottom:48px; } }
.ge-entete-article__chapo{ font-size:clamp(1.0625rem,1rem + .3vw,1.3125rem); color:var(--ge-fumee); margin-top:16px; }
.ge-entete-article__auteur{ display:flex; align-items:center; gap:12px; margin-top:20px; font-size:14px; }
.ge-entete-article__auteur a{ font-weight:600; text-decoration:none; color:var(--ge-carbone); }
.ge-entete-article__dates{ color:var(--ge-fumee); font-size:13px; }
.ge-entete-article__photo{ position:relative; padding-bottom:28px; }
/* CORRECTION passe 3 §3 : « plaque signalétique sur photo » — bord gauche en biais,
   coins droits arrondis (r28), plaque Carbone à cheval sur le bord biais, en bas. */
.ge-entete-article__photo-cadre{ position:relative; height:520px; overflow:hidden;
	clip-path:polygon(8% 0,100% 0,100% 100%,0 100%);
	border-top-right-radius:var(--ge-rayon-panneau); border-bottom-right-radius:var(--ge-rayon-panneau);
	box-shadow:var(--ge-ombre-survol); }
.ge-entete-article__img{ width:100%; height:100%; object-fit:cover; display:block; }
.ge-plaque-signaletique{ position:absolute; left:-72px; bottom:52px; z-index:2; display:flex; flex-direction:column; gap:7px;
	background:var(--ge-carbone); border-radius:16px; padding:16px 20px; box-shadow:var(--ge-ombre-repos); max-width:300px; }
.ge-plaque-signaletique span{ display:flex; align-items:center; gap:8px; font:600 13px var(--ge-f-texte); color:#fff; white-space:nowrap; }
@media (max-width:960px){
	.ge-entete-article__photo{ padding-bottom:24px; }
	.ge-entete-article__photo-cadre{ height:240px; clip-path:none; border-radius:var(--ge-rayon-carte); }
	.ge-plaque-signaletique{ position:relative; left:auto; bottom:auto; margin-top:-24px; margin-left:16px; max-width:calc(100% - 32px); }
}
/* CORRECTION bloquant 14 (passe 1) : "Relu le …" passait à la ligne et débordait de la
   pilule. white-space:nowrap sur chaque repère, rubrique retirée à 1440 (déjà dans la
   pastille au-dessus), hauteur auto + rayon 20 à 390 pour accueillir 2 lignes proprement. */
.ge-capsule-nuit{ position:relative; margin:-28px 0 0 48px; width:calc(100% - 48px); background:var(--ge-carbone); border-radius:999px; min-height:56px;
	display:flex; align-items:center; gap:10px; padding:10px 20px; flex-wrap:wrap; color:#fff; font:600 13px var(--ge-f-texte); box-shadow:var(--ge-ombre-repos); }
.ge-capsule-nuit span{ white-space:nowrap; }
.ge-capsule-nuit span[aria-hidden]{ color:var(--ge-halo); font-size:8px; }
.ge-capsule-nuit .ge-capsule-nuit__rubrique{ display:none; }
@media (max-width:960px){ .ge-entete-article__img{ aspect-ratio:16/10; } .ge-capsule-nuit{ margin-left:16px; width:calc(100% - 16px); border-radius:20px; padding:12px 16px; } }

/* ---------- 18. EN-TÊTE DE RUBRIQUE (DA §F) ---------- */
.ge-entete-rubrique{ padding-bottom:88px; }
.ge-entete-rubrique__grille{ display:grid; grid-template-columns:6fr 6fr; gap:40px; align-items:center; }
@media (max-width:860px){ .ge-entete-rubrique__grille{ grid-template-columns:1fr; } }
.ge-entete-rubrique p{ color:rgba(255,255,255,.8); margin-top:12px; max-width:480px; }
.ge-entete-rubrique__compteur{ font:700 clamp(2.5rem,4vw,5.5rem) var(--ge-f-titre); color:var(--ge-lueur-claire); margin-top:16px; }
.ge-entete-rubrique__compteur small{ font:600 18px var(--ge-f-texte); color:rgba(255,255,255,.7); margin-left:8px; }
.ge-entete-rubrique__photo{ position:relative; border-radius:var(--ge-rayon-panneau); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--ge-ombre-lueur); translate:0 48px; }
.ge-entete-rubrique__photo img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:860px){ .ge-entete-rubrique__photo{ translate:0; } }

/* ---------- 19. PAGE VILLE — mise en page du corps ---------- */
.ge-ville-mise-en-page{ display:grid; grid-template-columns:minmax(0,720px) 340px; gap:24px; padding:48px var(--ge-gouttiere) 0; justify-content:center; align-items:start; }
@media (max-width:1080px){ .ge-ville-mise-en-page{ grid-template-columns:1fr; } }
.ge-page-corps :is(h2,h3){ margin-top:1.8em; }
.ge-page-corps p{ margin-bottom:1.2em; line-height:1.7; }
/* CORRECTION bloquant 8 (passe 1, partiel) : première phrase en chapô pour casser l'effet
   "mur de texte" (R-1796) — aucune photo de rechange disponible (chaque photo du site
   n'apparaît qu'une fois, toutes déjà utilisées ailleurs : voir compte rendu). */
.ge-page-corps > p:first-of-type{ font-size:1.25rem; line-height:1.55; color:var(--ge-fumee); }

/* ---------- 20. PAGES SIMPLES / ENTÊTE CONTACT ---------- */
.ge-entete-simple{ padding-bottom:48px; }
.ge-entete-simple__sous{ color:var(--ge-fumee); margin-top:8px; }
.ge-entete-contact{ padding-bottom:88px; }
.ge-entete-contact__grille{ display:grid; grid-template-columns:5fr 7fr; gap:40px; align-items:start; }
@media (max-width:980px){ .ge-entete-contact__grille{ grid-template-columns:1fr; } }
.ge-entete-contact .ge-hero__preuves{ margin-top:24px; }
.ge-entete-contact__formulaire{ translate:0 64px; }
@media (max-width:980px){ .ge-entete-contact__formulaire{ translate:0; margin-top:24px; } }
.ge-photo-pleine{ width:100%; border-radius:var(--ge-rayon-panneau); aspect-ratio:16/10; object-fit:cover; }

/* ---------- 21bis. INFOGRAPHIES DU SOCLE (CORRECTION bloquant 5, passe 1) ----------
   Le socle (socle/socle-infographies.php) émet du balisage neutre (sbs-jauges, sbs-tarifs,
   sbs-frise, sbs-lieu + classes sbs_*) qu'aucune règle ne mettait en forme : rendu en
   texte brut collé. Habillage DA (tuiles Carbone relevé / Lueur d'arc). */
.sbs_jauges,.sbs_tarifs,.sbs_frise{ display:block; margin:40px 0; }
.sbs_jauges_titre,.sbs_tarifs_titre,.sbs_frise_titre{ display:block; font:600 13px var(--ge-f-texte); text-transform:uppercase; letter-spacing:.04em; color:var(--ge-fumee); margin-bottom:14px; }
.sbs_jauges{ display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; }
/* CORRECTION passe 3 §5 : grille régulière selon le nombre réel de tuiles (jamais une
   tuile orpheline) — règles `:nth-of-type`/`:nth-last-of-type` en passe 4 §6, plus bas
   (celles-ci en `:last-child` se cassaient dès qu'une source suivait les tuiles). */
.sbs_jauge{ display:flex; flex-direction:column; gap:4px; background:var(--ge-carbone-releve); border-radius:var(--ge-rayon-carte); padding:18px 20px; }
.sbs_jauge_libelle{ display:block; color:rgba(255,255,255,.72); font:500 13px var(--ge-f-texte); }
.sbs_jauge_valeur{ font:700 32px var(--ge-f-titre); color:#fff; }
.sbs_jauge_unite{ display:inline; margin-left:4px; color:var(--ge-lueur-claire); font:600 14px var(--ge-f-texte); }
.sbs_tarifs{ display:flex; flex-direction:column; gap:10px; }
.sbs_tarif{ display:flex; align-items:center; gap:14px; }
.sbs_tarif_libelle{ flex:0 0 160px; color:var(--ge-carbone); font:500 14px var(--ge-f-texte); }
.sbs_tarif_barre{ flex:1; width:100%; height:10px; accent-color:var(--ge-violet); }
.sbs_frise{ display:flex; flex-direction:column; gap:0; border-left:2px solid var(--ge-filet); padding-left:20px; }
.sbs_etape{ position:relative; padding-bottom:22px; display:block; }
.sbs_etape::before{ content:""; position:absolute; left:-25px; top:4px; width:10px; height:10px; border-radius:50%; background:var(--ge-violet); }
.sbs_etape_date{ display:block; font:600 12px var(--ge-f-texte); color:var(--ge-violet-profond); text-transform:uppercase; letter-spacing:.04em; }
.sbs_etape_titre{ display:block; font:600 16px var(--ge-f-titre); color:var(--ge-carbone); margin-top:2px; }
.sbs_etape_desc{ display:block; color:var(--ge-fumee); font-size:14px; margin-top:4px; }
.sbs_lieu{ display:block; background:var(--ge-brume); border-radius:var(--ge-rayon-carte); padding:20px 22px; }
.sbs_lieu_nom{ display:block; font:600 17px var(--ge-f-titre); margin-bottom:6px; }
.sbs_lieu_adresse,.sbs_lieu_acces{ display:block; color:var(--ge-fumee); font-size:14px; margin-bottom:4px; font-style:normal; }
.sbs_lieu_carte{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; color:var(--ge-violet-profond); font-weight:600; text-decoration:none; }
.sbs_source{ display:block; margin-top:10px; color:var(--ge-fumee); font-size:12px; }

/* ---------- 21. PAGINATION ---------- */
.ge-pagination{ display:flex; gap:8px; margin-top:32px; }
.ge-pagination .page-numbers{ display:inline-flex; align-items:center; justify-content:center; min-width:40px; height:40px; border-radius:999px; text-decoration:none; background:#fff; border:1px solid var(--ge-filet); color:var(--ge-carbone); }
.ge-pagination .page-numbers.current{ background:var(--ge-violet); color:#fff; border-color:var(--ge-violet); }

/* ===== Passe 2 (orchestrateur, sur captures v4) ===== */
/* Page ville : la mini-carte flottante débordait sur le corps et doublonnait la carte de la colonne. Retirée. */
.ge-carte-panneau--flottante{ display:none !important; }
/* Page ville à 390 : les 3 ancrages passent sous la photo, sur fond clair → encre Carbone. */
@media (max-width:640px){
	.ge-hero--ville .ge-hero__preuves li{ color:var(--ge-carbone); }
	.ge-hero--ville .ge-hero__preuves{ margin-top:14px; gap:8px 16px; }
}
/* Accueil à 390 (DA §B) : photo 320, pastille + H1 posés en bas de la photo SOUS l'en-tête,
   formulaire juste dessous qui chevauche la photo ; sous-titre et preuves passent sous le formulaire. */
@media (max-width:640px){
	.ge-hero[data-ge-hero]{ height:auto; min-height:0; max-height:none; }
	.ge-hero[data-ge-hero] .ge-hero__photo-cadre,
	.ge-hero[data-ge-hero] .ge-hero__voile{ height:330px; bottom:auto; }
	.ge-hero[data-ge-hero] .ge-hero__corps{ display:flex; flex-direction:column; height:auto; padding-top:0; padding-bottom:24px; }
	.ge-hero[data-ge-hero] .ge-hero__texte{ order:1; min-height:300px; display:flex; flex-direction:column; justify-content:flex-end; padding:76px 0 24px; }
	.ge-hero[data-ge-hero] .ge-hero__texte h1{ font-size:34px; line-height:1.06; }
	.ge-hero[data-ge-hero] .ge-hero__sous-titre,
	.ge-hero[data-ge-hero] .ge-hero__preuves{ display:none; }
	.ge-hero[data-ge-hero] .ge-hero__formulaire{ order:2; margin-top:-8px; translate:0; }
}
/* Qui sommes-nous : la carte de nuit pleine largeur écrasait la page → carte réduite à côté de la liste des communes. */
.ge-qsn-zone{ display:grid; grid-template-columns:minmax(0,440px) 1fr; gap:48px; align-items:center; }
.ge-qsn-zone__liste{ display:flex; flex-wrap:wrap; gap:10px; }
.ge-qsn-zone__liste a{ display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:#fff; box-shadow:0 1px 0 rgba(23,22,21,.06), 0 6px 18px rgba(23,22,21,.06); font:500 15px var(--ge-f-texte); color:var(--ge-carbone); text-decoration:none; transition:background .2s, color .2s; }
.ge-qsn-zone__liste a:hover, .ge-qsn-zone__liste a:focus-visible{ background:var(--ge-lueur); color:var(--ge-violet-profond); }
.ge-qsn-zone__liste a::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--ge-halo); box-shadow:0 0 8px rgba(255,201,112,.9); }
@media (max-width:860px){ .ge-qsn-zone{ grid-template-columns:1fr; gap:28px; } }
.ge-qsn-zone__intro{ font-size:18px; line-height:1.6; color:var(--ge-fumee); margin:0 0 20px; max-width:560px; }

/* Un élément [hidden] reste caché même s’il porte une classe qui fixe display (bouton Envoyer visible dès l’étape 1). */
[hidden]{ display:none !important; }
.ge-form input.est-a-remplir{ border-color:var(--ge-coupure, #D2402B); box-shadow:0 0 0 3px rgba(210,64,43,.15); }
/* Formulaire de recherche WordPress (404, recherche) : habillé comme le reste du site. */
.search-form{ display:flex; gap:10px; align-items:center; }
.search-form label{ flex:1; margin:0; }
.search-form .search-field{ width:100%; height:52px; padding:0 18px; border:1px solid rgba(23,22,21,.14); border-radius:999px; background:#fff; font:400 16px var(--ge-f-texte); color:var(--ge-carbone); box-shadow:0 6px 18px rgba(23,22,21,.06); }
.search-form .search-field:focus{ outline:none; border-color:var(--ge-violet); box-shadow:0 0 0 4px var(--ge-lueur); }
.search-form .search-submit{ height:52px; padding:0 24px; border:0; border-radius:999px; background:var(--ge-violet); color:#fff; font:600 16px var(--ge-f-texte); cursor:pointer; transition:background .2s; }
.search-form .search-submit:hover{ background:var(--ge-violet-profond); }
.ge-rubrique-demande{ display:grid; grid-template-columns:1fr minmax(0,520px); gap:56px; align-items:center; }
.ge-rubrique-demande__texte p{ font-size:18px; line-height:1.6; color:var(--ge-fumee); max-width:520px; margin:12px 0 20px; }
.ge-rubrique-demande__preuves li{ color:var(--ge-carbone); }
.ge-rubrique-demande__form .ge-form-carte{ width:100%; max-width:520px; }
@media (max-width:960px){ .ge-rubrique-demande{ grid-template-columns:1fr; gap:24px; } }
.ge-signature-auteur{ display:flex; align-items:center; gap:12px; margin:32px 0 0; padding:16px 18px; border-radius:20px; background:#fff; box-shadow:0 6px 18px rgba(23,22,21,.06); font-size:15px; color:var(--ge-fumee); }
.ge-signature-auteur p{ margin:0; }
.ge-signature-auteur a{ color:var(--ge-carbone); font-weight:600; }
.ge-signature-auteur--ligne{ display:block; background:none; box-shadow:none; padding:0; margin-top:20px; font-size:14px; }
/* Tiroir mobile fermé : retiré du rendu (sinon un panneau fixe hors écran reste « au-dessus » du H1 pour les lecteurs d'écran et les contrôles). */
.ge-tiroir:not(.est-ouvert){ display:none; }
.ge-tiroir.est-ouvert{ animation:ge-tiroir-entre .28s cubic-bezier(.2,.8,.2,1); }
@keyframes ge-tiroir-entre{ from{ translate:100% 0; } to{ translate:0 0; } }
@media (prefers-reduced-motion:reduce){ .ge-tiroir.est-ouvert{ animation:none; } }
/* Pastille numérotée des étapes : posée DANS la photo (elle débordait de 6 px). */
.ge-etapes-fil__numero{ top:12px !important; left:12px !important; translate:none !important; }
/* Zones à photo : fond Carbone de secours (visible pendant le chargement de la photo, et fond réel pour le texte blanc). */
.ge-hero{ background-color:var(--ge-carbone); }
/* En-tête transparent sur photo : léger voile haut pour que le menu blanc reste lisible sur une photo claire. */
.ge-header:not(.est-plein){ background-image:linear-gradient(180deg, rgba(23,22,21,.42) 0%, rgba(23,22,21,0) 100%); }
.ge-sans-heros .ge-header{ background-image:none; }
/* Pastilles posées sur une photo : verre fumé (lisible quelle que soit la photo). */
.ge-pastille--verre,
.ge-carte-besoin__photo .ge-pastille,
.ge-carte-article__photo .ge-pastille,
.ge-panneau-inverseur__etiquette{ background-color:transparent; background-image:linear-gradient(rgba(23,22,21,.55), rgba(23,22,21,.55)); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); color:#fff; }
.ge-logo__plaque{ width:34px; height:34px; border-radius:9px; box-shadow:0 0 0 1px rgba(255,255,255,.22); }
@media (max-width:640px){ .ge-logo__plaque{ width:30px; height:30px; } }
/* Rythme vertical (RE-0240) : aucune bande sans marge haute. */
.ge-bande--sans-haut{ padding-top:clamp(40px, 5vw, 72px) !important; }
/* Barre latérale d'article : formulaire ≥ 260 px de large (RE-0243). */
.sbt-article-mise-en-page{ --sb-rail:360px; }
.sbt-rail .ge-form-carte, .sbt-rail [data-ge-form-carte]{ padding:16px; }
/* 390 : la colonne « 1fr » prenait la largeur minimale de son contenu (+3 px) → minmax(0,1fr). */
@media (max-width:1080px){
	.sbt-article-mise-en-page, .ge-ville-mise-en-page{ grid-template-columns:minmax(0,1fr); }
	.sbt-article-principal, .ge-ville-principal, .sbt-rail{ min-width:0; }
}
/* Encadré « Points à retenir » : fond Lueur + filet violet (DA §F), texte Carbone — il sortait noir sur noir. */
.sbt-encadre.sbt-encadre--retenir{ background:var(--ge-lueur) !important; color:var(--ge-carbone) !important; border:0 !important; border-left:4px solid var(--ge-violet) !important; box-shadow:none !important; }
.sbt-encadre.sbt-encadre--retenir *{ color:var(--ge-carbone) !important; }
.sbt-encadre.sbt-encadre--retenir .sbt-encadre-titre{ color:var(--ge-violet-profond) !important; }
/* Plaque signalétique de l'en-tête d'article : posée SUR la photo (elle débordait sur le chapô). */
.ge-plaque-signaletique{ left:calc(8% + 16px) !important; }
@media (max-width:640px){ .ge-plaque-signaletique{ left:16px !important; } }
.ge-form__bas.est-vide{ display:none; }
.ge-mono--img{ display:inline-block; width:var(--ge-mono-taille,88px); height:var(--ge-mono-taille,88px); border-radius:50%; flex:none; background:none; border:0; padding:0; }
/* Un fieldset garde par défaut min-width:min-content → l'étape du formulaire compact débordait de 13 px à 390. */
.ge-form fieldset, .ge-form__etape{ min-width:0; }
.ge-rubrique-auteurs{ margin:-8px auto 32px; }
/* Grilles de tuiles : colonnes plancher 0 (sinon une tuile au libellé long élargit la carte et la page déborde). */
.ge-form__tuiles--2x2, .ge-form__tuiles--puissance{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.ge-form__tuiles--delai{ grid-template-columns:repeat(4, minmax(0,1fr)); }
@media (max-width:640px){ .ge-form__tuiles--delai{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
/* CORRECTION passe 4 §1 : overflow-wrap:anywhere coupait les libellés lettre à lettre
   dans le formulaire compact de la barre latérale (3 articles + ville). Le wrap normal
   suffit (min-width:0 reste nécessaire pour empêcher le débordement de page). */
.ge-form__tuile{ min-width:0; }
/* Barre latérale compacte : tuiles HORIZONTALES une par ligne (vignette 40px à gauche,
   libellé sur une ligne, jamais coupé), pour toutes les étapes du formulaire, pas
   seulement celle à photo. */
.ge-form-carte--compacte .ge-form__tuiles{ grid-template-columns:minmax(0,1fr); }
.ge-form-carte--compacte .ge-form__tuile{ flex-direction:row; align-items:center; gap:12px; min-height:52px; padding:10px 14px; overflow-wrap:normal; hyphens:none; }
.ge-form-carte--compacte .ge-form__tuile-photo{ width:40px; height:40px; min-width:40px; border-radius:10px; margin-bottom:0; flex-shrink:0; }
.ge-form-carte--compacte .ge-form__tuile-libelle{ white-space:normal; overflow-wrap:normal; hyphens:none; line-height:1.25; }
.ge-form-carte--compacte .ge-form__tuile--chiffre{ align-items:center; flex-direction:row; justify-content:flex-start; gap:10px; }
.ge-form-carte--compacte .ge-form__tuile-chiffre{ font-size:20px; flex-shrink:0; }
.ge-form-carte--compacte .ge-form__tuile-coche{ top:50%; translate:0 -50%; }
.ge-form-carte--compacte .ge-form__tuiles--delai{ grid-template-columns:repeat(2, minmax(0,1fr)); }
/* Plaque signalétique : jamais plus large que la photo qui la porte (débordait de 44 px vers 900 px de large). */
.ge-plaque-signaletique{ max-width:calc(92% - 32px) !important; }
@media (max-width:1100px){ .ge-plaque-signaletique span{ white-space:normal; } }

/* ===== Passe 4 (designer, sur JUGEMENT-VISUEL.md §8) ===== */
/* §3 : la phrase d'auteur de rubrique était tirée à -8px et collait aux bandes
   voisines (recouverte au passage de pli sur mobile). Marge propre des deux côtés. */
.ge-rubrique-auteurs{ margin:32px auto 32px; }
/* §3 : .ge-etapes-fil__photo est un <span> — aspect-ratio/hauteur ne s'appliquent pas à
   un inline sans display:block (même bug déjà corrigé sur .ge-form__tuile-photo), ce qui
   faisait une photo à hauteur 0 et un chevauchement de l'étape suivante par-dessus le
   texte de la précédente en 390. */
.ge-etapes-fil__photo{ display:block; }
@media (max-width:860px){ .ge-etapes-fil{ gap:40px; } }
/* §4 : bande d'appel « simple » (Qui sommes-nous, sans photo) héritait du min-height:380px
   pensé pour la variante à 2 colonnes avec photo → ~300px de vide sous le bouton. */
.ge-appel-final--simple{ min-height:0; }
/* §6 : la grille régulière des tuiles [sbs_jauges] (passe 3 §5, ligne ~644) utilisait
   « :has(> .sbs_jauge:nth-child(N):last-child) » — cassé dès qu'une source suit les
   tuiles ([sbs_jauges source="…"] ajoute un <small class="sbs_source"> APRÈS, qui devient
   alors le vrai dernier enfant : plus aucune règle ne correspond, repli sur l'ancienne
   grille auto-fit qui laisse une tuile orpheline (3 sur une ligne, la 4e seule dessous —
   exactement le défaut vu sur « Qu'est-ce », « Installation », « Pourquoi »).
   nth-of-type/nth-last-of-type ignorent le titre et la source (autres balises) et
   comptent uniquement les <sbs-jauge>, quel que soit ce qui les entoure. */
.sbs_jauges:has(> .sbs_jauge:nth-of-type(2):nth-last-of-type(1)){ grid-template-columns:repeat(2,1fr); }
.sbs_jauges:has(> .sbs_jauge:nth-of-type(3):nth-last-of-type(1)){ grid-template-columns:repeat(3,1fr); }
.sbs_jauges:has(> .sbs_jauge:nth-of-type(4):nth-last-of-type(1)){ grid-template-columns:repeat(4,1fr); }
.sbs_jauges:has(> .sbs_jauge:nth-of-type(5):nth-last-of-type(1)){ grid-template-columns:repeat(5,1fr); }
@media (max-width:900px){
	.sbs_jauges:has(> .sbs_jauge:nth-of-type(3):nth-last-of-type(1)),
	.sbs_jauges:has(> .sbs_jauge:nth-of-type(4):nth-last-of-type(1)),
	.sbs_jauges:has(> .sbs_jauge:nth-of-type(5):nth-last-of-type(1)){ grid-template-columns:repeat(2,1fr); }
}
/* §8 : carte « une » de rubrique à 1 article — le texte restait calé en haut d'une
   colonne haute de 360px, laissant ~150px de vide sous le bouton. */
.ge-carte-une__photo{ min-height:300px; }
.ge-carte-une__corps{ justify-content:space-between; }
/* §1 : le sommaire passe en carte en tête du corps à TOUTES les largeurs (plus
   seulement <1080) — la barre latérale ne garde que le formulaire. */
.sbt-sommaire-mobile{ display:block !important; margin-bottom:24px; }
/* §10 : fiche auteur — bandeau sombre avec photo de terrain, identité + tuiles chiffrées. */
.ge-entete-auteur__corps{ display:flex; flex-direction:column; gap:28px; align-items:flex-start; padding-bottom:40px; }
.ge-entete-auteur__identite{ display:flex; align-items:center; gap:20px; }
.ge-entete-auteur__identite h1{ margin:6px 0 0; }
.ge-entete-auteur__tuiles{ display:flex; gap:16px; flex-wrap:wrap; }
.ge-entete-auteur__tuile{ background:rgba(255,255,255,.14); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-radius:var(--ge-rayon-carte); padding:14px 22px; display:flex; flex-direction:column; gap:2px; }
.ge-entete-auteur__tuile strong{ font:700 24px var(--ge-f-titre); color:#fff; }
.ge-entete-auteur__tuile span{ font-size:13px; color:rgba(255,255,255,.75); }
@media (max-width:640px){ .ge-entete-auteur__corps{ padding-bottom:24px; } .ge-entete-auteur__identite{ gap:14px; } }

/* Mode clair uniquement : la barre de défilement et les contrôles natifs restent clairs même si le système est en sombre (la barre sombre faisait une « bande noire » au bord droit du héros). */
:root{ color-scheme: light only; }
/* Zone couverte (accueil) : titre dans la colonne de la liste, carte seule à gauche → section < 700 px ; carte entière (aucun point rogné). */
@media (min-width:981px){ .ge-section-carte{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); align-items:center; gap:48px; } }
@media (max-width:980px){ .ge-section-carte{ grid-template-columns:minmax(0,1fr); } .ge-section-carte__liste{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.ge-section-carte__titre{ grid-column:1 / -1; margin-bottom:12px; }
.ge-section-carte__carte .ge-carte-panneau{ height:440px; max-height:440px; padding:16px; }
.ge-section-carte__carte .ge-carte-panneau svg.ge-carte-nuit{ width:100%; height:100%; max-width:100%; }
.ge-carte-panneau__paris{ left:16px !important; right:auto; }
@media (max-width:980px){ .ge-section-carte__carte .ge-carte-panneau{ height:380px; } }
/* Tuiles kVA : la photo occupe toute la largeur de la carte. */
.ge-plaque__photo{ margin:0; width:100%; }
.ge-plaque__photo img{ width:100%; }
@media (min-width:1200px){ .ge-section-carte__liste{ grid-template-columns:repeat(4, minmax(0,1fr)); gap:0 20px; } }
section:has(> .ge-conteneur > .ge-section-carte), section:has(> .ge-section-carte){ padding-top:64px !important; padding-bottom:64px !important; }