
/* lrs-zn v3.6 (17/09/2026) : le radar ne fait plus travailler le processeur. Hors ecran, toutes ses animations
   sont en pause (classe is-hors posee par le script) ; l'onde grandit par une mise a l'echelle au lieu du rayon r
   (trait de 2,4 qui grandit avec elle : 1,2 a mi-course, comme les 1,4 d'avant a l'oeil) ;
   les villes du rail s'allument par l'opacite d'un calque (fond, filet, halo du point) au lieu des couleurs, des
   bordures et de l'ombre. Meme dessin, meme boucle de 8 s.
   lrs-zn v3.5 (14/09/2026) : infobulle sobre au-dessus de chaque point (fondu 120 / 110 ms, ni glissement ni compteur ni
   onde ; sous 900 px sans la photo) ; v3.4 : photo 16:9 de la ville (uploads/lorents/villes/, prechargees au premier survol
   du rail), sans filet orange ; v3.3 : une carte par ville, Nancy =
   notre base ; v3.2 : Verdun ajoute au radar a l'echelle (78 km, nord-ouest), bulle liee au titre (retiree).
   v3 (12/09/2026), v3.1 rail anime : deux colonnes egales, radar a gauche ; a droite surtitre, titre, texte et rail des villes.
   Le bloc titre lrs-tt vit desormais dans le module : ses regles de page (toplines, rythme, echelle mobile) s'appliquent,
   et ce qui dependait du style de l'ancien widget titre est restitue ici. Sous 900 px : titre, radar, texte, rail. */
.lrs-zn.lrs-zn{--c:var(--lrs-accent,#E07A4A);--c2:var(--lrs-accent-lit,#E07A4A);--pp:var(--lrs-paper,#F6F1EC);--tn:var(--lrs-tint,246,241,236);
  font-family:var(--lrs-text,'Montserrat',-apple-system,'Helvetica Neue',Arial,sans-serif);
  display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "map" "tx";row-gap:26px;
  width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;color:var(--pp);text-align:left}
.lrs-zn.lrs-zn *{box-sizing:border-box}
@media(min-width:900px){
  .lrs-zn.lrs-zn{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr auto auto 1fr;
    grid-template-areas:"map ." "map head" "map tx" "map .";column-gap:clamp(40px,5vw,96px);row-gap:0}
}

/* colonne gauche : le radar */
.lrs-zn__map.lrs-zn__map{grid-area:map;align-self:center;justify-self:center;width:100%;max-width:300px}
@media(min-width:600px){.lrs-zn__map.lrs-zn__map{max-width:380px}}
@media(min-width:900px){.lrs-zn__map.lrs-zn__map{max-width:500px}}
.lrs-zn.lrs-zn svg{width:100%;height:auto;display:block;overflow:visible}
.lrs-zn__ring.lrs-zn__ring{fill:none;stroke:rgba(var(--tn),.22);stroke-width:1}
.lrs-zn__sweep.lrs-zn__sweep{transform-origin:200px 200px;animation:lrs-zn-turn 7s linear infinite}
@keyframes lrs-zn-turn{to{transform:rotate(360deg)}}
.lrs-zn__city.lrs-zn__city{fill:var(--c2)}
.lrs-zn__hub.lrs-zn__hub{fill:var(--c)}
.lrs-zn__pulse.lrs-zn__pulse{fill:none;stroke:var(--c);stroke-width:2.4;transform-origin:200px 200px;
  transform:scale(.05);opacity:0;animation:lrs-zn-onde 3.4s ease-out infinite}
@keyframes lrs-zn-onde{from{transform:scale(.05);opacity:.85}to{transform:scale(1);opacity:0}}
.lrs-zn.lrs-zn text{font-family:var(--lrs-text,'Montserrat',sans-serif);font-size:13px;font-weight:500;fill:rgba(var(--tn),.8)}
.lrs-zn.lrs-zn .lrs-zn__hubtx{font-weight:700;fill:var(--pp);font-size:15px;letter-spacing:.06em}
.lrs-zn.lrs-zn .lrs-zn__km{font-size:11px;font-weight:600;fill:rgba(var(--tn),.5);letter-spacing:.12em}

/* colonne droite : le bloc titre, aligne a gauche (le kit centre tout titre de section et met lrs-tt a 80 %) */
html body .lrs-zn.lrs-zn .lrs-tt.lrs-tt{grid-area:head;width:auto;max-width:none;margin:0;text-align:left;color:var(--pp);container-type:inline-size}
html body .lrs-zn.lrs-zn .lrs-tt__sur.lrs-tt__sur{justify-content:flex-start;text-align:left}
html body .lrs-zn.lrs-zn .lrs-tt__sur.lrs-tt__sur::after{display:none}
html body .lrs-zn.lrs-zn .lorents-gradient-h2.lorents-gradient-h2{text-align:left !important;align-self:auto !important;margin-left:0 !important;margin-right:0 !important}
html body .lrs-zn.lrs-zn .lorents-gradient-h2.lorents-gradient-h2 .elementor-heading-title{text-align:left !important}
.lrs-zn__nw.lrs-zn__nw{white-space:nowrap}
/* en deux colonnes, la seconde ligne du titre (7,77 em) doit tenir dans la sienne : l'echelle du kit est gardee,
   plafonnee a 12,3 % de la colonne (64 px des 1 320 px d'ecran, 59 px a 1 280) */
@media(min-width:900px){html body .lrs-zn.lrs-zn .lorents-gradient-h2.lorents-gradient-h2 .elementor-heading-title.elementor-heading-title{font-size:min(clamp(1.7rem, .85rem + 4vw, 4rem), 12.3cqi) !important}}
@media(min-width:900px) and (max-width:1024px){html body .lrs-zn.lrs-zn .lorents-gradient-h2.lorents-gradient-h2 .elementor-heading-title.elementor-heading-title{font-size:min(clamp(2rem, 4.8vw, 3.2rem), 12.3cqi) !important}}
html body .lrs-zn.lrs-zn .lrs-tt__acc.lrs-tt__acc{margin:16px 0 0;max-width:40ch;font-size:19.2px;color:rgba(var(--tn),.72);text-wrap:balance}
@media(max-width:1024px){html body .lrs-zn.lrs-zn .lrs-tt__acc.lrs-tt__acc{font-size:17px}}
@media(max-width:600px){html body .lrs-zn.lrs-zn .lrs-tt__acc.lrs-tt__acc{font-size:15px}}

/* colonne droite : le texte et le rail des villes */
.lrs-zn__tx.lrs-zn__tx{grid-area:tx;display:flex;flex-direction:column;gap:18px;min-width:0}
@media(min-width:900px){.lrs-zn__tx.lrs-zn__tx{margin-top:28px}}
.lrs-zn__lead.lrs-zn__lead{margin:0;max-width:48ch;font-size:17px;line-height:1.65;font-weight:400;color:rgba(var(--tn),.78);text-wrap:pretty}
@media(max-width:1024px){.lrs-zn .lrs-zn__lead.lrs-zn__lead{font-size:16px}}
@media(max-width:600px){.lrs-zn .lrs-zn__lead.lrs-zn__lead{font-size:15px}}
.lrs-zn__lead.lrs-zn__lead b{color:var(--c2);font-weight:600}
.lrs-zn__cities.lrs-zn__cities{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.lrs-zn__cities.lrs-zn__cities li{position:relative;z-index:0;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:99px;
  border:1px solid rgba(var(--tn),.16);background:rgba(var(--tn),.05);font-size:13px;font-weight:500;color:var(--pp);line-height:1}
.lrs-zn__cities.lrs-zn__cities li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c2)}
.lrs-zn__cities.lrs-zn__cities li.lrs-zn__hubc{border-color:rgba(224,122,74,.6);background:rgba(224,122,74,.14);font-weight:700}
.lrs-zn__cities.lrs-zn__cities li.lrs-zn__hubc::before{background:var(--c)}
/* rail des villes (v3.1) : la ville allumee avance d une pastille par seconde, de Nancy a Dijon, boucle de 8 s.
   CSS seul : rien n attend le JavaScript differe par LiteSpeed. Fondu de 0,3 s croise entre deux villes.
   Sans mouvement demande (prefers-reduced-motion), Nancy reste allumee comme avant.
   v3.6 : l'etat allume est un calque (::after, sous le texte et le point) dont seule l'opacite varie ; la pastille
   passe de 0,8 a 1 d'opacite pour eclaircir son texte. Filet et fond de repos a .2 et .0625 : a 0,8 d'opacite,
   ils rendent les .16 et .05 d'avant. Le halo du point (3 px) est dessine dans le calque. */
.lrs-zn__cities.lrs-zn__cities li::after{content:"";position:absolute;z-index:-1;inset:-1px;border-radius:inherit;pointer-events:none;
  border:1px solid rgba(224,122,74,.6);
  background:radial-gradient(circle at 17px 50%,rgba(224,122,74,.28) 0 6px,rgba(224,122,74,0) 6.5px),rgba(224,122,74,.14);
  opacity:0}
@media(prefers-reduced-motion:no-preference){
  .lrs-zn__cities.lrs-zn__cities li{border-color:rgba(var(--tn),.2);background:rgba(var(--tn),.0625);animation:lrs-zn-ville 8s linear infinite backwards}
  .lrs-zn__cities.lrs-zn__cities li.lrs-zn__hubc{font-weight:500;border-color:rgba(var(--tn),.2);background:rgba(var(--tn),.0625)}
  .lrs-zn__cities.lrs-zn__cities li::after{animation:lrs-zn-halo 8s linear infinite backwards}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(2),.lrs-zn__cities.lrs-zn__cities li:nth-child(2)::after{animation-delay:1s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(3),.lrs-zn__cities.lrs-zn__cities li:nth-child(3)::after{animation-delay:2s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(4),.lrs-zn__cities.lrs-zn__cities li:nth-child(4)::after{animation-delay:3s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(5),.lrs-zn__cities.lrs-zn__cities li:nth-child(5)::after{animation-delay:4s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(6),.lrs-zn__cities.lrs-zn__cities li:nth-child(6)::after{animation-delay:5s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(7),.lrs-zn__cities.lrs-zn__cities li:nth-child(7)::after{animation-delay:6s}
  .lrs-zn__cities.lrs-zn__cities li:nth-child(8),.lrs-zn__cities.lrs-zn__cities li:nth-child(8)::after{animation-delay:7s}
}
@keyframes lrs-zn-ville{0%,16.25%,100%{opacity:.8}3.75%,12.5%{opacity:1}}
@keyframes lrs-zn-halo{0%,16.25%,100%{opacity:0}3.75%,12.5%{opacity:1}}
/* v3.6 : hors ecran, plus rien ne tourne */
.lrs-zn.lrs-zn.is-hors *,.lrs-zn.lrs-zn.is-hors *::before,.lrs-zn.lrs-zn.is-hors *::after{animation-play-state:paused !important}
@media(prefers-reduced-motion:reduce){.lrs-zn__sweep.lrs-zn__sweep,.lrs-zn__pulse.lrs-zn__pulse{animation:none}.lrs-zn__pulse.lrs-zn__pulse{display:none}}

/* ---------- v3.5 : l'infobulle des distances, au-dessus du point, fondu rapide, sobre ---------- */
/* Survoler une pastille du rail allume son point sur le radar et ouvre une carte au-dessus de lui :
   photo, Nancy -> ville, kilometres par la route, duree, distance a vol d'oiseau. Entree et sortie en
   fondu tres rapide, sans flou ni echelle ni glissement (client, 14/09 : « plus sobre »).
   Les donnees sont dans data-lrs-zn-villes (x, y = coordonnees du radar ; cote = n / s / e / w). */
.lrs-zn__map.lrs-zn__map{position:relative}
.lrs-zn__city.lrs-zn__city{transition:r .35s ease,stroke-width .35s ease;stroke:rgba(224,122,74,0);stroke-width:0}
.lrs-zn__city.lrs-zn__city.is-on{r:5.2;stroke:rgba(224,122,74,.35);stroke-width:6}
.lrs-zn.lrs-zn text{transition:fill .35s ease}
.lrs-zn.lrs-zn text.is-on{fill:#F6F1EC;font-weight:700}
.lrs-zn__hub.lrs-zn__hub{transition:r .35s ease,stroke-width .35s ease;stroke:rgba(224,122,74,0);stroke-width:0}
.lrs-zn__hub.lrs-zn__hub.is-on{r:7.5;stroke:rgba(224,122,74,.35);stroke-width:7}
.lrs-zn .lrs-zn__b{position:absolute;left:0;top:0;width:200px;padding:0;border-radius:12px;box-sizing:border-box;
  pointer-events:none;z-index:5;background:rgba(14,12,18,.92);border:1px solid rgba(246,241,236,.10);
  box-shadow:0 14px 34px rgba(0,0,0,.38),0 0 0 1px rgba(246,241,236,.03) inset;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:#F6F1EC;text-align:left;line-height:1.3;opacity:0;transition:opacity .11s ease}
/* entree : 120 ms ; sortie : 110 ms ; rien d'autre ne bouge */
.lrs-zn .lrs-zn__b.is-on{opacity:1;transition-duration:.12s}
.lrs-zn .lrs-zn__b--n{transform:translate(-50%,-100%) translateY(-16px)}
.lrs-zn .lrs-zn__b--s{transform:translate(-50%,0) translateY(16px)}
.lrs-zn .lrs-zn__b--w{transform:translate(-100%,-50%) translateX(-16px)}
.lrs-zn .lrs-zn__b--e{transform:translate(0,-50%) translateX(16px)}
/* la pointe, vers le point */
.lrs-zn .lrs-zn__b::before{content:"";position:absolute;width:10px;height:10px;background:rgba(14,12,18,.92);
  border:1px solid rgba(246,241,236,.10);border-width:0 1px 1px 0;transform:rotate(45deg)}
.lrs-zn .lrs-zn__b--n::before{left:calc(50% - 5px);bottom:-6px}
.lrs-zn .lrs-zn__b--s::before{left:calc(50% - 5px);top:-6px;transform:rotate(-135deg)}
.lrs-zn .lrs-zn__b--w::before{right:-6px;top:calc(50% - 5px);transform:rotate(-45deg)}
.lrs-zn .lrs-zn__b--e::before{left:-6px;top:calc(50% - 5px);transform:rotate(135deg)}
/* la photo de la ville : 16:9 en tete de carte, calee par padding-top, coins hauts arrondis (jamais d'overflow
   sur la carte elle-meme : la pointe en sortirait). Elle apparait en fondu une fois chargee. */
.lrs-zn .lrs-zn__b-p{display:block;position:relative;width:100%;padding-top:56.25%;border-radius:11px 11px 0 0;overflow:hidden;
  background:linear-gradient(180deg,rgba(246,241,236,.07),rgba(246,241,236,.03))}
.lrs-zn .lrs-zn__b-p[hidden]{display:none}
html body .lrs-zn .lrs-zn__b-p img{position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;
  margin:0 !important;padding:0 !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;object-fit:cover;display:block;
  opacity:0;transition:opacity .35s ease}
.lrs-zn .lrs-zn__b-p.is-ok img{opacity:1}
.lrs-zn .lrs-zn__b-c{display:flex;flex-direction:column;gap:3px;padding:10px 14px 12px}
html body .lrs-zn .lrs-zn__b-k.lrs-zn__b-k{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#E07A4A}
html body .lrs-zn .lrs-zn__b-n.lrs-zn__b-n{font-size:27px;font-weight:800;letter-spacing:-.01em;line-height:1;color:#F6F1EC;font-variant-numeric:tabular-nums}
html body .lrs-zn .lrs-zn__b-n.lrs-zn__b-n b{font-weight:800;color:#F6F1EC}
html body .lrs-zn .lrs-zn__b-n.lrs-zn__b-n i{font-style:normal;font-weight:800;color:#F6F1EC}
html body .lrs-zn .lrs-zn__b-t.lrs-zn__b-t{font-size:11.5px;font-weight:500;color:rgba(246,241,236,.72)}
/* sous 900 px (une colonne, radar de 300 a 380 px) : la carte reste au-dessus du point mais sans la photo,
   sinon elle sortirait du radar par le haut sur les villes du nord et mordrait la tagline */
@media(max-width:899px){.lrs-zn .lrs-zn__b .lrs-zn__b-p{display:none}}
@media(max-width:599px){.lrs-zn .lrs-zn__b{width:164px}
  /* intitule sur une ligne et carte a 8 px du point : sur Luxembourg, la carte mordait la tagline de 17 px */
  .lrs-zn .lrs-zn__b--n{transform:translate(-50%,-100%) translateY(-8px)}
  html body .lrs-zn .lrs-zn__b-k.lrs-zn__b-k{white-space:nowrap;letter-spacing:.07em}
  .lrs-zn .lrs-zn__b-c{padding:8px 11px 10px}
    html body .lrs-zn .lrs-zn__b-n.lrs-zn__b-n{font-size:23px}
  html body .lrs-zn .lrs-zn__b-t.lrs-zn__b-t{font-size:11px}}
/* la pastille survolee s'allume comme dans sa boucle, et sa boucle se met en pause */
.lrs-zn__cities.lrs-zn__cities li:hover{animation:none;opacity:1;border-color:rgba(224,122,74,.6);background:rgba(224,122,74,.14);color:#F6F1EC}
.lrs-zn__cities.lrs-zn__cities li:hover::before{box-shadow:0 0 0 3px rgba(224,122,74,.28)}
.lrs-zn__cities.lrs-zn__cities li:hover::after{animation:none;opacity:0}
