/* ══════════════════════════════════════════════════════════════════
   SOCLE N'ZÉRÉKORÉ
   Feuille de style de la refonte. Toutes ses classes sont préfixées
   « nzk- » : les anciennes feuilles ciblent .site-header, .nav--lehavre
   ou .hf-*, elles ne peuvent donc pas l'atteindre. Aucun !important
   n'est nécessaire ici, et aucun ne doit y être ajouté.
   ══════════════════════════════════════════════════════════════════ */

:root {
  /* Identité */
  --nz-nuit: #222f2b;
  --nz-vert: #384842;
  --nz-vert-f: #25312d;
  --nz-vert-pale: #eaeeeb;
  --nz-or: #c8a56c;
  --nz-or-vif: #e4c594;
  --nz-or-pale: #f5efe4;
  --nz-brique: #b05323;

  /* Neutres, légèrement biaisés vers le vert */
  --nz-encre: #000000;
  --nz-gris: #000000;
  --nz-papier: #ffffff;
  --nz-casse: #ffffff;
  --nz-filet: #d6d6d6;

  /* Typographie */
  --nz-titre: "Source Serif 4", Georgia, serif;
  --nz-texte: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Trame d'espacement, base 8 */
  --nz-1: 8px;  --nz-2: 16px; --nz-3: 24px;
  --nz-4: 32px; --nz-6: 48px; --nz-8: 64px;

  /* Formes */
  --nz-r: 4px;
  --nz-r-l: 6px;
  --nz-large: 1280px;
}

/* ── Largeur et gouttières ── */
.nzk-pad { padding-inline: clamp(16px, 3vw, 42px); }
.nzk-centre { max-width: var(--nz-large); margin-inline: auto; }

/* ══ BANDEAU D'ÉTAT ══ */
.nzk-etat {
  background: #ffffff;
  color: #3a3a3a;
  border-bottom: 1px solid var(--nz-filet);
  font-family: var(--nz-texte);
  font-size: 12px;
}
.nzk-etat__in {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--nz-2); flex-wrap: wrap; padding-block: var(--nz-1);
}
.nzk-etat__g, .nzk-etat__d { display: flex; align-items: center; gap: var(--nz-2); flex-wrap: wrap; min-width: 0; }
.nzk-etat a { color: inherit; text-decoration: none; }
.nzk-etat a:hover { color: #111111; text-decoration: underline; }
.nzk-etat a:focus-visible { outline: 2px solid var(--nz-or-vif); outline-offset: 2px; }
.nzk-bar { width: 1px; height: 12px; background: var(--nz-filet); flex: none; }
.nzk-drapeau { width: 19px; height: 12px; display: flex; border-radius: 1px; overflow: hidden; flex: none; }
.nzk-drapeau i { flex: 1; }
.nzk-soc { display: flex; gap: 11px; align-items: center; }

/* ══ EN-TÊTE ══ */
/* z-index au-dessus du voile (1150) : l'en-tête est « sticky » avec un
   z-index, donc il forme un contexte d'empilement. Le menu mobile, bien
   qu'en z-index 1200, reste enfermé dedans — à 1100 le voile passait
   par-dessus le panneau et interceptait chaque appui.
   Pas de transform ici : il piégerait le panneau en « position: fixed ». */
.nzk-haut { position: sticky; top: 0; z-index: 1300; }

.nzk-tete {
  background: var(--nz-papier);
  border-bottom: 1px solid var(--nz-filet);
  font-family: var(--nz-texte);
}
.nzk-tete__in {
  display: flex; align-items: center; gap: clamp(10px, 1.4vw, 22px);
  padding-block: 20px; flex-wrap: nowrap;
}
@media (max-width: 1240px) {
  .nzk-tete__in { flex-wrap: wrap; }
}

.nzk-marque { display: flex; align-items: center; gap: 10px; min-width: 0; flex: none; text-decoration: none; color: inherit; }
.nzk-marque__ecusson { width: 42px; height: 47px; flex: none; }
.nzk-marque__nom {
  display: block; font-family: var(--nz-titre); font-weight: 800;
  font-size: clamp(20px, 1.9vw, 25px); color: var(--nz-vert-f);
  line-height: 1.05; letter-spacing: .005em;
}
.nzk-marque__sous { display: block; font-size: 12px; font-weight: 600; color: var(--nz-encre); line-height: 1.3; }
.nzk-marque__bl { display: block; font-size: 11px; color: var(--nz-or); font-weight: 500; }

.nzk-loupe {
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--nz-filet); background: none; cursor: pointer;
  display: grid; place-items: center; color: var(--nz-encre); flex: none;
}
.nzk-loupe:hover { border-color: var(--nz-or); color: var(--nz-vert); }
.nzk-loupe:focus-visible { outline: 2px solid var(--nz-vert); outline-offset: 2px; }

/* Le blanc sur l'or de la charte ne donne que 2,73 de contraste, en dessous
   des 4,5 exigés pour du texte courant. Ce bouton est dans l'en-tête de
   chaque page : c'était le défaut de lisibilité le plus répandu du site.
   L'encre de la charte posée dessus donne 6,04, et la couleur de marque est
   conservée. */
.nzk-btn-or {
  background: var(--nz-or); color: var(--nz-encre); font-weight: 600; font-size: 13.5px;
  font-family: var(--nz-texte); padding: 11px 19px; border-radius: var(--nz-r);
  display: inline-flex; align-items: center; gap: var(--nz-1);
  white-space: nowrap; text-decoration: none; border: 0;
}
.nzk-btn-or:hover { background: #dfc395; color: var(--nz-encre); }
.nzk-btn-or:focus-visible { outline: 2px solid var(--nz-nuit); outline-offset: 2px; }

/* Bouton d'ouverture du menu, mobile */
/* !important assumé : une règle des anciennes feuilles réaffiche ce bouton
   et n'a pas pu être identifiée. À retirer quand elles auront disparu. */
.nzk-tete .nzk-burger {
  display: none !important; width: 40px; height: 40px; flex: none;
  background: none; border: 1px solid var(--nz-filet); border-radius: var(--nz-r);
  color: var(--nz-encre); font-size: 19px; cursor: pointer;
  align-items: center; justify-content: center;
}
.nzk-burger:focus-visible { outline: 2px solid var(--nz-vert); outline-offset: 2px; }

/* ══ NAVIGATION ══ */
.nzk-nav { display: flex; align-items: center; gap: clamp(4px, .7vw, 12px); flex-wrap: nowrap; flex: 1 1 auto; min-width: 0; justify-content: flex-start; }
.nzk-nav__lien {
  font-size: 13.5px; font-weight: 500; color: var(--nz-encre);
  text-decoration: none; padding: 7px 9px; white-space: nowrap;
  border-bottom: 2px solid transparent; background: none; border-left: 0; border-right: 0; border-top: 0;
  font-family: var(--nz-texte); cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.nzk-nav__lien:hover { color: var(--nz-vert); }
.nzk-nav__lien[aria-current="page"],
.nzk-nav__lien.est-actif { color: var(--nz-vert); font-weight: 600; border-bottom-color: var(--nz-or); }
.nzk-nav__lien:focus-visible { outline: 2px solid var(--nz-vert); outline-offset: 3px; }
.nzk-nav__fleche {
  width: 7px; height: 7px; flex: none; margin-left: 1px;
  border-right: 1.6px solid var(--nz-gris);
  border-bottom: 1.6px solid var(--nz-gris);
  transform: rotate(45deg) translate(-1px, -1px);
}
.nzk-nav__lien:hover .nzk-nav__fleche,
.nzk-nav__lien.est-actif .nzk-nav__fleche { border-color: var(--nz-vert); }

/* Sous-menu */
.nzk-sous { position: relative; }
.nzk-sous__panneau {
  position: absolute; top: calc(100% + 10px); left: 0;
  /* Le panneau se dimensionne sur son contenu : une colonne par
     rubrique, large de ce qu'exige son libellé le plus long. Une
     largeur minimale fixe laissait du vide sur les menus courts. */
  width: max-content; max-width: min(92vw, 780px);
  background: var(--nz-papier);
  border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l);
  box-shadow: 0 10px 30px rgba(16,26,22,.14);
  padding: 16px 18px;
  display: grid; grid-auto-flow: column;
  grid-auto-columns: minmax(136px, max-content);
  gap: 4px 26px;
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  z-index: 60;
}
.nzk-sous:hover > .nzk-sous__panneau,
.nzk-sous:has(:focus-visible) > .nzk-sous__panneau,
.nzk-sous.est-ouvert > .nzk-sous__panneau {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.nzk-sous__col { min-width: 0; }
.nzk-sous__titre {
  font-family: var(--nz-titre); font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; color: var(--nz-gris);
  margin: 0 0 4px; padding-bottom: 5px; border-bottom: 1px solid var(--nz-filet);
}
.nzk-sous__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.nzk-sous__lien {
  display: block; padding: 6px 9px; border-radius: 5px;
  font-size: 13.5px; color: var(--nz-encre); text-decoration: none; line-height: 1.3;
  white-space: nowrap;
}
.nzk-sous__lien:hover { background: var(--nz-vert); color: #fff; }
.nzk-sous__lien:focus-visible { outline: 2px solid var(--nz-vert); outline-offset: -2px; }
.nzk-sous__lien[aria-current="page"] {
  background: var(--nz-vert-pale); color: var(--nz-vert-f); font-weight: 600;
}

/* Sous 1500 px, la devise s'efface : elle est secondaire et libère
   la largeur dont la barre de navigation a besoin. */
@media (max-width: 1500px) {
  .nzk-marque__bl { display: none; }
}

/* Les derniers sous-menus s'ouvrent vers la gauche : alignés à gauche,
   ils déborderaient hors de l'écran. */
.nzk-nav > .nzk-sous:nth-last-child(-n+2) > .nzk-sous__panneau {
  left: auto; right: 0;
}

/* ── Mobile ── */
.nzk-voile { display: none; }
@media (max-width: 1240px) {
  .nzk-tete .nzk-burger { display: inline-flex !important; order: -1; }
  .nzk-nav {
    display: none !important; position: fixed; inset: 0 0 0 auto; width: min(340px, 86vw);
    background: var(--nz-papier); z-index: 1200;
    flex-direction: column; align-items: stretch; gap: 0; flex-wrap: wrap; justify-content: flex-start;
    padding: var(--nz-3) var(--nz-2); overflow-y: auto;
    box-shadow: -8px 0 30px rgba(16,26,22,.2);
  }
  .nzk-nav.est-ouvert { display: flex !important; }
  .nzk-nav__lien { padding: 12px 10px; border-bottom: 1px solid var(--nz-filet); width: 100%; justify-content: space-between; }
  .nzk-nav__lien[aria-current="page"], .nzk-nav__lien.est-actif { border-bottom-color: var(--nz-filet); }
  .nzk-sous { width: 100%; }
  .nzk-sous__panneau {
    position: static; width: auto; min-width: 0; max-width: none; border: 0; box-shadow: none;
    padding: var(--nz-1) var(--nz-2) var(--nz-2);
    grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: 1fr;
    display: none; opacity: 1; visibility: visible; transform: none; background: var(--nz-casse);
  }
  .nzk-sous.est-ouvert > .nzk-sous__panneau { display: grid; }
  .nzk-sous:hover > .nzk-sous__panneau { display: none; }
  .nzk-sous.est-ouvert:hover > .nzk-sous__panneau { display: grid; }
  .nzk-voile.est-ouvert {
    display: block; position: fixed; inset: 0; z-index: 1150;
    background: rgba(13,21,18,.45);
  }
  body.nzk-fige { overflow: hidden; }
}

/* ══ PIED DE PAGE ══ */
.nzk-pied { background: #ffffff; color: var(--nz-gris); font-family: var(--nz-texte); font-size: 13px; }
.nzk-pied__in { display: flex; justify-content: space-between; gap: var(--nz-2); flex-wrap: wrap; padding-block: var(--nz-3); }
.nzk-pied a { color: inherit; text-decoration: none; }
.nzk-pied a:hover { color: #111111; text-decoration: underline; }

/* ══ ACCESSIBILITÉ ══ */
.nzk-saut {
  position: absolute; left: -9999px; top: 0; z-index: 2000;
  background: var(--nz-nuit); color: #fff; padding: 12px 18px;
  font-family: var(--nz-texte); font-weight: 600; text-decoration: none;
}
.nzk-saut:focus { left: 0; }

@media (prefers-reduced-motion: reduce) {
  .nzk-haut, .nzk-sous__panneau { transition: none; }
}

/* ══════════════════════════════════════════════════════════════════
   COMPOSANTS D'ACCUEIL
   ══════════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.nzk-hero { position: relative; isolation: isolate; font-family: var(--nz-texte); }
.nzk-hero__photo {
  position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: center;
  background-image: linear-gradient(168deg,#8fb4c6 0%,#929d94 30%,#6c776c 52%,#4f5b51 72%,#323c35 100%);
}
.nzk-hero__voile {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(98deg, #0e1a16 0%, rgba(14,26,22,.93) 24%, rgba(14,26,22,.66) 42%, rgba(14,26,22,.20) 64%, rgba(14,26,22,.04) 100%);
}
.nzk-hero__in {
  display: flex; gap: var(--nz-3); align-items: flex-start; justify-content: space-between;
  flex-wrap: wrap; padding-block: clamp(38px,5.4vw,70px) clamp(70px,8vw,100px);
}
.nzk-hero__txt { max-width: 620px; min-width: 0; }
.nzk-sur {
  display: flex; align-items: center; gap: 11px; font-size: 11px; letter-spacing: .16em;
  text-transform: uppercase; font-weight: 600; color: var(--nz-or-vif); margin-bottom: 14px;
}
.nzk-sur::before { content: ""; width: 32px; height: 1px; background: var(--nz-or-vif); flex: none; }
.nzk-hero__titre { font-family: var(--nz-titre); color: #fff; line-height: 1.03; margin: 0 0 var(--nz-2); letter-spacing: -0.01em; }
.nzk-hero__l1 { display: block; font-size: clamp(38px,5.3vw,68px); font-weight: 600; letter-spacing: -.035em; }
.nzk-hero__l2 { display: block; font-size: clamp(25px,3vw,38px); font-weight: 400; color: var(--nz-or-vif); margin-top: 2px; }
.nzk-hero__l3 { display: block; font-size: clamp(23px,2.7vw,34px); font-weight: 400; margin-top: 5px; }
.nzk-hero p { color: #d4d8d6; font-size: clamp(14px,1.35vw,16px); margin: 0 0 var(--nz-3); max-width: 44ch; }
.nzk-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.nzk-b-or, .nzk-b-noir, .nzk-b-vert {
  font-family: var(--nz-texte); font-weight: 600; font-size: 14px; padding: 13px 21px;
  border-radius: var(--nz-r); display: inline-flex; align-items: center; gap: 9px;
  text-decoration: none; border: 0; cursor: pointer;
}
.nzk-b-or { background: var(--nz-or); color: var(--nz-encre); }
.nzk-b-or:hover { background: #dfc395; color: var(--nz-encre); }
.nzk-b-noir { background: transparent; border: 1px solid rgba(255,255,255,.55); color: #fff; }
.nzk-b-noir:hover { background: #19211e; color: #fff; }
.nzk-b-vert { background: var(--nz-vert); color: #fff; }
.nzk-b-vert:hover { background: #293d34; color: #fff; }

.nzk-meteo {
  background: rgba(14,21,19,.62); border: 1px solid rgba(255,255,255,.17);
  border-radius: var(--nz-r-l); padding: 16px 18px; color: #fff; min-width: 190px;
}
.nzk-meteo__l { display: flex; align-items: center; gap: 13px; }
.nzk-meteo__t { font-family: var(--nz-titre); font-size: 26px; font-weight: 700; line-height: 1; display: block; }
.nzk-meteo__v { font-size: 12.5px; color: #c8cecb; display: block; }
.nzk-meteo__d { margin-top: 12px; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.17); font-size: 12.5px; color: #c8cecb; }

/* ── Six accès ── */
.nzk-acces { margin-top: clamp(-50px,-4.4vw,-36px); position: relative; z-index: 3; }
.nzk-acces__rail {
  background: var(--nz-papier); border-radius: var(--nz-r-l);
 border: 1px solid var(--nz-filet);
  display: grid; grid-template-columns: repeat(6, 1fr); overflow: hidden;
}
.nzk-ac { display: flex; align-items: center; gap: 10px; padding: 15px 13px; border-right: 1px solid var(--nz-filet); min-width: 0; text-decoration: none; color: inherit; }
.nzk-ac:last-child { border-right: 0; }
.nzk-ac:hover { background: #ffffff; }
.nzk-ac__ico { width: 37px; height: 37px; border-radius: 9px; display: grid; place-items: center; flex: none; }
.nzk-ac--v .nzk-ac__ico { background: var(--nz-vert-pale); color: var(--nz-vert); }
.nzk-ac--o .nzk-ac__ico { background: var(--nz-or-pale); color: var(--nz-or); }
.nzk-ac__tx { min-width: 0; flex: 1; }
.nzk-ac__tt { font-family: var(--nz-titre); font-weight: 600; font-size: 14px; line-height: 1.25; display: block; }
.nzk-ac__ss { font-size: 10.8px; color: var(--nz-gris); line-height: 1.3; display: block; }
.nzk-ac__ch { color: var(--nz-gris); flex: none; font-size: 14px; }

/* ── Sections ── */
.nzk-bloc { padding-block: clamp(24px,3vw,40px); font-family: var(--nz-texte); }
.nzk-trait { width: 42px; height: 3px; background: var(--nz-vert); border-radius: 2px; margin-bottom: 12px; }
.nzk-h2 { font-family: var(--nz-titre); font-size: clamp(28px,3.2vw,40px); font-weight: 600; letter-spacing: -0.015em; margin: 0; color: var(--nz-encre); }
.nzk-shead { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: var(--nz-3); }
.nzk-voir { font-size: 13px; font-weight: 600; color: var(--nz-vert); display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; text-decoration: none; border-bottom: 1px solid var(--nz-filet); padding-bottom: 2px; }
.nzk-voir:hover { color: var(--nz-or); border-color: var(--nz-or); }

.nzk-cols { display: grid; grid-template-columns: 1fr 360px; gap: clamp(18px,2.4vw,28px); align-items: start; }

/* ── Bande actualités de l'accueil ──
   Trois cartes sur toute la largeur, sur le modèle du Havre : la colonne
   agenda les écrasait à 206 px, assez étroit pour que la césure coupe les
   mots en deux. L'agenda a sa propre bande, plus bas. */
.nzk-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 26px); }
.nzk-shead--centre { flex-direction: column; align-items: center; text-align: center; gap: 0; }
.nzk-shead--centre .nzk-trait { margin-inline: auto; }
.nzk-shead__txt { margin: 8px 0 0; font-size: 14px; color: var(--nz-gris); max-width: 56ch; }
.nzk-centrer { display: flex; justify-content: center; margin-top: var(--nz-4); }
.nzk-bloc--casse { background: var(--nz-casse); max-width: none; }
.nzk-bloc--casse > * { max-width: var(--nz-large); margin-inline: auto; }
.nzk-agenda-rail { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 20px); }
.nzk-ev--carte {
  background: var(--nz-papier); border: 1px solid var(--nz-filet);
  border-radius: var(--nz-r-l); padding: 16px 18px; align-items: flex-start;
}
.nzk-ev--carte:last-child { border-bottom: 1px solid var(--nz-filet); }
.nzk-ev--carte:hover { border-color: var(--nz-or); background: var(--nz-papier); }
@media (max-width: 980px) {
  .nzk-cartes, .nzk-agenda-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .nzk-cartes, .nzk-agenda-rail { grid-template-columns: 1fr; }
}
.nzk-carte { background: var(--nz-papier); border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l); overflow: hidden; display: flex; flex-direction: column; min-width: 0; text-decoration: none; color: inherit; }
.nzk-carte:hover { border-color: var(--nz-or); }
.nzk-carte__vis { aspect-ratio: 3/2; position: relative; max-width: 100%; background: #ffffff; background-size: cover; background-position: center; }
/* Pastille de rubrique au ras du bord bas-gauche, comme sur lehavre.fr */
.nzk-carte__badge {
  position: absolute; left: 0; bottom: 0; background: var(--nz-nuit); color: #fff;
  font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  padding: 7px 13px; border-radius: 0;
}
.nzk-carte__cnt { padding: 17px 18px 18px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.nzk-carte__dt { font-size: 11.5px; color: var(--nz-gris); }
/* La charte applique « hyphens: auto » à tous les titres : sur une colonne
   étroite elle coupait « Lance-ment » et « natu-relles » en plein milieu. */
.nzk-carte__t {
  font-family: var(--nz-titre); font-size: clamp(21px, 1.8vw,25px); font-weight: 600;
  line-height: 1.28; margin: 0; hyphens: none !important; overflow-wrap: normal;
  text-wrap: balance;
}
.nzk-carte__ex {
  margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--nz-gris); flex: 1;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.nzk-carte__pied {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: auto; padding-top: 11px; border-top: 1px solid var(--nz-filet);
}
.nzk-carte p { margin: 0; font-size: 13px; color: var(--nz-gris); flex: 1; }
.nzk-carte__lire { font-size: 12.5px; font-weight: 600; color: var(--nz-vert); display: inline-flex; gap: 6px; align-items: center; }

/* ── Agenda ── */
.nzk-agd { background: var(--nz-papier); border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l); overflow: hidden; }
.nzk-agd__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 16px; border-bottom: 1px solid var(--nz-filet); flex-wrap: wrap; }
.nzk-agd__h h2 { font-family: var(--nz-titre); font-size: 16.5px; font-weight: 600; margin: 0; display: flex; align-items: center; gap: 10px; }
.nzk-agd__ic { width: 30px; height: 30px; border-radius: 7px; background: var(--nz-or-pale); color: var(--nz-or); display: grid; place-items: center; flex: none; }
.nzk-ev { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-bottom: 1px solid var(--nz-filet); text-decoration: none; color: inherit; }
.nzk-ev:last-child { border-bottom: 0; }
.nzk-ev:hover { background: #ffffff; }
.nzk-ev__jr { text-align: center; flex: none; width: 38px; }
.nzk-ev__jr b { display: block; font-family: var(--nz-titre); font-size: 20px; font-weight: 700; color: var(--nz-brique); line-height: 1; font-variant-numeric: tabular-nums; }
.nzk-ev__jr span { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--nz-gris); }
.nzk-ev__tx { flex: 1; min-width: 0; }
.nzk-ev__tt { font-size: 13.5px; font-weight: 600; line-height: 1.3; display: block; }
.nzk-ev__mt { font-size: 11.5px; color: var(--nz-gris); display: flex; gap: 11px; flex-wrap: wrap; margin-top: 3px; }

/* ── Territoire ── */
.nzk-terr { position: relative; isolation: isolate; color: #fff; font-family: var(--nz-texte); }
.nzk-terr__photo { position: absolute; inset: 0; z-index: -2; background: radial-gradient(ellipse 52% 44% at 24% 28%, #6d7f74 0%, transparent 62%), linear-gradient(150deg,#496055 0%,#3c5148 48%,#30443b 100%); background-size: cover; background-position: center; }
.nzk-terr__voile { position: absolute; inset: 0; z-index: -1; background: linear-gradient(92deg, rgba(28,42,36,.52) 0%, rgba(28,42,36,.34) 40%, rgba(28,42,36,.12) 72%, rgba(28,42,36,.20) 100%); }
.nzk-terr__in { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(20px,3vw,40px); align-items: center; padding-block: clamp(32px,4.2vw,52px); }
.nzk-terr h2 { font-family: var(--nz-titre); font-size: clamp(24px,3.4vw,36px); font-weight: 700; margin: 0 0 11px; }
.nzk-terr p { color: #d1d6d3; font-size: 14.5px; margin: 0 0 var(--nz-3); max-width: 42ch; }
.nzk-vign { display: grid; grid-template-columns: repeat(auto-fit, minmax(124px,1fr)); gap: 12px; }
.nzk-vg { border-radius: var(--nz-r); overflow: hidden; position: relative; aspect-ratio: 4/5; display: flex; align-items: flex-end; min-width: 0; text-decoration: none; background-size: cover; background-position: center; }
.nzk-vg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(9,16,14,.84) 0%, rgba(9,16,14,.12) 58%); }
.nzk-vg span { position: relative; z-index: 1; padding: 11px 12px; font-size: 12.5px; font-weight: 600; line-height: 1.25; color: #fff; }
.nzk-sel { background: rgba(13,25,21,.34); border: 1px solid rgba(255,255,255,.14); border-radius: var(--nz-r-l); padding: 16px 17px; margin-top: var(--nz-3); }
.nzk-sel h2 { font-family: var(--nz-titre); font-size: 15.5px; font-weight: 600; margin: 0 0 11px; color: #fff; }
.nzk-sel__a { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.17); border-radius: 6px; padding: 9px 12px; font-size: 13px; color: #ffffff; margin-bottom: 7px; text-decoration: none; }
.nzk-sel__a:last-child { margin-bottom: 0; }
.nzk-sel__a:hover { background: rgba(255,255,255,.2); color: #ffffff; }
.nzk-sel__a span { color: var(--nz-or-vif); }

@media (max-width: 1080px) {
  .nzk-acces__rail { grid-template-columns: repeat(3, 1fr); }
  .nzk-ac:nth-child(3) { border-right: 0; }
  .nzk-ac:nth-child(-n+3) { border-bottom: 1px solid var(--nz-filet); }
}
@media (max-width: 940px) {
  .nzk-cols { grid-template-columns: 1fr; }
  .nzk-terr__in { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .nzk-acces__rail { grid-template-columns: repeat(2, 1fr); }
  .nzk-ac:nth-child(2n) { border-right: 0; }
  .nzk-hero__in { flex-direction: column; }
  .nzk-meteo { width: 100%; }
}
@media (max-width: 420px) {
  .nzk-acces__rail { grid-template-columns: 1fr; }
  .nzk-ac { border-right: 0; border-bottom: 1px solid var(--nz-filet); }
  .nzk-ac:last-child { border-bottom: 0; }
}

/* Pied de page municipal : fond clair et navigation secondaire. */
.nzk-pied__haut {
  display:grid; grid-template-columns:1.1fr .85fr .85fr 1.25fr;
  gap:clamp(20px,2.5vw,32px); padding-block:28px;
}
.nzk-pied__marque,.nzk-pied__col { min-width:0; }
.nzk-pied__identite { display:inline-flex; flex-direction:column; gap:6px; }
.nzk-pied__identite .nzk-marque__nom { font-size:24px; font-weight:600; }
.nzk-pied__identite .nzk-marque__sous { font-size:9px; letter-spacing:.14em; }
.nzk-pied__txt { font-size:12px; line-height:1.75; margin:16px 0; max-width:30ch; }
.nzk-pied .nzk-pied__col h2 {
  font:600 11px var(--nz-texte) !important;
  letter-spacing:.08em; text-transform:uppercase;
  margin:0 0 17px; padding:0; border:0;
}
.nzk-pied__col ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.nzk-pied__col a { font-size:12px; display:inline-block; padding-block:4px; line-height:1.6; }
.nzk-pied__contact { display:flex; flex-direction:column; gap:12px; font-size:12px; line-height:1.7; }
.nzk-pied__contact strong { display:block; font:600 10px var(--nz-texte); margin-bottom:3px; }
.nzk-pied__contact a { overflow-wrap:anywhere; padding-block:0; }
.nzk-pied__social { display:inline-flex; align-items:center; gap:9px; font-size:11px; padding-block:6px; }
.nzk-pied__bas {
  display:flex; align-items:center; justify-content:space-between; gap:14px 24px; flex-wrap:wrap;
  padding-block:12px; border-top:1px solid var(--nz-filet); font-size:11px; line-height:1.6;
}
.nzk-pied__bas nav { display:flex; flex-wrap:wrap; gap:8px 20px; }
.nzk-pied__bas nav a { padding-block:4px; }
.nzk-pied a:hover { text-decoration:underline; text-underline-offset:4px; }
.nzk-pied a:focus-visible { outline:3px solid var(--nz-vert); outline-offset:4px; }
@media(max-width:860px) {
  .nzk-pied__haut { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
  .nzk-pied__marque { grid-column:1 / -1; }
  .nzk-pied__txt { max-width:55ch; }
  .nzk-pied__col--contact { grid-column:1 / -1; }
  .nzk-pied__contact { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 24px; }
}
@media(max-width:480px) {
  .nzk-pied__haut { padding-block:24px; gap:20px 18px; }
  .nzk-pied__contact { grid-template-columns:1fr; }
  .nzk-pied__bas { align-items:flex-start; flex-direction:column; }
}

/* ══════════════════════════════════════════════════════════════════
   PROTECTION DES TEXTES SUR FOND SOMBRE
   Les anciennes feuilles imposent « h1…h6 { color: encre !important } ».
   Sur les blocs sombres du socle, ce gris foncé devient illisible.
   Ces règles les rétablissent et disparaîtront avec ces feuilles.
   ══════════════════════════════════════════════════════════════════ */
.nzk-hero .nzk-hero__titre,
.nzk-hero .nzk-hero__l1,
.nzk-hero .nzk-hero__l3,
.nzk-terr h1, .nzk-terr h2, .nzk-terr h3,
.nzk-sel h2 { color: #ffffff !important; }

.nzk-hero .nzk-hero__l2 { color: var(--nz-or-vif) !important; }
.nzk-hero p, .nzk-terr p { color: #d4d8d6 !important; }
.nzk-hero .nzk-sur, .nzk-terr .nzk-sur { color: var(--nz-or-vif) !important; }
.nzk-meteo, .nzk-meteo__t { color: #ffffff !important; }
.nzk-meteo__v, .nzk-meteo__d { color: #c8cecb !important; }

.nzk-pied, .nzk-pied__txt { color:var(--nz-gris) !important; }
.nzk-pied .nzk-marque__nom { color:var(--nz-vert-f) !important; }
.nzk-pied .nzk-marque__sous { color:var(--nz-gris) !important; }
.nzk-pied .nzk-pied__col h2 { color:var(--nz-encre) !important; }
.nzk-pied__col a, .nzk-pied__contact { color:var(--nz-gris) !important; }
.nzk-pied__contact strong { color:var(--nz-encre) !important; }
.nzk-pied__bas, .nzk-pied__bas a { color:var(--nz-gris) !important; }
.nzk-pied a:hover, .nzk-pied__col a:hover { color:var(--nz-vert-f) !important; }

.nzk-sel a { color: #e6e8e7 !important; }
.nzk-vg span { color: #ffffff !important; }
/* Le blanc est juste sur le vert et le noir, pas sur l'or : il n'y donne que
   2,73 de contraste. Le bouton or reprend l'encre de la charte, 6,04. */
.nzk-b-vert, .nzk-b-noir { color: #ffffff !important; }
.nzk-b-or { color: var(--nz-encre) !important; }

/* Sur la bande territoire éclaircie, un bouton vert se confondrait avec le
   fond : on l'inverse en ivoire sur encre verte. */
.nzk-terr .nzk-b-vert { background: #ffffff; color: var(--nz-nuit) !important; }
.nzk-terr .nzk-b-vert:hover { background: var(--nz-or-vif); color: #17201c !important; }

/* ══════════════════════════════════════════════════════════════════
   UNIFORMISATION DES EN-TÊTES DE PAGE — ÉTAPE DE TRANSITION
   Chacune des 22 pages intérieures possède son propre en-tête
   (.dem-hero, .ni-hero, .t-hero…). En attendant leur migration vers
   un composant commun, ces règles leur donnent une apparence unique :
   même dégradé, même rayon, mêmes couleurs de texte.
   À supprimer au fur et à mesure que les gabarits adoptent le socle.
   ══════════════════════════════════════════════════════════════════ */
.ag-hero, .rdv-hero, .ct-hero, .cul-hero, .dem-hero, .eco-hero,
.edu-hero, .cc-hero, .elec-hero, .inv-hero, .biz-hero, .mk-hero,
.mp-hero, .ni-hero, .svc-hero, .org-hero, .snt-hero, .sr-hero,
.t-hero, .ts-hero {
  background: linear-gradient(118deg, #0e1a16 0%, #22352c 42%, #334a3f 78%, #3e594b 100%) !important;
  border-radius: var(--nz-r-l) !important;
  border: 0 !important;
  color: #fff !important;
  position: relative;
}

/* Filet latérite en pied d'en-tête : signature commune */
.ag-hero::after, .ct-hero::after, .cul-hero::after, .dem-hero::after,
.eco-hero::after, .edu-hero::after, .cc-hero::after, .inv-hero::after,
.mk-hero::after, .mp-hero::after, .ni-hero::after, .svc-hero::after,
.org-hero::after, .snt-hero::after, .t-hero::after, .ts-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  height: 3px; background: var(--nz-or); pointer-events: none;
}

/* Liens posés dans ces en-têtes sombres. Sans cette règle, celle de la charte
   — qui vise les liens sans classe du texte courant, avec !important — les
   peint en vert forêt sur le vert foncé de l'en-tête : invisibles. Les deux
   règles portant !important, c'est la spécificité qui tranche : celle de la
   charte vaut (0,1,3), d'où le :not([class]) ici, qui porte celle-ci à
   (0,2,1). */
.ag-hero a:not([class]), .rdv-hero a:not([class]), .ct-hero a:not([class]),
.cul-hero a:not([class]), .dem-hero a:not([class]), .eco-hero a:not([class]),
.edu-hero a:not([class]), .cc-hero a:not([class]), .elec-hero a:not([class]),
.inv-hero a:not([class]), .biz-hero a:not([class]), .mk-hero a:not([class]),
.mp-hero a:not([class]), .ni-hero a:not([class]), .svc-hero a:not([class]),
.org-hero a:not([class]), .snt-hero a:not([class]), .sr-hero a:not([class]),
.t-hero a:not([class]), .ts-hero a:not([class]) {
  color: var(--nz-or-vif) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* Textes des en-têtes : toujours clairs sur ce fond */
.ag-hero h1, .rdv-hero h1, .ct-hero h1, .cul-hero h1, .dem-hero h1,
.eco-hero h1, .edu-hero h1, .cc-hero h1, .elec-hero h1, .inv-hero h1,
.biz-hero h1, .mk-hero h1, .mp-hero h1, .ni-hero h1, .svc-hero h1,
.org-hero h1, .snt-hero h1, .sr-hero h1, .t-hero h1, .ts-hero h1,
.ag-hero h2, .dem-hero h2, .ni-hero h2, .t-hero h2, .svc-hero h2 {
  color: #ffffff !important;
  font-family: var(--nz-titre) !important;
  letter-spacing: -0.015em !important;
}
.ag-hero p, .rdv-hero p, .ct-hero p, .cul-hero p, .dem-hero p,
.eco-hero p, .edu-hero p, .cc-hero p, .elec-hero p, .inv-hero p,
.biz-hero p, .mk-hero p, .mp-hero p, .ni-hero p, .svc-hero p,
.org-hero p, .snt-hero p, .sr-hero p, .t-hero p, .ts-hero p {
  color: #d4d8d6 !important;
}

/* Fil d'Ariane : discret et lisible */
.nzk-fil, .breadcrumb, .bc, .ariane {
  font-family: var(--nz-texte);
  font-size: 12.5px;
}

/* Le pied de page passe devant les cartes interactives : Leaflet pose
   ses tuiles et ses contrôles sur des couches élevées qui, sans cela,
   recouvrent le bas de page. */
.nzk-pied {
  position: relative;
  z-index: 600;
}

/* Les cartes restent dans leur cadre */
.map-body,
.map-shell,
#map {
  overflow: hidden;
}

/* Certains en-têtes enveloppent leur contenu dans .container, classe
   globale dotée d'un fond blanc : posée sur le dégradé, elle formait
   un bloc clair sous un texte blanc. Dans un en-tête, elle ne sert
   que de gouttière. */
.ag-hero .container, .rdv-hero .container, .ct-hero .container,
.cul-hero .container, .dem-hero .container, .eco-hero .container,
.edu-hero .container, .cc-hero .container, .elec-hero .container,
.inv-hero .container, .biz-hero .container, .mk-hero .container,
.mp-hero .container, .ni-hero .container, .svc-hero .container,
.org-hero .container, .snt-hero .container, .sr-hero .container,
.t-hero .container, .ts-hero .container {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* Groupe d'actions de l'en-tête : bouton puis recherche, repoussés à
   droite. Les détacher de la navigation évite qu'ils se recouvrent
   lorsque la barre occupe toute la largeur disponible. */
.nzk-actions-tete {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
  flex: none;
}

/* ══ LISTES D'ARTICLES ══
   La dernière rangée d'une grille est rarement complète. Centrée,
   elle se lit comme une fin de liste ; alignée à gauche, elle laisse
   un vide qui ressemble à un défaut. */
.ni-grid {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
}
.ni-grid > * {
  flex: 0 1 calc(33.333% - 12px);
  min-width: 260px;
  max-width: 100%;
}
@media (max-width: 900px) { .ni-grid > * { flex-basis: calc(50% - 9px); } }
@media (max-width: 560px) { .ni-grid > * { flex-basis: 100%; min-width: 0; } }

/* ══ PAGINATION ══ */
.pagination, .ni-pag, nav.pagination ul {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 6px; list-style: none; margin: var(--nz-4) 0 0; padding: 0;
  font-family: var(--nz-texte);
}
.pagination li { list-style: none; }
.pagination a, .pagination span,
.ni-pag a, .ni-pag span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 38px; padding: 0 12px;
  border: 1px solid var(--nz-filet); border-radius: var(--nz-r);
  background: var(--nz-papier); color: var(--nz-encre);
  font-size: 14px; font-weight: 500; text-decoration: none;
  font-variant-numeric: tabular-nums;
  transition: background-color .15s ease, border-color .15s ease;
}
.pagination a:hover, .ni-pag a:hover {
  background: var(--nz-vert-pale); border-color: var(--nz-vert); color: var(--nz-vert-f);
}
.pagination .current, .pagination li.active span, .ni-pag .current {
  background: var(--nz-vert); border-color: var(--nz-vert); color: #fff; font-weight: 600;
}
.pagination .disabled span, .ni-pag .disabled {
  opacity: .4; pointer-events: none;
}

/* ══════════════════════════════════════════════════════════════════
   LISTE D'ACTUALITÉS
   Grille de trois colonnes, dont la première carte occupe deux
   colonnes : le rythme évite la monotonie tout en gardant des
   rangées pleines.
   ══════════════════════════════════════════════════════════════════ */
.nzk-actus { display: grid; grid-template-columns: 1fr 320px; gap: clamp(20px,2.6vw,34px); align-items: start; }

.nzk-liste { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.nzk-liste > .nzk-art--une { grid-column: span 2; }

.nzk-art {
  display: flex; flex-direction: column; min-width: 0;
  background: var(--nz-papier); border: 1px solid var(--nz-filet);
  border-radius: var(--nz-r-l); overflow: hidden;
  text-decoration: none; color: inherit;
  transition: border-color .18s ease, transform .18s ease;
}
.nzk-art:hover { border-color: var(--nz-or); transform: translateY(-2px); }
.nzk-art__vis {
  aspect-ratio: 16/10; position: relative; max-width: 100%;
  background: linear-gradient(145deg,#aeb4ab,#6d8d6c 54%,#505951);
  background-size: cover; background-position: center;
}
.nzk-art--une .nzk-art__vis { aspect-ratio: 16/8; }
.nzk-art__cat {
  position: absolute; left: 11px; bottom: 11px;
  background: var(--nz-papier); color: var(--nz-vert-f);
  font-size: 9.5px; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; padding: 4px 9px; border-radius: 3px;
}
.nzk-art__cnt { padding: 15px 16px 17px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.nzk-art__meta { font-size: 11.5px; color: var(--nz-gris); display: flex; gap: 12px; flex-wrap: wrap; font-variant-numeric: tabular-nums; }
.nzk-art__t {
  font-family: var(--nz-titre); font-weight: 700; line-height: 1.3; margin: 0;
  font-size: 16px; color: var(--nz-encre);
  hyphens: none !important; overflow-wrap: normal; text-wrap: balance;
}
.nzk-art--une .nzk-art__t { font-size: clamp(19px, 2.1vw, 24px); }
.nzk-art__ex { margin: 0; font-size: 13.5px; color: var(--nz-gris); flex: 1; }
.nzk-art__lire { font-size: 13px; font-weight: 600; color: var(--nz-vert); display: inline-flex; gap: 6px; align-items: center; }

/* Colonne latérale */
.nzk-aside { display: flex; flex-direction: column; gap: var(--nz-3); }
.nzk-bloc-c { background: var(--nz-papier); border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l); overflow: hidden; }
.nzk-bloc-c__h {
  padding: 14px 16px; border-bottom: 1px solid var(--nz-filet);
  font-family: var(--nz-titre); font-size: 13px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; color: var(--nz-vert-f);
}
.nzk-top { display: flex; gap: 11px; padding: 12px 16px; border-bottom: 1px solid var(--nz-filet); text-decoration: none; color: inherit; }
.nzk-top:last-child { border-bottom: 0; }
.nzk-top:hover { background: #ffffff; }
.nzk-top__n {
  width: 24px; height: 24px; border-radius: 5px; flex: none;
  /* Le doré sur doré pâle ne donnait que 2:1 : le chiffre passe au noir,
     l'aplat garde sa teinte de repère. */
  background: var(--nz-or-pale); color: #111111;
  display: grid; place-items: center; font-size: 12px; font-weight: 700;
  font-family: var(--nz-titre);
}
.nzk-top__tx { min-width: 0; }
.nzk-top__t { font-size: 13px; font-weight: 600; line-height: 1.32; display: block; }
.nzk-top__m { font-size: 11px; color: var(--nz-gris); margin-top: 2px; display: block; font-variant-numeric: tabular-nums; }

/* Filtres */
.nzk-filtres { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: var(--nz-3); }
.nzk-filtre {
  padding: 8px 15px; border-radius: 999px; border: 1px solid var(--nz-filet);
  background: var(--nz-papier); color: var(--nz-encre);
  font-size: 13px; font-weight: 500; text-decoration: none;
}
.nzk-filtre:hover { border-color: var(--nz-vert); color: var(--nz-vert); }
.nzk-filtre[aria-current="true"] { background: var(--nz-vert); border-color: var(--nz-vert); color: #fff; font-weight: 600; }

@media (max-width: 1020px) { .nzk-actus { grid-template-columns: 1fr; } }
@media (max-width: 860px) {
  .nzk-liste { grid-template-columns: repeat(2, 1fr); }
  .nzk-liste > .nzk-art--une { grid-column: span 2; }
}
@media (max-width: 560px) {
  .nzk-liste { grid-template-columns: 1fr; }
  .nzk-liste > .nzk-art--une { grid-column: auto; }
}

/* ══ EN-TÊTE DE PAGE INTÉRIEURE ══ */
.nzk-pagehero {
  background: linear-gradient(118deg, #0e1a16 0%, #22352c 42%, #334a3f 78%, #3e594b 100%);
  color: #fff;
  position: relative;
  padding-block: clamp(26px, 3.4vw, 44px) clamp(30px, 3.8vw, 50px);
  font-family: var(--nz-texte);
}
.nzk-pagehero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  height: 3px; background: var(--nz-or);
}
.nzk-pagehero h1 {
  font-family: var(--nz-titre) !important;
  font-size: clamp(25px, 3.4vw, 38px);
  font-weight: 700; line-height: 1.08; margin: 0 0 10px;
  color: #fff !important; letter-spacing: -0.015em;
}
.nzk-pagehero__txt { color: #d4d8d6 !important; font-size: 15px; margin: 0; max-width: 56ch; }
.nzk-pagehero .nzk-sur { color: var(--nz-or-vif) !important; }

/* Fil d'Ariane */
.nzk-fil {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12.5px; color: #3a3a3a; margin-bottom: var(--nz-2);
}
.nzk-fil a { color: #d4d8d6; text-decoration: none; }
.nzk-fil a:hover { color: #fff; text-decoration: underline; }
.nzk-fil span[aria-hidden] { opacity: .5; }

/* Lien de renvoi vers la page complète d'une rubrique */
.nzk-sous__lien--tout {
  color: var(--nz-vert) !important;
  font-weight: 600;
  margin-top: 2px;
}

/* ══════════════════════════════════════════════════════════════════
   FICHES D'ÉCOLE
   Sur 136 établissements publiés, un seul dispose d'une photographie.
   Le visuel de substitution porte donc l'information : sa teinte dit
   le niveau d'enseignement, et l'initiale identifie l'établissement.
   ══════════════════════════════════════════════════════════════════ */
.school-card { transition: border-color .18s ease, transform .18s ease; }
.school-card:hover { transform: translateY(-2px); }

.school-card__fallback {
  background: var(--nz-vert-pale) !important;
  color: var(--nz-vert-f) !important;
  font-family: var(--nz-titre) !important;
  font-weight: 700 !important;
  font-size: clamp(30px, 4vw, 44px) !important;
  letter-spacing: -0.02em;
  position: relative;
}
/* Trame discrète, pour que le bloc ne paraisse pas vide */
.school-card__fallback::after {
  content: ""; position: absolute; inset: 0;
  background: repeating-linear-gradient(135deg, rgba(0,0,0,.035) 0 2px, transparent 2px 12px);
  pointer-events: none;
}

.school-card[data-niveau="prescolaire"] .school-card__fallback {
  background: var(--nz-or-pale) !important; color: #8a5a16 !important;
}
.school-card[data-niveau="primaire"] .school-card__fallback {
  background: var(--nz-vert-pale) !important; color: var(--nz-vert-f) !important;
}
.school-card[data-niveau="secondaire"] .school-card__fallback {
  background: #ffffff !important; color: #27405e !important;
}
.school-card[data-niveau="technique_formation_professionnelle"] .school-card__fallback {
  background: #ffffff !important; color: #8d4320 !important;
}
.school-card[data-niveau="superieur"] .school-card__fallback {
  background: #ffffff !important; color: #4a3b66 !important;
}

/* Les établissements privés se distinguent par un liseré latérite */
.school-card[data-type^="prive"] { }
.school-card[data-type="public"] { }

/* Grille des écoles : quatre fiches par rangée, plus compactes.
   Deux colonnes produisaient des fiches très hautes où dominaient
   les mentions « Non renseigné ». */
.school-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
@media (max-width: 1180px) { .school-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
@media (max-width: 860px)  { .school-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 520px)  { .school-grid { grid-template-columns: 1fr !important; } }

/* Le visuel occupe moins de hauteur */
.school-card__media { aspect-ratio: 16 / 7 !important; }
.school-card__fallback { font-size: clamp(24px, 2.6vw, 34px) !important; }

/* Étiquettes resserrées, une seule rangée */
.school-card__media-badges { gap: 5px !important; padding: 9px !important; }
.school-card__media-badge {
  font-size: 9px !important; padding: 3px 7px !important;
  letter-spacing: .05em !important;
}
.school-card__body { padding: 13px 14px 15px !important; gap: 7px !important; }
.school-card__badges { gap: 5px !important; }
.school-card__badge { font-size: 9.5px !important; padding: 3px 8px !important; }

/* Le nom reste l'élément principal de la fiche */
.school-card h2, .school-card h3, .school-card__title {
  font-size: 15px !important; line-height: 1.3 !important; margin: 2px 0 !important;
}

/* Blocs d'information : compacts, sur deux colonnes */
.school-card__info {
  padding: 8px 10px !important; border-radius: 6px !important; gap: 1px !important;
}
.school-card__info-label { font-size: 8.5px !important; letter-spacing: .07em !important; }
.school-card__info-value { font-size: 12px !important; line-height: 1.25 !important; }
.school-card__footer { padding: 10px 14px !important; }
.school-card__cta { font-size: 12.5px !important; }

/* ═══════════════════════════════════════════════════════════════════
   LIVRÉE UNIQUE — garde-fou
   Les titres du socle posés sur une surface claire fixent leur encre
   plutôt que de l'hériter : aucune feuille tierce ne peut plus les
   éclaircir jusqu'à l'invisibilité (cas du mode sombre système).
   ═══════════════════════════════════════════════════════════════════ */
.nzk-carte__t,
.nzk-agd__h h2,
.nzk-ev__tt,
.nzk-top__t,
.nzk-ac__tt { color: var(--nz-encre); }

/* ═══════════════════════════════════════════════════════════════════
   GALERIE DE CARTE (components/_gallery_card.html.twig)
   Le composant n'avait aucune feuille : ses diapositives s'empilaient
   et le repli s'affichait en vignette dans le coin. Utilisé par les
   pages Gîtes et Sites touristiques.
   ═══════════════════════════════════════════════════════════════════ */
.gc {
  position: relative; display: block; width: 100%; overflow: hidden;
  background: linear-gradient(145deg, #ffffff 0%, #d1d8d4 100%);
}
.gc__slide { position: absolute; inset: 0; display: none; text-decoration: none; }
.gc__slide.is-active { display: block; }
.gc__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gc__fallback,
.gc__slide--broken::after {
  position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 34px; opacity: .55;
}
.gc__slide--broken::after { content: "🏞️"; }
.gc__arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  border: 0; cursor: pointer; color: var(--nz-encre);
  background: rgba(255,255,255,.88);
}
.gc__arrow--prev { left: 8px; }
.gc__arrow--next { right: 8px; }
.gc__dots {
  position: absolute; left: 0; right: 0; bottom: 8px; z-index: 2;
  display: flex; justify-content: center; gap: 5px;
}
.gc__dot {
  width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55);
}
.gc__dot.is-active { background: #fff; }
.gc__counter {
  position: absolute; right: 8px; top: 8px; z-index: 2;
  background: rgba(0,0,0,.52); color: #fff; font-size: 10.5px; font-weight: 600;
  padding: 2px 7px; border-radius: 999px;
}

/* ═══════════════════════════════════════════════════════════════════
   VIE DES QUARTIERS — bloc scindé photo / carte
   ═══════════════════════════════════════════════════════════════════ */
.nzk-quartiers { font-family: var(--nz-texte); }
.nzk-quartiers__in { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; }

/* ── Panneau gauche, sur photo ── */
.nzk-qg { position: relative; isolation: isolate; color: #fff; min-height: 380px; display: flex; }
.nzk-qg__photo {
  position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: center;
}
.nzk-qg__voile {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(170deg, rgba(20,30,26,.62) 0%, rgba(20,30,26,.80) 100%);
}
.nzk-qg__cnt {
  padding: clamp(24px, 3vw, 36px) clamp(20px, 3vw, 40px);
  display: flex; flex-direction: column; gap: 14px; justify-content: center; max-width: 30rem;
}
.nzk-qg__cnt h2 {
  font-family: var(--nz-titre); font-size: clamp(26px, 3vw, 40px) !important;
  font-weight: 700; line-height: 1.1; color: #fff !important; margin: 0 0 8px !important;
}
.nzk-qg__cnt p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.92); }
.nzk-qg__b {
  align-self: flex-start; background: #fff; color: var(--nz-nuit);
  font-weight: 600; font-size: 13.5px; padding: 10px 21px;
  border-radius: 999px; text-decoration: none; margin-bottom: 8px;
}
.nzk-qg__b:hover { background: var(--nz-or-vif); color: #17201c; }
.nzk-qg__b--ligne { background: none; color: #fff; border: 1px solid rgba(255,255,255,.55); }
.nzk-qg__b--ligne:hover { background: #fff; color: var(--nz-nuit); }
.nzk-qg__soc { display: flex; gap: 10px; margin-bottom: 8px; }
.nzk-qg__soc a {
  width: 38px; height: 38px; border-radius: 50%; background: #fff; color: var(--nz-nuit);
  display: grid; place-items: center; text-decoration: none;
}
.nzk-qg__soc a:hover { background: var(--nz-or-vif); }

/* ── Panneau droit, carte ── */
.nzk-qd {
  background: var(--nz-casse); padding: clamp(24px, 3vw, 36px) clamp(20px, 3vw, 40px);
  display: flex; flex-direction: column; gap: 14px; align-items: flex-start;
}
.nzk-qd h2 {
  font-family: var(--nz-titre); font-size: clamp(26px, 3vw, 40px) !important;
  font-weight: 700; line-height: 1.1; color: var(--nz-encre) !important; margin: 0 !important;
}
.nzk-qd__sous { margin: 0; font-size: 14.5px; color: var(--nz-gris); }
.nzk-qd__note { margin: 0; font-size: 12.5px; color: var(--nz-gris); }
.nzk-qcarte {
  width: 100%; flex: 1; min-height: 340px;
  border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l); overflow: hidden;
  background: #ffffff;
}

/* Repère et infobulle, dans l'esprit de la maquette */
.nzk-pin span {
  display: block; width: 15px; height: 15px; border-radius: 50%;
  background: var(--nz-or); border: 2.5px solid #fff;
}
.leaflet-tooltip.nzk-bulle {
  background: var(--nz-vert-f); color: #fff; border: 0; border-radius: 4px;
  padding: 8px 12px; font-family: var(--nz-texte); font-size: 13px; box-shadow: 0 4px 14px rgba(0,0,0,.28);
}
.leaflet-tooltip.nzk-bulle strong { display: block; font-weight: 600; font-size: 13.5px; }
.leaflet-tooltip.nzk-bulle span { display: block; font-size: 12px; opacity: .88; margin-top: 2px; }
.leaflet-tooltip.nzk-bulle::before { border-top-color: var(--nz-vert-f); }

@media (max-width: 900px) {
  .nzk-quartiers__in { grid-template-columns: 1fr; }
  .nzk-qg { min-height: 420px; }
  .nzk-qg__cnt { max-width: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   SITES TOURISTIQUES — thématiques
   Quatre sites sur trente-trois sont photographiés. Plutôt que vingt-
   neuf vignettes identiques, chaque thématique porte sa teinte et son
   pictogramme : la grille se lit d'un coup d'œil malgré l'absence
   d'images. À retirer au fur et à mesure que les photos arrivent.
   ═══════════════════════════════════════════════════════════════════ */
.ts-chip__n {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: rgba(0,0,0,.07); font-size: 10.5px; font-variant-numeric: tabular-nums;
}
.ts-chip.is-active .ts-chip__n { background: rgba(255,255,255,.22); }

/* Teinte et pictogramme par thématique, appliqués au repli de la galerie */
.ts-card--nature     .gc { background: linear-gradient(150deg,#e1e6e2,#c0c8c2); }
.ts-card--faune      .gc { background: linear-gradient(150deg,#e6e3d2,#cdc4a0); }
.ts-card--patrimoine .gc { background: linear-gradient(150deg,#ebe0d4,#d4bda2); }
.ts-card--culte      .gc { background: linear-gradient(150deg,#dfe3ec,#bcc5d8); }
.ts-card--urbain     .gc { background: linear-gradient(150deg,#eee2d6,#dcc2a4); }

.ts-card--nature     .gc__fallback::after,
.ts-card--faune      .gc__fallback::after,
.ts-card--patrimoine .gc__fallback::after,
.ts-card--culte      .gc__fallback::after,
.ts-card--urbain     .gc__fallback::after { font-size: 40px; opacity: .5; }
.ts-card .gc__fallback { font-size: 0; }
.ts-card--nature     .gc__fallback::after { content: "⛰"; }
.ts-card--faune      .gc__fallback::after { content: "🐾"; }
.ts-card--patrimoine .gc__fallback::after { content: "🏛"; }
.ts-card--culte      .gc__fallback::after { content: "🕌"; }
.ts-card--urbain     .gc__fallback::after { content: "🏪"; }

.ts-card__theme {
  background: var(--nz-vert-pale); color: var(--nz-vert-f);
  font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 3px;
}
.ts-card__location { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ── Bande « À ne pas manquer » ── */
.ts-phares { margin-bottom: clamp(26px, 3vw, 40px); }
.ts-phares__hd { margin-bottom: 18px; }
.ts-phares__hd h2 {
  font-family: var(--nz-titre); font-size: 24px !important; font-weight: 700;
  color: var(--nz-encre) !important; margin: 0 0 5px !important;
}
.ts-phares__hd p { margin: 0; font-size: 14px; color: var(--nz-gris); }
.ts-phares__grille { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.ts-phare {
  display: flex; flex-direction: column; background: var(--nz-papier);
  border: 1px solid var(--nz-filet); border-radius: var(--nz-r-l); overflow: hidden;
  text-decoration: none; color: inherit; min-width: 0;
}
.ts-phare:hover { border-color: var(--nz-or); color: inherit; text-decoration: none; }
.ts-phare__vis {
  aspect-ratio: 4/3; position: relative;
  background: #ffffff; background-size: cover; background-position: center;
}
.ts-phare__cat {
  position: absolute; left: 0; bottom: 0; background: var(--nz-nuit); color: #fff;
  font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 6px 11px;
}
.ts-phare__cnt { padding: 14px 15px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.ts-phare__cnt h3 {
  font-family: var(--nz-titre); font-size: 16px !important; font-weight: 700;
  line-height: 1.25; margin: 0 !important; color: var(--nz-encre) !important;
  hyphens: none !important;
}
.ts-phare__lieu { font-size: 11.5px; color: var(--nz-gris); }
.ts-phare__cnt p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--nz-gris); }
@media (max-width: 1100px) { .ts-phares__grille { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px)  { .ts-phares__grille { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════
   BANDE D'INFORMATION DU JOUR — dans le héros
   ═══════════════════════════════════════════════════════════════════ */
.nzk-jour {
  display: flex; flex-wrap: wrap; gap: 10px 26px;
  margin: var(--nz-3) 0 var(--nz-3);
  padding: 13px 0; border-top: 1px solid rgba(255,255,255,.22);
  border-bottom: 1px solid rgba(255,255,255,.22);
}
.nzk-jour__l {
  display: flex; align-items: center; gap: 10px; min-width: 0;
  text-decoration: none; color: #fff; font-size: 13px;
}
.nzk-jour__l:hover { color: var(--nz-or-vif); }
.nzk-jour__e {
  width: 26px; height: 26px; flex: none; border-radius: 50%;
  background: rgba(255,255,255,.16); display: grid; place-items: center;
  font-size: 14px; font-weight: 700; line-height: 1;
}
.nzk-jour__l b {
  display: block; font-size: 10px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--nz-or-vif); margin-bottom: 1px;
}

/* ═══════════════════════════════════════════════════════════════════
   TROUVER RAPIDEMENT — douze liens en texte, sans image
   ═══════════════════════════════════════════════════════════════════ */
.nzk-rapide { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
/* La classe tient « main a:not([class]) » de la charte à distance : sans
   elle ces liens viraient au vert forêt souligné. */
.nzk-rapide__l {
  display: flex; align-items: center; min-height: 52px;
  padding: 12px 16px; background: var(--nz-casse);
  border: 1px solid transparent; border-radius: var(--nz-r);
  font-size: 13.5px; color: var(--nz-encre); text-decoration: none; line-height: 1.3;
}
.nzk-rapide__l:hover { background: var(--nz-vert-pale); border-color: var(--nz-vert); color: var(--nz-vert-f); }
@media (max-width: 980px) { .nzk-rapide { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .nzk-rapide { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════
   BANDEAU D'ALERTE — un message fixe, lisible sans attendre
   ═══════════════════════════════════════════════════════════════════ */
.nzk-alerte { background: #ffffff; color: #111111; font-family: var(--nz-texte); }
.nzk-alerte[hidden] { display: none; }
.nzk-alerte__in {
  display: flex; align-items: center; gap: 12px;
  padding-block: 11px; min-height: 44px;
}
.nzk-alerte__txt { margin: 0; flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.4; }
.nzk-alerte__m { display: none; }
.nzk-alerte__m.est-visible { display: inline; animation: nzk-alerte-entre .45s ease both; }
@keyframes nzk-alerte-entre {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .nzk-alerte__m.est-visible { animation: none; }
}
.nzk-alerte__plus {
  flex: none; font-size: 13px; font-weight: 600; color: #111111;
  text-decoration: underline; text-underline-offset: 3px; white-space: nowrap;
}
.nzk-alerte__plus:hover { color: var(--nz-brique); }
.nzk-alerte__fl, .nzk-alerte__x {
  flex: none; width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid var(--nz-filet); background: none; color: #111111;
  font-size: 15px; line-height: 1; cursor: pointer; display: grid; place-items: center;
}
.nzk-alerte__fl:hover, .nzk-alerte__x:hover { background: rgba(0,0,0,.06); }
.nzk-alerte__x { font-size: 12px; }
@media (max-width: 640px) {
  .nzk-alerte__in { flex-wrap: wrap; }
  .nzk-alerte__txt { flex-basis: 100%; order: -1; }
}

/* Date de mise à jour d'une rubrique — marqueur de sérieux institutionnel */
.nzk-maj { margin: 6px 0 0; font-size: 12.5px; color: var(--nz-gris); }

/* ═══════════════════════════════════════════════════════════════════
   PHARMACIES DE GARDE — secours quand aucune garde n'est programmée
   La page ne donnait alors rien à l'habitant : ni liste, ni numéro.
   ═══════════════════════════════════════════════════════════════════ */
.ph-vide {
  background: var(--nz-or-pale); border: 1px solid #e8cfa4; border-left: 4px solid var(--nz-or);
  border-radius: var(--nz-r); padding: 20px 24px; margin-bottom: 34px;
}
.ph-vide h2 {
  font-family: var(--nz-titre); font-size: 18px !important; font-weight: 700;
  color: #6b4410 !important; margin: 0 0 6px !important;
}
.ph-vide p { margin: 0; font-size: 14px; line-height: 1.6; color: #7a5520; max-width: 70ch; }

.ph-sec { margin-bottom: 38px; }
.ph-sec__t {
  font-family: var(--nz-titre); font-size: 21px !important; font-weight: 700;
  color: var(--nz-encre) !important; margin: 0 0 6px !important;
  padding-bottom: 9px; border-bottom: 2px solid var(--nz-vert);
}
.ph-sec__s { margin: 12px 0 18px; font-size: 13.5px; color: var(--nz-gris); max-width: 72ch; line-height: 1.6; }

.ph-urg { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.ph-urg__c {
  background: #ffffff; color: #111111; border: 1px solid var(--nz-filet); border-radius: var(--nz-r);
  padding: 16px 18px; display: flex; flex-direction: column; gap: 3px;
}
.ph-urg__n { font-family: var(--nz-titre); font-size: 26px; font-weight: 700; line-height: 1; }
.ph-urg__l { font-size: 12.5px; color: #3a3a3a; }

.ph-liste { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.ph-item {
  background: var(--nz-papier); border: 1px solid var(--nz-filet);
  border-radius: var(--nz-r); padding: 15px 17px;
}
.ph-item h3 {
  font-family: var(--nz-titre); font-size: 15px !important; font-weight: 700;
  color: var(--nz-encre) !important; margin: 0 0 4px !important; line-height: 1.3;
}
.ph-item__a { margin: 0 0 10px; font-size: 13px; color: var(--nz-gris); line-height: 1.5; }
.ph-item__b { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ph-item__tel { font-size: 13.5px; font-weight: 600; color: var(--nz-vert-f); text-decoration: none; }
.ph-item__tel:hover { text-decoration: underline; }
.ph-item__map { font-size: 12.5px; color: var(--nz-gris); text-decoration: none; border-bottom: 1px solid var(--nz-filet); }
.ph-item__map:hover { color: var(--nz-vert); }

@media (max-width: 900px) {
  .ph-urg { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ph-liste { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .ph-urg, .ph-liste { grid-template-columns: 1fr; }
}

/* « .container » reçoit d'institutional-main un fond blanc à 90 % et une
   ombre : c'est le cadre de page. Imbriqué dans un en-tête coloré, ce voile
   recouvrait le dégradé et rendait le titre blanc illisible sur blanc. */
.page-header > .container,
.page-hero > .container,
/* Les trois en-têtes légaux ont le même dégradé sombre et le même voile par
   dessus : le panneau clair qu'on voyait sur la politique de confidentialité
   n'était pas le héros, c'était le cadre de page posé devant lui. */
.legal-hero > .container {
  background: transparent;
  border: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 0;
  margin: 0 auto;
  padding: clamp(18px, 2.4vw, 30px) clamp(16px, 3vw, 42px);
}
.page-header .breadcrumb,
.page-header .breadcrumb a,
.page-header .breadcrumb span { color: rgba(255,255,255,.88); }
.page-header .breadcrumb a:hover { color: #fff; }
.page-hero > .container { padding-block: 0; }

/* Transition entre deux vues d'une galerie. Le script retire « is-active »
   et pose « is-leaving » sur la vue sortante : sans règle pour cet état, le
   changement était une coupure sèche. */
.gc__slide.is-leaving { display: block; animation: gc-sortie .26s ease forwards; }
.gc__slide.is-active  { animation: gc-entree .26s ease both; }
@keyframes gc-entree { from { opacity: 0 } to { opacity: 1 } }
@keyframes gc-sortie { from { opacity: 1 } to { opacity: 0 } }
@media (prefers-reduced-motion: reduce) {
  .gc__slide.is-active, .gc__slide.is-leaving { animation: none; }
  .gc__slide.is-leaving { display: none; }
}

/* Relevé météo du héros, affiché seulement si le service répond */
.nzk-meteo__x {
  display: flex; flex-direction: column; gap: 3px;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.2);
  font-size: 11.5px; color: #c8cecb;
}

/* ═══════════════════════════════════════════════════════════════════
   PROJET SIMANDOU — chronologie sourcée
   ═══════════════════════════════════════════════════════════════════ */
.sim-etat { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-bottom: clamp(26px,3vw,40px); }
.sim-etat__c {
  background: var(--nz-papier); border: 1px solid var(--nz-filet);
  border-radius: var(--nz-r-l); padding: 17px 19px;
  display: flex; flex-direction: column; gap: 2px; border-top: 3px solid var(--nz-filet);
}
.sim-etat__c--fait  { border-top-color: var(--nz-vert); }
.sim-etat__c--cours { border-top-color: var(--nz-or); }
.sim-etat__c--prevu { border-top-color: #3a3a3a; }
.sim-etat__c--tot   { border-top-color: var(--nz-nuit); }
.sim-etat__n { font-family: var(--nz-titre); font-size: 30px; font-weight: 700; line-height: 1; color: var(--nz-encre); font-variant-numeric: tabular-nums; }
.sim-etat__l { font-size: 12.5px; color: var(--nz-gris); }

.sim-sec { margin-bottom: clamp(30px,3.6vw,48px); }

.sim-phares { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.sim-phare {
  background: var(--nz-papier); border: 1px solid var(--nz-filet);
  border-left: 3px solid var(--nz-vert); border-radius: var(--nz-r-l); padding: 18px 20px;
}
.sim-phare__date { font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--nz-vert-f); }
.sim-phare h3 { font-family: var(--nz-titre); font-size: 16.5px !important; font-weight: 700; color: var(--nz-encre) !important; margin: 6px 0 8px !important; line-height: 1.3; }
.sim-phare p { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--nz-gris); }
.sim-phare__src { margin-top: 10px !important; font-size: 12px; }

.sim-annee { margin-bottom: 30px; }
.sim-annee__t {
  font-family: var(--nz-titre); font-size: 22px !important; font-weight: 700;
  color: var(--nz-encre) !important; margin: 0 0 14px !important;
  padding-bottom: 8px; border-bottom: 2px solid var(--nz-vert-pale);
  font-variant-numeric: tabular-nums;
}
.sim-fil { list-style: none; margin: 0; padding: 0 0 0 26px; position: relative; }
.sim-fil::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: 8px; width: 2px; background: var(--nz-filet); }
.sim-fil__i { position: relative; padding: 0 0 22px; }
.sim-fil__i::before {
  content: ""; position: absolute; left: -26px; top: 5px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--nz-papier); border: 3px solid var(--nz-filet);
}
.sim-fil__i--realise::before  { border-color: var(--nz-vert); }
.sim-fil__i--en_cours::before { border-color: var(--nz-or); }
/* Un bord pointillé sur un cercle de 14 px se réduit à quelques traits
   illisibles : l'étape programmée se distingue par un repère évidé. */
.sim-fil__i--prevu::before    { border-color: #3a3a3a; background: #ffffff; }
.sim-fil__hd { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.sim-fil__quand { font-size: 12.5px; font-weight: 600; color: var(--nz-gris); }
.sim-badge { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 3px; }
.sim-badge--realise  { background: var(--nz-vert-pale); color: var(--nz-vert-f); }
.sim-badge--en_cours { background: var(--nz-or-pale); color: #7a5520; }
.sim-badge--prevu    { background: #ffffff; color: #3a3a3a; }
.sim-volet { font-size: 11.5px; color: var(--nz-gris); }
.sim-fil__t { font-family: var(--nz-titre); font-size: 15.5px !important; font-weight: 700; color: var(--nz-encre) !important; margin: 0 0 5px !important; line-height: 1.32; }
.sim-fil__d { margin: 0; font-size: 13.5px; line-height: 1.65; color: var(--nz-gris); max-width: 78ch; }
.sim-fil__src { margin: 7px 0 0; font-size: 12px; }
.sim-lien { color: var(--nz-vert-f); text-decoration: underline; text-underline-offset: 2px; }
.sim-lien:hover { color: var(--nz-or); }

.sim-cols { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.sim-bloc { background: var(--nz-casse); border-radius: var(--nz-r-l); padding: 20px 22px; }
.sim-bloc h3 { font-family: var(--nz-titre); font-size: 16px !important; font-weight: 700; color: var(--nz-encre) !important; margin: 0 0 9px !important; }
.sim-bloc p { margin: 0 0 10px; font-size: 13.5px; line-height: 1.65; color: var(--nz-encre); }
.sim-bloc p:last-child { margin-bottom: 0; }
.sim-nuance {
  border-left: 3px solid var(--nz-or); padding-left: 12px;
  color: var(--nz-gris) !important; font-size: 13px !important;
}

.sim-note { background: var(--nz-vert-pale); border-radius: var(--nz-r-l); padding: 22px 24px; }
.sim-note h2 { font-family: var(--nz-titre); font-size: 17px !important; font-weight: 700; color: var(--nz-vert-f) !important; margin: 0 0 10px !important; }
.sim-note p { margin: 0 0 9px; font-size: 13.5px; line-height: 1.7; color: #29342f; max-width: 92ch; }
.sim-note p:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
  .sim-etat { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .sim-phares, .sim-cols { grid-template-columns: 1fr; }
}

/* Ordres de grandeur et situation géographique du projet Simandou */
.sim-grandeurs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.sim-grandeur {
  background: var(--nz-nuit); color: #fff; border-radius: var(--nz-r-l);
  padding: 18px 20px; display: flex; flex-direction: column; gap: 2px;
}
.sim-grandeur__v { font-family: var(--nz-titre); font-size: clamp(21px,2.4vw,27px); font-weight: 700; line-height: 1.1; color: var(--nz-or-vif); }
.sim-grandeur__u { font-size: 12px; color: rgba(255,255,255,.80); }
.sim-grandeur__t { font-size: 13px; font-weight: 600; margin-top: 7px; line-height: 1.35; }
.sim-grandeur__s {
  font-size: 11px; color: rgba(255,255,255,.62); margin-top: 9px;
  padding-top: 8px; border-top: 1px solid rgba(255,255,255,.18);
}

.sim-geo { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: clamp(20px,2.6vw,34px); align-items: start; }
.sim-geo__t h2 {
  font-family: var(--nz-titre); font-size: clamp(20px,2.4vw,26px) !important; font-weight: 700;
  color: var(--nz-encre) !important; margin: 0 0 12px !important;
}
.sim-geo__t p { margin: 0 0 12px; font-size: 14px; line-height: 1.7; color: var(--nz-encre); max-width: 62ch; }
.sim-geo__liens { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 16px; }

.sim-geo__faits {
  margin: 0; background: var(--nz-casse); border-radius: var(--nz-r-l);
  padding: 8px 20px; display: flex; flex-direction: column;
}
.sim-geo__faits > div { padding: 12px 0; border-bottom: 1px solid var(--nz-filet); }
.sim-geo__faits > div:last-child { border-bottom: 0; }
.sim-geo__faits dt {
  font-size: 10.5px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--nz-gris); margin-bottom: 3px;
}
.sim-geo__faits dd { margin: 0; font-size: 14px; font-weight: 600; color: var(--nz-encre); }

@media (max-width: 1000px) { .sim-grandeurs { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 860px)  { .sim-geo { grid-template-columns: 1fr; } }
@media (max-width: 520px)  { .sim-grandeurs { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════
   BULLETIN SIMANDOU — accueil
   ═══════════════════════════════════════════════════════════════════ */
.sim-bull {
  display: grid; grid-template-columns: minmax(0,1fr) 210px;
  gap: clamp(20px,3vw,40px); align-items: center;
  background:
    radial-gradient(ellipse 54% 46% at 18% 24%, #637569 0%, transparent 62%),
    linear-gradient(150deg,#496055 0%,#3c5148 48%,#30443b 100%);
  border-radius: var(--nz-r-l); padding: clamp(22px,2.8vw,34px) clamp(22px,3vw,38px);
  text-decoration: none; color: #fff;
}
.sim-bull:hover { color: #fff; }
.sim-bull:hover .sim-bull__cta { color: var(--nz-or-vif); }
.sim-bull__lbl {
  display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .09em;
  text-transform: uppercase; color: var(--nz-or-vif);
}
.sim-bull__t {
  font-family: var(--nz-titre); font-size: clamp(18px,2.1vw,25px) !important;
  font-weight: 700; line-height: 1.25; color: #fff !important; margin: 7px 0 14px !important;
  max-width: 44ch; hyphens: none !important;
}
.sim-bull__j { margin: 0 0 6px; font-size: 13.5px; line-height: 1.55; color: rgba(255,255,255,.92); max-width: 68ch; }
.sim-bull__j strong { color: var(--nz-or-vif); font-weight: 600; }
.sim-bull__q { color: rgba(255,255,255,.72); }
.sim-bull__cta { display: inline-block; margin-top: 10px; font-size: 13.5px; font-weight: 600; color: #fff; }

.sim-bull__d {
  border-left: 1px solid rgba(255,255,255,.22); padding-left: clamp(18px,2.2vw,28px);
  display: flex; flex-direction: column; gap: 3px;
}
.sim-bull__n { font-family: var(--nz-titre); font-size: 40px; font-weight: 700; line-height: 1; color: var(--nz-or-vif); font-variant-numeric: tabular-nums; }
.sim-bull__n span { font-size: 20px; color: rgba(255,255,255,.62); }
.sim-bull__nl { font-size: 12px; color: rgba(255,255,255,.80); }
.sim-bull__jauge {
  display: block; height: 5px; border-radius: 3px; margin-top: 11px;
  background: rgba(255,255,255,.20); overflow: hidden;
}
.sim-bull__jauge > span { display: block; height: 100%; background: var(--nz-or-vif); border-radius: 3px; }

@media (max-width: 820px) {
  .sim-bull { grid-template-columns: 1fr; }
  .sim-bull__d { border-left: 0; border-top: 1px solid rgba(255,255,255,.22); padding: 16px 0 0; }
}

/* En-tête photographique de la page Simandou */
.sim-hero { position: relative; isolation: isolate; overflow: hidden; }
.sim-hero__photo {
  position: absolute; inset: 0; z-index: -2;
  background-size: cover; background-position: center 42%;
}
.sim-hero__voile {
  position: absolute; inset: 0; z-index: -1;
  /* Dense là où le texte se pose, léger à droite pour laisser voir les
     terrasses et la crête. Le blanc tient 12,5:1 au plus faible. */
  background: linear-gradient(94deg,
    rgba(18,27,24,.93) 0%,
    rgba(18,27,24,.84) 34%,
    rgba(18,27,24,.46) 64%,
    rgba(18,27,24,.22) 100%);
}
.sim-hero .nzk-centre { padding-block: clamp(34px, 4.4vw, 58px); }
.sim-hero__credit {
  margin: 14px 0 0; font-size: 11.5px; color: rgba(255,255,255,.72); max-width: 60ch;
}
@media (max-width: 760px) {
  .sim-hero__voile { background: linear-gradient(180deg, rgba(18,27,24,.90) 0%, rgba(18,27,24,.86) 100%); }
}


/* ══════════════════════════════════════════════════════════════════
   LIENS — COULEUR PAR DÉFAUT
   ══════════════════════════════════════════════════════════════════

   Aucune feuille ne donnait de couleur à « a ». Tout lien qu'aucune règle
   de composant ne visait tombait donc sur le bleu du navigateur : lisible,
   mais étranger à la charte, et illisible sur les fonds sombres du socle.
   La règle de la charte masquait le problème en repeignant de force les
   liens sans classe de toute la page ; elle est maintenant limitée au texte
   courant, d'où ce filet de sécurité.

   Spécificité (0,0,1) : la plus faible possible. Toute règle de composant
   l'emporte, quel que soit l'ordre de chargement. */

a { color: var(--nz-vert); }

/* Sur les blocs sombres, le vert forêt serait vert sur vert. */
.nzk-hero a, .nzk-terr a, .nzk-sel a, .footer a { color: #e6e8e7; }

/* ══════════════════════════════════════════════════════════════════
   INDICATEURS CHIFFRÉS
   ══════════════════════════════════════════════════════════════════

   Remplace les cartes géantes à un seul nombre. Chaque catégorie était
   un panneau dont la hauteur suivait son nombre d'indicateurs : sur
   /communes/beyla, « Démographie » en comptait un et « Économie » cinq,
   ce qui laissait une colonne vide sur presque toute la hauteur. Et
   chaque ligne répétait sa propre description — « 411 727 habitants /
   POPULATION / Population totale en 2022 » disait trois fois la même
   chose — puis « SOURCE : 2022 », dix-sept fois dans la page.

   Ici les blocs s'écoulent en colonnes typographiques : le navigateur
   les équilibre, et un bloc court ne creuse plus de vide. La valeur est
   alignée à droite en chiffres à largeur fixe, de façon que les ordres
   de grandeur se comparent d'un coup d'œil. */

.nzk-ind {
  columns: 2;
  column-gap: clamp(20px, 2.6vw, 38px);
}
@media (max-width: 860px) {
  .nzk-ind { columns: 1; }
}

.nzk-ind__bloc {
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  margin: 0 0 clamp(18px, 2.2vw, 28px);
  border: 1px solid var(--nz-filet);
  border-radius: 10px;
  background: #fff;
  padding: clamp(14px, 1.5vw, 20px) clamp(14px, 1.6vw, 22px);
}

.nzk-ind__tete {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin: 0 0 10px; padding-bottom: 9px;
  border-bottom: 2px solid var(--nz-vert);
}
.nzk-ind__cat {
  font-family: var(--nz-titre); font-size: 16.5px; font-weight: 700;
  color: var(--nz-encre); margin: 0; letter-spacing: -0.01em;
}
.nzk-ind__n {
  font-size: 11px; font-weight: 600; color: var(--nz-gris);
  white-space: nowrap;
}

.nzk-ind__l {
  display: grid; grid-template-columns: 1fr auto; gap: 6px 14px;
  align-items: baseline; padding: 7px 0;
  border-top: 1px solid #eef2f0;
}
.nzk-ind__bloc .nzk-ind__l:first-of-type { border-top: 0; }

.nzk-ind__lib {
  font-size: 13.5px; color: var(--nz-encre); line-height: 1.35; min-width: 0;
}
.nzk-ind__val {
  font-size: 14.5px; font-weight: 700; color: var(--nz-vert);
  font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap;
}

/* La source n'a sa place que quand elle nomme réellement une provenance.
   Une année seule se lit déjà dans l'intitulé de l'indicateur. */
.nzk-ind__src {
  grid-column: 1 / -1; margin: 1px 0 0;
  font-size: 11.5px; color: var(--nz-gris); line-height: 1.4;
}

.nzk-ind__pied {
  margin: clamp(14px, 1.8vw, 22px) 0 0; font-size: 12.5px;
  color: var(--nz-gris); line-height: 1.5;
}


/* Titres des en-têtes légaux. Sans couleur propre, ils prennent celle que
   charte-v3-premium.css impose à tous les titres — une encre foncée — au lieu
   du blanc hérité du bloc, et disparaissent sur le dégradé sombre. */
.legal-hero h1, .legal-hero p { color: #fff !important; }
.legal-hero p { opacity: .78; }

/* ══════════════════════════════════════════════════════════════════
   TITRES — COULEUR HÉRITÉE
   ══════════════════════════════════════════════════════════════════

   charte-v3-premium.css pose « color: var(--text-primary) » sur h1 à h6.
   Une règle qui vise l'élément l'emporte toujours sur la couleur héritée du
   conteneur : tout titre posé dans un bloc sombre sortait donc en encre
   foncée sur fond foncé. Le défaut est revenu quatre fois en une semaine —
   l'annuaire des écoles, la fiche d'école, le futur hôpital régional, les
   pages légales — et chaque fois il a fallu le corriger bloc par bloc.

   Cette règle, de même spécificité mais chargée après, rend aux titres la
   couleur de leur conteneur. Les composants qui fixent explicitement une
   couleur gardent la main : leur sélecteur est plus spécifique. */

h1, h2, h3, h4, h5, h6 { color: inherit; }


/* ══════════════════════════════════════════════════════════════════
   CELLULES DE TABLEAU — COULEUR HÉRITÉE
   ══════════════════════════════════════════════════════════════════

   pages-premium.css impose une couleur aux cellules d'en-tête en
   !important. Un gabarit qui peint sa ligne d'en-tête en vert foncé et
   pose du blanc dessus voyait donc revenir l'encre sombre : « Niveau » et
   les autres intitulés du tableau des frais de scolarité sortaient à 1,86
   de contraste. Même remède que pour les titres — la cellule reprend la
   couleur de sa ligne. Un gabarit qui fixe explicitement la couleur d'une
   cellule garde la main, son sélecteur étant plus spécifique. */

thead th, tbody td { color: inherit !important; }

/* Finition du portail municipal : espaces, repères et recherche. */
body { font-family: var(--nz-texte); background: var(--nz-papier); color: var(--nz-encre); }
.nzk-tete { }
.nzk-marque__ecusson { width: 46px; height: 52px; }
.nzk-marque__sous { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; margin-top: 5px; }
.nzk-marque__bl { color: var(--nz-gris); margin-top: 3px; }
.nzk-btn-or { border-radius: 3px; padding: 12px 16px; }
.nzk-hero__in { padding-block: clamp(28px,4vw,48px) clamp(56px,6vw,72px); }
.nzk-hero__txt { max-width: 660px; }
.nzk-hero__titre { line-height: 1.12; margin-bottom: 16px; }
.nzk-hero__voile { background: linear-gradient(95deg,rgba(21,29,26,.97),rgba(21,29,26,.88) 35%,rgba(21,29,26,.42) 70%,rgba(21,29,26,.18)); }
.nzk-hero p { max-width: 52ch; line-height: 1.75; }
.nzk-hero .nzk-sur { font-family: var(--nz-texte); font-size: 10px; letter-spacing: .18em; }
.nzk-meteo { margin-top: 10px; border-radius: 3px; background: rgba(21,29,26,.78); }
.nzk-recherche { margin: 20px 0; max-width: 570px; }
.nzk-recherche__label { color: #fff; font-size: 12px; font-weight: 500; margin-bottom: 9px; }
.nzk-recherche__champ { display: flex; align-items: center; gap: 12px; padding: 6px 6px 6px 16px; background: #fff; color: var(--nz-vert-f); border: 1px solid #fff; border-radius: 4px; }
.nzk-recherche__champ > svg { flex: none; }
.nzk-recherche__champ input { flex: 1; min-width: 0; width: 100%; border: 0; border-radius: 0; background: #fff; padding: 10px 0; font: 13px var(--nz-texte); color: var(--nz-encre); }
.nzk-recherche__champ input::placeholder { color: #3a3a3a; opacity: 1; }
.nzk-recherche__champ button { display: flex; align-items: center; gap: 12px; flex: none; min-height: 44px; padding: 10px 16px; background: var(--nz-vert-f); color: #fff; border: 0; border-radius: 2px; font: 600 12px var(--nz-texte); cursor: pointer; }
.nzk-recherche__champ button:hover { background: #3d4e48; }
.nzk-recherche__champ:focus-within { outline: 3px solid var(--nz-or-vif); outline-offset: 4px; }
.nzk-ac { padding-block: 16px; }
.nzk-ac__tt { font-family: var(--nz-texte); font-size: 12px; line-height: 1.45; }
.nzk-ac__ss { margin-top: 4px; line-height: 1.5; }
.nzk-ac__ico { border-radius: 50%; }
.nzk-rubrique { margin: 0 0 10px; font: 600 10px var(--nz-texte); text-transform: uppercase; letter-spacing: .18em; color: var(--nz-vert); }
.nzk-accueil .nzk-shead--centre .nzk-trait { display: none; }
.nzk-services { border-bottom: 1px solid var(--nz-filet); }
.nzk-services .nzk-rapide { gap: 0 28px; }
.nzk-services .nzk-rapide__l { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0; border: 0; border-bottom: 1px solid var(--nz-filet); border-radius: 0; background: transparent; font-size: 13px; }
.nzk-services .nzk-rapide__l::after { content: "↗"; color: var(--nz-vert); flex: none; }
.nzk-services .nzk-rapide__l:hover { color: var(--nz-vert); border-bottom-color: var(--nz-vert); }
.nzk-carte { border-radius: 4px; transition: border-color .2s ease, box-shadow .2s ease; }
.nzk-carte:hover { border-color: var(--nz-vert); }
.nzk-carte__vis { aspect-ratio: 16/10; }
.nzk-carte__cnt { padding: 18px; gap: 10px; }
.nzk-carte__badge { font-family: var(--nz-texte); font-size: 9px; letter-spacing: .12em; padding: 9px 14px; }
.nzk-carte__t { line-height: 1.32; }
.nzk-carte__pied { padding-top: 12px; }
.nzk-pagehero { padding-block: clamp(24px,3vw,40px); }
.nzk-pagehero h1 { font-weight: 600; line-height: 1.18; }
.nzk-pied { border-top:1px solid var(--nz-filet); }
:where(.nzk-ac, .nzk-rapide__l, .nzk-carte, .nzk-b-or, .nzk-b-noir, .nzk-b-vert, .nzk-recherche button):focus-visible { outline: 3px solid var(--nz-or); outline-offset: 4px; }
@media (max-width: 760px) {
  .nzk-tete__in { padding-block: 14px; }
  .nzk-hero__in { padding-top: 28px; }
  .nzk-hero__voile { background: rgba(21,29,26,.86); }
  .nzk-hero__txt { width: 100%; }
  .nzk-meteo { width: 100%; min-width: 0; margin: 0; }
  .nzk-meteo__l { gap: 12px; }
  .nzk-meteo__t { font-size: 24px; }
  .nzk-ac { padding-block: 17px; }
  .nzk-carte__cnt { padding: 20px; }
}
@media (max-width: 460px) {
  .nzk-recherche__champ { gap: 7px; padding-left: 10px; }
  .nzk-recherche__champ button { padding-inline: 10px; font-size: 11px; }
  .nzk-recherche__champ button span { display: none; }
  .nzk-recherche__champ input { font-size: 12px; }
  .nzk-marque__bl { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .nzk-carte { transition: none; }
}

/* L'accueil compose ses propres sections ; le panneau historique .container
   ne doit pas ajouter un second cadre autour de la page entière. */
.nzk-accueil #main-content {
  width: 100%; max-width: none; margin: 0; padding: 0;
  border: 0; border-radius: 0; background: #fff;
 backdrop-filter: none;
}
.nzk-accueil .nzk-bloc { padding-block: clamp(24px,3vw,40px); }
.nzk-accueil .nzk-shead { margin-bottom: 20px; }
.nzk-accueil .nzk-shead__txt { margin-top: 10px; line-height: 1.6; }
.nzk-accueil .nzk-rubrique { line-height: 1.4; }
.nzk-accueil .nzk-services { padding-block: clamp(24px,3vw,36px); }
.nzk-accueil .nzk-carte__ex { line-height: 1.65; }
.nzk-accueil .nzk-carte__t { text-wrap: pretty; }
.nzk-alerte { border-bottom: 1px solid var(--nz-filet); }
.nzk-alerte__in { padding-block: 9px; gap: 14px; }
.nzk-alerte__txt { max-width: none; font-size: 12px; line-height: 1.5; }
.nzk-alerte__fl, .nzk-alerte__x { width: 40px; height: 40px; }
.nzk-alerte__plus { font-size: 12px; }
@media (min-width: 981px) {
  .nzk-accueil .nzk-services .nzk-shead { align-items: flex-start; text-align: left; }
  .nzk-accueil .nzk-services .nzk-rapide { grid-template-columns: repeat(3,minmax(0,1fr)); column-gap: 36px; }
}
@media (max-width: 520px) {
  .nzk-accueil .nzk-services { padding-top: 24px; }
  .nzk-alerte__txt { font-size: 12px; }
}

/* Navigation principale : réserver la place de chaque groupe et neutraliser
   les espacements globaux des boutons sur les déclencheurs de sous-menus. */
@media (min-width: 1241px) {
  .nzk-tete__in { max-width:1440px; gap:20px; }
  .nzk-tete .nzk-nav { flex:1 0 auto; min-width:max-content; gap:6px; justify-content:center; }
  .nzk-tete .nzk-nav > * { flex:none; }
  .nzk-tete .nzk-nav .nzk-nav__lien {
    font-size:13.5px !important; padding:10px 9px !important;
    gap:6px !important; min-width:0; width:auto; white-space:nowrap;
  }
  .nzk-tete .nzk-actions-tete { flex:0 0 auto; margin-left:0; gap:10px; }
}
@media (min-width: 1241px) and (max-width: 1350px) {
  .nzk-tete__in { gap:12px; padding-inline:24px; }
  .nzk-tete .nzk-nav { gap:2px; }
  .nzk-tete .nzk-nav .nzk-nav__lien { padding-inline:7px !important; }
  .nzk-tete .nzk-btn-or { padding-inline:13px; }
}

/* Accueil plus lumineux, texte blanc conservé sur un vert contrasté. */
.nzk-accueil .nzk-hero__voile {
  background:linear-gradient(95deg,rgba(42,83,58,.94),rgba(42,83,58,.88) 35%,rgba(42,83,58,.38) 72%,rgba(42,83,58,.12));
}
.nzk-accueil .nzk-meteo { background:rgba(42,83,58,.88); }
@media (max-width: 1240px) {
  /* Les boutons globaux ajoutaient plus de padding que les 40 px de
     largeur du burger : son SVG se retrouvait réduit ou masqué. */
  .nzk-tete .nzk-burger {
    width:46px !important; height:46px !important; min-width:46px;
    padding:0 !important; gap:0 !important; flex:0 0 46px;
    background:#315e43 !important; color:#fff !important;
    border:1px solid #315e43 !important; border-radius:6px !important;
    box-shadow:none !important; overflow:visible !important;
  }
  .nzk-tete .nzk-burger svg { width:20px; height:16px; flex:none; display:block; color:#fff !important; }
  .nzk-tete .nzk-burger svg path { stroke:#fff !important; }
  .nzk-tete .nzk-burger:hover,
  .nzk-tete .nzk-burger[aria-expanded="true"] { background:#244b35 !important; }
  .nzk-tete .nzk-burger:focus-visible { outline:3px solid #b7924f; outline-offset:3px; }
  .nzk-tete .nzk-nav { background:#fff; color:#294b37; }
  .nzk-tete .nzk-nav .nzk-nav__lien {
    width:100%; padding:14px 12px !important; color:#294b37 !important;
    font-size:15px !important; gap:10px !important; justify-content:space-between;
    border-radius:4px !important;
  }
  .nzk-tete .nzk-nav .nzk-nav__fleche { border-color:#315e43; }
  .nzk-tete .nzk-sous.est-ouvert > .nzk-nav__lien { background:#ffffff; }
  .nzk-tete .nzk-sous__panneau { background:#ffffff; }
}
@media (max-width: 820px) {
  .nzk-accueil .nzk-hero__voile { background:rgba(42,83,58,.90); }
}

/* Le libellé rend le menu mobile identifiable sans connaître le pictogramme. */
@media (max-width:1240px) {
  .nzk-tete .nzk-burger {
    width:auto !important; min-width:94px; flex:0 0 auto;
    padding:0 12px !important; gap:9px !important;
  }
  .nzk-tete .nzk-burger span { display:inline; color:#fff; font-size:14px; font-weight:650; line-height:1; }
}
@media (max-width:460px) {
  .nzk-tete__in { gap:10px; }
  .nzk-tete .nzk-marque__nom { font-size:20px; }
  .nzk-tete .nzk-marque__ecusson { width:34px; height:40px; }
  .nzk-tete .nzk-marque { gap:7px; }
}

/* ═══════════════════════════════════════════════════════════════════
   LISIBILITÉ SUR TÉLÉPHONE
   Neuf visites sur dix se font au téléphone : 606 clics contre 58 sur
   ordinateur et 5 sur tablette, relevé Search Console sur 28 jours. À
   390 px de large, la mesure trouvait du texte à 10,8 px et des
   commandes hautes de 19 px, qu'un doigt vise mal. Les valeurs
   ci-dessous ne valent que pour le téléphone : la typographie plus fine
   garde son sens sur grand écran, où elle se lit de près.
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  .nzk-etat { font-size: 13px; }
  .nzk-meteo__d { font-size: 13px; }
  .nzk-ac__ss { font-size: 12.5px; }
  .nzk-rapide__l { font-size: 14px; }
  .nzk-top__m { font-size: 13px; }
  .nzk-pied__bas { font-size: 12.5px; }

  /* Hauteur de doigt. « inline-flex » est nécessaire : un lien reste une
     boîte en ligne, sur laquelle une hauteur n'a aucun effet. */
  .nzk-etat__in a,
  .nzk-alerte__plus,
  .nzk-pied__bas nav a,
  .nzk-pied__col a,
  .nzk-pied__social {
    display: inline-flex; align-items: center; min-height: 40px;
  }

  /* Le pied portait les coordonnées de la mairie en 12 px, et leurs
     intitulés en 10 px — c'est là qu'on cherche une adresse ou un
     horaire, souvent en pleine rue. */
  .seo-breadcrumb a,
  .breadcrumb a,
  #rgpd-more {
    display: inline-flex; align-items: center; min-height: 36px;
  }

  .nzk-pied__contact { font-size: 13.5px; }
  .nzk-pied__contact strong { font-size: 11.5px; }
  .nzk-pied__col a { font-size: 13.5px; }
}

/* Rythme commun : le cadre historique cumulait marges et padding avec
   ceux des sections. Les pages ayant leur propre composition conservent
   leurs règles, plus spécifiques (accueil, actualités, démarches…). */
:where(#main-content).container {
  margin-block: 0;
  padding-block: clamp(16px, 2vw, 24px);
  padding-inline: clamp(16px, 3vw, 32px);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: var(--nz-papier);
  backdrop-filter: none;
}
#main-content :where(.section, .section-sm, .section-lg) {
  margin-top: 0;
  padding-block: clamp(24px, 3vw, 40px);
}
#main-content > .container { margin-block: 0; }
@media (max-width: 760px) {
  .nzk-tete__in { padding-block: 10px; }
  .nzk-qg { min-height: 0; }
}