/* ==========================================================================
   Parti socialiste · Fédération de Saône-et-Loire
   Feuille de style unique. Sommaire :
   1. Jetons (couleurs, typo, espacements)   2. Base   3. Utilitaires
   4. Boutons, liens, chips, tags            5. En-tête & navigation
   6. Accueil (hero, bandeau, chiffres…)     7. Carte des sections
   8. Cartes de contenu (actus, agenda, élus, fédération)
   9. Pages intérieures                      10. Formulaires, newsletter, pied de page
   11. Animations & mouvement réduit
   ========================================================================== */

/* Polices hébergées sur le site (aucun appel à Google : RGPD). Licence : assets/fonts/LICENCE.txt */
@font-face {
  font-family: "Bricolage Grotesque"; font-style: normal; font-weight: 400 800; font-stretch: 75% 100%; font-display: swap;
  src: url("../fonts/bricolage-grotesque.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Sans"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("../fonts/instrument-sans.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Sans"; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url("../fonts/instrument-sans-italique.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/instrument-serif.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("../fonts/instrument-serif-italique.woff2") format("woff2");
}

/* 1. Jetons ---------------------------------------------------------------- */
:root {
  /* Rose PS : couleur de marque (#F70059, relevée sur le logo) */
  --rose: #F70059;
  --rose-600: #D4004C;   /* boutons & textes : contraste AA sur blanc/crème */
  --rose-700: #AD003E;
  --rose-300: #FF7FAA;
  --rose-100: #FFE1EB;
  --rose-50: #FFF3F7;

  /* Vert bocage : le Charolais, le Morvan, les haies */
  --vert-950: #06291F;
  --vert-900: #0B3B2E;
  --vert-800: #104A3A;
  --vert-700: #17604C;
  --vert-300: #93C8B3;
  --vert-100: #DDEFE6;

  /* Ocre : la roche de Solutré, les vignes du Mâconnais */
  --ocre: #F2B33D;
  --ocre-800: #7A5205;
  --ocre-100: #FCEFD0;

  /* Eau : la Saône, la Loire, le canal du Centre */
  --eau: #8FD5F2;
  --eau-800: #0E5577;
  --eau-100: #DDF1FA;

  --lilas-800: #4B2E83;
  --lilas-100: #ECE5FA;

  /* Pierre de Bourgogne */
  --creme: #FBF7F0;
  --creme-2: #F3ECDF;
  --blanc: #FFFFFF;
  --ink: #15171C;
  --ink-2: #3E434C;
  --ink-3: #62676F;
  --line: #E4DACA;

  --focus: var(--vert-900);

  --f-display: "Bricolage Grotesque", "Arial Narrow", system-ui, sans-serif;
  --f-serif: "Instrument Serif", Georgia, "Times New Roman", serif;
  --f-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --container: 1280px;
  --gutter: clamp(16px, 4vw, 40px);
  --section: clamp(4rem, 2.5rem + 6vw, 8rem);
  --radius: 24px;
  --radius-sm: 14px;

  --ease-out: cubic-bezier(.2, .7, .2, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --shadow-1: 0 1px 2px rgba(21, 23, 28, .06), 0 4px 16px rgba(21, 23, 28, .06);
  --shadow-2: 0 2px 4px rgba(21, 23, 28, .06), 0 18px 48px rgba(21, 23, 28, .12);
  --header-h: 80px;
}

/* 2. Base ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 24px); }
body {
  margin: 0;
  font-family: var(--f-body);
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink);
  background: var(--creme);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
a { color: inherit; }
button { font: inherit; color: inherit; cursor: pointer; }
input, select, textarea { font: inherit; }
main:focus { outline: none; }
sup { font-size: .6em; line-height: 0; }
::selection { background: var(--rose); color: #fff; }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
.on-dark, .primaire-band, .section--carte, .footer, .annonce, .page-hero--sombre { --focus: var(--ocre); }
/* Sur les fonds roses, le contour de focus est blanc : le vert foncé n'atteint pas le contraste de 3:1 (RGAA 10.7) */
.page-hero--rose, .newsletter, .annonce--rose, .carte-info--rose { --focus: #fff; }

/* Citations courtes : les guillemets « » sont déjà dans le texte */
q { quotes: none; }
q::before, q::after { content: none; }

h1, h2, h3, h4 {
  font-family: var(--f-display);
  font-optical-sizing: auto;
  font-weight: 750;
  line-height: 1.05;
  letter-spacing: -.015em;
  text-wrap: balance;
}
p { text-wrap: pretty; }

/* 3. Utilitaires ----------------------------------------------------------- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip {
  position: absolute; left: 16px; top: -100px; z-index: 100;
  background: var(--ink); color: #fff; padding: 12px 18px; border-radius: 10px; font-weight: 600;
}
.skip:focus { top: 12px; }
.i { width: 1.15em; height: 1.15em; flex: none; }

.section { padding-block: var(--section); }
.section--creme { background: var(--creme-2); }
.section--blanc { background: var(--blanc); }
.section__head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 1rem 2.5rem; margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem);
}
.section__head--stack { display: block; margin-bottom: 1.75rem; }
.section__head--stack .eyebrow { margin-bottom: .75rem; }
.section__head > div > .eyebrow { margin-bottom: .9rem; }
.section__lead { max-width: 34rem; color: var(--ink-2); }

.eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--f-body); font-size: .8125rem; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: var(--rose-600);
}
.eyebrow::before {
  content: ""; flex: none; width: 1em; height: 1em; background: currentColor; opacity: .85;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cmask id='m'%3E%3Crect width='24' height='24' fill='white'/%3E%3Cpath d='M12.2 7.4c-1.7 0-2.8 1.2-2.8 2.6 0 1.5 1.2 2.5 2.6 2.5 1.3 0 2.2-.9 2.2-2 0-1-.8-1.7-1.7-1.7M7.3 8.6c-.7 3.9 1.5 6.9 4.8 7.3M16.4 7.9c1 2.7.1 5.6-2.4 7' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round'/%3E%3C/mask%3E%3Cpath mask='url(%23m)' d='M12 3.4c1.9 0 3.3.9 4 2.3 1.9.2 3.5 1.7 3.5 4.1 0 4.3-3.4 7.6-7.5 7.6s-7.5-3.3-7.5-7.6c0-2.4 1.6-3.9 3.5-4.1.7-1.4 2.1-2.3 4-2.3Z'/%3E%3Cpath d='M13.6 19.2c1.4-1.6 3.6-2.1 5.6-1.4-1.1 1.9-3.4 2.6-5.6 1.4Z'/%3E%3Cpath d='M11.4 17.2h1.2v4.6h-1.2z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cmask id='m'%3E%3Crect width='24' height='24' fill='white'/%3E%3Cpath d='M12.2 7.4c-1.7 0-2.8 1.2-2.8 2.6 0 1.5 1.2 2.5 2.6 2.5 1.3 0 2.2-.9 2.2-2 0-1-.8-1.7-1.7-1.7M7.3 8.6c-.7 3.9 1.5 6.9 4.8 7.3M16.4 7.9c1 2.7.1 5.6-2.4 7' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round'/%3E%3C/mask%3E%3Cpath mask='url(%23m)' d='M12 3.4c1.9 0 3.3.9 4 2.3 1.9.2 3.5 1.7 3.5 4.1 0 4.3-3.4 7.6-7.5 7.6s-7.5-3.3-7.5-7.6c0-2.4 1.6-3.9 3.5-4.1.7-1.4 2.1-2.3 4-2.3Z'/%3E%3Cpath d='M13.6 19.2c1.4-1.6 3.6-2.1 5.6-1.4-1.1 1.9-3.4 2.6-5.6 1.4Z'/%3E%3Cpath d='M11.4 17.2h1.2v4.6h-1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.eyebrow--rose { color: var(--rose-300); }
.eyebrow--ocre { color: var(--ocre); }
.eyebrow--light { color: var(--rose-300); }

.h2 {
  font-size: clamp(2.1rem, 1.3rem + 2.9vw, 3.75rem);
  font-weight: 780;
  font-variation-settings: "wdth" 86;
  line-height: .98;
  letter-spacing: -.025em;
  max-width: 18ch;
}
.h2 em, .page-hero__titre em, .newsletter__titre em, .elus-groupe__titre em, .h3 em {
  font-family: var(--f-serif); font-style: italic; font-weight: 400;
  font-variation-settings: normal; letter-spacing: -.01em; color: var(--rose-600);
}
.h2--light { color: var(--creme); }
.h2--light em { color: var(--ocre); }
.section--carte .h2--light em { color: var(--eau); }
.h3 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: 750; letter-spacing: -.02em; }
.lead { font-size: clamp(1.125rem, 1rem + .4vw, 1.3rem); line-height: 1.55; color: var(--ink-2); max-width: 40rem; }
.lead--light { color: rgba(251, 247, 240, .82); }
.btns { display: flex; flex-wrap: wrap; gap: .75rem; }

/* 4. Boutons, liens, chips, tags ------------------------------------------- */
.btn {
  --b-bg: var(--ink); --b-fg: #fff; --b-bd: transparent;
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  min-height: 48px; padding: .75em 1.35em;
  font-family: var(--f-body); font-size: 1rem; font-weight: 650; line-height: 1.1; text-decoration: none;
  color: var(--b-fg); background: var(--b-bg); border: 2px solid var(--b-bd); border-radius: 999px;
  transition: transform .25s var(--ease-out), background-color .2s, color .2s, box-shadow .25s, border-color .2s;
  white-space: nowrap;
}
.btn .i { transition: transform .3s var(--ease-out); }
.btn:hover { transform: translateY(-2px); }
.btn:hover .i { transform: translateX(3px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn--sm { min-height: 44px; padding: .55em 1.1em; font-size: .9375rem; }
.btn--lg { min-height: 58px; padding: .9em 1.7em; font-size: 1.0625rem; }
.btn--primary { --b-bg: var(--rose-600); }
.btn--primary:hover { --b-bg: var(--rose-700); box-shadow: 0 10px 28px -8px rgba(212, 0, 76, .55); }
.btn--outline { --b-bg: transparent; --b-fg: var(--ink); --b-bd: var(--ink); }
.btn--outline:hover { --b-bg: var(--ink); --b-fg: var(--creme); }
.btn--ghost { --b-bg: transparent; --b-fg: var(--ink); }
.btn--ghost:hover { --b-bg: rgba(21, 23, 28, .06); }
.btn--ghost .i { color: var(--rose-600); }
.btn--ghost:hover .i { transform: scale(1.15); }
.btn--ocre { --b-bg: var(--ocre); --b-fg: var(--vert-950); }
.btn--ocre:hover { --b-bg: #FFC65A; box-shadow: 0 10px 30px -10px rgba(242, 179, 61, .7); }
.btn--ghost-light { --b-bg: transparent; --b-fg: var(--creme); --b-bd: rgba(251, 247, 240, .4); }
.btn--ghost-light:hover { --b-bg: rgba(251, 247, 240, .1); --b-bd: var(--creme); }
.btn--light { --b-bg: var(--creme); --b-fg: var(--vert-950); }
.btn--light:hover { --b-bg: #fff; }
.btn--dark { --b-bg: var(--vert-950); --b-fg: #fff; }
.btn--dark:hover { --b-bg: var(--ink); }

.pulse-dot { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--rose); flex: none; }
.pulse-dot::after {
  content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid var(--rose); opacity: 0;
  animation: pulse 1.8s var(--ease-out) 2;
}
.btn--outline:hover .pulse-dot { background: var(--ocre); }
.btn--outline:hover .pulse-dot::after { border-color: var(--ocre); }

.link-arrow {
  display: inline-flex; align-items: center; gap: .5em; font-weight: 650; color: var(--ink);
  text-decoration: none; background: linear-gradient(var(--rose), var(--rose)) left bottom / 0 2px no-repeat;
  padding-block: .35em; transition: background-size .35s var(--ease-out), color .2s;
}
.link-arrow .i { color: var(--rose-600); transition: transform .3s var(--ease-out); }
.link-arrow:hover { background-size: 100% 2px; }
.link-arrow:hover .i { transform: translateX(4px); }

.chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip {
  display: inline-flex; align-items: center; gap: .45em; min-height: 40px; padding: .4em 1em;
  font-size: .9375rem; font-weight: 600; border-radius: 999px; border: 1.5px solid var(--line);
  background: var(--blanc); color: var(--ink-2); transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.chip:hover { border-color: var(--ink); color: var(--ink); }
.chip.is-active { background: var(--ink); border-color: var(--ink); color: var(--creme); }
a.chip { text-decoration: none; }
.chip__n { font-size: .8em; opacity: .7; font-variant-numeric: tabular-nums; }
.chip__dot { width: 10px; height: 10px; border-radius: 50%; flex: none; display: inline-block; }
.chip__dot--rose { background: var(--rose); }
.chip__dot--ocre { background: var(--ocre); }
.chip__dot--eau { background: var(--eau); }
.chip__dot--vert { background: #3FBF8C; }
.chip__dot--lilas { background: #B79CF0; }

.tag {
  display: inline-block; padding: .3em .7em; border-radius: 999px;
  font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.2;
  background: var(--creme-2); color: var(--ink-2);
}
.tag--elus { background: var(--rose-100); color: var(--rose-700); }
.tag--primaire { background: var(--ocre-100); color: var(--ocre-800); }
.tag--federation, .tag--instance { background: var(--vert-100); color: var(--vert-800); }
.tag--sections, .tag--rencontre { background: var(--eau-100); color: var(--eau-800); }
.tag--region, .tag--formation, .tag--idees { background: var(--lilas-100); color: var(--lilas-800); }
.tag--national, .tag--reunion { background: #ECEDEF; color: var(--ink-2); }

/* 5. En-tête & navigation -------------------------------------------------- */
.annonce { background: var(--vert-950); color: var(--creme); font-size: .875rem; position: relative; z-index: 51; }
.annonce__in { display: flex; align-items: center; justify-content: center; gap: .5rem 1rem; min-height: 44px; flex-wrap: wrap; padding-block: 6px; }
.annonce__badge {
  background: var(--ocre); color: var(--vert-950); font-weight: 700; font-size: .75rem; letter-spacing: .06em;
  text-transform: uppercase; padding: .25em .7em; border-radius: 999px;
}
.annonce__txt strong { color: var(--ocre); font-weight: 650; }
.annonce__cd:not(:empty)::before { content: " · "; opacity: .6; }
.annonce__cd { color: var(--ocre); font-weight: 650; font-variant-numeric: tabular-nums; }
.annonce__lien { display: inline-flex; align-items: center; gap: .35em; font-weight: 650; text-underline-offset: 3px; }
.annonce__lien:hover { color: var(--ocre); }

.header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(251, 247, 240, .86);
  -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid transparent; transition: border-color .3s, box-shadow .3s;
}
.header.is-scrolled { border-color: var(--line); box-shadow: 0 6px 24px -18px rgba(21, 23, 28, .35); }
.header__in { display: flex; align-items: center; gap: 1.5rem; height: var(--header-h); transition: height .3s var(--ease-out); }
.header.is-scrolled .header__in { height: 68px; }
.header__logo { flex: none; display: block; border-radius: 8px; }
.header__logo img { height: 50px; width: auto; transition: height .3s var(--ease-out); }
.header.is-scrolled .header__logo img { height: 42px; }

.nav { display: flex; align-items: center; gap: 1rem; margin-left: auto; }
.nav__list { display: flex; align-items: center; gap: .1rem; }
.nav__link {
  position: relative; display: inline-flex; align-items: center; gap: .3em; min-height: 44px; padding: .5rem .7rem;
  font-size: .9688rem; font-weight: 600; color: var(--ink-2); text-decoration: none;
  background: none; border: 0; border-radius: 10px; transition: color .2s;
}
.nav__link::after {
  content: ""; position: absolute; left: .7rem; right: .7rem; bottom: 6px; height: 2px; border-radius: 2px;
  background: var(--rose); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease-out);
}
.nav__link:hover, .nav__link[aria-current="page"], .nav__link.is-current { color: var(--ink); }
.nav__link:hover::after, .nav__link[aria-current="page"]::after, .nav__link.is-current::after { transform: scaleX(1); }
.nav__toggle .i { width: 1em; height: 1em; transition: transform .3s var(--ease-out); }
.nav__toggle[aria-expanded="true"] .i { transform: rotate(180deg); }
/* Dossier du menu : le titre mène à la page, la flèche ouvre la liste */
.nav__duo { display: flex; align-items: center; }
.nav__duo .nav__principal { padding-right: .15rem; }
.nav__chevron {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; min-height: 44px; padding: 0;
  color: var(--ink-2); background: none; border: 0; border-radius: 8px;
}
.nav__chevron:hover { color: var(--ink); background: var(--creme-2); }
.nav__item { position: relative; }
.nav__item--mobile { display: none; }
.nav__cta { display: flex; align-items: center; gap: .4rem; }

.drop {
  position: absolute; top: calc(100% + 14px); left: -24px; width: min(660px, 90vw);
  display: grid; grid-template-columns: 1fr 1.35fr; gap: 1.25rem; padding: 1.25rem;
  background: var(--blanc); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-2);
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .25s, transform .3s var(--ease-out), visibility 0s .3s;
}
.drop::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.nav__item--drop.is-open .drop {
  opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .3s var(--ease-out), visibility 0s;
}
.drop__list { display: grid; gap: .25rem; }
.drop__list a {
  display: flex; align-items: flex-start; gap: .9rem; padding: .7rem .8rem; border-radius: 12px; text-decoration: none;
  transition: background-color .2s;
}
.drop__list a:hover { background: var(--creme); }
.drop__list strong { display: block; font-family: var(--f-display); font-size: 1.0625rem; font-weight: 700; line-height: 1.2; }
.drop__list small { color: var(--ink-3); font-size: .875rem; }
.drop__n { font-family: var(--f-display); font-weight: 800; color: var(--rose-600); font-size: .875rem; padding-top: .15rem; }
.drop__list a.drop__encart { align-items: center; margin-top: .35rem; padding-block: .85rem; background: var(--ocre); color: var(--vert-950); }
.drop__list a.drop__encart:hover { background: #E8A420; }
.drop__encart .drop__n { color: var(--vert-950); padding-top: 0; }
.drop__encart small { color: var(--vert-900); }
.drop__go { flex: none; width: 1.15em; height: 1.15em; margin-left: auto; transition: transform .25s var(--ease-out); }
.drop__encart:hover .drop__go { transform: translateX(3px); }

.burger {
  display: none; margin-left: auto; width: 48px; height: 48px; border-radius: 50%;
  border: 1.5px solid var(--line); background: var(--blanc); align-items: center; justify-content: center;
}
.burger .i { width: 22px; height: 22px; }
.burger__close { display: none; }
.burger[aria-expanded="true"] .burger__open { display: none; }
.burger[aria-expanded="true"] .burger__close { display: block; }

@media (max-width: 1180px) {
  .burger { display: inline-flex; }
  .nav {
    position: fixed; inset: 0; top: 0; z-index: -1; margin: 0;
    flex-direction: column; align-items: stretch; justify-content: space-between; gap: 2rem;
    padding: calc(var(--header-h) + 64px) var(--gutter) calc(24px + env(safe-area-inset-bottom));
    background: var(--creme); overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-12px);
    transition: opacity .3s, transform .4s var(--ease-out), visibility 0s .4s;
  }
  .nav.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .3s, transform .4s var(--ease-out), visibility 0s; }
  .nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .nav__item { border-bottom: 1px solid var(--line); }
  .nav__item--mobile { display: block; }
  .nav__link { width: 100%; justify-content: space-between; min-height: 60px; padding: .75rem 0; font-family: var(--f-display); font-size: 1.6rem; font-weight: 700; color: var(--ink); }
  .nav__link::after { display: none; }
  .nav__link[aria-current="page"], .nav__link.is-current { color: var(--rose-600); }
  .drop {
    position: static; width: auto; display: none; grid-template-columns: 1fr; opacity: 1; visibility: visible;
    transform: none; box-shadow: none; border: 0; padding: 0 0 1rem; background: transparent;
  }
  .nav__item--drop.is-open .drop { display: grid; }
  .nav__duo { justify-content: space-between; gap: 1rem; }
  .nav__duo .nav__principal { flex: 1; width: auto; }
  .nav__chevron { flex: none; width: 48px; height: 48px; min-height: 0; border: 1.5px solid var(--line); border-radius: 50%; background: var(--blanc); color: var(--ink); }
  .nav__chevron .i { width: 22px; height: 22px; }
  .nav__item--drop .drop__list { padding-left: .25rem; }
  .nav__cta { flex-direction: column; align-items: stretch; }
  .nav__cta .btn { min-height: 54px; font-size: 1.0625rem; }
  body.menu-ouvert { overflow: hidden; }
  .header.menu-ouvert { background: var(--creme); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* 6. Accueil ---------------------------------------------------------------- */
.hero { position: relative; padding-block: clamp(2.5rem, 1rem + 5vw, 6rem) clamp(3.5rem, 2rem + 5vw, 6.5rem); overflow: hidden; }
.hero::before {
  content: ""; position: absolute; width: 60vw; height: 60vw; right: -18vw; top: -22vw; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(247, 0, 89, .10), transparent); pointer-events: none;
}
.hero__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.hero__eyebrow { margin-bottom: 1.5rem; }
.hero__titre {
  font-size: clamp(3.1rem, 1rem + 6.6vw, 7.4rem);
  font-weight: 800;
  font-variation-settings: "wdth" 80;
  line-height: .9;
  letter-spacing: -.035em;
  color: var(--ink);
}
.hero__line { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.hero__line > span { display: inline-block; }
.hero__accent { color: var(--rose); }
.riviere {
  position: relative; display: inline-block; font-family: var(--f-serif); font-style: italic; font-weight: 400;
  font-variation-settings: normal; letter-spacing: -.01em; padding-right: .06em;
}
.riviere__vague { position: absolute; left: 0; right: 0; bottom: -.02em; width: 100%; height: .2em; overflow: visible; }
.riviere__vague path { fill: none; stroke: var(--eau-800); stroke-width: 3.5; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 0; }
.riviere--2 .riviere__vague path { stroke: #3AA8D8; }
.hero__lead { margin-top: 1.75rem; max-width: 34rem; font-size: clamp(1.1rem, 1rem + .35vw, 1.25rem); color: var(--ink-2); }
.hero__cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.25rem; }

.hero__art { position: relative; }
.hero-art {
  position: relative; aspect-ratio: 1 / 1.05; border-radius: 36px; overflow: visible;
  background: var(--rose); isolation: isolate;
  box-shadow: 0 40px 80px -40px rgba(173, 0, 62, .55);
}
.hero-art::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1;
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(255, 255, 255, .22), transparent 55%),
    radial-gradient(90% 70% at 0% 100%, rgba(120, 0, 40, .35), transparent 60%);
}
.hero-art__map { position: absolute; inset: 7% 5% 12% 8%; width: 87%; height: 81%; overflow: visible; }
.h-fill { fill: rgba(255, 255, 255, .10); }
.h-arr { fill: none; stroke: rgba(255, 255, 255, .28); stroke-width: 1.4; }
.h-outline { fill: none; stroke: #fff; stroke-width: 3; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.h-river { fill: none; stroke: #fff; stroke-width: 5; stroke-linecap: round; opacity: .95; stroke-dasharray: 1; stroke-dashoffset: 0; }
.h-canal { fill: none; stroke: var(--ocre); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.h-dot { fill: var(--vert-950); stroke: #fff; stroke-width: 3; transform-box: fill-box; transform-origin: center; }
.hero-art__rose { position: absolute; width: 34%; right: 6%; bottom: 6%; filter: drop-shadow(0 8px 20px rgba(120, 0, 40, .35)); }
.sticker {
  position: absolute; z-index: 2; font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 85;
  font-size: clamp(.95rem, .7rem + .7vw, 1.3rem); text-transform: uppercase; letter-spacing: .02em;
  padding: .45em .95em; border-radius: 999px; box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .35); white-space: nowrap;
}
.sticker--1 { background: var(--creme); color: var(--vert-950); top: 10%; left: -7%; rotate: -8deg; }
.sticker--2 { background: var(--vert-900); color: var(--creme); top: 44%; right: -6%; rotate: 7deg; }
.sticker--3 { background: var(--ocre); color: var(--vert-950); bottom: 13%; left: 4%; rotate: -4deg; }
.badge-rond { position: absolute; z-index: 3; width: clamp(96px, 11vw, 150px); top: -5%; right: -4%; overflow: visible; }
.badge-rond__bg { fill: var(--vert-950); }
/* Espacement calculé pour que « Parti socialiste · Saône-et-Loire · 71 · » fasse pile un tour du cercle (rayon 74).
   white-space: pre garde l'espace finale, sinon l'écart avant « Parti » serait plus petit que les autres. */
.badge-rond text { fill: var(--creme); font-family: var(--f-body); font-weight: 700; font-size: 16.5px; letter-spacing: .1987em; white-space: pre; text-transform: uppercase; }
.badge-rond textPath { fill: var(--creme); }
.badge-rond .badge-rond__71 { font-family: var(--f-display); font-size: 52px; font-weight: 800; letter-spacing: -.03em; fill: var(--rose); }
.badge-rond > text:first-of-type { transform-origin: 100px 100px; animation: tourne-entree 4s var(--ease-out) both; }

.bandeau { background: var(--vert-900); color: var(--creme); overflow: hidden; padding-block: 1.1rem; border-block: 1px solid var(--vert-800); }
.bandeau__track { display: flex; width: max-content; animation: defile 45s linear infinite; }
.bandeau:hover .bandeau__track, .bandeau.is-paused .bandeau__track { animation-play-state: paused; }
.bandeau { position: relative; }
.bandeau__pause { position: absolute; right: max(var(--gutter), 12px); top: 50%; translate: 0 -50%; z-index: 2; }
.bandeau__pause .pause__txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bandeau__track span {
  display: inline-flex; align-items: center; gap: 2.2rem; padding-right: 2.2rem;
  font-family: var(--f-display); font-weight: 750; font-variation-settings: "wdth" 80;
  font-size: clamp(1.3rem, 1rem + 1vw, 1.9rem); text-transform: uppercase; letter-spacing: .01em; white-space: nowrap;
}
.bandeau__track span::after {
  content: ""; width: 14px; height: 14px; background: var(--rose); flex: none;
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%);
}
.bandeau__track span:nth-child(3n+2)::after { background: var(--ocre); }
.bandeau__track span:nth-child(3n)::after { background: var(--eau); }

.chiffres { padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem); border-bottom: 1px solid var(--line); }
.chiffres__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.chiffre { padding: .5rem clamp(1rem, 2vw, 2rem); border-left: 1px solid var(--line); }
.chiffre:first-child { border-left: 0; padding-left: 0; }
.chiffre__n {
  font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 78;
  font-size: clamp(3rem, 2rem + 3.5vw, 5.5rem); line-height: .9; letter-spacing: -.04em; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.chiffre:nth-child(2) .chiffre__n { color: var(--rose); }
.chiffre__l { margin-top: .6rem; color: var(--ink-2); font-weight: 500; max-width: 16ch; }

.actus-home { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); align-items: start; }
.actus-home__side { display: grid; gap: 1rem; }

.primaire-band { position: relative; background: var(--vert-900); color: var(--creme); padding-block: var(--section); overflow: hidden; }
.primaire-band::before {
  content: ""; position: absolute; inset: auto -10% -60% auto; width: 70%; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(242, 179, 61, .18), transparent); pointer-events: none;
}
.primaire-band__grid { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.primaire-band .h2 { margin-block: 1rem 1.5rem; max-width: 14ch; }
.primaire-band .btns { margin-top: 2rem; }
.countdown-card {
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .12); border-radius: 28px;
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
}
.countdown-card__label { font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--vert-300); }
.countdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: .6rem; margin-block: 1rem 2rem; }
.countdown > div { background: var(--vert-950); border-radius: 16px; padding: .9rem .5rem .7rem; text-align: center; }
.countdown span {
  display: block; font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 80;
  font-size: clamp(2rem, 1.3rem + 2.2vw, 3.2rem); line-height: 1; color: var(--ocre); font-variant-numeric: tabular-nums;
}
.countdown small { display: block; margin-top: .35rem; font-size: .8125rem; color: rgba(251, 247, 240, .75); }
.steps { display: grid; gap: .9rem; }
.steps li { display: flex; gap: .9rem; align-items: flex-start; }
.steps__n {
  flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  border: 1.5px solid var(--ocre); color: var(--ocre); font-family: var(--f-display); font-weight: 800;
}
.steps strong { display: block; font-weight: 650; }
.steps small { color: rgba(251, 247, 240, .72); font-size: .9375rem; }

.split { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
.agenda-home .events { margin-bottom: 1.5rem; }
.engage { display: grid; gap: 1rem; }
.engage .section__head { margin-bottom: .75rem; }
.engage-card {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.1rem;
  padding: 1.25rem 1.4rem; border-radius: 22px; text-decoration: none;
  transition: transform .35s var(--ease-out), box-shadow .35s;
}
.engage-card:hover { transform: translateY(-4px) rotate(-.4deg); box-shadow: var(--shadow-2); }
.engage-card__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: rgba(255, 255, 255, .16); }
.engage-card__icon .i { width: 26px; height: 26px; }
.engage-card__txt strong { display: block; font-family: var(--f-display); font-size: 1.35rem; font-weight: 750; line-height: 1.15; }
.engage-card__txt small { display: block; margin-top: .2rem; font-size: .9375rem; opacity: .88; line-height: 1.4; }
.engage-card__go { width: 24px; height: 24px; transition: transform .35s var(--ease-out); }
.engage-card:hover .engage-card__go { transform: translateX(5px); }
.engage-card--rose { background: var(--rose-600); color: #fff; }
.engage-card--rose .engage-card__txt small { opacity: 1; }
.engage-card--vert { background: var(--vert-900); color: var(--creme); --focus: var(--ocre); }
.engage-card--ocre { background: var(--ocre); color: var(--vert-950); }
.engage-card--ocre .engage-card__icon { background: rgba(6, 41, 31, .1); }
.engage__social { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .75rem; padding-top: 1.25rem; border-top: 1px solid var(--line); font-weight: 650; }

/* 7. Carte des sections ------------------------------------------------------ */
.section--carte { background: var(--vert-950); color: var(--creme); position: relative; overflow: hidden; }
.section--carte::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px); background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(70% 60% at 30% 50%, #000, transparent); mask-image: radial-gradient(70% 60% at 30% 50%, #000, transparent);
}
.section__head--light .section__lead { color: rgba(251, 247, 240, .78); }
.carte { position: relative; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, 1fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: start; }
.carte__stage { position: relative; }
.carte__svg { width: 100%; height: auto; overflow: visible; }
.carte__shadow { fill: #021810; transform: translate(10px, 14px); }
.carte__arr { fill: var(--vert-800); stroke: rgba(251, 247, 240, .16); stroke-width: 1.3; stroke-linejoin: round; transition: fill .5s var(--ease-out); }
.carte__arr.is-on { fill: #1B6F57; }
.carte__tlabel {
  fill: rgba(251, 247, 240, .26); font-family: var(--f-body); font-weight: 700; font-size: 15px; letter-spacing: .22em;
  text-anchor: middle; transition: fill .4s;
}
.carte__tlabel.is-on { fill: rgba(251, 247, 240, .75); }
.carte__outline { fill: none; stroke: var(--creme); stroke-width: 2.6; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.carte__river { fill: none; stroke: var(--eau); stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.carte__river--doubs { stroke-width: 3; }
.carte__river--arroux { stroke-width: 2.2; opacity: .75; }
.carte__canal { fill: none; stroke: var(--ocre); stroke-width: 3; stroke-dasharray: 7 7; stroke-linecap: round; }
.carte__canal-mask { fill: none; stroke: #fff; stroke-width: 14; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.carte__rlabel { fill: var(--eau); font-family: var(--f-serif); font-style: italic; font-size: 30px; }
.carte__clabel { fill: var(--ocre); font-family: var(--f-serif); font-style: italic; font-size: 21px; }

.carte__pins { position: absolute; inset: 0; }
.pin {
  position: absolute; left: var(--x); top: var(--y); z-index: 1;
  display: grid; place-items: center; width: 34px; height: 34px; margin: -17px 0 0 -17px; padding: 0;
  background: none; border: 0; border-radius: 50%;
  transition: opacity .4s, transform .4s var(--ease-spring);
}
.pin__dot {
  position: relative; width: 14px; height: 14px; border-radius: 50%; background: var(--rose);
  box-shadow: 0 0 0 3px var(--vert-950), 0 0 0 4.5px rgba(251, 247, 240, .9);
  transition: transform .35s var(--ease-spring), background-color .2s;
}
.pin__dot::after {
  content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--rose); opacity: 0;
}
.pin.is-active .pin__dot::after { animation: pulse 1.6s var(--ease-out) 3; }
.pin__label {
  position: absolute; left: calc(100% - 4px); top: 50%; transform: translate(0, -50%);
  padding: .15em .55em; border-radius: 8px; white-space: nowrap; pointer-events: none;
  font-size: .8125rem; font-weight: 650; color: var(--creme); background: rgba(6, 41, 31, .72);
  opacity: 0; transition: opacity .25s, transform .25s var(--ease-out);
}
.pin--etiquette .pin__label { opacity: 1; background: transparent; text-shadow: 0 1px 2px var(--vert-950), 0 0 8px var(--vert-950); }
.pin:hover, .pin:focus-visible, .pin.is-active { z-index: 3; }
.pin:hover .pin__label, .pin:focus-visible .pin__label, .pin.is-active .pin__label { opacity: 1; background: var(--creme); color: var(--vert-950); text-shadow: none; }
.pin:hover .pin__label { pointer-events: auto; }
.carte.sans-etiquettes .pin:not(.pin--etiquette):not(.is-active) .pin__label { opacity: 0; }
.pin:hover .pin__dot, .pin:focus-visible .pin__dot { transform: scale(1.3); }
.pin.is-active .pin__dot { transform: scale(1.45); background: var(--ocre); }
.pin.is-active .pin__dot::after { border-color: var(--ocre); }
.pin.is-dim { opacity: .22; }
.pin:focus-visible { outline-offset: 0; }

.carte__legende { position: absolute; left: 0; bottom: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; font-size: .8125rem; color: rgba(251, 247, 240, .75); list-style: none; margin: 0; padding: 0; }
.carte__legende li { display: flex; align-items: center; gap: .45rem; }
.lg { display: inline-block; flex: none; }
.lg--riviere { width: 20px; height: 4px; border-radius: 4px; background: var(--eau); }
.lg--canal { width: 20px; height: 0; border-top: 3px dashed var(--ocre); }
.lg--pin { width: 10px; height: 10px; border-radius: 50%; background: var(--rose); box-shadow: 0 0 0 2px var(--creme); }

.carte__panel {
  display: grid; gap: 1.25rem; padding: clamp(1.1rem, 1rem + 1vw, 1.75rem);
  border-radius: var(--radius); background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1);
}
.carte .chip { background: transparent; color: var(--creme); border-color: rgba(251, 247, 240, .22); min-height: 38px; font-size: .875rem; }
.carte .chip:hover { border-color: var(--creme); }
.carte .chip.is-active { background: var(--creme); color: var(--vert-950); border-color: var(--creme); }
.carte__detail { min-height: 150px; }
.carte__hint { display: flex; gap: .7rem; align-items: flex-start; color: rgba(251, 247, 240, .78); padding: 1rem 1.1rem; border-radius: 16px; border: 1.5px dashed rgba(251, 247, 240, .22); }
.carte__hint .i { color: var(--rose-300); margin-top: .2rem; }
.fiche {
  background: var(--creme); color: var(--ink); border-radius: 18px; padding: 1.25rem 1.35rem; --focus: var(--vert-900);
  animation: fiche .45s var(--ease-out);
}
.fiche__terr { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--rose-600); }
.fiche__nom { font-family: var(--f-display); font-weight: 780; font-variation-settings: "wdth" 85; font-size: 1.75rem; line-height: 1.05; margin: .3rem 0 .9rem; }
.fiche dl { display: grid; gap: .55rem; font-size: .9375rem; }
.fiche dl div { display: grid; grid-template-columns: 22px 1fr; gap: .6rem; align-items: start; }
.fiche dt .i { color: var(--rose-600); margin-top: .2rem; }
.fiche dd { margin: 0; color: var(--ink-2); }
.fiche__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.1rem; }
.fiche__actions .btn { min-height: 44px; font-size: .9375rem; }
.carte__liste { list-style: none; margin: 0; padding: 0; max-height: 300px; overflow-y: auto; border-top: 1px solid rgba(255, 255, 255, .1); scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .25) transparent; }
.carte__liste li[hidden] { display: none; }
.carte__liste button {
  width: 100%; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: .75rem;
  min-height: 48px; padding: .55rem .5rem; text-align: left; background: none; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .08);
  color: var(--creme); border-radius: 0; transition: background-color .2s, padding .25s var(--ease-out);
}
.carte__liste button span { font-weight: 600; }
.carte__liste button small { color: rgba(251, 247, 240, .6); font-size: .8125rem; }
.carte__liste button .i { color: var(--rose-300); opacity: 0; transform: translateX(-6px); transition: opacity .2s, transform .25s var(--ease-out); }
.carte__liste button:hover, .carte__liste button.is-active { background: rgba(255, 255, 255, .06); padding-left: .9rem; }
.carte__liste button:hover .i, .carte__liste button.is-active .i { opacity: 1; transform: none; }
.carte__foot { margin-top: 2.5rem; }

/* 8. Cartes de contenu ------------------------------------------------------- */
.news-card {
  position: relative; display: grid; background: var(--blanc); border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--line); transition: transform .4s var(--ease-out), box-shadow .4s;
}
.news-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); }
.news-card__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--creme-2); }
.news-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out); }
.news-card:hover .news-card__media img, .news-card:hover .vignette { transform: scale(1.05); }
.news-card__body { display: flex; flex-direction: column; gap: .7rem; padding: 1.35rem 1.4rem 1.5rem; }
.news-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; font-size: .875rem; color: var(--ink-3); }
.news-card__titre { font-size: 1.3rem; font-weight: 720; line-height: 1.15; letter-spacing: -.015em; }
.news-card__titre a { text-decoration: none; }
.news-card__titre a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.news-card__titre a:focus-visible { outline: none; }
.news-card:has(a:focus-visible) { outline: 3px solid var(--focus); outline-offset: 3px; }
.news-card__chapo { color: var(--ink-2); font-size: .9688rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.news-card__more { display: inline-flex; align-items: center; gap: .4em; font-weight: 650; font-size: .9375rem; color: var(--rose-600); margin-top: auto; }
.news-card__more .i { transition: transform .3s var(--ease-out); }
.news-card:hover .news-card__more .i { transform: translateX(4px); }
.news-card--une .news-card__media { aspect-ratio: 16 / 11; }
.news-card--une .news-card__titre { font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); font-variation-settings: "wdth" 88; line-height: 1.05; }
.news-card--une .news-card__chapo { font-size: 1.0625rem; -webkit-line-clamp: 4; }
.actus-home__side .news-card { grid-template-columns: 38% 1fr; }
.actus-home__side .news-card__media { aspect-ratio: auto; height: 100%; min-height: 150px; }
.actus-home__side .news-card__body { padding: 1rem 1.1rem 1.1rem; gap: .5rem; }
.actus-home__side .news-card__titre { font-size: 1.0625rem; }
.actus-home__side .news-card__chapo { -webkit-line-clamp: 2; font-size: .9063rem; }
.actus-home__side .news-card__more { display: none; }

.vignette { position: relative; width: 100%; height: 100%; min-height: 100%; display: flex; align-items: flex-end; padding: 1rem 1.1rem; overflow: hidden; transition: transform .8s var(--ease-out); }
.vignette__cat { position: relative; font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 78; font-size: clamp(1.4rem, 1rem + 1.4vw, 2.2rem); line-height: .9; text-transform: uppercase; letter-spacing: -.01em; }
.vignette--rose { background: var(--rose); color: #fff; background-image: radial-gradient(rgba(255, 255, 255, .22) 2px, transparent 2.5px); background-size: 18px 18px; }
.vignette--vert { background: var(--vert-900); color: var(--eau); background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .06) 0 2px, transparent 2px 14px); }
.vignette--ocre { background: var(--ocre); color: var(--vert-950); background-image: repeating-radial-gradient(circle at 100% 0, transparent 0 14px, rgba(6, 41, 31, .1) 14px 16px); }
.vignette--eau { background: var(--eau); color: var(--vert-950); background-image: repeating-linear-gradient(0deg, transparent 0 12px, rgba(14, 85, 119, .12) 12px 14px); }
.vignette::before {
  content: ""; position: absolute; right: -12%; top: -20%; width: 70%; aspect-ratio: 1; border-radius: 50%;
  border: 2px solid currentColor; opacity: .25;
}

.events { display: grid; gap: .75rem; }
.event {
  display: grid; grid-template-columns: 78px 1fr; gap: 1.1rem; align-items: start;
  padding: 1rem 1.1rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 20px;
  transition: border-color .25s, transform .35s var(--ease-out);
}
.event:hover { border-color: var(--ink); transform: translateX(4px); }
.event__date { display: grid; place-items: center; align-content: center; aspect-ratio: 1; border-radius: 16px; background: var(--creme); }
.event[data-type="primaire"] .event__date { background: var(--ocre); }
.event__jour { font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 80; font-size: 2rem; line-height: 1; }
.event__mois { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-2); }
.event__body { display: grid; gap: .35rem; }
.event__titre { font-size: 1.125rem; font-weight: 720; line-height: 1.2; }
.event__titre a { text-decoration: underline; text-decoration-color: var(--rose); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.event__titre a:hover { text-decoration-color: currentColor; }
.event__infos { display: flex; flex-wrap: wrap; gap: .25rem 1rem; font-size: .875rem; color: var(--ink-3); }
.event__infos span { display: inline-flex; align-items: center; gap: .35rem; }
.event__infos .i { width: 1em; height: 1em; color: var(--rose-600); }
.event__desc { color: var(--ink-2); font-size: .9688rem; margin-top: .2rem; }

.elus-une { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1rem, 2.5vw, 2rem); }
.elu-une {
  position: relative; display: grid; grid-template-columns: .9fr 1.1fr; background: var(--blanc);
  border-radius: 28px; overflow: hidden; border: 1px solid var(--line); min-height: 360px;
}
.elu-une__photo { position: relative; overflow: hidden; }
.elu-une__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; transition: transform 1s var(--ease-out); }
.elu-une:hover .elu-une__photo img { transform: scale(1.04); }
.elu-une__body { display: flex; flex-direction: column; justify-content: flex-end; gap: .75rem; padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); }
.elu-une__mandat { font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rose-600); }
.elu-une__nom { font-size: clamp(2rem, 1.3rem + 2vw, 3rem); font-weight: 800; font-variation-settings: "wdth" 80; line-height: .95; letter-spacing: -.03em; }
.elu-une__bio { color: var(--ink-2); font-size: 1rem; }
.elu-une:nth-child(2) .elu-une__mandat { color: var(--vert-700); }
.elu-une::before {
  content: ""; position: absolute; z-index: 1; left: 0; top: 0; width: 6px; height: 100%; background: var(--rose);
}
.elu-une:nth-child(2)::before { background: var(--vert-700); }

.elus-groupe { padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem); border-top: 1px solid var(--line); }
.elus-groupe[hidden] { display: none; }
.elus-groupe__head { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 3rem; align-items: end; margin-bottom: 1.75rem; }
.elus-groupe__head p { color: var(--ink-2); }
.elus-groupe__titre { font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem); font-variation-settings: "wdth" 85; letter-spacing: -.025em; }
.elus-groupe__titre em { display: block; font-size: .8em; }
.elus-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .75rem; }
.elu-card { display: flex; gap: .9rem; align-items: center; padding: .8rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 18px; transition: border-color .25s, transform .35s var(--ease-out); }
.elu-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.elu-card__img { width: 64px; height: 64px; border-radius: 14px; flex: none; object-fit: cover; }
.elu-card__nom { font-family: var(--f-display); font-weight: 720; font-size: 1.0625rem; line-height: 1.2; }
.elu-card__mandat { font-size: .875rem; color: var(--ink-2); line-height: 1.35; }
.elu-card__detail { font-size: .8125rem; color: var(--ink-3); }

.avatar { overflow: hidden; }
.avatar__bg { fill: var(--av-bg); }
.avatar__fg { fill: var(--av-fg); }
.avatar--rose { --av-bg: var(--rose-100); --av-fg: #F7A3C1; }
.avatar--vert { --av-bg: var(--vert-100); --av-fg: #9CCBB8; }
.avatar--ocre { --av-bg: var(--ocre-100); --av-fg: #EDCB86; }
.avatar--eau { --av-bg: var(--eau-100); --av-fg: #A2D3E8; }

.ps-card {
  display: grid; grid-template-columns: minmax(220px, .7fr) 1.3fr; gap: 0; overflow: hidden;
  background: var(--vert-900); color: var(--creme); border-radius: 32px; --focus: var(--ocre);
}
.ps-card__photo { position: relative; min-height: 320px; }
.ps-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ps-card__body { display: flex; flex-direction: column; justify-content: center; gap: 1rem; padding: clamp(1.5rem, 1rem + 3vw, 3.5rem); }
.ps-card__nom { font-size: clamp(2.2rem, 1.5rem + 2.5vw, 3.5rem); font-weight: 800; font-variation-settings: "wdth" 80; letter-spacing: -.03em; line-height: .95; }
.ps-card__mot { margin: 0; font-family: var(--f-serif); font-style: italic; font-size: clamp(1.2rem, 1rem + .7vw, 1.55rem); line-height: 1.4; color: rgba(251, 247, 240, .88); }

.membres--cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: clamp(.75rem, 1.5vw, 1.25rem); }
.membre { display: flex; flex-direction: column; gap: .3rem; padding: .75rem .75rem 1.1rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 22px; transition: transform .35s var(--ease-out), box-shadow .35s; }
.membre:hover { transform: translateY(-4px); box-shadow: var(--shadow-1); }
.membre__img { width: 100%; aspect-ratio: 1; height: auto; border-radius: 16px; margin-bottom: .6rem; object-fit: cover; object-position: 50% 15%; }
.membre__nom { font-family: var(--f-display); font-weight: 750; font-size: 1.15rem; line-height: 1.15; padding-inline: .25rem; }
.membre__role { font-size: .9063rem; color: var(--ink-2); line-height: 1.35; padding-inline: .25rem; }
.membre__section { display: flex; align-items: center; gap: .35rem; font-size: .8125rem; color: var(--ink-3); padding-inline: .25rem; margin-top: auto; padding-top: .35rem; }
.membre__section .i { width: 1em; height: 1em; color: var(--rose-600); }
.membres--compact { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .6rem; }
.membre-c { display: flex; align-items: center; gap: .8rem; padding: .6rem; border-radius: 16px; background: var(--blanc); border: 1px solid var(--line); }
.membre-c__img { width: 56px; height: 56px; border-radius: 12px; flex: none; }
.membre-c__nom { font-weight: 650; line-height: 1.2; }
.membre-c__section { font-size: .8125rem; color: var(--ink-3); }
.membres--mini { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .25rem 1rem; }
.membre-m { display: flex; align-items: center; gap: .7rem; padding: .45rem 0; border-bottom: 1px solid var(--line); font-size: .9375rem; }
.membre-m span { display: flex; flex-direction: column; line-height: 1.25; color: var(--ink-3); font-size: .8125rem; }
.membre-m strong { color: var(--ink); font-size: .9375rem; font-weight: 650; }
.membre-m .membre-m__role { color: var(--ink-2); }
.membres--encarts { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .75rem; }
.membre-e { display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 1.2rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 20px; }
.membre-e strong { font-family: var(--f-display); font-size: 1.1rem; font-weight: 700; line-height: 1.2; }
.membre-e__role { font-size: .9063rem; color: var(--ink-2); line-height: 1.35; }
.membre-e__section { display: flex; align-items: center; gap: .35rem; margin-top: auto; padding-top: .2rem; font-size: .8125rem; color: var(--ink-3); }
.membre-e__section .i { width: 1em; height: 1em; color: var(--rose-600); }

.sec-groupe { margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); }
.sec-groupe__titre { display: flex; align-items: center; gap: .7rem; font-size: 1.6rem; margin-bottom: 1.1rem; }
.sec-groupe__titre .chip__dot { width: 14px; height: 14px; }
.sec-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .75rem; }
.sec-card { display: grid; gap: .45rem; padding: 1.2rem 1.25rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 20px; }
.sec-card__nom { font-size: 1.3rem; font-variation-settings: "wdth" 88; margin-bottom: .25rem; }
.sec-card__row { display: flex; gap: .55rem; align-items: flex-start; font-size: .9375rem; color: var(--ink-2); }
.sec-card__row .i { color: var(--rose-600); margin-top: .2rem; width: 1em; height: 1em; }
.sec-card .link-arrow { font-size: .9375rem; justify-self: start; margin-top: .25rem; }

/* 9. Pages intérieures ------------------------------------------------------- */
.page-hero { position: relative; padding-block: clamp(2.5rem, 1.5rem + 4vw, 5.5rem) clamp(2.5rem, 1.5rem + 3vw, 4.5rem); overflow: hidden; border-bottom: 1px solid var(--line); }
.page-hero__grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 2rem 4rem; align-items: end; }
.ariane { display: flex; flex-wrap: wrap; gap: .4rem; font-size: .875rem; color: var(--ink-3); margin-bottom: 1.75rem; list-style: none; padding: 0; }
.ariane li:not(:last-child)::after { content: "/"; margin-left: .4rem; opacity: .5; }
.ariane a { text-underline-offset: 3px; }
.ariane a:hover { color: var(--rose-600); }
.page-hero__titre {
  font-size: clamp(2.7rem, 1.4rem + 5vw, 6rem); font-weight: 800; font-variation-settings: "wdth" 80;
  line-height: .92; letter-spacing: -.035em;
}
.page-hero__lead { margin-top: 1.5rem; }
.page-hero__aside { justify-self: end; }
.page-hero--sombre { background: var(--vert-900); color: var(--creme); border-bottom: 0; }
.page-hero--sombre .ariane { color: rgba(251, 247, 240, .7); }
.page-hero--sombre .page-hero__titre em { color: var(--ocre); }
.page-hero--sombre .lead { color: rgba(251, 247, 240, .82); }
.page-hero--rose { background: var(--rose-600); color: #fff; border-bottom: 0; --focus: var(--vert-950); }
.page-hero--rose .ariane { color: #fff; }
.page-hero--rose .page-hero__titre em { color: var(--vert-950); }
.page-hero--rose .eyebrow { color: #fff; }
.page-hero--rose .lead { color: #fff; }
.page-hero__deco {
  position: absolute; right: -2vw; bottom: -.18em; font-family: var(--f-display); font-weight: 800;
  font-variation-settings: "wdth" 75; font-size: clamp(8rem, 22vw, 20rem); line-height: .8; letter-spacing: -.05em;
  color: transparent; -webkit-text-stroke: 2px rgba(21, 23, 28, .07); pointer-events: none; user-select: none;
}
.page-hero--sombre .page-hero__deco { -webkit-text-stroke-color: rgba(251, 247, 240, .09); }
.page-hero--rose .page-hero__deco { -webkit-text-stroke-color: rgba(255, 255, 255, .25); }

.subnav { position: sticky; top: 68px; z-index: 20; background: rgba(251, 247, 240, .92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.subnav ul { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; padding-block: .6rem; list-style: none; margin: 0; }
.subnav ul::-webkit-scrollbar { display: none; }
.subnav a {
  display: inline-flex; align-items: center; min-height: 44px; padding: .4rem 1rem; border-radius: 999px; white-space: nowrap;
  text-decoration: none; font-weight: 600; font-size: .9375rem; color: var(--ink-2); transition: background-color .2s, color .2s;
}
.subnav a:hover { background: var(--creme-2); color: var(--ink); }
.subnav a.is-active { background: var(--ink); color: var(--creme); }
.subnav a.subnav__encart { background: var(--ocre); color: var(--vert-950); }
.subnav a.subnav__encart:hover { background: #E8A420; color: var(--vert-950); }

.instances { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.instance { position: relative; padding: 1.5rem; border-radius: 24px; background: var(--blanc); border: 1px solid var(--line); overflow: hidden; }
.instance .instance__n { font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 78; font-size: 3.5rem; line-height: .9; letter-spacing: -.04em; color: var(--rose); }
.instance h3 { font-size: 1.35rem; margin: .6rem 0 .4rem; }
.instance p { color: var(--ink-2); font-size: .9688rem; }
.instance--1 { background: var(--vert-900); color: var(--creme); border-color: var(--vert-900); }
.instance--1 p { color: rgba(251, 247, 240, .8); }
.instance--1 .instance__n { color: var(--ocre); }

.bloc { padding-block: clamp(3rem, 2rem + 4vw, 6rem); }
.bloc + .bloc { border-top: 1px solid var(--line); }
.bloc__head { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 3rem; align-items: end; margin-bottom: 2rem; }
.bloc__head p { color: var(--ink-2); }
.bloc__count { font-family: var(--f-display); font-weight: 800; color: var(--rose); }

.projet { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.toc { position: sticky; top: 100px; display: grid; gap: .25rem; }
.toc p { font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: .5rem; }
.toc a { display: grid; grid-template-columns: 34px 1fr; gap: .3rem; padding: .55rem .7rem; border-radius: 12px; text-decoration: none; font-weight: 600; font-size: .9375rem; color: var(--ink-2); transition: background-color .2s, color .2s; }
.toc a span { font-family: var(--f-display); font-weight: 800; color: var(--rose-600); }
.toc a:hover { background: var(--creme-2); color: var(--ink); }
.toc a.is-active { background: var(--ink); color: var(--creme); }
.toc a.is-active span { color: var(--ocre); }
.priorite { padding-block: 0 clamp(3rem, 2rem + 3vw, 5rem); scroll-margin-top: 110px; }
.priorite__n { font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 75; font-size: clamp(4rem, 3rem + 4vw, 7rem); line-height: .8; letter-spacing: -.05em; color: transparent; -webkit-text-stroke: 2px var(--rose); }
.priorite h2 { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.9rem); font-variation-settings: "wdth" 85; letter-spacing: -.025em; margin: .75rem 0 1.25rem; max-width: 22ch; }
.priorite .prose { max-width: 44rem; }
.mesures { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .75rem; margin-top: 1.75rem; list-style: none; padding: 0; }
.mesures li { display: flex; gap: .7rem; padding: 1rem 1.1rem; border-radius: 18px; background: var(--blanc); border: 1px solid var(--line); font-size: .9688rem; color: var(--ink-2); }
.mesures .i { color: #fff; background: var(--rose-600); border-radius: 50%; padding: 4px; width: 24px; height: 24px; flex: none; }
.citation { margin: 0 0 clamp(3rem, 2rem + 3vw, 5rem); padding: clamp(1.75rem, 1rem + 3vw, 3rem); border-radius: 28px; background: var(--rose); color: #fff; }
.citation p { font-family: var(--f-serif); font-style: italic; font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.6rem); line-height: 1.2; }
.citation footer { margin-top: 1rem; font-weight: 650; }

.prose { color: var(--ink-2); }
.prose > * + * { margin-top: 1.1em; }
.prose h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); color: var(--ink); margin-top: 2em; }
.prose h3 { font-size: 1.35rem; color: var(--ink); margin-top: 1.8em; }
.prose a { color: var(--rose-600); text-underline-offset: 3px; font-weight: 600; }
.prose strong { color: var(--ink); }
.prose ul { padding-left: 1.2em; }
.prose li + li { margin-top: .4em; }
.prose li::marker { color: var(--rose); }
.prose blockquote { border-left: 4px solid var(--rose); padding-left: 1.2rem; font-family: var(--f-serif); font-style: italic; font-size: 1.4rem; color: var(--ink); line-height: 1.35; }

.article { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.article__cover { border-radius: 28px; overflow: hidden; margin-bottom: 2.5rem; }
.article__cover img { width: 100%; }
.article__cover figcaption { font-size: .875rem; color: var(--ink-3); padding-top: .6rem; }
.article .prose { font-size: 1.125rem; max-width: 42rem; }
/* Premier paragraphe en grand : seulement si la case « accroche » de l'actualité est cochée */
.article .prose--accroche > p:first-child { font-size: 1.3rem; color: var(--ink); line-height: 1.5; }
.chiffres-cles { display: grid; gap: .75rem; position: sticky; top: 100px; }
.chiffre-cle { padding: 1.25rem; border-radius: 20px; background: var(--blanc); border: 1px solid var(--line); }
.chiffre-cle strong { display: block; font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 80; font-size: 2.6rem; line-height: 1; color: var(--rose); letter-spacing: -.03em; }
.chiffre-cle span { font-size: .9375rem; color: var(--ink-2); }
.sources { font-size: .875rem; color: var(--ink-3); }
.sources a { color: var(--ink-2); }

.cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.5rem); }
.carte-info { display: flex; flex-direction: column; gap: .75rem; padding: clamp(1.4rem, 1rem + 1.5vw, 2rem); border-radius: 26px; background: var(--blanc); border: 1px solid var(--line); }
.carte-info__icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: var(--rose-100); color: var(--rose-700); }
.carte-info__icon .i { width: 26px; height: 26px; }
.carte-info h3 { font-size: 1.45rem; }
.carte-info p { color: var(--ink-2); }
.carte-info .btn, .carte-info .link-arrow { margin-top: auto; align-self: flex-start; }
.carte-info--rose { background: var(--rose-600); color: #fff; border-color: var(--rose-600); --focus: var(--vert-950); }
.carte-info--rose p { color: rgba(255, 255, 255, .92); }
.carte-info--rose .carte-info__icon { background: rgba(255, 255, 255, .18); color: #fff; }
.carte-info--vert { background: var(--vert-900); color: var(--creme); border-color: var(--vert-900); --focus: var(--ocre); }
.carte-info--vert p { color: rgba(251, 247, 240, .82); }
.carte-info--vert .carte-info__icon { background: rgba(255, 255, 255, .1); color: var(--ocre); }

.faq { display: grid; gap: .6rem; max-width: 52rem; }
.faq details { background: var(--blanc); border: 1px solid var(--line); border-radius: 18px; transition: border-color .25s; }
.faq details[open] { border-color: var(--ink); }
.faq summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 60px; padding: 1rem 1.25rem;
  font-family: var(--f-display); font-weight: 700; font-size: 1.125rem; cursor: pointer; list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary .i { flex: none; transition: transform .3s var(--ease-out); color: var(--rose-600); }
.faq details[open] summary .i { transform: rotate(45deg); }
.faq details > div { padding: 0 1.25rem 1.25rem; color: var(--ink-2); }

.candidats { display: grid; grid-template-columns: repeat(5, 1fr); gap: .75rem; list-style: none; padding: 0; margin: 0; }
.candidat { padding: 1.1rem; border-radius: 20px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); text-align: center; }
.candidat .avatar { width: 104px; height: 104px; border-radius: 50%; margin: 0 auto .75rem; }
.candidat strong { display: block; font-family: var(--f-display); font-size: 1.1rem; line-height: 1.15; }

.timeline, .timeline[role="list"] { position: relative; display: grid; gap: 1rem; list-style: none; margin: 0; padding: 0 0 0 2.25rem; }
.timeline::before { content: ""; position: absolute; left: 11px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(var(--rose), var(--ocre)); border-radius: 2px; }
.timeline li { position: relative; padding: 1.1rem 1.25rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 18px; }
.timeline li::before { content: ""; position: absolute; left: calc(-2.25rem + 4px); top: 1.35rem; width: 16px; height: 16px; border-radius: 50%; background: var(--creme); border: 3px solid var(--rose); }
.timeline li.is-cle::before { background: var(--rose); }
.timeline__quand { font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rose-600); }
.timeline strong { display: block; font-family: var(--f-display); font-size: 1.2rem; margin-top: .2rem; }
.timeline p { color: var(--ink-2); font-size: .9688rem; margin-top: .2rem; }

.agenda-mois { margin-bottom: 2.5rem; }
.agenda-mois[hidden] { display: none; }
.agenda-mois__titre { display: flex; align-items: baseline; gap: .6rem; font-size: 2rem; font-variation-settings: "wdth" 85; margin-bottom: 1rem; }
.agenda-mois__titre span { font-family: var(--f-serif); font-style: italic; font-weight: 400; color: var(--rose-600); }
.event[hidden], .news-card[hidden] { display: none; }
/* Recherche dans les actualités */
.recherche-actus { display: flex; gap: .5rem; max-width: 36rem; margin-bottom: 1.25rem; padding: .35rem; background: var(--blanc); border: 1.5px solid #CFC5B3; border-radius: 999px; }
.recherche-actus:focus-within { border-color: var(--vert-900); box-shadow: 0 0 0 4px rgba(11, 59, 46, .15); }
.recherche-actus__champ { flex: 1; min-width: 0; min-height: 44px; padding: 0 1rem; border: 0; border-radius: 999px; background: transparent; color: var(--ink); font: inherit; }
.recherche-actus__champ:focus { outline: none; }
.recherche-actus__btn { flex: none; }
@media (max-width: 480px) { .recherche-actus__btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }
.filtres { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-bottom: 2rem; }
.filtres__label { display: inline-flex; align-items: center; gap: .4rem; font-weight: 650; font-size: .9375rem; color: var(--ink-2); }
.grille-actus { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.5rem); }
.pagination { display: flex; justify-content: center; gap: .4rem; margin-top: 3rem; list-style: none; padding: 0; }
.pagination a, .pagination span { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 .5rem; border-radius: 12px; text-decoration: none; font-weight: 650; border: 1px solid var(--line); background: var(--blanc); }
.pagination [aria-current] { background: var(--ink); color: var(--creme); border-color: var(--ink); }

.contact { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.coords { display: grid; gap: 1rem; }
.coord { display: flex; gap: 1rem; padding: 1.2rem; border-radius: 20px; background: var(--blanc); border: 1px solid var(--line); }
.coord .i { width: 24px; height: 24px; color: var(--rose-600); flex: none; margin-top: .15rem; }
.coord strong { display: block; font-family: var(--f-display); font-size: 1.1rem; }
.coord p, .coord a { color: var(--ink-2); }

.cta-band {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem;
  padding: clamp(1.75rem, 1rem + 3vw, 3rem); border-radius: 32px; background: var(--ocre); color: var(--vert-950);
  position: relative; overflow: hidden;
}
.cta-band::after {
  content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%;
  border: 36px solid rgba(255, 255, 255, .18); pointer-events: none;
}
.cta-band > * { position: relative; z-index: 1; }
.cta-band .h3 em { color: var(--vert-950); }
.cta-band p { max-width: 40rem; margin-top: .5rem; }
.projet__contenu .cta-band { margin-top: 1rem; }

.elus-top { padding-bottom: clamp(2rem, 1.5rem + 2vw, 3rem); }
.elus-top[hidden] { display: none; }
.elus-une--page .elu-une { min-height: 440px; }
.filtres--elus { margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); }

.actus-une-page { margin-bottom: clamp(1rem, 2vw, 1.5rem); }
.actus-une-page .news-card--une { grid-template-columns: 1.2fr 1fr; }
.actus-une-page .news-card--une .news-card__media { aspect-ratio: auto; min-height: 360px; }
.actus-une-page .news-card--une .news-card__body { justify-content: center; padding: clamp(1.5rem, 1rem + 2vw, 2.75rem); }

.article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin-bottom: 1.25rem; color: var(--ink-3); font-size: .9375rem; }
.article__titre { max-width: 16ch; }
.article__auteur { margin-top: 2.5rem; font-weight: 650; color: var(--ink-2); }
.article__auteur a { color: var(--rose-600); text-underline-offset: 3px; }
.article__auteur + .partage { margin-top: 1rem; }

.points-vote { display: grid; gap: .6rem; }
.points-vote li { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem 1.1rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 18px; }
.points-vote .i { color: var(--rose-600); margin-top: .2rem; }
.points-vote strong { display: block; font-family: var(--f-display); font-size: 1.1rem; }
.points-vote span { font-size: .9375rem; color: var(--ink-3); }
.points-vote div > span { display: block; }
.points-vote .points-vote__h { display: flex; align-items: center; gap: .4rem; margin-top: .35rem; font-weight: 600; color: var(--ink-2); }
.points-vote__h .i { width: 1em; height: 1em; margin-top: 0; flex: none; }

.page-hero__btns { margin-top: 2rem; }
.page-hero__grid--primaire { align-items: center; }
.page-hero--sombre .countdown-card .countdown { margin-bottom: 0; }

.agir-bloc { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; scroll-margin-top: 140px; }
.agir-bloc--inverse .agir-bloc__visuel { order: -1; }
.agir-bloc__txt .h2 { margin-block: .9rem 1.25rem; }
.agir-bloc__btns { margin-top: 2rem; }
.agir-bloc__visuel {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem;
  aspect-ratio: 1; border-radius: 40px; overflow: hidden; text-align: center; padding: 2rem;
}
.agir-bloc__visuel img { width: 62%; }
.agir-bloc__visuel--rose { background: var(--rose); box-shadow: 0 40px 80px -40px rgba(173, 0, 62, .55); }
.agir-bloc__visuel--vert { background: var(--vert-900); color: var(--ocre); }
.agir-bloc__visuel--ocre { background: var(--ocre); color: var(--vert-950); }
.agir-bloc__visuel::before {
  content: ""; position: absolute; inset: 10%; border-radius: 50%; border: 2px dashed currentColor; opacity: .25;
}
.agir-bloc__visuel--rose::before { color: #fff; }
.agir-bloc__big { font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 75; font-size: clamp(4rem, 2rem + 8vw, 9rem); line-height: .85; letter-spacing: -.05em; }
.agir-bloc__small { font-weight: 650; font-size: 1.125rem; }
.don-exemples { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-top: 1.5rem; }
.don { padding: 1rem; border-radius: 18px; background: var(--blanc); border: 1px solid var(--line); }
.don strong { display: block; font-family: var(--f-display); font-weight: 800; font-size: 1.8rem; line-height: 1; color: var(--rose-600); }
.don span { font-size: .875rem; color: var(--ink-3); }
.legal { max-width: 46rem; }
.legal h2:first-child { margin-top: 0; }

/* Éléments pilotés depuis l'espace admin */
.split--seul { grid-template-columns: 1fr; }
.vide { display: flex; gap: .8rem; align-items: flex-start; padding: 1.25rem 1.4rem; border-radius: 20px; border: 1.5px dashed #CFC5B3; color: var(--ink-2); font-weight: 500; background: rgba(255, 255, 255, .5); }
.vide .i { color: var(--rose-600); margin-top: .15rem; }
.vide[hidden] { display: none; }
.agenda-passes { margin-top: 3rem; border-top: 1px solid var(--line); padding-top: 1.5rem; }
.agenda-passes summary { display: inline-flex; align-items: center; gap: .6rem; min-height: 44px; cursor: pointer; font-family: var(--f-display); font-weight: 700; font-size: 1.2rem; list-style: none; }
.agenda-passes summary::-webkit-details-marker { display: none; }
.agenda-passes summary .i { color: var(--rose-600); transition: transform .3s var(--ease-out); }
.agenda-passes[open] summary .i { transform: rotate(45deg); }
.agenda-passes .events { margin-top: 1rem; opacity: .75; }
.plus { display: flex; justify-content: center; margin-top: 2.5rem; }
.plus[hidden] { display: none; }
.piege { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-ko { padding: 1rem 1.2rem; border-radius: 14px; background: #FDE4E8; color: #8A0020; font-weight: 600; }
.form-ko[hidden] { display: none; }
.newsletter .form-ko { margin-top: 1rem; }
.newsletter__texte { margin-top: 1rem; color: rgba(255, 255, 255, .92); max-width: 34rem; }
.article--seul { grid-template-columns: minmax(0, 1fr); max-width: 50rem; }
.partage { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); font-weight: 650; color: var(--ink-2); }
.partage a { color: var(--rose-600); text-underline-offset: 3px; }
.compte { font-family: var(--f-display); font-weight: 800; color: var(--rose); font-size: max(1.1em, 1.17rem); }
.page-hero__titre .compte { color: inherit; font-family: inherit; }
h1 .compte, h2 .compte, h3 .compte { font-size: inherit; }
.chip__dot--gris { background: #A7ACB3; }
.candidat .candidat__img { width: 104px; height: 104px; border-radius: 50%; margin: 0 auto .75rem; object-fit: cover; }
.elu-une__avatar { position: absolute; inset: 0; width: 100%; height: 100%; }
.erreur { min-height: 60vh; display: flex; align-items: center; }

/* Secrétariat général : le mot + 3 encarts photo */
.sg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(1rem, 2.5vw, 2rem); align-items: stretch; }
.sg__mot {
  margin: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 1.5rem;
  padding: clamp(1.5rem, 1rem + 2.5vw, 3rem); border-radius: 32px; background: var(--vert-900); color: var(--creme); --focus: var(--ocre);
  position: relative; overflow: hidden;
}
.sg__mot::before { content: "«"; position: absolute; right: 1.25rem; top: -1.5rem; font-family: var(--f-serif); font-size: 12rem; line-height: 1; color: rgba(242, 179, 61, .18); pointer-events: none; }
.sg__mot .prose { color: rgba(251, 247, 240, .9); font-family: var(--f-serif); font-style: italic; font-size: clamp(1.2rem, 1rem + .6vw, 1.5rem); line-height: 1.45; position: relative; }
.sg__mot .prose strong { color: #fff; }
.sg__mot footer { font-weight: 700; color: var(--ocre); letter-spacing: .02em; }
.sg__membres { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(.75rem, 1.5vw, 1.25rem); }
.sg__membre { display: flex; flex-direction: column; gap: .25rem; padding: .75rem .75rem 1.1rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 24px; }
.sg__img { width: 100%; aspect-ratio: 3 / 4; height: auto; border-radius: 18px; margin-bottom: .75rem; object-fit: cover; }
.sg__nom { font-family: var(--f-display); font-weight: 750; font-size: 1.15rem; line-height: 1.15; padding-inline: .25rem; }
.sg__role { font-size: .9063rem; color: var(--ink-2); padding-inline: .25rem; }
.sg__section { padding-top: .15rem; }
/* Une seule personne : le mot en grand, la photo à côté */
.sg--seul { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); align-items: center; }
.sg--seul .sg__membres { grid-template-columns: 1fr; max-width: 340px; }
.sg--seul .sg__nom { font-size: 1.3rem; }
.sg--seul .sg__role { font-size: .9375rem; }
.sg--seul .sg__mot { gap: 1.25rem; padding: clamp(1.75rem, 1rem + 3vw, 3.25rem); }
.sg--equipe { align-items: start; }
.sg__gauche { display: grid; gap: .75rem; align-content: start; }
.sg__gauche .membres--encarts { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.sg--seul .sg__mot .prose { font-size: clamp(1.45rem, 1.1rem + 1.1vw, 2.1rem); line-height: 1.35; padding-right: clamp(0rem, 4vw, 4.5rem); }

/* Carte : traits de rappel quand un point a été écarté de sa commune */
.carte__rappels line { stroke: rgba(251, 247, 240, .45); stroke-width: 1.4; stroke-dasharray: 2 3; }
.carte__rappels circle { fill: rgba(251, 247, 240, .75); }
.carte__rappels { transition: opacity .6s 2.4s; }
.js .carte:not(.is-drawn) .carte__rappels { opacity: 0; }

.priorite__lien { margin-top: 1.25rem; font-size: .9688rem; }
.chiffre__n sup { font-size: .42em; vertical-align: top; position: relative; top: .5em; margin-left: .04em; letter-spacing: 0; }
.page-hero--ocre { background: var(--ocre); color: var(--vert-950); border-bottom: 0; }
.page-hero--ocre .ariane { color: rgba(6, 41, 31, .75); }
.page-hero--ocre .eyebrow { color: var(--vert-950); }
.page-hero--ocre .page-hero__titre em { color: var(--rose-700); }
.page-hero--ocre .lead { color: var(--vert-950); }
.page-hero--ocre .page-hero__deco { -webkit-text-stroke-color: rgba(6, 41, 31, .12); }
.bloc__head--haut { align-items: start; }
.membres--equipe { grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); }
.footer__bottom { margin-top: clamp(2.5rem, 2rem + 2vw, 4rem); }

/* Pages composées de blocs (éditeur visuel) ------------------------------------ */
.bloc-c + .bloc-c > .bloc { border-top: 1px solid var(--line); }
/* Fond « Aucun, sans filet » : même rythme que le filet, sans trait ni double espace */
.bloc-c.bloc-c--serre > .bloc { border-top: 0; }
.bloc-c--serre + .bloc-c--serre > .bloc { padding-top: 0; }
.page-hero + .bloc-c > .bloc, .page-hero + .subnav + .bloc-c > .bloc { padding-top: clamp(2.5rem, 1.5rem + 3vw, 4rem); }
.bloc[id], .section[id], .demi[id] { scroll-margin-top: 56px; }
.engage__cartes { display: grid; gap: 1rem; }
.engage__cartes:empty { display: none; }
.drop--simple { grid-template-columns: 1fr; width: min(400px, 90vw); }
.projet--seul { grid-template-columns: minmax(0, 1fr); }
.projet--seul .projet__contenu { max-width: 52rem; }
.annonce--rose { background: var(--rose-600); }
.annonce--rose .annonce__badge { background: #fff; color: var(--rose-700); }
.annonce--rose .annonce__txt strong, .annonce--rose .annonce__cd { color: #fff; }
.annonce--ocre { background: var(--ocre); color: var(--vert-950); --focus: var(--vert-950); }
.annonce--ocre .annonce__badge { background: var(--vert-950); color: var(--ocre); }
.annonce--ocre .annonce__txt strong, .annonce--ocre .annonce__cd { color: var(--vert-950); }
.annonce + .annonce { border-top: 1px solid rgba(255, 255, 255, .12); }
.citation--vert { background: var(--vert-900); color: var(--creme); }
.citation--ocre { background: var(--ocre); color: var(--vert-950); }
.section > .container > .citation, .bloc > .citation { margin-bottom: 0; }
.agir-bloc__visuel--photo { padding: 0; background: var(--creme-2); }
.agir-bloc__visuel--photo::before { display: none; }
.agir-bloc__visuel--photo img { width: 100%; height: 100%; object-fit: cover; }
.candidat__role { display: block; margin-top: .25rem; font-size: .875rem; opacity: .75; }
.figure { margin: 0; }
.figure img { width: 100%; border-radius: 28px; }
.figure--texte { max-width: 46rem; }
.figure figcaption { font-size: .875rem; color: var(--ink-3); padding-top: .6rem; }
.video { margin: 0; max-width: 60rem; }
.video__cadre { position: relative; aspect-ratio: 16 / 9; border-radius: 24px; overflow: hidden; background: var(--vert-950); }
.video__cadre iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video figcaption { font-size: .875rem; color: var(--ink-3); padding-top: .6rem; }
/* Blocs sur fond vert foncé */
.on-dark .bloc__head p, .on-dark .section__lead, .on-dark > .container > p { color: rgba(251, 247, 240, .8); }
.on-dark .prose { color: rgba(251, 247, 240, .85); }
.on-dark .prose strong, .on-dark .prose h2, .on-dark .prose h3 { color: #fff; }
.on-dark .prose a { color: var(--ocre); }
.on-dark .faq details { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .14); }
.on-dark .faq details[open] { border-color: var(--ocre); }
.on-dark .faq details > div, .on-dark .timeline p { color: rgba(251, 247, 240, .82); }
.on-dark .membre, .on-dark .membre-c { color: var(--ink); }

.modifier-page {
  position: fixed; right: 16px; bottom: 16px; z-index: 60; display: inline-flex; align-items: center; gap: .4rem;
  padding: .7rem 1.1rem; border-radius: 999px; background: var(--vert-950); color: #fff; font-weight: 650; font-size: .9375rem;
  text-decoration: none; box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5); --focus: var(--ocre);
}
.modifier-page::before { content: "✎"; }
.modifier-page:hover { background: var(--rose-600); }
@media print { .modifier-page { display: none; } }
/* Sur téléphone, l'éditeur ne sert qu'à écrire une actualité, ajouter un événement et voir les stats (admin/editeur.css) */
@media (max-width: 700px) { .modifier-page { display: none; } }

/* 10. Formulaires, newsletter, pied de page --------------------------------- */
.form { display: grid; gap: 1.1rem; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); background: var(--blanc); border: 1px solid var(--line); border-radius: 28px; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.field { display: grid; gap: .4rem; align-content: start; }
.field label, .field legend { font-weight: 650; font-size: .9375rem; }
.field .req { color: var(--rose-600); }
.field input, .field select, .field textarea {
  width: 100%; min-height: 50px; padding: .75rem 1rem; border: 1.5px solid #CFC5B3; border-radius: 14px;
  background: var(--blanc); color: var(--ink); transition: border-color .2s, box-shadow .2s;
}
.field textarea { min-height: 160px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--vert-900); box-shadow: 0 0 0 4px rgba(11, 59, 46, .15); }
.field.has-error input, .field.has-error textarea, .field.has-error select { border-color: #C4002F; }
.field__aide { font-size: .875rem; color: var(--ink-3); }
.field__erreur { font-size: .875rem; font-weight: 600; color: #B0002A; }
.field__erreur:empty { display: none; }
.check { display: flex; gap: .7rem; align-items: flex-start; font-size: .9375rem; color: var(--ink-2); }
.check input { width: 22px; height: 22px; min-height: 0; margin-top: .15rem; accent-color: var(--rose-600); flex: none; }
.check .req { color: var(--rose-600); }
.check .field__aide { margin-top: .3rem; }
.check .field__aide a { color: var(--rose-600); text-underline-offset: 3px; font-weight: 600; }
.form-ok { display: flex; align-items: center; gap: .6rem; padding: 1rem 1.2rem; border-radius: 14px; background: var(--vert-100); color: var(--vert-900); font-weight: 600; }
.form-ok[hidden] { display: none; }
/* Message envoyé : le message arrive en souplesse, la coche se dessine dans sa pastille */
.form-ok .i { flex: none; width: 1.75rem; height: 1.75rem; padding: .3rem; border: 2px solid currentColor; border-radius: 50%; }
.form-ok.is-anime { animation: envoi-ok .5s var(--ease-spring) both; }
.form-ok.is-anime .i { animation: envoi-pastille .45s var(--ease-spring) .1s both; }
.form-ok.is-anime .i * { stroke-dasharray: 30; stroke-dashoffset: 30; animation: envoi-coche .4s var(--ease-out) .35s forwards; }
.btn.is-envoye .i { animation: envoi-avion 1.2s var(--ease-out); }
@keyframes envoi-ok { from { opacity: 0; transform: translateY(10px) scale(.97); } }
@keyframes envoi-pastille { from { transform: scale(0); } }
@keyframes envoi-coche { to { stroke-dashoffset: 0; } }
@keyframes envoi-avion {
  0% { transform: none; }
  40% { transform: translate(26px, -18px) rotate(-12deg); opacity: 0; }
  41% { transform: translate(-18px, 10px); opacity: 0; }
  100% { transform: none; opacity: 1; }
}

.newsletter { background: var(--rose-600); color: #fff; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem); position: relative; overflow: hidden; --focus: var(--vert-950); }
.newsletter::before {
  content: ""; position: absolute; right: -8%; top: -60%; width: 46%; aspect-ratio: 1; border-radius: 50%;
  border: 60px solid rgba(255, 255, 255, .07); pointer-events: none;
}
.newsletter__in { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem clamp(2rem, 6vw, 6rem); align-items: center; }
.newsletter .eyebrow { color: #fff; margin-bottom: 1rem; }
.newsletter__titre { font-size: clamp(1.9rem, 1.3rem + 2.2vw, 3.1rem); font-variation-settings: "wdth" 85; letter-spacing: -.025em; line-height: 1; }
.newsletter__titre em { color: #fff; opacity: .95; }
.newsletter label { color: #fff; }
.field__row { display: flex; gap: .5rem; padding: .4rem; background: #fff; border-radius: 999px; }
.field__row input { border: 0; border-radius: 999px; min-height: 52px; background: transparent; }
.field__row input:focus { box-shadow: none; outline: none; }
.field__row:focus-within { box-shadow: 0 0 0 3px var(--rose-600), 0 0 0 6px #fff; }
.field__row .btn { flex: none; --b-bg: var(--vert-950); }
.field__row .btn:hover { --b-bg: var(--ink); box-shadow: none; }
.newsletter .field__aide { color: rgba(255, 255, 255, .9); }
.newsletter .field__aide a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.newsletter .field__erreur { color: #fff; background: rgba(0, 0, 0, .2); padding: .4rem .8rem; border-radius: 10px; }
.newsletter .form-ok { margin-top: 1rem; }

.footer { background: var(--vert-950); color: var(--creme); padding-top: clamp(3.5rem, 2.5rem + 4vw, 6rem); overflow: hidden; }
.footer__top { display: grid; grid-template-columns: .9fr 1.6fr; gap: 3rem; }
.footer__brand img { height: 64px; width: auto; margin-bottom: 1.5rem; }
.footer__brand address { font-style: normal; color: rgba(251, 247, 240, .78); line-height: 1.8; }
.footer__brand address a { text-underline-offset: 3px; }
.footer__brand address a:hover { color: var(--rose-300); }
.footer__nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.footer__h { font-family: var(--f-body); font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ocre); margin-bottom: 1rem; }
.footer__nav ul { display: grid; gap: .15rem; }
.footer__nav a { display: inline-flex; align-items: center; gap: .35em; min-height: 36px; text-decoration: none; color: rgba(251, 247, 240, .85); transition: color .2s; }
.footer__nav a .i { width: .9em; height: .9em; opacity: .6; }
.footer__nav a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--rose); text-underline-offset: 4px; }
.socials { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.social { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid rgba(251, 247, 240, .22); color: var(--creme); transition: background-color .2s, color .2s, border-color .2s, transform .3s var(--ease-spring); }
.social .i { width: 19px; height: 19px; }
.social:hover { background: var(--rose); border-color: var(--rose); color: #fff; transform: translateY(-3px); }
.socials--dark { margin-top: 0; }
.socials--dark .social { border-color: var(--line); color: var(--ink); background: var(--blanc); }
.socials--dark .social:hover { background: var(--rose-600); border-color: var(--rose-600); color: #fff; }
.footer__giant {
  margin-top: clamp(2.5rem, 2rem + 3vw, 4.5rem); font-family: var(--f-display); font-weight: 800; font-variation-settings: "wdth" 75;
  font-size: clamp(3.5rem, 13.8vw, 12.5rem); line-height: .78; letter-spacing: -.055em; white-space: nowrap;
  background: linear-gradient(90deg, var(--rose) 0%, var(--rose-300) 35%, var(--ocre) 70%, var(--eau) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .95; user-select: none;
  transform: translateY(.08em);
}
.footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 2rem; padding-block: 1.5rem; border-top: 1px solid rgba(255, 255, 255, .1); font-size: .875rem; color: rgba(251, 247, 240, .7); position: relative; }
.footer__bottom ul { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.footer__bottom a { text-underline-offset: 3px; }
.footer__bottom a:hover { color: #fff; }

/* Responsive ----------------------------------------------------------------- */
@media (max-width: 1080px) {
  .hero__grid, .primaire-band__grid, .split, .newsletter__in, .contact, .article { grid-template-columns: 1fr; }
  .hero__art { max-width: 560px; width: 100%; margin-inline: auto; }
  .carte { grid-template-columns: 1fr; }
  .actus-home { grid-template-columns: 1fr; }
  .elus-une { grid-template-columns: 1fr; }
  .footer__top { grid-template-columns: 1fr; }
  .grille-actus, .cards-3 { grid-template-columns: repeat(2, 1fr); }
  .candidats { grid-template-columns: repeat(3, 1fr); }
  .projet { grid-template-columns: 1fr; }
  .toc { position: static; display: flex; flex-wrap: wrap; }
  .toc p { width: 100%; }
  .chiffres-cles { position: static; grid-template-columns: repeat(3, 1fr); }
  .page-hero__grid { grid-template-columns: 1fr; }
  .page-hero__aside { justify-self: start; }
  .sg { grid-template-columns: 1fr; }
  .agir-bloc { grid-template-columns: 1fr; }
  .agir-bloc--inverse .agir-bloc__visuel { order: 0; }
  .agir-bloc__visuel { max-width: 420px; width: 100%; }
  .actus-une-page .news-card--une { grid-template-columns: 1fr; }
  .actus-une-page .news-card--une .news-card__media { min-height: 0; aspect-ratio: 16 / 10; }
}
@media (max-width: 760px) {
  :root { --header-h: 68px; }
  body { font-size: 1rem; }
  .annonce__in { justify-content: flex-start; text-align: left; }
  .header__logo img, .header.is-scrolled .header__logo img { height: 40px; }
  .header.is-scrolled .header__in { height: var(--header-h); }
  .chiffres__grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem 0; }
  .chiffre:nth-child(3) { border-left: 0; padding-left: 0; }
  .actus-home__side .news-card { grid-template-columns: 1fr; }
  .actus-home__side .news-card__media { min-height: 0; aspect-ratio: 16 / 9; }
  .elu-une { grid-template-columns: 1fr; }
  .elu-une__photo { aspect-ratio: 4 / 3.4; }
  .elus-groupe__head, .bloc__head { grid-template-columns: 1fr; }
  .instances { grid-template-columns: 1fr; }
  .grille-actus, .cards-3 { grid-template-columns: 1fr; }
  .candidats { grid-template-columns: repeat(2, 1fr); }
  .ps-card { grid-template-columns: 1fr; }
  .ps-card__photo { min-height: 0; aspect-ratio: 1; }
  .footer__nav { grid-template-columns: repeat(2, 1fr); }
  .form__row { grid-template-columns: 1fr; }
  .field__row { flex-direction: column; border-radius: 22px; }
  .field__row .btn { width: 100%; }
  .chiffres-cles { grid-template-columns: 1fr; }
  .countdown { gap: .4rem; }
  .sticker--1 { left: -2%; }
  .sticker--2 { right: -2%; }
  .badge-rond { right: -1%; }
  .event { grid-template-columns: 64px 1fr; gap: .9rem; }
  .carte__legende { position: static; margin-top: 1rem; }
  .pin__label { font-size: .75rem; }
  .pin { width: 28px; height: 28px; margin: -14px 0 0 -14px; }
  .pin__dot { width: 9px; height: 9px; box-shadow: 0 0 0 2px var(--vert-950), 0 0 0 3.5px rgba(251, 247, 240, .9); }
  .pin__dot::after { inset: -4px; }
  .carte__tlabels { display: none; }
  /* Sur téléphone, les points prennent toute la place : pas de noms de rivières (la légende reste) */
  .carte__labels { display: none; }
  .carte__clabel { display: none; }
  .carte__river { stroke-width: 6; }
  .pin--etiquette .pin__label { opacity: 0; }
  .pin--etiquette.pin--cle .pin__label { opacity: 1; }
  .hero__cta .btn { flex: 1 1 100%; }
  .don-exemples { grid-template-columns: 1fr; }
  /* Page Agir : pas de grand logo décoratif sous le texte, sur téléphone */
  .agir-bloc__visuel:not(.agir-bloc__visuel--photo) { display: none; }
  /* Bas d'une actualité : deux autres actualités, en petit, côte à côte */
  .grille-actus--autres { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .grille-actus--autres .news-card:nth-child(n+3) { display: none; }
  .grille-actus--autres .news-card__body { gap: .4rem; padding: .75rem .8rem .9rem; }
  .grille-actus--autres .news-card__meta { font-size: .75rem; gap: .35rem; }
  .grille-actus--autres .news-card__meta .tag { font-size: .6875rem; }
  .grille-actus--autres .news-card__titre { font-size: .9375rem; line-height: 1.2; }
  .grille-actus--autres .news-card__chapo, .grille-actus--autres .news-card__more { display: none; }
  /* Accueil sur téléphone : seulement l'actualité à la une, sans la carte rose ni la pastille 71 */
  .hero__art, .actus-home__side { display: none; }
  /* Équipe du quotidien : 3 par ligne, comme le secrétariat général */
  .membres--cartes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
  .membres--cartes .membre { gap: .25rem; padding: .5rem .5rem .8rem; border-radius: 18px; }
  .membres--cartes .membre__img { aspect-ratio: 3 / 4; border-radius: 18px; margin-bottom: .75rem; }
  .membres--cartes .membre__nom { font-size: .95rem; }
  .membres--cartes .membre__role { font-size: .8125rem; }
  .sg__membres { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; }
  .sg__membre { padding: .5rem .5rem .8rem; border-radius: 18px; }
  .sg__nom { font-size: .95rem; }
  .sg__role { font-size: .8125rem; }
  .elus-une--page .elu-une { min-height: 0; }
  /* Accueil et page Élus sur téléphone : les deux élus côte à côte, en cartes réduites */
  .elus-une { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .elus-une .elu-une { min-height: 0; border-radius: 20px; grid-template-rows: auto 1fr; }
  .elus-une .elu-une__photo { aspect-ratio: 3 / 3.4; }
  .elus-une .elu-une__body { gap: .35rem; padding: .85rem .85rem 1rem 1.1rem; justify-content: flex-start; }
  .elus-une .elu-une__mandat { font-size: .6875rem; letter-spacing: .06em; }
  .elus-une .elu-une__nom { font-size: 1.35rem; }
  .elus-une:not(.elus-une--page) .elu-une__bio { display: none; }
  .elus-une--page .elu-une__bio { font-size: .8125rem; line-height: 1.4; }
  .elus-une .elu-une::before { width: 4px; }
}

/* 11. Animations -------------------------------------------------------------- */
@keyframes pulse { 0% { transform: scale(.6); opacity: .9; } 80%, 100% { transform: scale(1.9); opacity: 0; } }
@keyframes tourne { to { transform: rotate(360deg); } }
@keyframes tourne-entree { from { transform: rotate(-120deg); } }
@keyframes defile { to { transform: translateX(-50%); } }
@keyframes fiche { from { opacity: 0; transform: translateY(10px); } }
@keyframes monte { from { transform: translateY(105%); } }
@keyframes trace { from { stroke-dashoffset: 1; } }
@keyframes pop { from { transform: scale(0); } }
@keyframes tombe { from { opacity: 0; transform: translateY(-30px) scale(.8); } }

/* Apparition au défilement (seulement si JS actif) */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease-out), transform .9s var(--ease-out); transition-delay: var(--d, 0s); }
.js .reveal.is-in { opacity: 1; transform: none; }

/* Hero : entrée */
.js .hero__line > span { animation: monte 1s var(--ease-out) both; }
.js .hero__line:nth-child(2) > span { animation-delay: .1s; }
.js .hero__line:nth-child(3) > span { animation-delay: .2s; }
.js .riviere__vague path { animation: trace 1.2s var(--ease-out) .9s both; }
.js .riviere--2 .riviere__vague path { animation-delay: 1.15s; }
.js .hero__lead, .js .hero__cta, .js .hero__eyebrow { animation: fiche .9s var(--ease-out) both; }
.js .hero__eyebrow { animation-delay: .05s; }
.js .hero__lead { animation-delay: .35s; }
.js .hero__cta { animation-delay: .5s; }
.js .hero-art { animation: fiche 1s var(--ease-out) .15s both; }
.js .h-outline { animation: trace 2.2s var(--ease-out) .4s both; }
.js .h-river { animation: trace 1.8s var(--ease-out) var(--d) both; }
.js .h-canal { animation: trace 1.6s var(--ease-out) 1.4s both; }
.js .h-dot { animation: pop .5s var(--ease-spring) both; animation-delay: calc(1.6s + var(--i) * 50ms); }
.js .sticker { animation: tombe .7s var(--ease-spring) both; }
.js .sticker--1 { animation-delay: 1.3s; }
.js .sticker--2 { animation-delay: 1.5s; }
.js .sticker--3 { animation-delay: 1.7s; }
.js .hero-art__rose { animation: fiche 1s var(--ease-out) 1.1s both; }

/* Carte : tracé déclenché quand elle entre à l'écran */
.js .carte:not(.is-drawn) .carte__outline,
.js .carte:not(.is-drawn) .carte__river,
.js .carte:not(.is-drawn) .carte__canal-mask { stroke-dashoffset: 1; }
.js .carte:not(.is-drawn) .carte__arrs,
.js .carte:not(.is-drawn) .carte__tlabels,
.js .carte:not(.is-drawn) .carte__labels { opacity: 0; }
.js .carte:not(.is-drawn) .pin { opacity: 0; transform: scale(.2); }
.carte__outline { transition: stroke-dashoffset 2s var(--ease-out); }
.carte__arrs { transition: opacity 1s .9s; }
.carte__tlabels { transition: opacity 1s 2.2s; }
.carte__river { transition: stroke-dashoffset 1.8s var(--ease-out) .8s; }
.carte__river--saone { transition-delay: 1.1s; }
.carte__river--doubs { transition-delay: 1.6s; }
.carte__river--arroux { transition-delay: 1.7s; }
.carte__canal-mask { transition: stroke-dashoffset 1.6s var(--ease-out) 1.9s; }
.carte__labels { transition: opacity .8s 2.5s; }
.carte.is-drawn .pin { transition: opacity .4s calc(2.3s + var(--i) * 60ms), transform .6s var(--ease-spring) calc(2.3s + var(--i) * 60ms); }
.carte.is-ready .pin { transition: opacity .4s, transform .4s var(--ease-spring); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .js .reveal { opacity: 1; transform: none; }
  .bandeau__track { animation: none; flex-wrap: wrap; width: auto; }
  .pin__dot::after, .pulse-dot::after { display: none; }
  .bandeau__pause { display: none; }
}

/* Défilement doux uniquement si l'utilisateur ne demande pas moins d'animations */
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
.page-hero + .section, .page-hero + .subnav + .container .bloc:first-child { padding-top: clamp(2.5rem, 1.5rem + 3vw, 4rem); }

/* Le mot avec une seule photo et des encarts : sur petit écran, le texte, puis la photo, puis les encarts */
@media (max-width: 1080px) {
  .sg--equipe .sg__gauche { display: contents; }
  .sg--equipe .sg__mot { order: 1; }
  .sg--equipe .sg__membres { order: 2; }
  .sg--equipe .membres--encarts { order: 3; }
}

/* 12. Accessibilité : boutons pause, plan du site ------------------------------ */
/* Bouton « Mettre en pause » des contenus qui bougent seuls (compte à rebours, bandeau défilant) */
.pause {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 36px; padding: .3rem .85rem;
  font-size: .8125rem; font-weight: 650; color: inherit; background: transparent;
  border: 1.5px solid currentColor; border-radius: 999px;
}
.pause[hidden] { display: none; }
.pause .i { width: .95em; height: .95em; }
.pause__ico { display: inline-flex; }
.pause__ico--play, .pause.is-paused .pause__ico--pause { display: none; }
.pause.is-paused .pause__ico--play { display: inline-flex; }
.pause:hover { background: rgba(255, 255, 255, .1); }
.countdown__pause { margin: -1rem 0 1.75rem; }
.page-hero .countdown__pause { margin-bottom: 0; margin-top: 1rem; }
.bandeau__pause { width: 40px; height: 40px; padding: 0; justify-content: center; background: var(--vert-900); color: var(--creme); box-shadow: -22px 0 18px 4px var(--vert-900); }
.bandeau__pause:hover { background: var(--vert-800); }

/* Plan du site */
.plan { max-width: 56rem; }
.plan ul { list-style: none; margin: 0; padding: 0; }
.plan__liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 1rem; align-items: start; }
.plan__liste > li { padding: 1.15rem 1.3rem; background: var(--blanc); border: 1px solid var(--line); border-radius: 18px; }
.plan__liste > li > a, .plan__dossier { font-family: var(--f-display); font-weight: 750; font-size: 1.2rem; color: var(--ink); }
.plan a { text-decoration: underline; text-decoration-color: var(--rose); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.plan a:hover { text-decoration-color: currentColor; }
.plan li ul { display: grid; gap: .45rem; margin-top: .75rem; padding-left: 1rem; border-left: 2px solid var(--rose-100); }
.plan li li a { color: var(--ink-2); font-weight: 550; }