/* ==========================================================================
   CDG46 — Socle commun des sites communes
   Toutes les couleurs / polices viennent des réglages du site (variables
   injectées en ligne par setup.typoscript). Aucune ressource externe.
   ========================================================================== */

:root {
  --c-fond: #fff;
  --c-bordure: #e5e7eb;
  --c-texte-second: #4b5563;
  --l-conteneur: 1240px;
  --e-section: clamp(2.5rem, 6vw, 4.5rem);
  --ombre: 0 1px 2px rgb(0 0 0 / .06), 0 4px 16px rgb(0 0 0 / .06);
  --cible: 44px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--f-texte);
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--c-texte);
  background: var(--c-fond);
}
img, svg { max-width: 100%; height: auto; display: block; }
a { color: var(--c-primaire); text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }
h1, h2, h3, h4 { font-family: var(--f-titres); line-height: 1.2; margin: 0 0 .6em; color: var(--c-texte); }
h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
h3 { font-size: 1.2rem; }
p { margin: 0 0 1em; }
address { font-style: normal; }

/* Focus visible sur tous les fonds (RGAA 10.7) : contour de la couleur d'accent, doublé d'un liseré blanc
   qui reste visible sur les fonds sombres et les photos */
:focus-visible { outline: 3px solid var(--c-accent); outline-offset: 2px; box-shadow: 0 0 0 7px #fff; }
/* Blocs qui reçoivent le focus après un lien d'évitement ou une ancre : contour à l'intérieur, non rogné */
main:focus-visible, .frame:focus-visible, .navigation:focus-visible, .pied:focus-visible { outline-offset: -3px; box-shadow: inset 0 0 0 6px #fff; }
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.conteneur { width: 100%; max-width: var(--l-conteneur); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem); }
.icone { width: 1.5em; height: 1.5em; flex: none; }

/* --- Liens d'évitement --------------------------------------------------- */
.evitement a {
  position: absolute; left: 1rem; top: -100px; z-index: 1000;
  background: var(--c-secondaire); color: var(--c-sur-secondaire);
  padding: .75rem 1rem; border-radius: 4px; font-weight: 700;
}
.evitement a:focus { top: 1rem; }

/* --- Bandeau d'alerte ---------------------------------------------------- */
.alerte { background: #991b1b; color: #fff; }
.alerte .conteneur { display: flex; gap: .75rem; align-items: center; padding-block: .6rem; }
.alerte p { margin: 0; font-weight: 600; }

/* --- Boutons ------------------------------------------------------------- */
.bouton {
  display: inline-flex; align-items: center; gap: .5rem; min-height: var(--cible);
  padding: .6rem 1.4rem; border-radius: calc(var(--r-carte) * .75);
  background: var(--c-primaire); color: var(--c-sur-primaire);
  font-weight: 700; text-decoration: none; border: 2px solid var(--c-primaire);
}
.bouton:hover { background: transparent; color: var(--c-primaire); }
.bouton--clair { background: #fff; color: #111; border-color: #fff; }
.bouton--clair:hover { background: transparent; color: #fff; }
.bouton--petit { min-height: 2.5rem; padding: .35rem 1rem; font-weight: 400; }
/* Bouton visuel « Lire la suite » des cartes (affiché par le CSS du modèle) */
.lire-la-suite { display: none; }
/* Visuel des événements de l'agenda (affiché par le CSS du modèle) */
.agenda__media { display: none; }

/* ==========================================================================
   En-tête
   ========================================================================== */
.entete { position: relative; z-index: 50; background: #fff; border-bottom: 1px solid var(--c-bordure); }
.entete__barre { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 5rem; }
.logo { display: flex; align-items: center; gap: .75rem; text-decoration: none; color: inherit; }
.logo__blason { color: var(--c-primaire); }
.logo__blason .icone { width: 2.6rem; height: 2.6rem; }
.logo__texte { display: flex; flex-direction: column; line-height: 1.15; }
.logo__surtitre { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.logo__nom { font-family: var(--f-titres); font-size: 1.45rem; font-weight: 700; white-space: nowrap; }
.logo__mention { font-size: .85rem; opacity: .85; }

.navigation__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .1rem; }
.navigation__item { position: relative; }
.navigation__lien {
  display: inline-flex; align-items: center; gap: .25rem; min-height: var(--cible);
  padding: .5rem .8rem; border: 0; background: none; font: inherit; font-weight: 600;
  color: var(--c-texte); text-decoration: none; cursor: pointer; border-radius: 4px;
}
.navigation__lien .icone { width: 1rem; height: 1rem; transition: transform .2s; }
.navigation__lien:hover, .navigation__lien.actif { color: var(--c-primaire); }
.navigation__lien.actif { box-shadow: inset 0 -3px 0 currentColor; }
.navigation__deplier[aria-expanded="true"] .icone { transform: rotate(180deg); }
.sous-menu {
  display: none; position: absolute; top: 100%; left: 0; min-width: 16rem; list-style: none;
  margin: 0; padding: .5rem; background: #fff; color: var(--c-texte);
  border-radius: var(--r-carte); box-shadow: var(--ombre); border: 1px solid var(--c-bordure);
}
.navigation__deplier[aria-expanded="true"] + .sous-menu { display: block; }
.sous-menu a { display: block; padding: .55rem .75rem; color: inherit; text-decoration: none; border-radius: 4px; }
.sous-menu a:hover, .sous-menu a[aria-current] { background: var(--c-surface); color: var(--c-primaire); }

.menu-bouton {
  display: none; align-items: center; gap: .4rem; min-height: var(--cible); padding: .5rem .9rem;
  border: 2px solid currentColor; border-radius: 4px; background: none; color: inherit; font: inherit; font-weight: 700; cursor: pointer;
}

/* --- Recherche (loupe) --------------------------------------------------- */
.navigation { margin-left: auto; }
.recherche { position: relative; order: 2; }
.recherche__bouton {
  display: grid; place-items: center; width: var(--cible); height: var(--cible);
  border: 0; border-radius: 50%; background: none; color: inherit; cursor: pointer;
}
.recherche__bouton:hover, .recherche__bouton[aria-expanded="true"] { background: rgb(0 0 0 / .08); }
.recherche__formulaire {
  position: absolute; right: 0; top: calc(100% + .5rem); z-index: 60; display: flex; gap: .5rem;
  width: min(28rem, calc(100vw - 2rem)); padding: .75rem; background: #fff; color: var(--c-texte);
  border-radius: var(--r-carte); box-shadow: var(--ombre); border: 1px solid var(--c-bordure);
}
.recherche__formulaire[hidden] { display: none; }
.recherche__formulaire input {
  flex: 1; min-width: 0; min-height: var(--cible); padding: .5rem .75rem; font: inherit;
  border: 1px solid #6b7280; border-radius: calc(var(--r-carte) * .75);
}
.recherche__formulaire input:focus-visible { outline-color: var(--c-primaire); }
.entete--couleur .recherche__bouton:hover,
.entete--couleur .recherche__bouton[aria-expanded="true"],
.entete--transparent .recherche__bouton:hover,
.entete--transparent .recherche__bouton[aria-expanded="true"] { background: rgb(255 255 255 / .15); }
.entete--transparent.est-accueil .recherche__bouton { color: #fff; }

/* Variante : fond couleur primaire */
.entete--couleur .entete { background: var(--c-primaire); color: var(--c-sur-primaire); border: 0; }
.entete--couleur .logo__blason,
.entete--couleur .navigation__lien { color: var(--c-sur-primaire); }
.entete--couleur .navigation__lien:hover { background: rgb(255 255 255 / .12); color: var(--c-sur-primaire); }

/* Variante : transparente au-dessus du carrousel (accueil uniquement) */
.entete--transparent.est-accueil .entete {
  position: absolute; inset: 0 0 auto; background: linear-gradient(rgb(0 0 0 / .55), transparent);
  color: #fff; border: 0;
}
.entete--transparent.est-accueil .logo__blason,
.entete--transparent.est-accueil .navigation__lien { color: #fff; }
.entete--transparent:not(.est-accueil) .entete { background: var(--c-primaire); color: var(--c-sur-primaire); }
.entete--transparent:not(.est-accueil) .logo__blason,
.entete--transparent:not(.est-accueil) .navigation__lien { color: var(--c-sur-primaire); }

@media (max-width: 1100px) {
  /* L'ordre visuel suit l'ordre de tabulation (RGAA 12.8) : bouton Menu, puis recherche */
  .menu-bouton { display: inline-flex; order: 2; margin-left: auto; }
  .recherche { order: 3; }
  .navigation { display: none; flex-basis: 100%; order: 4; }
  .navigation.est-ouverte { display: block; }
  .entete__barre { flex-wrap: wrap; padding-block: .5rem; }
  .navigation__liste { flex-direction: column; padding-bottom: 1rem; }
  .navigation__lien { width: 100%; justify-content: space-between; }
  .sous-menu { position: static; box-shadow: none; border: 0; padding-left: 1rem; background: transparent; color: inherit; }
  .entete--transparent.est-accueil .navigation.est-ouverte { background: rgb(0 0 0 / .85); margin-inline: -1rem; padding-inline: 1rem; }
}

/* ==========================================================================
   Carrousel
   ========================================================================== */
.carrousel { position: relative; min-height: var(--h-carrousel); display: grid; color: #fff; overflow: hidden; background: var(--c-secondaire); }
.carrousel__diapos, .carrousel__texte { grid-area: 1 / 1; }
.carrousel__diapo { position: relative; height: 100%; }
.carrousel__diapo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(0 0 0 / .2), rgb(0 0 0 / .55)); }
/* Hauteur imposée par le réglage du site : la photo est recadrée (object-fit), jamais étirée */
.carrousel__image { width: 100%; height: var(--h-carrousel); object-fit: cover; }
.carrousel__diapo--degrade { min-height: var(--h-carrousel); background: linear-gradient(135deg, var(--c-primaire), var(--c-secondaire)); }
.carrousel__texte { position: relative; z-index: 2; align-self: center; padding-block: 7rem 4rem; }
.carrousel__titre { font-family: var(--f-titres); font-size: clamp(2.2rem, 6vw, 4rem); font-weight: 700; line-height: 1.1; margin-bottom: .3em; text-shadow: 0 2px 12px rgb(0 0 0 / .4); }
.carrousel__accroche { font-family: var(--f-deco); font-size: clamp(1.3rem, 3vw, 2rem); margin-bottom: 1.5rem; max-width: 40ch; }
.carrousel__commandes { position: absolute; z-index: 3; right: 1rem; bottom: 1rem; display: flex; gap: .5rem; }
.carrousel__bouton {
  width: var(--cible); height: var(--cible); display: grid; place-items: center; cursor: pointer;
  border: 2px solid #fff; border-radius: 50%; background: rgb(0 0 0 / .45); color: #fff;
}
/* Bouton pause : icône « lecture » quand le défilement est arrêté */
.carrousel__bouton .icone--lecture, .carrousel__bouton[data-etat="arret"] .icone--pause { display: none; }
.carrousel__bouton[data-etat="arret"] .icone--lecture { display: block; }
/* Transition entre deux images (fondu, comme le carrousel de Bootstrap Package) */
.carrousel__diapo.est-active { animation: carrousel-fondu .8s ease; }
@keyframes carrousel-fondu { from { opacity: 0; } }
/* Crédit photo (légende de l'image) */
.carrousel__credit { position: absolute; z-index: 2; left: .75rem; bottom: .5rem; margin: 0; max-width: 60%; font-size: .75rem; color: #fff; text-shadow: 0 1px 3px rgb(0 0 0 / .9); }
@media (max-width: 600px) { .carrousel__credit { bottom: auto; top: .5rem; max-width: calc(100% - 1.5rem); font-size: .7rem; } }
/* Indicateurs : un trait par image, l'image affichée est mise en évidence */
.carrousel__indicateurs { position: absolute; z-index: 3; left: 50%; bottom: 1.25rem; transform: translateX(-50%); display: flex; gap: .35rem; }
.carrousel__indicateur { width: 1.75rem; height: 1.5rem; padding: 0; border: 0; background: none; cursor: pointer; }
.carrousel__indicateur::before { content: ""; display: block; height: 3px; background: rgb(255 255 255 / .55); }
.carrousel__indicateur[aria-current]::before { height: 5px; background: #fff; }

/* ==========================================================================
   Sections de la page d'accueil
   ========================================================================== */
.accueil > .frame, .accueil__principal > .frame { padding-block: var(--e-section); }
.accueil > .frame > *, .accueil__principal > .frame > * {
  max-width: var(--l-conteneur); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem);
}
.frame-fond-surface { background: var(--c-surface); }
.frame-fond-primaire { background: var(--c-primaire); color: var(--c-sur-primaire); }
.frame-fond-secondaire { background: var(--c-secondaire); color: var(--c-sur-secondaire); }
.frame-fond-primaire :is(h2, h3, a:not(.bouton)), .frame-fond-secondaire :is(h2, h3, a:not(.bouton)) { color: inherit; }
.frame-bordure-haut { border-top: 4px solid var(--c-primaire); }

/* Titres de section */
.frame > header h2 { font-family: var(--f-deco); color: var(--c-primaire); }
.frame > header h2 a { color: inherit; text-decoration: none; }
.frame > header h2 a:hover { text-decoration: underline; }
.frame-fond-primaire :is(.frame-header, .frame > header) h2, .frame-fond-secondaire :is(.frame-header, .frame > header) h2 { color: inherit; }
.titres--majuscules :is(.frame-header, .frame > header) h2 { text-transform: uppercase; letter-spacing: .04em; font-family: var(--f-titres); }
.titres--souligne :is(.frame-header, .frame > header) h2 { padding-bottom: .4rem; border-bottom: 3px solid var(--c-secondaire); display: inline-block; }
.accueil :is(.frame-header, .frame > header) { text-align: center; margin-bottom: 2rem; }
.accueil :is(.frame-header, .frame > header) h2 { font-size: clamp(1.7rem, 3.5vw, 2.4rem); }

/* --- Cartes / accès rapides ---------------------------------------------- */
.cartes { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.cartes__lien {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; height: 100%;
  min-height: 8.5rem; padding: 1.25rem 1rem; text-align: center; text-decoration: none; font-weight: 700;
  color: var(--c-primaire); background: #fff; border: 1px solid var(--c-bordure); border-radius: var(--r-carte);
  transition: transform .15s, box-shadow .15s;
}
.cartes__lien:hover { transform: translateY(-2px); box-shadow: var(--ombre); }
.cartes__icone .icone { width: 2.4rem; height: 2.4rem; }
.cartes__texte { font-weight: 400; color: var(--c-texte); font-size: .95rem; }
.frame-fond-primaire .cartes__lien, .frame-fond-secondaire .cartes__lien { background: rgb(255 255 255 / .1); border-color: rgb(255 255 255 / .35); color: inherit; }
.frame-fond-primaire .cartes__texte, .frame-fond-secondaire .cartes__texte { color: inherit; }
/* layout 1 : cartes larges avec texte */
.cartes--1 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.cartes--1 .cartes__lien { align-items: flex-start; text-align: left; justify-content: flex-start; }
/* layout 2 : réseaux sociaux */
.cartes--2 { display: flex; justify-content: center; gap: .75rem; }
.cartes--2 .cartes__lien { min-height: 0; width: 3.25rem; height: 3.25rem; padding: 0; border-radius: 50%; background: var(--c-primaire); color: var(--c-sur-primaire); border: 0; }
.cartes--2 .cartes__icone .icone { width: 1.5rem; height: 1.5rem; }

/* --- Actualités ---------------------------------------------------------- */
.actualites { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.carte-actu { position: relative; height: 100%; display: flex; flex-direction: column; background: #fff; color: var(--c-texte); border-radius: var(--r-carte); overflow: hidden; box-shadow: var(--ombre); }
.carte-actu__media img, .carte-actu__vide { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.carte-actu__vide { display: block; background: linear-gradient(135deg, var(--c-primaire), var(--c-secondaire)); opacity: .85; }
.carte-actu__corps { padding: 1.1rem 1.25rem 1.4rem; }
.carte-actu__date { font-size: .9rem; color: var(--c-texte-second); margin-bottom: .3rem; }
.carte-actu__titre { margin-bottom: .5rem; }
.carte-actu__titre a { color: var(--c-texte); text-decoration: none; }
.carte-actu:hover .carte-actu__titre a { color: var(--c-primaire); text-decoration: underline; }
.lien-etendu::after { content: ""; position: absolute; inset: 0; }
.carte-actu__resume { margin: 0; color: var(--c-texte-second); }

/* --- Agenda -------------------------------------------------------------- */
.agenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.agenda__item { position: relative; display: flex; gap: 1rem; align-items: flex-start; padding: 1rem; background: #fff; color: var(--c-texte); border-radius: var(--r-carte); border: 1px solid var(--c-bordure); }
.agenda__date { flex: none; display: grid; place-items: center; width: 4.5rem; padding: .5rem 0; border-radius: var(--r-carte); background: var(--c-primaire); color: var(--c-sur-primaire); line-height: 1.1; }
.agenda__jour { font-size: 1.8rem; font-weight: 700; }
.agenda__mois { text-transform: uppercase; font-size: .85rem; }
.agenda__titre { margin-bottom: .25rem; font-size: 1.1rem; }
.agenda__titre a { color: inherit; }
.agenda__item p { margin: 0; color: var(--c-texte-second); font-size: .95rem; }
.accueil__lateral .agenda { grid-template-columns: 1fr; }

/* --- Publications -------------------------------------------------------- */
.publications { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.publications__item { position: relative; display: flex; gap: .9rem; align-items: center; padding: 1rem 1.25rem; border-radius: var(--r-carte); background: var(--c-surface); color: var(--c-texte); }
.publications__item > .icone { color: var(--c-primaire); width: 2rem; height: 2rem; }
.publications__titre { margin: 0; font-size: 1.05rem; }
.publications__titre a { color: inherit; }
.publications__date { margin: 0; font-size: .9rem; color: var(--c-texte-second); }

.liste__tout { text-align: center; margin: 2rem 0 0; }

/* --- Coordonnées et plan d'accès (élément de contenu) ---------------------- */
.coordonnees { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; align-items: center; }
.coordonnees--sans-carte { grid-template-columns: minmax(0, 1fr); }
.coordonnees--1 .coordonnees__carte { order: -1; }
.coordonnees__texte { text-align: center; }
.coordonnees__texte p { margin-bottom: .6rem; }
.coordonnees__mairie { font-weight: 700; }
.coordonnees__sous-titre { margin: 1.25rem 0 .6rem; }
.coordonnees__carte .frame { margin: 0; padding: 0; }
.coordonnees__carte .frame > header { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.coordonnees__carte .maps2 { width: 100% !important; height: 17rem !important; }
.coordonnees__carte [id^="maps2-"]:not(.maps2) { padding: 1.25rem; font-size: .95rem; background: var(--c-surface); border: 1px solid var(--c-bordure); }
.coordonnees__carte [id^="maps2-"]:not(.maps2) h3 { font-size: 1.05rem; }
@media (max-width: 800px) {
  .coordonnees { grid-template-columns: minmax(0, 1fr); }
  .coordonnees--1 .coordonnees__carte { order: 0; }
}

/* --- Texte & média (mot du maire, présentation…) ------------------------- */
.accueil > :is(.frame-type-text, .frame-type-textmedia) > * { max-width: calc(78ch + 4rem); }
.accueil .frame-type-text, .accueil .frame-type-textmedia { font-size: 1.1rem; }

/* ==========================================================================
   Gabarits
   ========================================================================== */
.accueil--deux-colonnes {
  max-width: var(--l-conteneur); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2rem);
  display: grid; gap: 2rem; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
}
.accueil--deux-colonnes .accueil__principal > .frame > * { padding-inline: 0; }
.accueil--deux-colonnes .accueil__principal > .carrousel { margin-inline: calc(-1 * clamp(1rem, 4vw, 2rem)); }
.accueil__lateral { padding-block: var(--e-section); }
.accueil__lateral .frame { margin-bottom: 2rem; }
.accueil__lateral :is(.frame-header, .frame > header) { text-align: left; }
.accueil__lateral :is(.frame-header, .frame > header) h2 { font-size: 1.4rem; }
@media (max-width: 960px) { .accueil--deux-colonnes { grid-template-columns: 1fr; } }

.accueil--one-page > .frame { scroll-margin-top: 1rem; }
.accueil--one-page > .frame:nth-of-type(even) { background: var(--c-surface); }

.page-interne { padding-block: 2rem var(--e-section); }
.page-interne__titre { color: var(--c-primaire); }
.contenu-editorial { max-width: 75ch; }

/* --- Gabarits de page (CDG46 + Bootstrap Package) ------------------------- */
.gabarit__colonnes { display: grid; gap: 2.5rem; grid-template-columns: minmax(0, 1fr); align-items: start; }
.gabarit--75-25 .gabarit__colonnes { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.gabarit--25-75 .gabarit__colonnes { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); }
.gabarit--50-50 .gabarit__colonnes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gabarit--decale-droite .gabarit__colonnes { grid-template-columns: minmax(0, 7fr) minmax(0, 3fr); column-gap: 6rem; }
.gabarit--25-50-25 .gabarit__colonnes { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); }
.gabarit--sousnav-gauche .gabarit__colonnes { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); }
.gabarit--sousnav-gauche-2 .gabarit__colonnes { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
.gabarit--sousnav-droite .gabarit__colonnes { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.gabarit--sousnav-droite-2 .gabarit__colonnes { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
/* Plusieurs colonnes : le texte principal suit la largeur de sa colonne */
.gabarit:not(.gabarit--standard) .gabarit__principal { max-width: none; }
/* Colonne latérale sans contenu : masquée (la colonne principale garde sa place dans la grille) */
.gabarit__lateral:not(:has(*)) { visibility: hidden; }
.gabarit__lateral { padding: 1.25rem; background: var(--c-surface); border-radius: var(--r-carte); }
.gabarit__lateral .frame { margin-bottom: 1.5rem; }
.gabarit__lateral .frame:last-child { margin-bottom: 0; }
@media (max-width: 900px) {
  .gabarit .gabarit__colonnes { grid-template-columns: minmax(0, 1fr); }
}

/* Zones des gabarits Bootstrap Package */
.zone { margin-bottom: 2rem; }
.zone--bordure { margin: 0; }
.zone--bordure > .frame { margin: 0; }
.zone--grille { display: grid; gap: 2rem; }
.zone--grille-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.zone--grille-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.zone--pied { margin: 0; padding-block: 2.5rem; background: var(--c-surface); }

/* Sous-navigation de rubrique */
.sous-navigation { align-self: start; border-left: 4px solid var(--c-primaire); padding-left: 1rem; }
.sous-navigation__titre { font-family: var(--f-titres); font-weight: 700; font-size: 1.15rem; margin-bottom: .5rem; }
.sous-navigation ul { list-style: none; margin: 0; padding: 0; }
.sous-navigation ul ul { padding-left: 1rem; }
.sous-navigation__lien { display: block; padding: .45rem 0; color: var(--c-texte); text-decoration: none; }
.sous-navigation__lien:hover, .sous-navigation__lien.actif, .sous-navigation__lien[aria-current] { color: var(--c-primaire); text-decoration: underline; }
.sous-navigation__lien[aria-current] { font-weight: 700; }
/* Pages de liste (actualités, agenda, publications) : la grille de cartes prend toute la largeur */
.contenu-editorial:has(.actualites, .agenda, .publications) { max-width: none; }

/* --- Pagination (EXT:news) ----------------------------------------------- */
.pagination__liste { list-style: none; margin: 2.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; }
.pagination__lien {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem; min-width: var(--cible); min-height: var(--cible); padding: .4rem .8rem;
  border: 1px solid var(--c-primaire); border-radius: calc(var(--r-carte) * .75);
  color: var(--c-primaire); background: #fff; text-decoration: none; font-weight: 600;
}
.pagination__lien:hover { background: var(--c-primaire); color: var(--c-sur-primaire); }
.pagination__lien--courant { background: var(--c-primaire); color: var(--c-sur-primaire); }
.pagination__ellipse { align-self: center; padding-inline: .25rem; }
.contenu-editorial .frame { margin-bottom: 2rem; }

.fil-ariane { background: var(--c-surface); font-size: .95rem; }
.fil-ariane ol { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; padding-block: .75rem; margin-block: 0; }
.fil-ariane li + li::before { content: "›"; margin-right: .4rem; color: var(--c-texte-second); }


/* --- Cartes OpenStreetMap (maps2 / Leaflet) ------------------------------- */
/* Leaflet utilise des z-index de 400 à 1000 : on les confine dans le bloc carte (nouveau contexte
   d'empilement), sinon la carte passe au-dessus de l'en-tête collant et du formulaire de recherche */
.tx-maps2, .maps2 { position: relative; z-index: 0; isolation: isolate; }
/* --- Formulaires (EXT:form, ke_search) ----------------------------------- */
.contenu-editorial form { max-width: 40rem; }
.form-group, .contenu-editorial .form-check { margin-bottom: 1.1rem; }
.form-label, .form-check-label { display: block; font-weight: 600; margin-bottom: .3rem; }
.form-check-label { display: inline; font-weight: 400; }
.form-control, .form-select,
.contenu-editorial :is(input[type="text"], input[type="email"], input[type="tel"], input[type="search"], textarea, select) {
  width: 100%; min-height: var(--cible); padding: .55rem .75rem; font: inherit; color: var(--c-texte);
  background: #fff; border: 1px solid #6b7280; border-radius: calc(var(--r-carte) * .75);
}
.contenu-editorial textarea { min-height: 10rem; }
/* Anti-spam ALTCHA : espacement avant le bouton d'envoi */
.contenu-editorial altcha-widget { display: block; margin-block: .5rem 1.5rem; }
.form-text, .help-block { display: block; font-size: .9rem; color: var(--c-texte-second); margin-top: .25rem; }
.invalid-feedback, .error .help-block { display: block; color: #b91c1c; font-weight: 600; }
.has-error :is(input, textarea, select) { border-color: #b91c1c; }
.contenu-editorial :is(button[type="submit"], input[type="submit"]) {
  min-height: var(--cible); padding: .6rem 1.4rem; font: inherit; font-weight: 700; cursor: pointer;
  border: 2px solid var(--c-primaire); border-radius: calc(var(--r-carte) * .75);
  background: var(--c-primaire); color: var(--c-sur-primaire);
}
.contenu-editorial :is(button[type="submit"], input[type="submit"]):hover { background: transparent; color: var(--c-primaire); }

/* ==========================================================================
   Pied de page
   ========================================================================== */
.pied { background: var(--c-pied, var(--c-secondaire)); color: var(--c-sur-pied, var(--c-sur-secondaire)); }
.pied a { color: inherit; }
.pied__grille { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); padding-block: 3rem; }
.pied__titre { font-size: 1.15rem; color: inherit; }
.pied__bloc p { margin-bottom: .4rem; }
.pied__liens { list-style: none; margin: 0; padding: 0; }
.pied__liens li { margin-bottom: .4rem; }
.pied__meta { border-top: 1px solid rgb(255 255 255 / .2); font-size: .9rem; }
.pied__meta p { margin: 0; padding-block: 1rem; }
/* Encart accessibilité : variante activée par le CSS du modèle (ex. modèle 2) */
.pied__accessibilite { display: none; }
/* Logos partenaires (réglage cdg46.pied.partenaires) : vignettes blanches */
.pied__partenaires { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr)); }
.pied__partenaire { display: grid; place-items: center; aspect-ratio: 1; padding: .5rem; background: #fff; }
.pied__partenaire img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
/* Plan d'accès en bandeau pleine largeur (réglage cdg46.apparence.carteBandeau) */
.carte-bandeau .frame { margin: 0; padding: 0; }
.carte-bandeau .frame > header { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.carte-bandeau .maps2 { width: 100% !important; height: clamp(16rem, 30vw, 24rem) !important; }
.carte-bandeau [id^="maps2-"]:not(.maps2) { padding: 2rem clamp(1rem, 4vw, 2rem); text-align: center; background: var(--c-surface); }

.haut-de-page {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 40; width: var(--cible); height: var(--cible);
  display: grid; place-items: center; border-radius: 50%;
  background: var(--c-primaire); color: var(--c-sur-primaire); box-shadow: var(--ombre);
  opacity: 0; pointer-events: none; transition: opacity .2s;
}
.haut-de-page.est-visible, .haut-de-page:focus { opacity: 1; pointer-events: auto; }

/* Règles propres à chaque modèle : Css/Modeles/modele-XX.css (chargées par le site set du modèle). */
.logo__image { height: 3.5rem; width: auto; }
.logo__blason-image { height: 4rem; width: auto; }
/* Mobile : la barre garde une place fixe pour la loupe et le bouton Menu, le logo prend le reste
   (un logo large ou un nom de commune long passe à la ligne au lieu de pousser les boutons) */
@media (max-width: 1100px) {
  .entete__barre { position: relative; }
  .logo { flex: 1 1 0; min-width: 0; }
  .logo__texte { min-width: 0; }
  .logo__nom { white-space: normal; overflow-wrap: anywhere; font-size: clamp(1.05rem, 4.5vw, 1.45rem); }
  .logo__image { width: 100%; height: 3rem; max-width: 16rem; object-fit: contain; object-position: left center; }
  .logo__blason-image { height: 2.75rem; flex: none; }
  .recherche, .menu-bouton { flex: none; }
  /* Formulaire de recherche : pleine largeur sous la barre, plus aligné sur la loupe (débordait hors écran) */
  .recherche { position: static; }
  .recherche__formulaire { left: .5rem; right: .5rem; width: auto; top: 100%; }
}
/* Bouton « Contact » de l'en-tête : variante activée par le CSS du modèle (ex. modèle 11) */
.entete__contact { display: none; }
/* Barre d'informations sous l'en-tête (date, plan, téléphone) : variante activée par le CSS du modèle (ex. modèle 5) */
.infos { display: none; }
.infos__barre { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .3rem clamp(1rem, 2vw, 2.5rem); }
.infos p { margin: 0; }
.infos__date, .infos__liens a { display: inline-flex; align-items: center; gap: .5rem; }
.infos__liens { list-style: none; margin: 0; padding: 0; display: flex; }
.infos__liens li + li { margin-left: .6rem; padding-left: .6rem; border-left: 1px solid currentColor; }
.infos__liens a { color: inherit; text-decoration: none; }
.infos__liens a:hover { text-decoration: underline; }
.infos .icone { width: 1.15em; height: 1.15em; }
/* Liens utiles dans le bandeau du bas : variante activée par le CSS du modèle */
.pied__legal { display: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
@media print {
  .entete, .pied, .carrousel__commandes, .haut-de-page, .evitement { display: none; }
}

/* --- EXT:news : détail d'une actualité / d'un événement ------------------ */
.news-single .header h2 { color: var(--c-primaire); }
.news-single .footer { font-size: .95rem; color: var(--c-texte-second); margin-bottom: 1rem; }
.news-single .teaser-text { font-size: 1.15rem; font-weight: 600; }
.news-single .news-backlink-wrap a { display: inline-block; margin-top: 1.5rem; font-weight: 700; }
.agenda__quand { font-weight: 600; }
.agenda__quand::first-letter { text-transform: uppercase; }
.liste__vide { text-align: center; color: var(--c-texte-second); }