/* Polices self-hostées : re-dérivation logiciel-gestion-de-formation.fr (habillage réservé
   2026-08-15, famille V8-atlas, police Vidaloka, teinte accent 62). Vidaloka n'a qu'une seule
   graisse (400) et pas d'italique sur Google Fonts : les usages --font-display en
   font-weight:900/italic du socle sont rendus par synthèse navigateur, écart accepté (voir
   BUILD-NOTES §2, aucun gate ne porte dessus). */
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-stretch:100%;
font-display:swap;src:url('./fonts/archivo-variable.woff2') format('woff2');}
@font-face{font-family:'Vidaloka';font-style:normal;font-weight:400;font-stretch:100%;
font-display:swap;src:url('./fonts/vidaloka-regular.woff2') format('woff2');}

/* ==========================================================================
   ATLAS — feuille de thème du parc « revue de territoire »
   --------------------------------------------------------------------------
   TOUT le CSS du pack vit ici (aucun style inline de mise en forme, aucune
   grid-template-columns dans le HTML). Le style inline n'est toléré que pour
   une valeur pilotée par donnée.
   RE-DÉRIVATION PAR MÉTIER : on ne touche QUE le bloc TOKENS ci-dessous.
   Les tokens sont nommés par RÔLE, jamais par couleur.
   ========================================================================== */

/* ---------------------------------------------------------------- TOKENS -- */
:root{
  /* Encres — texte, fonds sombres. Jamais de noir pur. */
  --ink:            oklch(0.255 0.018 218);   /* schiste mouillé */
  --ink-2:          oklch(0.345 0.020 218);   /* encre secondaire, filets sombres */
  --ink-soft:       oklch(0.505 0.014 218);   /* texte atone, légendes */
  /* Papiers — fonds clairs. Jamais de blanc pur. */
  --paper:          oklch(0.972 0.008 88);    /* calcaire — fond de corps */
  --surface:        oklch(0.938 0.012 86);    /* surface — en-tête, pied, alternance */
  --surface-2:      oklch(0.902 0.016 84);    /* surface appuyée, cadres d'image */
  --on-ink:         oklch(0.955 0.010 88);    /* texte sur encre */
  --on-ink-soft:    oklch(0.800 0.014 88);    /* texte atone sur encre */
  /* UN accent. Ici : ambre cartonné (teinte réservée 62, registre-familles.json).
     L=0.520 choisie pour un contraste AA réel avec le texte clair posé dessus
     (mesuré : 5.47:1 au repos, 8+:1 au survol assombri > seuil 4.5:1 — voir G28). */
  --accent:         oklch(0.520 0.130 62);
  --accent-2:       oklch(0.420 0.110 62);    /* survol / états appuyés */
  --accent-wash:    oklch(0.935 0.038 68);    /* aplat très clair d'accent */
  --on-accent:      oklch(0.985 0.008 88);    /* texte CLAIR sur accent (AA vérifié) */
  /* Filets */
  --line:           oklch(0.815 0.020 82);
  --line-2:         oklch(0.878 0.014 82);
  --line-ink:       oklch(0.420 0.018 218);

  /* Typographie — RÔLES. Re-dérivé pour cette niche : Vidaloka (serif display, graisse
     unique 400) + Archivo (sans étroit, inchangé — même exemplaire que V1/V4/V5/V10/V15). */
  --font-display:'Vidaloka',ui-serif,Georgia,serif;      /* serif display, registre guide/référence */
  --font-text:'Archivo',ui-sans-serif,system-ui,sans-serif; /* sans étroit, petites capitales de carte */

  /* Mesures */
  --hdr:76px;                 /* hauteur RÉELLE de l'en-tête fixe (calibrée en dur) */
  --wrap:1280px;
  --wrap-md:1080px;
  --wrap-sm:900px;
  --sec-y:112px;              /* rythme vertical des sections */
  --r:2px;                    /* rayon : quasi nul, registre imprimé */

  /* Carte SVG du parc — on colore, on ne retouche jamais la géométrie */
  --map-land:      oklch(0.902 0.016 84);
  --map-com:       oklch(0.938 0.012 86);
  --map-in:        oklch(0.930 0.032 62);
  --map-page:      oklch(0.860 0.060 58);
  --map-dot-page:  oklch(0.520 0.130 52);
  --map-label:     oklch(0.255 0.018 218);
  --map-muted:     oklch(0.505 0.014 218);
  --map-line:      oklch(0.815 0.020 82);
}

/* ----------------------------------------------------------------- RESET -- */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:hidden;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;overflow-x:hidden;background:var(--paper);color:var(--ink);
  font-family:var(--font-text);font-size:17px;line-height:1.62;font-weight:400;
  font-variant-numeric:tabular-nums;text-wrap:pretty}
img,svg,video{max-width:100%;display:block}
a{color:var(--accent-2);text-decoration:none}
a:hover{color:var(--accent)}
button{font:inherit;color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
p{margin:0 0 1em}
h1,h2,h3,h4,h5,figure,blockquote,dl,dd{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent-wash)}

/* ------------------------------------------------------------ TYPOGRAPHIE -- */
.lgf-h1,.lgf-h2,.lgf-h3,.lgf-h4,.lgf-dsp{font-family:var(--font-display);font-weight:400;
  line-height:1.14;letter-spacing:-0.022em;overflow-wrap:break-word;text-wrap:balance}
.lgf-h1{font-size:clamp(34px,5.4vw,78px)}
.lgf-h2{font-size:clamp(30px,3.9vw,54px);line-height:1.14}
.lgf-h3{font-size:clamp(23px,2.1vw,31px);line-height:1.1;letter-spacing:-0.014em}
.lgf-h4{font-size:clamp(19px,1.4vw,22px);line-height:1.18;letter-spacing:-0.01em}
.lgf-hv{font-weight:900}            /* contraste de graisse : 400 vs 900 dans le même titre */
.lgf-hl{font-weight:400}
.lgf-hi{font-style:italic;font-weight:400}
.lgf-lead{font-size:clamp(17px,1.35vw,20px);line-height:1.66;color:var(--ink-2);max-width:62ch}
.lgf-lead-lg{font-size:clamp(19px,1.6vw,24px);line-height:1.5;color:var(--ink-2);max-width:34ch;
  font-family:var(--font-display);font-weight:400}
.lgf-body-sm{font-size:15.5px;line-height:1.6;color:var(--ink-soft)}
.lgf-prose{max-width:70ch;font-size:18px;line-height:1.72}
.lgf-prose p{margin:0 0 1.15em}
.lgf-prose>p:first-of-type{font-size:20px;line-height:1.62;color:var(--ink-2)}

/* Surtitre : petites capitales espacées + filet */
.lgf-kicker{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:700;
  letter-spacing:0.24em;text-transform:uppercase;color:var(--accent-2);margin:0 0 20px}
.lgf-kicker::after{content:"";flex:0 0 56px;height:1px;background:currentColor;opacity:.5}
.lgf-kicker-c{justify-content:center}
.lgf-kicker-c::before{content:"";flex:0 0 56px;height:1px;background:currentColor;opacity:.5}
.lgf-kicker-plain::after{display:none}
.lgf-on-ink .lgf-kicker,.lgf-bg-ink .lgf-kicker{color:oklch(0.80 0.075 62)}

/* Légende façon carte : petites capitales + filet pointé + distance */
.lgf-mapline{display:flex;align-items:baseline;gap:10px;font-size:11.5px;font-weight:700;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-soft)}
.lgf-mapline .lgf-dots{flex:1 1 auto;border-bottom:1px dotted var(--line);transform:translateY(-4px)}
.lgf-mapline b{font-weight:700;color:var(--ink);letter-spacing:0.08em}
.lgf-bg-ink .lgf-mapline{color:var(--on-ink-soft)}
.lgf-bg-ink .lgf-mapline b{color:var(--on-ink)}
.lgf-bg-ink .lgf-mapline .lgf-dots{border-color:var(--line-ink)}

.lgf-label{font-size:11.5px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--ink-soft)}
.lgf-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:0.18em;
  text-transform:uppercase;padding:5px 9px;border:1px solid var(--line);
  background:var(--paper);color:var(--ink-2)}
.lgf-tag-accent{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.lgf-tag-ink{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}

/* Chiffre de preuve : très grand corps maigre */
.lgf-num{font-family:var(--font-display);font-weight:200;font-size:clamp(40px,4.4vw,64px);
  line-height:0.94;letter-spacing:-0.03em;font-variant-numeric:tabular-nums}
.lgf-num-xl{font-size:clamp(64px,8.5vw,132px);font-weight:200;line-height:0.86}
.lgf-num-sm{font-size:clamp(30px,2.6vw,38px)}
.lgf-num u{text-decoration:none;font-size:.42em;font-weight:400;letter-spacing:0.02em;
  font-family:var(--font-text)}

/* ---------------------------------------------------------------- LAYOUT -- */
.lgf-wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
.lgf-wrap-md{width:100%;max-width:var(--wrap-md);margin:0 auto;padding:0 32px}
.lgf-wrap-sm{width:100%;max-width:var(--wrap-sm);margin:0 auto;padding:0 32px}
.lgf-wrap-xs{width:100%;max-width:720px;margin:0 auto;padding:0 32px}
.lgf-sec{padding:var(--sec-y) 0;position:relative}
.lgf-sec-sm{padding:64px 0;position:relative}
.lgf-sec-xs{padding:40px 0;position:relative}
.lgf-sec-flush{padding:0;position:relative}
/* Page sans hero : dégage l'en-tête fixe (mesurée) */
.lgf-pad-head{padding-top:calc(var(--hdr) + 44px)}

/* Fonds — ALTERNANCE STRICTE. Une seule classe de fond sombre : .bg-ink */
.lgf-bg-paper{background:var(--paper)}
.lgf-bg-surface{background:var(--surface)}
.lgf-bg-wash{background:var(--accent-wash)}
.lgf-bg-ink{background:var(--ink);color:var(--on-ink)}
.lgf-bg-ink .lgf-lead,.lgf-bg-ink .lgf-body-sm,.lgf-bg-ink p{color:var(--on-ink-soft)}
.lgf-bg-ink a{color:oklch(0.86 0.06 62)}
.lgf-bg-ink .lgf-tag{background:transparent;border-color:var(--line-ink);color:var(--on-ink)}
.lgf-rule-t{border-top:1px solid var(--line)}
.lgf-rule-b{border-bottom:1px solid var(--line)}
.lgf-bg-ink.lgf-rule-t,.lgf-bg-ink.lgf-rule-b{border-color:var(--line-ink)}

/* Texte posé sur photo — mêmes inversions que .bg-ink (le surtitre en accent sombre
   sur un voile sombre est le défaut n°1 : il est traité ici, pas au cas par cas). */
.lgf-on-photo{color:var(--on-ink)}
.lgf-on-photo .lgf-h1,.lgf-on-photo .lgf-h2,.lgf-on-photo .lgf-h3{color:var(--on-ink)}
.lgf-on-photo .lgf-kicker{color:oklch(0.80 0.075 62)}
.lgf-on-photo .lgf-lead,.lgf-on-photo p,.lgf-on-photo .lgf-body-sm{color:var(--on-ink)}
.lgf-on-photo .lgf-label{color:var(--on-ink-soft)}
.lgf-on-photo .lgf-mapline{color:var(--on-ink-soft)}
.lgf-on-photo .lgf-mapline b{color:var(--on-ink)}
.lgf-on-photo .lgf-mapline .lgf-dots{border-color:var(--line-ink)}
.lgf-on-photo .lgf-tag{background:transparent;border-color:oklch(0.80 0.014 88 / .55);color:var(--on-ink)}
.lgf-on-photo .lgf-lnk{color:var(--on-ink);border-color:oklch(0.80 0.075 62)}
.lgf-on-photo .lgf-cartouche{background:color-mix(in oklab,var(--ink) 72%,transparent);border-color:var(--line-ink)}
.lgf-on-photo .lgf-cartouche dt{color:var(--on-ink-soft)}
.lgf-on-photo .lgf-cartouche dd{color:var(--on-ink)}
.lgf-on-photo .lgf-ph-brief{color:var(--ink-2)}

/* Trait d'accent en bord extrême (haut de page / bas de pied) */
.lgf-edge{height:3px;background:var(--accent);width:100%}

/* ---------------------------------------------------------------- GRILLES --
   Aucune grille en attribut style : tout se replie ici. */
.lgf-g2,.lgf-g3,.lgf-g4,.lgf-g5,.lgf-g-2-1,.lgf-g-1-2,.lgf-g-side,.lgf-g-tight,.lgf-g-gal,.lgf-g-foot{display:grid;gap:32px}
.lgf-g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.lgf-g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.lgf-g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.lgf-g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.lgf-g-2-1{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.lgf-g-1-2{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.lgf-g-side{grid-template-columns:minmax(0,1fr) minmax(0,300px)}
.lgf-g-art{display:grid;gap:48px;grid-template-columns:minmax(0,260px) minmax(0,1fr)}
.lgf-g-tight{grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:1px}
.lgf-g-gal{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.lgf-g-foot{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.lgf-gap-lg{gap:56px}
.lgf-gap-sm{gap:16px}
.lgf-gap-0{gap:0}
.lgf-al-c{align-items:center}
.lgf-al-e{align-items:end}
.lgf-cols2{columns:2;column-gap:44px}
.lgf-stack{display:flex;flex-direction:column;gap:18px}
.lgf-stack-sm{display:flex;flex-direction:column;gap:10px}
.lgf-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.lgf-row-btn{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:34px}
.lgf-between{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end;justify-content:space-between}
.lgf-mt-0{margin-top:0}.lgf-mt-s{margin-top:14px}.lgf-mt-m{margin-top:28px}.lgf-mt-l{margin-top:52px}
.lgf-tc{text-align:center}
.lgf-row-c{justify-content:center}
.lgf-mx-auto{margin-left:auto;margin-right:auto}

/* ---------------------------------------------------------------- BOUTONS --
   Le libellé est toujours en fort contraste. Aucun motif décoratif dessus. */
.lgf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-text);font-size:14px;font-weight:800;letter-spacing:0.13em;
  text-transform:uppercase;padding:17px 30px;border:1px solid transparent;border-radius:var(--r);
  cursor:pointer;text-align:center;
  transition:background-color .22s ease,color .22s ease,letter-spacing .22s ease,border-color .22s ease}
.lgf-btn:hover{letter-spacing:0.19em}
.lgf-btn-primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.lgf-btn-primary:hover{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.lgf-btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink-2)}
.lgf-btn-ghost:hover{background:var(--ink);color:var(--on-ink)}
.lgf-btn-sm{padding:12px 20px;font-size:12.5px}
.lgf-btn-wide{width:100%}
/* Sur fond sombre : le plein s'INVERSE (fond clair, texte encre) — il garde sa FORME.
   Convention : toute section sombre porte .bg-ink. */
.lgf-bg-ink .lgf-btn-primary,.lgf-on-photo .lgf-btn-primary{background:var(--on-ink);color:var(--ink);border-color:var(--on-ink)}
.lgf-bg-ink .lgf-btn-primary:hover,.lgf-on-photo .lgf-btn-primary:hover{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.lgf-bg-ink .lgf-btn-ghost,.lgf-on-photo .lgf-btn-ghost{color:var(--on-ink);border-color:oklch(0.80 0.014 88 / .62)}
.lgf-bg-ink .lgf-btn-ghost:hover,.lgf-on-photo .lgf-btn-ghost:hover{background:var(--on-ink);color:var(--ink);border-color:var(--on-ink)}
/* Lien fléché — pour la navigation, jamais pour une conversion */
.lgf-lnk{display:inline-flex;align-items:baseline;gap:8px;font-size:13px;font-weight:800;
  letter-spacing:0.15em;text-transform:uppercase;color:var(--ink);
  border-bottom:1px solid var(--accent);padding-bottom:3px;transition:gap .2s ease,color .2s ease}
.lgf-lnk:hover{gap:14px;color:var(--accent-2)}
.lgf-bg-ink .lgf-lnk{color:var(--on-ink);border-color:oklch(0.80 0.075 62)}
.lgf-reassure{font-size:13px;line-height:1.5;color:var(--ink-soft);margin:14px 0 0;max-width:46ch}
.lgf-bg-ink .lgf-reassure,.lgf-on-photo .lgf-reassure{color:var(--on-ink-soft)}

/* ------------------------------------------------- EMPLACEMENTS D'IMAGE --
   Cadre d'image : TOUJOURS une hauteur résoluble (aspect-ratio ou inset:0). */
.lgf-ph{position:relative;display:block;overflow:hidden;background:var(--surface-2);
  border:1px solid var(--line)}
.lgf-ph::before{content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(135deg,transparent 0 13px,oklch(0.86 0.02 84) 13px 14px)}
.lgf-ph>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lgf-ph-brief{position:absolute;inset:0;display:flex;align-items:flex-end;padding:14px;
  font-size:11px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ink-2);line-height:1.5}
.lgf-ph-brief span{background:var(--paper);border:1px solid var(--line);padding:6px 9px;max-width:100%}
.lgf-ph-16x9{aspect-ratio:16/9}
.lgf-ph-4x3{aspect-ratio:4/3}
.lgf-ph-1x1{aspect-ratio:1/1}
.lgf-ph-3x4{aspect-ratio:3/4}
.lgf-ph-tall{aspect-ratio:5/7}
.lgf-ph-fill{position:absolute;inset:0;aspect-ratio:auto}
.lgf-ph-clear{background:oklch(0.955 0.012 90)}          /* photo CLAIRE : cas d'épreuve du voile */
.lgf-ph-clear::before{background:repeating-linear-gradient(135deg,transparent 0 13px,oklch(0.90 0.014 90) 13px 14px)}
.lgf-zoom{overflow:hidden}
.lgf-zoom>img,.lgf-zoom>.lgf-ph::before{transition:transform .5s ease}
a:hover>.lgf-zoom>img,.lgf-card:hover .lgf-zoom>img,.lgf-card:hover .lgf-zoom>.lgf-ph::before{transform:scale(1.04)}
figcaption{margin-top:12px;font-size:13px;line-height:1.5;color:var(--ink-soft)}
figcaption b{color:var(--ink);font-weight:700}

/* ---------------------------------------------------------------- EN-TÊTE -- */
.lgf-site-head{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--hdr);
  border-bottom:1px solid transparent;transition:background-color .28s ease,border-color .28s ease}
/* En-tête OPAQUE dans les deux états (re-dérivation logiciel-gestion-de-formation.fr, écart au
   socle qui utilisait un fond translucide color-mix() : un fond composité avec la photo derrière
   n'est pas mesurable de façon fiable par un auditeur de contraste automatique — l'opacité pleine
   lève l'ambiguïté sans changer la mécanique de bascule .lgf-is-solid). */
.lgf-site-head{background:var(--ink)}
.lgf-site-head.lgf-is-solid{background:var(--surface);border-bottom-color:var(--line)}
.lgf-head-in{height:100%;display:flex;align-items:center;gap:34px;
  width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
.lgf-logo{display:flex;flex-direction:column;line-height:1;margin-right:auto;flex:0 0 auto}
.lgf-logo b{font-family:var(--font-display);font-size:22px;font-weight:900;letter-spacing:-0.02em;
  color:var(--on-ink)}
.lgf-logo i{font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:0.26em;
  text-transform:uppercase;color:oklch(0.82 0.05 62);margin-top:5px}
.lgf-is-solid .lgf-logo b{color:var(--ink)}
.lgf-is-solid .lgf-logo i{color:var(--accent-2)}
.lgf-nav{display:flex;align-items:stretch;gap:30px;height:100%}
.lgf-nav>li{position:relative;display:flex;align-items:center}
.lgf-nav a,.lgf-nav button{display:flex;align-items:center;gap:7px;font-size:16px;font-weight:700;
  letter-spacing:0.005em;color:var(--on-ink);text-decoration:none;background:none;border:0;
  padding:0;cursor:pointer;white-space:nowrap}
.lgf-is-solid .lgf-nav a,.lgf-is-solid .lgf-nav button{color:var(--ink)}
.lgf-nav a:hover,.lgf-nav button:hover{color:oklch(0.86 0.075 62)}
.lgf-is-solid .lgf-nav a:hover,.lgf-is-solid .lgf-nav button:hover{color:var(--accent-2)}
.lgf-caret{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg);opacity:.7}
.lgf-head-tel{font-family:var(--font-display);font-size:19px;font-weight:900;color:var(--on-ink);
  letter-spacing:-0.01em;white-space:nowrap}
.lgf-is-solid .lgf-head-tel{color:var(--ink)}
.lgf-head-cta{flex:0 0 auto}
.lgf-head-cta .lgf-btn{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.lgf-head-cta .lgf-btn:hover{background:var(--on-ink);color:var(--ink);border-color:var(--on-ink)}
.lgf-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;
  background:none;border:1px solid oklch(0.80 0.014 88 / .5);border-radius:var(--r);cursor:pointer}
.lgf-burger i{display:block;width:20px;height:1.5px;background:var(--on-ink);position:relative}
.lgf-burger i::before,.lgf-burger i::after{content:"";position:absolute;left:0;width:20px;height:1.5px;
  background:var(--on-ink)}
.lgf-burger i::before{top:-6px}.lgf-burger i::after{top:6px}
.lgf-is-solid .lgf-burger{border-color:var(--line)}
.lgf-is-solid .lgf-burger i,.lgf-is-solid .lgf-burger i::before,.lgf-is-solid .lgf-burger i::after{background:var(--ink)}

/* Méga-menu — largeur BORNÉE, 3 colonnes courtes + panneau d'appel latéral */
.lgf-mega{display:none;position:absolute;top:100%;right:-24px;width:min(752px,calc(100vw - 56px));
  background:var(--paper);border:1px solid var(--line);
  box-shadow:0 26px 60px -30px oklch(0.255 0.018 218 / .40);
  grid-template-columns:minmax(0,1fr) minmax(0,240px);gap:0;overflow:hidden}
.lgf-nav>li:hover>.lgf-mega,.lgf-nav>li:focus-within>.lgf-mega{display:grid}
.lgf-mega-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;padding:28px 30px}
.lgf-mega-grp>.lgf-label{display:block;padding-bottom:9px;border-bottom:1px solid var(--line);
  margin-bottom:12px;color:var(--accent-2)}
.lgf-mega-grp li+li{margin-top:11px}
.lgf-mega-grp a{display:block;font-size:15px;font-weight:700;color:var(--ink);line-height:1.3}
.lgf-mega-grp a span{display:block;font-size:12.5px;font-weight:400;color:var(--ink-soft);margin-top:3px;
  letter-spacing:0}
.lgf-mega-grp a:hover{color:var(--accent-2)}
.lgf-mega-cta{background:var(--ink);color:var(--on-ink);padding:28px 26px;display:flex;
  flex-direction:column;justify-content:flex-end;gap:14px}
.lgf-mega-cta p{font-family:var(--font-display);font-size:21px;line-height:1.14;color:var(--on-ink);margin:0}

/* Volet de navigation mobile (vrai menu de pages, jamais le formulaire) */
.lgf-mnav{position:fixed;inset:0;z-index:90;display:none}
.lgf-mnav.lgf-is-open{display:block}
.lgf-mnav-bd{position:absolute;inset:0;background:color-mix(in oklab,var(--ink) 60%,transparent);border:0}
.lgf-mnav-pan{position:absolute;top:0;right:0;bottom:0;width:min(340px,88vw);background:var(--paper);
  border-left:3px solid var(--accent);padding:22px 24px 30px;overflow-y:auto}
.lgf-mnav-pan .lgf-label{display:block;margin:26px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--line);
  color:var(--accent-2)}
.lgf-mnav-pan a{display:block;padding:11px 0;font-size:17px;font-weight:700;color:var(--ink);
  border-bottom:1px solid var(--line-2)}
.lgf-mnav-x{position:absolute;top:16px;right:18px;width:44px;height:44px;border:1px solid var(--line);
  background:var(--paper);cursor:pointer;font-size:20px;line-height:1}

/* ------------------------------------------------------------------- HERO --
   Mode B : photo pleine largeur, texte posé dessus. */
.lgf-hero{position:relative;isolation:isolate;min-height:clamp(620px,86vh,880px);
  display:flex;align-items:flex-end;
  padding-top:calc(var(--hdr) + 40px);padding-bottom:0;background:var(--ink)}
.lgf-hero-ph{position:absolute;inset:0;z-index:-2;border:0;overflow:hidden}
.lgf-hero-ph::before{background:repeating-linear-gradient(135deg,transparent 0 22px,oklch(0.90 0.014 90) 22px 24px)}
/* Ajout du site : le socle ne fournit pas de règle de calage pour une VRAIE balise <img> dans
   .hero-ph (photo de contenu indexable, jamais un fond CSS — G-IMG-BALISE). Sans cette règle,
   l'image hérite de ses attributs width/height bruts (1920x1071) au lieu d'épouser le cadre du
   hero, débordant sur la section suivante (chevauchement constaté G39). */
.lgf-hero-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* VOILE en DEUX couches, calibré contre une photo CLAIRE (pire cas = blanc) :
   1. .veil  — voile plat sur toute la photo (profondeur, pas de lisibilité)
   2. .hero-band — plaque dégradée qui SUIT la hauteur du bloc de texte : le texte
      vit toujours dans la zone à ~0,93 d'encre, quelle que soit sa hauteur.
   Cumul dans la zone de texte : 1-(1-0,50)(1-0,93) = 0,965 → ≥ 7:1 sur photo blanche. */
.lgf-veil{position:absolute;inset:0;z-index:-1;
  background:color-mix(in oklab,var(--ink) 50%,transparent)}
.lgf-hero-band{position:relative;width:100%;padding:96px 0 56px;
  background:linear-gradient(to top,
    color-mix(in oklab,var(--ink) 93%,transparent) 0%,
    color-mix(in oklab,var(--ink) 93%,transparent) 74%,
    color-mix(in oklab,var(--ink) 62%,transparent) 90%,
    transparent 100%)}
.lgf-hero-in{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
.lgf-hero-txt{max-width:19ch}
.lgf-hero .lgf-h1{color:var(--on-ink)}
.lgf-hero .lgf-lead{color:var(--on-ink);max-width:52ch;font-size:clamp(17px,1.3vw,19.5px)}
.lgf-hero-meta{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px}
.lgf-hero-meta .lgf-mapline,.lgf-step-meta .lgf-mapline{min-width:210px}
.lgf-hero-cred{position:absolute;right:32px;bottom:14px;font-size:10px;letter-spacing:0.16em;
  text-transform:uppercase;color:oklch(0.80 0.014 88 / .72);z-index:1}

/* Bande de preuve chiffrée */
.lgf-proof{border-top:1px solid var(--line-ink);margin-top:44px;padding-top:26px}
.lgf-proof .lgf-g-tight{gap:0}
.lgf-proof-i{padding:6px 22px 6px 0;border-left:1px solid var(--line-ink);padding-left:22px}
.lgf-proof-i:first-child{border-left:0;padding-left:0}
.lgf-proof-i .lgf-num{color:var(--on-ink);font-size:clamp(34px,3vw,46px)}
.lgf-proof-i .lgf-label{color:var(--on-ink-soft);margin-top:8px;display:block;line-height:1.45}
/* Bande de repères sur papier */
.lgf-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:1px;
  background:var(--line)}
.lgf-band-i{background:var(--surface);padding:22px 20px}
.lgf-bg-surface .lgf-band-i{background:var(--paper)}
.lgf-band-i .lgf-num-sm{display:block;color:var(--accent-2);font-family:var(--font-display);
  font-weight:200;line-height:1;letter-spacing:-0.02em}
.lgf-band-i .lgf-label{display:block;margin-top:9px;line-height:1.45}

/* Fiche chevauchante — remise à plat en mobile, jamais d'image rognée */
.lgf-over{position:relative}
.lgf-over-card{position:relative;z-index:1;background:var(--paper);border:1px solid var(--line);
  padding:30px 32px;margin:-88px 0 0 64px;width:calc(100% - 128px)}
.lgf-bg-ink .lgf-over-card{background:var(--ink);border-color:var(--line-ink)}
/* Ligne de formulaire courte (bulletin) */
.lgf-row-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start}
@media (max-width:640px){
  .lgf-over-card{margin:20px 0 0;width:100%;padding:22px 20px}
  .lgf-row-form{grid-template-columns:minmax(0,1fr)}
}

/* ------------------------------------------------- HERO MODE A (formulaire) --
   Ordre de lecture mobile : titre + accroche, PUIS le formulaire, PUIS la photo.
   Desktop : la photo repasse à gauche via order. */
.lgf-hero-a{position:relative;padding-top:calc(var(--hdr) + 40px);padding-bottom:60px}
.lgf-hero-a-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:48px;
  align-items:center}
.lgf-ha-ph{order:-1;position:relative;aspect-ratio:4/5}
.lgf-ha-col{display:flex;flex-direction:column;gap:22px}

/* Article : sommaire latéral, encadré auteur, appel à l'action au fil du texte */
.lgf-toc{position:sticky;top:calc(var(--hdr) + 26px);border-left:2px solid var(--accent);
  padding-left:16px}
.lgf-toc li+li{margin-top:9px}
.lgf-toc a{display:block;font-size:14px;line-height:1.35;color:var(--ink-2)}
.lgf-toc a:hover{color:var(--accent-2)}
.lgf-authbox{display:grid;grid-template-columns:110px minmax(0,1fr);gap:24px;align-items:start;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;margin:44px 0}
.lgf-pull{font-family:var(--font-display);font-size:clamp(21px,2.1vw,29px);line-height:1.26;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;margin:32px 0;
  color:var(--ink)}
.lgf-meta-art{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
@media (max-width:900px){
  .lgf-hero-a-in{grid-template-columns:minmax(0,1fr);gap:26px}
  .lgf-ha-ph{order:0;aspect-ratio:16/9}
  .lgf-toc{position:static;border-left:0;border-top:1px solid var(--line);padding:16px 0 0}
}
@media (max-width:860px){
  .lgf-hero-a{padding-top:calc(var(--hdr) + 22px);padding-bottom:36px}
}
@media (max-width:640px){
  .lgf-hero-a .lgf-form{grid-template-columns:repeat(2,minmax(0,1fr))}  /* le bouton reste dans le 1er écran */
  /* Compactage mesuré du hero mode A : le bouton d'envoi doit être visible à 390×844 */
  .lgf-hero-a{padding-top:calc(var(--hdr) + 18px);padding-bottom:28px}
  .lgf-hero-a-in{gap:18px}
  .lgf-hero-a .lgf-ha-col{gap:16px}
  .lgf-hero-a .lgf-form{gap:12px}
  .lgf-hero-a .lgf-lead{font-size:16px;line-height:1.5}
  .lgf-hero-a .lgf-picks{gap:8px}
  .lgf-hero-a .lgf-pick{padding:10px 12px;font-size:13px}
  .lgf-hero-a .lgf-pick span{display:none}
  .lgf-hero-a .lgf-input{padding:11px 13px}
  .lgf-authbox{grid-template-columns:minmax(0,1fr);gap:14px}
}

/* ------------------------------------------------------------------ CARTES -- */
.lgf-card{background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
.lgf-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px -22px oklch(0.255 0.018 218 / .45);
  border-color:var(--ink-soft)}
.lgf-card-b{padding:24px 24px 26px;display:flex;flex-direction:column;gap:12px;flex:1 1 auto}
.lgf-card-b .lgf-h4{margin:0}
.lgf-card-ft{margin-top:auto;padding-top:18px;border-top:1px solid var(--line-2);
  display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.lgf-price{font-family:var(--font-display);font-weight:900;font-size:24px;letter-spacing:-0.02em;
  white-space:nowrap}
.lgf-price small{font-family:var(--font-text);font-size:11px;font-weight:700;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:2px}
.lgf-ticks li{position:relative;padding-left:22px;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.lgf-ticks li+li{margin-top:8px}
.lgf-ticks li::before{content:"";position:absolute;left:0;top:7px;width:9px;height:5px;
  border-left:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
  transform:rotate(-45deg)}
.lgf-badge-on{position:absolute;left:14px;top:14px;z-index:2}
.lgf-badge-on.lgf-br{left:auto;right:14px}
.lgf-card-flat{background:var(--paper);border:1px solid var(--line);padding:28px 26px}
.lgf-card-ink{background:var(--ink);color:var(--on-ink);padding:34px 32px}

/* Cartouche de données — signature de la famille */
.lgf-cartouche{border:1px solid var(--line);background:var(--surface);padding:20px 22px}
.lgf-bg-surface .lgf-cartouche{background:var(--paper)}
.lgf-bg-ink .lgf-cartouche{background:color-mix(in oklab,var(--on-ink) 8%,transparent);border-color:var(--line-ink)}
.lgf-cartouche dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px;margin:0}
.lgf-cartouche dt{font-size:10.5px;font-weight:700;letter-spacing:0.19em;text-transform:uppercase;
  color:var(--ink-soft)}
.lgf-cartouche dd{margin:3px 0 0;font-family:var(--font-display);font-size:19px;font-weight:900;
  letter-spacing:-0.015em;overflow-wrap:break-word}
/* Fix rapatriement : un token sans espace (adresse e-mail) dans une colonne dl à 2 voies
   déborde de sa case (scrollWidth 195px pour une case de 146px) sans overflow-wrap — la
   boîte de l'élément restait mesurée à 146px (rect inchangé), seul le TEXTE peignait hors
   cadre : invisible à un contrôle par bounding rect, révélé par le test scrollWidth du
   BLOC 9. Repéré sur "bonjour@exemple.fr" (cartouche coordonnées, 390px). */
.lgf-bg-ink .lgf-cartouche dt{color:var(--on-ink-soft)}
.lgf-bg-ink .lgf-cartouche dd{color:var(--on-ink)}

/* Étapes / itinéraire (jour 1, jour 2…) */
.lgf-steps{display:grid;gap:0}
.lgf-step{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:34px;
  padding:34px 0;border-top:1px solid var(--line)}
.lgf-step:last-child{border-bottom:1px solid var(--line)}
.lgf-bg-ink .lgf-step{border-color:var(--line-ink)}
.lgf-step-n{font-family:var(--font-display);font-weight:200;font-size:clamp(46px,5vw,76px);
  line-height:0.9;letter-spacing:-0.03em;color:var(--accent)}
.lgf-bg-ink .lgf-step-n{color:oklch(0.80 0.075 62)}
.lgf-step-b .lgf-h4{margin-bottom:10px}
.lgf-step-meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:14px}

/* ------------------------------------------- COMPOSITIONS ALTERNATIVES (B) --
   Deuxième composition de certains rôles : l'anti-empreinte de la famille.
   Mêmes tokens, même anatomie de contenu, silhouette différente. */
.lgf-rowlist{border-top:1px solid var(--line)}
.lgf-rowlist>li{display:grid;grid-template-columns:124px minmax(0,1fr) auto;gap:26px;align-items:center;
  padding:18px 0;border-bottom:1px solid var(--line)}
.lgf-rowlist>li>.lgf-ph,.lgf-rowlist>li>.lgf-zoom{width:124px}
.lgf-rowlist .lgf-ph{aspect-ratio:4/3}
.lgf-aside-nums{display:grid;gap:24px;border-left:1px solid var(--line);padding-left:26px}
.lgf-bg-ink .lgf-aside-nums{border-color:var(--line-ink)}
.lgf-input-line{border:0;border-bottom:1px solid var(--line);background:transparent;border-radius:0;
  padding:11px 2px}
.lgf-bg-ink .lgf-input-line{border-bottom-color:var(--line-ink);background:transparent}
.lgf-quote-xl{font-family:var(--font-display);font-size:clamp(23px,2.9vw,40px);line-height:1.22;
  letter-spacing:-0.02em;font-weight:400}
.lgf-team-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:26px}
.lgf-cta-full{position:relative;isolation:isolate;padding:96px 0;text-align:center}
.lgf-cta-full .lgf-veil{z-index:-1}
@media (max-width:640px){
  .lgf-rowlist>li{grid-template-columns:84px minmax(0,1fr);gap:16px}
  .lgf-rowlist>li .lgf-price{grid-column:2}
  .lgf-aside-nums{border-left:0;border-top:1px solid var(--line);padding:22px 0 0}
  .lgf-cta-full{padding:64px 0}
}

/* -------------------------------------------------------------------- AVIS -- */
.lgf-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(320px,1fr);gap:24px;
  overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;
  scrollbar-width:thin;overscroll-behavior-x:contain}
.lgf-rail>*{scroll-snap-align:start}
.lgf-rail-4{grid-auto-columns:minmax(280px,1fr)}
.lgf-quote{background:var(--paper);border:1px solid var(--line);padding:28px 26px;display:flex;
  flex-direction:column;gap:14px}
.lgf-bg-surface .lgf-quote{background:var(--paper)}
.lgf-stars{font-size:14px;letter-spacing:0.22em;color:var(--accent)}
.lgf-stars i{font-style:normal;color:var(--ink-soft)}
.lgf-quote p{font-family:var(--font-display);font-size:19px;line-height:1.44;color:var(--ink);margin:0}
.lgf-sign{margin-top:auto;padding-top:14px;border-top:1px solid var(--line-2)}
.lgf-rail-hint{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-soft);
  margin-top:6px}

/* ------------------------------------------------------------------- PRIX -- */
.lgf-plist{border-top:1px solid var(--line)}
.lgf-plist>li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 28px;
  align-items:baseline;padding:20px 0;border-bottom:1px solid var(--line)}
.lgf-plist .lgf-h4{margin:0}
.lgf-plist span{font-size:14px;color:var(--ink-soft);display:block;margin-top:5px;max-width:56ch}
.lgf-honesty{margin-top:22px;padding:18px 20px;border-left:3px solid var(--accent);
  background:var(--surface);font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.lgf-bg-surface .lgf-honesty{background:var(--paper)}

/* Tableau dense → cartes empilées sous 640px */
.lgf-tbl{width:100%;border-collapse:collapse;font-size:15px}
.lgf-tbl th,.lgf-tbl td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);
  vertical-align:top}
.lgf-tbl thead th{font-size:11px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-soft);border-bottom:1px solid var(--ink-2)}
.lgf-tbl tbody tr:nth-child(even){background:var(--surface)}

/* ------------------------------------------------------------ FORMULAIRES -- */
.lgf-form{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.lgf-f-full{grid-column:1/-1}
.lgf-field{display:flex;flex-direction:column;gap:7px}
.lgf-field>label{font-size:11px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--ink-soft)}
.lgf-input,.lgf-select,.lgf-ta{font-family:var(--font-text);font-size:16px;line-height:1.4;
  padding:13px 14px;background:var(--paper);color:var(--ink);
  border:1px solid var(--ink-soft);border-radius:var(--r);width:100%}
.lgf-ta{min-height:104px;resize:vertical}
.lgf-select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),
  linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);
  background-position:calc(100% - 19px) 21px,calc(100% - 14px) 21px;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:40px}
.lgf-input:focus,.lgf-select:focus,.lgf-ta:focus{outline:2px solid var(--accent);outline-offset:1px;
  border-color:var(--accent)}
.lgf-bg-ink .lgf-input,.lgf-bg-ink .lgf-select,.lgf-bg-ink .lgf-ta{background:color-mix(in oklab,var(--on-ink) 10%,transparent);
  border-color:var(--line-ink);color:var(--on-ink)}
.lgf-bg-ink .lgf-field>label{color:var(--on-ink-soft)}
.lgf-privacy{font-size:12.5px;line-height:1.55;color:var(--ink-soft)}
.lgf-bg-ink .lgf-privacy{color:var(--on-ink-soft)}
/* Choix de type — tuiles cliquables. Le radio masqué est ANCRÉ (parent relative). */
.lgf-picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.lgf-pick{position:relative;display:block;overflow:hidden;border:1px solid var(--line);
  background:var(--paper);padding:13px 14px;cursor:pointer;font-size:14px;font-weight:700}
.lgf-pick input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;margin:0}
.lgf-pick span{display:block;font-size:12px;font-weight:400;color:var(--ink-soft);margin-top:3px}
.lgf-pick:hover{border-color:var(--ink-soft)}
.lgf-pick:has(input:checked){border-color:var(--accent);background:var(--accent-wash)}
.lgf-pick:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.lgf-bg-ink .lgf-pick{background:color-mix(in oklab,var(--on-ink) 10%,transparent);border-color:var(--line-ink);
  color:var(--on-ink)}
.lgf-bg-ink .lgf-pick span{color:var(--on-ink-soft)}
.lgf-bg-ink .lgf-pick:has(input:checked){background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.lgf-bg-ink .lgf-pick:has(input:checked) span{color:oklch(0.95 0.02 70)}

/* Simulateur */
.lgf-sim-out{background:var(--ink);color:var(--on-ink);padding:30px 30px 34px;display:flex;
  flex-direction:column;gap:8px}
.lgf-sim-out .lgf-num-xl{color:var(--on-ink)}
.lgf-sim-note{font-size:12.5px;color:var(--on-ink-soft);line-height:1.5}

/* ------------------------------------------------------------------- FAQ -- */
.lgf-faq{border-top:1px solid var(--line)}
.lgf-faq details{border-bottom:1px solid var(--line)}
.lgf-faq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;position:relative;
  font-family:var(--font-display);font-size:clamp(19px,1.6vw,23px);font-weight:900;
  letter-spacing:-0.015em;line-height:1.25}
.lgf-faq summary::-webkit-details-marker{display:none}
.lgf-faq summary::after{content:"";position:absolute;right:6px;top:31px;width:12px;height:12px;
  border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);
  transform:rotate(45deg);transition:transform .2s ease}
.lgf-faq details[open] summary::after{transform:rotate(-135deg)}
.lgf-faq .lgf-fa-b{padding:0 44px 24px 0;max-width:74ch;color:var(--ink-2);font-size:16.5px;line-height:1.68}

/* --------------------------------------------------------- ZONE & COMMUNES -- */
.lgf-comlist{columns:3;column-gap:34px;font-size:15.5px}
.lgf-comlist li{break-inside:avoid;padding:8px 0;border-bottom:1px dotted var(--line);
  display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.lgf-comlist li b{font-weight:400;color:var(--ink-soft);font-size:12.5px;letter-spacing:0.1em}
/* Commune AVEC page : le NOM est le lien. Sans page : texte atone, sans bord ni fond. */
.lgf-comlist a{color:var(--ink);font-weight:700;border-bottom:1px solid var(--accent);padding-bottom:1px}
.lgf-comlist a:hover{color:var(--accent-2)}
.lgf-comlist span.lgf-atone{color:var(--ink-2)}
.lgf-mapbox{border:1px solid var(--line);background:var(--surface);padding:18px}
.lgf-mapbox svg{width:100%;height:auto}
.lgf-map-todo{aspect-ratio:4/3;display:flex;flex-direction:column;justify-content:center;gap:12px;
  padding:28px;text-align:left}
.lgf-map-todo code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  line-height:1.7;color:var(--ink-2);background:var(--paper);border:1px solid var(--line);
  padding:12px 14px;display:block;overflow-wrap:break-word}

/* ------------------------------------------------------------- FIL D'ARIANE -- */
.lgf-crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12px;font-weight:700;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-soft)}
.lgf-crumb a{color:var(--ink-soft)}
.lgf-crumb a:hover{color:var(--accent-2)}
.lgf-crumb i{font-style:normal;opacity:.55}
.lgf-on-photo .lgf-crumb,.lgf-on-photo .lgf-crumb a{color:var(--on-ink-soft)}

/* ------------------------------------------------------------------- PIED -- */
.lgf-foot{background:var(--surface);border-top:1px solid var(--line);padding:74px 0 0}
.lgf-foot .lgf-label{display:block;color:var(--accent-2);padding-bottom:10px;
  border-bottom:1px solid var(--line);margin-bottom:14px}
.lgf-foot li+li{margin-top:9px}
.lgf-foot a{font-size:15px;color:var(--ink-2)}
.lgf-foot a:hover{color:var(--accent-2)}
.lgf-foot-art{display:flex;gap:12px;align-items:flex-start}
.lgf-foot-art .lgf-ph{flex:0 0 64px;width:64px;height:48px;aspect-ratio:auto}
.lgf-foot-art a{font-weight:700;color:var(--ink);font-size:14.5px;line-height:1.35;display:block}
.lgf-foot-art time{display:block;font-size:11px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink-soft);margin-top:4px}
.lgf-legal{margin-top:60px;border-top:1px solid var(--line);padding:20px 0 22px;display:flex;
  flex-wrap:wrap;gap:10px 28px;align-items:center;justify-content:space-between;
  font-size:12.5px;color:var(--ink-soft)}
.lgf-legal ul{display:flex;flex-wrap:wrap;gap:8px 20px}
.lgf-legal a{font-size:12.5px;color:var(--ink-soft)}

/* -------------------------------------------------- VOLET DE CAPTURE LONG -- */
.lgf-tab-v{position:fixed;right:0;top:52%;z-index:55;transform:translateY(-50%);
  writing-mode:vertical-rl;background:var(--ink);color:var(--on-ink);border:0;
  border-left:3px solid var(--accent);padding:18px 12px;font-size:12px;font-weight:800;
  letter-spacing:0.2em;text-transform:uppercase;cursor:pointer}
.lgf-tab-v:hover{background:var(--accent);border-color:var(--ink)}
.lgf-drawer{position:fixed;inset:0;z-index:95;display:none}
.lgf-drawer.lgf-is-open{display:block}
.lgf-drawer-bd{position:absolute;inset:0;background:color-mix(in oklab,var(--ink) 62%,transparent);border:0}
.lgf-drawer-pan{position:absolute;top:0;right:0;bottom:0;width:min(520px,94vw);background:var(--paper);
  border-left:3px solid var(--accent);padding:28px 30px 40px;overflow-y:auto}
.lgf-drawer-x{position:absolute;top:16px;right:18px;width:44px;height:44px;border:1px solid var(--line);
  background:var(--paper);cursor:pointer;font-size:20px;line-height:1}

/* ------------------------------------------------------ BARRE FIXE MOBILE -- */
.lgf-mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);
  border-top:1px solid var(--line)}
.lgf-mbar a{display:flex;align-items:center;justify-content:center;padding:16px 8px;font-size:13px;
  font-weight:800;letter-spacing:0.14em;text-transform:uppercase}
.lgf-mbar .lgf-m-call{background:var(--surface);color:var(--ink)}
.lgf-mbar .lgf-m-cta{background:var(--accent);color:var(--on-accent)}

/* Utilitaires de visibilité */
.lgf-only-mob{display:none}
.lgf-no-mob{display:initial}

/* ======================================================== REPLIS RESPONSIVE */
@media (max-width:1180px){
  .lgf-nav{gap:20px}
  .lgf-head-tel{display:none}
}
@media (max-width:1040px){
  .lgf-head-in{gap:20px}
  .lgf-nav{gap:15px}
  .lgf-nav a,.lgf-nav button{font-size:15px}
  .lgf-head-cta .lgf-btn{padding:13px 15px;font-size:11.5px;letter-spacing:0.1em}
}
@media (max-width:980px){
  .lgf-head-cta{display:none}       /* place insuffisante : le menu reste, la capture revient plus bas */
}
@media (max-width:1024px){
  :root{--sec-y:88px}
  .lgf-g4,.lgf-g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lgf-g-art{grid-template-columns:minmax(0,1fr);gap:32px}
  .lgf-comlist{columns:2}
  .lgf-g-foot{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
}
@media (max-width:900px){
  .lgf-g2,.lgf-g-2-1,.lgf-g-1-2,.lgf-g-side{grid-template-columns:minmax(0,1fr)}
  .lgf-g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lgf-gap-lg{gap:34px}
  .lgf-cols2{columns:1}
  .lgf-step{grid-template-columns:minmax(0,90px) minmax(0,1fr);gap:20px}
}
/* Bascule mobile : en-tête à burger, barre fixe basse, pas de doublon de capture */
@media (max-width:860px){
  :root{--hdr:62px}
  .lgf-nav,.lgf-head-cta,.lgf-head-tel{display:none!important}   /* AUCUN bouton de capture dans l'en-tête mobile */
  .lgf-burger{display:flex}
  .lgf-tab-v{display:none}                                /* la barre fixe basse suffit */
  .lgf-mbar{display:grid}
  body{padding-bottom:56px}
  .lgf-hero{min-height:auto;padding-top:calc(var(--hdr) + 34px)}
  .lgf-hero-band{padding:56px 0 40px}
  /* Fix rapatriement : logo à enseigne longue ("Cévennes au long cours") + flex-shrink:0
     poussait head-in à 398px sur un viewport de 390px (défilement horizontal, BLOC 9 pt.1).
     flex:0 0 auto empêchait tout repli ; on autorise ici le retrait + le passage à la ligne. */
  .lgf-logo{flex:1 1 auto;min-width:0;margin-right:12px}
  .lgf-logo b{font-size:17px;white-space:normal;overflow-wrap:break-word}
  .lgf-logo i{white-space:normal}
}
@media (max-width:640px){
  :root{--sec-y:64px}
  .lgf-g3,.lgf-g-gal{grid-template-columns:minmax(0,1fr)}
  .lgf-wrap,.lgf-wrap-md,.lgf-wrap-sm,.lgf-wrap-xs,.lgf-hero-in,.lgf-head-in{padding-left:18px;padding-right:18px}
  .lgf-comlist{columns:1}
  .lgf-g-foot{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
  .lgf-form{grid-template-columns:minmax(0,1fr)}
  .lgf-cartouche dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
  .lgf-step{grid-template-columns:minmax(0,1fr);gap:6px;padding:24px 0}
  .lgf-step-n{font-size:38px}
  /* Voile mobile : le bloc de texte remonte dans le dégradé → on assombrit les deux couches */
  .lgf-veil{background:color-mix(in oklab,var(--ink) 58%,transparent)}
  .lgf-hero-band{padding:44px 0 36px;background:linear-gradient(to top,
    color-mix(in oklab,var(--ink) 95%,transparent) 0%,
    color-mix(in oklab,var(--ink) 95%,transparent) 84%,
    color-mix(in oklab,var(--ink) 72%,transparent) 95%,
    transparent 100%)}
  .lgf-hero-txt{max-width:none}
  .lgf-hero-cred{right:18px}
  .lgf-proof-i{padding:14px 14px 14px 0;border-left:0;border-top:1px solid var(--line-ink)}
  .lgf-proof-i:first-child,.lgf-proof-i:nth-child(2){border-top:0}
  .lgf-proof-i:nth-child(even){padding-left:14px;border-left:1px solid var(--line-ink)}
  /* Tableau dense → cartes empilées, étiquette par cellule */
  .lgf-tbl thead{display:none}
  .lgf-tbl,.lgf-tbl tbody,.lgf-tbl tr,.lgf-tbl td{display:block;width:100%}
  .lgf-tbl tr{border:1px solid var(--line);margin-bottom:14px;background:var(--paper)}
  .lgf-tbl tbody tr:nth-child(even){background:var(--paper)}
  .lgf-tbl td{border-bottom:1px dotted var(--line);padding:11px 14px}
  .lgf-tbl td:last-child{border-bottom:0}
  .lgf-tbl td::before{content:attr(data-th);display:block;font-size:10.5px;font-weight:700;
    letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:4px}
  .lgf-plist>li{grid-template-columns:minmax(0,1fr)}
  .lgf-legal{margin-top:44px}
  .lgf-only-mob{display:initial}
  .lgf-card-ink{padding:26px 22px}
}
@media (max-width:560px){
  /* Cartes composites (image + liste) → 1 colonne. Items COURTS : 2 par ligne (g-tight, band). */
  .lgf-g2,.lgf-g3,.lgf-g4,.lgf-g5,.lgf-g-gal{grid-template-columns:minmax(0,1fr)}
  .lgf-g-tight,.lgf-band{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lgf-picks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lgf-mega{display:none}
}
@media (max-width:420px){
  .lgf-g-foot{grid-template-columns:minmax(0,1fr)}
  .lgf-band-i{padding:16px 14px}
}
@media print{
  .lgf-site-head,.lgf-mbar,.lgf-tab-v,.lgf-drawer,.lgf-mnav{display:none!important}
  body{padding-bottom:0}
}

/* =============================================== PLANCHES D'ATELIER (hors site)
   Utilitaires réservés aux planches de composants et de variantes.
   Aucune page du site ne les utilise. */
.lgf-spec{border:1px solid var(--line);background:var(--paper);padding:0;overflow:hidden}
.lgf-spec-hd{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:baseline;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--line);background:var(--surface)}
.lgf-spec-hd b{font-family:var(--font-display);font-size:19px;font-weight:900;letter-spacing:-0.015em}
.lgf-spec-bd{padding:26px 22px}
.lgf-spec-bd.lgf-flush{padding:0}
.lgf-spec .lgf-site-head{position:static}          /* l'en-tête est montrée en spécimen, pas fixée */
.lgf-spec .lgf-hero{min-height:420px}
.lgf-spec .lgf-tab-v,.lgf-spec .lgf-mbar{position:static;transform:none;display:flex}
.lgf-spec-note{font-size:13px;line-height:1.55;color:var(--ink-soft);padding:0 18px 16px}
.lgf-spec-note b{color:var(--ink)}
.lgf-state{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.lgf-state-lab{font-size:10.5px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--ink-soft);width:100%}
.lgf-demo-hover.lgf-btn-primary{background:var(--ink);border-color:var(--ink);color:var(--on-ink);letter-spacing:0.19em}
.lgf-bg-ink .lgf-demo-hover.lgf-btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.lgf-demo-hover.lgf-btn-ghost{background:var(--ink);color:var(--on-ink);letter-spacing:0.19em}
.lgf-bg-ink .lgf-demo-hover.lgf-btn-ghost{background:var(--on-ink);color:var(--ink);border-color:var(--on-ink)}
.lgf-demo-focus{outline:2px solid var(--accent);outline-offset:3px}
.lgf-demo-hover.lgf-card{transform:translateY(-4px);box-shadow:0 16px 34px -22px oklch(0.255 0.018 218 / .45);
  border-color:var(--ink-soft)}
.lgf-demo-hover.lgf-lnk{gap:14px;color:var(--accent-2)}
.lgf-demo-hover.lgf-mega{display:grid;position:static;width:100%;box-shadow:none}
.lgf-swatch{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px}
.lgf-sw{border:1px solid var(--line)}
.lgf-sw i{display:block;height:64px}
.lgf-sw span{display:block;padding:8px 10px;font-size:10.5px;font-weight:700;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-soft);background:var(--paper)}
.lgf-sw-ink i{background:var(--ink)} .lgf-sw-ink2 i{background:var(--ink-2)}
.lgf-sw-soft i{background:var(--ink-soft)} .lgf-sw-paper i{background:var(--paper)}
.lgf-sw-surface i{background:var(--surface)} .lgf-sw-surface2 i{background:var(--surface-2)}
.lgf-sw-accent i{background:var(--accent)} .lgf-sw-accent2 i{background:var(--accent-2)}
.lgf-sw-wash i{background:var(--accent-wash)} .lgf-sw-line i{background:var(--line)}
.lgf-frames{display:flex;flex-wrap:wrap;gap:28px;overflow-x:auto;max-width:100%}
.lgf-frames figure{margin:0;width:390px;flex:0 0 auto}
.lgf-frames figcaption{margin:0 0 8px}
.lgf-frames iframe{width:390px;height:760px;border:1px solid var(--line);background:var(--paper);display:block}
/* Fix rapatriement : les spécimens d'aperçu mobile (iframes fixes 390px) débordaient de la
   planche elle-même quand la planche est consultée à 390px (408px de scrollWidth) — repli
   en bande à défilement natif horizontal (comme le carrousel d'avis), jamais de rognage. */

/* ============================================================ AJOUTS DU SITE
   Utilitaires propres à logiciel-gestion-de-formation.fr, absents du socle
   V8-atlas (accent de titre, lien d'évitement, texte accessible masqué). */
.lgf-choc{font-style:italic;color:var(--accent-2)}
.lgf-bg-ink .lgf-choc,.lgf-on-photo .lgf-choc{color:oklch(0.86 0.075 62)}
.lgf-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--on-ink);
  padding:12px 18px;font-size:14px;font-weight:700}
.lgf-skip:focus{left:12px;top:12px}
.lgf-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Hero réduit (pages secondaires) : la même anatomie que .lgf-hero, hauteur et
   paliers de texte resserrés pour que l'action primaire tienne au-dessus de la
   ligne de flottaison desktop (G32) sans changer le mode de capture. */
.lgf-hero-sm{min-height:clamp(420px,52vh,560px)}
.lgf-hero-sm .lgf-hero-band{padding:64px 0 36px}
.lgf-hero-sm .lgf-h1{font-size:clamp(30px,4.2vw,52px)}