/* =========================================================
   NuméNantes V4
   Structure et accessibilité de la V3, charte graphique de la V2.
   Encre marine #083463 · Émeraude #09958C · Ambre lumière #F4A81D
   Display : Bricolage Grotesque · Texte : Hanken Grotesk
   Polices auto-hébergées (licence OFL) : aucun appel externe.
   Mobile first · cibles tactiles 44px · aucune animation au scroll.
   ========================================================= */

/* ---------- Polices auto-hébergées ---------- */
@font-face{
  font-family:'Bricolage Grotesque';
  src:url('../fonts/bricolage-grotesque-latin.woff2') format('woff2');
  font-weight:400 800; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Hanken Grotesk';
  src:url('../fonts/hanken-grotesk-latin.woff2') format('woff2');
  font-weight:100 900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Hanken Grotesk';
  src:url('../fonts/hanken-grotesk-latin-italic.woff2') format('woff2');
  font-weight:100 900; font-style:italic; font-display:swap;
}

:root{
  /* Marque (charte V2) */
  --navy:#083463;
  --navy-700:#0a2a4f;
  --navy-900:#061f3c;
  --navy-deep:#061f3c;
  --teal:#09958c;
  --teal-600:#0a857d;
  --teal-300:#5fc4bb;
  --amber:#f4a81d;
  --amber-600:#e0950a;
  --coral:#ff6b5e;
  --ligne-verte:#7ed957;

  /* Surfaces papier crème */
  --paper:#f7f3ea;
  --paper2:#fcfaf4;
  --paper3:#f1ebdd;
  --card:#ffffff;
  --ink:#10243d;
  --ink-soft:#46596f;
  --line:#e6ddcb;
  --line-soft:#efe8da;

  /* États (libellé + icône, jamais la couleur seule) */
  --ok-bg:#dff1ea; --ok-fg:#0a6b58;
  --wip-bg:#fdeed6; --wip-fg:#8a5510;

  /* Typographie */
  --ff-display:'Bricolage Grotesque',-apple-system,system-ui,sans-serif;
  --ff-body:'Hanken Grotesk',-apple-system,system-ui,sans-serif;

  /* Échelle (mobile first) */
  --fs-900:2.1rem;
  --fs-700:1.55rem;
  --fs-500:1.2rem;
  --fs-400:1.0625rem;
  --fs-300:.95rem;
  --fs-200:.83rem;

  --s1:.5rem; --s2:.75rem; --s3:1rem; --s4:1.5rem; --s5:2rem; --s6:3rem; --s7:4.5rem;

  --radius:18px;
  --radius-lg:28px;
  --radius-sm:12px;
  --maxw:1240px;
  --shadow-sm:0 2px 8px rgba(8,52,99,.06);
  --shadow:0 18px 50px -22px rgba(8,52,99,.45);
  --shadow-card:0 24px 60px -30px rgba(8,52,99,.5);
  --tap:44px;
}

@media (min-width:780px){
  :root{ --fs-900:3.4rem; --fs-700:2.2rem; --fs-500:1.35rem; --fs-400:1.1rem; }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--ff-body);
  font-size:var(--fs-400);
  line-height:1.62;
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--ff-display);font-weight:700;line-height:1.08;letter-spacing:-.02em;color:var(--navy);margin:0 0 .5em}
h1{font-size:var(--fs-900);letter-spacing:-.03em}
h2{font-size:var(--fs-700)}
h3{font-size:var(--fs-500)}
p{margin:0 0 1.1rem}
a{color:var(--teal)}
.prose a,a.inline{color:var(--teal-600);text-decoration:underline;text-underline-offset:2px}
/* Les composants cliquables (boutons, cartes outil, canaux) gardent leur propre
   traitement visuel, même à l'intérieur d'un bloc de prose. */
.prose a.btn,.prose a.tool,.prose a.channel,.prose a.axe,.prose a.qcard,.prose a.linkarrow{text-decoration:none}
.prose a.tool:hover .tool__txt b{text-decoration:underline}
strong{color:var(--navy)}
button{font-family:inherit}
::selection{background:var(--amber);color:var(--navy-900)}
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(20px,5vw,64px)}

/* Accessibilité */
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:4px}
.skip-link{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:.7rem 1rem;z-index:200;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- En-tête / navigation ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(247,243,234,.94);
  backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:var(--s3);max-width:var(--maxw);margin-inline:auto;
  padding:.6rem clamp(20px,5vw,64px);min-height:64px}
.brand{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--navy);
  font-family:var(--ff-display);font-weight:800;font-size:1.25rem;letter-spacing:-.03em}
.brand img{width:34px;height:34px}
.brand b{font-weight:800}
.brand .accent{color:var(--teal)}
.nav{display:none}
.nav a{color:var(--ink);text-decoration:none;padding:.5rem .15rem;font-size:var(--fs-300);font-weight:600;
  border-bottom:2px solid transparent}
.nav a:hover{color:var(--navy)}
.nav a[aria-current="page"]{color:var(--navy);border-bottom-color:var(--amber)}

/* Menus déroulants Outils / Accompagnements :
   un lien d'accès direct à la rubrique + un chevron qui ouvre la liste */
.has-menu{position:relative;display:inline-flex;align-items:center;gap:.1rem}
.has-menu>a{padding-right:.1rem}
.menu-btn{font:inherit;font-size:var(--fs-300);font-weight:600;color:var(--ink-soft);background:none;border:0;
  cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;padding:.5rem .2rem;border-bottom:2px solid transparent}
.menu-btn:hover{color:var(--navy)}
.menu-btn[aria-expanded="true"]{color:var(--navy)}
.menu-btn[aria-current]{color:var(--navy);border-bottom-color:var(--amber)}
.menu-btn .chev,.multi .chev{width:16px;height:16px;flex:none;transition:transform .15s}
.menu-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.menu-panel{position:absolute;top:calc(100% + 8px);left:0;min-width:268px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:.4rem;display:none}
.menu-panel.open{display:block}
.menu-panel a{display:block;padding:.55rem .7rem;border-radius:var(--radius-sm);text-decoration:none;
  color:var(--ink);font-size:var(--fs-300)}
.menu-panel a:hover,.menu-panel a:focus{background:var(--paper3);color:var(--navy)}
.menu-panel .sep{height:1px;background:var(--line);margin:.35rem .4rem}

/* Actions du bandeau : « Actualités » et « Adhérer », poussées à droite.
   Le bouton Actualités n'apparaît qu'à partir de 560 px : en dessous, la barre
   n'a place que pour la marque, « Adhérer » et le burger (la rubrique reste
   accessible dans le menu burger). */
.bar-actions{margin-left:auto;display:flex;align-items:center;gap:.5rem}
/* Sélecteur en deux niveaux : la règle générique .btn (display:inline-flex) est
   déclarée plus bas dans la feuille et l'emporterait sur un simple .btn-news. */
.bar-actions .btn-news{display:none;padding:.6rem 1rem}
.bar-actions .btn-news[aria-current="page"]{border-color:var(--amber);color:var(--navy)}
@media(min-width:560px){.bar-actions .btn-news{display:inline-flex}}
.burger{margin-left:.35rem;width:var(--tap);height:var(--tap);display:inline-flex;flex-direction:column;
  justify-content:center;gap:5px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer}
.burger span{height:2px;width:22px;background:var(--navy);margin-inline:auto;transition:.2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Tiroir mobile : toutes les rubriques */
.mobile-nav{display:none;border-top:1px solid var(--line);background:var(--paper2);
  padding:var(--s2) clamp(20px,5vw,64px) var(--s4);max-height:calc(100vh - 64px);overflow-y:auto}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:.85rem .25rem;text-decoration:none;color:var(--ink);
  font-size:1.05rem;font-weight:600;border-bottom:1px solid var(--line);min-height:var(--tap)}
.mobile-nav a[aria-current="page"]{color:var(--navy)}
.mobile-nav a[aria-current="page"]::after{content:" •";color:var(--amber)}
.mobile-nav .grp{font-family:var(--ff-body);font-size:var(--fs-200);text-transform:uppercase;letter-spacing:.14em;
  color:var(--teal);font-weight:700;margin:var(--s3) 0 0;padding:.4rem .25rem;border:0}
.mobile-nav .sub{padding-left:1rem;font-weight:500;font-size:1rem}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5rem;min-height:var(--tap);padding:.75rem 1.2rem;
  border-radius:100px;font:inherit;font-weight:700;font-size:var(--fs-300);text-decoration:none;
  border:1.5px solid transparent;cursor:pointer;transition:background .18s,border-color .18s,color .18s,transform .18s}
.btn:hover{transform:translateY(-1px)}
.btn--primary{background:var(--navy);color:#fff}
.btn--primary:hover{background:var(--navy-900)}
.btn--navy{background:var(--navy);color:#fff}
.btn--cta{background:var(--amber);color:var(--navy-900)}
.btn--cta:hover{background:var(--amber-600)}
.btn--ghost{background:var(--card);color:var(--navy);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--navy);background:var(--paper3)}
.btn--white{background:#fff;color:var(--navy);border-color:rgba(255,255,255,.6)}
.btn--lg{padding:.95rem 1.5rem;font-size:var(--fs-400)}
.btn .arrow{width:18px;height:18px;flex:none}
/* Toutes les flèches et icônes en ligne gardent une taille fixe,
   quel que soit leur conteneur (cartes, liens, listes). */
.arrow,.ext{width:18px;height:18px;flex:none}
.more .arrow,.more .ext,.linkarrow .arrow,.linkarrow .ext{width:16px;height:16px}
.eyebrow svg{width:18px;height:18px;flex:none}

/* ---------- Sections et utilitaires ---------- */
.section{padding-block:var(--s7)}
.section--tight{padding-block:var(--s6)}
.bg-paper2{background:var(--paper2)}
.bg-paper3{background:var(--paper3)}
.bg-navy{background:var(--navy);color:#dfe9f3}
.bg-navy h1,.bg-navy h2,.bg-navy h3{color:#fff}
.center{text-align:center}
.mt-1{margin-top:var(--s3)} .mt-2{margin-top:var(--s4)} .mt-3{margin-top:var(--s6)}
.mb-1{margin-bottom:var(--s3)}
.lead{font-size:var(--fs-500);color:var(--ink-soft);line-height:1.5}
.eyebrow{
  display:inline-flex;align-items:center;gap:.6em;font-family:var(--ff-body);font-weight:700;
  text-transform:uppercase;letter-spacing:.2em;font-size:.74rem;color:var(--teal);margin-bottom:1rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--amber);display:inline-block;flex:none}
.measure{max-width:62ch}
.measure-narrow{max-width:46ch}
.flex-between{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:flex-end;justify-content:space-between}
.linkarrow{display:inline-flex;align-items:center;gap:.4rem;color:var(--teal-600);font-weight:700;
  text-decoration:none;font-size:var(--fs-300)}
.linkarrow:hover{text-decoration:underline}

/* ---------- Fil d'Ariane et titre de page ---------- */
.page-head{background:var(--card);border-bottom:1px solid var(--line);padding-block:var(--s5)}
.crumb{font-size:var(--fs-200);color:var(--ink-soft);margin-bottom:.6rem}
.crumb a{color:var(--ink-soft);text-decoration:underline;text-underline-offset:2px}
.crumb a:hover{color:var(--navy)}
.crumb [aria-current]{color:var(--ink)}
.page-head .ico-page{width:56px;height:56px;border-radius:16px;background:var(--paper3);border:1px solid var(--line);
  display:grid;place-items:center;font-size:1.7rem;margin-bottom:var(--s3)}
.page-head h1{margin-bottom:.3rem}
.page-head .lead{max-width:60ch}

/* ---------- Accueil : héros image (V2) ---------- */
.hero{position:relative;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy-900);
  min-height:min(92svh,760px)}
.hero__media{position:absolute;inset:0}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero__media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(6,31,60,.58) 0%,rgba(6,31,60,.24) 35%,rgba(6,31,60,.82) 100%)}
.hero__grain{position:absolute;inset:0;opacity:.5;mix-blend-mode:soft-light;
  background-image:radial-gradient(rgba(255,255,255,.18) 1px,transparent 1.4px);background-size:4px 4px}
.hero__inner{position:relative;z-index:2;width:100%;padding-bottom:clamp(40px,7vh,96px);padding-top:clamp(84px,14vh,150px)}
.hero__tag{
  display:inline-flex;align-items:center;gap:.6em;color:#fff;font-weight:700;
  font-family:var(--ff-display);background:rgba(9,149,140,.9);
  padding:.45em 1em;border-radius:100px;font-size:.85rem;margin-bottom:1.3rem;
}
.hero__tag .dot{width:8px;height:8px;border-radius:50%;background:var(--amber);flex:none}
.hero h1{color:#fff;font-size:clamp(2.3rem,8vw,6.2rem);font-weight:800;letter-spacing:-.04em;line-height:.98;
  text-shadow:0 4px 30px rgba(0,0,0,.3);margin-bottom:0}
.hero h1 em{font-style:normal;color:var(--amber)}
/* « Ici, c'est Nantes » : police blanche (demande client) */
.hero h1 .ici{display:block;font-size:.4em;font-weight:600;color:#fff;letter-spacing:.03em;margin-bottom:.55rem}
.hero__sub strong{color:var(--amber)}
.hero__sub{color:#e4eef7;font-size:clamp(1.05rem,1.7vw,1.35rem);max-width:38ch;margin:1.4rem 0 2rem;line-height:1.5}
.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}

/* ---------- Bandeau « En direct » ---------- */
.counter{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.counter::before{content:"";position:absolute;inset:0;background:
  radial-gradient(600px 300px at 12% -20%,rgba(9,149,140,.35),transparent 60%),
  radial-gradient(500px 280px at 95% 130%,rgba(244,168,29,.22),transparent 60%)}
.counter .container{position:relative;display:grid;grid-template-columns:1fr;gap:var(--s5);align-items:center}
@media(min-width:900px){.counter .container{grid-template-columns:1.15fr 1fr;gap:clamp(2rem,5vw,4.5rem)}}
.counter__big{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.counter__eye{font-size:1.9rem;line-height:1}
.counter__num{font-family:var(--ff-display);font-weight:800;font-size:clamp(2.8rem,10vw,5.6rem);line-height:.92;
  letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:#fff}
/* Libellé du cartouche : police blanche (demande client) */
.counter__label{color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:.8rem;margin-top:.5rem}
.counter__label .sub{display:block;letter-spacing:.1em;font-weight:600;text-transform:none;font-size:.86rem;
  color:#fff;opacity:.95;margin-top:.25rem}
.counter__note{color:#9fb6cc;font-size:var(--fs-200);margin:var(--s3) 0 0;max-width:46ch}
.live-pill{display:inline-flex;align-items:center;gap:.5em;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber);font-weight:700;margin-bottom:.8rem}
.live-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--coral);flex:none}
.socials{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:.7rem}
.social-chip{display:flex;align-items:center;gap:.6rem;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);padding:.7rem .9rem;border-radius:14px;text-decoration:none;
  transition:background .2s,transform .2s;min-height:var(--tap)}
.social-chip:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.social-chip svg{width:20px;height:20px}
.social-chip .n{font-family:var(--ff-display);font-weight:700;font-size:1.05rem;color:#fff;
  font-variant-numeric:tabular-nums;display:block}
.social-chip .t{font-size:.74rem;color:#cddced;display:block;white-space:nowrap}

/* ---------- Mur social ---------- */
.wall{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){.wall{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.wall{grid-template-columns:repeat(3,1fr)}}
.post{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;
  display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;
  box-shadow:var(--shadow-sm);text-decoration:none;color:var(--ink);transition:box-shadow .25s,transform .25s
}
a.post:hover{transform:translateY(-4px);box-shadow:var(--shadow-card)}
.post__head{display:flex;align-items:center;gap:.7rem;margin-bottom:.8rem;position:relative;z-index:2}
.post__ico{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#fff;flex:none}
.post__ico svg{width:20px;height:20px}
.post small{color:var(--ink-soft);font-size:.82rem}
.post b{font-family:var(--ff-display);font-size:.98rem;color:var(--navy)}
.post p{font-size:.96rem;margin:0;color:var(--ink);position:relative;z-index:2}
.post__foot{display:flex;gap:1rem;color:var(--ink-soft);font-size:.84rem;margin-top:1rem;font-weight:600;
  position:relative;z-index:2}
.post--media{color:#fff;min-height:250px;justify-content:flex-end;background-size:cover;background-position:center}
.post--media .post__head b,.post--media small{color:#fff}
.post--note{background:var(--navy);color:#fff;border-color:var(--navy)}
.post--note b,.post--note p{color:#fff}
.post--note small{color:#bcd0e4}
.bg-fb{background:#1877f2}.bg-yt{background:#ff0000}.bg-tt{background:#000}.bg-x{background:#000}
.bg-ig{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}

/* ---------- Chiffres clés ---------- */
.facts{display:grid;grid-template-columns:1fr;gap:var(--s3);list-style:none;padding:0;margin:0}
@media(min-width:620px){.facts{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.fact{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4)}
.fact .n{font-family:var(--ff-display);font-weight:800;font-size:2.1rem;color:var(--navy);line-height:1;letter-spacing:-.03em}
.fact .l{color:var(--ink-soft);font-size:var(--fs-300);margin-top:.4rem}
.bg-navy .fact{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16)}
.bg-navy .fact .n{color:#fff}
.bg-navy .fact .l{color:#bcd0e4}

/* ---------- Cartes d'accès rapide ---------- */
.quick{display:grid;grid-template-columns:1fr;gap:var(--s3)}
@media(min-width:680px){.quick{grid-template-columns:repeat(2,1fr)}}
.qcard{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--s4);text-decoration:none;color:var(--ink);transition:border-color .2s,box-shadow .2s,transform .2s}
a.qcard:hover{border-color:var(--navy);box-shadow:var(--shadow);transform:translateY(-3px)}
.qcard .ico{font-size:1.7rem;line-height:1}
.qcard h3{margin:.6rem 0 .3rem}
.qcard p{color:var(--ink-soft);margin:0;font-size:var(--fs-300)}
.qcard .more{display:inline-flex;align-items:center;gap:.35rem;margin-top:.7rem;color:var(--teal-600);
  font-weight:700;font-size:var(--fs-300)}

/* ---------- Grille des axes (image + volet lisible) ---------- */
.axes-grid{display:grid;grid-template-columns:1fr;gap:var(--s4)}
@media(min-width:640px){.axes-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.axes-grid{grid-template-columns:repeat(3,1fr)}}
.axe{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:var(--ink);
  box-shadow:var(--shadow-sm);transition:border-color .2s,box-shadow .25s,transform .25s}
.axe:hover{border-color:var(--navy);box-shadow:var(--shadow-card);transform:translateY(-4px)}
.axe img{aspect-ratio:16/10;object-fit:cover;width:100%}
.axe__body{padding:var(--s4);display:flex;flex-direction:column;gap:.45rem;flex:1}
.axe__head{display:flex;align-items:center;gap:.6rem}
.axe__ico{width:42px;height:42px;flex:none;border-radius:13px;background:var(--paper3);border:1px solid var(--line);
  display:grid;place-items:center;font-size:1.3rem}
.axe h3{margin:0;font-size:var(--fs-500);color:var(--navy)}
.axe p{margin:0;color:var(--ink-soft);font-size:var(--fs-300)}
.axe .more{margin-top:auto;color:var(--teal-600);font-weight:700;font-size:var(--fs-300);
  display:inline-flex;align-items:center;gap:.35rem}

/* Badges de statut : libellé + icône, jamais la couleur seule */
.badge{display:inline-flex;align-items:center;gap:.35rem;font-size:var(--fs-200);font-weight:700;
  padding:.22rem .6rem;border-radius:999px;width:max-content}
.badge--ok{background:var(--ok-bg);color:var(--ok-fg)}
.badge--wip{background:var(--wip-bg);color:var(--wip-fg)}
.badge svg{width:14px;height:14px}

/* ---------- Pages axe ---------- */
.split{display:grid;grid-template-columns:1fr;gap:var(--s5)}
@media(min-width:860px){.split{grid-template-columns:1.6fr .9fr;align-items:start}}
.prose h2{margin-top:0}
.prose h3{margin-top:var(--s4)}
.prose ul{padding-left:1.15rem;margin:0 0 1.1rem}
.prose li{margin-bottom:.5rem}
.callout{display:flex;gap:var(--s3);align-items:center;background:var(--paper3);border:1px solid var(--line);
  border-left:4px solid var(--teal);border-radius:var(--radius-sm);padding:var(--s3) var(--s4);margin:var(--s4) 0}
.callout .big{font-family:var(--ff-display);font-weight:800;font-size:2.1rem;color:var(--navy);line-height:1;white-space:nowrap}
.aside{background:var(--navy);color:#dfe9f3;border-radius:var(--radius-lg);padding:var(--s4);
  box-shadow:var(--shadow)}
.aside h3{color:#fff;margin-top:.3rem}
.aside p{color:#bcd0e4;font-size:var(--fs-300)}
.aside .ico{width:52px;height:52px;border-radius:15px;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);display:grid;place-items:center;font-size:1.6rem}
figure{margin:0}
figcaption{font-size:var(--fs-300);color:var(--ink-soft);margin-top:.5rem}
.media-round{border-radius:var(--radius-lg);box-shadow:var(--shadow)}

/* Listes d'outils et de liens */
.tool-list{display:grid;gap:var(--s2);margin-top:var(--s3)}
.tool{display:flex;align-items:center;gap:var(--s3);background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius-sm);padding:.85rem var(--s3);text-decoration:none;color:var(--ink);min-height:var(--tap)}
a.tool:hover{border-color:var(--navy);background:var(--paper3)}
.tool__ico{width:38px;height:38px;flex:none;border-radius:11px;background:var(--paper3);color:var(--navy);
  display:grid;place-items:center}
.tool__ico svg{width:20px;height:20px}
.tool__txt{flex:1}
.tool__txt b{display:block;color:var(--navy)}
.tool__txt span{display:block;color:var(--ink-soft);font-size:var(--fs-300)}
.tool .ext{width:18px;height:18px;flex:none;color:var(--ink-soft)}
.tool__ico--alert{background:var(--coral);color:#fff}

/* ---------- Tableau des médiateurs ---------- */
.filter{display:flex;align-items:center;gap:.6rem;background:var(--card);border:1px solid var(--line);
  border-radius:100px;padding:.4rem 1rem;margin-bottom:var(--s4);max-width:520px}
.filter svg{width:20px;height:20px;color:var(--ink-soft);flex:none}
.filter input{flex:1;border:0;font:inherit;padding:.5rem 0;min-height:var(--tap);background:none}
.filter input:focus{outline:none}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
table.med{width:100%;border-collapse:collapse;font-size:var(--fs-300);background:var(--card)}
table.med th{text-align:left;background:var(--paper3);color:var(--navy);font-size:var(--fs-200);
  text-transform:uppercase;letter-spacing:.05em;padding:.8rem var(--s3);border-bottom:1px solid var(--line)}
table.med td{padding:.85rem var(--s3);border-bottom:1px solid var(--line);vertical-align:top}
table.med tr:last-child td{border-bottom:0}
.sector{display:inline-block;background:var(--paper3);color:var(--navy);font-size:var(--fs-200);
  font-weight:700;padding:.15rem .55rem;border-radius:999px}
table.med a{color:var(--teal-600);text-decoration:underline;text-underline-offset:2px;
  display:inline-flex;align-items:center;gap:.3rem}
table.med a svg{width:15px;height:15px}
@media(max-width:680px){
  table.med thead{position:absolute;left:-9999px}
  table.med,table.med tbody,table.med tr,table.med td{display:block;width:100%}
  table.med tr{border-bottom:1px solid var(--line);padding:.6rem var(--s3)}
  table.med tr:last-child{border-bottom:0}
  table.med td{border:0;padding:.25rem 0;display:flex;gap:.6rem}
  table.med td::before{content:attr(data-label);font-weight:700;color:var(--ink-soft);
    min-width:90px;font-size:var(--fs-200);text-transform:uppercase;letter-spacing:.04em}
}

/* ---------- Agenda intégré aux actualités ---------- */
.timeline{display:grid;gap:var(--s3);max-width:820px}
.event{display:grid;grid-template-columns:auto 1fr;gap:var(--s3);background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:var(--s4)}
.event__date{background:var(--navy);color:#fff;border-radius:var(--radius-sm);padding:.5rem .7rem;
  text-align:center;align-self:start;min-width:68px}
.event__date .d{font-family:var(--ff-display);font-weight:800;font-size:1.5rem;line-height:1;display:block}
.event__date .m{font-size:var(--fs-200);text-transform:uppercase;letter-spacing:.05em;display:block}
.event h3{margin:.1rem 0 .3rem}
.event p{margin:0;color:var(--ink-soft);font-size:var(--fs-300)}
.event .meta{margin-top:.5rem;font-size:var(--fs-200);color:var(--teal-600);font-weight:700}

/* ---------- Actualités ---------- */
.news{display:grid;grid-template-columns:1fr;gap:var(--s4)}
@media(min-width:680px){.news{grid-template-columns:repeat(2,1fr)}}
.note{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4);
  display:flex;flex-direction:column;gap:.5rem}
.note .tag{font-size:var(--fs-200);font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.1em}
.note h3{margin:0}
.note p{margin:0;color:var(--ink-soft);font-size:var(--fs-300)}
.note time{font-size:var(--fs-200);color:var(--ink-soft);margin-top:auto}
.channels{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:var(--s4)}
.channel{display:inline-flex;align-items:center;gap:.5rem;background:var(--card);border:1px solid var(--line);
  border-radius:999px;padding:.5rem 1rem;text-decoration:none;color:var(--navy);font-weight:700;
  font-size:var(--fs-300);min-height:var(--tap)}
.channel:hover{border-color:var(--navy);background:var(--paper3)}
.channel svg{width:18px;height:18px}
.channel small{font-weight:500;color:var(--ink-soft)}

/* ---------- Formulaire ---------- */
.form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--s5);
  box-shadow:var(--shadow-sm)}
@media(max-width:600px){.form-card{padding:var(--s3)}}
.field{margin-bottom:var(--s3)}
.field label{display:block;font-weight:700;color:var(--navy);margin-bottom:.35rem;font-size:var(--fs-300)}
.field input,.field select,.field textarea{width:100%;font:inherit;padding:.7rem .8rem;min-height:var(--tap);
  border:1.5px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--ink)}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy)}
.field .hint{font-size:var(--fs-200);color:var(--ink-soft);margin:.3rem 0 0}
.grid-2{display:grid;grid-template-columns:1fr;gap:var(--s3)}
@media(min-width:560px){.grid-2{grid-template-columns:1fr 1fr}}
.choice-group{display:grid;gap:.5rem}
.choice{display:flex;align-items:flex-start;gap:.6rem;border:1.5px solid var(--line);border-radius:var(--radius-sm);
  padding:.7rem .8rem;cursor:pointer;min-height:var(--tap);background:#fff}
.choice:has(input:checked){border-color:var(--navy);background:var(--paper3)}
.choice input{margin-top:.25rem;width:auto;min-height:auto}
.choice b{display:block;color:var(--navy)}
.choice small{color:var(--ink-soft)}

/* Menu déroulant à choix multiples (axes d'accompagnement) */
.multi{border:1.5px solid var(--line);border-radius:var(--radius-sm);background:#fff}
.multi>summary{list-style:none;cursor:pointer;padding:.75rem .85rem;min-height:var(--tap);display:flex;
  align-items:center;justify-content:space-between;gap:.5rem;font-weight:600;color:var(--ink);border-radius:var(--radius-sm)}
.multi>summary::-webkit-details-marker{display:none}
.multi>summary .chev{width:16px;height:16px;flex:none;transition:transform .15s}
.multi[open]>summary{border-bottom:1px solid var(--line);color:var(--navy)}
.multi[open]>summary .chev{transform:rotate(180deg)}
.multi__list{padding:.5rem;display:grid;gap:.2rem;max-height:min(62vh,470px);overflow-y:auto}
.multi__list label{display:flex;align-items:center;gap:.6rem;padding:.55rem .6rem;border-radius:var(--radius-sm);
  cursor:pointer;min-height:var(--tap);font-size:var(--fs-300)}
.multi__list label:hover{background:var(--paper3)}
.multi__list input{width:auto;min-height:auto;accent-color:var(--teal)}
.multi__foot{border-top:1px solid var(--line);padding:.55rem .85rem;font-size:var(--fs-200);color:var(--ink-soft)}
.counter-chars{font-size:var(--fs-200);color:var(--ink-soft);text-align:right;margin:.3rem 0 0}
.counter-chars.warn{color:#a5410f;font-weight:700}

/* ---------- Formulaire d'adhésion (Brevo, posé dans la page) ----------
   Le balisage vient de Brevo et son script a besoin de ses identifiants
   (#sib-form, #sib-container, .form__entry, .entry__error, .input--hidden).
   En revanche sa feuille de style n'est pas chargée : tout l'habillage est
   ici, avec les jetons du site. Une seule règle est « contractuelle » :
   .sib-form-message-panel--active, la classe que le script ajoute pour
   afficher le bandeau de réussite ou d'échec. */
.form-intro{color:var(--ink-soft);font-size:var(--fs-300)}
#sib-form{display:grid;gap:var(--s3)}
.sib-form-block{margin:0}
.sib-form fieldset{border:0;margin:0;padding:0;min-width:0}
.sib-form legend{padding:0}
.sib-form .entry__label{display:block;font-weight:700;color:var(--navy);margin-bottom:.35rem;font-size:var(--fs-300)}
.sib-form .req{color:#b3261e}
.sib-form .input{width:100%;font:inherit;padding:.7rem .8rem;min-height:var(--tap);
  border:1.5px solid var(--line);border-radius:var(--radius-sm);background:#fff;color:var(--ink)}
.sib-form .input::placeholder{color:#93a3b5}
.sib-form .input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(8,52,99,.12)}
.sib-form .entry__specification{display:block;font-size:var(--fs-200);color:var(--ink-soft);margin:.35rem 0 0}
/* Message d'erreur d'un champ : le script de Brevo y écrit le texte et pilote
   son display ; tant qu'il est vide, il ne doit pas réserver de place. */
.sib-form .entry__error{margin:.4rem 0 0;padding:.4rem .6rem;border-radius:10px;
  font-size:var(--fs-200);font-weight:600;color:#8a1f16;background:#fdecea}
.sib-form .entry__error:empty{display:none}
.sib-form .entry_errored .input{border-color:#b3261e}
.sib-form .choice input,.sib-form .optin input{width:1.15rem;height:1.15rem;flex:none;accent-color:var(--teal)}
.sib-form .choice span{display:block}
.sib-form .optin{display:flex;align-items:flex-start;gap:.6rem;font-size:var(--fs-300);cursor:pointer}
.sib-form .optin input{margin-top:.25rem}
.sib-form .optin p{margin:0}
/* Le widget reCAPTCHA fait 304 px de large : sur les très petits écrans on le
   réduit plutôt que de laisser la carte défiler latéralement. */
.sib-captcha .g-recaptcha{transform-origin:0 0}
@media(max-width:400px){.sib-captcha .g-recaptcha{transform:scale(.85)}
  .sib-captcha .form__label-row{height:66px}}
.sib-form-block__button{justify-content:center;width:100%}
@media(min-width:560px){.sib-form-block__button{width:auto}}
.sib-form-block__button-disabled{opacity:.6;pointer-events:none}
.sib-form-block__button .icon{width:18px;height:18px;flex:none;fill:currentColor;animation:sib-spin 1s linear infinite}
.sib-form-block__button .sib-hide-loader-icon{display:none}
@keyframes sib-spin{to{transform:rotate(360deg)}}
/* Champ leurre anti-robot : jamais affiché, jamais atteint au clavier. */
.sib-form .input--court{max-width:9rem}
.sib-form .captcha-q{font-weight:700}
.input--hidden{display:none}
/* Bandeaux de réponse, masqués jusqu'à l'envoi. */
.sib-form-message-panel{display:none;border:1px solid transparent;border-radius:var(--radius-sm);
  padding:var(--s3);margin-bottom:var(--s3);font-size:var(--fs-300)}
.sib-form-message-panel--active{display:block}
.sib-form-message-panel__text{display:flex;align-items:flex-start;gap:.6rem}
.sib-form-message-panel .sib-icon{width:22px;height:22px;flex:none;fill:currentColor}
#error-message{background:#fdecea;border-color:#f0b3ac;color:#8a1f16}
#success-message{background:var(--ok-bg);border-color:#9fd8c7;color:var(--ok-fg)}

.form-note{font-size:var(--fs-300);color:var(--ink-soft);margin-top:var(--s3)}
.info-box{display:flex;gap:.7rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:var(--s3);margin-bottom:var(--s2)}
.info-box .e{font-size:1.3rem;flex:none;line-height:1.3}
.info-box p{margin:0;font-size:var(--fs-300)}
.form-success{display:none;text-align:center;padding:var(--s4) 0}
.form-success.show{display:block}
.form-success .check{width:64px;height:64px;border-radius:50%;background:var(--teal);display:grid;place-items:center;
  margin:0 auto var(--s3)}

/* ---------- Pied de page ---------- */
.site-footer{background:var(--navy-900);color:#cdddec;padding-block:var(--s6) var(--s4);margin-top:var(--s7)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:var(--s4)}
@media(min-width:760px){.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr}}
.site-footer h2.foot-h,.site-footer h4{color:#fff;font-family:var(--ff-body);font-size:var(--fs-200);text-transform:uppercase;
  letter-spacing:.14em;margin:0 0 .7rem}
.site-footer a{color:#cdddec;text-decoration:none;display:block;padding:.32rem 0;font-size:var(--fs-300)}
.site-footer a:hover{color:#fff;text-decoration:underline}
.footer-brand .brand{color:#fff}
.footer-brand b{color:#fff;font-family:var(--ff-display);font-size:1.2rem}
.footer-brand p{color:#9fb6cc;max-width:34ch;font-size:var(--fs-300);margin-top:.6rem}
.foot-social{display:flex;gap:.5rem;margin-top:var(--s3)}
.foot-social a{width:var(--tap);height:var(--tap);border:1px solid rgba(255,255,255,.2);border-radius:11px;
  display:grid;place-items:center;padding:0}
.foot-social a:hover{background:rgba(255,255,255,.12)}
.foot-social svg{width:18px;height:18px;fill:#cdddec}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:var(--s5);padding-top:var(--s4);
  display:flex;flex-wrap:wrap;gap:.5rem;justify-content:space-between;font-size:var(--fs-200);color:#9fb6cc}

/* ---------- Bandeau de consentement ---------- */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:120;background:var(--card);
  border-top:3px solid var(--navy);box-shadow:0 -14px 40px -24px rgba(8,52,99,.55)}
.consent[hidden]{display:none}
.consent__inner{max-width:var(--maxw);margin-inline:auto;padding:var(--s3) clamp(20px,5vw,64px);
  display:grid;gap:var(--s3);align-items:center}
@media(min-width:880px){.consent__inner{grid-template-columns:1fr auto;gap:var(--s5)}}
.consent__h{font-family:var(--ff-display);font-weight:700;color:var(--navy);font-size:1.05rem;
  margin:0 0 .25rem;letter-spacing:-.02em}
.consent__txt p{margin:0;font-size:var(--fs-300);color:var(--ink-soft);max-width:78ch}
/* Refuser et accepter ont la même taille et la même lisibilité : refuser ne doit pas
   être plus difficile qu'accepter (recommandation CNIL). */
.consent__actions{display:flex;gap:.6rem;flex-wrap:wrap}
.consent__actions .btn{flex:1 1 auto;justify-content:center;min-width:130px}
@media(min-width:880px){.consent__actions .btn{flex:0 0 auto}}
/* le bouton « haut de page » se décale pour ne pas passer sous le bandeau */
body.consent-ouvert .to-top{bottom:calc(16px + 190px)}
@media(min-width:880px){body.consent-ouvert .to-top{bottom:calc(16px + 110px)}}

/* ---------- Retour en haut ---------- */
.to-top{position:fixed;right:16px;bottom:16px;width:var(--tap);height:var(--tap);border-radius:50%;
  background:var(--navy);color:#fff;border:0;cursor:pointer;display:none;place-items:center;
  box-shadow:var(--shadow);z-index:90}
.to-top.show{display:grid}
.to-top svg{width:22px;height:22px}

/* ---------- Navigation bureau ---------- */
@media(min-width:1040px){
  .nav{display:flex;align-items:center;gap:var(--s4)}
  .burger{display:none}
  .bar-actions{margin-left:var(--s4)}
}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .btn:hover,a.post:hover,a.qcard:hover,.axe:hover,.social-chip:hover{transform:none}
}

/* ---------- Impression ---------- */
@media print{
  .site-header,.to-top,.hero__grain,.counter,.burger{display:none!important}
  body{background:#fff}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;color:#555}
}