/* =========================================================
   SYNA-MNV — Ressources & Publications
   Feuille de styles (Bootstrap 5 + surcouche personnalisée)
   ========================================================= */

:root {
  /* Palette de marque — vert forêt institutionnel */
  --brand:        #2f5d3a;
  --brand-dark:   #1e3d28;
  --brand-600:    #35683f;
  --brand-050:    #eef4ee;

  /* Neutres */
  --ink:          #1b1f1d;
  --body:         #3f4744;
  --muted:        #808a85;
  --line:         #e7ebe8;
  --surface:      #ffffff;
  --bg:           #fbfcfb;

  /* Badges de catégorie */
  --tag-green-bg:  #e7f0e7;
  --tag-green-fg:  #35683f;
  --tag-amber-bg:  #f5eddb;
  --tag-amber-fg:  #8a6a2c;
  --tag-blue-bg:   #e4edf5;
  --tag-blue-fg:   #3a6491;
  --tag-teal-bg:   #e0f0ec;
  --tag-teal-fg:   #2c7263;

  --radius:       14px;
  --shadow-sm:    0 1px 2px rgba(20,40,25,.04);
  --shadow-card:  0 1px 3px rgba(20,40,25,.05), 0 8px 24px rgba(20,40,25,.05);

  --ease:         cubic-bezier(.4, 0, .2, 1);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--body);
  background: var(--bg);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 { color: var(--ink); }

a { text-decoration: none; }

.container-x { max-width: 1240px; }

/* ============================ Navbar ===================== */
.site-nav {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 30;
  padding: 1.15rem 0;
  transition: background-color .3s ease, padding .3s ease, box-shadow .3s ease;
}
/* Barre sticky : au défilement le navbar se fixe en haut avec un fond plein */
.site-nav.is-stuck {
  position: fixed;
  background: var(--brand);
  padding: .55rem 0;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
  animation: navDrop .35s ease;
}
@keyframes navDrop {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}

/* Bouton « retour en haut » — flottant en bas à droite */
.to-top {
  position: fixed;
  right: 1.4rem;
  bottom: 1.4rem;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s, background-color .2s ease;
  z-index: 50;
}
.to-top.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.to-top:hover { background: var(--brand-dark); }
.to-top:focus-visible { outline: 3px solid rgba(255, 255, 255, .6); outline-offset: 2px; }
.to-top svg { width: 22px; height: 22px; }
@media (max-width: 767.98px) {
  .to-top { right: 1rem; bottom: 1rem; width: 42px; height: 42px; }
}
.site-nav .brand {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  font-weight: 700;
  letter-spacing: .5px;
  color: #fff;
  font-size: 1.15rem;
}
.site-nav .brand-mark {
  width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: 10px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(4px);
}
.site-nav .brand-mark svg { width: 22px; height: 22px; }
.site-nav .brand small {
  display: block;
  font-size: .62rem;
  font-weight: 500;
  letter-spacing: 2px;
  color: rgba(255,255,255,.7);
  text-transform: uppercase;
}
.nav-links { display: flex; gap: .35rem; align-items: center; }
.nav-links a {
  color: rgba(255,255,255,.86);
  font-size: .95rem;
  font-weight: 500;
  padding: .5rem .9rem;
  border-radius: 8px;
  transition: color .2s var(--ease), background .2s var(--ease);
}
.nav-links a:hover { color: #fff; background: rgba(255,255,255,.12); }
.nav-links a.active { color: #fff; background: rgba(255,255,255,.16); }

.btn-brand {
  --bs-btn-color: #fff;
  background: var(--brand);
  color: #fff;
  font-weight: 600;
  border: 0;
  border-radius: 9px;
  padding: .6rem 1.25rem;
  transition: background .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn-brand:hover {
  background: var(--brand-dark);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(31,61,40,.28);
}

.nav-toggle {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  width: 44px; height: 44px;
  border-radius: 10px;
  display: none;
  place-items: center;
}
.nav-toggle svg { width: 22px; height: 22px; }

/* Menu mobile — masqué par défaut, activé uniquement sous le breakpoint */
.mobile-menu { display: none; }

/* ============================ Hero ====================== */
.hero {
  position: relative;
  min-height: 460px;
  display: flex;
  align-items: flex-end;
  color: #fff;
  overflow: hidden;
}
.hero__media {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(15,30,20,.72) 0%, rgba(15,30,20,.30) 55%, rgba(15,30,20,.55) 100%),
    linear-gradient(180deg, rgba(15,30,20,.25), rgba(15,30,20,.6)),
    url("../img/hero-forest.webp") center/cover no-repeat,
    #22402c;
}
.hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 3.5rem 0 3.25rem;
}
.hero .crumb {
  font-size: .9rem;
  color: rgba(255,255,255,.82);
  margin-bottom: 1rem;
}
.hero .crumb a { color: rgba(255,255,255,.82); }
.hero .crumb a:hover { color: #fff; }
.hero h1 {
  color: #fff;
  font-weight: 600;
  font-size: clamp(2.2rem, 4.2vw, 3.2rem);
  line-height: 1.08;
  letter-spacing: -.6px;
  margin: 0 0 1rem;
  max-width: 16ch;
}
.hero__lead {
  color: rgba(255,255,255,.86);
  font-size: 1.06rem;
  max-width: 44ch;
  margin: 0;
}

/* ======================= Barre de filtres =============== */
.toolbar {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}
.toolbar__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 0;
}
.filters { display: flex; flex-wrap: wrap; gap: .6rem; }
.filter {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--body);
  font-size: .92rem;
  font-weight: 500;
  padding: .55rem 1.15rem;
  border-radius: 999px;
  cursor: pointer;
  transition: all .2s var(--ease);
  white-space: nowrap;
}
.filter:hover { border-color: var(--brand); color: var(--brand); }
.filter.is-active {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.filter:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

.search {
  position: relative;
  min-width: 260px;
}
.search svg {
  position: absolute; left: 14px; top: 50%;
  transform: translateY(-50%);
  width: 18px; height: 18px; color: var(--muted);
  pointer-events: none;
}
.search input {
  width: 100%;
  border: 1px solid var(--line);
  background: var(--bg);
  border-radius: 999px;
  padding: .62rem 1rem .62rem 2.5rem;
  font-size: .92rem;
  color: var(--ink);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.search input::placeholder { color: var(--muted); }
.search input:focus {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(47,93,58,.12);
}

/* ========================== Résultats ================== */
.results { padding: 2.5rem 0 4rem; }
.results__count {
  color: var(--muted);
  font-size: .95rem;
  margin-bottom: 1.5rem;
}
.results__count b { color: var(--ink); font-weight: 600; }

/* ---------- Carte publication ---------- */
.pub {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.4rem 1.4rem 1.25rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.pub:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card);
  border-color: #d7ded9;
}
.tag {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .3px;
  text-transform: uppercase;
  padding: .38rem .7rem;
  border-radius: 7px;
  margin-bottom: 1.1rem;
}
.tag--green { background: var(--tag-green-bg); color: var(--tag-green-fg); }
.tag--amber { background: var(--tag-amber-bg); color: var(--tag-amber-fg); }
.tag--blue  { background: var(--tag-blue-bg);  color: var(--tag-blue-fg); }
.tag--teal  { background: var(--tag-teal-bg);  color: var(--tag-teal-fg); }
.tag .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

.pub__title {
  font-size: 1.06rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink);
  margin: 0 0 1rem;
}
.pub__meta {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--muted);
  font-size: .86rem;
  margin-bottom: 1.2rem;
}
.pub__meta .sep { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .6; }
.pub__foot {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.dl {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 600;
  font-size: .92rem;
  color: var(--brand);
  transition: gap .2s var(--ease), color .2s var(--ease);
}
.dl svg { width: 17px; height: 17px; }
.dl:hover { color: var(--brand-dark); gap: .72rem; }
.pub__size { font-size: .82rem; color: var(--muted); }

/* --------- Aucun résultat --------- */
.empty {
  display: none;
  text-align: center;
  padding: 3.5rem 1rem;
  color: var(--muted);
}
.empty svg { width: 46px; height: 46px; color: var(--line); margin-bottom: 1rem; }
.empty h3 { color: var(--ink); font-size: 1.15rem; margin-bottom: .35rem; }

/* ============================ FAQ ====================== */
.faq { display: none; max-width: 820px; }
.faq.is-visible { display: block; }
.faq .accordion-button {
  font-weight: 600;
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}
.faq .accordion-button:not(.collapsed) {
  color: var(--brand);
  background: var(--brand-050);
}
.faq .accordion-button:focus { box-shadow: 0 0 0 3px rgba(47,93,58,.12); }
.faq .accordion-item {
  border: 1px solid var(--line);
  border-radius: 12px !important;
  margin-bottom: .75rem;
  overflow: hidden;
}

/* ========================= Pagination ================== */
.pager {
  display: flex;
  justify-content: center;
  gap: .4rem;
  margin-top: 2.75rem;
}
.pager a, .pager span {
  min-width: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--body);
  font-weight: 500;
  font-size: .92rem;
  background: #fff;
  transition: all .18s var(--ease);
}
.pager a:hover { border-color: var(--brand); color: var(--brand); }
.pager .current { background: var(--brand); border-color: var(--brand); color: #fff; }
.pager .disabled { opacity: .45; pointer-events: none; }
.pager svg { width: 18px; height: 18px; }

/* ============================ Contact ================== */
.section { padding: 3.5rem 0 4rem; }
.section-head { max-width: 620px; margin-bottom: 2.5rem; }
.section-head .eyebrow {
  display: inline-block;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--brand);
  margin-bottom: .6rem;
}
.section-head h2 { font-size: clamp(1.8rem, 3.4vw, 2.4rem); font-weight: 600; letter-spacing: -.5px; margin-bottom: .75rem; }
.section-head p { color: var(--muted); margin: 0; }

/* Cartes coordonnées */
.info-card {
  display: flex;
  gap: 1rem;
  padding: 1.35rem 1.4rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.info-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-card); border-color: #d7ded9; }
.info-card__icon {
  flex: 0 0 auto;
  width: 46px; height: 46px;
  border-radius: 12px;
  display: grid; place-items: center;
  background: var(--brand-050);
  color: var(--brand);
}
.info-card__icon svg { width: 22px; height: 22px; }
.info-card h4 { font-size: 1rem; font-weight: 600; margin: 0 0 .2rem; color: var(--ink); }
.info-card p, .info-card a { font-size: .92rem; color: var(--body); margin: 0; }
.info-card a:hover { color: var(--brand); }

/* Formulaire */
.form-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 2rem;
  box-shadow: var(--shadow-card);
}
.form-label { font-weight: 600; font-size: .9rem; color: var(--ink); margin-bottom: .4rem; }
.form-label .req { color: var(--tag-amber-fg); }
.form-control, .form-select {
  border: 1px solid var(--line);
  background: var(--bg);
  border-radius: 10px;
  padding: .7rem .9rem;
  font-size: .95rem;
  color: var(--ink);
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.form-control:focus, .form-select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(47,93,58,.12);
}
.form-hint { font-size: .8rem; color: var(--muted); margin-top: .35rem; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--tag-amber-fg); }
.field-error { display: none; color: #b4451f; font-size: .82rem; margin-top: .35rem; }
.field-error.show { display: block; }

.form-success {
  display: none;
  align-items: center;
  gap: .65rem;
  background: var(--tag-green-bg);
  color: var(--tag-green-fg);
  border: 1px solid #cfe6cf;
  border-radius: 12px;
  padding: .9rem 1.1rem;
  font-weight: 500;
  margin-bottom: 1.25rem;
}
.form-success.show { display: flex; }
.form-success svg { width: 20px; height: 20px; flex: 0 0 auto; }

/* Bloc carte / localisation */
.map-embed {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.map-embed iframe { display: block; width: 100%; height: 260px; border: 0; }

/* ===================== Pages internes ================== */
.hero--sm { min-height: 340px; }
/* Titres des pages internes / articles : police plus mesurée et largeur élargie
   pour éviter qu'un titre long n'étire le hero verticalement. */
.hero--sm h1 {
  font-size: clamp(1.6rem, 2.6vw, 2.35rem);
  line-height: 1.15;
  letter-spacing: -.3px;
  max-width: 28ch;
}

.content { padding: 3.5rem 0 4.5rem; }
.prose { max-width: 780px; }
.prose > p:first-of-type { font-size: 1.12rem; color: var(--body); }
.prose h2 { font-size: 1.5rem; font-weight: 600; margin: 2.4rem 0 .8rem; }
.prose h3 { font-size: 1.15rem; font-weight: 600; margin: 1.7rem 0 .5rem; }
.prose p { margin: 0 0 1.05rem; text-align: justify; hyphens: auto; }
.prose ul, .prose ol { padding-left: 1.2rem; margin: 0 0 1.2rem; }
.prose li { margin-bottom: .45rem; text-align: justify; hyphens: auto; }
.prose ol li::marker { color: var(--brand); font-weight: 600; }
.prose a { color: var(--brand); text-decoration: underline; text-underline-offset: 2px; }
.prose a:hover { color: var(--brand-dark); }

/* Piliers / valeurs / étapes */
.pillar {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.7rem 1.6rem;
  height: 100%;
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.pillar:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); border-color: #d7ded9; }
.pillar__badge {
  width: 46px; height: 46px;
  border-radius: 12px;
  display: grid; place-items: center;
  background: var(--brand-050); color: var(--brand);
  font-weight: 700; font-size: 1.1rem;
  margin-bottom: 1.1rem;
}
.pillar__badge svg { width: 22px; height: 22px; }
.pillar__img {
  width: 64px; height: 64px;
  object-fit: contain;
  margin-bottom: 1rem;
  display: block;
}
.pillar h3 { margin: 0 0 .5rem; font-size: 1.12rem; }
.pillar p { margin: 0; color: var(--body); font-size: .95rem; }

/* Chiffres clés */
.stat { text-align: left; }
.stat__num { font-size: 2.4rem; font-weight: 700; color: var(--brand); line-height: 1; letter-spacing: -1px; }
.stat__label { color: var(--muted); font-size: .92rem; margin-top: .35rem; }

/* Partenaires */
.partner {
  display: grid; place-items: center;
  min-height: 110px; padding: 1rem;
  text-align: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--brand-dark); font-weight: 600; font-size: .95rem;
  box-shadow: var(--shadow-sm);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.partner:hover { transform: translateY(-3px); box-shadow: var(--shadow-card); }

/* Jeux de données */
.dataset {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.1rem 1.3rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  margin-bottom: .8rem;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.dataset:hover { border-color: var(--brand); box-shadow: var(--shadow-sm); }
.dataset__main { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.dataset__icon { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: var(--brand-050); color: var(--brand); }
.dataset__icon svg { width: 20px; height: 20px; }
.dataset h4 { margin: 0; font-size: 1rem; color: var(--ink); }
.dataset small { color: var(--muted); }

/* Gouvernance — organigramme simple */
.gov-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 1.5rem; height: 100%;
  box-shadow: var(--shadow-sm);
}
.gov-card .role { font-size: .78rem; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--brand); margin-bottom: .5rem; }
.gov-card h3 { font-size: 1.08rem; margin: 0 0 .4rem; }
.gov-card p { margin: 0; color: var(--body); font-size: .93rem; }

/* Encadré d'appel */
.callout {
  background: var(--brand-050);
  border: 1px solid var(--tag-green-bg);
  border-radius: var(--radius);
  padding: 1.5rem 1.6rem;
}
.callout h3 { margin: 0 0 .4rem; font-size: 1.1rem; }
.callout p { margin: 0 0 1rem; color: var(--body); }

/* Sommaire (pages légales) */
.legal-updated { color: var(--muted); font-size: .9rem; margin-bottom: 2rem; }

/* Cartes actualités */
.news {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.news:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); border-color: #d7ded9; }
.news__media {
  position: relative;
  height: 168px;
  display: grid;
  place-items: center;
  background:
    linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
  overflow: hidden;
}
.news__media::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 80% 20%, rgba(255,255,255,.14), transparent 45%),
    radial-gradient(circle at 15% 90%, rgba(255,255,255,.08), transparent 40%);
}
.news__media svg { width: 46px; height: 46px; color: rgba(255,255,255,.55); position: relative; z-index: 1; }
.news__media img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.news__media--img::after { z-index: 1; }
.news__date {
  position: absolute;
  top: 12px; left: 12px;
  z-index: 2;
  background: rgba(255,255,255,.92);
  color: var(--brand-dark);
  font-size: .76rem;
  font-weight: 600;
  padding: .3rem .65rem;
  border-radius: 7px;
}
.news__body { padding: 1.35rem 1.4rem 1.3rem; display: flex; flex-direction: column; flex: 1; }
.news__title {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ink);
  margin: 0 0 .7rem;
}
.news__excerpt { color: var(--body); font-size: .93rem; margin: 0 0 1.1rem; text-align: justify; hyphens: auto; }
.news__more {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-weight: 600;
  font-size: .9rem;
  color: var(--brand);
  transition: gap .2s var(--ease), color .2s var(--ease);
}
.news__more svg { width: 16px; height: 16px; }
.news__more:hover { color: var(--brand-dark); gap: .68rem; }

/* Article — page de détail */
.back-link {
  display: inline-flex; align-items: center; gap: .45rem;
  color: var(--muted); font-weight: 500; font-size: .92rem;
  margin-bottom: 1.6rem;
  transition: color .2s var(--ease), gap .2s var(--ease);
}
.back-link:hover { color: var(--brand); gap: .65rem; }
.back-link svg { width: 16px; height: 16px; }
.article { max-width: 800px; }
.article h3 { margin-top: 1.9rem; }
.article__cover {
  width: 100%;
  max-height: 420px;
  object-fit: cover;
  border-radius: 16px;
  margin-bottom: 2rem;
  box-shadow: var(--shadow-card);
}
.article__foot {
  margin-top: 2.5rem; padding-top: 1.5rem;
  border-top: 1px solid var(--line);
  display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center;
}
.pullquote {
  border-left: 3px solid var(--brand);
  background: var(--brand-050);
  margin: 1.6rem 0;
  padding: 1.15rem 1.4rem;
  border-radius: 0 12px 12px 0;
  font-size: 1.06rem;
  color: var(--ink);
  font-style: italic;
}
.pullquote cite {
  display: block; margin-top: .6rem;
  font-style: normal; font-weight: 600; font-size: .88rem; color: var(--brand);
}

/* ===================== Page d'accueil ================== */
.home-hero { min-height: 440px; }
.home-hero h1 { max-width: 18ch; font-size: clamp(2.2rem, 4.6vw, 3.5rem); }

/* Titre à 2.5rem (desktop) pour l'accueil et Publications — réduit sur mobile */
.hero--t25 h1 { font-size: clamp(2rem, 5vw, 2.5rem); max-width: 22ch; }
.hero__cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.9rem; }
.btn-ghost {
  display: inline-flex; align-items: center; gap: .55rem;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.32);
  color: #fff; font-weight: 600;
  padding: .72rem 1.4rem; border-radius: 9px;
  transition: background .2s var(--ease), transform .2s var(--ease);
}
.btn-ghost:hover { background: rgba(255,255,255,.22); color: #fff; transform: translateY(-1px); }
.btn-ghost svg { width: 18px; height: 18px; }
.btn-brand.btn-hero, .btn-ghost.btn-hero { padding: .8rem 1.55rem; font-size: 1rem; }

.section-block { padding: 4rem 0; }
.section-block--alt { background: var(--surface); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section-title { text-align: center; max-width: 660px; margin: 0 auto 2.75rem; }
.section-title .eyebrow {
  display: inline-block; font-size: .78rem; font-weight: 600;
  letter-spacing: 1.5px; text-transform: uppercase; color: var(--brand); margin-bottom: .6rem;
}
.section-title h2 { font-size: clamp(1.8rem, 3.4vw, 2.35rem); font-weight: 600; letter-spacing: -.5px; margin-bottom: .7rem; }
.section-title p { color: var(--muted); margin: 0; }

/* Présentation (split) */
.split-media {
  min-height: 320px; height: 100%;
  border-radius: 18px; overflow: hidden;
  background:
    linear-gradient(180deg, rgba(15,30,20,.10), rgba(15,30,20,.30)),
    url("../img/presentation-forest.webp") center/cover no-repeat,
    var(--brand);
  box-shadow: var(--shadow-card);
}

/* Bande d'appel à l'action */
.cta-band {
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
  color: #fff;
  border-radius: 22px;
  padding: 3rem 2.5rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-band::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 85% 15%, rgba(255,255,255,.12), transparent 45%);
}
.cta-band > * { position: relative; z-index: 1; }
.cta-band h2 { color: #fff; font-size: clamp(1.6rem, 3vw, 2.1rem); font-weight: 600; margin-bottom: .6rem; }
.cta-band p { color: rgba(255,255,255,.85); max-width: 52ch; margin: 0 auto 1.6rem; }
.cta-band .btn-brand { background: #fff; color: var(--brand-dark); }
.cta-band .btn-brand:hover { background: rgba(255,255,255,.9); color: var(--brand-dark); }

/* Carrousel actualités (accueil) */
.news-slider { position: relative; }
.news-viewport { overflow: hidden; }
.news-track {
  display: flex;
  gap: 1.5rem;
  transition: transform .55s var(--ease);
  will-change: transform;
}
.news-slide { flex: 0 0 calc((100% - 3rem) / 3); }        /* 3 visibles (2 gaps de 1.5rem) */
.news-slide .news { height: 100%; }

.news-nav {
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  width: 44px; height: 44px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-card);
  display: grid; place-items: center;
  cursor: pointer;
  color: var(--brand-dark);
  z-index: 4;
  transition: background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease);
}
.news-nav:hover { background: var(--brand); color: #fff; }
.news-nav svg { width: 20px; height: 20px; }
.news-prev { left: -14px; }
.news-next { right: -14px; }

.news-dots { display: flex; justify-content: center; gap: .5rem; margin-top: 1.75rem; }
.news-dot {
  width: 9px; height: 9px; padding: 0;
  border: 0; border-radius: 999px;
  background: var(--line);
  cursor: pointer;
  transition: background .2s var(--ease), width .2s var(--ease);
}
.news-dot.active { background: var(--brand); width: 24px; }

@media (max-width: 991.98px) {
  .news-slide { flex-basis: calc((100% - 1.5rem) / 2); }    /* 2 visibles */
  .news-prev { left: -8px; }
  .news-next { right: -8px; }
}
@media (max-width: 767.98px) {
  .news-slide { flex-basis: 100%; }                          /* 1 visible */
  .news-nav { display: none; }
}

/* Logos partenaires (accueil) */
.plogo {
  display: grid; place-items: center;
  min-height: 120px; padding: 1.5rem;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  font-weight: 700; letter-spacing: .5px; color: var(--brand-dark);
}
.plogo img { max-width: 100%; max-height: 74px; object-fit: contain; }

/* ============================ Footer =================== */
.site-footer {
  background: var(--brand-dark);
  color: rgba(255,255,255,.72);
  padding: 3.5rem 0 1.75rem;
  font-size: .92rem;
}
.site-footer h5 {
  color: #fff;
  font-size: .82rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 1.1rem;
  font-weight: 600;
}
.site-footer a { color: rgba(255,255,255,.72); transition: color .18s var(--ease); }
.site-footer a:hover { color: #fff; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: .6rem; }
.footer-brand { display: inline-flex; align-items: center; gap: .6rem; color: #fff; font-weight: 700; font-size: 1.1rem; margin-bottom: 1rem; }
.footer-brand .brand-mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); }
.footer-brand svg { width: 20px; height: 20px; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.14);
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: space-between;
  font-size: .85rem;
}
.social { display: flex; gap: .6rem; }
.social a {
  width: 38px; height: 38px; border-radius: 9px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.social a:hover { background: rgba(255,255,255,.16); }
.social svg { width: 18px; height: 18px; }

/* ========================= Responsive ================== */
@media (max-width: 991.98px) {
  .nav-links, .site-nav .btn-brand { display: none; }
  .nav-toggle { display: grid; }
  .mobile-menu {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--brand-dark);
    padding: 1rem 1.25rem 1.5rem;
    display: none;
    flex-direction: column;
    gap: .25rem;
    z-index: 40;
  }
  .mobile-menu.open { display: flex; }
  .mobile-menu a { color: rgba(255,255,255,.9); padding: .7rem .5rem; border-radius: 8px; font-weight: 500; }
  .mobile-menu a:hover { background: rgba(255,255,255,.1); }
  .mobile-menu .btn-brand { display: inline-flex; margin-top: .5rem; justify-content: center; }
}
@media (max-width: 767.98px) {
  .hero { min-height: 380px; }
  .toolbar__inner { flex-direction: column; align-items: stretch; }
  .search { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}