/* ============================================================
   Lutopie Business Club — refonte structurelle de la home.
   Chargée UNIQUEMENT par index.html, après lux.css.
   Portée : [data-lbc-home]. Les 52 autres pages ne la voient pas.

   La double sélection [data-lbc-lux][data-lbc-home] sert à égaler
   la spécificité de lux.css : à égalité, c'est l'ordre de
   chargement qui tranche, et home.css est chargée après.
   ============================================================ */

/* --- Réinitialisation du rythme générique de lux.css ---------- */
[data-lbc-lux][data-lbc-home] section{
  padding-top:0 !important;
  padding-bottom:0 !important;
}
/* Chaque section pose ensuite son propre rythme.
   La double attribution est nécessaire : la remise à zéro ci-dessus
   pèse (0,2,1) et écraserait un simple `.h-pad` en (0,2,0). */
[data-lbc-lux][data-lbc-home] section.h-pad{
  padding-top:clamp(88px,11vw,168px) !important;
  padding-bottom:clamp(88px,11vw,168px) !important;
}
/* Le hero porte son propre cadrage : aucun padding hérité. */
[data-lbc-lux][data-lbc-home] section.h-hero{
  padding-top:0 !important; padding-bottom:0 !important;
}
[data-lbc-home] .h-wrap{ max-width:1240px; margin:0 auto; padding-inline:clamp(20px,4vw,56px); }
[data-lbc-home] .h-eyebrow{
  font-size:11px; font-weight:600; letter-spacing:.32em;
  text-transform:uppercase; color:var(--lbc-gold); margin:0;
}
[data-lbc-home] .h-lead{ font-size:clamp(17px,1.5vw,20px); line-height:1.65; color:var(--text-muted); }
/* .h-deep doit être listé aussi : sur le fond le plus sombre du site,
   la couleur claire par défaut tombait à 2,69:1. */
[data-lbc-home] .h-dark .h-lead,
[data-lbc-home] .h-deep .h-lead,
[data-lbc-home] .h-quote .h-lead{ color:var(--text-on-dark-soft); }
[data-lbc-home] .h-dark{ background:var(--lbc-forest); color:var(--lbc-cream); }
[data-lbc-home] .h-deep{ background:var(--lbc-forest-900); color:var(--lbc-cream); }
[data-lbc-home] .h-light{ background:var(--lbc-cream); color:var(--text-body); }

/* --- Navigation : transparente sur le hero, puis figée --------
   En sticky, la nav occupe une bande en haut du flux : on y voyait
   le fond crème de la page, et ses liens crème devenaient invisibles.
   En fixed, elle se superpose au hero qui démarre bien à y=0. */
[data-lbc-home] [data-lbcnav]{
  position:fixed !important; top:0; left:0; right:0;
  background:transparent !important;
  border-bottom-color:transparent !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  transition:background-color .55s var(--ease-quiet),
             border-color .55s ease;
}
/* Le voile de lisibilite, pendant que la barre est transparente. */
[data-lbc-home] [data-lbcnav]{ isolation:isolate; }
[data-lbc-home] [data-lbcnav]::before{
  content:""; position:absolute; left:0; right:0; top:0; height:168px;
  z-index:-1; pointer-events:none;
  background:linear-gradient(to bottom,
    rgba(3,20,17,.74) 0%, rgba(3,20,17,.58) 46%, rgba(3,20,17,.22) 78%, transparent 100%);
  transition:opacity .55s var(--ease-quiet);
}
/* Une fois figee, la barre a son propre fond : le voile n'a plus lieu d'etre. */
[data-lbc-home].is-pinned [data-lbcnav]::before{ opacity:0; }

[data-lbc-home].is-pinned [data-lbcnav]{
  background:rgba(6,51,46,0.92) !important;
  border-bottom-color:var(--border-on-dark) !important;
  backdrop-filter:blur(8px) !important; -webkit-backdrop-filter:blur(8px) !important;
}

/* ============================================================
   01 — HERO PLEIN ÉCRAN
   ============================================================ */
[data-lbc-home] .h-hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  overflow:hidden; background:var(--lbc-forest-900);
}
[data-lbc-home] .h-hero__media{ position:absolute; inset:-8% 0 -8% 0; z-index:0; }
[data-lbc-home] .h-hero__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.72) contrast(1.06) brightness(.82);
  transform:scale(1.06);
  animation:lbcHeroSettle 6.5s cubic-bezier(.22,.61,.36,1) both;
}
/* L'arrivée respire : la photo se pose de 1.12 à son échelle de repos,
   une seule fois, au chargement. Assez lent pour ne pas se remarquer
   comme un effet — on sent seulement que la page est vivante. */
@keyframes lbcHeroSettle{ from{ transform:scale(1.12); } to{ transform:scale(1.06); } }
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-hero__media img{ animation:none; }
}
/* Le film d'ambiance recouvre la photo ; même traitement colorimétrique,
   pour que le passage photo → vidéo ne se voie pas. Sous mouvement
   réduit, le film disparaît et la photo reprend seule. */
[data-lbc-home] .h-hero__media .h-hero__film{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block;
  filter:saturate(.72) contrast(1.06) brightness(.82);
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-hero__media .h-hero__film{ display:none; }
}
/* Voile forêt : la photo est chaude, la marque est froide. */
[data-lbc-home] .h-hero__veil{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(4,31,28,.72) 0%, rgba(4,31,28,.38) 34%, rgba(4,31,28,.88) 100%),
    radial-gradient(ellipse at 50% 40%, transparent 40%, rgba(4,31,28,.55) 100%);
  mix-blend-mode:multiply;
}
[data-lbc-home] .h-hero__veil::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,51,46,.30), rgba(6,51,46,.55));
}
/* Voile de tête : garantit la lisibilité de la nav quelle que soit
   la zone de la photo qui passe derrière (ici, un dôme très clair). */
[data-lbc-home] .h-hero::before{
  content:""; position:absolute; top:0; left:0; right:0; height:190px; z-index:2;
  background:linear-gradient(180deg, rgba(4,31,28,.78) 0%, rgba(4,31,28,.34) 55%, transparent 100%);
  pointer-events:none;
}
[data-lbc-home] .h-hero__inner{
  position:relative; z-index:2; width:100%;
  max-width:1240px; margin:0 auto;
  padding:0 clamp(20px,4vw,56px) clamp(56px,8vh,112px);
}
[data-lbc-home] .h-hero__seal{ height:64px; width:auto; display:block; margin-bottom:28px; }
[data-lbc-home] .h-hero h1{
  font-family:var(--font-display);
  /* Déborde volontairement la colonne de texte, jusqu'à mordre la marge. */
  font-size:clamp(52px,10.5vw,178px) !important;
  line-height:.92 !important;
  letter-spacing:-.045em !important;
  color:var(--lbc-cream); font-weight:400;
  margin:18px 0 0; max-width:16ch;
  margin-left:-.055em;              /* alignement optique du L capital */
}
[data-lbc-home] .h-hero__foot{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:40px; flex-wrap:wrap; margin-top:clamp(28px,4vh,48px);
}
[data-lbc-home] .h-hero__foot p{
  font-size:clamp(16px,1.4vw,19px); line-height:1.6;
  color:var(--text-on-dark-soft); max-width:44ch; margin:0;
}
[data-lbc-home] .h-scroll{
  display:flex; align-items:center; gap:12px;
  font-size:11px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--text-on-dark-soft);
}
[data-lbc-home] .h-scroll span{
  width:54px; height:1px; background:linear-gradient(90deg,var(--lbc-gold),transparent);
  display:block;
}

/* ============================================================
   02 — BANDE DÉFILANTE DES SECTEURS
   ============================================================ */
[data-lbc-home] .h-marquee{
  background:var(--lbc-forest-900); color:var(--lbc-cream);
  padding:clamp(26px,3vw,40px) 0;
  border-block:1px solid var(--border-on-dark);
  overflow:hidden;
}
[data-lbc-home] .h-marquee__track{
  display:flex; width:max-content; gap:0;
  animation:hMarquee 72s linear infinite;
}
[data-lbc-home] .h-marquee:hover .h-marquee__track{ animation-play-state:paused; }
[data-lbc-home] .h-marquee__set{ display:flex; align-items:center; gap:0; flex:none; }
[data-lbc-home] .h-marquee__set b{
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(20px,2.2vw,32px); letter-spacing:-.01em;
  color:var(--lbc-cream); padding:0 clamp(20px,2.4vw,38px); white-space:nowrap;
}
[data-lbc-home] .h-marquee__set i{
  width:5px; height:5px; border-radius:50%; background:var(--lbc-gold);
  flex:none; opacity:.8;
}
@keyframes hMarquee{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }

/* ============================================================
   03 — CHIFFRES EN TRÈS GRAND CORPS, EN ESCALIER
   ============================================================ */
[data-lbc-home] .h-figures{ background:var(--lbc-cream); }
[data-lbc-home] .h-figures__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(24px,3vw,48px); align-items:start;
}
[data-lbc-home] .h-fig b{
  display:block; font-family:var(--font-display); font-weight:400;
  font-size:clamp(64px,9.5vw,168px); line-height:.86;
  letter-spacing:-.05em; color:var(--lbc-forest);
  font-feature-settings:"tnum" 1,"lnum" 1;
}
[data-lbc-home] .h-fig i{
  display:block; width:38px; height:1px; margin:20px 0 14px;
  background:linear-gradient(90deg,var(--lbc-gold),transparent);
}
[data-lbc-home] .h-fig span{
  font-size:14px; line-height:1.5; color:var(--text-muted); letter-spacing:.01em;
}
/* L'escalier : chaque chiffre descend un peu plus que le précédent. */
[data-lbc-home] .h-fig:nth-child(2){ margin-top:clamp(28px,4vw,72px); }
[data-lbc-home] .h-fig:nth-child(3){ margin-top:clamp(56px,8vw,144px); }
[data-lbc-home] .h-fig:nth-child(4){ margin-top:clamp(84px,12vw,216px); }

/* ============================================================
   04 — MISE EN RELATION : COLONNES DÉSYNCHRONISÉES
   ============================================================ */
[data-lbc-home] .h-split__grid{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(40px,6vw,110px);
  align-items:start;
}
[data-lbc-home] .h-split__aside{ position:sticky; top:clamp(96px,14vh,150px); }
[data-lbc-home] .h-split h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(38px,5vw,84px) !important; line-height:1 !important;
  letter-spacing:-.035em !important; margin:16px 0 0; color:var(--lbc-cream);
}
[data-lbc-home] .h-split__say{
  font-family:var(--font-display); font-style:italic;
  font-size:clamp(20px,2.2vw,30px); line-height:1.35;
  color:var(--lbc-gold); margin:22px 0 0; max-width:22ch;
}
[data-lbc-home] .h-steps{ display:flex; flex-direction:column; gap:0; }
[data-lbc-home] .h-step{
  padding:clamp(30px,4vw,52px) 0;
  border-top:1px solid var(--border-on-dark);
  display:grid; grid-template-columns:auto 1fr; gap:clamp(20px,3vw,44px); align-items:start;
}
[data-lbc-home] .h-step:last-child{ border-bottom:1px solid var(--border-on-dark); }
[data-lbc-home] .h-step em{
  font-family:var(--font-display); font-style:normal; font-weight:400;
  font-size:clamp(28px,3vw,46px); line-height:1; color:var(--lbc-gold);
  font-feature-settings:"tnum" 1;
}
[data-lbc-home] .h-step h3{
  font-family:var(--font-display); font-size:clamp(21px,2vw,28px);
  color:var(--lbc-cream); margin:0 0 9px; font-weight:400; line-height:1.15;
}
[data-lbc-home] .h-step p{ font-size:16px; line-height:1.65; color:var(--text-on-dark-soft); margin:0; }
/* Décalage progressif : la colonne droite « avance » sur la gauche. */
[data-lbc-home] .h-step:nth-child(2){ transform:translateX(clamp(0px,2vw,34px)); }
[data-lbc-home] .h-step:nth-child(3){ transform:translateX(clamp(0px,4vw,68px)); }

/* ============================================================
   05 — CITATION PLEINE PAGE
   ============================================================ */
[data-lbc-home] .h-quote{
  min-height:86svh; display:flex; align-items:center; justify-content:center;
  position:relative; background:var(--lbc-forest-900); color:var(--lbc-cream);
  padding:clamp(72px,10vw,140px) clamp(20px,4vw,56px);
}
[data-lbc-home] .h-quote blockquote{
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(30px,5.4vw,88px); line-height:1.1; letter-spacing:-.035em;
  text-align:center; max-width:17ch; margin:0; color:var(--lbc-cream);
}
[data-lbc-home] .h-quote__mark{
  font-family:var(--font-display); font-size:clamp(64px,9vw,150px);
  color:var(--lbc-gold); line-height:.4; display:block; margin-bottom:.28em; opacity:.85;
}

/* ============================================================
   06 — ESPRIT : IMAGE HORS-GRILLE
   ============================================================ */
[data-lbc-home] .h-spirit__grid{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(36px,5vw,88px); align-items:center;
}
/* Gouttière : distance du bord gauche du viewport au bord du contenu.
   = moitié de la marge hors conteneur + padding interne du conteneur. */
[data-lbc-home]{
  --h-gutter:calc(max(0px, (100vw - 1240px) / 2) + clamp(20px,4vw,56px));
}
/* L'image sort du conteneur jusqu'au bord gauche du viewport.
   Il faut l'ÉLARGIR autant qu'on la décale : un simple margin négatif
   la pousserait hors écran au lieu de l'étendre — les pourcentages de
   marge se résolvent sur la colonne de grille, pas sur le conteneur. */
[data-lbc-home] .h-bleed-left{
  margin-left:calc(-1 * var(--h-gutter));
  width:calc(100% + var(--h-gutter));
  position:relative; overflow:hidden; border-radius:0 12px 12px 0;
  aspect-ratio:4/5; max-height:78vh;
}
[data-lbc-home] .h-bleed-left img{
  width:100%; height:112%; object-fit:cover; display:block; margin-top:-6%;
  filter:saturate(.8) contrast(1.05);
}
[data-lbc-home] .h-spirit blockquote{
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(28px,3.4vw,54px); line-height:1.18; letter-spacing:-.028em;
  color:var(--text-heading); margin:20px 0 0; max-width:20ch;
}
[data-lbc-home] .h-spirit__sig{
  font-family:var(--font-display); font-style:italic;
  font-size:clamp(17px,1.6vw,21px); line-height:1.5;
  color:var(--text-heading); margin:30px 0 0; max-width:36ch;
}
[data-lbc-home] .h-values{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,3vw,44px); margin-top:clamp(56px,7vw,104px);
}
[data-lbc-home] .h-values h3{
  font-family:var(--font-display); font-size:clamp(20px,1.9vw,27px);
  color:var(--text-heading); margin:18px 0 10px; font-weight:400;
}
[data-lbc-home] .h-values p{ font-size:15.5px; line-height:1.65; color:var(--text-muted); margin:0; }
[data-lbc-home] .h-values i{
  display:block; width:40px; height:1px;
  background:linear-gradient(90deg,var(--lbc-gold),transparent);
}
[data-lbc-home] .h-drivers{
  display:grid; grid-template-columns:repeat(6,1fr);
  gap:clamp(16px,2vw,28px); margin-top:clamp(48px,6vw,84px);
  padding-top:clamp(36px,4vw,56px); border-top:1px solid var(--border-quiet);
}
[data-lbc-home] .h-drivers h4{
  font-family:var(--font-display); font-size:18px; color:var(--text-heading);
  margin:0 0 7px; font-weight:400;
}
[data-lbc-home] .h-drivers p{ font-size:14px; line-height:1.55; color:var(--text-muted); margin:0; }

/* ============================================================
   07 — PRÉSENCE
   ============================================================ */
[data-lbc-home] .h-presence__grid{
  display:grid; grid-template-columns:.85fr 1.15fr;
  gap:clamp(36px,5vw,92px); align-items:center;
}
[data-lbc-home] .h-presence h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(34px,4.4vw,72px) !important; line-height:1.02 !important;
  letter-spacing:-.035em !important; color:var(--lbc-cream); margin:16px 0 22px; max-width:12ch;
}
[data-lbc-home] .h-countries{ display:grid; grid-template-columns:1fr 1fr; column-gap:clamp(20px,3vw,44px); }
[data-lbc-home] .h-countries div{
  padding:clamp(14px,1.6vw,21px) 2px; border-top:1px solid var(--border-on-dark);
  display:flex; align-items:baseline; gap:16px;
}
[data-lbc-home] .h-countries em{
  font-family:var(--font-display); font-style:normal; color:var(--lbc-gold);
  font-size:13px; font-feature-settings:"tnum" 1;
}
[data-lbc-home] .h-countries span{ font-size:clamp(17px,1.5vw,21px); color:var(--lbc-cream); }
[data-lbc-home] .h-map{
  position:relative; width:100%; aspect-ratio:3580/1470; overflow:hidden;
  border:1px solid var(--border-on-dark); border-radius:var(--radius-lg);
  background:var(--lbc-forest-900);
  margin-top:clamp(48px,6vw,88px);
}
[data-lbc-home] .h-map__svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
[data-lbc-home] .h-map__land path{
  fill:var(--lbc-forest-600); stroke:var(--lbc-forest-500);
  stroke-width:1; vector-effect:non-scaling-stroke;
}
/* Les huit territoires : mêmes teintes au repos, or au survol. */
/* Les huit territoires se lisent maintenant à la couleur, pas à
   l'épingle. Au repos ils étaient en forest-500 sur un fond
   forest-600 : deux verts à peine distincts, il fallait chercher.
   Un laiton sourd les détache du continent sans crier — l'or plein
   reste réservé au survol, sinon il n'y aurait plus de gradation. */
[data-lbc-home] .h-map__terr path{
  fill:color-mix(in srgb, var(--lbc-gold) 46%, var(--lbc-forest-800));
  stroke:color-mix(in srgb, var(--lbc-gold) 70%, transparent);
  stroke-width:1; vector-effect:non-scaling-stroke;
  transition:fill .45s var(--ease-quiet), stroke .45s ease;
}
[data-lbc-home] .h-map__terr path.is-on{
  fill:var(--lbc-gold); stroke:var(--lbc-gold);
}

/* --- Points : apparition en cascade au scroll --- */
[data-lbc-home] .h-pin{
  position:absolute; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center; gap:7px;
  text-decoration:none; cursor:pointer;
  opacity:0; scale:.6;
  transition:opacity .5s var(--ease-quiet),
             scale .5s var(--ease-quiet);
  transition-delay:calc(var(--pin,0) * 110ms);
}
[data-lbc-home] .h-map.is-live .h-pin{ opacity:1; scale:1; }
[data-lbc-home] .h-pin--above{ flex-direction:column-reverse; }
[data-lbc-home] .h-pin--right{ flex-direction:row-reverse; align-items:center; gap:9px; }
[data-lbc-home] .h-pin--left{ flex-direction:row; align-items:center; gap:9px; }
[data-lbc-home] .h-pin b{
  width:11px; height:11px; border-radius:50%; background:var(--lbc-gold); flex:none;
  box-shadow:0 0 0 5px rgba(201,168,76,.16);
  /* 24/09/2026 : reaction au survol en --duree-vive (260 ms, jeton de finish.css, decision du jury). */
  transition:box-shadow var(--duree-vive) ease, transform var(--duree-vive) var(--ease-quiet);
}
[data-lbc-home] .h-pin span{ font-size:12px; letter-spacing:.06em; color:var(--lbc-cream); white-space:nowrap;
  transition:color .3s ease; }
[data-lbc-home] .h-pin--major b{ width:13px; height:13px; box-shadow:0 0 0 6px rgba(201,168,76,.24); }
[data-lbc-home] .h-pin--major span{ font-size:13px; font-weight:600; }
[data-lbc-home] .h-pin:hover b,
[data-lbc-home] .h-pin:focus-visible b{
  box-shadow:0 0 0 11px rgba(201,168,76,.3), 0 0 22px 4px rgba(201,168,76,.45);
  transform:scale(1.12);
}
[data-lbc-home] .h-pin:hover span{ color:var(--lbc-gold); }

/* Fiche d'information, discrète, au survol du point */
[data-lbc-home] .h-pin__card{
  position:absolute; bottom:calc(100% + 14px); left:50%; translate:-50% 6px;
  background:rgba(4,31,28,.94); border:1px solid var(--lbc-gold);
  border-radius:var(--radius-sm); padding:10px 14px; min-width:150px;
  font-style:normal; font-size:12px; line-height:1.5; color:var(--lbc-gold);
  opacity:0; pointer-events:none; white-space:nowrap; z-index:4;
  transition:opacity .3s ease, translate .3s var(--ease-quiet);
  backdrop-filter:blur(6px);
}
[data-lbc-home] .h-pin__card i{
  display:block; font-style:normal; font-family:var(--font-display);
  font-size:15px; color:var(--lbc-cream); margin-bottom:3px;
}
[data-lbc-home] .h-pin:hover .h-pin__card,
[data-lbc-home] .h-pin:focus-visible .h-pin__card{ opacity:1; translate:-50% 0; }
/* Près du bord haut, la fiche posée au-dessus sortait de la carte :
   Pékin dans le cadre Asie, Bruxelles sur un écran de 1024 px. Pour
   ces épingles-là, elle passe sous le point. */
[data-lbc-home] .h-pin--fiche-bas .h-pin__card{ bottom:auto; top:calc(100% + 14px); }

@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-pin{ opacity:1 !important; scale:1 !important; transition:none !important; }
  [data-lbc-home] .h-pin:hover b{ transform:none !important; }
}

/* ============================================================
   08 — CE QUE LE CERCLE OUVRE : GRILLE EN QUINCONCE
   ============================================================ */
[data-lbc-home] .h-offer__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,2.4vw,32px);
  margin-top:clamp(48px,6vw,80px);
}
[data-lbc-home] .h-offer__grid > *:nth-child(3n+2){ margin-top:clamp(24px,3.5vw,64px); }
[data-lbc-home] .h-offer__grid > *:nth-child(3n+3){ margin-top:clamp(48px,7vw,128px); }
[data-lbc-home] .h-card{
  border:1px solid var(--hairline-soft); border-radius:var(--radius-md);
  padding:clamp(26px,2.6vw,38px); background:var(--surface-card);
}
[data-lbc-home] .h-card h3{
  font-family:var(--font-display); font-size:clamp(19px,1.7vw,24px);
  color:var(--text-heading); margin:0 0 10px; font-weight:400;
}
[data-lbc-home] .h-card p{ font-size:15px; line-height:1.65; color:var(--text-muted); margin:0; }
[data-lbc-home] .h-eco{
  display:flex; flex-wrap:wrap; gap:12px;
  margin-top:clamp(48px,6vw,88px); padding-top:clamp(30px,3.5vw,48px);
  border-top:1px solid var(--border-quiet);
}
[data-lbc-home] .h-eco span{
  border:1px solid var(--hairline-soft); border-radius:var(--radius-pill);
  padding:10px 20px; font-size:15px; color:var(--text-heading); background:var(--surface-card);
}

/* ============================================================
   09 — ORACLE : BANDE SOMBRE, CONTENU POUSSÉ À DROITE
   ============================================================ */
[data-lbc-home] .h-oracle__grid{
  display:grid; grid-template-columns:1fr 1.25fr; gap:clamp(36px,5vw,96px); align-items:center;
}
[data-lbc-home] .h-oracle h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(32px,4vw,66px) !important; line-height:1.04 !important;
  letter-spacing:-.03em !important; color:var(--lbc-cream); margin:16px 0 22px; max-width:14ch;
}
[data-lbc-home] .h-oracle__panel{
  border-left:1px solid var(--lbc-gold); padding-left:clamp(26px,3vw,52px);
}
[data-lbc-home] .h-oracle__panel > div{
  padding:clamp(15px,1.6vw,21px) 0; border-bottom:1px solid var(--border-on-dark);
  font-size:clamp(17px,1.6vw,22px); color:var(--lbc-cream);
  display:flex; justify-content:space-between; align-items:baseline; gap:20px;
}
[data-lbc-home] .h-oracle__panel > div em{
  font-style:normal; font-size:12px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--lbc-gold); opacity:.75;
}

/* ============================================================
   10 — RAIL HORIZONTAL (preuve + témoignages)
   ============================================================ */
/* Carrousel à défilement natif : le navigateur gère la molette, le trackpad,
   le clavier et le tactile. Le JS n'ajoute que le glisser-souris, les
   flèches et les indicateurs. Aucun détournement du scroll vertical. */
[data-lbc-home] .h-rail{ position:relative; background:var(--lbc-cream); }
[data-lbc-home] .h-rail__sticky{ display:block; }
[data-lbc-home] .h-rail__head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:32px; flex-wrap:wrap; margin-bottom:clamp(28px,3.5vw,48px);
}
[data-lbc-home] .h-rail__track{
  display:flex; gap:clamp(20px,2.4vw,34px);
  overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding-block:6px; margin-inline:calc(-1 * var(--h-gutter));
  padding-inline:var(--h-gutter);
  /* sans scroll-padding, l'ancrage compense le padding et la position
     de départ n'est plus 0 : la flèche « précédent » resterait active */
  scroll-padding-inline:var(--h-gutter);
  scrollbar-width:none; -ms-overflow-style:none;
  cursor:grab;
}
[data-lbc-home] .h-rail__track::-webkit-scrollbar{ display:none; }
[data-lbc-home] .h-rail__track.is-dragging{ cursor:grabbing; scroll-behavior:auto; scroll-snap-type:none; }
[data-lbc-home] .h-rail__track.is-dragging *{ pointer-events:none; }
[data-lbc-home] .h-rail__card{
  flex:none; width:clamp(272px,25vw,380px); scroll-snap-align:start;
  border:1px solid var(--hairline-soft); border-radius:var(--radius-md);
  padding:clamp(26px,2.4vw,36px); background:var(--surface-card);
  /* 24/09/2026 : reaction au survol en --duree-vive (260 ms, jeton de finish.css, decision du jury). La levee de
     -4 px vit dans finish.css, sous porte hover/pointer et avec son mouvement
     reduit ; ici couleur et ombre seulement, sinon un tap laisse la carte levee. */
  transition:border-color .3s ease, box-shadow var(--duree-vive) ease;
}
[data-lbc-home] .h-rail__card:hover{
  border-color:var(--lbc-gold);
  box-shadow:0 20px 46px -30px rgba(6,51,46,.55);
}

/* --- Commandes du carrousel --- */
[data-lbc-home] .h-rail__nav{ display:flex; align-items:center; gap:12px; }
[data-lbc-home] .h-arrow{
  width:52px; height:52px; border-radius:50%; flex:none;
  border:1px solid var(--hairline-soft); background:transparent;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--text-heading);
  transition:border-color .3s ease, background-color .3s ease, color .3s ease, opacity .3s ease;
}
[data-lbc-home] .h-arrow:hover:not(:disabled){
  border-color:var(--lbc-gold); background:var(--lbc-gold); color:var(--lbc-forest);
}
[data-lbc-home] .h-arrow:disabled{ opacity:.28; cursor:default; }
[data-lbc-home] .h-arrow svg{ width:18px; height:18px; }
[data-lbc-home] .h-arrow:focus-visible{ outline:2px solid var(--lbc-gold); outline-offset:3px; }

[data-lbc-home] .h-dots{
  display:flex; gap:9px; justify-content:center; align-items:center;
  margin-top:clamp(26px,3vw,40px);
}
[data-lbc-home] .h-dot{
  width:28px; height:2px; border:0; padding:0; cursor:pointer;
  background:var(--hairline-soft); transition:background-color .35s ease, width .35s ease;
}
[data-lbc-home] .h-dot[aria-current="true"]{ background:var(--lbc-gold); width:46px; }
[data-lbc-home] .h-dot:focus-visible{ outline:2px solid var(--lbc-gold); outline-offset:4px; }
[data-lbc-home] .h-rail__card b{
  display:block; font-family:var(--font-display); font-size:44px;
  line-height:.4; height:26px; color:var(--lbc-gold);
}
[data-lbc-home] .h-rail__card h3{
  font-family:var(--font-display); font-size:clamp(18px,1.6vw,23px);
  color:var(--text-heading); margin:22px 0 11px; font-weight:400;
}
[data-lbc-home] .h-rail__card p{ font-size:15px; line-height:1.65; color:var(--text-muted); margin:0; }
[data-lbc-home] .h-rail__card cite{
  display:block; font-style:normal; margin-top:20px;
  font-family:var(--font-display); font-size:17px; color:var(--text-heading); font-weight:400;
}
[data-lbc-home] .h-rail__card small{ display:block; font-size:13px; color:var(--text-muted); margin-top:3px; }

/* ============================================================
   11 — BANDEAU VIDÉO PLEIN ÉCRAN
   ============================================================ */
[data-lbc-home] .h-video{
  position:relative; height:100svh; overflow:hidden;
  background:var(--lbc-forest); cursor:pointer;
}
[data-lbc-home] .h-video__media{ position:absolute; inset:-10% 0; }
[data-lbc-home] .h-video__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.75) contrast(1.05) brightness(.8);
}
/* Voile du bandeau vidéo — même remarque que pour .h-band : le
   `brightness(.8)` posé sur l'image au-dessus ne s'applique pas, car
   finish.css impose la signature photographique du site avec une
   spécificité (0,4,1) hors de portée de cette feuille. Le voile doit
   donc assombrir seul. Un simple dégradé à 55 % laissait la photo
   délavée et la phrase flottait dessus au lieu de s'y poser. */
[data-lbc-home] .h-video__veil{
  position:absolute; inset:0; pointer-events:none;
  background:
    /* Le creux du dégradé reste haut (.70) : contrairement au hero, dont
       le texte est en bas, c'est le MILIEU de cette bande qui porte la
       phrase. Un creux à .56 y laissait la photo remonter. */
    linear-gradient(180deg, rgba(4,31,28,.80) 0%, rgba(4,31,28,.70) 45%, rgba(4,31,28,.92) 100%),
    radial-gradient(ellipse at 50% 50%, rgba(4,31,28,.22) 18%, rgba(4,31,28,.62) 100%);
  mix-blend-mode:multiply;
}
[data-lbc-home] .h-video__veil::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,51,46,.30), rgba(6,51,46,.48));
}
[data-lbc-home] .h-video__inner{
  position:relative; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center;
  padding:clamp(28px,5vw,60px); gap:28px;
}
[data-lbc-home] .h-play{
  width:86px; height:86px; border-radius:50%; flex:none;
  background:rgba(6,51,46,.4); border:1px solid var(--lbc-gold);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .35s ease, transform .35s var(--ease-quiet);
}
[data-lbc-home] .h-video:hover .h-play{ background:rgba(201,168,76,.2); transform:scale(1.06); }
[data-lbc-home] .h-play i{
  width:0; height:0; margin-left:6px; border-style:solid;
  border-width:13px 0 13px 22px;
  border-color:transparent transparent transparent var(--lbc-gold);
}
[data-lbc-home] .h-video__inner p{
  font-family:var(--font-display); font-style:italic;
  font-size:clamp(24px,3.4vw,50px); line-height:1.24; letter-spacing:-.02em;
  color:var(--lbc-cream); max-width:20ch; margin:0;
}

/* ============================================================
   12 — MOSAÏQUE SOCIALE + ADMISSION
   ============================================================ */
[data-lbc-home] .h-mosaic{
  display:grid; grid-template-columns:repeat(4,1fr);
  grid-auto-rows:clamp(120px,14vw,205px); gap:clamp(12px,1.4vw,20px);
  margin-top:clamp(44px,5vw,72px);
  grid-auto-flow:dense;              /* évite les trous laissés par les spans */
}
[data-lbc-home] .h-mosaic > *{ position:relative; overflow:hidden; border-radius:10px; display:block; }
[data-lbc-home] .h-mosaic > *:nth-child(1){ grid-column:span 2; grid-row:span 2; }
[data-lbc-home] .h-mosaic > *:nth-child(4){ grid-row:span 2; }
[data-lbc-home] .h-mosaic > *:nth-child(6){ grid-column:span 2; }
/* senat-3 est la seule photo en paysage : c'est elle qui porte la portée
   large. Total = 16 cellules sur 4 colonnes, soit 4 rangées pleines. */
[data-lbc-home] .h-mosaic > *:nth-child(10){ grid-column:span 2; }
[data-lbc-home] .h-mosaic img{ width:100%; height:100%; object-fit:cover; display:block; }

[data-lbc-home] .h-admission__grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(28px,4vw,64px); margin-top:clamp(48px,6vw,84px);
}
[data-lbc-home] .h-admission h3{
  font-family:var(--font-display); font-size:clamp(19px,1.8vw,25px);
  color:var(--lbc-cream); margin:0 0 10px; font-weight:400;
}
[data-lbc-home] .h-admission p{ font-size:15.5px; line-height:1.65; color:var(--text-on-dark-soft); margin:0; }
[data-lbc-home] .h-admission em{
  font-family:var(--font-display); font-style:normal; font-weight:400;
  font-size:clamp(26px,2.6vw,40px); color:var(--lbc-gold); line-height:1;
}
/* Clôture : seul retour à la symétrie de toute la page. */
[data-lbc-home] .h-close{
  text-align:center; max-width:620px; margin:clamp(64px,8vw,120px) auto 0;
  padding-top:clamp(48px,6vw,80px); border-top:1px solid var(--border-on-dark);
}
[data-lbc-home] .h-close h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(32px,4vw,64px) !important; line-height:1.04 !important;
  letter-spacing:-.03em !important; color:var(--lbc-cream); margin:0 0 18px;
}

/* ============================================================
   RESPONSIVE — la structure asymétrique se replie proprement
   ============================================================ */
@media (max-width:1000px){
  [data-lbc-home] .h-split__grid,
  [data-lbc-home] .h-spirit__grid,
  [data-lbc-home] .h-presence__grid,
  [data-lbc-home] .h-oracle__grid{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-split__aside{ position:static; }
  [data-lbc-home] .h-step:nth-child(2),
  [data-lbc-home] .h-step:nth-child(3){ transform:none; }
  [data-lbc-home] .h-figures__grid{ grid-template-columns:repeat(2,1fr) !important; }
  [data-lbc-home] .h-fig:nth-child(2){ margin-top:0; }
  [data-lbc-home] .h-fig:nth-child(3){ margin-top:clamp(24px,4vw,48px); }
  [data-lbc-home] .h-fig:nth-child(4){ margin-top:clamp(24px,4vw,48px); }
  [data-lbc-home] .h-offer__grid{ grid-template-columns:repeat(2,1fr) !important; }
  [data-lbc-home] .h-offer__grid > *{ margin-top:0 !important; }
  [data-lbc-home] .h-drivers{ grid-template-columns:repeat(3,1fr) !important; }
  [data-lbc-home] .h-bleed-left{
    margin-left:calc(-1 * var(--h-gutter));
    margin-right:calc(-1 * var(--h-gutter));
    width:calc(100% + 2 * var(--h-gutter));
    border-radius:0; aspect-ratio:16/10;
  }
  [data-lbc-home] .h-mosaic{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:640px){
  [data-lbc-home] .h-figures__grid{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-fig{ margin-top:0 !important; }
  [data-lbc-home] .h-values,
  [data-lbc-home] .h-offer__grid,
  [data-lbc-home] .h-admission__grid{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-drivers{ grid-template-columns:repeat(2,1fr) !important; }
  [data-lbc-home] .h-countries{ grid-template-columns:1fr; }
  [data-lbc-home] .h-hero h1{ margin-left:0; }
  [data-lbc-home] .h-oracle__panel{ border-left:0; padding-left:0; border-top:1px solid var(--lbc-gold); padding-top:28px; }
}

/* ============================================================
   MOUVEMENT RÉDUIT — le marquee et le rail deviennent statiques
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-marquee__track{ animation:none !important; width:auto; flex-wrap:wrap; }
  [data-lbc-home] .h-marquee__set:nth-child(2){ display:none; }
  [data-lbc-home] .h-marquee__set{ flex-wrap:wrap; justify-content:center; }
  /* Le carrousel reste pilotable : on retire seulement le défilement animé. */
  [data-lbc-home] .h-rail__track{ scroll-behavior:auto !important; }
  [data-lbc-home] .h-rail__card:hover{ transform:none !important; }
  [data-lbc-home] .h-hero__media img,
  [data-lbc-home] .h-video__media img{ transform:none !important; }
}

/* Indicateur de défilement : c'est un lien, il doit se comporter comme tel. */
[data-lbc-home] a.h-scroll{ text-decoration:none; transition:color .3s ease, gap .3s ease; }
[data-lbc-home] a.h-scroll:hover{ color:var(--lbc-gold); gap:18px; }
[data-lbc-home] a.h-scroll:hover span{ background:linear-gradient(90deg,var(--lbc-gold),var(--lbc-gold)); }
[data-lbc-home] .h-video:focus-visible{ outline:3px solid var(--lbc-gold); outline-offset:-6px; }

/* ============================================================
   SURVOL — réactions sur les éléments qui n'en avaient pas.
   Toujours discret : filet qui s'éclaire, léger relief, jamais
   de rebond. Tout est neutralisé sous prefers-reduced-motion.
   ============================================================ */

/* Chiffres : le filet s'étire, le chiffre passe à l'or */
[data-lbc-home] .h-fig{ transition:transform .4s var(--ease-quiet,cubic-bezier(.22,.61,.36,1)); }
[data-lbc-home] .h-fig b{ transition:color .4s ease; }
[data-lbc-home] .h-fig i{ transition:width .45s var(--ease-quiet,cubic-bezier(.22,.61,.36,1)); }
[data-lbc-home] .h-fig:hover b{ color:var(--lbc-gold); }
[data-lbc-home] .h-fig:hover i{ width:96px; }

/* Étapes de la mise en relation : le numéro s'anime, le filet s'éclaire */
/* 24/09/2026 : reactions en --duree-vive (260 ms, jeton de finish.css). padding-left reste : .h-step a deux enfants
   (em + div) et porte deja le translateX d'escalier des nth-child 2 et 3, un
   transform sur lui deplacerait aussi son filet haut. Le glissement et le
   numero qui se souleve ne valent que sous souris. */
[data-lbc-home] .h-step{ transition:border-color var(--duree-vive) ease, padding-left var(--duree-vive) var(--ease-quiet); }
[data-lbc-home] .h-step em{ transition:transform var(--duree-vive) var(--ease-quiet), color .3s ease; display:inline-block; }
[data-lbc-home] .h-step:hover{ border-top-color:var(--lbc-gold); }
@media (hover:hover) and (pointer:fine){
  [data-lbc-home] .h-step:hover{ padding-left:10px; }
  [data-lbc-home] .h-step:hover em{ transform:translateY(-3px); }
}

/* Valeurs et moteurs : le filet s'allonge */
[data-lbc-home] .h-values > div i{ transition:width .45s var(--ease-quiet,cubic-bezier(.22,.61,.36,1)), background .3s ease; }
[data-lbc-home] .h-values > div:hover i{ width:88px; }
[data-lbc-home] .h-values > div h3,
[data-lbc-home] .h-drivers > div h4{ transition:color .3s ease; }
[data-lbc-home] .h-values > div:hover h3,
[data-lbc-home] .h-drivers > div:hover h4{ color:var(--lbc-gold); }

/* Pays : la ligne se décale et son filet passe à l'or */
[data-lbc-home] .h-countries div{
  transition:border-top-color .35s ease, padding-left .35s var(--ease-quiet);
}
[data-lbc-home] .h-countries div:hover{ border-top-color:var(--lbc-gold); padding-left:12px; }
[data-lbc-home] .h-countries div span{ transition:color .3s ease; }
[data-lbc-home] .h-countries div:hover span{ color:var(--lbc-gold); }

/* Oracle : la ligne s'éclaire, son étiquette se révèle */
[data-lbc-home] .h-oracle__panel > div{ transition:border-bottom-color .35s ease, padding-left .35s ease; }
[data-lbc-home] .h-oracle__panel > div:hover{ border-bottom-color:var(--lbc-gold); padding-left:10px; }
[data-lbc-home] .h-oracle__panel > div em{ transition:opacity .3s ease; }
[data-lbc-home] .h-oracle__panel > div:hover em{ opacity:1; }

/* Secteurs défilants : le terme survolé passe à l'or */
[data-lbc-home] .h-marquee__set b{ transition:color .3s ease; }
[data-lbc-home] .h-marquee__set b:hover{ color:var(--lbc-gold); }

/* Mosaïque : zoom léger + voile forêt qui se lève.
   Les vignettes ne sont pas carrées, .lux-photo ne les couvre donc pas. */
[data-lbc-home] .h-mosaic > *{ border:1px solid transparent; transition:border-color .35s ease; }
[data-lbc-home] .h-mosaic > *::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:var(--lbc-forest); mix-blend-mode:multiply; opacity:.18;
  transition:opacity .45s ease;
}
[data-lbc-home] .h-mosaic > *:hover{ border-color:var(--lbc-gold); }
[data-lbc-home] .h-mosaic > *:hover::after{ opacity:0; }
[data-lbc-home] .h-mosaic img{
  transition:transform .85s var(--ease-quiet), filter .5s ease;
  filter:saturate(.85) contrast(1.04);
}
[data-lbc-home] .h-mosaic > *:hover img{ transform:scale(1.06); filter:saturate(1) contrast(1); }

/* Étapes d'admission : le numéro se soulève */
[data-lbc-home] .h-admission__grid > div em{ display:inline-block; transition:transform .4s var(--ease-quiet); }
[data-lbc-home] .h-admission__grid > div:hover em{ transform:translateY(-4px); }

/* Image hors-grille : respiration au survol */
[data-lbc-home] .h-bleed-left img{ transition:transform 1s var(--ease-quiet); }
[data-lbc-home] .h-bleed-left:hover img{ transform:scale(1.035); }

@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-fig:hover i,
  [data-lbc-home] .h-values > div:hover i{ width:auto !important; }
  [data-lbc-home] .h-step:hover,
  [data-lbc-home] .h-countries div:hover,
  [data-lbc-home] .h-oracle__panel > div:hover{ padding-left:0 !important; }
  [data-lbc-home] .h-step:hover em,
  [data-lbc-home] .h-admission__grid > div:hover em,
  [data-lbc-home] .h-mosaic > *:hover img,
  [data-lbc-home] .h-bleed-left:hover img{ transform:none !important; }
}

/* --- Page « Mise en relation » : blocs propres ------------------ */
[data-lbc-home] .h-adv em{
  display:block; font-family:var(--font-display); font-style:normal; font-weight:400;
  font-size:clamp(26px,2.6vw,40px); line-height:1; color:var(--lbc-gold);
  font-variant-numeric:tabular-nums lining-nums; margin-bottom:14px;
}
[data-lbc-home] .h-adv h3{
  font-family:var(--font-display); font-size:clamp(19px,1.7vw,24px);
  color:var(--lbc-cream); margin:0 0 10px; font-weight:400; line-height:1.15;
}
[data-lbc-home] .h-adv p{ font-size:15px; line-height:1.65; color:var(--text-on-dark-soft); margin:0; }
[data-lbc-home] .h-adv{ padding-top:22px; border-top:1px solid var(--border-on-dark);
  transition:border-top-color .35s ease, padding-left .35s var(--ease-quiet); }
[data-lbc-home] .h-adv:hover{ border-top-color:var(--lbc-gold); padding-left:10px; }
/* Le rail sert ici de chronologie : le repère est un nombre, pas un guillemet */
[data-lbc-home] .h-rail__card b{
  font-family:var(--font-display); font-size:clamp(26px,2.4vw,36px);
  line-height:1; height:auto; color:var(--lbc-gold);
  font-variant-numeric:tabular-nums lining-nums;
}
[data-lbc-home] .h-rail__card cite{
  display:inline-block; margin-top:18px; font-style:normal;
  font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--lbc-gold); font-weight:600;
}
/* Sélecteur de cas : les onglets prennent le vocabulaire des puces */
[data-lbc-home] .h-cases button[data-active]{
  cursor:pointer; transition:border-color .28s ease, background-color .28s ease, color .28s ease;
}
/* le runtime rend le booléen en 1 / 0, pas en true / false */
[data-lbc-home] .h-cases button[data-active="1"]{
  border-color:var(--lbc-gold) !important; color:var(--lbc-gold) !important;
}

/* ============================================================
   Page « Événements » — grammaire des chapitres photographiques.

   Règle cardinale : dans les galeries, les images gardent TOUJOURS
   leur ratio naturel (width:100%; height:auto, aucun aspect-ratio).
   Les sources mélangent portrait 1169×1746 et paysage 1169×772 ;
   une version antérieure les forçait toutes en 3/4 avec object-fit:
   cover et tranchait les visages. Seules les « plaques » — images
   de tête choisies pour ça — acceptent un recadrage.
   ============================================================ */
[data-lbc-home] .h-chapter__head{
  display:grid; grid-template-columns:.92fr 1.08fr;
  gap:clamp(28px,4vw,84px); align-items:end;
  margin-bottom:clamp(38px,4.5vw,68px);
}
[data-lbc-home] .h-chapter h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(32px,4.4vw,68px) !important; line-height:1.02 !important;
  letter-spacing:-.034em !important; margin:16px 0 0; max-width:15ch;
  color:var(--text-heading);
}
/* La section porte les DEUX classes (`h-chapter h-deep`) : il faut donc
   la forme composée. Une version descendante `.h-deep .h-chapter h2` ne
   matchait rien et laissait le titre en vert sur vert. */
[data-lbc-home] .h-chapter.h-dark h2,
[data-lbc-home] .h-chapter.h-deep h2,
[data-lbc-home] .h-dark .h-chapter h2,
[data-lbc-home] .h-deep .h-chapter h2{ color:var(--lbc-cream) !important; }
[data-lbc-home] .h-chapter__head .h-lead{ margin:0; max-width:52ch; }

/* La plaque : image de tête, recadrée et légèrement mobile. */
[data-lbc-home] .h-plate{
  position:relative; overflow:hidden; border-radius:12px;
  aspect-ratio:16/9; max-height:72vh;
  border:1px solid var(--hairline-soft);
}
[data-lbc-home] .h-dark .h-plate,
[data-lbc-home] .h-deep .h-plate{ border-color:var(--border-on-dark); }
[data-lbc-home] .h-plate img{
  width:100%; height:114%; margin-top:-7%;
  object-fit:cover; display:block;
}
[data-lbc-home] .h-cap{
  font-size:13px; font-style:italic; line-height:1.5;
  color:var(--text-muted); margin:13px 2px 0;
}
[data-lbc-home] .h-dark .h-cap,
[data-lbc-home] .h-deep .h-cap{ color:var(--text-on-dark-soft); }

/* La bande : mise en colonnes, hauteurs libres. */
[data-lbc-home] .h-strip{
  columns:4 210px; column-gap:clamp(12px,1.4vw,20px);
  margin-top:clamp(12px,1.4vw,20px);
}
[data-lbc-home] .h-strip img,
[data-lbc-home] .h-duo img{
  width:100%; height:auto; display:block;
  border-radius:10px; border:1px solid var(--hairline-soft);
}
[data-lbc-home] .h-strip img{
  break-inside:avoid; margin:0 0 clamp(12px,1.4vw,20px);
}
[data-lbc-home] .h-dark .h-strip img,
[data-lbc-home] .h-dark .h-duo img,
[data-lbc-home] .h-deep .h-strip img,
[data-lbc-home] .h-deep .h-duo img{ border-color:var(--border-on-dark); }
[data-lbc-home] .h-duo{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(12px,1.4vw,20px); align-items:start;
  margin-top:clamp(12px,1.4vw,20px);
}
/* Post-scriptum de chapitre : le texte qui referme une série d'images. */
[data-lbc-home] .h-ps{
  max-width:60ch; margin:clamp(40px,5vw,72px) 0 0;
  padding-left:clamp(18px,2vw,30px); border-left:1px solid var(--lbc-gold);
  font-size:clamp(15.5px,1.35vw,17.5px); line-height:1.75; color:var(--text-body);
}
[data-lbc-home] .h-dark .h-ps,
[data-lbc-home] .h-deep .h-ps{ color:var(--text-on-dark-soft); }

/* L'agenda : une ligne par rencontre, la date en très grand corps. */
[data-lbc-home] .h-agenda{
  margin-top:clamp(38px,4.5vw,64px);
  border-top:1px solid var(--border-on-dark);
}
[data-lbc-home] .h-agenda__row{
  display:grid; grid-template-columns:clamp(92px,9vw,140px) 1fr auto;
  gap:clamp(20px,3vw,48px); align-items:center;
  padding:clamp(24px,2.8vw,40px) 2px;
  border-bottom:1px solid var(--border-on-dark);
  transition:padding-left .35s var(--ease-quiet),
             border-bottom-color .35s ease;
}
[data-lbc-home] .h-agenda__row:hover{
  padding-left:12px; border-bottom-color:var(--lbc-gold);
}
[data-lbc-home] .h-agenda__d{ font-family:var(--font-display); color:var(--lbc-gold); }
[data-lbc-home] .h-agenda__d b{
  display:block; font-size:clamp(34px,3.6vw,54px); line-height:.92; font-weight:600;
  font-variant-numeric:tabular-nums lining-nums;
}
[data-lbc-home] .h-agenda__d span{
  display:block; font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  margin-top:9px; opacity:.9;
}
[data-lbc-home] .h-agenda h3{
  font-family:var(--font-display); font-size:clamp(20px,1.9vw,27px);
  color:var(--lbc-cream); margin:0 0 6px; font-weight:400;
}
[data-lbc-home] .h-agenda p{ font-size:15px; line-height:1.6; color:var(--text-on-dark-soft); margin:0; }
[data-lbc-home] .h-agenda__tag{
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--lbc-gold); border:1px solid var(--border-on-dark);
  border-radius:var(--radius-pill); padding:9px 18px; white-space:nowrap;
}

@media (max-width:1000px){
  [data-lbc-home] .h-chapter__head{ grid-template-columns:1fr !important; align-items:start; }
  [data-lbc-home] .h-duo{ grid-template-columns:1fr !important; }
}
@media (max-width:900px){
  [data-lbc-home] .h-strip{ columns:2 150px; }
}
@media (max-width:680px){
  [data-lbc-home] .h-agenda__row{
    grid-template-columns:auto 1fr !important;
    row-gap:14px; align-items:start;
  }
  [data-lbc-home] .h-agenda__tag{ grid-column:2; justify-self:start; }
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-agenda__row:hover{ padding-left:2px !important; }
}

/* Les formats : quatre colonnes en escalier, sur fond clair. */
[data-lbc-home] .h-formats{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(22px,2.6vw,44px); margin-top:clamp(48px,6vw,84px);
  align-items:start;
}
[data-lbc-home] .h-formats > div{
  padding-top:22px; border-top:1px solid var(--border-quiet);
  transition:border-top-color .35s ease,
             padding-left .35s var(--ease-quiet);
}
[data-lbc-home] .h-formats > div:hover{ border-top-color:var(--lbc-gold); padding-left:10px; }
[data-lbc-home] .h-formats em{
  display:block; font-family:var(--font-display); font-style:normal; font-weight:400;
  font-size:clamp(26px,2.6vw,40px); line-height:1; color:var(--lbc-gold);
  font-variant-numeric:tabular-nums lining-nums; margin-bottom:16px;
}
[data-lbc-home] .h-formats h3{
  font-family:var(--font-display); font-size:clamp(19px,1.7vw,25px);
  color:var(--text-heading); margin:0 0 10px; font-weight:400; line-height:1.15;
}
[data-lbc-home] .h-formats p{ font-size:15px; line-height:1.65; color:var(--text-muted); margin:0; }
[data-lbc-home] .h-formats > div:nth-child(2){ margin-top:clamp(18px,2.4vw,40px); }
[data-lbc-home] .h-formats > div:nth-child(3){ margin-top:clamp(36px,4.8vw,80px); }
[data-lbc-home] .h-formats > div:nth-child(4){ margin-top:clamp(54px,7.2vw,120px); }
@media (max-width:1000px){
  [data-lbc-home] .h-formats{ grid-template-columns:repeat(2,1fr) !important; }
  [data-lbc-home] .h-formats > div{ margin-top:0 !important; }
}
@media (max-width:600px){
  [data-lbc-home] .h-formats{ grid-template-columns:1fr !important; }
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-formats > div:hover{ padding-left:0 !important; }
}

/* ============================================================
   Bandeau photographique — une phrase sur une image, à mi-hauteur.
   Même grammaire que .h-video, mais sans lecteur ni clic : c'est une
   respiration, pas une invitation. Utilisé par « Le Conseil ».
   ============================================================ */
[data-lbc-home] .h-band{
  position:relative; height:clamp(420px,58vh,660px);
  overflow:hidden; background:var(--lbc-forest);
}
[data-lbc-home] .h-band__media{ position:absolute; inset:-8% 0; }
/* Pas de `filter` ici : finish.css impose la signature photographique du
   site avec une spécificité (0,4,1) qu'aucune règle de cette feuille ne
   peut atteindre. C'est donc le voile — et lui seul — qui assombrit.
   (Même situation pour .h-hero__media et .h-video__media plus haut : leur
   `brightness` déclaré ne s'applique pas, leurs voiles compensent.) */
[data-lbc-home] .h-band__media img{
  width:100%; height:100%; object-fit:cover; display:block;
}
/* Voile calqué sur celui du hero : multiply + vignette + seconde couche.
   Un simple dégradé à 52 % laissait la photo délavée et la phrase flottait
   dessus au lieu de s'y poser. */
[data-lbc-home] .h-band__veil{
  position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(4,31,28,.74) 0%, rgba(4,31,28,.56) 42%, rgba(4,31,28,.90) 100%),
    radial-gradient(ellipse at 50% 50%, transparent 32%, rgba(4,31,28,.55) 100%);
  mix-blend-mode:multiply;
}
[data-lbc-home] .h-band__veil::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,51,46,.30), rgba(6,51,46,.48));
}
[data-lbc-home] .h-band__inner{
  position:relative; height:100%; display:flex;
  align-items:center; justify-content:center; text-align:center;
  padding:clamp(28px,5vw,60px);
}
[data-lbc-home] .h-band p{
  font-family:var(--font-display); font-style:italic;
  font-size:clamp(23px,3.2vw,46px); line-height:1.26; letter-spacing:-.02em;
  color:var(--lbc-cream); max-width:22ch; margin:0;
}

/* ============================================================
   Page « Les Fondateurs »
   ============================================================ */
[data-lbc-home] .h-founder__grid{
  display:grid; grid-template-columns:.78fr 1.22fr;
  gap:clamp(36px,5vw,96px); align-items:center;
}
/* Le portrait du fondateur est déjà détouré en médaillon dans le
   fichier source : on ne peut pas le recadrer en rectangle sans
   révéler le bord du disque. On assume donc le cercle, en grand. */
[data-lbc-home] .h-medallion{
  width:100%; max-width:min(430px,34vw); aspect-ratio:1/1;
  border-radius:50%; overflow:hidden;
  border:1px solid var(--lbc-gold); background:var(--lbc-forest);
  margin:0 auto 0 0;
}
[data-lbc-home] .h-medallion img{
  width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.12);
}
[data-lbc-home] .h-founder h2{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(44px,6.5vw,104px) !important; line-height:.96 !important;
  letter-spacing:-.042em !important; color:var(--text-heading); margin:14px 0 28px;
}
[data-lbc-home] .h-founder p{
  font-size:clamp(16px,1.4vw,18px); line-height:1.75;
  color:var(--text-body); margin:0 0 18px; max-width:52ch;
}
[data-lbc-home] .h-founder p:last-of-type{ margin-bottom:0; }
[data-lbc-home] .h-founder i{
  display:block; width:56px; height:1px; margin-top:34px;
  background:linear-gradient(90deg,var(--lbc-gold),transparent);
}

/* Les Fondateurs de Territoire : quatre volets, le dernier encore vide. */
[data-lbc-home] .h-people{
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:clamp(20px,2.6vw,38px); margin-top:clamp(48px,6vw,88px); align-items:start;
}
[data-lbc-home] .h-person__ph{
  position:relative; width:100%; aspect-ratio:3/4; overflow:hidden;
  border-radius:var(--radius-md); border:1px solid var(--border-on-dark);
  background:var(--lbc-forest-900);
}
[data-lbc-home] .h-person__ph img:not([data-flag]){
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s var(--ease-quiet);
}
[data-lbc-home] .h-person:hover .h-person__ph img:not([data-flag]){ transform:scale(1.04); }
/* Le drapeau reste visible en permanence : une version antérieure ne le
   montrait qu'au survol, donc jamais sur écran tactile. */
[data-lbc-home] .h-person__ph img[data-flag]{
  position:absolute; left:14px; bottom:14px; z-index:2;
  width:26px; height:auto; border-radius:2px;
  box-shadow:0 2px 7px rgba(0,0,0,.55);
}
[data-lbc-home] .h-person h3{
  font-family:var(--font-display); font-size:clamp(21px,1.9vw,28px);
  color:var(--lbc-cream); margin:22px 0 7px; font-weight:400; line-height:1.1;
}
[data-lbc-home] .h-person__role{
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--lbc-gold); margin:0; padding-right:.2em;
}
[data-lbc-home] .h-person p{ font-size:15px; line-height:1.6; color:var(--text-on-dark-soft); margin:15px 0 0; }
/* Sélecteur composé : .h-person p pèse (0,1,1) et écraserait une classe seule. */
[data-lbc-home] .h-person p.h-person__say{
  font-family:var(--font-display); font-style:italic;
  font-size:15.5px; line-height:1.45; color:var(--lbc-gold);
  margin:17px 0 0; padding-left:14px;
  border-left:1px solid rgba(201,168,76,.38);
}
[data-lbc-home] .h-person--soon .h-person__ph{
  display:flex; align-items:center; justify-content:center; border-style:dashed;
}
[data-lbc-home] .h-person--soon .h-person__ph span{
  font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--text-on-dark-soft);
}
[data-lbc-home] .h-person--soon{ opacity:.62; }

@media (max-width:1000px){
  [data-lbc-home] .h-founder__grid{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-medallion{ margin-inline:auto; }
  [data-lbc-home] .h-people{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:600px){
  [data-lbc-home] .h-people{ grid-template-columns:1fr !important; }
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-person:hover .h-person__ph img:not([data-flag]){ transform:none !important; }
}

/* ============================================================
   Page « Présence »
   ============================================================ */
/* Les huit territoires, développés : deux colonnes de lignes filetées. */
[data-lbc-home] .h-terr{
  display:grid; grid-template-columns:1fr 1fr;
  column-gap:clamp(36px,5vw,88px); margin-top:clamp(44px,5.5vw,80px);
}
[data-lbc-home] .h-terr > div{
  display:flex; gap:clamp(16px,2vw,26px); align-items:baseline;
  padding:clamp(20px,2.4vw,30px) 2px; border-top:1px solid var(--border-quiet);
  transition:border-top-color .35s ease,
             padding-left .35s var(--ease-quiet);
}
[data-lbc-home] .h-terr > div:hover{ border-top-color:var(--lbc-gold); padding-left:10px; }
[data-lbc-home] .h-terr em{
  font-family:var(--font-display); font-style:normal; font-weight:400;
  font-size:clamp(15px,1.3vw,18px); color:var(--lbc-gold); flex:none; width:2.4em;
  font-variant-numeric:tabular-nums lining-nums;
}
[data-lbc-home] .h-terr h3{
  font-family:var(--font-display); font-size:clamp(20px,1.9vw,26px);
  color:var(--text-heading); margin:0 0 5px; font-weight:400; line-height:1.15;
}
[data-lbc-home] .h-terr p{ font-size:15px; line-height:1.6; color:var(--text-muted); margin:0; }

/* Encart sur fond sombre (« Le Sommet »). */
[data-lbc-home] .h-note{
  border:1px solid var(--border-on-dark); border-radius:var(--radius-lg);
  padding:clamp(30px,3.4vw,48px); background:rgba(255,255,255,0.02);
}
[data-lbc-home] .h-note b{
  display:block; font-family:var(--font-display); font-weight:400;
  font-size:clamp(21px,2.1vw,28px); color:var(--lbc-gold); margin-bottom:8px;
}
[data-lbc-home] .h-note span{
  display:block; font-size:11px; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--text-on-dark-soft);
  margin-bottom:22px; padding-right:.22em;
}
[data-lbc-home] .h-note p{ font-size:16px; line-height:1.7; color:var(--lbc-cream); margin:0; }

/* Légende de la carte. */
[data-lbc-home] .h-legend{
  display:flex; flex-wrap:wrap; gap:12px 30px;
  justify-content:center; align-items:center;
  margin-top:clamp(24px,3vw,38px);
}
[data-lbc-home] .h-legend > span{
  display:inline-flex; align-items:center; gap:10px;
  font-size:14px; color:var(--lbc-cream);
}
[data-lbc-home] .h-legend i{
  width:12px; height:12px; border-radius:3px; background:var(--lbc-gold); flex:none;
}

@media (max-width:860px){
  [data-lbc-home] .h-terr{ grid-template-columns:1fr !important; }
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-terr > div:hover{ padding-left:2px !important; }
}

/* Variante claire de .h-adv : le bloc numéroté existait seulement pour
   les fonds sombres. Sur « Ce que le Cercle apporte », la série de
   dix-huit se lit en deux mouvements, l'un clair, l'autre sombre. */
[data-lbc-home] .h-light .h-adv{ border-top-color:var(--border-quiet); }
[data-lbc-home] .h-light .h-adv h3{ color:var(--text-heading); }
[data-lbc-home] .h-light .h-adv p{ color:var(--text-muted); }

/* ============================================================
   Page « Opportunités » — formules et voies d'accès.
   ============================================================ */
[data-lbc-home] .h-plans{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.4vw,32px); align-items:start; margin-top:clamp(38px,4.5vw,64px);
}
[data-lbc-home] .h-pair{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(20px,2.4vw,32px); align-items:start; margin-top:clamp(38px,4.5vw,64px);
}
[data-lbc-home] .h-plan{
  border:1px solid var(--hairline-soft); border-radius:var(--radius-lg);
  background:var(--surface-card); padding:clamp(26px,2.6vw,38px); position:relative;
}
/* ------------------------------------------------------------
   LES TROIS RANGS, CHACUN SON TON
   Brand Book §IV, table des rangs : Silver pétrole profond
   #0F2429 (second ton #143036), Gold Vert 900 #04211C (second
   ton #06332E), VIP améthyste nuit #20112C (second ton #2A1738).
   Les seconds tons de Silver et de VIP sont écrits en
   hexadécimal et non calculés : exception assumée au Brand Book,
   ils viennent des encadrés des emails et doivent leur
   correspondre au pixel.
   Le dégradé est celui de l'espace membre, au degré près —
   membres/index.html:165 — pour que la carte publique et la
   porte du vestibule ne divergent jamais.
   ------------------------------------------------------------ */
[data-lbc-home]{
  --rang-silver:#0F2429;  --rang-silver2:#143036;
  --rang-gold:#04211C;    --rang-gold2:#06332E;
  --rang-vip:#20112C;     --rang-vip2:#2A1738;
}
[data-lbc-home] .h-plan--silver{
  background:linear-gradient(168deg,var(--rang-silver2),var(--rang-silver) 68%);
  border-color:rgba(157,181,168,.26);
}
/* La formule mise en avant s'inverse : fond le plus sombre, filet doré. */
[data-lbc-home] .h-plan--top{
  background:linear-gradient(168deg,var(--rang-gold2),var(--rang-gold) 68%);
  border-color:var(--lbc-gold);
}
[data-lbc-home] .h-plan--vip{
  background:linear-gradient(168deg,var(--rang-vip2),var(--rang-vip) 68%);
  border-color:rgba(201,168,76,.42);
}
[data-lbc-home] .h-plan__flag{
  position:absolute; top:-11px; left:50%; transform:translateX(-50%);
  background:var(--lbc-gold); color:var(--lbc-ink);
  font-size:10px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  padding:5px 14px; border-radius:var(--radius-pill); white-space:nowrap;
}
[data-lbc-home] .h-plan__kicker{
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--text-muted); margin:0; padding-right:.2em;
}
[data-lbc-home] .h-plan--top .h-plan__kicker{ color:var(--lbc-gold); }
[data-lbc-home] .h-plan h3,
[data-lbc-home] .h-pcard h3{
  font-family:var(--font-display); font-size:clamp(23px,2.2vw,30px);
  color:var(--text-heading); margin:9px 0 8px; font-weight:400; line-height:1.14;
}
[data-lbc-home] .h-plan--top h3{ color:var(--lbc-cream); }
[data-lbc-home] .h-plan__lead{ font-size:14.5px; line-height:1.6; color:var(--text-muted); margin:0 0 24px; }
[data-lbc-home] .h-plan--top .h-plan__lead{ color:var(--text-on-dark-soft); }
[data-lbc-home] .h-plan ul,
[data-lbc-home] .h-pcard ul{
  list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;
}
[data-lbc-home] .h-plan li,
[data-lbc-home] .h-pcard li{
  display:flex; gap:11px; align-items:baseline;
  font-size:14px; line-height:1.55; color:var(--text-body);
}
[data-lbc-home] .h-plan--top li{ color:var(--lbc-cream); }
/* ------------------------------------------------------------
   Le texte des trois cartes sombres.
   Ces règles doivent venir APRÈS les règles de base : à
   spécificité égale, c'est l'ordre du fichier qui tranche, et
   déclarées plus haut elles étaient éteintes — la carte Silver
   tombait à 1,17:1.
   Le sur-titre passe de l'or #B8963F à l'or clair #D2B978 :
   mesuré sur les trois fonds, l'or sombre plafonnait à 2,7:1,
   sous le seuil de 4,5:1. C'était déjà le cas de Gold avant
   que Silver et VIP prennent leur ton.
   ------------------------------------------------------------ */
[data-lbc-home] .h-plan--silver h3,
[data-lbc-home] .h-plan--vip h3{ color:var(--lbc-cream); }
[data-lbc-home] .h-plan--silver .h-plan__lead,
[data-lbc-home] .h-plan--vip .h-plan__lead{ color:var(--text-on-dark-soft); }
[data-lbc-home] .h-plan--silver li,
[data-lbc-home] .h-plan--vip li{ color:var(--lbc-cream); }
[data-lbc-home] .h-plan--top .h-plan__kicker,
[data-lbc-home] .h-plan--silver .h-plan__kicker,
[data-lbc-home] .h-plan--vip .h-plan__kicker{ color:#D2B978; }
[data-lbc-home] .h-plan--silver li::before,
[data-lbc-home] .h-plan--vip li::before,
[data-lbc-home] .h-plan--top li::before{ color:#D2B978; }

/* ------------------------------------------------------------
   LES TROIS VOIES PARTENAIRES, CHACUNE SON TON
   Le Brand Book donnait l'améthyste aux partenariats, puis l'a
   réservée à l'hôte d'honneur — « un ton, un sujet ». Les voies
   partenaires n'ont donc plus de ton attribué. Les trois
   ci-dessous sont pris dans la famille, chacun sur le métier de
   la carte, et aucun n'est déjà servi sur cette grille :

   · Sponsor      brun doré #1A1106, le ton de la Conciergerie.
                  Même métier : livrer du service et de
                  l'expérience au membre.
   · Expert       bleu de plan #11122C, le ton de l'Atelier.
                  « Le calque et le bleu de travail » : le monde
                  du chantier et du savoir-faire.
   · Ambassadeur  terre cuite #2D1913, le ton des Collaborations
                  entre membres. Il met des gens en rapport.

   À porter au Brand Book si validés. Les seconds tons sont
   calculés en color-mix depuis la base et l'ivoire de la maison,
   jamais écrits en hexadécimal.
   ------------------------------------------------------------ */
[data-lbc-home]{
  --voie-sponsor:#1A1106;
  --voie-expert:#11122C;
  --voie-ambassadeur:#2D1913;
}
[data-lbc-home] .h-pcard--sponsor,
[data-lbc-home] .h-pcard--expert,
[data-lbc-home] .h-plan--ambassadeur{ border-color:rgba(201,168,76,.34); }
[data-lbc-home] .h-pcard--sponsor .h-pcard__in{
  background:linear-gradient(168deg,
    color-mix(in srgb, var(--voie-sponsor) 76%, var(--lbc-cream)),
    var(--voie-sponsor) 68%);
}
[data-lbc-home] .h-pcard--expert .h-pcard__in{
  background:linear-gradient(168deg,
    color-mix(in srgb, var(--voie-expert) 76%, var(--lbc-cream)),
    var(--voie-expert) 68%);
}
[data-lbc-home] .h-plan--ambassadeur{
  background:linear-gradient(168deg,
    color-mix(in srgb, var(--voie-ambassadeur) 76%, var(--lbc-cream)),
    var(--voie-ambassadeur) 68%);
}
/* Le texte des trois cartes, sur leur fond sombre. */
[data-lbc-home] .h-pcard--sponsor h3,
[data-lbc-home] .h-pcard--expert h3,
[data-lbc-home] .h-plan--ambassadeur h3{ color:var(--lbc-cream); }
[data-lbc-home] .h-pcard--sponsor .h-plan__lead,
[data-lbc-home] .h-pcard--expert .h-plan__lead,
[data-lbc-home] .h-plan--ambassadeur .h-plan__lead{ color:var(--text-on-dark-soft); }
[data-lbc-home] .h-pcard--sponsor li,
[data-lbc-home] .h-pcard--expert li,
[data-lbc-home] .h-plan--ambassadeur li{ color:var(--lbc-cream); }
[data-lbc-home] .h-pcard--sponsor .h-plan__kicker,
[data-lbc-home] .h-pcard--expert .h-plan__kicker,
[data-lbc-home] .h-plan--ambassadeur .h-plan__kicker,
[data-lbc-home] .h-pcard--sponsor .h-sub,
[data-lbc-home] .h-pcard--expert .h-sub,
[data-lbc-home] .h-plan--ambassadeur .h-sub,
[data-lbc-home] .h-pcard--sponsor li::before,
[data-lbc-home] .h-pcard--expert li::before,
[data-lbc-home] .h-plan--ambassadeur li::before{ color:#D2B978; }
[data-lbc-home] .h-pcard--sponsor .h-crit,
[data-lbc-home] .h-pcard--expert .h-crit,
[data-lbc-home] .h-plan--ambassadeur .h-crit{
  color:var(--text-on-dark-soft); border-top-color:rgba(242,237,227,.18);
}
[data-lbc-home] .h-pcard--sponsor .h-crit b,
[data-lbc-home] .h-pcard--expert .h-crit b,
[data-lbc-home] .h-plan--ambassadeur .h-crit b{ color:var(--lbc-cream); }
[data-lbc-home] .h-plan li::before,
[data-lbc-home] .h-pcard li::before{ content:"—"; color:var(--lbc-gold); flex:none; }
[data-lbc-home] .h-arrows li::before{ content:"→"; }
/* Pastille « Nouveau » */
[data-lbc-home] .h-new{
  display:inline-block; font-size:9px; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--lbc-ink); background:var(--lbc-gold);
  padding:2px 7px; border-radius:var(--radius-pill); margin-left:6px; white-space:nowrap;
}
/* Carte partenaire, coiffée d'une photographie */
[data-lbc-home] .h-pcard{
  border:1px solid var(--hairline-soft); border-radius:var(--radius-lg);
  background:var(--surface-card); overflow:hidden;
}
[data-lbc-home] .h-pcard > img{
  width:100%; height:clamp(170px,17vw,225px); object-fit:cover; display:block;
}
[data-lbc-home] .h-pcard__in{ padding:clamp(26px,2.6vw,38px); }
[data-lbc-home] .h-sub{
  font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--text-muted); margin:24px 0 13px; padding-right:.2em;
}
[data-lbc-home] .h-sub--gold{ color:var(--lbc-gold); }
[data-lbc-home] .h-crit{
  margin-top:24px; padding-top:18px; border-top:1px solid var(--border-quiet);
  font-size:13px; line-height:1.55; color:var(--text-muted);
}
[data-lbc-home] .h-crit b{ color:var(--text-body); font-weight:600; }
/* Voie unique : une seule carte, centrée */
[data-lbc-home] .h-solo{ max-width:760px; margin:clamp(38px,4.5vw,64px) auto 0; }
[data-lbc-home] .h-solo .h-cols{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(26px,3vw,44px); }

@media (max-width:1000px){
  [data-lbc-home] .h-plans{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-pair{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-solo .h-cols{ grid-template-columns:1fr !important; }
}

/* Onglet actif sur fond clair : la règle .h-cases d'origine visait la
   section sombre de « Mise en relation ». Sur crème, le doré tombe à
   1,87:1 — on bascule sur le doré assombri prévu par lux.css (5,16:1). */
[data-lbc-home] .h-light.h-cases button[data-active="1"]{
  color:var(--text-gold-on-light) !important;
  border-color:var(--text-gold-on-light) !important;
}

/* ============================================================
   Page « Témoignages »
   ============================================================ */
/* Vignettes vidéo : façade cliquable, l'iframe n'arrive qu'au clic. */
[data-lbc-home] .h-vids{
  columns:300px; column-gap:clamp(16px,1.8vw,24px);
  margin-top:clamp(38px,4.5vw,64px);
}
[data-lbc-home] .h-vid{ break-inside:avoid; margin:0 0 clamp(22px,2.6vw,34px); }
[data-lbc-home] .h-vid__frame{
  position:relative; width:100%; overflow:hidden; cursor:pointer;
  background:var(--lbc-forest); border:1px solid var(--hairline-soft);
  border-radius:var(--radius-md);
}
[data-lbc-home] .h-vid__frame img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s var(--ease-quiet);
}
[data-lbc-home] .h-vid__frame:hover img{ transform:scale(1.04); }
[data-lbc-home] .h-vid__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
[data-lbc-home] .h-vid__play{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:64px; height:64px; border-radius:50%; z-index:2;
  background:rgba(6,51,46,.5); border:1px solid var(--lbc-gold);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .35s ease, transform .35s var(--ease-quiet);
}
[data-lbc-home] .h-vid__frame:hover .h-vid__play{
  background:rgba(201,168,76,.22); transform:translate(-50%,-50%) scale(1.06);
}
[data-lbc-home] .h-vid__play i{
  width:0; height:0; margin-left:4px; border-style:solid;
  border-width:10px 0 10px 17px;
  border-color:transparent transparent transparent var(--lbc-gold);
}
[data-lbc-home] .h-vid__frame:focus-visible{ outline:2px solid var(--lbc-gold); outline-offset:3px; }
[data-lbc-home] .h-vid figcaption{ margin:16px 2px 0; }
[data-lbc-home] .h-vid figcaption p{
  font-family:var(--font-display); font-style:italic;
  font-size:16px; line-height:1.55; color:var(--text-heading); margin:0 0 12px;
}
/* Restreint à la légende : sans `figcaption`, ce sélecteur (0,1,1)
   attrapait aussi .h-vid__play — un <span> — et écrasait son
   display:flex (0,1,0), décentrant le triangle du bouton. */
[data-lbc-home] .h-vid figcaption b{
  display:block; font-family:var(--font-display); font-size:19px;
  color:var(--text-heading); font-weight:400;
}
[data-lbc-home] .h-vid figcaption span{ display:block; font-size:13px; color:var(--text-muted); margin-top:3px; }

/* Témoignages écrits, sur fond sombre. */
[data-lbc-home] .h-says{
  columns:330px; column-gap:clamp(16px,1.8vw,24px);
  margin-top:clamp(38px,4.5vw,64px);
}
[data-lbc-home] .h-say{
  break-inside:avoid; margin:0 0 clamp(18px,2.2vw,26px);
  border:1px solid var(--border-on-dark); border-radius:var(--radius-md);
  padding:clamp(26px,2.6vw,36px); background:rgba(255,255,255,0.02);
  transition:border-color .35s ease;
}
[data-lbc-home] .h-say:hover{ border-color:var(--lbc-gold); }
[data-lbc-home] .h-say > i{
  display:block; font-family:var(--font-display); font-style:normal;
  font-size:46px; line-height:.4; height:24px; color:var(--lbc-gold);
}
[data-lbc-home] .h-say p{ font-size:15px; line-height:1.7; color:var(--lbc-cream); margin:20px 0 20px; }
[data-lbc-home] .h-say b{
  display:block; font-family:var(--font-display); font-size:18px;
  color:var(--lbc-cream); font-weight:400;
}
[data-lbc-home] .h-say span{ display:block; font-size:13px; color:var(--text-on-dark-soft); margin-top:3px; }
[data-lbc-home] .h-say__who{ display:flex; align-items:center; gap:14px; margin-bottom:4px; }
[data-lbc-home] .h-say__who img{
  width:56px; height:56px; border-radius:50%; object-fit:cover;
  border:1px solid var(--lbc-gold); flex:none;
}
/* Attribution sous une citation pleine page. */
[data-lbc-home] .h-quote cite{
  display:block; font-style:normal; margin-top:clamp(26px,3vw,42px);
  font-size:12px; font-weight:600; letter-spacing:.24em; text-transform:uppercase;
  color:var(--lbc-gold); padding-right:.24em;
}

@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-vid__frame:hover img{ transform:none !important; }
  [data-lbc-home] .h-vid__frame:hover .h-vid__play{ transform:translate(-50%,-50%) !important; }
}

/* ============================================================
   Page « Le Journal »
   ============================================================ */
[data-lbc-home] .h-chips{
  display:flex; flex-wrap:wrap; gap:10px; justify-content:center;
  margin-top:clamp(30px,3.5vw,48px);
}
/* L'article à la une : image large, texte à droite. */
[data-lbc-home] .h-feat{
  display:grid; grid-template-columns:1.12fr .88fr;
  gap:clamp(30px,4vw,64px); align-items:center;
  margin-top:clamp(38px,4.5vw,64px); text-decoration:none;
}
[data-lbc-home] .h-feat img{
  width:100%; aspect-ratio:3/2; object-fit:cover;
  border-radius:12px; border:1px solid var(--hairline-soft);
}
[data-lbc-home] .h-feat h2{
  font-family:var(--font-display); font-size:clamp(27px,3.1vw,44px) !important;
  line-height:1.14 !important; letter-spacing:-.024em !important;
  color:var(--text-heading); font-weight:400; margin:0 0 16px;
}
[data-lbc-home] .h-feat p{ font-size:17px; line-height:1.7; color:var(--text-muted); margin:0 0 26px; max-width:46ch; }

/* La grille des articles. */
[data-lbc-home] .h-posts{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(26px,3vw,44px);
  margin-top:clamp(44px,5vw,76px);
  padding-top:clamp(44px,5vw,76px); border-top:1px solid var(--border-quiet);
}
[data-lbc-home] .h-post{ text-decoration:none; display:block; }
[data-lbc-home] .h-post img{
  width:100%; aspect-ratio:3/2; object-fit:cover;
  border-radius:10px; border:1px solid var(--hairline-soft);
  transition:transform .8s var(--ease-quiet);
}
[data-lbc-home] .h-post__media{ overflow:hidden; border-radius:10px; }
[data-lbc-home] .h-post:hover img{ transform:scale(1.035); }
[data-lbc-home] .h-post h3{
  font-family:var(--font-display); font-size:clamp(20px,1.8vw,24px);
  line-height:1.24; color:var(--text-heading); margin:0 0 10px; font-weight:400;
  transition:color .3s ease;
}
[data-lbc-home] .h-post:hover h3{ color:var(--lbc-forest); }
[data-lbc-home] .h-post p{ font-size:15px; line-height:1.62; color:var(--text-muted); margin:0; }

/* Ligne de rubrique commune à l'article à la une et aux cartes. */
[data-lbc-home] .h-post__meta,
[data-lbc-home] .h-feat__meta{
  display:flex; align-items:center; gap:12px; margin:20px 0 12px;
}
[data-lbc-home] .h-feat__meta{ margin:0 0 18px; }
[data-lbc-home] .h-post__meta em,
[data-lbc-home] .h-feat__meta em{
  font-style:normal; font-size:11px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--text-gold-on-light); padding-right:.2em;
}
[data-lbc-home] .h-post__meta span,
[data-lbc-home] .h-feat__meta span{ font-size:13px; color:var(--text-muted); }
[data-lbc-home] .h-read{
  display:inline-flex; align-items:center; gap:.5em;
  color:var(--text-heading); font-size:15px; font-weight:600;
  border-bottom:1px solid var(--hairline); padding-bottom:5px;
  transition:border-color .3s ease, color .3s ease;
}
[data-lbc-home] .h-feat:hover .h-read{ border-color:var(--lbc-gold); color:var(--lbc-forest); }
[data-lbc-home] .h-empty{
  display:none; text-align:center; font-size:16px; color:var(--text-muted);
  margin:clamp(44px,5vw,76px) 0 0; font-style:italic;
}

@media (max-width:1000px){
  [data-lbc-home] .h-feat{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-posts{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:640px){
  [data-lbc-home] .h-posts{ grid-template-columns:1fr !important; }
}
@media (prefers-reduced-motion: reduce){
  [data-lbc-home] .h-post:hover img{ transform:none !important; }
}

/* ============================================================
   Page « Collaborations » — les histoires, en alternance.
   ============================================================ */
[data-lbc-home] .h-stories{
  display:flex; flex-direction:column;
  gap:clamp(60px,7.5vw,132px); margin-top:clamp(48px,6vw,88px);
}
[data-lbc-home] .h-story{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(32px,4.5vw,80px); align-items:center;
}
/* Une histoire sur deux inverse ses colonnes : la page respire au lieu
   d'empiler cinq blocs identiques. */
[data-lbc-home] .h-story:nth-child(even) .h-story__media{ order:2; }
[data-lbc-home] .h-story__media img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:12px; border:1px solid var(--hairline-soft);
}
[data-lbc-home] .h-story em{
  display:block; font-style:normal; font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--text-gold-on-light); padding-right:.2em;
}
[data-lbc-home] .h-story h3{
  font-family:var(--font-display); font-size:clamp(28px,3.4vw,50px);
  line-height:1.1; letter-spacing:-.028em; color:var(--text-heading);
  font-weight:400; margin:14px 0 18px; max-width:18ch;
}
[data-lbc-home] .h-story p{ font-size:clamp(15.5px,1.35vw,17.5px); line-height:1.72; color:var(--text-muted); margin:0; max-width:50ch; }
[data-lbc-home] .h-story__figs{
  display:flex; flex-wrap:wrap; gap:clamp(28px,4vw,64px);
  margin-top:clamp(28px,3.2vw,44px); padding-top:clamp(22px,2.6vw,34px);
  border-top:1px solid var(--border-quiet);
}
[data-lbc-home] .h-story__fig b{
  display:block; font-family:var(--font-display); font-weight:400;
  font-size:clamp(34px,4vw,60px); line-height:1; letter-spacing:-.035em;
  color:var(--lbc-forest); font-variant-numeric:tabular-nums lining-nums;
}
[data-lbc-home] .h-story__fig span{ display:block; font-size:14px; line-height:1.45; color:var(--text-muted); margin-top:10px; }
[data-lbc-home] .h-note-quiet{
  margin:clamp(48px,6vw,88px) 0 0; padding-top:clamp(24px,3vw,40px);
  border-top:1px solid var(--border-quiet);
  font-size:14px; font-style:italic; color:var(--text-muted); text-align:center;
}

@media (max-width:1000px){
  [data-lbc-home] .h-story{ grid-template-columns:1fr !important; }
  [data-lbc-home] .h-story:nth-child(even) .h-story__media{ order:0 !important; }
}

/* ============================================================
   CARTE — CADRAGE ET COMMANDES
   ============================================================ */
[data-lbc-home] .h-map__views{
  position:absolute; left:clamp(12px,1.6vw,22px); bottom:clamp(12px,1.6vw,22px);
  z-index:5; display:flex; gap:6px;
  background:rgba(4,31,28,.72); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(184,150,63,.28); border-radius:var(--radius-pill); padding:4px;
}
[data-lbc-home] .h-map__views button{
  font-family:var(--font-body); font-size:12px; letter-spacing:.06em;
  color:var(--lbc-cream); background:transparent; border:0; cursor:pointer;
  padding:7px 15px; border-radius:var(--radius-pill);
  transition:background-color .3s ease, color .3s ease;
}
[data-lbc-home] .h-map__views button:hover{ background:rgba(184,150,63,.16); }
[data-lbc-home] .h-map__views button[aria-pressed="true"]{
  background:var(--lbc-gold); color:var(--lbc-forest-900); font-weight:600;
}
[data-lbc-home] .h-map__views button:focus-visible{ outline:2px solid var(--lbc-gold); outline-offset:2px; }

/* Vue lointaine : sept villes dans 3 % de la largeur. Les noms se
   superposeraient tous — on ne garde que les points, le nom revient
   dès qu'on s'approche. */
[data-lbc-home] .h-map.is-far .h-pin span{
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
[data-lbc-home] .h-map.is-far .h-pin b{ width:9px; height:9px; }
[data-lbc-home] .h-map.is-far .h-pin--major b{ width:11px; height:11px; }
[data-lbc-home] .h-map .h-pin span{ transition:opacity .3s ease .1s; }
/* Le cadre s'anime : la transition CSS sur left/top ferait double
   emploi avec le calcul par image et produirait un flottement. */
[data-lbc-home] .h-map .h-pin{ transition:opacity .5s var(--ease-quiet), scale .5s var(--ease-quiet); }

@media (max-width:620px){
  [data-lbc-home] .h-map__views{ left:50%; translate:-50% 0; }
  [data-lbc-home] .h-map__views button{ padding:7px 11px; font-size:11px; }
}


/* La carte du monde dans un bandeau de 124 px de haut ne montre rien.
   Sur petit écran on la redresse : le monde y reste lisible comme une
   silhouette, et les cadrages rapprochés deviennent utilisables. */
@media (max-width:820px){
  [data-lbc-home] .h-map{ aspect-ratio:3580/1990; }
}
@media (max-width:520px){
  [data-lbc-home] .h-map{ aspect-ratio:3580/2600; }
}

/* La carte détaillée d'origine s'arrêtait à 10° de latitude sud :
   l'Afrique était coupée sous le Sahel, l'Amérique du Sud absente. On
   pose dessous une silhouette du monde entier, sans contour — elle
   comble ce qui manque, et là où le tracé détaillé existe, c'est lui
   qu'on voit puisqu'il porte le liseré. */
[data-lbc-home] .h-map__land [data-monde] path{
  stroke:none; fill:var(--lbc-forest-600);
}

/* --- LES CONTACTS ------------------------------------------------
   Sept pays où le Cercle a des relais sans y être implanté. Ils
   doivent se voir sans jamais disputer la vedette aux huit
   territoires : point creux au lieu de plein, plus petit, plus pâle.
   La hiérarchie se lit d'un coup d'œil, sans légende. */
[data-lbc-home] .h-pin--contact{ cursor:default; }
[data-lbc-home] .h-pin--contact b{
  width:8px; height:8px; background:transparent;
  border:1.5px solid var(--lbc-gold-soft, #D2B978);
  box-shadow:none; opacity:.85;
}
[data-lbc-home] .h-pin--contact span{
  font-size:11px; letter-spacing:.05em;
  color:var(--lbc-forest-100); opacity:.75;
}
[data-lbc-home] .h-map.is-far .h-pin--contact b{ width:6px; height:6px; }
[data-lbc-home] .h-legend__c i{
  background:transparent !important;
  border:1.5px solid var(--lbc-gold-soft, #D2B978);
}
[data-lbc-home] .h-legend{ display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; }


/* La couleur du pays porte désormais l'information : le point n'a plus
   qu'à marquer la ville, il peut donc s'alléger. */
[data-lbc-home] .h-map .h-pin b{ width:9px; height:9px; box-shadow:0 0 0 4px rgba(201,168,76,.14); }
[data-lbc-home] .h-map .h-pin--major b{ width:11px; height:11px; box-shadow:0 0 0 5px rgba(201,168,76,.20); }
/* La pastille de légende reprend exactement la teinte des pays. */
[data-lbc-home] .h-legend > span:first-child i{
  background:color-mix(in srgb, var(--lbc-gold) 46%, var(--lbc-forest-800)) !important;
  border:1px solid color-mix(in srgb, var(--lbc-gold) 70%, transparent);
}


/* --- L'AURA DES HUIT TERRITOIRES ----------------------------------
   En vue mondiale, six des huit pays tiennent dans un pouce carré
   d'Europe : à cette échelle, aucune teinte ne se lit. La légende
   promettait pourtant une couleur, et l'on ne voyait que des points
   dorés empilés — la carte disait « huit villes » là où elle voulait
   dire « huit pays ».

   Deux gestes, dans cet ordre d'importance. D'abord le point rétrécit
   (voir plus bas) : c'est lui qui masquait le pays, pas le pays qui
   manquait de couleur. Ensuite, une aura d'or très basse posée autour
   des tracés, dessinée en pixels d'écran et jamais en unités de carte
   — elle grossit la tache sans grossir le pays, et reste donc
   géographiquement muette. Assez pour qu'Andorre et le Luxembourg,
   trois pixels à eux deux, cessent de disparaître ; pas assez pour
   virer au néon, ce que les premières valeurs faisaient. */
[data-lbc-home] .h-map__terr{
  filter:drop-shadow(0 0 2px rgba(201,168,76,.5))
         drop-shadow(0 0 7px rgba(201,168,76,.3));
  transition:filter .45s var(--ease-quiet);
}
[data-lbc-home] .h-map:not(.is-far) .h-map__terr{
  filter:drop-shadow(0 0 2px rgba(201,168,76,.28));
}

/* De près, le point marque la ville sur un pays déjà coloré. De loin,
   le pays n'est qu'un grain de quelques pixels : le point et son
   anneau le recouvraient entièrement, et c'est le point qu'on lisait
   à la place du territoire. On le réduit à un cœur clair, sans
   anneau — il reste visible, cliquable, et cesse de masquer ce qu'il
   désigne. Les sept contacts gardent leur point creux : eux n'ont pas
   de tracé sous le pied, le point est tout ce qu'ils ont. */
[data-lbc-home] .h-map.is-far .h-pin:not(.h-pin--contact) b{
  width:4px; height:4px; box-shadow:none;
  background:color-mix(in srgb, var(--lbc-gold) 82%, #FFF6DC);
}

/* --- LA CARTE SUR TÉLÉPHONE ---------------------------------------
   Trois cents pixels de large : le cadrage d'ouverture passe à
   l'Europe (voir home.js), et il faut lui laisser de la place.

   Les noms d'épingles, eux, s'empilaient les uns sur les autres —
   six villes dans un pouce. On les retire ici : les huit pays sont
   nommés, numérotés et décrits juste en dessous de la carte, la
   redondance ne valait pas l'illisibilité. Le nom revient dès que
   l'écran s'élargit. */
@media (max-width:620px){
  [data-lbc-home] .h-map .h-pin span{ opacity:0; pointer-events:none; }
  /* Sans cela « Le monde » passe à la ligne et la commande, haute de
     deux étages, mange le cinquième bas de la carte. */
  [data-lbc-home] .h-map__views button{ white-space:nowrap; }
}
@media (max-width:520px){
  [data-lbc-home] .h-map{ aspect-ratio:3580/3300; }
}

/* --- LES SEPT PAYS DE CONTACT --------------------------------------
   Ils n'avaient qu'un point creux : sur une carte où les huit
   territoires portent une couleur, être signalé par un point revenait
   à ne pas être un pays. Ils sont maintenant tracés dans le fond
   lui-même, d'une seule et même source — voir la note en tête du SVG
   de Presence.html.

   Le piège de ce remplissage, c'est que la surface d'un pays n'a rien
   à voir avec sa place dans le Cercle : les sept contacts comptent
   trois des plus grands pays du monde, les huit territoires comptent
   Andorre et le Luxembourg. Toute teinte plus CLAIRE que la terre
   donnait donc le plus de poids visuel à la catégorie la moins
   importante — l'Amérique du Nord tirait l'oeil avant l'Europe. On a
   essayé le gris pâle, l'argent soutenu, l'ardoise : tous avançaient.

   D'où ce bleu très retenu, posé à la VALEUR de la terre et non
   au-dessus : la teinte change, la clarté non. Les sept se lisent
   comme une autre couleur, sans jamais passer devant l'or — qui reste
   la seule chose vive de la carte. Le bleu, enfin, plutôt qu'une
   seconde teinte chaude : deux ors se seraient disputé la vedette.

   Le remplissage est mélangé à la terre, jamais à du transparent :
   ces pays sont dans la couche du fond, un alpha laisserait voir au
   travers de la carte. */
/* Déclarées sur la page, pas sur la carte : la légende est en dehors
   du cadre et n'hériterait de rien. */
[data-lbc-home]{
  --contact:      color-mix(in srgb, #6E9DBE 16%, var(--lbc-forest-700));
  --contact-vif:  color-mix(in srgb, #6E9DBE 30%, var(--lbc-forest-700));
  --contact-filet:color-mix(in srgb, #9CC4DE 48%, transparent);
}
[data-lbc-home] .h-map__k{
  fill:var(--contact); stroke:var(--contact-filet);
  stroke-width:1; vector-effect:non-scaling-stroke;
  transition:fill .45s var(--ease-quiet), stroke .45s ease;
}
[data-lbc-home] .h-map__k.is-on{
  fill:var(--contact-vif);
  stroke:color-mix(in srgb, #9CC4DE 78%, transparent);
}

/* Le point du contact reprend la teinte de son pays : sans cela il
   restait doré, et la carte annonçait deux couleurs tout en en
   montrant trois. */
[data-lbc-home] .h-pin--contact b{
  border-color:color-mix(in srgb, #9CC4DE 72%, transparent);
  opacity:1;
}
[data-lbc-home] .h-pin--contact:hover b,
[data-lbc-home] .h-pin--contact:focus-visible b{
  border-color:#B9D6E8;
  box-shadow:0 0 0 6px color-mix(in srgb, #9CC4DE 14%, transparent);
}
/* La pastille de légende reprend exactement la teinte des sept. */
[data-lbc-home] .h-legend__c i,
[data-lbc-home] .h-legend > span:last-child i{
  background:var(--contact) !important;
  border:1.5px solid var(--contact-filet) !important;
}

/* Les points de la carte faisaient 19 à 21 px de haut. Le remplissage
   vertical élargit la zone atteignable sans rien déplacer : l'épingle
   est centrée par translate(-50%,-50%), un remplissage symétrique
   grandit donc autour du même point. */
[data-lbc-home] .h-pin{ padding:5px 0; }