/* Police Poppins hébergée sur le site (licence SIL OFL, fichier polices/LICENCE-OFL.txt) :
   aucune requête vers Google Fonts, donc aucune adresse IP transmise à un tiers. */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 300; font-display: swap; src: url("../polices/poppins-latin-300-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("../polices/poppins-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: italic; font-weight: 400; font-display: swap; src: url("../polices/poppins-latin-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 500; font-display: swap; src: url("../polices/poppins-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap; src: url("../polices/poppins-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap; src: url("../polices/poppins-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 800; font-display: swap; src: url("../polices/poppins-latin-800-normal.woff2") format("woff2"); }

/*
  STYLE DU SITE GET INSPIRED BY GIII
  Tout part du logo : un mot fort en corail à côté de mots légers en marine
  (comme « GET INSPIRED »), et le carré jaune aux coins arrondis du globe.
  Seulement les quatre couleurs de la marque.
*/

/* ---------- 1. Couleurs et réglages de base ---------- */
:root {
  --corail: #E0728B;
  --marine: #1C2541;
  --jaune: #EFBE3F;
  --creme: #F8F4EB;
  --blanc: #FFFFFF;

  --marine-doux: rgba(28, 37, 65, 0.78);  /* texte secondaire : le marine, un peu adouci */
  --trait: rgba(28, 37, 65, 0.15);

  --largeur: 72rem;
  --rayon: 22px;         /* le même arrondi que le carré jaune du logo */
  --rayon-petit: 12px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  .btn:hover { transform: none; }
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

body {
  margin: 0;
  background: var(--creme);
  color: var(--marine);
  font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: var(--marine); text-decoration-color: var(--corail); text-decoration-thickness: 2px; text-underline-offset: 4px; }
a:hover { text-decoration-color: var(--marine); }
:focus-visible { outline: 3px solid var(--corail); outline-offset: 3px; border-radius: 6px; }

/* Les titres reprennent le logo : léger par défaut, un mot fort en corail */
h1, h2, h3 { margin: 0 0 .5em; line-height: 1.12; text-wrap: balance; }
h1 { font-size: clamp(2.3rem, 7.5vw, 4.5rem); font-weight: 300; letter-spacing: -0.02em; }
h2 { font-size: clamp(1.75rem, 4.6vw, 2.75rem); font-weight: 300; letter-spacing: -0.015em; }
h3 { font-size: 1.2rem; font-weight: 600; }
h1 strong, h2 strong { font-weight: 800; color: var(--corail); }
p { margin: 0 0 1em; }

.conteneur { width: 100%; max-width: var(--largeur); margin: 0 auto; padding: 0 1rem; }
@media (min-width: 48rem) { .conteneur { padding: 0 2rem; } }
.section { padding: 4rem 0; }
@media (min-width: 48rem) { .section { padding: 5.5rem 0; } }
.section--blanc { background: var(--blanc); }
.section--marine { background: var(--marine); color: var(--creme); }
.section--marine a:not(.btn) { color: var(--creme); }
.section--marine h2 strong, .section--marine h1 strong { color: var(--jaune); }

.visuellement-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lien-evitement { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--marine); color: var(--creme); padding: .6rem 1rem; border-radius: 8px; }
.lien-evitement:focus { top: 1rem; }

/* Petite étiquette au-dessus d'un titre */
.etiquette-section {
  display: inline-block; margin-bottom: 1rem;
  font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  background: var(--jaune); color: var(--marine);
  padding: .3rem .8rem; border-radius: 8px;
}
.chapeau { font-size: clamp(1.05rem, 2.3vw, 1.25rem); color: var(--marine-doux); max-width: 38rem; }
.section--marine .chapeau { color: rgba(248,244,235,.85); }

/* Ce qui reste à compléter : bien visible pour Gigi */
.a-completer {
  font-style: normal; font-weight: 500; font-size: .9em; color: var(--marine);
  background: rgba(239,190,63,.25); border: 1px dashed var(--marine);
  border-radius: 6px; padding: 0 .35em;
}
.section--marine .a-completer { color: var(--creme); border-color: var(--creme); background: rgba(239,190,63,.18); }

/* ---------- 2. Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 3rem; padding: .75rem 1.5rem;
  font: inherit; font-weight: 600; font-size: 1rem; line-height: 1.2; text-align: center;
  text-decoration: none; cursor: pointer;
  border: 2px solid var(--marine); border-radius: 999px;
  background: var(--marine); color: var(--creme);
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn--corail { background: var(--corail); border-color: var(--corail); color: var(--marine); }
.btn--jaune { background: var(--jaune); border-color: var(--jaune); color: var(--marine); }
.btn--contour { background: transparent; color: var(--marine); }
.btn--contour:hover { background: var(--marine); color: var(--creme); }
.section--marine .btn--contour { color: var(--creme); border-color: var(--creme); }
.section--marine .btn--contour:hover { background: var(--creme); color: var(--marine); }
.btn[aria-disabled="true"] { background: transparent; color: var(--marine-doux); border: 2px dashed var(--trait); cursor: default; }
.btn[aria-disabled="true"]:hover { transform: none; }
.section--marine .btn[aria-disabled="true"] { color: rgba(248,244,235,.8); border-color: rgba(248,244,235,.4); }
.groupe-btn { display: flex; flex-wrap: wrap; gap: .75rem; }

/* Lien Luma : on le reconnaît tout de suite */

/* ---------- 3. En-tête et navigation ---------- */
.entete { position: sticky; top: 0; z-index: 50; background: var(--creme); border-bottom: 1px solid var(--trait); }
.entete .conteneur { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.5rem; }
.logo { display: block; flex: none; }
.logo img { height: 2.4rem; width: auto; }
@media (min-width: 48rem) { .logo img { height: 2.75rem; } }

.menu-bouton {
  display: inline-flex; align-items: center; gap: .5rem;
  font: inherit; font-weight: 600; font-size: .95rem; color: var(--marine);
  background: var(--jaune); border: 0; border-radius: 999px; padding: .5rem 1.1rem; min-height: 2.75rem; cursor: pointer;
}
.menu-bouton .barres { width: 1.1rem; height: 2px; background: currentColor; position: relative; }
.menu-bouton .barres::before, .menu-bouton .barres::after { content: ""; position: absolute; left: 0; width: 100%; height: 2px; background: currentColor; }
.menu-bouton .barres::before { top: -6px; }
.menu-bouton .barres::after { top: 6px; }

.nav ul { list-style: none; margin: 0; padding: 0; }
.nav a { text-decoration: none; color: var(--marine); font-weight: 500; }
.nav a[aria-current="page"] { font-weight: 700; color: var(--corail); }

@media (max-width: 85.99rem) {
  .nav { display: none; }
  .nav.ouvert { display: block; position: fixed; inset: 4.5rem 0 0 0; background: var(--creme); overflow-y: auto; padding: 1rem 1rem 3rem; }
  .nav li { border-bottom: 1px solid var(--trait); }
  .nav a { display: block; padding: 1rem .25rem; font-size: 1.35rem; font-weight: 500; }
  .nav .nav-cta { border: 0; margin-top: 1.5rem; }
  .nav .nav-cta a { display: inline-flex; font-size: 1rem; padding: .75rem 1.5rem; color: var(--marine); }
  body.menu-ouvert { overflow: hidden; }
}
@media (min-width: 86rem) {
  .menu-bouton { display: none; }
  .nav ul { display: flex; align-items: center; gap: 1.25rem; }
  .nav a { white-space: nowrap; }
  .nav a { font-size: .95rem; padding: .4rem 0; }
  .nav .nav-cta a { padding: .55rem 1.2rem; min-height: 2.6rem; font-size: .95rem; color: var(--marine); }
}

/* ---------- 4. Pied de page ---------- */
.pied { background: var(--marine); color: var(--creme); padding: 4rem 0 2rem; }
.pied a { color: var(--creme); text-decoration: none; }
.pied a:hover { color: var(--jaune); }
.pied-haut { display: grid; gap: 2.5rem; }
@media (min-width: 48rem) { .pied-haut { grid-template-columns: 1.5fr 1fr 1fr; } }
.pied-marque { display: flex; gap: 1rem; align-items: flex-start; }
.pied-marque img { width: 3.5rem; height: auto; flex: none; }
.pied .devise { font-size: 1.3rem; font-weight: 300; line-height: 1.35; margin: 0 0 1rem; }
.pied .devise strong { font-weight: 800; color: var(--corail); }
.pied h2 { font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--jaune); margin-bottom: 1rem; }
.pied ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.pied-bas { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(248,244,235,.2); font-size: .85rem; color: rgba(248,244,235,.8); display: flex; flex-wrap: wrap; gap: .5rem 2rem; justify-content: space-between; }

/* ---------- 5. Le cadre photo : le carré jaune du logo ---------- */
.cadre {
  background: var(--jaune); border-radius: var(--rayon); padding: 1rem;
  width: 100%; max-width: 24rem;
}
.cadre img, .cadre .cadre-vide { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: calc(var(--rayon) - 8px); }
.cadre-vide { display: grid; place-items: center; text-align: center; padding: 1.5rem; background: var(--creme); color: var(--marine-doux); font-size: .95rem; }
.cadre figcaption { margin-top: .75rem; font-weight: 600; font-size: .95rem; text-align: center; }

/* ---------- 6. Accueil ---------- */
.accroche { padding: 3rem 0 4rem; }
@media (min-width: 48rem) { .accroche { padding: 4.5rem 0 5.5rem; } }
.accroche-grille { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 56rem) { .accroche-grille { grid-template-columns: 1.3fr 1fr; gap: 4rem; } }
.accroche .chapeau { margin-bottom: 2rem; }
.accroche .cadre { justify-self: center; }
.faits { list-style: none; padding: 0; margin: 0 0 1.75rem; }
.faits li { display: flex; gap: 1rem; padding: .85rem 0; border-top: 1px solid rgba(248,244,235,.25); }
.faits li:last-child { border-bottom: 1px solid rgba(248,244,235,.25); }
.faits strong { min-width: 4.5rem; color: var(--jaune); font-weight: 600; }

/* Les trois piliers */
.piliers { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 56rem) { .piliers { grid-template-columns: repeat(3, 1fr); } }
.pilier { padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); display: grid; gap: .75rem; align-content: start; }
.pilier .icone { width: 3.25rem; height: 3.25rem; border-radius: 14px; background: var(--jaune); display: grid; place-items: center; }
.pilier .icone svg { width: 1.7rem; height: 1.7rem; }
.pilier h3 { margin: 0; font-size: 1.15rem; }
.pilier .question { margin: 0; color: var(--marine-doux); }
.mots { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; padding: 0; margin: .25rem 0 0; }
.mots li { font-size: .82rem; font-weight: 500; padding: .2rem .7rem; border-radius: 999px; background: var(--creme); }

/* Les projets */
.statut { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: .15rem .6rem; border-radius: 6px; }
.statut--en-preparation { background: var(--jaune); color: var(--marine); }

/* ---------- 7. Pages intérieures ---------- */
.tete-page { padding: 3rem 0 2.5rem; }
@media (min-width: 48rem) { .tete-page { padding: 4.5rem 0 3rem; } }
.tete-page h1 { max-width: 18ch; }
.tete-page .chapeau { margin: 0; }

.deux-col { display: grid; gap: 2rem; }
@media (min-width: 56rem) { .deux-col { grid-template-columns: 1fr 1.4fr; gap: 4.5rem; } }

/* Bloc Luma sur la page Rencontres */

/* Liste des sessions */
.sessions { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; }

/* Intervenant·es */
.personnes { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 40rem) { .personnes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .personnes { grid-template-columns: repeat(3, 1fr); } }
.personne { height: 100%; padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); display: grid; gap: .75rem; align-content: start; }
.personne .portrait { width: 5rem; height: 5rem; border-radius: 18px; object-fit: cover; }
.personne .initiales { width: 5rem; height: 5rem; border-radius: 18px; background: var(--jaune); display: grid; place-items: center; font-weight: 800; font-size: 1.5rem; }
.personne h3 { margin: 0; }
.personne .poste { margin: 0; color: var(--marine-doux); font-size: .95rem; }
.personne .sessions-de { margin: 0; font-size: .9rem; }
.personne .sessions-de a { font-weight: 600; }
.personne .presentation { margin: 0; font-size: .95rem; }

/* Ressources */
.filtres { display: grid; gap: 1.25rem; margin: 0 0 2rem; }
.filtres fieldset { border: 0; padding: 0; margin: 0; }
.filtres legend { font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: .6rem; }
.filtres .options { display: flex; flex-wrap: wrap; gap: .5rem; }
.puce { font: inherit; font-size: .92rem; font-weight: 500; color: var(--marine); background: var(--blanc); border: 1.5px solid var(--trait); border-radius: 999px; padding: .45rem 1rem; min-height: 2.75rem; cursor: pointer; }
.puce:hover { border-color: var(--marine); }
.puce[aria-pressed="true"] { background: var(--marine); border-color: var(--marine); color: var(--creme); }
.compteur { font-size: .95rem; color: var(--marine-doux); margin-bottom: 1rem; }
.ressources { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.25rem; }
.ressource { display: grid; gap: 1rem 1.75rem; padding: 1.5rem; border-radius: var(--rayon); background: var(--blanc); }
@media (min-width: 48rem) { .ressource { grid-template-columns: 12rem 1fr; align-items: center; } }
.ressource-visuel { aspect-ratio: 16 / 9; max-width: 100%; border-radius: var(--rayon-petit); overflow: hidden; background: var(--jaune); display: grid; place-items: center; font-weight: 800; font-size: 1.4rem; }
.ressource-visuel img { width: 100%; height: 100%; object-fit: cover; }
.ressource .type { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--marine-doux); }
.ressource h3 { margin: .25rem 0 .4rem; }
.ressource p { color: var(--marine-doux); margin-bottom: .5rem; }
.ressource a { font-weight: 600; }
.vide { padding: 2rem; border: 2px dashed var(--trait); border-radius: var(--rayon); text-align: center; color: var(--marine-doux); margin: 0; }
.section--marine .vide { border-color: rgba(248,244,235,.3); color: rgba(248,244,235,.85); }

/* Summit */
.tete-summit { padding: 3.5rem 0 4rem; }
@media (min-width: 48rem) { .tete-summit { padding: 5.5rem 0; } }
.tete-summit h1 { font-size: clamp(2.5rem, 8.5vw, 5.2rem); max-width: 12ch; }
.compte { display: flex; gap: .75rem; margin: 2rem 0; flex-wrap: wrap; }
.compte div { min-width: 5.5rem; padding: .8rem 1rem; border-radius: 16px; background: var(--jaune); color: var(--marine); text-align: center; }
.compte strong { display: block; font-size: 2.1rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.compte span { font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.compte:empty { display: none; }
.infos-summit { display: grid; gap: 1.25rem; margin: 0; }
@media (min-width: 48rem) { .infos-summit { grid-template-columns: repeat(2, 1fr); } }
.infos-summit div { padding: 1.5rem 1.75rem; border-radius: var(--rayon); background: var(--blanc); }
.infos-summit dt { font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--marine-doux); margin-bottom: .35rem; }
.infos-summit dd { margin: 0; font-size: 1.25rem; font-weight: 600; }
.programme { list-style: none; padding: 0; margin: 0; }
.programme li { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--trait); }
.programme .heure { font-weight: 700; }
.liste-noms { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1rem; }
.liste-noms li { padding: .35rem .9rem; border-radius: 999px; background: var(--blanc); font-weight: 500; }

/* Partenaires */
.logos { list-style: none; padding: 0; margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: 2rem; align-items: center; }
.logos img { max-height: 4rem; width: auto; }
.facons { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; gap: 1rem; }
.facons li { padding: 1.5rem 1.75rem; border-radius: var(--rayon); background: var(--blanc); }
.facons strong { display: block; font-size: 1.15rem; margin-bottom: .25rem; }
.facons p { margin: 0; color: var(--marine-doux); }

/* Nous rejoindre */
.canaux { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.25rem; }
@media (min-width: 48rem) { .canaux { grid-template-columns: repeat(2, 1fr); } }
.canal { display: grid; gap: .75rem; align-content: start; padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); scroll-margin-top: 6rem; }
.canal h3 { margin: 0; font-size: 1.35rem; }
.canal p { margin: 0; color: var(--marine-doux); }
.canal .btn { justify-self: start; }
.canal--vedette { background: var(--jaune); }
@media (min-width: 48rem) { .canal--vedette { grid-column: 1 / -1; } }
.canal--vedette p { color: var(--marine); }

/* Le problème (page histoire) */
.probleme { font-size: clamp(1.15rem, 2.5vw, 1.4rem); font-weight: 300; line-height: 1.5; }
.probleme strong { font-weight: 700; }
.inspiratrices { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: 1rem; }
@media (min-width: 48rem) { .inspiratrices { grid-template-columns: 1fr 1fr; } }
.inspiratrices li { padding: 1.5rem; border-radius: var(--rayon); background: var(--blanc); }
.inspiratrices strong { display: block; font-size: 1.15rem; }
.inspiratrices em { display: block; color: var(--marine-doux); margin-bottom: .5rem; }
.inspiratrices p { margin: 0; }

/* Sur fond blanc, les cartes passent en crème pour rester visibles */
.section--blanc .questions a, .section--blanc .facons li, .section--blanc .personne { background: var(--creme); }

/* ---------- 8. Storytelling : photos, témoignages, ambitions ---------- */
.btn--petit { min-height: 2.5rem; padding: .45rem 1rem; font-size: .9rem; justify-self: start; }
.personne .role { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--marine-doux); }

.galerie { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.galerie figure { margin: 0; }
.galerie img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--rayon); }
.galerie figcaption { font-size: .9rem; color: var(--marine-doux); margin-top: .5rem; }
.photo-vide {
  aspect-ratio: 4 / 3; border-radius: var(--rayon); border: 2px dashed var(--trait);
  display: grid; place-items: center; text-align: center; padding: 1rem; color: var(--marine-doux); font-size: .95rem;
}
.temoignages { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 48rem) { .temoignages { grid-template-columns: repeat(2, 1fr); } }
.temoignage { padding: 1.75rem; border-radius: var(--rayon); background: var(--jaune); }
.temoignage blockquote { margin: 0 0 1rem; }
.temoignage blockquote p { font-size: 1.15rem; font-weight: 500; line-height: 1.5; margin: 0; }
.temoignage .auteur { margin: 0; display: grid; }
.temoignage .auteur span { font-size: .9rem; }
.temoignage--vide { background: transparent; border: 2px dashed var(--trait); color: var(--marine-doux); }
.temoignage--vide p { margin-bottom: .5rem; }

.ambitions { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 48rem) { .ambitions { grid-template-columns: repeat(2, 1fr); } }
.ambitions li { padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); border-top: 6px solid var(--corail); }
.ambitions h3 { margin-bottom: .4rem; }
.ambitions p { margin: 0; color: var(--marine-doux); }

/* ---------- 9. Summit détaillé ---------- */
.tete-summit .faits { max-width: 34rem; }
.pourquoi-venir { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 56rem) { .pourquoi-venir { grid-template-columns: repeat(3, 1fr); } }
.pourquoi-venir li { padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); }
.pourquoi-venir p { margin: 0; color: var(--marine-doux); }
@media (min-width: 64rem) { .infos-summit { grid-template-columns: repeat(3, 1fr); } }
.infos-summit dd { font-size: 1.1rem; }
.infos-summit dd a { font-size: .95rem; }
.calendrier { display: grid; gap: 1rem 2rem; padding: 2rem; border-radius: var(--rayon); background: var(--jaune); }
@media (min-width: 48rem) { .calendrier { grid-template-columns: 1fr auto; align-items: center; padding: 2rem 2.5rem; } }
.calendrier h2 { font-size: 1.5rem; font-weight: 600; margin: 0 0 .3rem; }
.calendrier p { margin: 0; }
.faq { display: grid; gap: .75rem; }
.faq details { border-radius: var(--rayon-petit); background: var(--blanc); padding: 0 1.5rem; }
.faq summary { cursor: pointer; font-weight: 600; padding: 1.1rem 0; list-style-position: outside; }
.faq details p { margin: 0 0 1.25rem; color: var(--marine-doux); }
.cadre--chapitre { max-width: 100%; margin: 0 0 1.25rem; padding: .6rem; }
.cadre--chapitre img { aspect-ratio: 16 / 9; }

/* ---------- 11. Cartes de session avec affiche ---------- */
.annee + .annee { margin-top: 3rem; }
.annee-titre { display: flex; align-items: baseline; flex-wrap: wrap; gap: .4rem 1rem; font-size: 1.05rem; font-weight: 500; color: var(--marine-doux); margin: 0 0 1.25rem; }
.annee-titre span { font-size: clamp(2rem, 5vw, 2.8rem); font-weight: 800; color: var(--corail); line-height: 1; }
.cartes-sessions { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.carte-session { display: flex; flex-direction: column; border-radius: var(--rayon); background: var(--blanc); overflow: hidden; scroll-margin-top: 6rem; }
.section--blanc .carte-session{ background: var(--creme); }
.carte-visuel { aspect-ratio: 1 / 1; max-width: 100%; background: var(--jaune); display: grid; place-items: center; }
.carte-visuel img { width: 100%; height: 100%; object-fit: cover; }
.visuel-vide { text-align: center; padding: 1rem; font-size: .9rem; color: var(--marine); }
.carte-corps { padding: 1.25rem 1.4rem 1.5rem; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.carte-meta { font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--marine-doux); }
.carte-session h3 { margin: 0; font-size: 1.1rem; line-height: 1.3; }
.carte-session dl { margin: 0; display: grid; gap: .25rem; font-size: .9rem; }
.carte-session dl div { display: flex; flex-wrap: wrap; gap: .3rem; }
.carte-session dt { font-weight: 600; }
.carte-session dd { margin: 0; color: var(--marine-doux); }
.carte-action { margin-top: auto; padding-top: .5rem; display: grid; gap: .4rem; justify-items: start; font-size: .85rem; }

/* ---------- 12. Galerie en mosaïque ---------- */
.galerie { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; }
@media (min-width: 48rem) { .galerie { grid-template-columns: repeat(3, 1fr); } }
.galerie > li:first-child { grid-column: 1 / -1; }
@media (min-width: 48rem) { .galerie > li:first-child { grid-column: span 2; grid-row: span 2; } }
.galerie > li:first-child img, .galerie > li.photo-vide:first-child { height: 100%; aspect-ratio: auto; min-height: 14rem; }
.galerie figure { height: 100%; }
.galerie img { height: 100%; }
.voir-plus { display: flex; justify-content: center; margin-top: 1.5rem; }
.voir-plus:empty { display: none; }
[data-cache][hidden] { display: none !important; }
/* Galerie : la hauteur vient de la ligne, pas d'un ratio (évite les débordements sur mobile) */
.galerie { grid-auto-rows: 11rem; }
@media (min-width: 48rem) { .galerie { grid-auto-rows: 13rem; } }
.galerie > li { min-width: 0; }
.galerie .photo-vide, .galerie > li:first-child img, .galerie > li.photo-vide:first-child { aspect-ratio: auto; height: 100%; min-height: 0; }
.galerie img { aspect-ratio: auto; }
/* La grille de sessions s'adapte au nombre de cartes (4 sur une ligne en 2026, 3 en 2025) */
.cartes-sessions { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14.5rem), 1fr)); }

/* Noms cliquables vers LinkedIn, vidéos YouTube */
.nom-lien { color: var(--marine); font-weight: 600; }
.carte-videos { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--marine-doux); }
.carte-action .btn { white-space: normal; text-align: left; }

/* Inspirations d'aujourd'hui */
.inspiratrices--plus { margin-top: 1.25rem; }
.inspiratrices--plus li { background: var(--creme); }
.section--blanc .inspiratrices li { background: var(--creme); }
/* Même format pour toutes les cartes de session, quelle que soit l'année */
.cartes-sessions { grid-template-columns: repeat(auto-fill, minmax(min(100%, 14.5rem), 1fr)); }

/* ---------- 13. Navigation fluide dans la page ---------- */
:root { --hauteur-entete: 4.5rem; --hauteur-sommaire: 3.25rem; }
[id] { scroll-margin-top: calc(var(--hauteur-entete) + 1rem); }
.avec-sommaire [id] { scroll-margin-top: calc(var(--hauteur-entete) + var(--hauteur-sommaire) + 1rem); }

.sommaire {
  position: sticky; top: var(--hauteur-entete); z-index: 40;
  background: var(--creme); border-bottom: 1px solid var(--trait);
}
.sommaire ul {
  list-style: none; margin: 0; padding: .55rem 0; display: flex; gap: .4rem;
  overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.sommaire ul::-webkit-scrollbar { display: none; }
.sommaire a {
  display: inline-flex; align-items: center; min-height: 2.25rem; padding: .3rem .9rem;
  border-radius: 999px; white-space: nowrap; text-decoration: none;
  font-size: .88rem; font-weight: 500; color: var(--marine); transition: background .15s ease;
}
.sommaire a:hover { background: var(--blanc); }
.sommaire a[aria-current="true"] { background: var(--marine); color: var(--creme); }

.haut-de-page {
  position: fixed; z-index: 45;
  right: calc(1rem + env(safe-area-inset-right, 0px)); bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  padding: .7rem 1.1rem; border-radius: 999px; background: var(--marine); color: var(--creme);
  font-size: .9rem; font-weight: 600; text-decoration: none; box-shadow: 0 6px 20px rgba(28,37,65,.25);
}
.haut-de-page:hover { color: var(--jaune); }
.haut-de-page[hidden] { display: none; }
/* Trois pistes côte à côte sur grand écran */
@media (min-width: 64rem) { .ambitions { grid-template-columns: repeat(3, 1fr); } }

/* Pistes : le « pourquoi » de chaque idée */
.ambitions .pourquoi-piste { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--trait); font-size: .95rem; }
.ambitions .pourquoi-piste strong { color: var(--marine); }

/* Étapes de paiement du Summit */
.etapes { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; counter-reset: etape; }
@media (min-width: 48rem) { .etapes { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 72rem) { .etapes { grid-template-columns: repeat(4, 1fr); } }
.etapes li { counter-increment: etape; padding: 1.5rem; border-radius: var(--rayon); background: var(--blanc); display: grid; gap: .5rem; align-content: start; }
.etapes li::before { content: counter(etape); width: 2.25rem; height: 2.25rem; border-radius: 10px; background: var(--jaune); display: grid; place-items: center; font-weight: 800; }
.etapes h3 { margin: 0; font-size: 1.05rem; }
.etapes p { margin: 0; color: var(--marine-doux); font-size: .95rem; }
.section--blanc .ambitions li { background: var(--creme); }

/* Les images de couverture restent dans leur cadre carré */
.carte-visuel { position: relative; overflow: hidden; }
.carte-visuel img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }

/* Galerie : la légende se pose sur la photo, en bas */
.galerie figure { position: relative; height: 100%; border-radius: var(--rayon); overflow: hidden; }
.galerie img { border-radius: 0; }
.galerie figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; margin: 0;
  padding: 2.5rem 1rem .8rem; font-size: .85rem; font-weight: 500; color: #FFFFFF;
  background: linear-gradient(to top, rgba(28,37,65,.85), rgba(28,37,65,0));
}

/* Vignettes quand une session a plusieurs affiches */
.vignettes { display: flex; gap: .5rem; padding: .75rem 1.4rem 0; }
.vignettes button { padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; width: 3.25rem; height: 3.25rem; cursor: pointer; background: none; opacity: .6; }
.vignettes button[aria-pressed="true"] { border-color: var(--corail); opacity: 1; }
.vignettes button:hover { opacity: 1; }
.vignettes img { width: 100%; height: 100%; object-fit: cover; }
/* « Pourquoi ? » repliable sous chaque piste */
.ambitions details.pourquoi-piste summary { cursor: pointer; font-weight: 600; color: var(--marine); }
.ambitions details.pourquoi-piste p { margin: .5rem 0 0; }
/* Une photo seule sur la dernière ligne prend toute la largeur (ordinateur) */
@media (min-width: 48rem) { .galerie > li:last-child:nth-child(3n+1):not(:first-child) { grid-column: 1 / -1; grid-row: span 2; } }

/* Le « + » qui dévoile le pourquoi de chaque idée */
.ambitions li { display: flex; flex-direction: column; }
.ambitions details.pourquoi-piste { margin-top: auto; padding-top: .75rem; border-top: 0; }
.ambitions details.pourquoi-piste summary { list-style: none; display: flex; justify-content: flex-end; }
.ambitions details.pourquoi-piste summary::-webkit-details-marker { display: none; }
.ambitions details.pourquoi-piste summary span {
  width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--corail); position: relative;
  transition: transform .2s ease;
}
.ambitions details.pourquoi-piste summary span::before,
.ambitions details.pourquoi-piste summary span::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: .9rem; height: 2px; background: var(--marine);
  transform: translate(-50%, -50%);
}
.ambitions details.pourquoi-piste summary span::after { transform: translate(-50%, -50%) rotate(90deg); }
.ambitions details.pourquoi-piste[open] summary span { transform: rotate(45deg); }
.ambitions details.pourquoi-piste summary:focus-visible span { outline: 3px solid var(--marine); outline-offset: 2px; }

/* ---------- 14. Audit : accessibilité et finitions ---------- */
/* Corail pour le texte : la même teinte, à peine plus soutenue, pour atteindre le contraste
   minimal (3:1) des grands titres sur le crème et le blanc. Le corail exact reste utilisé
   pour les boutons, les traits et les fonds. */
:root { --corail-texte: #DD6581; }
h1 strong, h2 strong, .annee-titre span { color: var(--corail-texte); }
.section--marine h1 strong, .section--marine h2 strong { color: var(--jaune); }
/* Page en cours dans le menu : marine + trait corail (le petit texte corail n'était pas assez lisible) */
.nav a[aria-current="page"] { color: var(--marine); font-weight: 700; box-shadow: inset 0 -3px 0 var(--corail); }

/* Les repères [à compléter] ne sont visibles qu'en mode brouillon */
body:not(.brouillon) .a-completer { display: none; }
#bloc-temoignages[hidden] { display: none; }

/* Signature de marque : « Get Inspired » fort, la promesse en léger, comme le logo */
.pied .devise strong { color: var(--corail); text-transform: uppercase; margin-right: .35rem; }

/* Les trois dimensions : parcours, connaissances{ list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 1.25rem; }

/* ---------- 15. Accueil restructuré, fiches de session, Summit selon son état ---------- */
[hidden] { display: none !important; }

/* Fiches de session : description et « En savoir plus » */
.carte-description { margin: 0; font-size: .95rem; color: var(--marine-doux); }

/* Activités et réalisations */
.bilans { display: grid; gap: 1.25rem; margin-top: 2rem; }
@media (min-width: 48rem) { .bilans { grid-template-columns: repeat(2, 1fr); } }
.bilan { padding: 1.75rem; border-radius: var(--rayon); background: var(--creme); }
.bilan h3 { font-size: 1.6rem; font-weight: 800; margin: 0 0 .25rem; }
.bilan-resume { font-weight: 600; margin-bottom: .75rem; }
.bilan ul { margin: 0; padding-left: 1.1rem; display: grid; gap: .35rem; }

/* La fondatrice */
.citation { margin: 0; padding-left: 1.5rem; border-left: 4px solid var(--jaune); }
.citation p { font-size: clamp(1.3rem, 3vw, 1.75rem); font-weight: 300; line-height: 1.35; }
.citation p strong { font-weight: 800; color: var(--corail-texte); }
.citation footer { font-weight: 600; }

/* Ressources mises en avant{ grid-template-columns: 1fr !important; }
.titre-groupe { font-size: clamp(1.5rem, 3.6vw, 2rem); font-weight: 600; margin-bottom: 1.5rem; }

/* Statut du Summit */
.statut-summit { display: inline-block; margin: 0 0 1.25rem; padding: .35rem .9rem; border-radius: 8px; background: var(--jaune); color: var(--marine); font-weight: 600; }
.statut-summit:empty { display: none; }
.section--blanc .infos-summit div { background: var(--creme); }

/* ---------- 16. Page Confidentialité ---------- */
.texte-legal { max-width: 46rem; }
.texte-legal h3 { margin-top: 1.75rem; }
.texte-legal ul { padding-left: 1.2rem; display: grid; gap: .75rem; }
.texte-legal p:empty { display: none; }
.mise-a-jour { margin: 1rem 0 0; font-size: .9rem; color: var(--marine-doux); }
.pied-bas a { text-decoration: underline; text-decoration-color: var(--corail); }
/* Alerte du mode brouillon (jamais visible par le public) */
.alerte-donnees { padding: 1rem 1.25rem; background: var(--jaune); color: var(--marine); font-size: .92rem; }
.alerte-donnees ul { margin: .5rem 0 0; padding-left: 1.2rem; }

/* ---------- 17. Refonte éditoriale ---------- */
/* Page en cours et rubrique d'une sous-page dans le menu */
.nav a[aria-current="true"] { color: var(--marine); font-weight: 700; box-shadow: inset 0 -3px 0 var(--trait); }
@media (min-width: 48rem) { .pied-haut { grid-template-columns: 1fr 1fr; } }
@media (min-width: 64rem) { .pied-haut { grid-template-columns: 1.6fr 1fr 1fr 1fr; } }
.pied .devise { font-size: 1.15rem; }

/* Statuts : un fait, une annonce, un projet, une ambition ne se ressemblent pas */
.statut { line-height: 1.5; vertical-align: middle; white-space: nowrap; }
.statut--realise { background: var(--marine); color: var(--creme); }
.statut--annonce { background: var(--jaune); color: var(--marine); }
.statut--en-preparation { background: var(--jaune); color: var(--marine); }
.statut--a-confirmer { background: transparent; border: 1.5px dashed var(--marine); color: var(--marine); }
.statut--reporte { background: transparent; border: 1.5px solid var(--corail); color: var(--marine); }
.statut--annule { background: transparent; border: 1.5px solid var(--marine-doux); color: var(--marine-doux); text-decoration: line-through; }
.statut--ambition { background: transparent; border: 1.5px solid var(--marine); color: var(--marine); }
.section--marine .statut--realise { background: var(--creme); color: var(--marine); }
.legende-statuts { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .9rem; color: var(--marine-doux); }
.legende-statuts .statut { margin-right: .35rem; }

/* Fil d'Ariane */
.fil-ariane { margin: 0 0 1rem; font-size: .9rem; font-weight: 600; }
.fil-ariane a::before { content: "‹ "; }
.fil-ariane--clair a { color: var(--creme); }

/* Accueil : hero éditorial */
.accroche h1 { font-size: clamp(2.1rem, 5.6vw, 3.9rem); line-height: 1.08; max-width: 17ch; }
.accroche .chapeau { margin-bottom: 1rem; font-size: clamp(1.1rem, 2.4vw, 1.35rem); color: var(--marine); }
.pour-qui { color: var(--marine-doux); max-width: 36rem; margin-bottom: 2rem; padding-top: 1rem; border-top: 1px solid var(--trait); }

/* À la une */
.une { display: grid; gap: 1.5rem; }
@media (min-width: 64rem) { .une { grid-template-columns: 2.2fr 1fr; align-items: stretch; } }
.une-principale { display: grid; gap: 1.5rem; padding: 1.5rem; border-radius: var(--rayon); background: var(--creme); }
@media (min-width: 40rem) { .une-principale { grid-template-columns: minmax(0, 15rem) 1fr; align-items: start; } }
.une-visuel img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--rayon-petit); }
.une-texte h3 { font-size: clamp(1.35rem, 3vw, 1.8rem); font-weight: 600; margin: .35rem 0 .75rem; }
.une-texte h3 a, .carte-session h3 a, .carte-analyse h3 a, .evenement h3 a { color: inherit; text-decoration: none; }
.une-texte h3 a:hover, .carte-session h3 a:hover, .carte-analyse h3 a:hover, .evenement h3 a:hover { text-decoration: underline; text-decoration-color: var(--corail); }
.une-texte p { color: var(--marine-doux); }
.une-avec { font-size: .95rem; }
.une-rubrique { display: block; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--marine-doux); }
.une-secondaire { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; padding: 1.75rem; border-radius: var(--rayon); background: var(--marine); color: var(--creme); }
.une-secondaire .une-rubrique { color: rgba(248,244,235,.8); }
.une-secondaire h3 { font-size: 1.25rem; font-weight: 600; margin: 0; }
.une-secondaire p { margin: 0; color: rgba(248,244,235,.85); }
.une-secondaire a { color: var(--creme); font-weight: 600; margin-top: auto; }

/* Les questions qu'on explore */
.questions-explorees { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 0; border-top: 1px solid var(--trait); }
.question-exploree { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; padding: 1.75rem 0; border-bottom: 1px solid var(--trait); }
.question-exploree .icone { width: 3rem; height: 3rem; border-radius: 14px; background: var(--jaune); display: grid; place-items: center; }
.question-exploree .icone svg { width: 1.6rem; height: 1.6rem; }
.question-exploree h3 { font-size: clamp(1.2rem, 2.8vw, 1.55rem); font-weight: 600; margin: 0 0 .25rem; }
.question-theme { margin: 0 0 .75rem; font-size: .9rem; color: var(--marine-doux); }
.question-exploree ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .95rem; }

/* Frise courte (accueil) */
.frise-courte { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 1rem; }
@media (min-width: 40rem) { .frise-courte { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .frise-courte { grid-template-columns: repeat(3, 1fr); } }
.etape { padding: 1.5rem; border-radius: var(--rayon); background: var(--blanc); border-top: 4px solid var(--marine); }
.etape--en-preparation { border-top-color: var(--jaune); }
.etape--ambition { border-top: 4px dashed var(--marine); }
.etape-periode { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--marine); }
.etape h3 { margin: .35rem 0 .5rem; font-size: 1.15rem; }
.etape p { margin: 0; color: var(--marine-doux); font-size: .95rem; }

/* Listes d'événements */
.evenements-liste { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 0; border-top: 1px solid var(--trait); }
.evenement { display: grid; gap: .35rem 2rem; padding: 1.25rem 0; border-bottom: 1px solid var(--trait); }
@media (min-width: 48rem) { .evenement { grid-template-columns: 12rem 1fr; align-items: baseline; } }
.evenement-date { font-weight: 700; }
.evenement h3 { display: inline; font-size: 1.1rem; margin: 0 0 0 .5rem; }
.evenement p { margin: .35rem 0 0; color: var(--marine-doux); }
.evenements-liste .vide { margin-top: 1.25rem; }
#evenements-passes .annee-titre { margin-top: 2rem; }

/* Notre histoire : la frise */
.frise { list-style: none; padding: 0; margin: 0; position: relative; }
.frise::before { content: ""; position: absolute; left: .45rem; top: .5rem; bottom: .5rem; width: 3px; background: var(--jaune); border-radius: 2px; }
.frise-etape { position: relative; padding: 0 0 3.5rem 2.5rem; }
.frise-etape:last-child { padding-bottom: 0; }
.frise-etape::before { content: ""; position: absolute; left: 0; top: .35rem; width: 1.2rem; height: 1.2rem; border-radius: 6px; background: var(--marine); }
.frise-etape--en-preparation::before { background: var(--jaune); border: 3px solid var(--marine); }
.frise-etape--ambition::before { background: var(--creme); border: 3px dashed var(--marine); }
.frise-tete { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.frise-tete h2 { flex-basis: 100%; margin: .25rem 0 1rem; font-size: clamp(1.6rem, 4vw, 2.3rem); }
.frise-texte { max-width: 44rem; }
.frise-texte p { font-size: 1.05rem; }
.frise-texte .cadre--chapitre { max-width: 26rem; margin: 0 0 1.5rem; }

/* Mini vignettes de sessions */
.mini-sessions { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .75rem; }
@media (min-width: 48rem) { .mini-sessions { grid-template-columns: repeat(2, 1fr); } }
.mini-sessions a { display: flex; gap: 1rem; align-items: center; padding: .75rem; border-radius: var(--rayon-petit); background: var(--blanc); text-decoration: none; color: var(--marine); border: 1px solid var(--trait); }
.section--blanc .mini-sessions a { background: var(--creme); }
.mini-sessions a:hover { border-color: var(--corail); }
.mini-sessions img { width: 4rem; height: 4rem; object-fit: cover; border-radius: 8px; flex: none; }
.mini-sessions strong { display: block; font-size: .98rem; line-height: 1.3; }
.mini-sessions small { color: var(--marine-doux); }

/* Portes d'entrée vers d'autres pages */
.portes { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1rem; }
@media (min-width: 48rem) { .portes { grid-template-columns: repeat(3, 1fr); } }
.portes a { display: grid; gap: .35rem; height: 100%; padding: 1.5rem; border-radius: var(--rayon); background: var(--creme); text-decoration: none; color: var(--marine); border: 2px solid transparent; }
.section:not(.section--blanc) .portes a { background: var(--blanc); }
.portes a:hover { border-color: var(--corail); }
.portes strong { font-size: 1.15rem; }
.portes span { color: var(--marine-doux); font-size: .95rem; }

/* Cartes de session : lien vers la fiche */
.carte-meta .statut { margin-right: .5rem; }
.lien-fiche { font-weight: 600; font-size: .92rem; }
.carte-action { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.carte-action .carte-videos { flex-basis: 100%; }

/* Fiche de session */
.titre-session, .titre-article { font-size: clamp(1.9rem, 5vw, 3.2rem); max-width: 22ch; }
.session-statut { margin: 0 0 1rem; }
.fiche-session { display: grid; gap: 2rem; }
@media (min-width: 56rem) { .fiche-session { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 3.5rem; align-items: start; } }
.fiche-visuels { display: grid; gap: 1rem; }
@media (min-width: 40rem) { .fiche-visuels:has(> :nth-child(2)) { grid-template-columns: repeat(2, 1fr); } .fiche-visuels > :first-child:not(:only-child) { grid-column: 1 / -1; } }
.cadre--affiche { padding: .6rem; }
.cadre--affiche img { aspect-ratio: 1; }
.infos-fiche { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--trait); }
.infos-fiche div { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid var(--trait); }
.infos-fiche dt { font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--marine-doux); padding-top: .2rem; }
.infos-fiche dd { margin: 0; font-weight: 500; }
.fiche-actions { margin-top: 2rem; }
.fiche-actions h2 { font-size: 1.2rem; font-weight: 600; }
.fiche-contenu { display: grid; gap: 2.5rem; }
@media (min-width: 56rem) { .fiche-contenu:has(> :nth-child(2)) { grid-template-columns: repeat(2, 1fr); } }
.fiche-contenu h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); }
.liste-puces { margin: 0; padding-left: 1.2rem; display: grid; gap: .6rem; }
.note { font-size: .92rem; color: var(--marine-doux); }
.galerie--fiche { grid-auto-rows: auto; }
.galerie--fiche li, .galerie--fiche li:first-child, .galerie--fiche li:last-child:nth-child(odd) { grid-row: auto; grid-column: auto; }
.galerie--fiche img, .galerie--fiche > li:first-child img { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
.fiche-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding-top: 2.5rem; padding-bottom: 3rem; }
.fiche-nav a { display: grid; gap: .2rem; text-decoration: none; color: var(--marine); font-weight: 600; padding: 1rem 1.25rem; border-radius: var(--rayon-petit); border: 1px solid var(--trait); }
.fiche-nav a:last-child { text-align: right; }
.fiche-nav a:hover { border-color: var(--corail); }
.fiche-nav small { font-weight: 500; color: var(--marine-doux); }

/* Analyses */
.cartes-analyses { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.cartes-analyses .evenement { grid-template-columns: 1fr; }
.carte-analyse { padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); }
.article-meta { font-size: .9rem; color: var(--marine-doux); margin: .5rem 0 0; }
.liens-lies { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .75rem; }
@media (min-width: 48rem) { .liens-lies { grid-template-columns: repeat(2, 1fr); } }
.liens-lies a { display: grid; gap: .25rem; padding: 1.1rem 1.25rem; border-radius: var(--rayon-petit); background: var(--blanc); color: var(--marine); font-weight: 600; text-decoration: none; border: 1px solid var(--trait); }
.liens-lies a:hover { border-color: var(--corail); }

/* Article */
.conteneur--texte { max-width: 46rem; }
.article-corps { padding-bottom: 4rem; font-size: 1.08rem; line-height: 1.75; }
.article-corps h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); font-weight: 600; margin-top: 2.5rem; }
.question-centrale { margin: 0 0 2rem; padding: 1.5rem 1.75rem; border-left: 4px solid var(--corail); background: var(--blanc); border-radius: 0 var(--rayon-petit) var(--rayon-petit) 0; }
.question-centrale p { margin: .35rem 0 0; font-size: 1.25rem; font-weight: 600; line-height: 1.4; }
.points-cles { padding: 1.5rem 1.75rem; border-radius: var(--rayon); background: var(--jaune); }
.points-cles h2 { margin-top: 0; font-size: 1.2rem; }
.points-cles ul { margin: 0; padding-left: 1.2rem; }
.figure-article { margin: 2rem 0; }
.figure-article img { width: 100%; height: auto; border-radius: var(--rayon-petit); }
.figure-article figcaption { font-size: .9rem; color: var(--marine-doux); margin-top: .5rem; }
.tableau-defile { overflow-x: auto; }
.tableau-defile table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tableau-defile th, .tableau-defile td { text-align: left; padding: .6rem .75rem; border-bottom: 1px solid var(--trait); }
.sources ol { font-size: .95rem; padding-left: 1.2rem; }

/* À propos */
.signature-apropos { font-size: clamp(1.3rem, 3vw, 1.8rem); font-weight: 300; color: var(--marine); max-width: 30ch; }
.formats { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; gap: 1.25rem; }
@media (min-width: 56rem) { .formats { grid-template-columns: repeat(3, 1fr); } }
.formats li { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; padding: 1.75rem; border-radius: var(--rayon); background: var(--blanc); }
.formats h3 { margin: .25rem 0 0; font-size: 1.3rem; }
.formats p { margin: 0; color: var(--marine-doux); }
.formats a { margin-top: auto; font-weight: 600; }

/* 404 */
.page-404 { padding: 5rem 0 6rem; }
.evenement--sans-date { grid-template-columns: 1fr !important; }
.evenement--sans-date h3 { display: block; margin: .5rem 0 0; }
.signature-hero { margin: 0 0 1.25rem; font-size: clamp(.95rem, 2vw, 1.05rem); font-weight: 600; color: var(--marine); letter-spacing: .01em; padding-left: .85rem; border-left: 4px solid var(--jaune); }
#conversations-recentes { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.cadre--affiche, .fiche-visuels figure { margin: 0; }
.section--blanc .pilier { background: var(--creme); }

/* ---------- 18. Ajustement communautaire ---------- */
.section--blanc .formats li { background: var(--creme); }
.une:has(> :only-child) { grid-template-columns: 1fr; }
.une-principale--texte { grid-template-columns: 1fr !important; }
.une-principale--texte .liste-puces { margin: 0 0 1.25rem; }

/* Comment rejoindre : trois étapes numérotées par la liste elle-même */
.etapes-adhesion { list-style: none; padding: 0; margin: 0; counter-reset: etape; display: grid; gap: 1rem; }
.etapes-adhesion li { counter-increment: etape; position: relative; padding: 1.5rem 1.5rem 1.5rem 4.25rem; border-radius: var(--rayon); background: var(--creme); }
.etapes-adhesion li::before { content: counter(etape); position: absolute; left: 1.25rem; top: 1.35rem; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: var(--jaune); display: grid; place-items: center; font-weight: 800; }
.etapes-adhesion h3 { margin: 0 0 .35rem; font-size: 1.15rem; }
.etapes-adhesion p { margin: 0 0 .75rem; color: var(--marine-doux); }
.etapes-adhesion p:last-child { margin-bottom: 0; }

/* Les personnes invitées */
.invites { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--trait); }
.invites h3 { font-size: 1.2rem; }
.noms-invites { list-style: none; padding: 0; margin: 1rem 0 1.25rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.noms-invites li { padding: .4rem .9rem; border-radius: 999px; background: var(--creme); font-weight: 500; }
.noms-invites a { text-decoration: none; }
.noms-invites a:hover { text-decoration: underline; text-decoration-color: var(--corail); }
.section:not(.section--blanc) .bilan, .section:not(.section--blanc) .une-principale--texte { background: var(--blanc); }
#rencontres-recentes { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }

/* ---------- 19. Finalisation : en-tête, adhésion, design plus doux ---------- */
/* Bouton « Rejoindre » de l'en-tête, distinct du menu */
.btn--entete { min-height: 2.5rem; padding: .45rem 1.1rem; font-size: .92rem; margin-left: auto; }
.btn--entete[aria-current="page"] { box-shadow: inset 0 0 0 2px var(--marine); }
.entete .conteneur { gap: .75rem; }
@media (max-width: 22rem) { .btn--entete { display: none; } }
@media (min-width: 86rem) {
  .nav { margin-left: auto; }
  .nav ul { gap: 1.1rem; }
  .nav a { font-size: .92rem; }
  .btn--entete { margin-left: .5rem; }
}

/* Typographie : des titres élégants, pas systématiquement énormes */
h1 { font-size: clamp(2rem, 5vw, 3.3rem); line-height: 1.1; }
h2 { font-size: clamp(1.55rem, 3.4vw, 2.25rem); line-height: 1.18; margin-bottom: .75rem; }
h1 strong, h2 strong { font-weight: 600; }
.accroche h1 { font-size: clamp(2.1rem, 5vw, 3.4rem); max-width: 16ch; }
.tete-page h1 { max-width: 22ch; }
.chapeau { line-height: 1.6; }
.section { padding: 4.5rem 0; }
@media (min-width: 48rem) { .section { padding: 6.5rem 0; } }
.tete-page { padding: 3.5rem 0 3rem; }
@media (min-width: 48rem) { .tete-page { padding: 5rem 0 3.5rem; } }

/* Mouvements très discrets */
.btn:hover { transform: none; }
.btn--corail:hover { background: #d9647f; border-color: #d9647f; }

/* Trois idées côte à côte, sans cartes */
.trois-idees { list-style: none; padding: 0; margin: 2.5rem 0 0; display: grid; gap: 2rem; }
@media (min-width: 48rem) { .trois-idees { grid-template-columns: repeat(3, 1fr); gap: 3rem; } }
.trois-idees li { padding-top: 1.25rem; border-top: 2px solid var(--corail); }
.trois-idees h3 { margin-bottom: .5rem; }
.trois-idees p { margin: 0; color: var(--marine-doux); }

/* Deux colonnes de même largeur */
.deux-col--egales { gap: 2.5rem; }
@media (min-width: 56rem) { .deux-col--egales { grid-template-columns: 1fr 1fr; gap: 4.5rem; } }

/* Règles de vie : une liste simple */
.regles { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.regles li { padding: 0 0 1rem 1.5rem; border-bottom: 1px solid var(--trait); position: relative; color: var(--marine-doux); }
.regles li::before { content: ""; position: absolute; left: 0; top: .6rem; width: .5rem; height: .5rem; border-radius: 50%; background: var(--corail); }
.regles strong { color: var(--marine); }

/* Nous suivre : des liens, pas des cartes */
.titre-suivre { margin-top: 3rem; }
.liens-suivre { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: .75rem 2.5rem; }
.liens-suivre a { font-weight: 600; }
.liens-suivre span { display: block; font-size: .9rem; color: var(--marine-doux); }

/* Appel à rejoindre, sur fond clair */
.appel { max-width: 46rem; margin: 0 auto; text-align: center; padding: 3rem 1.5rem; border-radius: var(--rayon); background: var(--creme); }
.appel .groupe-btn, .section--appel .groupe-btn { justify-content: center; }
.appel p { color: var(--marine-doux); max-width: 34rem; margin-left: auto; margin-right: auto; }
.section--appel .conteneur { max-width: 48rem; text-align: center; }
.section--appel .chapeau { margin-left: auto; margin-right: auto; }

/* À la une, en douceur : plus de grand bloc marine */
.une-secondaire { background: var(--blanc); color: var(--marine); border: 1px solid var(--trait); }
.une-secondaire .une-rubrique { color: var(--marine-doux); }
.une-secondaire p { color: var(--marine-doux); }
.une-secondaire a { color: var(--marine); }
.section--blanc .une-principale, .section--blanc .une-secondaire { background: var(--creme); border-color: transparent; }

/* Étapes et cartes selon le fond */
.section:not(.section--blanc) .etapes-adhesion li, .section:not(.section--blanc) .canal { background: var(--blanc); }
.section--blanc .canal { background: var(--creme); }
.canal { border-radius: var(--rayon); }

/* Page Rejoindre */
.zone-formulaire { margin-top: 2rem; padding: 2rem; border-radius: var(--rayon); background: var(--creme); }
.zone-formulaire .note { margin: 1rem 0 0; }
.formulaire-bientot { margin: 0; }
.conteneur--texte .liste-puces { margin-bottom: 1.25rem; }
.une { align-items: start; }
/* En-tête sur petit écran : logo, Rejoindre et Menu tiennent sur une ligne */
@media (max-width: 30rem) {
  .menu-bouton .menu-texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .btn--entete { padding: .4rem .85rem; font-size: .85rem; min-height: 2.5rem; }
  .logo img { height: 2.1rem; }
  .entete .conteneur { gap: .5rem; }
}

/* ---------- 20. Publication : partenariats, témoignages, analyse vidéo ---------- */
.formes-collaboration { list-style: none; padding: 0; margin: 2.5rem 0 0; counter-reset: forme; display: grid; gap: 2rem 3rem; }
@media (min-width: 48rem) { .formes-collaboration { grid-template-columns: repeat(2, 1fr); } }
.formes-collaboration li { counter-increment: forme; padding-top: 1.25rem; border-top: 2px solid var(--corail); }
.formes-collaboration li::before { content: counter(forme); display: block; font-weight: 700; color: var(--corail-texte); margin-bottom: .25rem; }
.formes-collaboration h3 { margin-bottom: .4rem; }
.formes-collaboration p { margin: 0; color: var(--marine-doux); }
.statut-copie { flex-basis: 100%; margin: .25rem 0 0; font-size: .92rem; font-weight: 600; color: var(--marine); min-height: 1.4em; }
.secours { margin: 1.25rem 0 .5rem; font-size: .95rem; }
.logos li span { display: inline-block; padding: .6rem 1rem; border: 1px solid var(--trait); border-radius: var(--rayon-petit); font-weight: 600; }

/* Témoignages */
.temoignage .auteur { display: flex; align-items: center; gap: .75rem; }
.temoignage .auteur img { width: 3rem; height: 3rem; border-radius: 50%; object-fit: cover; }
.temoignage .auteur > span { display: grid; }

/* Analyse vidéo */
.video-analyse { margin: 0 0 2rem; }
.video-miniature { position: relative; display: block; border-radius: var(--rayon); overflow: hidden; margin-bottom: 1rem; }
.video-miniature img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.video-miniature span { position: absolute; left: 1rem; bottom: 1rem; padding: .4rem .9rem; border-radius: 999px; background: var(--blanc); font-weight: 600; }
.resume-analyse { font-size: 1.15rem; color: var(--marine); }
.carte-analyse-image { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--rayon-petit); margin-bottom: 1rem; }

/* Textes à la première personne */
.texte-recit p { font-size: 1.08rem; }
.signature-texte { font-weight: 600; margin-top: 1.5rem; }
.sous-titre-fondatrice { margin-top: 1.75rem; }
.visuel-vide { display: grid; place-items: center; width: 100%; height: 100%; min-height: 6rem; font-weight: 700; color: var(--marine-doux); }

/* La suite du parcours, en bas des rubriques */
.suite-parcours { padding: 0 0 4rem; }
.suite-parcours a { display: grid; gap: .2rem; max-width: 34rem; margin-left: auto; padding: 1.5rem 1.75rem; border-radius: var(--rayon); background: var(--blanc); border: 1px solid var(--trait); text-decoration: none; color: var(--marine); }
.suite-parcours a:hover { border-color: var(--corail); }
.suite-parcours small { color: var(--marine-doux); font-weight: 600; }
.suite-parcours strong { font-size: 1.3rem; }
.suite-parcours span { color: var(--marine-doux); font-size: .95rem; }
.statut--reserve { background: transparent; border: 1.5px solid var(--corail); color: var(--marine); }
.ressource--reservee .ressource-visuel { opacity: .85; }

/* Témoignages : sobres, fond clair et filet jaune (le jaune reste un accent) */
.temoignage { background: var(--creme); border-left: 4px solid var(--jaune); border-radius: 0 var(--rayon) var(--rayon) 0; }
.section:not(.section--blanc) .temoignage { background: var(--blanc); }
.temoignage blockquote p { font-size: 1.02rem; line-height: 1.65; color: var(--marine); }
.temoignage .auteur strong { color: var(--marine); }
.temoignage .auteur span span { color: var(--marine-doux); font-size: .9rem; }

/* Portrait de la fondatrice (À propos) */
.colonne-fondatrice { display: grid; gap: 1.5rem; align-content: start; }
.portrait-fondatrice { margin: 0; max-width: 28rem; }
.portrait-fondatrice img { width: 100%; height: auto; aspect-ratio: 900 / 791; object-fit: cover; border-radius: var(--rayon); display: block; }

/* Les adresses e-mail longues passent à la ligne sur les petits écrans (320 px) au lieu de déborder */
a[href^="mailto:"], p strong, .canal p { overflow-wrap: anywhere; }
.pied-marque > div { min-width: 0; }
