/* ==========================================================================
   APEX OUTDOOR — feuille de style principale
   Site vitrine statique — version publique
   ========================================================================== */

/* ---------- Polices ---------- */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=Caveat:wght@600;700&family=Inter:wght@400;500;600;700&display=swap');

/* ---------- Variables ---------- */
:root {
  /* Couleurs */
  --nuit: #16222f;        /* bleu nuit — roche, sérieux */
  --nuit-2: #1f3040;      /* bleu nuit éclairci — cartes sombres */
  --neige: #f4f3ee;       /* fond clair principal */
  --blanc: #ffffff;
  --encre: #233040;       /* texte courant */
  --gris: #5b6877;        /* texte secondaire */
  --apex: #f0612a;        /* orange APEX — énergie, lever de soleil */
  --apex-fonce: #bc4413;  /* orange foncé — liens sur fond clair (contraste AA) */
  --vert: #2e7d5b;        /* badge accessibilité */
  --mousse: #dfe8dd;      /* fond naturel — communauté */
  --ciel: #dbe8f2;        /* accent froid — respiration */
  --roche: #34414d;       /* gris roche */
  --ligne: #e3e0d8;

  /* Typo */
  --titres: "Barlow Condensed", "Arial Narrow", sans-serif;
  --texte: "Inter", "Segoe UI", system-ui, sans-serif;
  --manuscrite: "Caveat", "Segoe Script", cursive;

  /* Divers */
  --rayon: 8px;
  --ombre: 0 6px 24px rgba(22, 34, 47, 0.10);
  --largeur: 1120px;
  --hauteur-header: 84px;
  --hauteur-cover: clamp(640px, 82svh, 760px);
  --hauteur-cover-mobile: clamp(560px, 82svh, 640px);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

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

body {
  margin: 0;
  font-family: var(--texte);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--encre);
  background: var(--neige);
}

img, svg { max-width: 100%; display: block; }

h1, h2, h3, h4 {
  font-family: var(--titres);
  line-height: 1.1;
  margin: 0 0 0.5em;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

h1 { font-size: clamp(2.4rem, 6vw, 4.2rem); font-weight: 700; }
h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700; }
h3 { font-size: clamp(1.3rem, 3vw, 1.6rem); font-weight: 600; }

p { margin: 0 0 1em; }

a { color: var(--apex-fonce); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--apex); }

:focus-visible {
  outline: 3px solid var(--apex);
  outline-offset: 3px;
  border-radius: 4px;
}

ul { padding-left: 1.2em; }

/* ---------- Lien d'évitement (accessibilité) ---------- */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--apex);
  color: var(--nuit);
  font-weight: 700;
  padding: 0.8em 1.4em;
  z-index: 1000;
  text-decoration: none;
}
.skip-link:focus {
  left: 12px;
  top: 12px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Utilitaires ---------- */
.conteneur {
  max-width: var(--largeur);
  margin: 0 auto;
  padding: 0 24px;
}

.section { padding: 72px 0; }
.section--compacte { padding: 46px 0; }
.section--sombre { background: var(--nuit); color: var(--neige); }
.section--sombre h2, .section--sombre h3 { color: var(--blanc); }
.section--sombre a { color: #ffb38f; }
.section--blanche { background: var(--blanc); }
.section--terrain { background: linear-gradient(135deg, var(--mousse) 0%, var(--ciel) 100%); }

main > .heros + .section:not(.section--sombre),
main > .bandeau + .section:not(.section--sombre) {
  background: var(--blanc);
  border-top: 1px solid var(--ligne);
}

.page-hero {
  padding: 92px 0 72px;
  background: var(--nuit);
  color: var(--neige);
}

.page-hero h1 {
  max-width: 10em;
  color: var(--blanc);
}

.page-hero p {
  max-width: 760px;
  color: #d8dee5;
  font-size: clamp(1.08rem, 2vw, 1.3rem);
}

.page-hero--article {
  padding: 68px 0 56px;
  background:
    linear-gradient(135deg, rgba(22, 34, 47, 0.96), rgba(52, 65, 77, 0.88)),
    var(--nuit);
}

.page-hero--article h1 {
  max-width: 12em;
}

@media (max-width: 700px) {
  .page-hero {
    padding: 52px 0 44px;
  }
  .page-hero h1 {
    max-width: 12em;
    font-size: clamp(2.25rem, 12vw, 3.45rem);
  }
  .page-hero p {
    font-size: 1.02rem;
  }

  .page-hero--article {
    padding: 30px 0 28px;
  }

  .page-hero--article h1 {
    max-width: 15em;
    font-size: clamp(1.65rem, 8.3vw, 2.25rem);
    line-height: 1.02;
  }

  .page-hero--article p {
    font-size: 0.94rem;
    line-height: 1.45;
  }
}

.kicker {
  display: inline-block;
  font-family: var(--titres);
  font-weight: 600;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--apex-fonce);
  margin-bottom: 0.6em;
}
.section--sombre .kicker { color: var(--apex); }

/* Accent manuscrit — chaleur et authenticité (inspiration Pommeret) */
.accent-manuscrit {
  display: block;
  font-family: var(--manuscrite);
  font-weight: 600;
  font-size: clamp(1.6rem, 3.5vw, 2.2rem);
  text-transform: none;
  letter-spacing: 0;
  color: var(--apex);
  line-height: 1.1;
  margin-bottom: 0.3em;
}

.intro-section {
  max-width: 720px;
  font-size: 1.15rem;
  color: var(--gris);
}
.section--sombre .intro-section { color: #c4cdd6; }

.centre { text-align: center; }
.centre .intro-section { margin-left: auto; margin-right: auto; }

.section-entete {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 32px;
}
.section-entete h2,
.section-entete p {
  margin-bottom: 0;
}

.section-liens {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px 20px;
}

@media (max-width: 760px) {
  .section-entete {
    align-items: start;
    flex-direction: column;
  }

  .section-liens {
    justify-content: flex-start;
  }
}

/* ---------- Blocs de preuve ---------- */
.preuves-verifiees {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 42px;
  align-items: start;
}

.preuves-verifiees__intro {
  position: sticky;
  top: 104px;
}

.preuves-verifiees__intro p {
  color: var(--gris);
  font-size: 1.08rem;
}

.preuves-verifiees__liste {
  display: grid;
  gap: 1px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.preuve-ligne {
  display: grid;
  grid-template-columns: minmax(118px, 0.42fr) minmax(0, 1fr);
  gap: 22px;
  padding: 24px 28px;
  background: var(--blanc);
  min-width: 0;
}

.preuve-ligne strong {
  display: block;
  font-family: var(--titres);
  font-size: 1.35rem;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.preuve-ligne h3 {
  margin-bottom: 0.22em;
}

.preuve-ligne p {
  margin: 0;
  color: var(--gris);
}

.processus-mission {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: var(--ombre);
}

.processus-mission article {
  min-height: 260px;
  padding: 30px;
  background: var(--blanc);
}

.processus-mission span {
  display: block;
  margin-bottom: 22px;
  font-family: var(--titres);
  font-size: 2.3rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.42);
}

.processus-mission p {
  color: var(--gris);
  margin-bottom: 0;
}

/* ---------- Aiguillage accueil ---------- */
.section--orientation {
  background: var(--blanc);
  border-bottom: 1px solid var(--ligne);
}

.orientation-home {
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
  gap: 36px;
  align-items: start;
}

.orientation-home__intro {
  position: sticky;
  top: 104px;
}

.orientation-home__intro p {
  max-width: 440px;
  color: var(--gris);
  font-size: 1.04rem;
}

.orientation-home__liste {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.orientation-route {
  position: relative;
  min-height: 132px;
  padding: 22px 56px 22px 24px;
  background: var(--blanc);
  color: var(--encre);
  text-decoration: none;
}

.orientation-route::after {
  content: "→";
  position: absolute;
  right: 24px;
  top: 26px;
  color: var(--apex);
  font-family: var(--titres);
  font-size: 1.35rem;
  line-height: 1;
}

.orientation-route:hover,
.orientation-route:focus-visible {
  background: #fff8f4;
  outline: none;
}

.orientation-route:focus-visible {
  box-shadow: inset 0 0 0 3px var(--apex);
}

.orientation-route--accent {
  background: linear-gradient(135deg, rgba(240, 97, 42, 0.12), var(--blanc));
}

.orientation-route span {
  display: block;
  margin-bottom: 12px;
  font-family: var(--titres);
  font-size: 0.83rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.orientation-route strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--titres);
  font-size: clamp(1.25rem, 2.4vw, 1.55rem);
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--nuit);
}

.orientation-route em {
  display: block;
  color: var(--gris);
  font-style: normal;
  font-size: 0.96rem;
  line-height: 1.45;
}

@media (max-width: 900px) {
  .preuves-verifiees {
    grid-template-columns: 1fr;
  }
  .preuves-verifiees__intro {
    position: static;
  }
  .orientation-home {
    grid-template-columns: 1fr;
  }
  .orientation-home__intro {
    position: static;
  }
  .processus-mission {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .orientation-home {
    gap: 22px;
  }
  .orientation-home__liste {
    grid-template-columns: 1fr;
    box-shadow: none;
  }
  .orientation-route {
    min-height: 0;
    padding: 14px 46px 14px 18px;
  }
  .orientation-route::after {
    top: 17px;
    right: 18px;
    font-size: 1.15rem;
  }
  .orientation-route span {
    margin-bottom: 5px;
    font-size: 0.72rem;
  }
  .orientation-route strong {
    margin-bottom: 0;
    font-size: 1rem;
    line-height: 1.08;
  }
  .orientation-route em {
    display: none;
  }
  .preuve-ligne {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 22px;
  }
}

/* ---------- Bande communauté ---------- */
.communaute-band {
  display: grid;
  grid-template-columns: 0.85fr 1.55fr;
  gap: 44px;
  align-items: start;
}

.communaute-band h2 {
  margin-bottom: 0;
}

.promesses {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.promesse {
  position: relative;
  padding-left: 20px;
}

.promesse::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  border-radius: 2px;
  background: var(--apex);
}

.promesse h3 {
  margin-bottom: 0.35em;
  color: var(--nuit);
}

.promesse p {
  margin: 0;
  color: var(--roche);
  font-size: 0.98rem;
  line-height: 1.55;
}

@media (max-width: 920px) {
  .communaute-band,
  .promesses {
    grid-template-columns: 1fr;
  }
}

/* ---------- Saison / objectifs ---------- */
.saison-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  gap: 24px;
}

.objectif-majeur {
  min-height: 100%;
  padding: 34px;
  border-radius: var(--rayon);
  color: var(--blanc);
  background:
    linear-gradient(135deg, rgba(22, 34, 47, 0.94), rgba(31, 48, 64, 0.92)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  box-shadow: var(--ombre);
}

.objectif-majeur h3 {
  margin-top: 0.35em;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
}

.objectif-majeur p {
  max-width: 620px;
  color: #d8dee5;
}

.objectif-majeur dl {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 28px 0 0;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.16);
}

.objectif-majeur dl div {
  padding: 14px;
  background: rgba(255, 255, 255, 0.08);
}

.objectif-majeur dt {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #aeb9c4;
}

.objectif-majeur dd {
  margin: 4px 0 0;
  font-family: var(--titres);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
}

.rdv-liste {
  display: grid;
  gap: 14px;
}

.mini-evenement {
  padding: 20px 22px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.mini-evenement span {
  display: block;
  margin-bottom: 8px;
  font-family: var(--titres);
  font-weight: 700;
  color: var(--apex-fonce);
  text-transform: uppercase;
}

.mini-evenement h3 {
  margin-bottom: 0.25em;
  font-size: 1.35rem;
}

.mini-evenement p {
  margin: 0;
  color: var(--gris);
  font-size: 0.98rem;
}

.mini-evenement--resultat {
  border-color: rgba(46, 125, 91, 0.32);
  background: linear-gradient(135deg, rgba(46, 125, 91, 0.10), var(--blanc));
}

.mini-evenement--resultat span {
  color: var(--vert);
}

@media (max-width: 860px) {
  .saison-home {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .objectif-majeur {
    padding: 26px;
  }
  .objectif-majeur dl {
    grid-template-columns: 1fr;
  }
}

/* ---------- Performances ---------- */
.performance-grille {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 32px;
}

.performance-card {
  min-height: 220px;
  padding: 26px;
  border-radius: var(--rayon);
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.06);
  display: flex;
  flex-direction: column;
}

.performance-card span {
  display: block;
  margin-bottom: 18px;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex);
}

.performance-card strong {
  display: block;
  margin-bottom: 12px;
  font-family: var(--titres);
  font-size: clamp(1.6rem, 3vw, 2.15rem);
  line-height: 0.95;
  text-transform: uppercase;
  color: var(--blanc);
}

.performance-card p {
  margin: 0 0 18px;
  color: #c4cdd6;
  font-size: 0.98rem;
  line-height: 1.55;
}

.performance-card__trace {
  display: block;
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.statut-preuve {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.statut-preuve article {
  min-width: 0;
  min-height: 230px;
  padding: 26px;
  background: var(--blanc);
}

.statut-preuve span {
  display: block;
  margin-bottom: 18px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.statut-preuve h3 {
  margin-bottom: 12px;
}

.statut-preuve p {
  margin-bottom: 0;
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}

.statut-preuve--sombre {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.12);
  box-shadow: none;
}

.statut-preuve--sombre article {
  background: rgba(255, 255, 255, 0.06);
}

.statut-preuve--sombre h3 {
  color: var(--blanc);
}

.statut-preuve--sombre p {
  color: #c4cdd6;
}

.statut-preuve--sombre span {
  color: var(--apex);
}

.chiffres--sombre {
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

@media (max-width: 940px) {
  .performance-grille {
    grid-template-columns: repeat(2, 1fr);
  }

  .statut-preuve {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.carnet-saison {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  gap: 24px;
  margin-top: 34px;
}

.carnet-saison__principal {
  position: relative;
  min-height: 520px;
  border-radius: var(--rayon);
  overflow: hidden;
  color: var(--blanc);
  box-shadow: 0 22px 54px rgba(22, 34, 47, 0.22);
}

.carnet-saison__fond {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.10) 0%, rgba(8, 13, 18, 0.92) 100%),
    linear-gradient(90deg, rgba(8, 13, 18, 0.76), rgba(8, 13, 18, 0.18)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
}

.carnet-saison__contenu {
  position: relative;
  z-index: 1;
  min-height: 520px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding: 38px;
}

.carnet-saison__contenu h3 {
  max-width: 8em;
  margin-top: 14px;
  font-size: clamp(2.3rem, 5vw, 4.2rem);
  color: var(--blanc);
}

.carnet-saison__contenu p {
  max-width: 560px;
  color: #d8dee5;
  font-size: 1.08rem;
}

.carnet-saison__contenu dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  width: min(100%, 620px);
  margin: 22px 0 26px;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.14);
}

.carnet-saison__contenu dl div {
  padding: 14px;
  background: rgba(255, 255, 255, 0.10);
}

.carnet-saison__contenu dt {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #aeb9c4;
}

.carnet-saison__contenu dd {
  margin: 4px 0 0;
  font-family: var(--titres);
  font-weight: 700;
  text-transform: uppercase;
  color: var(--blanc);
}

.carnet-saison__pile {
  display: grid;
  gap: 18px;
}

.carnet-etape {
  position: relative;
  min-height: 250px;
  display: grid;
  grid-template-columns: 112px 1fr;
  gap: 22px;
  align-items: start;
  padding: 26px;
  border-radius: var(--rayon);
  border: 1px solid rgba(22, 34, 47, 0.12);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: var(--ombre);
  overflow: hidden;
}

.carnet-etape::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 5px;
  background: var(--apex);
}

.carnet-etape--impact::after {
  background: var(--vert);
}

.carnet-etape__date {
  font-family: var(--titres);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.carnet-etape h3 {
  margin: 14px 0 0.35em;
  color: var(--nuit);
}

.carnet-etape p {
  color: var(--gris);
}

@media (max-width: 900px) {
  .carnet-saison {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .carnet-saison__principal,
  .carnet-saison__contenu {
    min-height: 440px;
  }
  .carnet-saison__contenu {
    padding: 28px;
  }
  .carnet-saison__contenu dl,
  .carnet-etape {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .performance-grille {
    grid-template-columns: 1fr;
  }

  .statut-preuve {
    grid-template-columns: 1fr;
  }

  .statut-preuve article {
    min-height: 0;
    padding: 24px;
  }
}

/* ---------- Clan / lead magnet ---------- */
.clan-home {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.8fr);
  gap: 46px;
  align-items: start;
}

.promesses--liste {
  grid-template-columns: 1fr;
  margin-top: 30px;
}

.lead-magnet,
.media-kit {
  padding: 30px;
  border-radius: var(--rayon);
  background: var(--blanc);
  border: 1px solid rgba(22, 34, 47, 0.10);
  box-shadow: var(--ombre);
}

.lead-magnet h3,
.media-kit h3 {
  margin-top: 0.45em;
}

.lead-magnet p {
  color: var(--gris);
}

.newsletter-form--sombre {
  justify-content: start;
}

.newsletter-form--sombre input[type="email"] {
  background: var(--blanc);
  color: var(--encre);
  border-color: var(--ligne);
}

.clan-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.clan-actions a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(22, 34, 47, 0.08);
  color: var(--apex-fonce);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
}

.clan-actions a:hover {
  background: rgba(240, 97, 42, 0.12);
  color: var(--apex-fonce);
}

.clan-preuves {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr);
  gap: 46px;
  align-items: start;
}

.clan-preuves__intro {
  position: sticky;
  top: 92px;
}

.clan-preuves__intro p {
  color: var(--gris);
}

.clan-preuves__grille {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.clan-preuves__grille article {
  display: grid;
  gap: 12px;
  min-height: 260px;
  padding: 26px;
  background: var(--blanc);
}

.clan-preuves__grille span {
  font-family: var(--titres);
  font-size: 2.1rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.45);
}

.clan-preuves__grille h3 {
  margin: 0;
}

.clan-preuves__grille p {
  margin: 0;
  color: var(--gris);
}

.clan-preuves__grille strong {
  align-self: end;
  font-size: 0.82rem;
  line-height: 1.35;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.clan-rituels {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.clan-rituels article {
  min-height: 250px;
  padding: 30px;
  border-radius: var(--rayon);
  background: var(--blanc);
  border: 1px solid rgba(22, 34, 47, 0.10);
  box-shadow: var(--ombre);
}

.clan-rituels span {
  display: inline-flex;
  margin-bottom: 20px;
  padding: 7px 13px;
  border-radius: 999px;
  background: rgba(223, 232, 221, 0.85);
  color: #2f6148;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.clan-rituels p {
  color: var(--gris);
}

@media (max-width: 860px) {
  .clan-home {
    grid-template-columns: 1fr;
  }

  .clan-preuves {
    grid-template-columns: 1fr;
  }

  .clan-preuves__intro {
    position: static;
  }

  .clan-rituels {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .clan-preuves__grille {
    grid-template-columns: 1fr;
  }

  .clan-preuves__grille article,
  .clan-rituels article {
    min-height: 0;
    padding: 24px;
  }
}

/* ---------- Boutons ---------- */
.btn {
  display: inline-block;
  font-family: var(--titres);
  font-weight: 600;
  font-size: 1.15rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.75em 1.8em;
  border-radius: 999px;
  border: 2px solid transparent;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.btn:hover { transform: translateY(-2px); }

.btn--plein {
  background: var(--apex);
  color: var(--nuit);
}
.btn--plein:hover { background: #ff7a42; color: var(--nuit); }

.btn--contour {
  background: transparent;
  color: var(--blanc);
  border-color: rgba(255, 255, 255, 0.6);
}
.btn--contour:hover { border-color: var(--apex); color: var(--apex); }

.btn--contour-sombre {
  background: transparent;
  color: var(--nuit);
  border-color: var(--nuit);
}
.btn--contour-sombre:hover { color: var(--apex-fonce); border-color: var(--apex-fonce); }

/* ---------- En-tête ---------- */
.entete {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--nuit);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.entete__inner {
  max-width: var(--largeur);
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: var(--hauteur-header);
}

.logo {
  display: inline-flex;
  align-items: center;
  flex: 0 1 clamp(220px, 22vw, 300px);
  width: clamp(220px, 22vw, 300px);
  min-width: 0;
  text-decoration: none;
  color: var(--blanc);
  line-height: 0;
}
.logo__crop {
  display: block;
  width: 100%;
  aspect-ratio: 1100 / 306;
  overflow: hidden;
}

.logo__image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: left center;
}
.nav-toggle {
  display: none;
  background: none;
  border: 2px solid rgba(255,255,255,0.4);
  border-radius: 8px;
  color: var(--blanc);
  font: inherit;
  line-height: 1;
  padding: 8px 12px;
  cursor: pointer;
  white-space: nowrap;
}

.nav {
  flex: 0 0 auto;
}

.nav ul {
  list-style: none;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
}

.nav__item {
  position: relative;
}

.nav__mobile {
  display: none;
}

.nav a {
  display: block;
  font-family: var(--titres);
  font-weight: 600;
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #d8dee5;
  text-decoration: none;
  padding: 10px 10px;
  border-radius: 8px;
}
.nav a:hover { color: var(--blanc); background: rgba(255,255,255,0.07); }
.nav a[aria-current="page"],
.nav a.is-active {
  color: var(--apex);
}
.nav a.nav__cta {
  background: var(--apex);
  color: var(--nuit);
}
.nav a.nav__cta:hover,
.nav a.nav__cta[aria-current="page"] {
  background: #ff7a42;
  color: var(--nuit);
}

.nav__panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(300px, calc(100vw - 48px));
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--rayon);
  background: rgba(22, 34, 47, 0.98);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.28);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
  visibility: hidden;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}

.nav__item:hover .nav__panel,
.nav__item:focus-within .nav__panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  visibility: visible;
}

.nav__panel a {
  padding: 10px 12px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.04);
}

.nav__panel a span {
  display: block;
  color: inherit;
  line-height: 1.1;
}

.nav__panel a small {
  display: block;
  margin-top: 3px;
  color: #aeb9c4;
  font-family: var(--texte);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.35;
  text-transform: none;
}

@media (max-width: 1100px) {
  .entete__inner {
    gap: 16px;
    padding: 0 20px;
  }
  .logo {
    flex-basis: min(54vw, 230px);
    width: min(54vw, 230px);
  }
  .nav-toggle {
    display: block;
    flex: 0 0 auto;
  }
  .nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--nuit);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 8px 24px 20px;
    max-height: calc(100vh - var(--hauteur-header));
    overflow-y: auto;
  }
  .nav.ouvert { display: block; }
  .nav .nav__desktop { display: none; }
  .nav__panel { display: none; }
  .nav__mobile {
    display: grid;
    gap: 18px;
  }
  .nav__mobile-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .nav__mobile-actions a {
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    text-align: center;
  }
  .nav__groupe {
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
  }
  .nav__groupe p {
    margin: 0 0 10px;
    font-family: var(--titres);
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--apex);
  }
  .nav__groupe ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
    gap: 8px;
  }
  .nav a {
    font-size: 1rem;
    padding: 11px 12px;
    background: rgba(255, 255, 255, 0.04);
  }
  .nav a.nav__cta {
    text-align: center;
  }
  .nav a[aria-current="page"] {
    background: rgba(240, 97, 42, 0.14);
  }
}

@media (max-width: 420px) {
  .entete__inner {
    gap: 10px;
    padding: 0 14px;
  }
  .logo {
    flex-basis: min(56vw, 210px);
    width: min(56vw, 210px);
  }
  .nav-toggle {
    padding: 7px 10px;
    font-size: 0.95rem;
  }
}

@media (max-width: 360px) {
  .logo {
    flex-basis: 178px;
    width: 178px;
  }
  .nav-toggle {
    padding: 7px 9px;
  }
}

/* ---------- Héros (accueil) ---------- */
.heros {
  position: relative;
  background:
    linear-gradient(90deg, rgba(9, 15, 22, 0.86) 0%, rgba(12, 20, 29, 0.72) 46%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.25) 0%, rgba(12, 20, 29, 0.88) 100%),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  color: var(--blanc);
  overflow: hidden;
}

.heros::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 18% 24%, rgba(240, 97, 42, 0.24), transparent 70%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.62));
  pointer-events: none;
}

.heros__inner {
  position: relative;
  z-index: 2;
  max-width: var(--largeur);
  margin: 0 auto;
  padding: 96px 24px 88px;
  min-height: var(--hauteur-cover);
  display: grid;
  grid-template-columns: minmax(0, 780px);
  align-items: end;
  justify-content: start;
}

.kicker--clair,
.heros .kicker {
  color: #ffb38f;
}

.heros__contenu {
  max-width: 760px;
}

.heros h1 {
  max-width: 8em;
  margin: 0 0 0.16em;
  font-size: clamp(3.2rem, 9vw, 6.35rem);
  line-height: 0.88;
  text-shadow: 0 6px 34px rgba(0, 0, 0, 0.52);
}

.heros__promesse {
  max-width: 610px;
  margin: 0 0 0.55em;
  font-family: var(--titres);
  font-size: clamp(1.55rem, 3.2vw, 2.35rem);
  font-weight: 600;
  line-height: 1.05;
  text-transform: uppercase;
  color: #f5f0e8;
  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.44);
}
.heros__promesse em {
  font-style: normal;
  color: var(--apex);
}

.heros__sous-titre {
  max-width: 560px;
  margin: 0 0 1.35em;
  font-size: clamp(1.02rem, 1.4vw, 1.18rem);
  color: #e0e6ec;
}

.heros__actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.heros__preuve {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--rayon);
  background: rgba(12, 20, 29, 0.68);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 18px;
}

.heros__preuve-label {
  display: block;
  margin-bottom: 14px;
  font-family: var(--titres);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--apex);
}

.heros__preuve-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.heros__preuve-grid div {
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.heros__preuve-grid div:last-child {
  grid-column: 1 / -1;
  border-bottom: 0;
}

.heros__preuve-grid strong {
  display: block;
  font-family: var(--titres);
  font-size: 1.05rem;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--blanc);
}

.heros__preuve-grid span {
  display: block;
  margin-top: 4px;
  color: #cdd6df;
  font-size: 0.86rem;
  line-height: 1.45;
}

.heros__logos {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.heros__logos > span {
  display: block;
  margin-bottom: 10px;
  color: #aeb9c4;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.heros__logos > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.heros__logos img {
  width: 100%;
  height: 54px;
  object-fit: contain;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.94);
  padding: 12px;
}

.heros__piliers {
  position: relative;
  z-index: 2;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(12, 20, 29, 0.76);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.home-reperes__inner {
  display: grid;
  gap: 28px;
}

.home-reperes__intro {
  max-width: 560px;
}

.home-reperes__intro h2 {
  margin-bottom: 0;
}

.home-reperes__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
  gap: 24px;
  align-items: stretch;
}

.home-reperes .piliers-rapides {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--rayon);
}

.home-reperes .piliers-rapides div {
  min-height: 100%;
}

.home-reperes .heros__preuve {
  height: 100%;
}

.piliers-rapides {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
}

.piliers-rapides div {
  min-height: 76px;
  padding: 17px 18px;
  background: rgba(255, 255, 255, 0.05);
}

.piliers-rapides strong {
  display: block;
  margin-bottom: 6px;
  font-family: var(--titres);
  font-size: 1.1rem;
  line-height: 1;
  color: var(--apex);
}

.piliers-rapides span {
  display: block;
  font-family: var(--titres);
  font-weight: 600;
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--blanc);
}

@media (max-width: 980px) {
  .heros__inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .heros__preuve {
    max-width: 620px;
  }
  .home-reperes__content {
    grid-template-columns: 1fr;
  }
  .piliers-rapides {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 700px) {
  .heros {
    background-position: 58% center;
  }
  .heros__inner {
    min-height: var(--hauteur-cover-mobile);
    padding: 64px 20px 48px;
  }
  .heros h1 {
    max-width: 100%;
    font-size: clamp(2.5rem, 13vw, 3.6rem);
    line-height: 0.92;
  }
  .heros__sous-titre {
    margin-bottom: 1.25em;
    font-size: 0.99rem;
  }
  .heros__actions {
    gap: 10px;
  }
  .home-reperes__content,
  .home-reperes .piliers-rapides,
  .piliers-rapides {
    grid-template-columns: 1fr;
  }
}

/* ---------- Bandeau de page intérieure ---------- */
.bandeau {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: var(--hauteur-cover);
  background:
    linear-gradient(90deg, rgba(9, 15, 22, 0.9) 0%, rgba(12, 20, 29, 0.68) 50%, rgba(12, 20, 29, 0.34) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.1) 0%, rgba(12, 20, 29, 0.78) 100%),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat,
    var(--nuit);
  color: var(--blanc);
  overflow: hidden;
}
.bandeau__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--largeur);
  margin: 0 auto;
  padding: 96px 24px 88px;
}
.bandeau .kicker { color: var(--apex); }
.bandeau h1 {
  max-width: 11em;
  margin-bottom: 0.2em;
  font-size: clamp(3rem, 7.2vw, 5.8rem);
  line-height: 0.9;
  text-shadow: 0 6px 34px rgba(0, 0, 0, 0.52);
}
.bandeau p {
  max-width: 560px;
  font-size: clamp(1.02rem, 1.6vw, 1.2rem);
  color: #e0e6ec;
  margin-bottom: 0;
}
.bandeau .kit-actions {
  margin-top: 1.35rem;
}
.bandeau__montagnes {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  z-index: 1;
  width: 100%;
  height: auto;
  opacity: 0.55;
  pointer-events: none;
}

@media (max-width: 700px) {
  .bandeau {
    min-height: var(--hauteur-cover-mobile);
  }
  .bandeau__inner {
    padding: 64px 20px 48px;
  }
  .bandeau h1 {
    font-size: clamp(2.65rem, 14vw, 4rem);
    line-height: 0.92;
  }
  .bandeau p {
    font-size: 1rem;
    line-height: 1.5;
  }
  .bandeau .kit-actions {
    gap: 10px;
    margin-top: 18px;
  }
  .bandeau .btn {
    font-size: 0.98rem;
    padding: 0.68em 1.25em;
  }
  .bandeau__preuves {
    grid-template-columns: 1fr;
  }
}

.bandeau__preuves {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: 880px;
  margin-top: 34px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--rayon);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.12);
  box-shadow: 0 22px 50px rgba(0, 0, 0, 0.20);
}

.page-reperes .bandeau__preuves {
  margin-top: 24px;
}

.bandeau__preuves div {
  padding: 18px 20px;
  background: rgba(255, 255, 255, 0.07);
}

.bandeau__preuves strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--titres);
  font-size: 1.25rem;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--blanc);
}

.bandeau__preuves span {
  display: block;
  color: #c4cdd6;
  font-size: 0.94rem;
  line-height: 1.45;
}

main > .bandeau + .section--sombre.page-reperes {
  background: var(--blanc);
  color: var(--encre);
}

main > .bandeau + .section--sombre.page-reperes h2,
main > .bandeau + .section--sombre.page-reperes h3 {
  color: var(--encre);
}

main > .bandeau + .section--sombre.page-reperes .kicker {
  color: var(--apex-fonce);
}

main > .bandeau + .section--sombre.page-reperes .intro-section {
  color: var(--gris);
}

main > .bandeau + .section--sombre.page-reperes .bandeau__preuves {
  border-color: var(--ligne);
  background: var(--ligne);
  box-shadow: var(--ombre);
}

main > .bandeau + .section--sombre.page-reperes .bandeau__preuves div {
  background: var(--blanc);
}

main > .bandeau + .section--sombre.page-reperes .bandeau__preuves strong {
  color: var(--encre);
}

main > .bandeau + .section--sombre.page-reperes .bandeau__preuves span {
  color: var(--gris);
}

@media (max-width: 720px) {
  .bandeau__preuves {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .bandeau__preuves {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 16px;
  }

  .bandeau__preuves div {
    padding: 10px 8px;
  }

  .bandeau__preuves strong {
    margin-bottom: 0;
    font-size: 0.82rem;
    line-height: 1.1;
  }

  .bandeau__preuves span {
    display: none;
  }

  .page-reperes .bandeau__preuves {
    grid-template-columns: 1fr;
  }
}

/* ---------- Grilles de cartes ---------- */
.grille {
  display: grid;
  gap: 24px;
  margin-top: 40px;
}
.grille--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grille--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grille--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grille--5 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }

@media (max-width: 900px) {
  .grille--3, .grille--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 620px) {
  .grille--2, .grille--3, .grille--4 { grid-template-columns: 1fr; }
}

.carte {
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  padding: 28px;
  box-shadow: var(--ombre);
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.carte h3 { margin-top: 0.2em; }
.carte p:last-child { margin-bottom: 0; }
.carte ul { margin: 0 0 1em; color: var(--gris); }
.carte .btn, .carte .lien-suite { margin-top: auto; align-self: flex-start; }
section[id] { scroll-margin-top: 92px; }

.carte--persona {
  position: relative;
  padding: 24px;
  border-radius: var(--rayon);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(22, 34, 47, 0.08);
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.carte--persona::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--apex);
}
.carte--persona .badge {
  align-self: flex-start;
  margin-bottom: 12px;
}
.carte--persona h3 {
  font-family: var(--texte);
  font-size: 1.18rem;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: none;
  color: var(--encre);
  margin-bottom: 0.7em;
}
.carte--persona p {
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}
.carte--persona .lien-suite {
  font-family: var(--texte);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
}
.carte--persona .lien-suite::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.carte--persona:hover,
.carte--persona:focus-within {
  border-color: rgba(240, 97, 42, 0.55);
  box-shadow: 0 16px 36px rgba(22, 34, 47, 0.14);
  transform: translateY(-2px);
}
.carte--persona:focus-within {
  outline: 3px solid var(--apex);
  outline-offset: 4px;
}
.carte--persona .lien-suite:focus-visible {
  outline: none;
}

.section--sombre .carte {
  background: var(--nuit-2);
  border-color: rgba(255,255,255,0.08);
  color: #d8dee5;
}
.section--sombre .carte--persona p { color: #c4cdd6; }

.chantiers-para {
  display: grid;
  gap: 1px;
  margin-top: 40px;
  background: var(--ligne);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  box-shadow: var(--ombre);
}

.chantier-para {
  display: grid;
  grid-template-columns: 96px minmax(180px, 0.62fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  position: relative;
  padding: 30px;
  background: var(--blanc);
}

.chantier-para::before {
  content: attr(data-step);
  grid-row: 1 / span 2;
  font-family: var(--titres);
  font-size: clamp(2.6rem, 5vw, 4.6rem);
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.24);
}

.chantier-para span {
  grid-column: 2;
  grid-row: 1;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.chantier-para h3 {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
}

.chantier-para p {
  grid-column: 3;
  grid-row: 1 / span 2;
  margin: 0;
  color: var(--gris);
}

.media-dossier {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 40px;
  background: var(--ligne);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  box-shadow: var(--ombre);
}

.media-ressource {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding: 28px;
  background: var(--blanc);
}

.media-ressource .badge {
  align-self: start;
}

.media-ressource h3 {
  margin-top: 0;
}

.media-ressource p {
  margin-bottom: 0;
  color: var(--gris);
}

.media-orientation {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.media-orientation article {
  min-width: 0;
  min-height: 310px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background: var(--blanc);
}

.media-orientation__accent {
  background:
    linear-gradient(135deg, rgba(240, 97, 42, 0.14), rgba(255,255,255,0.94)),
    var(--blanc);
}

.media-orientation span {
  margin-bottom: 20px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.media-orientation h3 {
  margin-bottom: 14px;
}

.media-orientation p {
  margin-bottom: 24px;
  color: var(--gris);
  line-height: 1.58;
}

.media-orientation .lien-suite {
  margin-top: auto;
}

@media (max-width: 760px) {
  .chantier-para {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 26px;
  }

  .chantier-para::before {
    grid-row: auto;
    font-size: 3.2rem;
  }

  .chantier-para span,
  .chantier-para h3,
  .chantier-para p {
    grid-column: auto;
    grid-row: auto;
  }

  .media-dossier {
    grid-template-columns: 1fr;
  }

  .media-ressource {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 24px;
  }

  .media-orientation {
    grid-template-columns: 1fr;
  }

  .media-orientation article {
    min-height: 0;
    padding: 24px;
  }
}

.vision-mission {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 36px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.vision-mission article {
  min-height: 260px;
  padding: 34px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(244, 243, 238, 0.90)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
}

.vision-mission article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(22, 34, 47, 0.94), rgba(31, 48, 64, 0.88)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  color: var(--blanc);
}

.vision-mission span,
.ecosysteme-item span,
.avenir-rail span,
.engagement-ligne span {
  display: inline-block;
  margin-bottom: 14px;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.vision-mission article:nth-child(2) span,
.vision-mission article:nth-child(2) h3 {
  color: var(--apex);
}

.vision-mission article:nth-child(2) p {
  color: #d8dee5;
}

.section--positionnement {
  background: var(--nuit);
  color: var(--neige);
}

.positionnement-projet {
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(0, 1.05fr);
  gap: 34px;
  align-items: stretch;
}

.positionnement-projet__phrase {
  padding: 34px;
  border-radius: var(--rayon);
  background:
    linear-gradient(135deg, rgba(22, 34, 47, 0.88), rgba(31, 48, 64, 0.74)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  box-shadow: var(--ombre);
}

.positionnement-projet__phrase h2 {
  color: var(--blanc);
  font-size: clamp(1.85rem, 3.4vw, 2.85rem);
  line-height: 1.04;
}

.positionnement-projet__phrase p {
  max-width: 680px;
  color: #d8dee5;
}

.positionnement-projet__cartes {
  display: grid;
  gap: 1px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: var(--ombre);
}

.positionnement-projet__cartes article {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  min-height: 132px;
  padding: 24px 28px;
  background: rgba(255, 255, 255, 0.08);
}

.positionnement-projet__cartes span {
  font-family: var(--titres);
  font-size: 1.28rem;
  font-weight: 700;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--apex);
}

.positionnement-projet__cartes p {
  margin: 0;
  color: #d8dee5;
}

.ecosysteme-projet {
  display: grid;
  grid-template-columns: minmax(280px, 0.74fr) minmax(0, 1.26fr);
  gap: 32px;
  align-items: stretch;
  margin-top: 34px;
}

.ecosysteme-projet__centre {
  min-height: 460px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding: 34px;
  border-radius: var(--rayon);
  color: var(--blanc);
  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.08), rgba(8, 13, 18, 0.90)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  box-shadow: var(--ombre);
}

.ecosysteme-projet__centre span {
  font-family: var(--titres);
  font-weight: 700;
  color: var(--apex);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.ecosysteme-projet__centre h3 {
  margin-top: 12px;
  color: var(--blanc);
  font-size: clamp(2rem, 4vw, 3.2rem);
}

.ecosysteme-projet__centre p {
  color: #d8dee5;
  margin-bottom: 0;
}

.ecosysteme-projet__liste {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.ecosysteme-item {
  min-height: 210px;
  padding: 26px;
  background: var(--blanc);
}

.ecosysteme-item h3 {
  margin-bottom: 0.35em;
}

.ecosysteme-item p {
  margin-bottom: 0;
  color: var(--gris);
  font-size: 0.98rem;
}

.avenir-rails {
  display: grid;
  gap: 14px;
  margin-top: 34px;
}

.avenir-rail {
  display: grid;
  grid-template-columns: 160px minmax(180px, 0.55fr) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 24px 28px;
  border-radius: var(--rayon);
  border: 1px solid var(--ligne);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.avenir-rail span,
.avenir-rail h3,
.avenir-rail p {
  margin-bottom: 0;
}

.avenir-rail span {
  color: var(--apex-fonce) !important;
}

.avenir-rail h3 {
  color: var(--nuit) !important;
}

.avenir-rail p {
  color: var(--gris) !important;
}

.engagements-terrain {
  display: grid;
  gap: 1px;
  margin-top: 36px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.engagement-ligne {
  display: grid;
  grid-template-columns: 170px minmax(220px, 0.55fr) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding: 24px 28px;
  background: var(--blanc);
}

.engagement-ligne--forte {
  color: var(--blanc);
  background:
    linear-gradient(135deg, rgba(22, 34, 47, 0.94), rgba(31, 48, 64, 0.90)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
}

.engagement-ligne span,
.engagement-ligne h3,
.engagement-ligne p {
  margin-bottom: 0;
}

.engagement-ligne--forte span,
.engagement-ligne--forte h3 {
  color: var(--apex);
}

.engagement-ligne p {
  color: var(--gris);
}

.engagement-ligne--forte p {
  color: #d8dee5;
}

@media (max-width: 900px) {
  .vision-mission,
  .positionnement-projet,
  .ecosysteme-projet,
  .ecosysteme-projet__liste {
    grid-template-columns: 1fr;
  }

  .positionnement-projet__cartes article {
    grid-template-columns: 1fr;
    gap: 10px;
    min-height: 0;
  }

  .avenir-rail,
  .engagement-ligne {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

.roadbook {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 32px;
}

.roadbook__item {
  position: relative;
  min-height: 260px;
  padding: 30px 28px;
  border: 1px solid rgba(22, 34, 47, 0.10);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
  overflow: hidden;
}

.roadbook__item::before {
  content: attr(data-step);
  position: absolute;
  right: 18px;
  top: 12px;
  font-family: var(--titres);
  font-size: 4.8rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.10);
}

.roadbook__item span {
  display: inline-block;
  margin-bottom: 18px;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.roadbook__item h3 {
  position: relative;
  max-width: 12em;
}

.roadbook__item p {
  position: relative;
  margin: 0;
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .roadbook {
    grid-template-columns: 1fr;
  }
}

.offres-synthese {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 34px;
}

.offres-synthese article {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  min-height: 0;
  padding: 30px;
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  box-shadow: 0 18px 42px rgba(22, 34, 47, 0.08);
}

.offres-synthese__accent {
  border-color: rgba(240, 97, 42, 0.34) !important;
  background: linear-gradient(135deg, rgba(240, 97, 42, 0.12), var(--blanc)) !important;
}

.offres-synthese span {
  display: block;
  font-family: var(--titres);
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.offres-synthese h3 {
  max-width: 9.5em;
  margin: 0;
}

.offres-synthese__resume {
  margin: 0;
  color: var(--gris);
  font-size: 1rem;
  line-height: 1.55;
}

.offres-synthese dl {
  display: grid;
  gap: 0;
  margin: 2px 0 0;
  border-top: 1px solid var(--ligne);
}

.offres-synthese dl div {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(227, 224, 216, 0.76);
}

.offres-synthese dt {
  font-weight: 800;
  color: var(--encre);
}

.offres-synthese dd {
  margin: 2px 0 0;
  color: var(--gris);
  font-size: 0.96rem;
  line-height: 1.48;
}

.offres-synthese__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: center;
  margin-top: auto;
}

.offres-synthese .btn {
  align-self: flex-start;
  padding: 0.62em 1.28em;
  font-size: 0.98rem;
}

.offres-synthese .lien-suite {
  font-size: 0.98rem;
}

.choix-prestations {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.choix-prestations article {
  min-width: 0;
  padding: 26px;
  background: var(--blanc);
}

.choix-prestations span,
.usages-locaux span {
  display: block;
  margin-bottom: 10px;
  font-family: var(--titres);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--vert);
}

.choix-prestations h3 {
  max-width: 8.5em;
  margin-bottom: 18px;
}

.choix-prestations dl {
  display: grid;
  gap: 12px;
  margin: 0;
}

.choix-prestations dl div {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 12px;
}

.choix-prestations dt {
  font-weight: 800;
  color: var(--encre);
}

.choix-prestations dd {
  margin: 0;
  color: var(--gris);
  line-height: 1.5;
}

.offre-detail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 18px;
  margin: 24px 0 28px;
}
.offre-detail > div {
  border-left: 4px solid rgba(240, 97, 42, 0.45);
  padding-left: 18px;
}
.offre-detail h3 {
  font-family: var(--texte);
  font-size: 0.98rem;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
  color: var(--encre);
  margin: 0 0 4px;
}
.offre-detail p {
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
  margin: 0;
}

.usages-locaux {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.usages-locaux article {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
  padding: 26px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--neige);
}

.usages-locaux h3 {
  max-width: 9.5em;
}

.usages-locaux p {
  color: var(--gris);
  line-height: 1.58;
}

.usages-locaux .lien-suite {
  margin-top: auto;
}

@media (max-width: 980px) {
  .offres-synthese {
    grid-template-columns: 1fr;
  }
  .offres-synthese article {
    padding: 22px;
  }
  .offres-synthese dl {
    margin-bottom: 18px;
  }
  .choix-prestations,
  .usages-locaux {
    grid-template-columns: 1fr;
  }
  .offre-detail {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .offres-synthese dl div,
  .choix-prestations dl div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.carte__icone {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  background: rgba(240, 97, 42, 0.12);
  color: var(--apex-fonce);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.carte__icone svg { width: 28px; height: 28px; }
.section--sombre .carte__icone { background: rgba(240, 97, 42, 0.18); color: var(--apex); }

.lien-suite {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-family: var(--titres);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
}
.lien-suite::after { content: " →"; }

/* ---------- Photo / image à venir ---------- */
.photo-placeholder {
  border-radius: var(--rayon);
  background:
    linear-gradient(160deg, rgba(22,34,47,0.85), rgba(42,64,90,0.85)),
    repeating-linear-gradient(45deg, #2a405a 0 14px, #24374d 14px 28px);
  color: #aeb9c4;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--titres);
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  min-height: 260px;
  padding: 20px;
}
.photo-placeholder--haute { min-height: 380px; }

.media-photo {
  display: block;
  min-height: 260px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--nuit);
}

.media-photo img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
}

.media-photo--haute {
  min-height: 380px;
}

.polaroid .media-photo {
  border-radius: 4px;
}

/* Variante « polaroid » — cadre photo chaleureux (inspiration Pommeret) */
.polaroid {
  background: var(--blanc);
  padding: 16px 16px 18px;
  border-radius: 6px;
  box-shadow: 0 14px 40px rgba(22, 34, 47, 0.22);
  transform: rotate(-2deg);
  transition: transform 0.25s ease;
}
.polaroid:hover { transform: rotate(0deg) scale(1.01); }
.polaroid .photo-placeholder { border-radius: 4px; }
.polaroid__legende {
  font-family: var(--manuscrite);
  font-weight: 600;
  font-size: 1.5rem;
  color: var(--encre);
  text-align: center;
  margin: 12px 0 0;
}

/* ---------- Bande de chiffres ---------- */
.recit-court {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin: 54px 0 0;
  padding: 0;
  list-style: none;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.recit-court li {
  min-width: 0;
  min-height: 186px;
  padding: 24px;
  background: var(--blanc);
}

.recit-court span {
  display: block;
  margin-bottom: 18px;
  font-family: var(--titres);
  font-weight: 700;
  color: var(--apex-fonce);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  overflow-wrap: anywhere;
}

.recit-court strong {
  display: block;
  margin-bottom: 8px;
  font-family: var(--titres);
  font-size: 1.35rem;
  line-height: 1.05;
  color: var(--nuit);
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.recit-court p {
  margin: 0;
  color: var(--gris);
  font-size: 0.96rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.recit-court--5 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
}

.recit-court--6 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.chiffres {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 48px;
  text-align: center;
}
@media (max-width: 900px) {
  .recit-court,
  .chiffres {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 1100px) {
  .article-page .recit-court {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .recit-court,
  .chiffres {
    grid-template-columns: 1fr;
  }
}

.chiffre__valeur {
  font-family: var(--titres);
  font-weight: 700;
  font-size: 2.6rem;
  color: var(--apex);
  line-height: 1;
}
.chiffre__legende {
  color: var(--gris);
  font-size: 0.95rem;
  margin-top: 6px;
}
.section--sombre .chiffre__legende { color: #aeb9c4; }

/* ---------- Frise chronologique (Mon histoire) ---------- */
.frise {
  list-style: none;
  margin: 48px 0 0;
  padding: 0;
  position: relative;
}
.frise::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 6px;
  bottom: 6px;
  width: 3px;
  background: var(--ligne);
  border-radius: 2px;
}
.frise li {
  position: relative;
  padding: 0 0 36px 52px;
}
.frise li:last-child { padding-bottom: 0; }
.frise li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 6px;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: var(--apex);
  border: 4px solid var(--neige);
  box-shadow: 0 0 0 2px var(--apex);
}
.frise__date {
  font-family: var(--titres);
  font-weight: 700;
  font-size: 1.3rem;
  text-transform: uppercase;
  color: var(--apex-fonce);
}
.frise h3 { margin: 0.1em 0 0.3em; }
.frise p { color: var(--gris); margin-bottom: 0; max-width: 640px; }

/* ---------- Citation ---------- */
.citation {
  border-left: 5px solid var(--apex);
  background: var(--blanc);
  border-radius: 0 var(--rayon) var(--rayon) 0;
  padding: 28px 32px;
  margin: 48px 0 0;
  box-shadow: var(--ombre);
}
.citation p {
  font-family: var(--titres);
  font-size: 1.6rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin: 0;
}
.citation footer {
  font-family: var(--manuscrite);
  font-weight: 600;
  font-size: 1.4rem;
  color: var(--apex-fonce);
  margin-top: 10px;
}

/* ---------- Valeurs (pastilles) ---------- */
.valeurs {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
  padding: 0;
  list-style: none;
}
.valeurs li {
  font-family: var(--titres);
  font-weight: 600;
  font-size: 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 10px 22px;
  border-radius: 999px;
  background: var(--blanc);
  border: 2px solid var(--apex);
  color: var(--apex-fonce);
}
.section--sombre .valeurs li {
  background: transparent;
  color: var(--apex);
}

/* ---------- Étiquettes / badges ---------- */
.badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  padding: 0 0 0 10px;
  border-left: 2px solid var(--apex);
  background: transparent;
  color: var(--roche);
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.15;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  overflow-wrap: anywhere;
}
.badge--vert,
.badge--bleu,
.badge--gris {
  color: var(--roche);
}

/* ---------- Calendrier : filtres ---------- */
.filtres {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 36px 0 8px;
}

.calendrier-parcours {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 22px 0 0;
}

.filtres--inclusifs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin: 24px 0 10px;
  padding: 8px;
  border: 1px solid var(--ligne);
  border-radius: 8px;
  background: #eef3f7;
}

.filtres__barre {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 8px 8px 12px;
  border-radius: 8px;
  background: var(--blanc);
}

.filtres__toggle {
  display: none;
}

.filtres__resultat {
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-transform: uppercase;
}

.filtres__reset {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 11px;
  border: 1px solid var(--ligne);
  border-radius: 7px;
  background: var(--blanc);
  color: var(--apex-fonce);
  cursor: pointer;
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.15;
  text-transform: uppercase;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, opacity 0.18s ease;
}

.filtres__reset:not(:disabled):hover {
  border-color: rgba(240, 97, 42, 0.55);
  color: var(--apex);
}

.filtres__reset:disabled {
  color: var(--gris);
  cursor: not-allowed;
  opacity: 0.48;
}

.filtres__options {
  display: grid;
  gap: 8px;
}

.filtres__groupe {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border-radius: 8px;
  background: var(--blanc);
}

.filtres__titre {
  flex: 0 0 104px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.15;
  text-transform: uppercase;
}

.filtres--inclusifs .filtre {
  max-width: 100%;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 7px 8px 7px 11px;
  border-width: 1px;
  border-radius: 7px;
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.filtres--inclusifs .filtres__groupe > .filtre {
  display: inline-flex;
}

.filtre__picto {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  display: block;
  object-fit: contain;
  transition: filter 0.18s ease;
}

.filtre[aria-pressed="true"] .filtre__picto {
  filter: brightness(0) invert(1);
}

.filtre__libelle,
.filtre__compte {
  min-width: 0;
}

.filtre__libelle {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
}

.filtre__compte {
  flex: 0 0 auto;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #eef3f7;
  color: var(--apex-fonce);
  font-size: 0.72rem;
  line-height: 1;
}

.calendrier-statut-note {
  display: grid;
  grid-template-columns: auto repeat(4, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 12px 0 0;
  padding: 14px 16px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: #f6f8fb;
  color: var(--gris);
  font-size: 0.92rem;
  line-height: 1.35;
}

.calendrier-statut-note strong {
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.8rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.calendrier-statut-note span {
  min-width: 0;
}

.filtre {
  font-family: var(--titres);
  font-weight: 600;
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 8px 20px;
  border-radius: 999px;
  border: 2px solid var(--ligne);
  background: var(--blanc);
  color: var(--gris);
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}
.filtre:hover {
  border-color: rgba(240, 97, 42, 0.55);
  color: var(--apex-fonce);
  box-shadow: 0 8px 18px rgba(23, 35, 52, 0.08);
}
.filtre[aria-pressed="true"] {
  background: var(--nuit);
  border-color: var(--nuit);
  color: var(--blanc);
}

.filtre[aria-pressed="true"] .filtre__compte {
  background: rgba(255, 255, 255, 0.16);
  color: var(--blanc);
}

@media (max-width: 560px) {
  .calendrier-parcours .btn {
    width: 100%;
    justify-content: center;
  }

  .filtres {
    gap: 8px;
  }

  .filtres--inclusifs {
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 16px 0 8px;
    padding: 6px;
  }

  .filtres__barre {
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    padding: 6px;
  }

  .filtres__toggle {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 10px;
    border: 1px solid var(--nuit);
    border-radius: 7px;
    background: var(--nuit);
    color: var(--blanc);
    cursor: pointer;
    font-family: var(--titres);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.1;
    text-transform: uppercase;
  }

  .filtres__resultat {
    font-size: 0.74rem;
    letter-spacing: 0.03em;
    text-align: center;
  }

  .filtres__reset {
    min-height: 34px;
    padding: 7px 9px;
    font-size: 0.72rem;
  }

  .filtres--mobile-collapsed .filtres__options {
    display: none;
  }

  .filtres__options {
    gap: 8px;
  }

  .filtres__groupe {
    gap: 7px;
    padding: 7px;
  }

  .filtres__titre {
    flex-basis: 100%;
  }

  .filtre {
    padding: 7px 13px;
    font-size: 0.9rem;
    letter-spacing: 0.04em;
  }

  .filtres--inclusifs .filtre {
    font-size: 0.82rem;
  }

  .calendrier-statut-note {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 8px;
    overflow: visible;
    padding: 12px 14px;
    white-space: normal;
  }

  .calendrier-statut-note strong,
  .calendrier-statut-note span {
    min-width: 0;
  }
}

@media (min-width: 561px) and (max-width: 980px) {
  .calendrier-statut-note {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calendrier-statut-note strong {
    grid-column: 1 / -1;
  }
}

/* ---------- Calendrier : événements ---------- */
.evenement {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 20px;
  align-items: center;
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  padding: 20px 24px;
  box-shadow: var(--ombre);
}

.evenement > * {
  min-width: 0;
}

.grille--2 .liste-evenements .evenement {
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: start;
}

.grille--2 .liste-evenements .evenement .lien-suite {
  grid-column: 2;
  justify-self: start;
}

@media (max-width: 700px) {
  .evenement { grid-template-columns: 1fr; gap: 10px; }
  .grille--2 .liste-evenements .evenement {
    grid-template-columns: 1fr;
  }
  .grille--2 .liste-evenements .evenement .lien-suite {
    grid-column: auto;
  }
}

.evenement + .evenement { margin-top: 16px; }

.evenement__date {
  font-family: var(--titres);
  font-weight: 700;
  font-size: 1.25rem;
  text-transform: uppercase;
  color: var(--apex-fonce);
  line-height: 1.2;
}
.evenement h3 { margin: 0 0 4px; font-size: 1.3rem; }
.evenement__lieu { color: var(--gris); margin: 0 0 8px; font-size: 0.98rem; }
.evenement__badges { display: flex; flex-wrap: wrap; gap: 8px; }

.evenement__preuve {
  display: grid;
  grid-template-columns: minmax(82px, 0.28fr) minmax(0, 1fr);
  gap: 8px 14px;
  margin: 14px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--ligne);
}

.evenement__preuve div {
  display: contents;
}

.evenement__preuve dt {
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-transform: uppercase;
}

.evenement__preuve dd {
  margin: 0;
  color: var(--gris);
  font-size: 0.92rem;
  line-height: 1.45;
}

.liste-evenements { margin-top: 32px; }
.liste-evenements .evenement[hidden] { display: none; }

.calendrier-interactif {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin-top: 30px;
  scroll-margin-top: calc(var(--hauteur-header) + 22px);
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(120, 137, 154, 0.28);
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 250, 252, 0.92)),
    var(--blanc);
  box-shadow: 0 18px 48px rgba(22, 34, 47, 0.10);
  isolation: isolate;
}

.calendrier-interactif.is-detail-open {
  z-index: 1300;
  overflow: visible;
}

.calendrier-interactif::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(135deg, rgba(219, 232, 242, 0.68), rgba(255, 255, 255, 0.9)),
    url("../images/generated/gear-test-mountain.png") center / cover no-repeat;
  opacity: 0.24;
  pointer-events: none;
}

.calendrier-grille {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(120, 137, 154, 0.22);
  border-radius: 22px;
  background: rgba(216, 225, 234, 0.86);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.86), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.calendrier-mois {
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 16px;
  background: rgba(255, 255, 255, 0.95);
  transition: background 0.18s ease, box-shadow 0.18s ease;
}

.calendrier-mois:hover {
  background: var(--blanc);
  box-shadow: inset 0 0 0 1px rgba(240, 97, 42, 0.12);
}

.calendrier-mois__entete {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.calendrier-mois__nom {
  margin: 0;
  color: var(--apex-fonce);
  font-family: var(--texte);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.calendrier-mois__compte {
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(120, 137, 154, 0.26);
  border-radius: 999px;
  background: #f6f8fb;
  color: var(--apex-fonce);
  font-family: var(--texte);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
}

button.calendrier-mois__compte {
  appearance: none;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.calendrier-mois__compte--button:hover,
.calendrier-mois__compte--button:focus-visible,
.calendrier-mois__compte--button.is-active {
  border-color: var(--apex);
  background: var(--apex);
  color: var(--blanc);
}

.calendrier-mois__compte--button:hover {
  transform: translateY(-1px);
}

.calendrier-mois__jours {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
  margin-bottom: 10px;
  padding: 6px 7px;
  border-radius: 16px;
  background: #f2f5f8;
}

.calendrier-mois__jours span {
  min-width: 0;
  color: var(--gris);
  font-family: var(--texte);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.calendrier-mois__courses {
  display: grid;
  gap: 8px;
  min-height: 0;
  overflow: hidden;
}

.calendrier-mois__vide {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed rgba(120, 137, 154, 0.28);
  border-radius: 18px;
  color: var(--gris);
  font-size: 0.86rem;
}

.calendrier-course {
  position: relative;
  width: 100%;
  height: 78px;
  min-height: 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  overflow: hidden;
  padding: 9px 10px 9px 12px;
  border: 1px solid rgba(120, 137, 154, 0.26);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--encre);
  cursor: pointer;
  text-align: left;
  box-shadow: 0 1px 2px rgba(22, 34, 47, 0.06);
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.calendrier-course::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 4px;
  height: auto;
  border-radius: 0 999px 999px 0;
  background: var(--apex);
  opacity: 0.86;
  pointer-events: none;
}

.calendrier-course:hover,
.calendrier-course:focus-visible,
.calendrier-course.is-active {
  border-color: var(--apex);
  background: var(--blanc);
  box-shadow: 0 10px 22px rgba(22, 34, 47, 0.12);
}

.calendrier-course:hover::before,
.calendrier-course:focus-visible::before,
.calendrier-course.is-active::before {
  opacity: 1;
}

.calendrier-course:hover {
  transform: translateY(-1px);
}

.calendrier-course__date {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(240, 97, 42, 0.22);
  border-radius: 999px;
  background: #fff4ef;
  color: var(--apex-fonce);
  font-family: var(--texte);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
}

.calendrier-course__body {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.calendrier-course__meta {
  display: -webkit-box;
  overflow: hidden;
  color: var(--apex-fonce);
  font-family: var(--texte);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.calendrier-course__meta--with-picto,
.calendrier-category-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.calendrier-course__meta--with-picto > span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.calendrier-category-label {
  margin-bottom: 6px;
  color: var(--apex-fonce);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}

.calendrier-category-picto,
.calendrier-category-picto img {
  width: 18px;
  height: 18px;
  display: block;
  flex: 0 0 18px;
}

.calendrier-category-picto img {
  object-fit: contain;
}

.calendrier-course strong {
  display: block;
  overflow: visible;
  font-family: var(--titres);
  font-size: 0.94rem;
  line-height: 1.16;
  text-transform: uppercase;
}

body.calendrier-modal-open {
  overflow: hidden;
}

.calendrier-detail {
  position: fixed;
  inset: 0;
  z-index: 1200;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-y: auto;
  padding: 24px;
  color: var(--blanc);
  background: rgba(10, 18, 28, 0.68);
  backdrop-filter: blur(3px);
}

.calendrier-detail[hidden] {
  display: none;
}

.calendrier-detail:focus {
  outline: none;
}

.calendrier-detail__dialog {
  position: relative;
  width: min(980px, 100%);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  padding: 32px;
  border-radius: var(--rayon);
  background:
    linear-gradient(135deg, rgba(16, 26, 37, 0.96), rgba(31, 48, 64, 0.93)),
    url("../images/generated/utgc-backstage.png") center / cover no-repeat;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.36);
}

.calendrier-detail--inclusif .calendrier-detail__dialog {
  background:
    linear-gradient(135deg, rgba(16, 26, 37, 0.96), rgba(31, 48, 64, 0.93)),
    url("../images/generated/para-trail-start.png") center / cover no-repeat;
}

.calendrier-detail h3 {
  margin: 0.12em 0 0.28em;
  padding-right: 64px;
  padding-bottom: 4px;
  color: var(--blanc);
  font-size: clamp(1.65rem, 3.2vw, 2.35rem);
  line-height: 1.08;
  text-transform: uppercase;
}

.calendrier-detail__lieu {
  margin: 0 0 12px;
  color: #d8dee5;
  font-size: 1rem;
  line-height: 1.4;
}

.calendrier-detail__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}

.calendrier-detail__infos {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1px;
  margin: 18px 0 20px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.12);
}

.calendrier-detail__infos div {
  padding: 14px;
  background: rgba(255, 255, 255, 0.07);
}

.calendrier-detail__infos div:first-child {
  padding-top: 14px;
}

.calendrier-detail__infos dt {
  margin-bottom: 3px;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.calendrier-detail__infos dd {
  margin: 0;
  color: #d8dee5;
  display: block;
  overflow: visible;
  font-size: 0.96rem;
  line-height: 1.38;
}

.calendrier-detail--inclusif .calendrier-detail__infos {
  margin-bottom: 20px;
}

.calendrier-detail .btn {
  align-self: flex-start;
  margin-top: 0;
}

.calendrier-detail__actions {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.calendrier-detail__actions .btn {
  margin-top: 0;
}

.calendrier-detail--inclusif .calendrier-detail__actions {
  margin-top: 14px;
}

.calendrier-detail__actions-label {
  flex-basis: 100%;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.calendrier-detail--inclusif .calendrier-detail__actions .btn {
  min-height: 40px;
  padding: 0.65em 1.05em;
  font-size: 0.82rem;
  line-height: 1.1;
  text-align: center;
  white-space: normal;
}

.calendrier-detail--inclusif .btn--contour {
  background: rgba(255, 255, 255, 0.08);
}

.calendrier-detail__close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 179, 143, 0.62);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffb38f;
  cursor: pointer;
  font-family: var(--titres);
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.calendrier-detail__close:hover,
.calendrier-detail__close:focus-visible {
  border-color: #ffb38f;
  background: rgba(255, 179, 143, 0.14);
  color: var(--blanc);
}

.calendrier-detail__liste {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin-top: 18px;
  overflow: visible;
}

.calendrier-detail__item {
  width: 100%;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--blanc);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.calendrier-detail__item:hover,
.calendrier-detail__item:focus-visible,
.calendrier-detail__item.is-active {
  border-color: #ffb38f;
  background: rgba(255, 255, 255, 0.14);
}

.calendrier-detail__item span {
  display: block;
  margin-bottom: 6px;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}

.calendrier-detail__item strong {
  display: block;
  color: var(--blanc);
  font-family: var(--titres);
  font-size: 1rem;
  line-height: 1.08;
  text-transform: uppercase;
}

.calendrier-mini-mois {
  margin-top: 22px;
}

.calendrier-mini-mois__scroll {
  overflow-x: auto;
  padding-bottom: 6px;
  scrollbar-color: rgba(255, 179, 143, 0.68) rgba(255, 255, 255, 0.08);
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.calendrier-mini-mois__scroll::-webkit-scrollbar {
  height: 8px;
}

.calendrier-mini-mois__scroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
}

.calendrier-mini-mois__scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255, 179, 143, 0.72);
}

.calendrier-mini-mois__scroll:focus-visible {
  border-radius: 8px;
  outline: 2px solid #ffb38f;
  outline-offset: 4px;
}

.calendrier-mini-mois__grille {
  min-width: 820px;
  display: grid;
  grid-template-columns: repeat(7, minmax(110px, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.14);
}

.calendrier-mini-mois__weekday {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  background: rgba(255, 179, 143, 0.16);
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.calendrier-mini-mois__jour {
  min-height: 106px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.09);
}

.calendrier-mini-mois__jour--vide {
  background: rgba(255, 255, 255, 0.055);
}

.calendrier-mini-mois__jour--hors-mois {
  min-height: 106px;
  background: rgba(255, 255, 255, 0.035);
}

.calendrier-mini-mois__date {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 179, 143, 0.36);
  border-radius: 999px;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
}

.calendrier-mini-mois__items {
  display: grid;
  gap: 6px;
  margin-top: 7px;
}

.calendrier-mini-mois__item {
  width: 100%;
  min-height: 50px;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: rgba(16, 26, 37, 0.42);
  color: var(--blanc);
  cursor: pointer;
  text-align: left;
  transition: border-color 0.18s ease, background 0.18s ease;
}

.calendrier-mini-mois__item:hover,
.calendrier-mini-mois__item:focus-visible,
.calendrier-mini-mois__item.is-active {
  border-color: #ffb38f;
  background: rgba(255, 255, 255, 0.14);
}

.calendrier-mini-mois__item span {
  display: -webkit-box;
  overflow: hidden;
  margin-bottom: 5px;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.18;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.calendrier-mini-mois__item strong {
  display: -webkit-box;
  overflow: hidden;
  color: var(--blanc);
  font-family: var(--titres);
  font-size: 0.72rem;
  line-height: 1.1;
  text-transform: uppercase;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.calendrier-mini-mois__hors-date {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
}

.calendrier-mini-mois__hors-date-label {
  display: block;
  color: #ffb38f;
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.1;
  text-transform: uppercase;
}

.calendrier-periode {
  display: grid;
  gap: 14px;
  margin: 24px 0 12px;
  padding: clamp(16px, 2.5vw, 24px);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: #f6f8fb;
}

.calendrier-periode__entete {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 22px;
}

.calendrier-periode__entete h3 {
  margin: 4px 0 0;
  color: var(--apex-fonce);
  font-size: clamp(1.2rem, 2.4vw, 1.65rem);
}

.calendrier-periode__entete p {
  max-width: 430px;
  margin: 0;
  color: var(--gris);
  font-size: 0.92rem;
}

.calendrier-mode {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(120, 137, 154, 0.22);
  border-radius: 999px;
  background: #edf2f6;
}

.calendrier-mode.calendrier-mode--periode {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.calendrier-mode__button {
  min-width: 0;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--gris);
  cursor: pointer;
  font-family: var(--texte);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
}

.calendrier-mode__button.is-active {
  background: var(--blanc);
  color: var(--apex-fonce);
  box-shadow: 0 6px 18px rgba(22, 34, 47, 0.12);
}

.calendrier-mode__button:hover,
.calendrier-mode__button:focus-visible {
  color: var(--apex);
}

.calendrier-periode__champs,
.calendrier-periode__dates {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.calendrier-periode__champ {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.calendrier-periode__champ[hidden],
.calendrier-periode__dates[hidden] {
  display: none;
}

.calendrier-periode__champ > span {
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.calendrier-periode__champ input,
.calendrier-periode__champ select {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--ligne);
  border-radius: 8px;
  background: var(--blanc);
  color: var(--encre);
  font: 600 0.95rem/1.2 var(--texte);
}

.calendrier-periode__champ input:focus,
.calendrier-periode__champ select:focus {
  border-color: var(--apex);
  outline: 3px solid rgba(240, 97, 42, 0.18);
  outline-offset: 1px;
}

.calendrier-periode__resume {
  margin: 0;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.calendrier-terrain .calendrier-periode {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
}

.calendrier-terrain .calendrier-periode__entete h3,
.calendrier-terrain .calendrier-periode__resume,
.calendrier-terrain .calendrier-periode__champ > span {
  color: var(--blanc);
}

.calendrier-terrain .calendrier-periode__entete p {
  color: #d8dee5;
}

.filtres--terrain {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
}

.calendrier-mobile-mois,
.calendrier-mobile-annee,
.calendrier-mobile-periode {
  display: none;
}

.calendrier-mobile-annee {
  align-items: start;
  gap: 16px;
}

.calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois {
  display: grid;
  gap: 16px;
}

.calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee {
  display: grid;
  gap: 22px;
}

.calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee > .calendrier-mobile-mois--annee {
  --calendrier-annee-case: 62px;
  --calendrier-annee-entete: 28px;
  align-content: start;
  align-self: start;
  display: grid;
  gap: 12px;
}

.calendrier-interactif[data-calendar-view-mode="custom"] > .calendrier-mobile-periode {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.calendrier-mobile-periode > .calendrier-mobile-mois--periode {
  --calendrier-annee-case: 62px;
  --calendrier-annee-entete: 28px;
  display: grid;
  gap: 12px;
}

.calendrier-mobile-mois--periode .calendrier-mobile-mois__grid {
  grid-template-rows: var(--calendrier-annee-entete) repeat(6, var(--calendrier-annee-case));
}

.calendrier-mobile-mois--periode .calendrier-mobile-mois__weekday {
  height: var(--calendrier-annee-entete);
  min-height: 0;
}

.calendrier-mobile-mois--periode .calendrier-mobile-mois__day {
  height: var(--calendrier-annee-case);
  min-height: 0;
  overflow: hidden;
}

.calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-grille,
.calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-grille,
.calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-mois {
  display: none;
}

.calendrier-mobile-mois__barre {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.calendrier-mobile-mois__barre--solo {
  justify-content: center;
}

.calendrier-mobile-mois__barre h3 {
  margin: 0;
  color: var(--apex-fonce);
  font-family: var(--texte);
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: none;
}

.calendrier-mobile-mois__barre h3 span {
  color: var(--gris);
  font-size: 0.86em;
  font-weight: 600;
}

.calendrier-mobile-mois__nav {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(120, 137, 154, 0.24);
  border-radius: 999px;
  background: var(--blanc);
  color: var(--apex-fonce);
  cursor: pointer;
  font-size: 1.45rem;
  line-height: 1;
}

.calendrier-mobile-mois__nav:hover,
.calendrier-mobile-mois__nav:focus-visible {
  border-color: var(--apex);
  color: var(--apex);
}

.calendrier-mobile-mois__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid rgba(120, 137, 154, 0.22);
  border-radius: 10px;
  background: rgba(120, 137, 154, 0.18);
}

.calendrier-mobile-mois__weekday {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f2f5f8;
  color: var(--gris);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

.calendrier-mobile-mois__day {
  min-width: 0;
  min-height: 70px;
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 5px 3px;
  background: rgba(255, 255, 255, 0.96);
}

.calendrier-mobile-mois__day--outside {
  background: rgba(255, 255, 255, 0.58);
}

.calendrier-mobile-mois__day--today .calendrier-mobile-mois__date {
  background: var(--apex);
  color: var(--blanc);
}

.calendrier-mobile-mois__date {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--gris);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
}

.calendrier-mobile-mois__events {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 3px;
  min-width: 0;
}

.calendrier-mobile-mois__event {
  position: relative;
  width: 44px;
  height: 44px;
  min-width: 0;
  min-height: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 auto;
  padding: 8px;
  border: 0;
  border-radius: 999px;
  background: var(--apex);
  color: var(--blanc);
  cursor: pointer;
  font-family: var(--texte);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  box-shadow: 0 5px 12px rgba(240, 97, 42, 0.18);
}

.calendrier-mobile-mois__event::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  left: -6px;
  right: -6px;
  height: 6px;
  transform: translateY(-50%);
  background: rgba(240, 97, 42, 0.42);
  pointer-events: none;
}

.calendrier-mobile-mois__event--range-single::before {
  display: none;
}

.calendrier-mobile-mois__event--range-start::before {
  left: 50%;
}

.calendrier-mobile-mois__event--range-end::before {
  right: 50%;
}

.calendrier-mobile-mois__event--week-start::before {
  left: 0;
}

.calendrier-mobile-mois__event--week-end::before {
  right: 0;
}

.calendrier-mobile-mois__event--range-start.calendrier-mobile-mois__event--week-start::before {
  left: 50%;
}

.calendrier-mobile-mois__event--range-end.calendrier-mobile-mois__event--week-end::before {
  right: 50%;
}

.calendrier-mobile-mois__picto,
.calendrier-mobile-mois__picto img {
  position: relative;
  z-index: 1;
  width: 18px;
  height: 18px;
  display: block;
}

.calendrier-mobile-mois__picto img {
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.calendrier-mobile-mois__event:hover,
.calendrier-mobile-mois__event:focus-visible {
  outline: 2px solid rgba(240, 97, 42, 0.42);
  outline-offset: 1px;
}

.calendrier-mobile-mois__more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--gris);
  font-size: 0.58rem;
  font-weight: 800;
  line-height: 1;
}

.calendrier-mobile-mois--annee .calendrier-mobile-mois__grid {
  grid-template-rows: var(--calendrier-annee-entete) repeat(6, var(--calendrier-annee-case));
}

.calendrier-mobile-mois--annee .calendrier-mobile-mois__weekday {
  height: var(--calendrier-annee-entete);
  min-height: 0;
}

.calendrier-mobile-mois--annee .calendrier-mobile-mois__day {
  height: var(--calendrier-annee-case);
  min-height: 0;
  overflow: hidden;
}

.calendrier-mobile-mois--annee .calendrier-mobile-mois__events {
  max-height: calc(var(--calendrier-annee-case) - 28px);
  overflow: hidden;
}

.calendrier-mobile-agenda {
  display: grid;
  gap: 8px;
  margin-top: 4px;
}

.calendrier-mobile-agenda__date {
  color: var(--gris);
  font-family: var(--titres);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1;
  text-transform: uppercase;
}

.calendrier-mobile-agenda__empty {
  margin: 0;
  padding: 12px;
  border: 1px dashed rgba(120, 137, 154, 0.28);
  border-radius: 8px;
  color: var(--gris);
  font-size: 0.9rem;
}

.calendrier-mobile-agenda__undated {
  display: grid;
  gap: 8px;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid rgba(120, 137, 154, 0.18);
}

.calendrier-resultats {
  display: grid;
  gap: 14px;
  padding-top: 20px;
  border-top: 1px solid rgba(120, 137, 154, 0.24);
}

.calendrier-resultats__entete h3 {
  margin: 4px 0 0;
  color: var(--apex-fonce);
  font-size: clamp(1.25rem, 2.4vw, 1.7rem);
}

.calendrier-resultats__liste {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.calendrier-resultats__liste .calendrier-course {
  height: auto;
  min-height: 78px;
}

@media (min-width: 861px) {
  .calendrier-interactif[data-calendar-view-mode="custom"] > .calendrier-mobile-periode {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calendrier-mobile-periode > .calendrier-mobile-mois--periode {
    --calendrier-annee-case: 74px;
    --calendrier-annee-entete: 30px;
  }
}

@media (min-width: 1180px) {
  .calendrier-interactif[data-calendar-view-mode="custom"] > .calendrier-mobile-periode {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .calendrier-periode__entete {
    display: grid;
    gap: 8px;
  }

  .calendrier-mode.calendrier-mode--periode {
    grid-template-columns: 1fr;
    border-radius: 12px;
  }

  .calendrier-periode__champs,
  .calendrier-periode__dates,
  .calendrier-resultats__liste {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 861px) {
  .calendrier-mode {
    width: min(520px, 100%);
    justify-self: center;
  }

  .calendrier-mode__button {
    min-height: 46px;
    font-size: 0.9rem;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois {
    gap: 18px;
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee > .calendrier-mobile-mois--annee {
    --calendrier-annee-case: 74px;
    --calendrier-annee-entete: 30px;
  }

  .calendrier-mobile-mois__barre {
    width: 100%;
    max-width: 100%;
    justify-self: center;
  }

  .calendrier-mobile-mois__barre h3 {
    font-size: 1.8rem;
    text-align: center;
  }

  .calendrier-mobile-mois__nav {
    width: 46px;
    height: 46px;
    font-size: 1.75rem;
  }

  .calendrier-mobile-mois__grid {
    border-radius: 14px;
  }

  .calendrier-mobile-mois__weekday {
    min-height: 42px;
    font-size: 0.78rem;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__day {
    min-height: 118px;
    gap: 8px;
    padding: 10px;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__date {
    width: 30px;
    height: 30px;
    font-size: 0.9rem;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__events {
    gap: 5px;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__event {
    width: 44px;
    height: 44px;
    padding: 8px;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__picto,
  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois .calendrier-mobile-mois__picto img {
    width: 22px;
    height: 22px;
  }

  .calendrier-mobile-agenda {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 10px;
    margin-top: 8px;
  }

  .calendrier-mobile-agenda__date,
  .calendrier-mobile-agenda__empty,
  .calendrier-mobile-agenda__undated {
    grid-column: 1 / -1;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__barre {
    max-width: none;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__barre h3 {
    font-size: 1.08rem;
    text-align: left;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__weekday {
    font-size: 0.64rem;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__day {
    padding: 6px 4px;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__event {
    width: 44px;
    height: 44px;
    padding: 8px;
  }

  .calendrier-mobile-mois--annee .calendrier-mobile-mois__picto,
  .calendrier-mobile-mois--annee .calendrier-mobile-mois__picto img {
    width: 16px;
    height: 16px;
  }
}

@media (min-width: 1180px) {
  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.objectif-focus {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 28px;
  margin-top: 32px;
  padding: 34px;
  border-radius: var(--rayon);
  color: var(--blanc);
  background:
    linear-gradient(135deg, rgba(16, 26, 37, 0.94), rgba(31, 48, 64, 0.88)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  box-shadow: var(--ombre);
}

.objectif-focus h2 {
  color: var(--blanc);
}

.objectif-focus p {
  max-width: 680px;
  color: #d8dee5;
}

.objectif-focus dl {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin: 28px 0 0;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.14);
}

.objectif-focus dl div {
  padding: 14px;
  background: rgba(255, 255, 255, 0.08);
}

.objectif-focus dt {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #aeb9c4;
}

.objectif-focus dd {
  margin: 4px 0 0;
  font-family: var(--titres);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
}

.objectif-focus__aside {
  padding: 24px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.10);
}

.objectif-focus__aside h3 {
  color: var(--blanc);
}

.objectif-focus__aside ul {
  margin: 0 0 18px;
  color: #d8dee5;
}

.objectif-focus__aside .lien-suite {
  color: #ffb38f;
}

@media (max-width: 860px) {
  .calendrier-interactif {
    grid-template-columns: 1fr;
    margin-top: 26px;
    padding: 10px;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois {
    gap: 12px;
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee {
    gap: 16px;
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee > .calendrier-mobile-mois--annee {
    gap: 12px;
  }

  .calendrier-mois {
    min-height: 0;
    padding: 10px;
    border: 1px solid rgba(120, 137, 154, 0.2);
    border-radius: 14px;
  }

  .calendrier-mois__entete {
    align-items: flex-start;
    margin-bottom: 0;
  }

  .calendrier-mois__nom {
    font-size: 0.86rem;
    overflow-wrap: anywhere;
  }

  .calendrier-mois__jours {
    display: none;
  }

  .calendrier-mois__compte {
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    font-size: 0.74rem;
  }

  .calendrier-mois__courses {
    display: none;
  }

  .calendrier-mois__vide {
    min-height: 48px;
  }

  .calendrier-course {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
    height: auto;
    min-height: 74px;
    padding: 8px 9px 8px 11px;
  }

  .calendrier-course__date {
    width: 32px;
    height: 32px;
    font-size: 0.76rem;
  }

  .calendrier-course__meta {
    font-size: 0.62rem;
  }

  .calendrier-course strong {
    font-size: 0.86rem;
  }

  .calendrier-mobile-agenda .calendrier-course {
    display: grid;
    height: auto;
    min-height: 72px;
  }

  .calendrier-detail {
    align-items: flex-start;
    padding: 16px;
  }

  .calendrier-mini-mois__grille {
    min-width: 0;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .calendrier-mini-mois__scroll {
    overflow-x: visible;
    padding-bottom: 0;
  }

  .calendrier-mini-mois__weekday {
    min-height: 28px;
    padding: 6px 2px;
    font-size: 0.6rem;
    letter-spacing: 0;
  }

  .calendrier-mini-mois__jour,
  .calendrier-mini-mois__jour--hors-mois {
    min-height: 58px;
    padding: 5px;
  }

  .calendrier-mini-mois__date {
    width: 22px;
    height: 22px;
    font-size: 0.66rem;
  }

  .calendrier-mini-mois__items {
    gap: 4px;
    margin-top: 5px;
  }

  .calendrier-mini-mois__item {
    min-height: 0;
    padding: 5px;
  }

  .calendrier-mini-mois__item span {
    display: none;
  }

  .calendrier-mini-mois__item strong {
    font-size: 0.6rem;
  }

  .objectif-focus,
  .objectif-focus dl {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .calendrier-interactif {
    padding: 8px;
  }

  .calendrier-mode__button {
    min-height: 44px;
    font-size: 0.74rem;
  }

  .calendrier-interactif[data-calendar-view-mode="month"] > .calendrier-mobile-mois {
    gap: 10px;
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee {
    gap: 14px;
  }

  .calendrier-interactif[data-calendar-view-mode="year"] > .calendrier-mobile-annee > .calendrier-mobile-mois--annee {
    gap: 10px;
  }

  .calendrier-mobile-mois__barre {
    gap: 8px;
  }

  .calendrier-mobile-mois__nav {
    width: 44px;
    height: 44px;
  }

  .calendrier-mobile-mois__day {
    min-height: 62px;
    padding: 4px 3px;
  }

  .calendrier-mobile-mois__event {
    width: 44px;
    height: 44px;
    padding: 8px;
  }

  .calendrier-mobile-mois__picto,
  .calendrier-mobile-mois__picto img {
    width: 20px;
    height: 20px;
  }

  .calendrier-course {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 7px;
    height: auto;
    min-height: 72px;
    padding: 8px 8px 8px 10px;
  }

  .calendrier-course__date {
    width: 30px;
    height: 30px;
    font-size: 0.72rem;
  }

  .calendrier-course__meta {
    font-size: 0.6rem;
  }

  .calendrier-course strong {
    font-size: 0.82rem;
  }

  .calendrier-detail {
    padding: 10px;
  }

  .calendrier-detail__dialog {
    max-height: calc(100dvh - 20px);
    padding: 20px;
  }

  .calendrier-detail h3 {
    padding-right: 52px;
  }

  .calendrier-detail__close {
    top: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
  }

  .calendrier-detail__infos,
  .calendrier-detail__liste {
    grid-template-columns: 1fr;
  }

  .calendrier-detail__liste {
    overflow: visible;
  }

  .calendrier-mini-mois__grille {
    min-width: 0;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }

  .calendrier-mini-mois__jour,
  .calendrier-mini-mois__jour--hors-mois {
    min-height: 48px;
    padding: 4px;
  }

  .calendrier-mini-mois__item {
    min-height: 0;
    padding: 4px;
  }

  .calendrier-mini-mois__item span {
    display: none;
  }

  .calendrier-mini-mois__item strong {
    font-size: 0.56rem;
  }
}

/* ---------- Partenaires ---------- */
.partenaires-accueil {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.75fr);
  gap: 52px;
  align-items: center;
}

.logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin-top: 40px;
}
.logos__item {
  width: min(100%, 260px);
  min-height: 122px;
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px 28px;
}

.logos--vitrine {
  margin-top: 0;
  display: grid;
  grid-template-columns: 1fr;
  justify-items: stretch;
}

.logos--vitrine .logos__item {
  width: 100%;
  min-height: 148px;
}

.logos__item img {
  width: 100%;
  max-height: 78px;
  object-fit: contain;
}

.partenaire-logo {
  min-height: 132px;
  margin-bottom: 20px;
  border-radius: var(--rayon);
  background: var(--blanc);
  border: 1px solid var(--ligne);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.partenaire-logo img {
  width: 100%;
  max-height: 88px;
  object-fit: contain;
}

@media (max-width: 820px) {
  .partenaires-accueil {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

.activation-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0 24px;
}

.activation-list span {
  padding: 0 0 0 10px;
  border-left: 2px solid var(--apex);
  background: transparent;
  color: var(--roche);
  font-family: var(--titres);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.decision-partenaire {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 38px;
  align-items: start;
}

.decision-partenaire__intro {
  position: sticky;
  top: 104px;
}

.decision-partenaire__intro p {
  color: var(--gris);
  font-size: 1.05rem;
}

.decision-partenaire__grille {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.decision-partenaire__grille article {
  min-height: 190px;
  padding: 26px;
  background: var(--blanc);
}

.decision-partenaire__grille span {
  display: block;
  margin-bottom: 18px;
  font-family: var(--titres);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.45);
}

.decision-partenaire__grille h3 {
  max-width: 8em;
}

.decision-partenaire__grille p {
  margin: 0;
  color: var(--gris);
  font-size: 0.96rem;
}

.livrables-partenaires {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.livrables-partenaires article {
  min-width: 0;
  min-height: 230px;
  padding: 28px;
  background: var(--blanc);
}

.livrables-partenaires span {
  display: block;
  margin-bottom: 20px;
  font-family: var(--titres);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.48);
}

.livrables-partenaires h3 {
  max-width: 8em;
}

.livrables-partenaires p {
  margin: 0;
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}

.offres-partenariat {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 34px;
}

.offre-partenariat {
  min-width: 0;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  padding: 28px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.offre-partenariat--accent {
  border-color: rgba(240, 97, 42, 0.35);
  background:
    linear-gradient(180deg, rgba(240, 97, 42, 0.10), rgba(255, 255, 255, 0) 46%),
    var(--blanc);
}

.offre-partenariat > span {
  display: block;
  margin-bottom: 18px;
  color: rgba(240, 97, 42, 0.52);
  font-family: var(--titres);
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
}

.offre-partenariat h3 {
  max-width: 9em;
}

.offre-partenariat p {
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}

.offre-partenariat dl {
  display: grid;
  gap: 10px;
  margin: 8px 0 22px;
}

.offre-partenariat dl div {
  padding-top: 10px;
  border-top: 1px solid var(--ligne);
}

.offre-partenariat dt {
  margin-bottom: 3px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.offre-partenariat dd {
  margin: 0;
  color: var(--encre);
  font-size: 0.95rem;
  line-height: 1.45;
}

.offre-partenariat .lien-suite {
  margin-top: auto;
  align-self: flex-start;
}

.cas-partenaires {
  display: grid;
  gap: 24px;
  margin-top: 36px;
}

.cas-partenaire {
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1fr);
  gap: 30px;
  align-items: stretch;
  padding: 18px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.cas-partenaire > * {
  min-width: 0;
}

.cas-partenaire .media-photo {
  min-height: 320px;
}

.cas-partenaire > div {
  padding: 16px 12px 12px;
}

.cas-partenaire ul {
  margin: 18px 0 22px;
  color: var(--gris);
}

@media (max-width: 900px) {
  .decision-partenaire,
  .livrables-partenaires,
  .offres-partenariat {
    grid-template-columns: 1fr;
  }
  .decision-partenaire__intro {
    position: static;
  }
  .decision-partenaire__grille,
  .livrables-partenaires {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .cas-partenaire {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .decision-partenaire__grille,
  .livrables-partenaires,
  .offres-partenariat {
    grid-template-columns: 1fr;
  }
  .decision-partenaire {
    gap: 24px;
  }
  .decision-partenaire__intro p {
    font-size: 0.98rem;
  }
  .decision-partenaire__grille article {
    min-height: 0;
    padding: 16px 18px;
  }
  .decision-partenaire__grille span {
    margin-bottom: 8px;
    font-size: 1rem;
  }
  .decision-partenaire__grille h3 {
    margin-bottom: 6px;
    font-size: 1.2rem;
  }
  .decision-partenaire__grille p {
    font-size: 0.9rem;
    line-height: 1.42;
  }
  .offre-partenariat {
    min-height: 0;
    padding: 22px;
  }
  .offre-partenariat > span {
    margin-bottom: 12px;
    font-size: 1.7rem;
  }
  .cas-partenaire {
    padding: 12px;
  }
}

.impact-partenaire {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 38px;
  align-items: stretch;
}

.impact-partenaire > *,
.formats-collab > *,
.formats-collab__liste > * {
  min-width: 0;
}

.impact-partenaire__intro {
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding: 34px;
  border-radius: var(--rayon);
  background:
    linear-gradient(180deg, rgba(8, 13, 18, 0.10), rgba(8, 13, 18, 0.84)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.22);
}

.impact-partenaire__intro h2 {
  max-width: 9em;
}

.impact-partenaire__intro p {
  color: #d8dee5;
  margin-bottom: 0;
}

.impact-partenaire__preuves {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.12);
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.16);
}

.preuve-impact {
  position: relative;
  min-height: 214px;
  padding: 28px;
  background: rgba(255, 255, 255, 0.07);
  overflow: hidden;
  min-width: 0;
}

.preuve-impact::before {
  content: attr(data-step);
  position: absolute;
  right: 18px;
  top: 12px;
  font-family: var(--titres);
  font-size: 4rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.18);
}

.preuve-impact span {
  position: relative;
  display: inline-block;
  margin-bottom: 18px;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex);
}

.preuve-impact h3,
.preuve-impact p {
  position: relative;
}

.preuve-impact h3 {
  max-width: 9em;
  color: var(--blanc);
}

.preuve-impact p {
  color: #c4cdd6;
  margin-bottom: 0;
  font-size: 0.98rem;
}

@media (max-width: 900px) {
  .impact-partenaire,
  .impact-partenaire__preuves {
    grid-template-columns: 1fr;
  }
}

.formats-collab {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 42px;
  align-items: start;
}

.formats-collab__intro {
  position: sticky;
  top: 104px;
}

.formats-collab__intro p {
  max-width: 520px;
  color: var(--gris);
  font-size: 1.08rem;
}

.formats-collab__liste {
  display: grid;
  gap: 1px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.format-ligne {
  position: relative;
  display: grid;
  grid-template-columns: minmax(112px, 0.38fr) minmax(180px, 0.72fr) minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  min-height: 150px;
  padding: 26px 28px 26px 100px;
  background: var(--blanc);
  min-width: 0;
}

.format-ligne::before {
  content: attr(data-step);
  position: absolute;
  left: 28px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--titres);
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.24);
}

.format-ligne span {
  display: inline-block;
  font-family: var(--titres);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.format-ligne h3,
.format-ligne p {
  margin-bottom: 0;
}

.format-ligne p {
  color: var(--gris);
  font-size: 0.98rem;
  line-height: 1.55;
}

@media (max-width: 900px) {
  .formats-collab {
    grid-template-columns: 1fr;
  }
  .formats-collab__intro {
    position: static;
  }
  .format-ligne {
    grid-template-columns: 1fr;
    gap: 10px;
    padding-left: 86px;
  }
}

@media (max-width: 560px) {
  .format-ligne {
    padding: 24px;
  }
  .format-ligne::before {
    position: static;
    transform: none;
    display: block;
    margin-bottom: 4px;
    font-size: 2rem;
  }
}

/* ---------- Médias ---------- */
.media-home {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1fr);
  gap: 46px;
  align-items: center;
}

.media-home__liste {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.media-home__liste article {
  min-height: 130px;
  padding: 22px;
  border-radius: var(--rayon);
  border: 1px solid var(--ligne);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.media-home__liste span {
  display: block;
  margin-bottom: 14px;
  font-family: var(--titres);
  font-weight: 700;
  color: var(--apex-fonce);
  text-transform: uppercase;
}

.media-home__liste strong {
  display: block;
  font-family: var(--titres);
  font-size: 1.45rem;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--nuit);
}

.media-kit ul {
  margin: 18px 0 24px;
  color: var(--gris);
}

@media (max-width: 860px) {
  .media-home {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .media-home__liste {
    grid-template-columns: 1fr;
  }
}

/* ---------- Bande d'appel à l'action ---------- */
.cta-bande {
  background: linear-gradient(120deg, var(--apex) 0%, #ff8a52 100%);
  color: var(--nuit);
  border-radius: var(--rayon);
  padding: 56px 48px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.cta-bande h2 { margin: 0; color: var(--nuit); }
.cta-bande p { margin: 8px 0 0; max-width: 540px; }
.cta-bande .btn {
  background: var(--nuit);
  color: var(--blanc);
}
.cta-bande .btn:hover { background: #0d141c; }

@media (max-width: 700px) {
  .cta-bande {
    padding: 34px 24px;
    gap: 18px;
  }

  .cta-bande h2 {
    font-size: clamp(1.85rem, 8.8vw, 2.55rem);
    line-height: 1.02;
  }
}

/* ---------- Formulaires ---------- */
.formulaire {
  display: grid;
  gap: 20px;
  max-width: 640px;
}
.champ { display: grid; gap: 6px; }
.champ label {
  font-weight: 600;
  font-size: 0.98rem;
}
.champ__aide {
  color: var(--gris);
  font-weight: 400;
}
.champ input,
.champ select,
.champ textarea {
  font: inherit;
  padding: 12px 14px;
  border: 2px solid var(--ligne);
  border-radius: 10px;
  background: var(--blanc);
  color: var(--encre);
  width: 100%;
}
.champ input:focus-visible,
.champ select:focus-visible,
.champ textarea:focus-visible {
  outline: 3px solid var(--apex);
  outline-offset: 1px;
  border-color: var(--apex);
}
.champ textarea { min-height: 160px; resize: vertical; }

.champ--hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.champ--hidden input {
  width: 1px;
  min-width: 0;
  height: 1px;
  padding: 0;
  border: 0;
}

.note-info {
  background: rgba(46, 125, 91, 0.12);
  border: 1px solid rgba(46, 125, 91, 0.4);
  color: #1d5a40;
  border-radius: 10px;
  padding: 14px 18px;
  font-size: 0.98rem;
}

.section--sombre .note-info {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: #d8e1ea;
}

/* ---------- Newsletter ---------- */
.newsletter-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 28px;
}
.newsletter-form input[type="email"],
.newsletter-form select {
  font: inherit;
  padding: 13px 18px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,0.25);
  background: rgba(255,255,255,0.08);
  color: var(--blanc);
  width: min(100%, 320px);
}

.newsletter-form select {
  min-height: 54px;
  color: var(--encre);
  background: var(--blanc);
}

.newsletter-form input[type="email"]::placeholder { color: #93a1ae; }

/* ---------- Articles de blog ---------- */
.article-carte {
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  box-shadow: var(--ombre);
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.article-feed {
  display: grid;
  gap: 18px;
}

.article-feed .article-carte {
  display: grid;
  grid-template-columns: minmax(220px, 0.34fr) minmax(0, 1fr);
}

.article-feed .article-carte .media-photo {
  min-height: 100%;
}

.article-feed .article-carte .article-carte__media--logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 3vw, 42px);
  background: var(--neige);
}

.article-feed .article-carte .article-carte__media--logo-dark {
  background: var(--nuit-2);
}

.article-feed .article-carte .article-carte__media--logo img {
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: 190px;
  object-fit: contain;
}

.article-feed .article-carte__corps {
  padding: 22px 24px;
}

.article-feed .article-carte h3 {
  max-width: 18em;
}

.article-feed .article-carte__trace {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 18px;
}

.article-feed .article-carte__trace div {
  grid-template-columns: 76px minmax(0, 1fr);
}

.article-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
}

.article-pagination[hidden] {
  display: none;
}

.article-pagination__button {
  min-width: 42px;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid var(--ligne);
  border-radius: 999px;
  background: var(--blanc);
  color: var(--apex-fonce);
  cursor: pointer;
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 700;
}

.article-pagination__button:hover,
.article-pagination__button:focus-visible {
  border-color: var(--apex);
  color: var(--apex);
}

.article-pagination__button[aria-current="page"] {
  border-color: var(--apex);
  background: var(--apex);
  color: var(--blanc);
}

.article-pagination__button:disabled {
  cursor: default;
  opacity: 0.45;
}

.article-pagination__button:disabled:hover {
  border-color: var(--ligne);
  color: var(--apex-fonce);
}

.article-carte .photo-placeholder,
.article-carte .media-photo {
  border-radius: 0;
  min-height: 180px;
  font-size: 0.95rem;
}
.article-carte__corps { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.article-carte h3 { font-size: 1.35rem; }
.article-carte p { color: var(--gris); font-size: 0.98rem; }
.article-carte .badge { align-self: flex-start; margin-bottom: 12px; }
.article-carte .lien-suite { margin-top: auto; }

.article-carte--avenir {
  border-color: rgba(31, 78, 121, 0.22);
}

.article-carte--avenir .media-photo img {
  filter: saturate(0.82);
}

.article-carte__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 4px 0 14px;
}

.article-carte__meta span {
  padding: 0;
  background: transparent;
  color: var(--gris);
  font-family: var(--titres);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.article-carte__trace {
  display: grid;
  gap: 9px;
  margin: 0 0 16px;
  padding: 14px 0;
  border-top: 1px solid var(--ligne);
  border-bottom: 1px solid var(--ligne);
}

.article-carte__trace div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 12px;
}

.article-carte__trace dt {
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-transform: uppercase;
}

.article-carte__trace dd {
  margin: 0;
  color: var(--gris);
  font-size: 0.92rem;
  line-height: 1.4;
}

.article-carte__preuve,
.article-vedette__preuve {
  border-left: 3px solid var(--apex);
  padding-left: 12px;
  color: var(--encre);
}

.article-carte__preuve strong,
.article-vedette__preuve strong {
  color: var(--apex-fonce);
}

.article-vedette {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  margin: 38px 0 50px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
  overflow: hidden;
}

.article-vedette .photo-placeholder,
.article-vedette .media-photo {
  min-height: 360px;
  border-radius: 0;
}

.article-vedette__corps {
  padding: 38px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.article-vedette__corps h2 {
  max-width: 9em;
}

.article-vedette__corps p {
  color: var(--gris);
  font-size: 1.08rem;
}

.article-vedette__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 10px 0 24px;
}

.article-vedette__meta span {
  padding: 0;
  background: transparent;
  color: var(--gris);
  font-family: var(--titres);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (max-width: 820px) {
  .article-vedette {
    grid-template-columns: 1fr;
  }

  .article-feed .article-carte {
    grid-template-columns: 1fr;
  }

  .article-feed .article-carte .media-photo {
    min-height: 160px;
  }
}

@media (max-width: 560px) {
  .article-feed {
    gap: 14px;
  }

  .article-feed .article-carte .media-photo {
    display: none;
  }

  .article-feed .article-carte__corps {
    padding: 18px;
  }

  .article-feed .article-carte h3 {
    font-size: 1.18rem;
  }

  .article-feed .article-carte__corps > p:not(.article-carte__preuve) {
    display: none;
  }

  .article-feed .article-carte__trace {
    grid-template-columns: 1fr;
    margin-bottom: 12px;
    padding: 11px 0;
  }

  .article-carte__trace div {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

.article-page {
  display: grid;
  grid-template-columns: minmax(280px, 0.86fr) minmax(0, 1.14fr);
  gap: 42px;
  align-items: start;
}

.article-page > * {
  min-width: 0;
}

.article-page__corps {
  max-width: 720px;
}

.article-page__corps h2 {
  margin-top: 1.4em;
}

.article-page__corps .cta-bande {
  margin-top: 36px;
}

@media (max-width: 900px) {
  .article-page {
    grid-template-columns: 1fr;
  }

  .article-page .media-photo--haute {
    min-height: 280px;
  }
}

@media (max-width: 560px) {
  .article-page .media-photo--haute {
    min-height: 220px;
  }
}

.contact-entrees {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  margin-top: 24px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.duo.contact-duo {
  grid-template-columns: minmax(0, 1fr) minmax(330px, 0.78fr);
  align-items: start;
}

.contact-formulaire {
  padding: clamp(26px, 4vw, 40px);
  border: 1px solid rgba(22, 34, 47, 0.10);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.contact-formulaire h2,
.contact-choix h2 {
  margin-bottom: 12px;
}

.contact-promesse {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin: 18px 0 26px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
}

.contact-promesse div {
  min-width: 0;
  padding: 16px;
  background: #fbfaf7;
}

.contact-promesse strong {
  display: block;
  margin-bottom: 5px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.92rem;
  line-height: 1.05;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.contact-promesse span {
  color: var(--gris);
  font-size: 0.9rem;
  line-height: 1.45;
}

.contact-entrees .carte {
  display: grid;
  grid-template-columns: minmax(96px, 126px) minmax(0, 1fr);
  gap: 7px 16px;
  align-items: start;
  position: relative;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 20px 54px 20px 20px;
  min-width: 0;
  background: var(--blanc);
}

.contact-entree {
  width: 100%;
  font: inherit;
  text-align: left;
  color: inherit;
  cursor: pointer;
}

.contact-entree::after {
  content: "→";
  position: absolute;
  top: 22px;
  right: 22px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 1rem;
  font-weight: 700;
}

.contact-entree:hover,
.contact-entree[aria-pressed="true"] {
  background: rgba(240, 97, 42, 0.08);
}

.contact-entree[aria-pressed="true"] {
  box-shadow: inset 4px 0 0 var(--apex);
}

.contact-entree[aria-pressed="true"]::after {
  content: "OK";
  color: var(--apex);
  letter-spacing: 0.04em;
}

.contact-entree:focus-visible {
  outline: 3px solid var(--apex);
  outline-offset: -3px;
}

.contact-entrees .badge {
  grid-row: 1 / span 2;
  align-self: start;
}

.contact-entrees .badge,
.contact-entrees h3,
.contact-entrees p {
  margin-bottom: 0;
}

.contact-entrees h3,
.contact-entrees p {
  grid-column: 2;
}

.contact-entrees p {
  color: var(--gris);
  font-size: 0.96rem;
  line-height: 1.5;
}

.contact-ressources {
  margin-top: 24px;
  padding: 24px;
  border-radius: var(--rayon);
  border: 1px solid rgba(22, 34, 47, 0.10);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.contact-ressources h3 {
  margin-bottom: 14px;
}

.contact-ressources a {
  display: block;
  padding: 12px 0;
  border-top: 1px solid var(--ligne);
  font-family: var(--titres);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
}

.contact-ressources a::after {
  content: " →";
}

@media (max-width: 860px) {
  .duo.contact-duo {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .contact-promesse {
    grid-template-columns: 1fr;
  }

  .contact-entrees .carte {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 20px;
  }

  .contact-entrees .badge,
  .contact-entrees h3,
  .contact-entrees p {
    grid-column: auto;
  }

  .contact-entree::after {
    top: 20px;
    right: 20px;
  }
}

@media (min-width: 980px) {
  .contact-entrees .carte {
    grid-template-columns: minmax(96px, 126px) minmax(0, 1fr);
  }
}

/* ---------- Pied de page ---------- */
.pied {
  background: #101a25;
  color: #aeb9c4;
  padding: 64px 0 32px;
  margin-top: 0;
}
.pied a {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  color: #d8dee5;
  text-decoration: none;
}
.pied a:hover { color: var(--apex); }

.pied__grille {
  display: grid;
  grid-template-columns: minmax(260px, 1.6fr) repeat(2, minmax(180px, 0.8fr));
  gap: 40px;
}
@media (max-width: 900px) { .pied__grille { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .pied__grille { grid-template-columns: 1fr; } }

.pied h3 {
  color: var(--blanc);
  font-size: 1.1rem;
  letter-spacing: 0.1em;
}
.pied ul { list-style: none; margin: 0; padding: 0; }
.pied li { margin-bottom: 10px; }
.pied .logo { margin-bottom: 16px; }
.pied__slogan { font-style: italic; max-width: 320px; }

.pied__bas {
  border-top: 1px solid rgba(255,255,255,0.1);
  margin-top: 48px;
  padding-top: 24px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.9rem;
  color: #7e8b98;
}

.pied__admin {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid rgba(216,222,229,0.18);
  border-radius: 4px;
  font-size: 0.78rem;
  opacity: 0.55;
  transition: opacity 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pied__admin:hover,
.pied__admin:focus-visible {
  border-color: rgba(240,97,42,0.48);
  opacity: 1;
}

/* ---------- Tableau feuille de route ---------- */
.phases { counter-reset: phase; list-style: none; margin: 40px 0 0; padding: 0; display: grid; gap: 20px; }
.phases li {
  counter-increment: phase;
  background: var(--blanc);
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
  padding: 24px 28px 24px 92px;
  position: relative;
}
.phases li::before {
  content: counter(phase);
  position: absolute;
  left: 24px;
  top: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--apex);
  color: var(--nuit);
  font-family: var(--titres);
  font-weight: 700;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.phases h3 { margin: 0 0 4px; }
.phases p { color: var(--gris); margin: 0; }

/* ---------- Apparition au défilement ----------
   Les classes sont ajoutées par js/main.js uniquement si l'utilisateur
   n'a pas demandé de réduire les animations. */
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 1;
    transform: translateY(14px);
    transition: transform 0.35s ease;
  }
  .reveal.visible {
    transform: none;
  }
}

/* ---------- Deux colonnes texte + image ---------- */
.duo {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}
.duo > * {
  min-width: 0;
}
@media (max-width: 860px) { .duo { grid-template-columns: 1fr; } }
.duo--inverse > :first-child { order: 2; }
@media (max-width: 860px) { .duo--inverse > :first-child { order: 0; } }

/* ---------- Kit media ---------- */
.kit-bandeau .bandeau__inner {
  padding-bottom: 108px;
}

.kit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 24px;
}

.kit-actions--centre {
  justify-content: center;
}

.kit-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 42px;
  align-items: start;
}

.kit-grid--inverse {
  grid-template-columns: minmax(0, 1.28fr) minmax(280px, 0.72fr);
}

.kit-fiche,
.kit-visuels {
  padding: 30px;
  border-radius: var(--rayon);
  border: 1px solid var(--ligne);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.kit-fiche {
  position: sticky;
  top: 104px;
}

.kit-fiche h2 {
  margin-top: 0.35em;
}

.kit-fiche dl {
  display: grid;
  gap: 18px;
  margin: 24px 0 0;
}

.kit-fiche dt {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gris);
}

.kit-fiche dd {
  margin: 4px 0 0;
  color: var(--encre);
}

.kit-contenu > .intro-section {
  max-width: 780px;
}

.kit-copy {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.kit-copy article {
  padding: 28px;
  background: var(--blanc);
}

.kit-copy p,
.kit-angles p,
.kit-visuels p,
.kit-visuels li {
  color: var(--gris);
}

.kit-angles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.kit-angles article {
  min-height: 238px;
  padding: 28px;
  background: var(--blanc);
}

.kit-angles span {
  display: block;
  margin-bottom: 20px;
  font-family: var(--titres);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.48);
}

.kit-visuels ul {
  margin: 18px 0 24px;
}

.kit-logos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: center;
}

.kit-logos img {
  width: 100%;
  max-height: 78px;
  object-fit: contain;
  padding: 16px;
  border-radius: 6px;
  border: 1px solid var(--ligne);
  background: var(--blanc);
}

.kit-contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

.kit-contact > div {
  max-width: 740px;
}

@media (max-width: 900px) {
  .kit-grid,
  .kit-grid--inverse,
  .kit-copy,
  .kit-angles {
    grid-template-columns: 1fr;
  }

  .kit-fiche {
    position: static;
  }
}

@media print {
  @page {
    margin: 14mm;
  }

  body {
    background: #fff;
    color: #111;
    font-size: 11pt;
    line-height: 1.45;
  }

  .entete,
  .pied,
  .print-hide,
  .bandeau__montagnes,
  .skip-link {
    display: none !important;
  }

  .bandeau,
  .section,
  .section--blanche,
  .section--sombre {
    background: #fff !important;
    color: #111 !important;
    padding: 18px 0 !important;
  }

  .bandeau__inner,
  .conteneur {
    max-width: none;
    padding: 0 !important;
  }

  h1,
  h2,
  h3,
  .section--sombre h2,
  .section--sombre h3 {
    color: #111 !important;
  }

  .bandeau p,
  .intro-section,
  .kit-copy p,
  .kit-angles p,
  .kit-visuels p,
  .kit-visuels li,
  .preuve-ligne p {
    color: #333 !important;
  }

  .kit-grid,
  .kit-grid--inverse {
    display: block;
  }

  .kit-fiche,
  .kit-visuels,
  .kit-copy,
  .kit-angles,
  .preuves-verifiees__liste {
    box-shadow: none !important;
    break-inside: avoid;
  }

  a {
    color: #111 !important;
    text-decoration: underline;
  }
}

/* ---------- Dossier partenaire ---------- */
.partenaire-promesse {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.partenaire-promesse article {
  min-height: 190px;
  padding: 26px;
  background: var(--blanc);
}

.partenaire-promesse strong {
  display: block;
  margin-bottom: 14px;
  font-family: var(--titres);
  font-size: 1.45rem;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.partenaire-promesse span {
  color: var(--gris);
}

.partenaire-offres {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 36px;
}

.partenaire-offres article {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 30px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.partenaire-offres h3 {
  margin-top: 0.45em;
}

.partenaire-offres p,
.partenaire-offres li {
  color: var(--gris);
}

.partenaire-offres ul {
  margin: 10px 0 24px;
}

.partenaire-offres .lien-suite {
  margin-top: auto;
  align-self: flex-start;
}

.partenaire-processus {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 36px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: rgba(22, 34, 47, 0.12);
  box-shadow: var(--ombre);
}

.partenaire-processus article {
  min-height: 245px;
  padding: 28px;
  background: rgba(255, 255, 255, 0.86);
}

.partenaire-processus span {
  display: block;
  margin-bottom: 20px;
  font-family: var(--titres);
  font-size: 2.1rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(240, 97, 42, 0.48);
}

.partenaire-processus p {
  margin-bottom: 0;
  color: var(--gris);
}

@media (max-width: 980px) {
  .partenaire-offres,
  .partenaire-processus,
  .partenaire-promesse {
    grid-template-columns: 1fr;
  }
}

/* ---------- Page Thomas / récit ---------- */
.bandeau--recit {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.9) 0%, rgba(12, 20, 29, 0.68) 48%, rgba(12, 20, 29, 0.34) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.06), rgba(12, 20, 29, 0.78)),
    url("../images/generated/trail-portrait-mountain.png") center / cover no-repeat;
}

.bandeau--prestations {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.7) 50%, rgba(12, 20, 29, 0.34) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.8)),
    url("../images/generated/volunteers-accessibility.png") center / cover no-repeat;
}

.bandeau--partenaires {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 48%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.06), rgba(12, 20, 29, 0.76)),
    url("../images/generated/gear-test-mountain.png") center / cover no-repeat;
}

.bandeau--contact {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.94) 0%, rgba(12, 20, 29, 0.72) 52%, rgba(12, 20, 29, 0.36) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.82)),
    url("../images/generated/conference-resilience.png") center / cover no-repeat;
}

.bandeau--communaute {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.9) 0%, rgba(12, 20, 29, 0.66) 50%, rgba(12, 20, 29, 0.3) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/inclusive-local-action.png") center / cover no-repeat;
}

.team-presentation__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: clamp(30px, 5vw, 64px);
  align-items: center;
}

.team-presentation__photo {
  margin: 0;
  overflow: hidden;
  border-radius: var(--rayon);
  background: var(--nuit-2);
  box-shadow: var(--ombre);
}

.team-presentation__photo img {
  display: block;
  width: 100%;
  height: auto;
}

.team-presentation__contenu h2 {
  max-width: 15em;
}

.team-presentation__contenu p {
  max-width: 620px;
  margin-bottom: 14px;
  color: var(--roche);
  font-size: 1.06rem;
}

.article-carte__fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 190px;
  padding: 24px;
  color: rgba(255, 255, 255, 0.78);
  background:
    linear-gradient(135deg, rgba(15, 27, 39, 0.92), rgba(42, 64, 90, 0.84)),
    url("../images/hero-apex-outdoor.png") center / cover no-repeat;
}

.article-carte__fallback span {
  font-family: var(--titres);
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.article-carte__details {
  margin: 8px 0 14px;
  border-top: 1px solid var(--ligne);
  border-bottom: 1px solid var(--ligne);
}

.article-carte__details summary {
  display: flex;
  min-height: 44px;
  align-items: center;
  cursor: pointer;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.article-carte__details summary::marker {
  color: var(--apex);
}

.article-carte__contenu {
  padding: 2px 0 12px;
}

.article-carte__contenu p {
  margin-bottom: 12px;
  color: var(--gris);
}

.article-carte__liens {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin: 4px 0 8px;
}

.article-carte__liens .lien-suite {
  flex: 0 1 auto;
  font-size: 0.76rem;
}

.article-carte__action {
  gap: 6px;
  width: fit-content;
  max-width: 100%;
}

.article-carte__action::after {
  content: "";
}

.article-carte .article-carte__action--interne {
  min-height: 44px;
  margin-top: 8px;
  padding: 10px 16px;
  border: 1px solid var(--nuit);
  border-radius: 999px;
  background: var(--nuit);
  color: var(--blanc);
}

.article-carte .article-carte__action--interne:hover,
.article-carte .article-carte__action--interne:focus-visible {
  border-color: var(--apex);
  background: var(--apex);
  color: var(--blanc);
}

.article-carte__action--externe {
  color: var(--apex-fonce);
  text-decoration: underline;
  text-decoration-color: rgba(240, 97, 42, 0.45);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.article-carte__action--externe:hover,
.article-carte__action--externe:focus-visible {
  color: var(--apex);
  text-decoration-color: currentColor;
}

.article-carte__liens .article-carte__action {
  margin-top: 0;
}

.team-featured {
  margin: clamp(32px, 5vw, 54px) 0 0;
  padding: clamp(26px, 4vw, 38px) 0;
  border-top: 1px solid var(--ligne);
  border-bottom: 1px solid var(--ligne);
}

.team-featured[hidden] {
  display: none;
}

.team-featured__entete {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}

.team-featured__entete h3,
.team-publications__entete h3 {
  margin: 4px 0 8px;
  font-size: clamp(1.45rem, 2.8vw, 2rem);
}

.team-featured__entete p,
.team-publications__entete p {
  max-width: 680px;
  margin: 0;
  color: var(--gris);
}

.team-featured__controls {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.team-featured__controls button {
  width: 46px;
  min-width: 46px;
  height: 46px;
  border: 1px solid var(--apex-fonce);
  border-radius: 50%;
  background: transparent;
  color: var(--apex-fonce);
  cursor: pointer;
  font: 700 1.2rem/1 var(--titres);
}

.team-featured__controls button:hover,
.team-featured__controls button:focus-visible {
  border-color: var(--apex);
  background: var(--apex);
  color: var(--blanc);
}

.team-featured__controls button:disabled {
  border-color: var(--ligne);
  background: transparent;
  color: var(--gris);
  cursor: default;
  opacity: 0.45;
}

.team-featured__rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 36px) / 3);
  gap: 18px;
  max-width: 100%;
  padding: 3px 3px 16px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scroll-padding-inline: 3px;
  scroll-snap-type: inline mandatory;
  scrollbar-color: var(--apex) rgba(22, 34, 47, 0.1);
  scrollbar-width: thin;
}

.team-featured__rail:focus-visible {
  outline: 3px solid rgba(240, 97, 42, 0.4);
  outline-offset: 4px;
}

.team-featured__rail .article-carte {
  height: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

.team-featured__rail .media-photo {
  aspect-ratio: 16 / 10;
  min-height: 0;
}

.team-featured__rail .media-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-featured__rail .article-carte__media--logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 3vw, 38px);
  background: var(--neige);
}

.team-featured__rail .article-carte__media--logo-dark {
  background: var(--nuit-2);
}

.team-featured__rail .article-carte__media--logo img {
  width: 100%;
  height: auto;
  max-height: 126px;
  object-fit: contain;
}

.team-featured__rail .article-carte__corps {
  padding: 20px;
}

.team-featured__rail .article-carte__corps > p {
  display: -webkit-box;
  margin-bottom: 16px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.team-featured__rail .article-carte__liens {
  margin-top: auto;
}

.team-featured__rail .article-carte__liens .article-carte__action {
  width: 100%;
}

.team-featured-card__label {
  margin-bottom: 9px;
  color: var(--apex);
  font-family: var(--titres);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.team-featured__rail h4 {
  margin: 0 0 10px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 1.14rem;
  line-height: 1.12;
  text-transform: uppercase;
}

.team-featured__hint {
  margin: 8px 0 0;
  color: var(--gris);
  font-size: 0.84rem;
}

.team-publications__entete {
  margin: clamp(34px, 5vw, 52px) 0 20px;
}

@media (max-width: 760px) {
  .team-featured__rail {
    grid-auto-columns: calc((100% - 18px) / 2);
  }

  .team-presentation__grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .team-presentation__contenu {
    order: -1;
  }

  .team-presentation__contenu p {
    font-size: 1rem;
  }
}

@media (max-width: 560px) {
  .team-featured__entete {
    align-items: center;
  }

  .team-featured__entete > div:first-child {
    min-width: 0;
  }

  .team-featured__entete p {
    display: none;
  }

  .team-featured__rail {
    grid-auto-columns: min(84vw, 330px);
    gap: 14px;
  }

  .team-featured__rail .article-carte__corps {
    padding: 18px;
  }

  .team-featured__rail .article-carte__corps > p {
    -webkit-line-clamp: 4;
  }

  .article-feed--team .article-carte .media-photo {
    display: flex;
    min-height: 150px;
  }

  .article-feed--team .article-carte__corps > p:not(.article-carte__preuve) {
    display: block;
  }

  .article-feed--team .article-carte__liens {
    display: grid;
    gap: 4px;
  }

  .article-feed--team .article-carte__liens .lien-suite {
    width: 100%;
  }
}

.bandeau--calendrier-inclusif {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 48%, rgba(12, 20, 29, 0.3) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/para-trail-start.png") center / cover no-repeat;
}

.calendrier-intro-media {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
  gap: clamp(28px, 5vw, 58px);
  align-items: center;
  margin-bottom: 42px;
}

.calendrier-intro-media--inverse figure {
  grid-column: 2;
  grid-row: 1;
}

.calendrier-intro-media--inverse > div {
  grid-column: 1;
  grid-row: 1;
}

.calendrier-intro-media figure {
  width: 100%;
  aspect-ratio: 16 / 10;
  margin: 0;
  overflow: hidden;
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
}

.calendrier-intro-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.calendrier-intro-media h2 {
  max-width: 12em;
}

.calendrier-intro-media--inverse h2 {
  max-width: none;
}

.calendrier-intro-media p {
  max-width: 620px;
  margin-bottom: 14px;
  color: var(--roche);
  font-size: 1.08rem;
}

.calendrier-intro-media .kit-actions {
  margin-top: 22px;
}

.calendrier-source-officielle {
  max-width: 820px;
  margin: 0 0 22px;
  box-shadow: none;
}

.calendrier-source-officielle h3 {
  max-width: 24em;
  margin-top: 0.35rem;
}

.calendrier-source-officielle .lien-suite {
  min-height: 44px;
}

.calendrier-terrain {
  background: var(--nuit-2);
}

.calendrier-terrain .calendrier-intro-media p {
  color: #d8dee5;
}

.calendrier-interactif--terrain {
  margin-top: 12px;
}

.projet-para-trail-2027 {
  background: linear-gradient(180deg, #fff 0%, #f3f5f7 100%);
}

.projet-para-trail-2027__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: clamp(30px, 5vw, 64px);
  align-items: center;
}

.projet-para-trail-2027__affiche {
  margin: 0;
}

.projet-para-trail-2027__affiche a {
  display: block;
  overflow: hidden;
  border-radius: var(--rayon);
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.projet-para-trail-2027__affiche img {
  display: block;
  width: 100%;
  height: auto;
}

.projet-para-trail-2027__affiche figcaption {
  max-width: 64ch;
  margin-top: 10px;
  color: var(--roche);
  font-size: 0.84rem;
  line-height: 1.45;
}

.projet-para-trail-2027__contenu h2 {
  max-width: 14em;
  margin-top: 0.75rem;
}

.projet-para-trail-2027__contenu p {
  max-width: 620px;
  margin-bottom: 14px;
  color: var(--roche);
  font-size: 1.05rem;
}

.statut-projet {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  margin-bottom: 18px;
  padding: 7px 13px;
  border: 1px solid rgba(232, 92, 35, 0.3);
  border-radius: 999px;
  color: #9c3512;
  background: #fff1e9;
  font-family: var(--titres);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  .calendrier-intro-media {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 30px;
  }

  .calendrier-intro-media--inverse figure,
  .calendrier-intro-media--inverse > div {
    grid-column: auto;
    grid-row: auto;
  }

  .calendrier-intro-media--inverse > div {
    order: -1;
  }

  .calendrier-intro-media figure {
    aspect-ratio: 4 / 3;
  }

  .calendrier-intro-media p {
    font-size: 1rem;
  }

  .calendrier-intro-media .btn {
    width: 100%;
    text-align: center;
  }

  .projet-para-trail-2027__grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .projet-para-trail-2027__contenu {
    order: -1;
  }

  .projet-para-trail-2027__contenu p {
    font-size: 1rem;
  }
}

@media (max-width: 560px) {
  .filtres__toggle,
  .filtres__reset,
  .filtres--inclusifs .filtre {
    min-height: 44px;
  }
}

.bandeau--blog {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 50%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/volunteers-accessibility.png") center / cover no-repeat;
}

.bandeau--medias {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.94) 0%, rgba(12, 20, 29, 0.72) 50%, rgba(12, 20, 29, 0.36) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.8)),
    url("../images/generated/conference-resilience.png") center / cover no-repeat;
}

.bandeau--performances {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.7) 50%, rgba(12, 20, 29, 0.34) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/trail-portrait-mountain.png") center / cover no-repeat;
}

.bandeau--para-trail {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 48%, rgba(12, 20, 29, 0.3) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/para-trail-start.png") center / cover no-repeat;
}

.bandeau--mon-calendrier {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 50%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/volunteers-accessibility.png") center / cover no-repeat;
}

.bandeau--kit-media {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.94) 0%, rgba(12, 20, 29, 0.72) 50%, rgba(12, 20, 29, 0.36) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.8)),
    url("../images/generated/conference-resilience.png") center / cover no-repeat;
}

.bandeau--guide-course {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 50%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/volunteers-accessibility.png") center / cover no-repeat;
}

.bandeau--dossier-partenaire {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.92) 0%, rgba(12, 20, 29, 0.68) 50%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    url("../images/generated/gear-test-mountain.png") center / cover no-repeat;
}

.bandeau--article {
  background:
    linear-gradient(90deg, rgba(12, 20, 29, 0.9) 0%, rgba(12, 20, 29, 0.66) 52%, rgba(12, 20, 29, 0.32) 100%),
    linear-gradient(180deg, rgba(12, 20, 29, 0.08), rgba(12, 20, 29, 0.78)),
    var(--article-hero-image, url("../images/generated/trail-portrait-mountain.png")) center / cover no-repeat;
}

.portrait-rapide {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 52px;
  align-items: center;
}

.portrait-rapide__texte {
  min-width: 0;
}

.portrait-intro {
  max-width: 720px;
  color: var(--roche);
  font-size: 1.16rem;
  line-height: 1.7;
}

.portrait-intro p:last-child {
  margin-bottom: 0;
}

.portrait-manifeste {
  max-width: 680px;
  margin: 28px 0 0;
  padding-top: 20px;
  border-top: 2px solid var(--apex);
  color: var(--nuit);
  font-family: var(--titres);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.16;
  text-transform: uppercase;
}

.frise-parcours-longue {
  background: #edf2f5;
}

.frise-parcours-longue .section-entete {
  align-items: start;
}

.roles-thomas {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.roles-thomas article {
  min-height: 190px;
  padding: 26px;
  background: var(--blanc);
}

.roles-thomas strong {
  display: block;
  margin-bottom: 14px;
  font-family: var(--titres);
  font-size: 1.35rem;
  line-height: 1.05;
  text-transform: uppercase;
  color: var(--nuit);
}

.roles-thomas span {
  color: var(--gris);
}

.recit-signature {
  scroll-margin-top: 104px;
  margin-top: 28px;
  padding: 22px 0 22px 24px;
  border-left: 5px solid var(--apex);
}

.recit-signature span {
  display: block;
  margin-bottom: 10px;
  color: var(--apex-fonce);
  font-family: var(--titres);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.recit-signature p {
  max-width: 720px;
  margin: 0;
  color: var(--encre);
  font-size: 1.08rem;
  line-height: 1.65;
}

.recit-bascule {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 38px;
  align-items: start;
}

.recit-bascule h2 {
  max-width: 9em;
}

.recit-bascule__points {
  display: grid;
  gap: 1px;
  border: 1px solid var(--ligne);
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.recit-bascule__points article {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 22px;
  padding: 24px 28px;
  background: var(--blanc);
}

.recit-bascule__points span {
  font-family: var(--titres);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.recit-bascule__points p {
  margin: 0;
  color: var(--gris);
}

.recit-tension {
  display: grid;
  grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
  gap: 42px;
  align-items: start;
}

.recit-tension h2 {
  max-width: 9em;
}

.recit-tension p {
  color: #d8dee5;
  font-size: 1.08rem;
}

.recit-tension p:last-child {
  margin-bottom: 0;
}

.frise--dense {
  max-width: 920px;
}

.frise--dense li {
  padding-bottom: 30px;
}

.frise-visuelle {
  max-width: 1060px;
  margin: 44px auto 0;
  padding: 8px 0;
  overflow: visible;
}

.frise-visuelle:focus-visible {
  outline: 3px solid rgba(240, 97, 42, 0.28);
  outline-offset: 8px;
}

.frise.frise-visuelle::before {
  left: 50%;
  top: 42px;
  bottom: 42px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, transparent 0, var(--ligne) 8%, var(--ligne) 92%, transparent 100%);
}

.frise-visuelle li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
  gap: 26px;
  align-items: center;
  padding: 0 0 46px;
}

.frise-visuelle li:last-child {
  padding-bottom: 0;
}

.frise-visuelle li::before {
  left: 50%;
  top: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.frise-visuelle__texte {
  grid-column: 1;
  max-width: 380px;
}

.frise-visuelle__texte h3 {
  margin: 0.14em 0 0.35em;
  font-size: clamp(1.55rem, 3vw, 2.25rem);
  line-height: 0.98;
  text-transform: uppercase;
}

.frise-visuelle__texte p {
  max-width: 340px;
  margin: 0;
}

.frise-visuelle__media {
  grid-column: 3;
  width: 100%;
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: var(--ombre);
}

.frise-visuelle__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.frise-visuelle__item--inverse .frise-visuelle__texte {
  grid-column: 3;
  grid-row: 1;
}

.frise-visuelle__item--inverse .frise-visuelle__media {
  grid-column: 1;
  grid-row: 1;
}

.dossier-sensible {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 28px;
  align-items: center;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(120, 137, 154, 0.28);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 250, 252, 0.94));
  box-shadow: 0 18px 42px rgba(22, 34, 47, 0.08);
}

.dossier-sensible h2 {
  max-width: 760px;
}

.dossier-sensible p {
  max-width: 720px;
  color: var(--gris);
}

.dossier-sensible__media {
  margin: 0;
  overflow: hidden;
  border: 1px dashed rgba(120, 137, 154, 0.44);
  border-radius: 14px;
  background: var(--blanc);
}

.dossier-sensible__media img {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: block;
  object-fit: contain;
  padding: 34px;
}

.dossier-sensible__media figcaption {
  padding: 10px 14px 14px;
  color: var(--roche);
  font-size: 0.88rem;
}

.engagements-bloc {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 42px;
  align-items: start;
}

.citation--forte {
  max-width: 920px;
}

.cta-bande--recit {
  background: linear-gradient(135deg, #101a25 0%, #263c53 100%);
  color: var(--blanc);
}

.cta-bande--recit .kicker {
  color: var(--apex);
}

.cta-bande--recit h2 {
  color: var(--blanc);
}

.cta-bande--recit p {
  color: #d8dee5;
}

.cta-bande .kit-actions {
  margin-top: 0;
}

@media (max-width: 920px) {
  .portrait-rapide,
  .roles-thomas,
  .recit-bascule,
  .recit-tension,
  .engagements-bloc {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .portrait-intro {
    font-size: 1.04rem;
  }

  .portrait-manifeste {
    font-size: 1.4rem;
  }

  .frise-visuelle {
    margin-top: 34px;
    padding-right: 0;
  }

  .frise.frise-visuelle::before {
    left: 11px;
    top: 8px;
    bottom: 8px;
    transform: none;
  }

  .frise-visuelle li {
    display: block;
    padding: 0 0 36px 52px;
  }

  .frise-visuelle li::before {
    left: 2px;
    top: 6px;
    transform: none;
  }

  .frise-visuelle__texte,
  .frise-visuelle__media,
  .frise-visuelle__item--inverse .frise-visuelle__texte,
  .frise-visuelle__item--inverse .frise-visuelle__media {
    grid-column: auto;
    grid-row: auto;
  }

  .frise-visuelle__texte h3 {
    font-size: 1.55rem;
  }

  .frise-visuelle__media {
    aspect-ratio: 16 / 10;
    margin-top: 16px;
  }

  .dossier-sensible {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .recit-bascule__points article {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 20px;
  }
}

/* ---------- Guide organisateur ---------- */
.organisateur-publication {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 42px;
  align-items: start;
}

.organisateur-publication__intro {
  position: sticky;
  top: 104px;
}

.organisateur-publication__intro p {
  color: var(--gris);
  font-size: 1.08rem;
}

.publication-modele {
  border-radius: var(--rayon);
  border: 1px solid rgba(22, 34, 47, 0.14);
  overflow: hidden;
  background: var(--blanc);
  box-shadow: var(--ombre);
}

.publication-modele__entete {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 26px;
  background: var(--nuit);
  color: var(--blanc);
}

.publication-modele__entete span,
.publication-modele__entete strong {
  font-family: var(--titres);
  line-height: 1.05;
  text-transform: uppercase;
}

.publication-modele__entete span {
  color: var(--apex);
  letter-spacing: 0.08em;
}

.publication-modele__entete strong {
  max-width: 220px;
  text-align: right;
  font-size: 1.2rem;
}

.publication-modele dl {
  display: grid;
  margin: 0;
}

.publication-modele dl div {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 20px;
  padding: 22px 26px;
  border-top: 1px solid var(--ligne);
}

.publication-modele dt {
  font-family: var(--titres);
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--apex-fonce);
}

.publication-modele dd {
  margin: 0;
  color: var(--gris);
}

.publication-modele .note-info {
  margin: 0;
  border-radius: 0;
  border-width: 1px 0 0;
  background: rgba(240, 97, 42, 0.10);
}

.organisateur-checklist {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 34px;
  border-radius: var(--rayon);
  overflow: hidden;
  background: var(--ligne);
  box-shadow: var(--ombre);
}

.organisateur-checklist article {
  min-height: 238px;
  padding: 28px;
  background: var(--blanc);
}

.organisateur-checklist span {
  display: block;
  margin-bottom: 20px;
  font-family: var(--titres);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: rgba(46, 125, 91, 0.48);
}

.organisateur-checklist p {
  color: var(--gris);
  margin-bottom: 0;
}

@media (max-width: 900px) {
  .organisateur-publication {
    grid-template-columns: 1fr;
  }

  .organisateur-publication__intro {
    position: static;
  }

  .organisateur-checklist {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .publication-modele__entete,
  .publication-modele dl div {
    grid-template-columns: 1fr;
  }

  .publication-modele__entete {
    display: grid;
  }

  .publication-modele__entete strong {
    max-width: none;
    text-align: left;
  }
}

/* ---------- Harmonisation contraste ---------- */
.intro-section,
.section-entete p,
.preuve-ligne p,
.orientation-route em,
.processus-mission p,
.carte p,
.carte ul,
.chantier-para p,
.media-ressource p,
.roadbook__item p,
.format-ligne p,
.kit-copy p,
.kit-angles p,
.kit-visuels p,
.kit-visuels li,
.partenaire-promesse span,
.partenaire-offres p,
.partenaire-offres li,
.partenaire-processus p,
.organisateur-publication__intro p,
.organisateur-checklist p,
.publication-modele dd,
.recit-court p {
  color: var(--roche);
}

.section--sombre .intro-section,
.section--sombre .section-entete p,
.section--sombre .carte p,
.section--sombre .carte ul,
.section--sombre .recit-court p,
.section--sombre .performance-card p,
.section--sombre .statut-preuve p {
  color: #d8dee5;
}

.carte,
.article-carte,
.preuve-ligne,
.orientation-route,
.processus-mission article,
.roadbook__item,
.format-ligne,
.kit-fiche,
.kit-visuels,
.kit-copy article,
.kit-angles article,
.partenaire-promesse article,
.partenaire-offres article,
.partenaire-processus article,
.organisateur-checklist article,
.publication-modele,
.media-kit,
.lead-magnet {
  border-color: rgba(22, 34, 47, 0.16);
  background: #fffdf9;
  box-shadow: 0 10px 28px rgba(22, 34, 47, 0.10);
}

.section--blanche .carte,
.section--blanche .article-carte,
.section--blanche .preuve-ligne,
.section--blanche .orientation-route,
.section--blanche .processus-mission article,
.section--blanche .roadbook__item,
.section--blanche .format-ligne,
.section--blanche .kit-fiche,
.section--blanche .kit-visuels,
.section--blanche .kit-copy article,
.section--blanche .kit-angles article,
.section--blanche .partenaire-promesse article,
.section--blanche .partenaire-offres article,
.section--blanche .partenaire-processus article,
.section--blanche .organisateur-checklist article {
  background: var(--blanc);
}

.section--sombre .carte,
.section--sombre .recit-court li,
.section--sombre .statut-preuve--sombre article {
  background: rgba(255, 255, 255, 0.10);
  border-color: rgba(255, 255, 255, 0.18);
  color: var(--blanc);
}

.section--sombre .recit-court,
.section--sombre .statut-preuve--sombre {
  background: rgba(255, 255, 255, 0.18);
}

.section--sombre .recit-court strong {
  color: var(--blanc);
}

.section--sombre .btn--plein {
  color: var(--nuit);
}

.recit-court,
.statut-preuve,
.partenaire-processus {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}

.recit-court.recit-court--6 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 900px) {
  .recit-court.recit-court--6 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .recit-court.recit-court--6 {
    grid-template-columns: 1fr;
  }
}

.processus-mission span,
.kit-angles span,
.partenaire-processus span,
.organisateur-checklist span,
.format-ligne::before,
.roadbook__item::before {
  color: rgba(240, 97, 42, 0.68);
}

.organisateur-checklist span {
  color: rgba(46, 125, 91, 0.76);
}

.badge,
.badge--vert {
  border-color: var(--apex);
  background: transparent;
  color: var(--roche);
  box-shadow: none;
}

.badge--bleu,
.badge--gris {
  border-color: var(--apex);
  background: transparent;
  color: var(--roche);
}

.section--sombre .badge,
.section--sombre .badge--vert,
.section--sombre .badge--bleu,
.section--sombre .badge--gris,
.calendrier-detail .badge,
.calendrier-detail .badge--vert,
.calendrier-detail .badge--bleu,
.calendrier-detail .badge--gris {
  color: rgba(255, 255, 255, 0.86);
}

.btn--contour {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.78);
  color: var(--blanc);
}

.btn--contour-sombre {
  background: rgba(255, 255, 255, 0.42);
  border-color: var(--nuit);
  color: var(--nuit);
}

.lien-suite {
  color: var(--apex-fonce);
}

.cta-bande .lien-suite {
  color: var(--nuit);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.cta-bande .lien-suite:hover,
.cta-bande .lien-suite:focus-visible {
  color: var(--nuit);
}

.cta-bande .btn--contour-sombre {
  background: transparent;
  border-color: var(--nuit);
  color: var(--nuit);
}

.cta-bande .btn--contour-sombre:hover,
.cta-bande .btn--contour-sombre:focus-visible {
  background: rgba(22, 34, 47, 0.08);
  color: var(--nuit);
}

.section--sombre .btn--contour {
  border-color: rgba(255, 255, 255, 0.78);
  color: var(--blanc);
}

.section--sombre .btn--contour:hover,
.section--sombre .btn--contour:focus-visible {
  border-color: #ffb38f;
  color: #ffb38f;
}

/* ---------- Accueil : exemples d'accompagnement ---------- */
.accompagnement-grille {
  gap: 28px;
}

.section--sombre .accompagnement-grille .carte {
  position: relative;
  min-height: 250px;
  overflow: hidden;
  padding: 34px 34px 30px;
  background:
    radial-gradient(circle at 92% 14%, rgba(71, 85, 105, 0.34), transparent 28%),
    radial-gradient(circle at 0% 100%, rgba(255, 122, 0, 0.10), transparent 34%),
    linear-gradient(145deg, rgba(51, 65, 85, 0.96), rgba(30, 41, 59, 0.96));
  border-color: rgba(71, 85, 105, 0.95);
  box-shadow: 0 18px 44px rgba(5, 13, 22, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.section--sombre .accompagnement-grille .carte::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 7px;
  background: linear-gradient(180deg, #ff7a00, #f0612a);
  pointer-events: none;
}

.section--sombre .accompagnement-grille .carte::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 16px;
  z-index: 1;
  width: 112px;
  height: 112px;
  background: var(--accompagnement-card-fond) center / contain no-repeat;
  opacity: 0.16;
  pointer-events: none;
}

.accompagnement-grille .carte:nth-child(1) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/diagnostic.png");
}

.accompagnement-grille .carte:nth-child(2) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/politique.png");
}

.accompagnement-grille .carte:nth-child(3) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/accueil.png");
}

.accompagnement-grille .carte:nth-child(4) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/formulaire.png");
}

.accompagnement-grille .carte:nth-child(5) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/guides.png");
}

.accompagnement-grille .carte:nth-child(6) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/assistance.png");
}

.accompagnement-grille .carte:nth-child(7) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/communication.png");
}

.accompagnement-grille .carte:nth-child(8) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/reglementation.png");
}

.accompagnement-grille .carte:nth-child(9) {
  --accompagnement-card-fond: url("../images/accompagnement-bg-pictos/label.png");
}

.accompagnement-card__entete {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin-bottom: 24px;
}

.accompagnement-card__icone {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  justify-self: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  border: 1.5px solid #ff7a00;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 45%, rgba(35, 53, 71, 0.98), rgba(19, 38, 52, 0.98));
  box-shadow: 0 0 0 6px rgba(8, 33, 47, 0.42), 0 8px 15px rgba(5, 13, 22, 0.22);
}

.accompagnement-card__icone img {
  display: block;
  width: 28px;
  height: 28px;
  object-fit: contain;
  object-position: center;
}

.accompagnement-grille .carte h3 {
  max-width: 13em;
  margin: 0;
  color: var(--blanc);
  font-size: 1.44rem;
  line-height: 1.05;
  text-align: left;
}

.accompagnement-card__entete h3::after {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  margin: 16px 0 0;
  background: #ff7a00;
}

.section--sombre .accompagnement-grille .carte p {
  position: relative;
  z-index: 2;
  max-width: 95%;
  color: #e2e8f0;
  font-size: 1.06rem;
  line-height: 1.62;
}

@media (hover: hover) and (pointer: fine) {
  .section--sombre .accompagnement-grille .carte:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 122, 0, 0.58);
    background:
      radial-gradient(circle at 92% 14%, rgba(71, 85, 105, 0.42), transparent 28%),
      radial-gradient(circle at 0% 100%, rgba(255, 122, 0, 0.14), transparent 34%),
      linear-gradient(145deg, rgba(51, 65, 85, 1), rgba(30, 41, 59, 1));
    box-shadow: 0 24px 52px rgba(5, 13, 22, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  }
}

@media (max-width: 620px) {
  .accompagnement-grille {
    gap: 18px;
  }

  .section--sombre .accompagnement-grille .carte {
    min-height: 0;
    padding: 22px 20px 24px;
  }

  .accompagnement-card__entete {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 12px;
    margin-bottom: 18px;
  }

  .accompagnement-card__icone {
    width: 46px;
    height: 46px;
    box-shadow: 0 0 0 5px rgba(8, 33, 47, 0.42), 0 7px 13px rgba(5, 13, 22, 0.22);
  }

  .accompagnement-card__icone img {
    width: 23px;
    height: 23px;
  }

  .accompagnement-grille .carte h3 {
    font-size: 1.2rem;
  }

  .accompagnement-card__entete h3::after {
    margin-top: 12px;
  }

  .section--sombre .accompagnement-grille .carte p {
    max-width: none;
    font-size: 0.98rem;
  }
}

/* ---------- Lot V6 : première vague de retours ---------- */
@media (min-width: 981px) {
  .page-accueil .heros h1 {
    max-width: 9em;
    font-size: clamp(4.25rem, 6.5vw, 5.35rem);
    line-height: 0.94;
  }

  .page-accueil .heros__promesse {
    max-width: 640px;
    font-size: clamp(1.55rem, 2.25vw, 1.85rem);
    line-height: 1.12;
  }

  .page-accueil .section-entete h2,
  .page-team .section-entete h2,
  .page-calendrier main h2 {
    font-size: clamp(1.9rem, 2.75vw, 2.4rem);
    line-height: 1.12;
  }

  .page-team .bandeau h1,
  .page-calendrier .bandeau h1 {
    max-width: 12em;
    font-size: clamp(3.9rem, 5.35vw, 4.8rem);
    line-height: 0.96;
  }

  .page-team .team-presentation__contenu h2 {
    font-size: clamp(1.9rem, 2.6vw, 2.25rem);
    line-height: 1.14;
  }

  .page-team .team-featured__entete h3,
  .page-team .team-publications__entete h3 {
    font-size: clamp(1.45rem, 2.1vw, 1.8rem);
    line-height: 1.15;
  }
}

.page-calendrier .calendrier-periode,
.page-calendrier .filtres--inclusifs {
  border-color: rgba(240, 97, 42, 0.3);
  border-top: 4px solid var(--apex);
  box-shadow: 0 16px 36px rgba(23, 35, 52, 0.1);
}

.page-calendrier .calendrier-periode {
  background: linear-gradient(135deg, #ffffff 0%, #f4f7fa 100%);
}

.page-calendrier .filtres--inclusifs {
  background: linear-gradient(135deg, #f5f8fb 0%, #e8eef4 100%);
}

.page-calendrier .calendrier-mode__button.is-active,
.page-calendrier .filtre[aria-pressed="true"] {
  background: var(--apex);
  border-color: var(--apex);
  color: var(--blanc);
  box-shadow: 0 7px 18px rgba(240, 97, 42, 0.24);
}

.page-calendrier .calendrier-mobile-mois__grid {
  box-shadow: 0 14px 32px rgba(23, 35, 52, 0.1);
}

.page-calendrier .calendrier-terrain .calendrier-periode,
.page-calendrier .filtres--terrain {
  border-color: rgba(255, 179, 143, 0.42);
  border-top-color: var(--apex);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 18px 40px rgba(3, 10, 17, 0.2);
}