/*
Theme Name: Grand-Auverné
Theme URI: https://grand-auverne.fr/
Description: Thème enfant FSE pour le site municipal du Grand-Auverné. Basé sur Twenty Twenty-Five. Direction civic-tech moderne 2026. Conçu et maintenu par Imascience.
Author: Imascience (Christophe Martin)
Author URI: https://imascience.com/
Template: twentytwentyfive
Version: 0.11.9
Requires at least: 6.7
Tested up to: 6.9
Requires PHP: 8.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: grandauverne
Tags: full-site-editing, block-patterns, accessibility-ready
*/

/* =============================================================================
   GRAND-AUVERNÉ — feuille de style
   Direction visuelle : civic-tech moderne (référence : paris.fr)
   Tokens couleurs/typo dans theme.json. Ce fichier gère :
   - composants (header sticky, sidebar accès rapides, cards, tuiles, badges),
   - layouts custom (grille 3 colonnes accueil, datavisualisation),
   - animations au scroll.
============================================================================= */

/* --- Reset typographique --------------------------------------------------- */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
body { font-variation-settings: "opsz" 14, "SOFT" 50; font-feature-settings: "kern" 1, "liga" 1, "calt" 1; }
h1, h2, h3, h4 { font-variation-settings: "opsz" 144, "SOFT" 50; font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "ss01" 1; }
::selection { background: var(--wp--preset--color--or-clair); color: var(--wp--preset--color--encre); }

/* Reset WordPress des marges entre blocs racine */
.wp-site-blocks > * { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.wp-site-blocks.has-global-padding { padding-left: 0 !important; padding-right: 0 !important; }

/* Focus accessible : même joli cadre au clavier ET au clic souris.
   Remplace l'outline natif disgracieux du navigateur par le liseré « gueules » bien cadré.
   :focus-visible reste déclaré pour les navigateurs/contextes qui le distinguent (RGAA). */
:focus-visible,
a:focus { outline: 2px solid var(--wp--preset--color--gueules); outline-offset: 3px; border-radius: 2px; }

/* Skip-link RGAA — caché visuellement sauf au focus clavier */
.ga-skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  padding: 0.75rem 1.25rem;
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 600;
  text-decoration: none;
  border-radius: 0 0 4px 4px;
  z-index: 1000;
  transition: top 0.15s;
}
.ga-skip-link:focus { top: 0; }

/* =============================================================================
   PARAMÈTRES D'AFFICHAGE RGAA
   On agit sur la racine <html> pour que toutes les unités `rem` cascadent.
   1rem = 16px par défaut. small = 14px (87.5 %), large = 19px (118.75 %).
============================================================================= */
html[data-ga-size="small"]  { font-size: 87.5%; }
html[data-ga-size="normal"] { font-size: 100%;  }
html[data-ga-size="large"]  { font-size: 118.75%; }

/* Contraste renforcé : fond clair, texte noir, accent bleu pour les liens.
   On préserve le hero (texte blanc sur image sombre) et les zones sombres
   intentionnelles (footer, bloc chiffres, badges) qui restent lisibles. */
html[data-ga-contrast="high"] {
  --ga-text:       #000;
  --ga-bg:         #fff;
  --ga-link:       #0040c0;
  --ga-link-hover: #002080;
}
html[data-ga-contrast="high"] body {
  background: #fff;
  color: #000;
}
html[data-ga-contrast="high"] :where(h1, h2, h3, h4, h5, h6) { color: #000; }
html[data-ga-contrast="high"] :where(a):not(.ga-cta):not(.ga-btn):not(.ga-tuile):not(.ga-actu):not(.ga-event):not(.ga-profil):not(.ga-fil-info__voir):not(.ga-section__voir-plus) {
  color: #0040c0;
  text-decoration: underline;
}
html[data-ga-contrast="high"] .ga-header { background: #fff; border-bottom: 2px solid #000; }
html[data-ga-contrast="high"] .ga-tuile { border-right: 1px solid #000; border-bottom: 1px solid #000; }
html[data-ga-contrast="high"] .ga-actu { border: 1px solid #000; }
html[data-ga-contrast="high"] .ga-event { border-bottom: 1px solid #000; }
html[data-ga-contrast="high"] .ga-fil-info { background: #fff; border: 1px solid #000; }
html[data-ga-contrast="high"] .ga-fil-item { border-bottom: 1px solid #000; }
html[data-ga-contrast="high"] .ga-profil { background: #fff; border: 1px solid #000; border-left: 3px solid #0040c0; }

/* HERO en contraste renforcé : on garde l'image en arrière-plan mais on RENFORCE
   le voile pour que le texte blanc reste lisible. Le titre reste blanc, pas noir. */
html[data-ga-contrast="high"] .ga-hero__voile {
  background:
    linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.85) 70%, rgba(0,0,0,0.95) 100%),
    linear-gradient(90deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 60%);
}
html[data-ga-contrast="high"] .ga-hero__titre,
html[data-ga-contrast="high"] .ga-hero__surtitre,
html[data-ga-contrast="high"] .ga-meteo,
html[data-ga-contrast="high"] .ga-meteo__temp,
html[data-ga-contrast="high"] .ga-meteo__desc,
html[data-ga-contrast="high"] .ga-meteo__titre {
  color: #fff !important;
}
html[data-ga-contrast="high"] .ga-hero__surtitre { color: #ffd24a !important; }

/* Bandeau alerte : déjà rouge sombre, on accentue contraste blanc/rouge */
html[data-ga-contrast="high"] .ga-alerte { background: #b30000; color: #fff; }
html[data-ga-contrast="high"] .ga-alerte a { color: #ffd24a; }

/* Footer reste sombre intentionnellement, on accentue les contrastes internes */
html[data-ga-contrast="high"] .ga-footer { background: #000; }
html[data-ga-contrast="high"] .ga-footer h3,
html[data-ga-contrast="high"] .ga-footer h5,
html[data-ga-contrast="high"] .ga-footer a { color: #fff; }
html[data-ga-contrast="high"] .ga-footer a { text-decoration: underline; }

/* Bloc chiffres : reste sombre */
html[data-ga-contrast="high"] .ga-chiffres { background: #000; }
html[data-ga-contrast="high"] .ga-chiffre__valeur { color: #fff; }
html[data-ga-contrast="high"] .ga-chiffre__label { color: #ddd; }

/* Conseil municipal */
html[data-ga-contrast="high"] .ga-conseil__prochaine { background: #fff; border-left: 3px solid #0040c0; }

/* =============================================================================
   HEADER STICKY — compact, dense, type paris.fr
============================================================================= */
/* Le template-part WordPress enveloppe le header dans <header class="wp-block-template-part">.
   Ce wrapper a la hauteur exacte du header, donc le sticky n'a aucune marge pour « coller »
   et défile avec son parent. display:contents le fait disparaître de la mise en page :
   .ga-header devient enfant direct de .wp-site-blocks et colle bien au viewport. */
.wp-site-blocks > header.wp-block-template-part { display: contents; }
/* Sous l'admin bar WordPress (visiteur connecté), le header sticky se cale dessous. */
.admin-bar .ga-header { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .ga-header { top: 46px; }
}

.ga-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--wp--preset--color--blanc-hermine);
  border-bottom: 1px solid var(--wp--preset--color--lignes);
  backdrop-filter: saturate(180%) blur(8px);
  -webkit-backdrop-filter: saturate(180%) blur(8px);
  transition: padding 0.25s ease, box-shadow 0.25s ease;
}
.ga-header__inner {
  max-width: 1480px;
  margin-inline: auto;
  padding: 1.1rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
  transition: padding 0.25s ease;
}
.ga-header.is-scrolled {
  box-shadow: 0 1px 12px rgba(26, 31, 34, 0.06);
}
.ga-header.is-scrolled .ga-header__inner { padding-block: 0.55rem; }
.ga-header.is-scrolled .ga-header__blason { width: 38px; }
.ga-header.is-scrolled .ga-header__nom { font-size: 1.15rem; }
.ga-header.is-scrolled .ga-header__surtitre { display: none; }

.ga-header__identite {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  text-decoration: none;
}
.ga-header__blason {
  display: block;
  width: 48px;
  height: 55px;
  object-fit: contain;
  transition: width 0.25s ease, height 0.25s ease;
  flex-shrink: 0;
}
.ga-header__texte {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.ga-header__nom {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.5rem;
  font-variation-settings: "opsz" 36, "SOFT" 30;
  color: var(--wp--preset--color--encre);
  line-height: 1;
  letter-spacing: -0.01em;
  margin: 0;
  transition: font-size 0.25s ease;
}
.ga-header__surtitre {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  color: var(--wp--preset--color--ardoise);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.15rem;
  font-weight: 500;
}

.ga-nav-principale {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.92rem;
  font-weight: 500;
}
.ga-nav-principale ul {
  display: flex;
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}
.ga-nav-principale a {
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  position: relative;
  padding-block: 0.3rem;
  transition: color 0.15s;
}
.ga-nav-principale a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--wp--preset--color--gueules);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.2s ease;
}
.ga-nav-principale a:hover { color: var(--wp--preset--color--gueules); }
.ga-nav-principale a:hover::after { transform: scaleX(1); }

.ga-nav-tools {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
.ga-tool-btn,
.ga-search-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.85rem;
  background: transparent;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.82rem;
  font-weight: 500;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.ga-tool-btn:hover,
.ga-search-btn:hover {
  background: var(--wp--preset--color--papier);
  border-color: var(--wp--preset--color--ardoise);
}
.ga-tool-btn svg, .ga-search-btn svg { width: 16px; height: 16px; }

/* Bouton Affichage : version renforcée — public-cible = personnes ayant des besoins
   visuels. Doit donc être immédiatement reconnaissable même sans ajustements. */
.ga-tool-btn--affichage {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border-color: var(--wp--preset--color--encre);
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.6rem 1rem;
}
.ga-tool-btn--affichage:hover {
  background: var(--wp--preset--color--gueules);
  border-color: var(--wp--preset--color--gueules);
  color: var(--wp--preset--color--blanc-hermine);
}
.ga-tool-btn--affichage svg {
  width: 24px;
  height: 24px;
}
.ga-tool-btn--affichage[aria-expanded="true"] {
  background: var(--wp--preset--color--gueules);
  border-color: var(--wp--preset--color--gueules);
}
.ga-nav-tools a.ga-cta {
  display: inline-flex;
  align-items: center;
  padding: 0.55rem 1.1rem;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.15s;
}
.ga-nav-tools a.ga-cta:hover { background: var(--wp--preset--color--gueules); }

/* =============================================================================
   MENU HAMBURGER (≤1200px) — reprend la nav principale + « En un clic »
============================================================================= */
.ga-burger {
  display: none; /* caché en grand écran, révélé sous 1200px */
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.85rem;
  background: transparent;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.82rem;
  font-weight: 600;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  cursor: pointer;
}
.ga-burger svg { width: 22px; height: 22px; }
.ga-burger:hover { background: var(--wp--preset--color--papier); border-color: var(--wp--preset--color--ardoise); }

.ga-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(26, 31, 34, 0.45);
  z-index: 200;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.ga-drawer-overlay:not([hidden]) { opacity: 1; }

.ga-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(360px, 88vw);
  background: var(--wp--preset--color--blanc-hermine);
  z-index: 201;
  padding: 1.25rem 1.5rem 2rem;
  overflow-y: auto;
  box-shadow: -4px 0 24px rgba(26, 31, 34, 0.12);
  transform: translateX(100%);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
}
.ga-drawer:not([hidden]) { transform: translateX(0); }
.ga-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}
.ga-drawer__titre {
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 700;
  font-size: 1.1rem;
}
.ga-drawer__fermer {
  display: inline-flex;
  padding: 0.4rem;
  background: transparent;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  cursor: pointer;
  color: var(--wp--preset--color--encre);
}
.ga-drawer__fermer svg { width: 22px; height: 22px; }
.ga-drawer__fermer:hover { background: var(--wp--preset--color--papier); }
.ga-drawer__section {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--ardoise);
  font-weight: 600;
  margin: 1.25rem 0 0.5rem;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
}
.ga-drawer__search {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.6rem 0.85rem;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  background: var(--wp--preset--color--papier);
}
.ga-drawer__search svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--wp--preset--color--ardoise); }
.ga-drawer__search input {
  border: 0;
  background: transparent;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.95rem;
  width: 100%;
  outline: none;
}
.ga-drawer ul { list-style: none; margin: 0; padding: 0; }
.ga-drawer__nav a,
.ga-drawer__liens a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0.25rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  border-radius: 4px;
}
.ga-drawer__nav a { font-size: 1.05rem; font-weight: 600; }
.ga-drawer__liens a { font-size: 0.95rem; }
.ga-drawer__nav a:hover,
.ga-drawer__liens a:hover { background: var(--wp--preset--color--papier); color: var(--wp--preset--color--gueules); }
.ga-drawer__liens a svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--wp--preset--color--lac); }
.ga-drawer__contact {
  margin-top: 1.5rem;
  justify-content: center;
  padding: 0.75rem 1.1rem;
}

@media (max-width: 1200px) {
  .ga-burger { display: inline-flex; }
  .ga-nav-principale { display: none; }       /* menu inline remplacé par le burger */
  .ga-nav-tools a.ga-cta { display: none; }    /* Contact repris dans le drawer */
}
/* Mobile/tablette (≤768px) : les boutons d'outils deviennent des icônes carrées.
   Le libellé texte est masqué visuellement mais l'aria-label assure l'accessibilité. */
@media (max-width: 768px) {
  /* Blason + texte à gauche, boutons (Accessibilité + ☰) à droite, sur UNE ligne.
     On empêche le wrap qui faisait tomber les outils sous le blason. */
  .ga-header__inner {
    flex-wrap: nowrap;
    gap: 0.75rem;
    padding-inline: 1rem; /* léger décalage à gauche : on récupère de la place */
  }
  .ga-header__identite { min-width: 0; } /* autorise le texte à rétrécir si besoin */
  .ga-nav-tools { flex-shrink: 0; }      /* les boutons gardent leur taille */

  /* La recherche passe dans le drawer : on masque le bouton de la barre. */
  .ga-search-btn { display: none; }

  /* Boutons restants en icône seule, carrés. Texte masqué mais lu par les lecteurs
     d'écran (l'aria-label suffit aussi). */
  .ga-burger span,
  .ga-tool-btn--affichage span:not(.ga-affichage-btn-icon) {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
  .ga-burger,
  .ga-tool-btn--affichage { padding: 0.55rem; gap: 0; }
  .ga-burger svg,
  .ga-tool-btn--affichage svg { width: 22px; height: 22px; }
}
/* Sécurité : si JS indisponible, ne jamais piéger l'utilisateur — le drawer reste hidden
   et le menu inline réapparaît (il scrollera mais restera accessible). */
html:not(.js-enabled) .ga-burger { display: none !important; }
html:not(.js-enabled) .ga-nav-principale { display: flex !important; flex-wrap: wrap; }

/* =============================================================================
   PANNEAU D'AFFICHAGE (RGAA)
   Volontairement plus lisible que le reste du site :
   - Fond contrasté (ardoise sombre sur fond clair)
   - Textes 1rem (ne dépendent pas du data-ga-size) — l'utilisateur doit pouvoir
     lire CE panneau même AVANT d'avoir réglé sa taille de texte
   - Boutons grands, espacés, avec focus visible renforcé
   - Largeur de cible tactile ≥ 44×44 px (WCAG 2.5.5)
============================================================================= */
.ga-affichage-panel {
  border-top: 2px solid var(--wp--preset--color--encre);
  background: var(--wp--preset--color--blanc-hermine);
  box-shadow: 0 6px 16px rgba(26, 31, 34, 0.08);
}
.ga-affichage-panel__inner {
  max-width: 1480px;
  margin-inline: auto;
  padding: 1.5rem 1.5rem 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.ga-affichage-panel__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.35rem;
  font-weight: 600;
  margin: 0;
  color: var(--wp--preset--color--encre);
  letter-spacing: -0.01em;
}
.ga-affichage-panel__groupes {
  display: flex;
  gap: 2.5rem;
  flex-wrap: wrap;
  align-items: flex-end;
}
.ga-affichage-group {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.ga-affichage-label {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1rem;
  font-weight: 600;
  color: var(--wp--preset--color--encre);
  letter-spacing: 0.01em;
}
.ga-affichage-controls {
  display: inline-flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.ga-affichage-controls button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--wp--preset--color--papier);
  color: var(--wp--preset--color--encre);
  border: 2px solid var(--wp--preset--color--ardoise);
  padding: 0.7rem 1.1rem;
  min-height: 48px;
  min-width: 88px;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.98rem;
  font-weight: 600;
  cursor: pointer;
  border-radius: 4px;
  transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.1s;
}
.ga-affichage-controls button:hover {
  background: var(--wp--preset--color--pierre);
  border-color: var(--wp--preset--color--gueules);
}
.ga-affichage-controls button:focus-visible {
  outline: 3px solid var(--wp--preset--color--gueules);
  outline-offset: 3px;
}
.ga-affichage-controls button:active { transform: scale(0.98); }
.ga-affichage-controls button.is-active {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border-color: var(--wp--preset--color--encre);
}
.ga-affichage-controls button.is-active:hover {
  background: var(--wp--preset--color--gueules);
  border-color: var(--wp--preset--color--gueules);
}
.ga-affichage-btn-icon {
  display: inline-block;
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 700;
  line-height: 1;
  min-width: 1em;
  text-align: center;
}

.ga-affichage-fermer {
  align-self: flex-end;
  background: transparent;
  color: var(--wp--preset--color--ardoise);
  border: 1px solid var(--wp--preset--color--lignes);
  padding: 0.5rem 1rem;
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.ga-affichage-fermer:hover {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border-color: var(--wp--preset--color--encre);
}

/* =============================================================================
   HERO COMPACT — 40vh, accent dynamique
============================================================================= */
.ga-hero {
  position: relative;
  width: 100%;
  min-height: clamp(380px, 48vh, 540px);
  display: grid;
  grid-template-columns: 1fr;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
}
.ga-hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: url('/wp-content/uploads/2026/06/vue-aerienne-optimisee.webp');
  background-size: cover;
  background-position: center 40%;
  filter: saturate(0.95) contrast(1.05);
}
.ga-hero__voile {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(26,31,34,0.15) 0%, rgba(26,31,34,0.55) 70%, rgba(26,31,34,0.85) 100%),
    linear-gradient(90deg, rgba(26,31,34,0.5) 0%, transparent 50%);
}
.ga-hero__inner {
  max-width: 1480px;
  margin-inline: auto;
  width: 100%;
  box-sizing: border-box; /* sinon 100 % + padding = 48 px de débordement, le widget météo sortait de l'écran */
  padding: 3rem 1.5rem 2.5rem;
  color: var(--wp--preset--color--blanc-hermine);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2rem;
  align-items: end;
}
.ga-hero__contenu { max-width: 720px; }
.ga-hero__surtitre {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin: 0 0 0.85rem;
  font-weight: 500;
  color: var(--wp--preset--color--or-clair);
}
.ga-hero__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-variation-settings: "opsz" 144, "SOFT" 30;
  font-size: clamp(2.5rem, 2rem + 2.5vw, 4rem);
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--wp--preset--color--blanc-hermine);
  margin: 0 0 1.5rem;
}
.ga-hero__cta {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ga-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.85rem 1.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  transition: transform 0.15s ease, background 0.15s, color 0.15s, box-shadow 0.15s;
}
.ga-btn:hover { transform: translateY(-1px); }
.ga-btn--primaire {
  background: var(--wp--preset--color--gueules);
  color: var(--wp--preset--color--blanc-hermine);
}
.ga-btn--primaire:hover {
  background: var(--wp--preset--color--gueules-sombre);
  box-shadow: 0 4px 12px rgba(168, 32, 26, 0.25);
}
.ga-btn--ghost {
  background: rgba(255,255,255,0.12);
  color: var(--wp--preset--color--blanc-hermine);
  border: 1px solid rgba(255,255,255,0.4);
  backdrop-filter: blur(4px);
}
.ga-btn--ghost:hover {
  background: rgba(255,255,255,0.22);
}
.ga-btn--sombre {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
}
.ga-btn--sombre:hover { background: var(--wp--preset--color--gueules); }
.ga-btn svg { width: 18px; height: 18px; }

/* Météo dans le hero, à droite */
.ga-meteo {
  background: rgba(26, 31, 34, 0.45);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 6px;
  padding: 1rem 1.25rem;
  color: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  min-width: 200px;
}
/* Tout le texte du widget en blanc pur, sans opacité : lisibilité sur photo
   (retour Christophe 2026-09-22). La hiérarchie passe par la taille, pas par la transparence. */
.ga-meteo__titre {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 0.5rem;
  font-weight: 600;
}
.ga-meteo__temp {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: 2.2rem;
  line-height: 1;
  margin: 0;
}
.ga-meteo__desc {
  font-size: 0.9rem;
  margin: 0.25rem 0 0;
  color: #fff;
}
/* Attribution Open-Meteo (licence CC BY) : petite mais blanche */
.ga-meteo__source {
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  margin: 0.5rem 0 0;
  color: #fff;
}
/* Mobile : le hero passe sur une colonne, le widget se cale à gauche sous les CTA
   (avant : 2 colonnes conservées, le widget sortait de l'écran à 390 px) */
@media (max-width: 700px) {
  .ga-hero__inner { grid-template-columns: 1fr; gap: 1.25rem; }
  .ga-meteo { justify-self: start; min-width: 0; }
}

/* =============================================================================
   BANDEAU ALERTE
============================================================================= */
.ga-alerte {
  background: var(--wp--preset--color--gueules-sombre);
  color: var(--wp--preset--color--blanc-hermine);
  padding: 0.85rem 1.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.92rem;
  font-weight: 500;
  text-align: center;
}
.ga-alerte__inner {
  max-width: 1480px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ga-alerte__icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
  background: var(--wp--preset--color--blanc-hermine);
  color: var(--wp--preset--color--gueules-sombre);
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
  flex-shrink: 0;
}
.ga-alerte a {
  color: var(--wp--preset--color--or-clair);
  text-decoration: underline;
  font-weight: 600;
}

/* =============================================================================
   TUILES D'ACCÈS RAPIDE — barre horizontale juste sous le hero
============================================================================= */
.ga-tuiles {
  background: var(--wp--preset--color--blanc-hermine);
  border-bottom: 1px solid var(--wp--preset--color--lignes);
}
.ga-tuiles__inner {
  max-width: 1480px;
  margin-inline: auto;
  padding: 0 1.5rem;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
}
@media (max-width: 1024px) {
  .ga-tuiles__inner { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .ga-tuiles__inner { grid-template-columns: repeat(2, 1fr); }
}
.ga-tuile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1.5rem 1rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  gap: 0.65rem;
  border-right: 1px solid var(--wp--preset--color--lignes);
  transition: background 0.2s ease, transform 0.2s ease;
  position: relative;
}
.ga-tuile:last-child { border-right: 0; }
@media (max-width: 1024px) {
  .ga-tuile:nth-child(3n) { border-right: 0; }
  .ga-tuile { border-bottom: 1px solid var(--wp--preset--color--lignes); }
  .ga-tuile:nth-last-child(-n+3):nth-child(n+4) { border-bottom: 0; }
}
.ga-tuile:hover {
  background: var(--wp--preset--color--papier);
}
.ga-tuile__icon {
  width: 36px;
  height: 36px;
  color: var(--wp--preset--color--gueules);
  transition: transform 0.2s ease;
  display: block;
}
.ga-tuile:hover .ga-tuile__icon { transform: translateY(-2px); }
.ga-tuile__label {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.25;
  margin: 0;
  color: inherit;
}

/* =============================================================================
   LAYOUT 3 COLONNES (sidebar + main + brèves)
============================================================================= */
.ga-page {
  max-width: 1480px;
  margin-inline: auto;
  padding: 2.5rem 1.5rem;
  display: grid;
  grid-template-columns: 220px 1fr 320px;
  gap: 2.5rem;
}
/* Variante pages internes : sidebar + contenu, sans rail droit. */
.ga-page--avec-sidebar { grid-template-columns: 220px 1fr; }
@media (max-width: 1200px) {
  /* La sidebar « En un clic » quitte la colonne (place insuffisante) : son contenu
     est désormais accessible via le menu hamburger (voir .ga-burger / .ga-drawer).
     On la masque ici, mais TOUS ses liens sont repris dans le panneau du burger. */
  .ga-page { grid-template-columns: 1fr 320px; }
  .ga-page--avec-sidebar { grid-template-columns: 1fr; }
  .ga-sidebar { display: none; }
}
@media (max-width: 860px) {
  .ga-page { grid-template-columns: 1fr; }
}

/* --- Sidebar gauche : accès rapides --------------------------------------- */
.ga-sidebar {
  position: sticky;
  top: 92px;
  align-self: start;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
}
.ga-sidebar__titre {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--ardoise);
  margin: 0 0 0.85rem;
  font-weight: 600;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
  padding-bottom: 0.65rem;
}
.ga-sidebar ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
}
.ga-sidebar a {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem 0.5rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
  font-weight: 500;
  border-radius: 4px;
  transition: background 0.15s, color 0.15s, padding-left 0.2s;
}
.ga-sidebar a:hover {
  background: var(--wp--preset--color--papier);
  color: var(--wp--preset--color--gueules);
  padding-left: 0.8rem;
}
.ga-sidebar a svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--wp--preset--color--lac); }

/* --- Main central -------------------------------------------------------- */
.ga-main {
  min-width: 0;
}

/* --- Rail droite : fil info + chiffres ----------------------------------- */
.ga-rail-droite {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  align-self: start;
  position: sticky;
  top: 92px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
  /* Cache scrollbar sur webkit pour propreté */
  scrollbar-width: thin;
  scrollbar-color: var(--wp--preset--color--lignes) transparent;
}
.ga-section {
  margin-bottom: 3rem;
}
.ga-section__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  gap: 1rem;
  flex-wrap: wrap;
  padding-bottom: 0.85rem;
  border-bottom: 2px solid var(--wp--preset--color--encre);
}
.ga-section__head h2 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: clamp(1.6rem, 1.3rem + 0.8vw, 2.1rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  margin: 0;
  color: var(--wp--preset--color--encre);
}
.ga-section__voir-plus {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--wp--preset--color--gueules);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.ga-section__voir-plus:hover { color: var(--wp--preset--color--gueules-sombre); text-decoration: underline; }

/* --- Grille actualités asymétrique (1 vedette + 2 sous-cartes + 1 large) -- */
.ga-actus-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: auto;
  gap: 1.25rem;
}
.ga-actu {
  background: var(--wp--preset--color--blanc-hermine);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--wp--preset--color--lignes);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.2s;
}
.ga-actu:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26, 31, 34, 0.08);
  border-color: var(--wp--preset--color--ardoise);
}
.ga-actu__image {
  aspect-ratio: 16 / 9;
  background: var(--wp--preset--color--pierre) center / cover no-repeat;
  position: relative;
}
.ga-actu__badge {
  position: absolute;
  top: 0.85rem;
  left: 0.85rem;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 0.3rem 0.65rem;
  border-radius: 3px;
}
.ga-actu__badge--gueules { background: var(--wp--preset--color--gueules); }
.ga-actu__badge--lac    { background: var(--wp--preset--color--lac); }
.ga-actu__badge--bocage { background: var(--wp--preset--color--bocage); }
.ga-actu__corps {
  padding: 1.1rem 1.25rem 1.35rem;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.ga-actu__date {
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.72rem;
  color: var(--wp--preset--color--ardoise);
  letter-spacing: 0.06em;
  font-feature-settings: "tnum" 1;
}
.ga-actu__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.15rem;
  line-height: 1.2;
  margin: 0;
  font-variation-settings: "opsz" 36, "SOFT" 30;
  color: var(--wp--preset--color--encre);
  letter-spacing: -0.005em;
}
.ga-actu__desc {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  color: var(--wp--preset--color--ardoise);
  line-height: 1.5;
  margin: 0;
}

/* Variante vedette : occupe les 2 colonnes */
.ga-actu--vedette {
  grid-column: 1 / -1;
  flex-direction: row;
}
.ga-actu--vedette .ga-actu__image {
  flex: 1 1 50%;
  aspect-ratio: auto;
  min-height: 280px;
}
.ga-actu--vedette .ga-actu__corps {
  flex: 1 1 50%;
  padding: 1.75rem 2rem;
  justify-content: center;
  gap: 0.65rem;
}
.ga-actu--vedette .ga-actu__titre {
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  line-height: 1.1;
  font-variation-settings: "opsz" 72, "SOFT" 30;
}
.ga-actu--vedette .ga-actu__desc { font-size: 0.95rem; }
@media (max-width: 700px) {
  .ga-actu--vedette { flex-direction: column; }
  .ga-actu--vedette .ga-actu__image { aspect-ratio: 16 / 9; min-height: 0; }
  .ga-actus-grid { grid-template-columns: 1fr; }
}

/* Archive actualités : grille régulière de cartes (pas de vedette) */
.ga-actus-grid--liste { grid-template-rows: none; margin-top: 0.5rem; }

/* Pagination des listes (actualités) — pilules sobres */
.ga-pagination { margin-top: 2.5rem; }
.ga-pagination .page-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  padding: 0;
  margin: 0;
  align-items: center;
}
.ga-pagination a.page-numbers,
.ga-pagination span.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  height: 2.4rem;
  padding: 0 0.7rem;
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.85rem;
  text-decoration: none;
  color: var(--wp--preset--color--ardoise);
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
}
.ga-pagination a.page-numbers:hover {
  border-color: var(--wp--preset--color--gueules);
  color: var(--wp--preset--color--gueules);
}
.ga-pagination span.page-numbers.current {
  background: var(--wp--preset--color--gueules);
  border-color: var(--wp--preset--color--gueules);
  color: #fff;
}
html[data-ga-contrast="high"] .ga-pagination span.page-numbers.current { background: #000; border-color: #000; }

/* Single actualité : entête (date + catégories) + image + corps */
.ga-article-single { max-width: 760px; }
.ga-article-single__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}
.ga-article-single__date {
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wp--preset--color--ardoise);
}
.ga-article-single__cats {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: var(--wp--preset--color--gueules);
}
.ga-article-single__cats a { color: inherit; text-decoration: none; }
.ga-article-single__cats a:hover { text-decoration: underline; }
.ga-article-single__image { margin: 0 0 1.75rem; }
.ga-article-single__image img { width: 100%; height: auto; border-radius: 6px; display: block; }

/* --- Colonne droite : Fil info horodaté (modèle paris.fr) ---------------- */
.ga-fil-info {
  background: var(--wp--preset--color--papier);
  padding: 1.5rem 1.35rem;
  border-radius: 6px;
}
.ga-fil-info__titre {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--wp--preset--color--gueules);
  margin: 0 0 0.85rem;
  padding-bottom: 0.7rem;
  border-bottom: 2px solid var(--wp--preset--color--gueules);
}
.ga-fil-info__titre::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--wp--preset--color--gueules);
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(168, 32, 26, 0.5);
  animation: ga-pulse 2.2s ease-out infinite;
}
@keyframes ga-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(168, 32, 26, 0.5); }
  70%  { box-shadow: 0 0 0 8px rgba(168, 32, 26, 0); }
  100% { box-shadow: 0 0 0 0 rgba(168, 32, 26, 0); }
}
.ga-fil-info__liste {
  display: flex;
  flex-direction: column;
}
.ga-fil-item {
  padding: 0.7rem 0;
  border-bottom: 1px dashed var(--wp--preset--color--lignes);
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}
.ga-fil-item:last-child { border-bottom: 0; }
.ga-fil-item__horodate {
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.7rem;
  color: var(--wp--preset--color--ardoise);
  background: var(--wp--preset--color--blanc-hermine);
  padding: 0.18rem 0.4rem;
  border-radius: 3px;
  white-space: nowrap;
  font-feature-settings: "tnum" 1;
  font-weight: 500;
  flex-shrink: 0;
  margin-top: 0.1rem;
  border: 1px solid var(--wp--preset--color--lignes);
}
.ga-fil-item__contenu {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.86rem;
  line-height: 1.4;
  color: var(--wp--preset--color--encre);
  margin: 0;
}
.ga-fil-item__contenu a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
  transition: border-color 0.15s, color 0.15s;
}
.ga-fil-item__contenu a:hover {
  color: var(--wp--preset--color--gueules);
  border-bottom-color: var(--wp--preset--color--gueules);
}
.ga-fil-info__voir {
  display: block;
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--wp--preset--color--lignes);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--wp--preset--color--gueules);
  text-decoration: none;
}
.ga-fil-info__voir:hover { text-decoration: underline; }

/* Chiffres clés dans la colonne droite */
.ga-chiffres {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border-radius: 6px;
  padding: 1.5rem;
  margin-top: 1.5rem;
}
.ga-chiffres__titre {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--wp--preset--color--or-clair);
  margin: 0 0 1rem;
}
.ga-chiffre {
  margin-bottom: 1rem;
}
.ga-chiffre:last-child { margin-bottom: 0; }
.ga-chiffre__valeur {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 2rem;
  line-height: 1;
  color: var(--wp--preset--color--blanc-hermine);
  font-variation-settings: "opsz" 72, "SOFT" 30;
  display: block;
  letter-spacing: -0.01em;
}
.ga-chiffre__label {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  color: var(--wp--preset--color--lignes);
  margin-top: 0.2rem;
  display: block;
}

/* =============================================================================
   AGENDA (compact, dans le main)
============================================================================= */
.ga-agenda-liste {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.ga-event {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 1rem;
  padding: 0.9rem 0;
  text-decoration: none;
  color: inherit;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
  transition: background 0.15s, padding-left 0.2s;
  align-items: center;
}
.ga-event:last-child { border-bottom: 0; }
.ga-event:hover {
  background: var(--wp--preset--color--papier);
  padding-left: 0.5rem;
}
.ga-event__date {
  text-align: center;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  padding: 0.45rem 0.3rem;
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--plex);
  transition: border-color 0.15s, background 0.15s;
}
.ga-event:hover .ga-event__date {
  border-color: var(--wp--preset--color--gueules);
  background: var(--wp--preset--color--blanc-hermine);
}
.ga-event__jour {
  display: block;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.55rem;
  font-weight: 600;
  line-height: 1;
  font-variation-settings: "opsz" 72;
  color: var(--wp--preset--color--encre);
}
.ga-event__mois {
  display: block;
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--wp--preset--color--ardoise);
  margin-top: 0.1rem;
}
.ga-event__corps h3 {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1rem;
  font-weight: 600;
  margin: 0;
  line-height: 1.3;
  color: var(--wp--preset--color--encre);
}
.ga-event__meta {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.82rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0.2rem 0 0;
}
.ga-event__chevron {
  color: var(--wp--preset--color--lac);
  font-size: 1.2rem;
}

/* =============================================================================
   SECTION TERRITOIRE — carte SVG + chiffres
============================================================================= */
.ga-territoire {
  background: var(--wp--preset--color--pierre);
  padding: 4rem 1.5rem;
  margin-top: 3rem;
}
.ga-territoire__inner {
  max-width: 1480px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}
@media (max-width: 860px) {
  .ga-territoire__inner { grid-template-columns: 1fr; }
}
.ga-territoire__intro h2 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: clamp(2rem, 1.6rem + 1.5vw, 2.75rem);
  line-height: 1.05;
  letter-spacing: -0.025em;
  color: var(--wp--preset--color--encre);
  margin: 0 0 1rem;
  font-variation-settings: "opsz" 144;
}
.ga-territoire__intro p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--wp--preset--color--ardoise);
  margin: 0 0 1.5rem;
  max-width: 480px;
}
.ga-territoire__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: 2rem;
}
.ga-stat {
  padding: 1.2rem 1rem;
  background: var(--wp--preset--color--blanc-hermine);
  border-left: 3px solid var(--wp--preset--color--gueules);
  border-radius: 0 4px 4px 0;
}
.ga-stat__valeur {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 2.4rem;
  line-height: 1;
  color: var(--wp--preset--color--encre);
  font-variation-settings: "opsz" 144;
  display: block;
  letter-spacing: -0.02em;
}
.ga-stat__label {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  color: var(--wp--preset--color--ardoise);
  margin-top: 0.3rem;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 500;
}
.ga-territoire__carte {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ga-carte-svg {
  width: 100%;
  max-width: 480px;
  height: auto;
}

/* =============================================================================
   BLOC CONSEIL MUNICIPAL — gros plan photo équipe + meta
============================================================================= */
.ga-conseil {
  background: var(--wp--preset--color--blanc-hermine);
  padding: 4rem 1.5rem;
}
.ga-conseil__inner {
  max-width: 1480px;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 3rem;
  align-items: center;
}
@media (max-width: 860px) {
  .ga-conseil__inner { grid-template-columns: 1fr; }
}
.ga-conseil__photo {
  border-radius: 6px;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--wp--preset--color--pierre);
}
.ga-conseil__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ga-conseil__contenu h2 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: clamp(1.75rem, 1.5rem + 0.8vw, 2.4rem);
  line-height: 1.1;
  color: var(--wp--preset--color--encre);
  margin: 0 0 1rem;
  letter-spacing: -0.02em;
  font-variation-settings: "opsz" 144;
}
.ga-conseil__prochaine {
  background: var(--wp--preset--color--papier);
  border-left: 3px solid var(--wp--preset--color--lac);
  padding: 1rem 1.25rem;
  margin: 1.5rem 0;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.92rem;
}
.ga-conseil__prochaine strong { color: var(--wp--preset--color--lac); display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 0.25rem; }

/* =============================================================================
   PROFILS — "Vous êtes…" (inspiration paris.fr)
============================================================================= */
.ga-profils {
  background: var(--wp--preset--color--blanc-hermine);
  padding: 4rem 1.5rem;
  border-top: 1px solid var(--wp--preset--color--lignes);
}
.ga-profils__inner {
  max-width: 1480px;
  margin-inline: auto;
}
.ga-profils__intro {
  margin-bottom: 2rem;
}
.ga-profils__intro h2 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: clamp(1.6rem, 1.3rem + 0.8vw, 2.1rem);
  margin: 0 0 0.5rem;
  letter-spacing: -0.015em;
  color: var(--wp--preset--color--encre);
}
.ga-profils__intro p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.95rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
}
.ga-profils__grille {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}
.ga-profil {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1.5rem 1.35rem;
  background: var(--wp--preset--color--papier);
  border-radius: 6px;
  border-left: 3px solid var(--wp--preset--color--lac);
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s;
}
.ga-profil:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(26, 31, 34, 0.06);
  border-left-color: var(--wp--preset--color--gueules);
}
.ga-profil__intro {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
  font-weight: 500;
}
.ga-profil__cible {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.2rem;
  margin: 0;
  line-height: 1.2;
  font-variation-settings: "opsz" 36, "SOFT" 30;
  letter-spacing: -0.005em;
}
.ga-profil__fleche {
  margin-top: auto;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--wp--preset--color--gueules);
}

/* =============================================================================
   FOOTER — multi-colonnes
============================================================================= */
.ga-footer {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--pierre);
  padding: 4rem 1.5rem 1.5rem;
  margin-top: 3rem;
}
.ga-footer__inner {
  max-width: 1480px;
  margin-inline: auto;
}
.ga-footer__top {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 2.5rem;
  margin-bottom: 3rem;
}
@media (max-width: 800px) {
  .ga-footer__top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
.ga-footer__brand { display: flex; gap: 1rem; align-items: flex-start; }
.ga-footer__brand img { width: 60px; flex-shrink: 0; }
.ga-footer__brand h3 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.4rem;
  color: var(--wp--preset--color--blanc-hermine);
  margin: 0 0 0.25rem;
  letter-spacing: -0.01em;
}
.ga-footer__brand p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  color: var(--wp--preset--color--or-clair);
  margin: 0;
  font-style: italic;
}
.ga-footer h5 {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--or);
  margin: 0 0 1rem;
}
.ga-footer ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
}
.ga-footer a {
  color: var(--wp--preset--color--pierre);
  text-decoration: none;
  transition: color 0.15s;
}
.ga-footer a:hover { color: var(--wp--preset--color--or-clair); }
.ga-footer__newsletter {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(200, 160, 74, 0.3);
  border-radius: 6px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 2rem;
  align-items: center;
}
@media (max-width: 700px) { .ga-footer__newsletter { grid-template-columns: 1fr; gap: 1rem; } }
.ga-footer__newsletter h4 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--wp--preset--color--blanc-hermine);
  margin: 0 0 0.3rem;
  letter-spacing: -0.01em;
}
.ga-footer__newsletter p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  color: var(--wp--preset--color--pierre);
  margin: 0;
  font-style: normal;
}
.ga-footer__newsletter form {
  display: flex;
  gap: 0.5rem;
}
.ga-footer__newsletter input[type="email"] {
  flex: 1;
  padding: 0.7rem 0.9rem;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(255,255,255,0.05);
  color: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
}
.ga-footer__newsletter input[type="email"]::placeholder { color: var(--wp--preset--color--lignes); }
.ga-footer__newsletter button {
  padding: 0.7rem 1.25rem;
  background: var(--wp--preset--color--gueules);
  color: var(--wp--preset--color--blanc-hermine);
  border: 0;
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.15s;
}
.ga-footer__newsletter button:hover { background: var(--wp--preset--color--gueules-sombre); }

/* Formulaire MailPoet dans le pied de page : on lui donne exactement l'aspect
   du formulaire de la maquette (champ + bouton rouge sur une ligne). */
.ga-footer__newsletter .wp-block-shortcode { margin: 0; }
.ga-footer__newsletter .mailpoet_form { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: flex-start; }
/* MailPoet glisse des champs cachés (anti-spam, id de formulaire) suivis chacun d'un <br> : 110 px de vide sinon */
.ga-footer__newsletter .mailpoet_form > br { display: none; }
.ga-footer__newsletter .mailpoet_paragraph { margin: 0 !important; }
.ga-footer__newsletter .mailpoet_form_column,
.ga-footer__newsletter .mailpoet_form_columns { display: contents; }
.ga-footer__newsletter .mailpoet_paragraph:has(.mailpoet_text) { flex: 1 1 240px; }
.ga-footer__newsletter .mailpoet_text {
  width: 100%;
  padding: 0.7rem 0.9rem !important;
  border-radius: 4px !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  background: rgba(255,255,255,0.05) !important;
  color: var(--wp--preset--color--blanc-hermine) !important;
  font-family: var(--wp--preset--font-family--plex) !important;
  font-size: 0.9rem !important;
}
.ga-footer__newsletter .mailpoet_text::placeholder { color: var(--wp--preset--color--lignes); }
.ga-footer__newsletter .mailpoet_submit {
  padding: 0.7rem 1.25rem !important;
  background: var(--wp--preset--color--gueules) !important;
  color: var(--wp--preset--color--blanc-hermine) !important;
  border: 0 !important;
  border-radius: 4px !important;
  font-family: var(--wp--preset--font-family--plex) !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  cursor: pointer;
  width: auto !important;
}
.ga-footer__newsletter .mailpoet_submit:hover { background: var(--wp--preset--color--gueules-sombre) !important; }
/* Messages de validation / succès (sous le formulaire, pleine largeur) */
.ga-footer__newsletter .mailpoet_message,
.ga-footer__newsletter .mailpoet_validate_success,
.ga-footer__newsletter .mailpoet_validate_error {
  flex-basis: 100%;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  color: var(--wp--preset--color--or-clair);
  margin: 0.25rem 0 0;
}
.ga-footer__newsletter .mailpoet_validate_error { color: #ffb3ad; }
/* Captcha intégré MailPoet : image + champ sur la ligne suivante */
.ga-footer__newsletter .mailpoet_captcha_form { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; flex-basis: 100%; }
.ga-footer__newsletter .mailpoet_captcha_form img { border-radius: 4px; }

.ga-footer__bottom {
  border-top: 1px solid rgba(200, 160, 74, 0.2);
  padding-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  color: var(--wp--preset--color--lignes);
}

.ga-rgaa {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.78rem;
  color: var(--wp--preset--color--or-clair);
}
.ga-rgaa-mention {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.18rem 0.55rem;
  background: rgba(200, 160, 74, 0.15);
  border-radius: 3px;
  font-weight: 500;
}

/* =============================================================================
   ANIMATIONS — staggered reveal au scroll
============================================================================= */
/* Animations subtiles au survol uniquement — pas de fade-in au scroll
   (paris.fr-style : pas de gadget visuel, tout est visible immédiatement).
   La classe .ga-reveal reste utilisable comme hook DOM (anchor scroll, focus, etc.)
   mais ne masque jamais le contenu. */
.ga-reveal { /* placeholder — pas de masquage */ }

/* Compteur animé (utilisé sur .ga-stat__valeur, .ga-chiffre__valeur) */
@keyframes ga-count-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* =============================================================================
   VIDÉO RESPONSIVE (filtre embed_oembed_html)
============================================================================= */
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 6px;
}
.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* =============================================================================
   PAGES INTERNES — hero compact, fil d'Ariane
   Ajoutés 2026-06-02 pour la page « Faire une démarche ». Réutilisables sur
   toutes les pages internes. Voir documentation/charte-graphique.md §7.
============================================================================= */

/* --- Hero interne : plus court que le hero d'accueil, fond encre dégradé ---- */
.ga-hero--interne {
  min-height: clamp(220px, 30vh, 320px);
  align-items: center;
}
.ga-hero--interne .ga-hero__media {
  background-image: url('/wp-content/uploads/2026/06/vue-aerienne-optimisee.webp');
  filter: saturate(0.9) contrast(1.03);
}
.ga-hero--interne .ga-hero__voile {
  background:
    linear-gradient(180deg, rgba(26,31,34,0.35) 0%, rgba(26,31,34,0.6) 100%),
    linear-gradient(90deg, rgba(26,31,34,0.55) 0%, rgba(26,31,34,0.15) 65%);
}
.ga-hero--interne .ga-hero__inner {
  grid-template-columns: 1fr;
  padding-block: 2.5rem;
}
.ga-hero--interne .ga-hero__titre {
  margin-bottom: 0.85rem;
  font-size: clamp(2.1rem, 1.7rem + 2vw, 3.25rem);
}
.ga-hero__chapo {
  font-family: var(--wp--preset--font-family--plex);
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem);
  line-height: 1.5;
  color: var(--wp--preset--color--pierre);
  max-width: 640px;
  margin: 0;
}
html[data-ga-contrast="high"] .ga-hero--interne .ga-hero__voile {
  background:
    linear-gradient(180deg, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.92) 100%);
}
html[data-ga-contrast="high"] .ga-hero__chapo { color: #fff !important; }

/* --- Fil d'Ariane (breadcrumb) -------------------------------------------- */
.ga-fil-ariane {
  background: var(--wp--preset--color--blanc-hermine);
  border-bottom: 1px solid var(--wp--preset--color--lignes);
}
.ga-fil-ariane__inner {
  max-width: 1480px;
  margin-inline: auto;
  padding: 0.85rem 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.82rem;
  color: var(--wp--preset--color--ardoise);
}
.ga-fil-ariane a {
  color: var(--wp--preset--color--ardoise);
  text-decoration: none;
  transition: color 0.15s;
}
.ga-fil-ariane a:hover { color: var(--wp--preset--color--gueules); text-decoration: underline; }
.ga-fil-ariane span[aria-hidden] { color: var(--wp--preset--color--lignes); }
.ga-fil-ariane [aria-current="page"] { color: var(--wp--preset--color--encre); font-weight: 600; }
html[data-ga-contrast="high"] .ga-fil-ariane { background: #fff; border-bottom: 1px solid #000; }
html[data-ga-contrast="high"] .ga-fil-ariane a { color: #0040c0; text-decoration: underline; }
html[data-ga-contrast="high"] .ga-fil-ariane [aria-current="page"] { color: #000; }

/* =============================================================================
   PAGE DÉMARCHES — grille « moments de vie » + encarts
============================================================================= */
.ga-demarches-intro {
  max-width: 740px;
  margin: 0 0 2.5rem;
}
.ga-demarches-intro p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
}

/* Barre de recherche de démarche (visuelle ; branchement back-end ultérieur) */
.ga-demarches-search {
  display: flex;
  gap: 0.5rem;
  max-width: 560px;
  margin-top: 1.5rem;
}
.ga-demarches-search input[type="search"] {
  flex: 1;
  padding: 0.8rem 1rem;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  background: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.95rem;
  color: var(--wp--preset--color--encre);
}
.ga-demarches-search input[type="search"]::placeholder { color: var(--wp--preset--color--ardoise); }
.ga-demarches-search input[type="search"]:focus-visible {
  outline: 2px solid var(--wp--preset--color--gueules);
  outline-offset: 2px;
  border-color: var(--wp--preset--color--gueules);
}
.ga-demarches-search button {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.8rem 1.25rem;
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border: 0;
  border-radius: 4px;
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  transition: background 0.15s;
}
.ga-demarches-search button:hover { background: var(--wp--preset--color--gueules); }
.ga-demarches-search button svg { width: 16px; height: 16px; }

/* --- Grille des catégories « moments de vie » ----------------------------- */
.ga-demarches {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
}
.ga-demarche-cat {
  display: flex;
  flex-direction: column;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 6px;
  padding: 1.5rem 1.5rem 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-left-color 0.2s;
}
.ga-demarche-cat:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26, 31, 34, 0.08);
  border-left-color: var(--wp--preset--color--gueules);
}
.ga-demarche-cat__head {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
}
.ga-demarche-cat__icon {
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  color: var(--wp--preset--color--gueules);
}
.ga-demarche-cat__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.15;
  margin: 0;
  color: var(--wp--preset--color--encre);
  font-variation-settings: "opsz" 36, "SOFT" 30;
  letter-spacing: -0.005em;
}
.ga-demarche-cat__liste {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.ga-demarche-cat__liste a {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.5rem;
  margin-inline: -0.5rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: 4px;
  transition: background 0.15s, color 0.15s, padding-left 0.2s;
}
.ga-demarche-cat__liste a::before {
  content: "›";
  color: var(--wp--preset--color--lac);
  font-weight: 700;
  transition: color 0.15s;
}
.ga-demarche-cat__liste a:hover {
  background: var(--wp--preset--color--papier);
  color: var(--wp--preset--color--gueules);
  padding-left: 0.8rem;
}
.ga-demarche-cat__liste a:hover::before { color: var(--wp--preset--color--gueules); }

html[data-ga-contrast="high"] .ga-demarche-cat {
  background: #fff;
  border: 1px solid #000;
  border-left: 3px solid #0040c0;
}
html[data-ga-contrast="high"] .ga-demarche-cat__liste a { color: #000; }
html[data-ga-contrast="high"] .ga-demarche-cat__liste a:hover { color: #0040c0; }

/* --- Encart « Démarches 100 % en ligne » (fond sombre) -------------------- */
.ga-encart-enligne {
  background: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
  border-radius: 6px;
  padding: 2rem 2rem 2.25rem;
  margin-top: 1rem;
}
.ga-encart-enligne__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.5rem;
  color: var(--wp--preset--color--blanc-hermine);
  margin: 0 0 0.5rem;
  letter-spacing: -0.01em;
  font-variation-settings: "opsz" 72, "SOFT" 30;
}
.ga-encart-enligne__intro {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--wp--preset--color--pierre);
  margin: 0 0 1.5rem;
  max-width: 620px;
}
.ga-encart-enligne__grille {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.75rem;
}
.ga-encart-enligne a {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.85rem 1rem;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(200, 160, 74, 0.3);
  border-radius: 4px;
  text-decoration: none;
  color: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  font-weight: 500;
  transition: background 0.15s, border-color 0.15s;
}
.ga-encart-enligne a:hover {
  background: rgba(255,255,255,0.12);
  border-color: var(--wp--preset--color--or);
}
.ga-encart-enligne a svg { width: 18px; height: 18px; color: var(--wp--preset--color--or-clair); flex-shrink: 0; }
.ga-encart-enligne__externe {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 1.25rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.82rem;
  color: var(--wp--preset--color--or-clair);
}
html[data-ga-contrast="high"] .ga-encart-enligne { background: #000; }
html[data-ga-contrast="high"] .ga-encart-enligne a { background: #111; border-color: #fff; color: #fff; }

/* --- Encart « Besoin d'aide ? » (clair) ----------------------------------- */
.ga-encart-aide {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 1.5rem;
  background: var(--wp--preset--color--papier);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 0 6px 6px 0;
  padding: 1.5rem 1.75rem;
  margin-top: 1.5rem;
}
@media (max-width: 700px) {
  .ga-encart-aide { grid-template-columns: 1fr; text-align: left; }
}
.ga-encart-aide__icon {
  width: 40px;
  height: 40px;
  color: var(--wp--preset--color--lac);
  flex-shrink: 0;
}
.ga-encart-aide__texte h3 {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.2rem;
  margin: 0 0 0.25rem;
  color: var(--wp--preset--color--encre);
}
.ga-encart-aide__texte p {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
  line-height: 1.5;
}
.ga-encart-aide__texte strong { color: var(--wp--preset--color--encre); }
html[data-ga-contrast="high"] .ga-encart-aide { background: #fff; border-left: 3px solid #0040c0; }

/* ═══════════════════════════════════════════════════════════════
   PROSE — contenu éditorial des pages internes (wp:post-content)
   Appliqué via la classe ga-prose sur le bloc Contenu de page.html.
   Les titres (Fraunces) et le corps (Plex) viennent de theme.json :
   ici, uniquement le rythme vertical, la largeur de lecture et les
   éléments de contenu courants saisis par la mairie dans l'éditeur.
   ═══════════════════════════════════════════════════════════════ */

.ga-prose {
  max-width: 72ch;
  font-family: var(--wp--preset--font-family--plex);
  color: var(--wp--preset--color--ardoise);
}
.ga-prose > * + * { margin-top: 1.1rem; }
.ga-prose h2 {
  margin-top: 2.5rem;
  padding-bottom: 0.4rem;
  border-bottom: 2px solid var(--wp--preset--color--encre);
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.7rem);
}
.ga-prose h3 { margin-top: 2rem; font-size: 1.25rem; }
.ga-prose h4 { margin-top: 1.5rem; font-size: 1.05rem; }
/* :not(.ga-btn):not(.wp-element-button) : un bouton posé dans le contenu (bouton maison ga-btn ou bloc Bouton natif)
   garde ses propres couleurs (sinon texte gueules sur fond gueules). */
.ga-prose a:not(.ga-btn):not(.wp-element-button) {
  color: var(--wp--preset--color--gueules);
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 500;
}
.ga-prose a:not(.ga-btn):not(.wp-element-button):hover { color: var(--wp--preset--color--gueules-sombre); }
.ga-prose ul,
.ga-prose ol { padding-left: 1.4rem; }
.ga-prose li { margin-top: 0.4rem; }
.ga-prose li::marker { color: var(--wp--preset--color--gueules); }
.ga-prose blockquote {
  border-left: 3px solid var(--wp--preset--color--or);
  background: var(--wp--preset--color--blanc-hermine);
  padding: 1rem 1.5rem;
  margin-left: 0;
  font-style: italic;
}
.ga-prose table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
}
.ga-prose th,
.ga-prose td {
  border: 1px solid var(--wp--preset--color--lignes);
  padding: 0.55rem 0.8rem;
  text-align: left;
}
.ga-prose th {
  background: var(--wp--preset--color--pierre);
  color: var(--wp--preset--color--encre);
  font-weight: 600;
}
.ga-prose figure { margin: 1.5rem 0; }
.ga-prose img { max-width: 100%; height: auto; border-radius: 6px; }
.ga-prose figcaption {
  font-size: 0.8rem;
  color: var(--wp--preset--color--ardoise);
  margin-top: 0.4rem;
}
.ga-prose hr {
  border: 0;
  border-top: 1px solid var(--wp--preset--color--lignes);
  margin: 2rem 0;
}
/* Encadré : bloc Groupe avec une couleur de fond (ex. « À noter », mise en garde).
   La mairie le crée dans l'éditeur (Groupe + Couleur d'arrière-plan), sans classe à saisir. */
.ga-prose .wp-block-group.has-background {
  padding: 1rem 1.25rem;
  border-left: 3px solid var(--wp--preset--color--or);
  border-radius: 0 4px 4px 0;
}
.ga-prose .wp-block-group.has-background > * + * { margin-top: 0.6rem; }
html[data-ga-contrast="high"] .ga-prose { color: #000; }
html[data-ga-contrast="high"] .ga-prose a:not(.ga-btn):not(.wp-element-button) { color: #0040c0; }

/* Plan du site (bloc grandauverne/plan-site, rendu dans ga-prose) :
   grille de rubriques, chaque rubrique = titre lié + liste de pages. */
.ga-prose .ga-plan-site {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem 2.5rem;
  max-width: none;
}
.ga-prose .ga-plan-site__rubrique h2 {
  margin-top: 0.5rem;
  font-size: 1.2rem;
}
.ga-prose .ga-plan-site__rubrique h2 a {
  color: var(--wp--preset--color--encre);
  text-decoration: none;
}
.ga-prose .ga-plan-site__rubrique h2 a:hover { color: var(--wp--preset--color--gueules); }
.ga-prose .ga-plan-site__rubrique ul { list-style: none; padding-left: 0; }
.ga-prose .ga-plan-site__rubrique li { margin-top: 0.35rem; }
.ga-prose .ga-plan-site__rubrique li a { font-weight: 400; }

/* ═══════════════════════════════════════════════════════════════
   DOCUMENTS — archives & fiches des CPT documentaires (avis, marchés)
   Bloc dynamique grandauverne/liste-documents + grandauverne/doc-meta.
   ═══════════════════════════════════════════════════════════════ */

/* Barre de filtres (catégorie + année) */
.ga-doc-filtres {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem 2rem;
  padding: 1rem 0 1.25rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
}
.ga-doc-filtres__groupe {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.4rem 0.65rem;
}
.ga-doc-filtres__label {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--wp--preset--color--ardoise);
}
.ga-doc-filtres a {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ardoise);
  text-decoration: none;
  padding: 0.15rem 0.6rem;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 999px;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.ga-doc-filtres a:hover { border-color: var(--wp--preset--color--lac); color: var(--wp--preset--color--encre); }
.ga-doc-filtres a.is-actif {
  background: var(--wp--preset--color--encre);
  border-color: var(--wp--preset--color--encre);
  color: var(--wp--preset--color--blanc-hermine);
}

/* Liste de cartes documentaires */
.ga-doc-liste { display: flex; flex-direction: column; gap: 1rem; }
.ga-doc-carte {
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 0 8px 8px 0;
  padding: 1.1rem 1.4rem;
  background: var(--wp--preset--color--blanc-hermine);
  transition: border-left-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
.ga-doc-carte:hover {
  border-left-color: var(--wp--preset--color--gueules);
  box-shadow: 0 6px 18px rgba(26, 31, 34, 0.07);
  transform: translateY(-1px);
}
.ga-doc-carte__meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.8rem;
  color: var(--wp--preset--color--ardoise);
  margin-bottom: 0.35rem;
}
.ga-doc-carte__cat {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.1rem 0.55rem;
  border-radius: 4px;
  background: var(--wp--preset--color--pierre);
  color: var(--wp--preset--color--encre);
}
.ga-doc-carte__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.2rem;
  font-weight: 500;
  margin: 0 0 0.4rem;
  line-height: 1.25;
}
.ga-doc-carte__titre a { color: var(--wp--preset--color--encre); text-decoration: none; }
.ga-doc-carte__titre a:hover { color: var(--wp--preset--color--gueules); }
.ga-doc-carte__desc {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.92rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0 0 0.7rem;
  line-height: 1.5;
}
.ga-doc-carte__actions { margin-top: 0.3rem; }
.ga-doc-carte__pdf,
.ga-doc-carte__lien {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--wp--preset--color--gueules);
  text-decoration: none;
}
.ga-doc-carte__pdf svg { width: 16px; height: 16px; }
.ga-doc-carte__pdf:hover,
.ga-doc-carte__lien:hover { color: var(--wp--preset--color--gueules-sombre); text-decoration: underline; }
.ga-doc-vide {
  font-family: var(--wp--preset--font-family--plex);
  color: var(--wp--preset--color--ardoise);
  padding: 1.5rem 0;
}

/* Fiche document (single) */
.ga-hero--mince { min-height: clamp(220px, 30vh, 300px); }
.ga-doc-single { max-width: 72ch; }
.ga-doc-single__entete {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 0 1.4rem;
  margin-bottom: 1.5rem;
  border-bottom: 2px solid var(--wp--preset--color--encre);
}
.ga-doc-single__meta {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ardoise);
}
.ga-doc-single__pdf { flex-shrink: 0; }
.ga-doc-single__retour {
  margin-top: 2.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
}
.ga-doc-single__retour a { color: var(--wp--preset--color--gueules); text-decoration: none; font-weight: 600; }
.ga-doc-single__retour a:hover { text-decoration: underline; }

/* Contraste renforcé */
html[data-ga-contrast="high"] .ga-doc-carte { background: #fff; border-left-color: #000; }
html[data-ga-contrast="high"] .ga-doc-carte__titre a,
html[data-ga-contrast="high"] .ga-doc-carte__pdf,
html[data-ga-contrast="high"] .ga-doc-carte__lien { color: #0040c0; }
html[data-ga-contrast="high"] .ga-doc-filtres a.is-actif { background: #000; border-color: #000; color: #fff; }

/* ═══════════════════════════════════════════════════════════════
   HUBS ADMINISTRABLES — cartes « moments de vie » en blocs natifs
   La mairie édite l'intro et les cartes dans l'éditeur de blocs WP
   (pattern ga-hub-cartes). Le CSS ci-dessous habille des blocs
   standards (core/group + core/heading + core/list) à l'identique
   des cartes .ga-demarche-cat figées, pour une fidélité charte sans
   markup en dur. Cible la structure produite par Gutenberg.
   ═══════════════════════════════════════════════════════════════ */

/* Wrapper du post-content des hubs (classe portée par wp:post-content).
   Conteneur neutre pleine largeur du main : il n'impose pas de largeur de
   lecture (les cartes occupent toute la colonne), mais cadence l'espacement
   vertical entre les blocs éditables (intro → titre de section → grille). */
.ga-hub-corps > * + * { margin-top: 1.5rem; }
.ga-hub-corps > h2,
.ga-hub-corps > .wp-block-heading {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: clamp(1.4rem, 1.2rem + 0.6vw, 1.8rem);
  color: var(--wp--preset--color--encre);
  margin-top: 2.5rem;
  margin-bottom: 0.25rem;
}

/* Intro éditable (paragraphe en tête de hub) */
.ga-hub-intro {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--wp--preset--color--ardoise);
  max-width: 70ch;
  margin: 0 0 2rem;
}
.ga-hub-intro strong { color: var(--wp--preset--color--encre); }

/* Grille de cartes : un bloc Colonnes OU un groupe à classe ga-hub-cartes */
.ga-hub-cartes {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
  margin: 0;
}
/* Neutralise les marges par défaut des blocs WP dans la grille.
   WP injecte après style.css « :root :where(.is-layout-flow) > * { margin-block-start: 1.2rem } »
   (spécificité 0-1-0, identique à « .ga-hub-cartes > * »). À égalité, l'ordre
   source fait gagner WP : chaque carte sauf la première était poussée de 1.2rem
   vers le bas. Le sélecteur composé (0-2-0) reprend la main. */
.ga-hub-corps .ga-hub-cartes > *,
.ga-hub-cartes.is-layout-flow > * { margin: 0; }

/* Une carte = un bloc Groupe à classe ga-hub-carte */
.ga-hub-carte {
  display: flex;
  flex-direction: column;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 6px;
  padding: 1.5rem 1.5rem 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-left-color 0.2s;
}
.ga-hub-carte:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26, 31, 34, 0.08);
  border-left-color: var(--wp--preset--color--gueules);
}
/* Titre de carte = un H3 dans le groupe */
.ga-hub-carte h3,
.ga-hub-carte .wp-block-heading {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.15;
  margin: 0 0 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--wp--preset--color--lignes);
  color: var(--wp--preset--color--encre);
  font-variation-settings: "opsz" 36, "SOFT" 30;
  letter-spacing: -0.005em;
}
/* Liste de liens = un bloc Liste dans le groupe */
.ga-hub-carte ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.ga-hub-carte li { margin: 0; }
.ga-hub-carte li a {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.5rem;
  margin-inline: -0.5rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: 4px;
  transition: background 0.15s, color 0.15s, padding-left 0.2s;
}
.ga-hub-carte li a::before {
  content: "›";
  color: var(--wp--preset--color--lac);
  font-weight: 700;
  transition: color 0.15s;
}
.ga-hub-carte li a:hover {
  background: var(--wp--preset--color--papier);
  color: var(--wp--preset--color--gueules);
  padding-left: 0.8rem;
}
.ga-hub-carte li a:hover::before { color: var(--wp--preset--color--gueules); }

html[data-ga-contrast="high"] .ga-hub-carte {
  background: #fff;
  border: 1px solid #000;
  border-left: 3px solid #0040c0;
}
html[data-ga-contrast="high"] .ga-hub-carte li a { color: #000; }
html[data-ga-contrast="high"] .ga-hub-carte li a:hover { color: #0040c0; }

/* ═══════════════════════════════════════════════════════════════
   TROMBINOSCOPE DES ÉLU·ES (archive /elus/) + fiche single
   Contenu administré : CPT elu (photo = image à la une, nom = titre,
   fonction + ordre = meta). Grille de médaillons à la paris.fr.
   ═══════════════════════════════════════════════════════════════ */
.ga-trombi {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 1.5rem 1.25rem;
}
.ga-elu {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
/* Toute la carte est un lien vers la fiche : bloc, sans soulignement,
   retour visuel sur le médaillon au survol et au focus clavier. */
.ga-elu__lien {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: inherit;
  border-radius: 6px;
  padding: 0.25rem;
}
.ga-elu__lien:hover .ga-elu__photo,
.ga-elu__lien:focus-visible .ga-elu__photo {
  border-color: var(--wp--preset--color--gueules);
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26, 31, 34, 0.12);
}
.ga-elu__lien:hover .ga-elu__nom { color: var(--wp--preset--color--gueules); }
.ga-elu__lien:focus-visible {
  outline: 2px solid var(--wp--preset--color--lac);
  outline-offset: 2px;
}
.ga-elu__photo {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--wp--preset--color--pierre);
  background: var(--wp--preset--color--papier);
  transition: border-color 0.2s, transform 0.2s ease, box-shadow 0.2s ease;
}
.ga-elu__photo--vide {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 2.6rem;
  font-weight: 600;
  color: var(--wp--preset--color--gueules);
}
.ga-elu__nom {
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--wp--preset--color--encre);
  margin: 0.75rem 0 0.15rem;
  line-height: 1.25;
}
.ga-elu__fonction {
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wp--preset--color--gueules);
  margin: 0;
}
html[data-ga-contrast="high"] .ga-elu__photo { border-color: #000; }
html[data-ga-contrast="high"] .ga-elu__fonction { color: #000; }

/* Fiche élu·e (single) */
.ga-elu-single { max-width: 720px; }
.ga-elu-single__photo { margin: 0 0 1.5rem; max-width: 280px; }
.ga-elu-single__photo img { width: 100%; height: auto; border-radius: 6px; display: block; }
.ga-elu-single__entete {
  border-left: 3px solid var(--wp--preset--color--gueules);
  padding: 0.5rem 0 0.5rem 1rem;
  margin: 0 0 1.75rem;
}
.ga-elu-single__fonction {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--wp--preset--color--encre);
  margin: 0 0 0.35rem;
}
.ga-elu-single__commissions {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
}
.ga-elu-single__label { font-weight: 600; color: var(--wp--preset--color--encre); }
.ga-elu-single__commissions a { color: var(--wp--preset--color--lac); }

/* ═══════════════════════════════════════════════════════════════
   AGENDA COMPLET (archive /agenda/) — groupé par mois + fiche single
   Réutilise les lignes .ga-event de la home (déjà stylées).
   ═══════════════════════════════════════════════════════════════ */
.ga-agenda-mois {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--wp--preset--color--gueules);
  margin: 2rem 0 0.25rem;
  padding-bottom: 0.35rem;
  border-bottom: 2px solid var(--wp--preset--color--pierre);
}
.ga-agenda-complet > .ga-agenda-mois:first-child { margin-top: 0.5rem; }
html[data-ga-contrast="high"] .ga-agenda-mois { color: #000; border-bottom-color: #000; }

/* Fiche événement (single) */
.ga-event-single { max-width: 760px; }
.ga-event-single__entete {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  background: var(--wp--preset--color--papier);
  border-left: 3px solid var(--wp--preset--color--gueules);
  border-radius: 0 6px 6px 0;
  padding: 1rem 1.25rem;
  margin: 0 0 1.75rem;
}
.ga-event-single__pave {
  flex: 0 0 auto;
  text-align: center;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  padding: 0.5rem 0.75rem;
  min-width: 64px;
}
.ga-event-single__jour {
  display: block;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1;
  color: var(--wp--preset--color--encre);
}
.ga-event-single__mois {
  display: block;
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--wp--preset--color--ardoise);
  margin-top: 0.15rem;
}
.ga-event-single__quand time {
  display: block;
  font-family: var(--wp--preset--font-family--plex);
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--wp--preset--color--encre);
}
.ga-event-single__infos {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ardoise);
  margin: 0.3rem 0 0;
}
html[data-ga-contrast="high"] .ga-event-single__entete { background: #fff; border-left-color: #0040c0; }

/* ═══════════════════════════════════════════════════════════════
   ANNUAIRES (associations / entreprises) — archive en cartes + single
   Contenu administré : CPT + meta _ga_contact_*. Filtres par taxonomie.
   ═══════════════════════════════════════════════════════════════ */
.ga-annuaire {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.25rem;
  margin-top: 0.5rem;
}
.ga-annuaire__carte {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 4px;
  padding: 1.1rem 1.25rem;
  transition: border-left-color 0.15s, box-shadow 0.15s;
}
.ga-annuaire__carte:hover {
  border-left-color: var(--wp--preset--color--gueules);
  box-shadow: 0 2px 12px rgba(26, 31, 34, 0.07);
}
.ga-annuaire__head {
  display: flex;
  gap: 0.9rem;
  align-items: flex-start;
}
.ga-annuaire__logo {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 4px;
}
.ga-annuaire__nom {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--wp--preset--color--encre);
  margin: 0 0 0.25rem;
  line-height: 1.2;
}
.ga-annuaire__cat {
  display: inline-block;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  color: var(--wp--preset--color--lac);
  background: rgba(46, 101, 113, 0.1);
  padding: 0.15rem 0.55rem;
  border-radius: 3px;
}
.ga-annuaire__desc {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
}
.ga-annuaire__coords {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: auto;
  padding-top: 0.5rem;
  border-top: 1px solid var(--wp--preset--color--lignes);
}
.ga-annuaire__coord {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.85rem;
  color: var(--wp--preset--color--ardoise);
  text-decoration: none;
}
.ga-annuaire__coord svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--wp--preset--color--lac); }
a.ga-annuaire__coord:hover { color: var(--wp--preset--color--gueules); text-decoration: underline; }
a.ga-annuaire__coord:hover svg { color: var(--wp--preset--color--gueules); }
.ga-annuaire__coord--adresse { cursor: default; }
html[data-ga-contrast="high"] .ga-annuaire__cat { color: #000; background: #f0f0f0; }
html[data-ga-contrast="high"] a.ga-annuaire__coord { color: #000; }

/* Fiche annuaire (single) */
.ga-annuaire-single { max-width: 760px; }
.ga-annuaire-single__logo { margin: 0 0 1.5rem; max-width: 220px; }
.ga-annuaire-single__logo img { width: 100%; height: auto; border-radius: 6px; display: block; }
.ga-annuaire-single__entete {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: var(--wp--preset--color--papier);
  border-radius: 6px;
  padding: 1.1rem 1.25rem;
  margin: 0 0 1.75rem;
}
.ga-annuaire-single__entete .ga-annuaire__coords { border-top: 0; padding-top: 0; }
html[data-ga-contrast="high"] .ga-annuaire-single__entete { background: #fff; border: 1px solid #000; }

@media (max-width: 600px) {
  .ga-trombi { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
  .ga-elu__photo { width: 96px; height: 96px; }
}

/* ═══════════════════════════════════════════════════════════════
   COMMISSIONS MUNICIPALES (liste /commissions/) — une carte par
   commission (terme de taxonomie). La fiche d'une commission
   (/commission/{slug}/) réutilise le trombinoscope filtré.
   ═══════════════════════════════════════════════════════════════ */
.ga-commissions {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 1.25rem;
  margin-top: 0.5rem;
}
.ga-commission {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  background: var(--wp--preset--color--blanc-hermine);
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--gueules);
  border-radius: 4px;
  padding: 1.25rem 1.4rem;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.15s, transform 0.15s, border-left-color 0.15s;
}
.ga-commission:hover {
  box-shadow: 0 3px 14px rgba(26, 31, 34, 0.08);
  transform: translateY(-2px);
  border-left-color: var(--wp--preset--color--or);
}
.ga-commission__nom {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 600;
  font-size: 1.1rem;
  line-height: 1.25;
  color: var(--wp--preset--color--encre);
  margin: 0;
}
.ga-commission__desc {
  font-family: var(--wp--preset--font-family--plex);
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--wp--preset--color--ardoise);
  margin: 0;
}
.ga-commission__compte {
  margin-top: auto;
  padding-top: 0.5rem;
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wp--preset--color--gueules);
}
html[data-ga-contrast="high"] .ga-commission { border-left-color: #000; }
html[data-ga-contrast="high"] .ga-commission__compte { color: #000; }

/* Description de commission en tête de sa fiche (archive de terme) */
.ga-commission-desc { margin-bottom: 1.5rem; }

/* ═══════════════════════════════════════════════════════════════
   RECHERCHE — panneau du header, formulaire, résultats (search.html)
   ═══════════════════════════════════════════════════════════════ */

/* Panneau déployé sous le header par le bouton « Rechercher » */
.ga-recherche-panel {
  border-top: 1px solid var(--wp--preset--color--lignes);
  background: var(--wp--preset--color--blanc-hermine);
  box-shadow: 0 8px 18px rgba(26, 31, 34, 0.08);
}
.ga-recherche-panel__form {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.9rem clamp(1rem, 4vw, 2rem);
}
.ga-recherche-panel__form svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: var(--wp--preset--color--ardoise);
}
.ga-recherche-panel__form input {
  flex: 1;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  padding: 0.6rem 0.85rem;
  background: var(--wp--preset--color--papier);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1rem;
}
.ga-recherche-panel__form input:focus {
  outline: 2px solid var(--wp--preset--color--gueules);
  outline-offset: 1px;
}

/* Formulaire des pages Recherche et 404 */
.ga-recherche-form {
  display: flex;
  gap: 0.65rem;
  margin: 0 0 1.75rem;
  max-width: 560px;
}
.ga-recherche-form input {
  flex: 1;
  border: 1px solid var(--wp--preset--color--lignes);
  border-radius: 4px;
  padding: 0.65rem 0.9rem;
  background: var(--wp--preset--color--blanc-hermine);
  font-family: var(--wp--preset--font-family--plex);
  font-size: 1rem;
}
.ga-recherche-form input:focus {
  outline: 2px solid var(--wp--preset--color--gueules);
  outline-offset: 1px;
}

/* Compte de résultats */
.ga-recherche-compte {
  margin: 0 0 1.5rem;
  color: var(--wp--preset--color--ardoise);
}

/* Liste des résultats */
.ga-recherche-liste {
  display: grid;
  gap: 1rem;
}
.ga-recherche-resultat {
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 4px;
  background: var(--wp--preset--color--blanc-hermine);
  padding: 1.1rem 1.3rem;
  transition: border-color 0.15s ease;
}
.ga-recherche-resultat:hover {
  border-left-color: var(--wp--preset--color--gueules);
}
.ga-recherche-resultat__type {
  display: inline-block;
  font-family: var(--wp--preset--font-family--mono);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--wp--preset--color--lac);
  margin-bottom: 0.35rem;
}
.ga-recherche-resultat__titre {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.2rem;
  margin: 0 0 0.4rem;
}
.ga-recherche-resultat__titre a {
  color: var(--wp--preset--color--encre);
  text-decoration: none;
}
.ga-recherche-resultat__titre a:hover {
  color: var(--wp--preset--color--gueules);
  text-decoration: underline;
}
.ga-recherche-resultat__extrait {
  margin: 0;
  font-size: 0.95rem;
  color: var(--wp--preset--color--ardoise);
}
.ga-recherche-vide { color: var(--wp--preset--color--ardoise); }

/* ═══════════════════════════════════════════════════════════════
   PAGE 404 — pistes de sortie
   ═══════════════════════════════════════════════════════════════ */
.ga-404__intro { margin: 0 0 1.5rem; }
.ga-404__pistes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 0.5rem;
}
.ga-404__piste {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  border: 1px solid var(--wp--preset--color--lignes);
  border-left: 3px solid var(--wp--preset--color--lac);
  border-radius: 4px;
  background: var(--wp--preset--color--blanc-hermine);
  padding: 1.1rem 1.3rem;
  text-decoration: none;
  color: var(--wp--preset--color--encre);
  transition: border-color 0.15s ease;
}
.ga-404__piste:hover {
  border-left-color: var(--wp--preset--color--gueules);
}
.ga-404__piste:hover strong { color: var(--wp--preset--color--gueules); }
.ga-404__piste strong { font-family: var(--wp--preset--font-family--fraunces); font-size: 1.1rem; }
.ga-404__piste span { font-size: 0.9rem; color: var(--wp--preset--color--ardoise); }
@media (max-width: 700px) {
  .ga-404__pistes { grid-template-columns: 1fr; }
  .ga-recherche-form { flex-direction: column; align-items: stretch; }
}

/* Contraste renforcé */
html[data-ga-contrast="high"] .ga-recherche-resultat,
html[data-ga-contrast="high"] .ga-404__piste { border-color: #000; border-left-color: #000; }
html[data-ga-contrast="high"] .ga-recherche-resultat__type,
html[data-ga-contrast="high"] .ga-recherche-resultat__extrait,
html[data-ga-contrast="high"] .ga-404__piste span { color: #000; }
html[data-ga-contrast="high"] .ga-recherche-resultat__titre a { color: #0040c0; text-decoration: underline; }

/* Cartes annuaire : le nom est un lien vers la fiche (0.10.1) */
.ga-annuaire__nom a {
  color: var(--wp--preset--color--encre);
  text-decoration: none;
}
.ga-annuaire__nom a:hover {
  color: var(--wp--preset--color--gueules);
  text-decoration: underline;
}
.ga-annuaire__carte .ga-doc-carte__lien { margin-top: 0.6rem; align-self: flex-start; }
html[data-ga-contrast="high"] .ga-annuaire__nom a { color: #0040c0; text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════
   ÉDITEUR — titre du document à l'échelle (0.10.2)
   Sur le front, le titre d'une page/article est rendu par le hero
   (taille clampée ~2.2rem). Dans l'éditeur, il hérite du h1 element
   de theme.json (taille « display », jusqu'à 5rem sur canevas large) :
   on le ramène à l'échelle du rendu réel. Sélecteur .editor-* :
   n'existe que dans l'admin, aucun effet sur le front.
   ═══════════════════════════════════════════════════════════════ */
.editor-post-title,
.editor-post-title__input {
  font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem);
  line-height: 1.15;
}