/* ============================================================
   Luska Liamm : thème du site public (direction « famille et enfance », 2026-10-26).
   Chargé après les feuilles reprises de l'Ulamir (agenda, documents, formulaires).
   Valeurs brutes (couleurs, tailles) dans tokens.css ; ici, composants (N1) et pages (N2).
   ============================================================ */

@font-face {
  font-family: "Nunito";
  src: url("/assets/fonts/nunito-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: var(--racine); scroll-behavior: smooth; scroll-padding-top: var(--entete-h); }
body { margin: 0; font: var(--t-0)/1.65 var(--police); color: var(--encre); background: var(--blanc); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--orange-texte); text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--marron); outline-offset: 3px; }
h1, h2, h3 { margin: 0 0 var(--e-2); color: var(--marron); font-weight: 800; line-height: 1.15; text-wrap: balance; }
h1 { font-size: var(--t-3); }
h2 { font-size: var(--t-2); }
h3 { font-size: var(--t-1); }
p { margin: 0 0 var(--e-2); max-width: var(--mesure); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }

.conteneur { width: min(100% - 2.5rem, var(--largeur)); margin-inline: auto; }
.evitement { position: absolute; left: 1rem; top: -4rem; padding: .75rem 1rem; border-radius: var(--rayon-plein); font-weight: 800; color: var(--blanc); background: var(--marron); }
.evitement:focus { top: 1rem; z-index: 10; }
.surtitre { display: inline-block; margin-bottom: var(--e-1); font-size: .95rem; font-weight: 800; letter-spacing: .02em; color: var(--orange-texte); }

/* ----- Boutons : un seul composant (N1) -----
   .bouton (plein marron), .bouton--clair (contour sur blanc), .bouton--jaune (contour sur jaune),
   .bouton--lien (texte seul, même hauteur). Tailles : normale 3rem, --petit 2,75rem, --icone carré.
   .btn / .btn--primary / .btn--secondary / .btn--sm : mêmes règles pour le code repris de l'Ulamir
   (fenêtre d'événement générée en JS). États : repos, survol, focus clavier, actif, désactivé, envoi. */
.bouton, .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: var(--bouton-h); padding: .5rem var(--bouton-x);
  border: 2px solid var(--marron); border-radius: var(--rayon-plein);
  font: 800 1rem/1.2 var(--police); color: var(--blanc); background: var(--marron);
  text-decoration: none; white-space: nowrap; cursor: pointer; box-shadow: none;
  transition: transform var(--duree-rapide) var(--courbe);
}
.bouton i, .btn i { font-size: .95em; }
.bouton:hover, .btn:hover { color: var(--blanc); background: var(--marron-fonce); border-color: var(--marron-fonce); transform: translateY(-1px); }
.bouton:focus-visible, .btn:focus-visible { outline: 3px solid var(--marron); outline-offset: 3px; }
.bouton:active, .btn:active { transform: translateY(1px); }
.bouton[disabled], .bouton[aria-disabled="true"], .btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }
.bouton--clair, .btn--secondary { color: var(--marron); background: var(--blanc); }
.bouton--clair:hover, .btn--secondary:hover { color: var(--marron); background: var(--jaune-clair); border-color: var(--marron); }
.section--jaune .bouton--clair:hover, .heros .bouton--clair:hover { background: var(--creme); }
.bouton--jaune { color: var(--marron); background: var(--jaune); }
.bouton--jaune:hover { color: var(--marron); background: var(--jaune-fonce); border-color: var(--marron); }
.bouton--lien { border-color: transparent; color: var(--marron); background: transparent; }
.bouton--lien:hover { border-color: transparent; color: var(--marron); background: var(--jaune-clair); }
.bouton--petit, .btn--sm { min-height: var(--bouton-h-petit); padding-inline: var(--bouton-x-petit); font-size: .95rem; }
.bouton--icone { width: var(--bouton-h); padding-inline: 0; }
.bouton--icone.bouton--petit { width: var(--bouton-h-petit); }
.boutons { display: flex; flex-wrap: wrap; gap: var(--e-2); margin-top: var(--e-3); }
.boutons--centre { justify-content: center; }

/* ----- En-tête : logo à gauche, menu centré sur la page, Agenda et Adhérer à droite -----
   Centrage optique (rule web-design) : le menu est hors du flux, centré sur la barre
   (position absolue, left 50 %, translate -50 %), quelle que soit la largeur des blocs
   gauche et droit. Entre 76 et 96rem, « Agenda » passe en icône seule pour laisser la
   place au menu. Sous 76rem : menu dans un panneau <details> sans script ; luska.js
   ajoute seulement Échap et le clic hors du panneau. Hauteur réelle = --entete-h. */
.entete { position: sticky; top: 0; z-index: 5; background: var(--blanc); box-shadow: 0 1px 0 var(--trait); }
.entete__barre { display: flex; align-items: center; justify-content: space-between; gap: var(--e-2); width: min(100% - 2.5rem, var(--largeur-entete)); min-height: var(--entete-h); margin-inline: auto; }
.entete__logo { display: inline-flex; flex: none; border-radius: var(--rayon-plein); }
.entete__logo img { width: auto; height: calc(var(--entete-h) - 1.25rem); }
.entete nav[aria-label="Menu principal"] { position: absolute; top: 50%; left: 50%; translate: -50% -50%; }
.menu { display: flex; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.menu a { display: inline-flex; align-items: center; min-height: var(--bouton-h-petit); padding: 0 .8rem; border-radius: var(--rayon-plein); font-weight: 700; font-size: 1rem; color: var(--encre); text-decoration: underline 1px transparent; text-underline-offset: .45em; white-space: nowrap; }
.menu a:hover { color: var(--marron); text-decoration-color: currentColor; }
.menu a[aria-current] { color: var(--marron); text-decoration: underline 2px var(--marron); }
.entete__actions { display: flex; flex: none; align-items: center; gap: .6rem; margin-left: auto; }
.bouton--agenda[aria-current] { background: var(--jaune-clair); }
.menu-mobile { display: none; }
.menu-mobile summary { list-style: none; }
.menu-mobile summary::-webkit-details-marker { display: none; }
.menu-mobile summary .fa-xmark, .menu-mobile[open] summary .fa-bars { display: none; }
.menu-mobile[open] summary .fa-xmark { display: inline-block; }
@media (min-width: 76.01rem) { .entete__barre { position: relative; } }
@media (min-width: 76.01rem) and (max-width: 96rem) {
  .menu { gap: 0; }
  .menu a { padding-inline: .6rem; }
  .entete__actions { gap: .4rem; }
  .entete__actions .bouton--jaune { padding-inline: var(--bouton-x-petit); }
  .bouton--agenda { width: var(--bouton-h); padding: 0; }
  .bouton-agenda__texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 76rem) {
  :root { --entete-h: 4.25rem; }
  .entete__barre { gap: .5rem; }
  .entete nav[aria-label="Menu principal"] { display: none; }
  .entete__actions { gap: .5rem; }
  .menu-mobile { display: block; }
  .menu-mobile__liste {
    position: absolute; left: 0; right: 0; top: 100%;
    display: grid; gap: .15rem; max-height: calc(100dvh - var(--entete-h)); margin: 0;
    padding: var(--e-2) max(1.25rem, calc((100% - var(--largeur-entete)) / 2 + 1.25rem)) var(--e-3);
    list-style: none; border-top: 1px solid var(--trait); border-radius: 0 0 var(--rayon) var(--rayon);
    background: var(--blanc); box-shadow: var(--ombre); overflow-y: auto;
  }
  .menu-mobile__liste a { display: flex; gap: .75rem; align-items: center; min-height: var(--bouton-h); padding: .25rem 1rem; border-radius: var(--rayon-champ); font-weight: 700; font-size: var(--t-0); color: var(--encre); text-decoration: none; }
  .menu-mobile__liste a:hover { color: var(--marron); background: var(--jaune-clair); }
  .menu-mobile__liste a[aria-current] { font-weight: 800; color: var(--marron); background: var(--jaune); }
  .menu-mobile__liste i { width: 1.25rem; color: var(--orange-texte); text-align: center; }
  .menu-mobile__tel { margin-top: .5rem; padding-top: .75rem; border-top: 1px solid var(--trait); }
}
@media (max-width: 40rem) {
  .bouton--agenda, .menu-mobile summary { width: var(--bouton-h-petit); min-height: var(--bouton-h-petit); padding: 0; }
  .bouton-agenda__texte, .menu-mobile__texte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .entete__actions .bouton--jaune { min-height: var(--bouton-h-petit); padding-inline: var(--bouton-x-petit); font-size: .95rem; }
}

/* ----- Fil d'Ariane ----- */
.ariane { padding-block: var(--e-2); background: var(--jaune-clair); font-size: .95rem; }
.ariane ol { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.ariane li + li::before { content: "›"; margin-right: .4rem; color: var(--encre-douce); }
.ariane a { color: var(--encre); }
.ariane [aria-current] { font-weight: 800; color: var(--marron); }

/* ----- Motif : graines du logo ----- */
.graines { position: absolute; width: 9rem; height: auto; pointer-events: none; }

/* ----- Héros ----- */
.heros { position: relative; overflow: hidden; padding-block: var(--e-5); background: var(--jaune); }
.heros__grille { display: grid; grid-template-columns: 1.05fr 1fr; gap: var(--e-4); align-items: center; }
.heros h1 { color: var(--marron); }
.heros p { font-size: var(--t-1); color: var(--encre); }
.heros__image { position: relative; }
.heros__image img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.heros .graines { top: 1.5rem; right: 4%; }
.pastilles { display: flex; flex-wrap: wrap; gap: .5rem; margin: var(--e-3) 0 0; padding: 0; list-style: none; }
.pastilles li { padding: .35rem 1rem; border-radius: var(--rayon-plein); font-weight: 800; font-size: .95rem; color: var(--marron); background: var(--blanc); }
@media (max-width: 52rem) { .heros__grille { grid-template-columns: 1fr; } .heros__image { order: -1; max-width: 30rem; } }

/* ----- Sections ----- */
.section { position: relative; padding-block: var(--e-5); }
.section--creme { background: var(--creme); }
.section--jaune-clair { background: var(--jaune-clair); }
.section--jaune { background: var(--jaune); }
.section__tete { max-width: 46rem; margin-bottom: var(--e-4); }
.section__tete--centre { margin-inline: auto; text-align: center; }
.section__tete--centre p { margin-inline: auto; }

/* Bloc image + texte, alterné */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-4); align-items: center; }
.duo + .duo { margin-top: var(--e-5); }
.duo--inverse .duo__image { order: 2; }
.duo__image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--rayon-champ); }
.agenda-liste__item:has(.rdv__affiche) { grid-template-columns: auto minmax(0, 1fr) auto; }
@media (max-width: 52rem) { .duo { grid-template-columns: 1fr; } .duo--inverse .duo__image { order: 0; } }

/* Lieux du LAEP */
.lieux { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.lieu { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.lieu__corps { display: flex; flex: 1; flex-direction: column; padding: var(--e-3); }
.lieu__corps .lien-fleche { margin-top: auto; padding-top: var(--e-2); }
.lieu__adresse { margin: 0; }
.lieu .lieu__plan { height: 10rem; border-bottom: 4px solid var(--jaune); background: var(--jaune-clair); }
.lieu .lieu__plan-repli { display: grid; height: 100%; margin: 0; place-items: center; font-weight: 800; }
.lieu .map-directions, .lieu .leaflet-control-zoom { display: none; }
.lieu__commune { margin: 0 0 .25rem; font-size: var(--t-1); font-weight: 800; color: var(--marron); }
.lieu__quand { margin: 0 0 .5rem; font-weight: 800; font-size: 1.25rem; color: var(--encre); }
.lieu__ou { margin: 0; color: var(--encre-douce); }
.lieu__pastille { display: inline-block; margin-bottom: var(--e-2); padding: .2rem .8rem; border-radius: var(--rayon-plein); font-size: .9rem; font-weight: 800; color: var(--marron); background: var(--jaune); }

/* Entrées « Ce que nous proposons » */
.entrees { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.entree { position: relative; overflow: hidden; border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); transition: transform var(--duree-rapide) var(--courbe); }
.entree:hover { transform: translateY(-4px); }
/* Photo pleine largeur, bord bas en légère courbe (décision du 2026-10-27) */
.entree img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; -webkit-mask: var(--masque-courbe-bas); mask: var(--masque-courbe-bas); }
.entree__corps { padding: var(--e-3); }
.encart-sondage { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e-2); margin: var(--e-4) 0 0; padding: var(--e-2) var(--e-3); border-radius: var(--rayon); color: var(--encre); background: var(--blanc); }
.encart-sondage p { margin: 0; }
.entree__corps p { margin: 0; color: var(--encre-douce); }
.entree a { color: var(--marron); text-decoration: none; }
.entree a::after { content: ""; position: absolute; inset: 0; }

/* Rendez-vous */
.rdv { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.rdv__carte { display: grid; grid-template-columns: auto 1fr; gap: var(--e-2); align-items: start; padding: var(--e-3); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.rdv__date { display: grid; place-items: center; width: 4.75rem; padding: .6rem 0; border-radius: 18px; text-align: center; line-height: 1.1; font-weight: 800; color: var(--marron); background: var(--jaune); }
.rdv__date strong { display: block; font-size: 1.9rem; }
.rdv__titre { margin: 0 0 .25rem; font-size: 1.15rem; font-weight: 800; color: var(--marron); }
.rdv__titre a { color: inherit; text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: .15em; text-underline-offset: .2em; }
.rdv__titre a:hover { text-decoration-color: var(--marron); }
.rdv__affiche { width: 6rem; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--rayon); box-shadow: var(--ombre); }
.rdv__infos { margin: 0; font-size: 1rem; color: var(--encre-douce); }
.etiquette { display: inline-block; margin-top: .5rem; padding: .15rem .7rem; border: 2px solid var(--marron); border-radius: var(--rayon-plein); font-size: .85rem; font-weight: 800; color: var(--marron); }

/* Chiffres */
.chiffres { display: flex; flex-wrap: wrap; gap: var(--e-3); margin: var(--e-3) 0; padding: 0; list-style: none; }
.chiffres li { font-weight: 800; color: var(--encre-douce); }
.chiffres strong { display: block; font-size: var(--t-2); line-height: 1.1; color: var(--orange-texte); }

/* Bandeau soutien */
.soutien { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: var(--e-3); }
.soutien__bloc { padding: var(--e-4); border-radius: var(--rayon); background: var(--blanc); }

/* Partenaires */
.partenaires { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--e-2) var(--e-4); margin: 0; padding: 0; list-style: none; }
.partenaires img { width: auto; max-width: 13rem; height: 56px; object-fit: contain; }

/* Contact */
.contact-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--e-4); align-items: stretch; }
.coordonnees { margin: 0; padding: 0; list-style: none; }
.coordonnees li { margin-bottom: var(--e-2); }
.coordonnees strong { display: block; color: var(--marron); }
.formulaire { display: flex; flex-direction: column; padding: var(--e-4); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.champ { margin-bottom: var(--e-3); }
.champ label { display: block; margin-bottom: .35rem; font-weight: 800; color: var(--encre); }
.champ input, .champ textarea { width: 100%; min-height: 3rem; padding: .75rem 1rem; border: 2px solid var(--line-strong); border-radius: var(--rayon-champ); font: inherit; color: var(--encre); background: var(--blanc); }
.champ textarea { min-height: 8rem; }
.mention { font-size: .95rem; color: var(--encre-douce); }
@media (max-width: 52rem) { .contact-grille { grid-template-columns: minmax(0, 1fr); } }

/* Étapes et questions (page LAEP) */
.etapes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: var(--e-3); counter-reset: etape; margin: 0; padding: 0; list-style: none; }
.etape { position: relative; padding: var(--e-4) var(--e-3) var(--e-3); border-radius: var(--rayon); background: var(--jaune-clair); counter-increment: etape; }
.section--creme .etape { background: var(--blanc); }
.etape::before { content: counter(etape); position: absolute; top: -1.25rem; left: var(--e-3); display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; font-weight: 800; font-size: 1.25rem; color: var(--blanc); background: var(--marron); }
.etape h3 { margin-bottom: .5rem; }
.etape p { margin: 0; }
.conteneur.questions { display: grid; gap: var(--e-2); }
.questions details { width: 100%; max-width: 48rem; }
.questions details { border: 1px solid var(--trait); border-radius: 18px; background: var(--blanc); }
.questions details[open] { border-color: var(--jaune); }
.questions summary { display: flex; justify-content: space-between; gap: 1rem; min-height: 3.5rem; padding: 1rem 1.5rem; cursor: pointer; font-weight: 800; color: var(--marron); list-style: none; }
.questions summary::after { content: "\f067"; flex: none; align-self: center; font: var(--fa-font-solid); color: var(--orange-texte); transition: transform var(--duree-rapide) var(--courbe); }
.questions details[open] summary::after { transform: rotate(45deg); }
.questions details p { margin: 0; padding: 0 1.5rem 1.25rem; }

/* Pied de page */
/* Pied de page compact, sans bord arrondi : marque et réseaux | liens sur deux colonnes | contact */
.pied { position: relative; padding-block: var(--e-3) var(--e-2); font-size: 1rem; background: var(--jaune-clair); }
.pied__grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); gap: var(--e-2) var(--e-4); }
.pied h2 { margin-bottom: .4rem; font-size: 1.05rem; }
.pied p { margin-bottom: .6rem; font-size: 1rem; line-height: 1.5; }
.pied ul { margin: 0; padding: 0; list-style: none; }
.pied li { margin-bottom: .2rem; }
.pied a { color: var(--encre); }
.pied__explorer ul { columns: 2; column-gap: var(--e-3); }
.pied__explorer li { break-inside: avoid; }
.pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem var(--e-2); margin-top: var(--e-2); padding-top: var(--e-2); border-top: 1px solid var(--trait); font-size: .9rem; }
@media (max-width: 60rem) {
  .pied__grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pied__marque { grid-column: 1 / -1; }
}
@media (max-width: 40rem) {
  .pied__grille { grid-template-columns: minmax(0, 1fr); }
  /* Cibles tactiles de 44 px sur mobile, sur deux colonnes pour rester court */
  .pied__explorer ul, .pied__joindre ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 9.5rem), 1fr)); column-gap: var(--e-2); columns: auto; }
  .pied__joindre li:last-child { grid-column: 1 / -1; }
  .pied li { margin: 0; }
  .pied__explorer a, .pied__joindre a, .pied__liens a { display: inline-flex; align-items: center; min-height: var(--bouton-h-petit); }
}

.credits { font-size: .85rem; color: var(--encre-douce); }

/* ----- Pages intérieures ----- */
.page-tete { padding-block: var(--e-4) var(--e-3); background: var(--blanc); }
.page-tete__intro { font-size: var(--t-1); color: var(--encre); }
.section__corps h2 { margin-top: 0; }
.texte p, .texte ul { max-width: var(--mesure); }
.texte ul { margin: 0 0 var(--e-2); padding-left: 1.25rem; }
.texte li { margin-bottom: .4rem; }
.texte li::marker { color: var(--orange); }
.section .lieux, .section .etapes, .section .questions, .section .fiches, .section .telechargements { margin-top: var(--e-4); }
.section .duo--texte--seul + .conteneur > .lieux, .section .duo--texte--seul + .conteneur > .fiches, .section .duo--texte--seul + .conteneur > .portraits, .section .duo--texte--seul + .conteneur > .presse, .section .duo--texte--seul + .conteneur > .documents-liste, .section .duo--texte--seul + .questions { margin-top: var(--e-3); }
.section .duo--texte--seul + .conteneur > .etapes { margin-top: var(--e-4); }
.section .etapes { margin-top: var(--e-5); }

.sommaire ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: var(--e-3) 0 0; padding: 0; list-style: none; }
.sommaire a { display: inline-flex; min-height: 2.75rem; align-items: center; padding: .4rem 1.1rem; border-radius: var(--rayon-plein); font-weight: 800; font-size: 1rem; color: var(--marron); background: var(--jaune-clair); text-decoration: none; }
.sommaire a:hover { background: var(--jaune); }

.groupe-action__tete { padding-top: var(--e-5); }
.groupe-action__titre { font-size: var(--t-3); }
.groupe-action .section:first-of-type { padding-top: var(--e-4); }

/* Fiches : contenus courts (équipe, presse, liens) */
.fiches { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.fiche { position: relative; display: flex; flex-direction: column; padding: var(--e-3); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); transition: transform var(--duree-rapide) var(--courbe); }
.fiche__icone, .document__icone { display: grid; flex: none; place-items: center; width: 3rem; height: 3rem; margin-bottom: var(--e-2); border-radius: 58% 42% 50% 50% / 52% 52% 48% 48%; font-size: 1.2rem; color: var(--marron); background: var(--jaune); }
.fiche__titre { margin-bottom: .25rem; font-size: 1.2rem; }
.fiche__titre a { color: var(--marron); text-decoration: none; }
.fiche--lien .fiche__titre a::after { content: ""; position: absolute; inset: 0; }
.fiche--lien:hover { transform: translateY(-3px); }
.fiche__sous-titre { margin: 0 0 .5rem; font-weight: 800; color: var(--orange-texte); font-size: 1rem; }
.fiche__texte { margin: 0; color: var(--encre-douce); }
.fiche__plus summary { cursor: pointer; font-weight: 800; color: var(--marron); }
.fiche__plus p { margin: .75rem 0 0; color: var(--encre); }

/* Documents à télécharger (liste reprise de l'Ulamir, mise aux couleurs) */
.telechargements { padding: var(--e-3); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.telechargements .doc-links { margin: 0; }

.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: var(--e-2); margin-top: var(--e-4); }
.galerie img { border-radius: 16px; aspect-ratio: 1; object-fit: cover; }

.bandeau-fin h2 { margin-bottom: .5rem; }
.bandeau-fin p { font-size: var(--t-1); }

/* Formulaire : messages */
.alerte { margin: 0 0 var(--e-3); padding: var(--e-2) var(--e-3); border-radius: var(--rayon-champ); font-weight: 800; }
.alerte--ok { color: var(--marron); background: var(--jaune-clair); }
.alerte--erreur { color: var(--erreur); background: var(--erreur-fond); }
.champ__erreur { margin: .35rem 0 0; font-weight: 800; color: var(--erreur); }
.champ [aria-invalid="true"] { border-color: var(--erreur); }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* =====================================================================
   Passe « famille et enfance » (retours du 2026-10-26)
   ===================================================================== */

/* ----- Lien avec flèche ----- */
.lien-fleche { display: inline-flex; align-items: center; gap: .4rem; margin-top: var(--e-2); font-weight: 800; color: var(--orange-texte); text-decoration: none; }
a.lien-fleche:hover { text-decoration: underline; }
.lien-fleche::after { content: "\f061"; font: var(--fa-font-solid); font-size: .8em; transition: transform var(--duree-rapide) var(--courbe); }
a.lien-fleche:hover::after, .entree:hover .lien-fleche::after, .fiche--lien:hover .lien-fleche::after { transform: translateX(4px); }

/* ----- Motifs floraux (petites touches, jamais sur le texte) ----- */
.surtitre::before { content: ""; display: inline-block; width: .8em; height: 1.35em; margin-right: .35em; vertical-align: -.3em; background: url("/assets/img/site/motifs/logo-graine.webp") center / contain no-repeat; }
.deco-graines, .deco-graines-miroir, .deco-pousse { position: relative; }
.deco-graines::after, .deco-graines-miroir::after, .deco-pousse::after { content: ""; position: absolute; z-index: 1; pointer-events: none; background: center / contain no-repeat; }
.deco-graines::after { width: 6.5rem; height: 5rem; top: -2.25rem; right: -1.5rem; background-image: url("/assets/img/site/motifs/logo-graines.webp"); }
.deco-graines-miroir::after { width: 6.5rem; height: 5rem; top: -2.25rem; left: -1.5rem; background-image: url("/assets/img/site/motifs/logo-graines-miroir.webp"); }
.deco-pousse::after { width: 6rem; height: 4.75rem; bottom: -1.75rem; right: .5rem; background-image: url("/assets/img/site/motifs/logo-pousse.webp"); }
.heros::after { content: ""; position: absolute; left: 2%; bottom: 1rem; width: 7rem; height: 5.5rem; background: url("/assets/img/site/motifs/logo-pousse-miroir.webp") center / contain no-repeat; pointer-events: none; }
.pied::before { content: ""; position: absolute; right: 4%; top: -3rem; width: 6rem; height: 4.75rem; background: url("/assets/img/site/motifs/logo-pousse.webp") center / contain no-repeat; pointer-events: none; }


/* ----- Sections sans photo : titre à gauche, texte à droite ----- */
.duo--texte { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--e-4); align-items: start; }
.duo--texte__titre { padding-top: .25rem; }
.duo--texte--seul { grid-template-columns: minmax(0, 1fr); gap: 0; }
.duo--texte--seul .section__corps:empty { display: none; }
.duo--texte--seul .duo--texte__titre h2 { margin-bottom: 0; }
@media (max-width: 52rem) { .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); } }

/* Motif du logo à côté du titre de section : hors du flux (position absolue sans décalage,
   donc placé juste après le dernier mot), il ne crée aucun espace sous le titre.
   La largeur du titre réserve sa place pour éviter tout débordement. */
.titre-motif { max-width: calc(100% - var(--motif-titre-l) - .75rem); }
.titre-motif::after { content: ""; position: absolute; display: inline-block; width: var(--motif-titre-l); height: var(--motif-titre-h); margin-left: .6rem; translate: 0 -12%; background: center / contain no-repeat; pointer-events: none; }
.motif-graines::after { background-image: url("/assets/img/site/motifs/logo-graines.webp"); }
.motif-graines-miroir::after { background-image: url("/assets/img/site/motifs/logo-graines-miroir.webp"); }
.motif-pousse::after { background-image: url("/assets/img/site/motifs/logo-pousse.webp"); }

/* ----- Sommaire des pages longues : en tête de page, puis bouton flottant ----- */
.sommaire { margin-top: var(--e-3); }
.sommaire__titre { margin: 0 0 .5rem; font-weight: 800; color: var(--encre-douce); }
.sommaire ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.sommaire a { display: inline-flex; gap: .5rem; align-items: center; min-height: 2.75rem; padding: .35rem 1.1rem; border-radius: var(--rayon-plein); font-weight: 800; font-size: .98rem; color: var(--marron); background: var(--jaune-clair); text-decoration: none; }
.sommaire a i { font-size: .8em; color: var(--orange-texte); }
.sommaire a:hover { background: var(--jaune); }
.sommaire-flottant { position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 20; visibility: hidden; opacity: 0; transform: translateY(1rem); transition: opacity var(--duree) var(--courbe), transform var(--duree) var(--courbe), visibility var(--duree); }
.sommaire-flottant.est-visible { visibility: visible; opacity: 1; transform: none; }
.sommaire-flottant__bouton { box-shadow: var(--ombre); }
.sommaire-flottant__liste { inset: auto max(1rem, env(safe-area-inset-right)) 4.75rem auto; width: min(22rem, calc(100vw - 2rem)); max-height: 70vh; margin: 0; padding: var(--e-1); border: 0; border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre-forte); overflow-y: auto; }
.sommaire-flottant__liste ul { margin: 0; padding: 0; list-style: none; }
.sommaire-flottant__liste a { display: flex; gap: .5rem; align-items: center; min-height: 2.75rem; padding: .4rem .9rem; border-radius: 14px; font-weight: 700; color: var(--marron); text-decoration: none; }
.sommaire-flottant__liste a:hover { background: var(--jaune-clair); }
.sommaire-flottant__liste li:first-child a { color: var(--orange-texte); }
@media (prefers-reduced-motion: reduce) { .sommaire-flottant { transition: none; } }

.fiche .lien-fleche { margin-top: auto; padding-top: var(--e-2); }

/* ----- Équipe : cartes de même hauteur, présentation en fenêtre (luska.js) ----- */
.portraits { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.portrait { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: var(--e-3); border-radius: var(--rayon); text-align: center; background: var(--blanc); box-shadow: var(--ombre); }
.portrait__photo { display: grid; place-items: center; width: 7.5rem; height: 7.5rem; margin-bottom: .5rem; border-radius: 58% 42% 50% 50% / 52% 52% 48% 48%; background: var(--jaune) url("/assets/img/site/motifs/logo-graine.webp") right 10px bottom 4px / 1.25rem no-repeat; }
.portrait__photo span { font-size: 2.25rem; font-weight: 800; color: var(--marron); }
.portrait__nom { margin: 0; font-size: 1.2rem; }
.portrait__role { margin: 0; font-weight: 800; font-size: .98rem; color: var(--orange-texte); }
.portrait__plus { width: 100%; margin-top: auto; padding-top: .5rem; }
.portrait__plus summary { list-style: none; cursor: pointer; }
.portrait__plus summary::-webkit-details-marker { display: none; }
.portrait__texte { margin: var(--e-2) 0 0; text-align: left; font-size: 1rem; }
.portrait-fenetre { position: fixed; inset: 0; margin: auto; height: fit-content; width: min(36rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: var(--e-4) var(--e-3) var(--e-3); border: 0; border-radius: var(--rayon); text-align: center; color: var(--encre); background: var(--blanc); box-shadow: var(--ombre-forte); }
.portrait-fenetre::backdrop { background: var(--voile); }
.portrait-fenetre[open] { display: flex; flex-direction: column; align-items: center; gap: .5rem; animation: envoi-apparait .25s ease-out; }
.portrait-fenetre__texte { margin: var(--e-2) 0 0; text-align: left; }
.portrait-fenetre__fermer { position: absolute; top: .75rem; right: .75rem; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; font-size: 1.2rem; color: var(--marron); background: var(--jaune-clair); cursor: pointer; }
.portrait-fenetre__fermer:hover { background: var(--jaune); }
@media (prefers-reduced-motion: reduce) { .portrait-fenetre[open] { animation: none; } }

/* ----- Documents : cartes ----- */
.documents-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.document { display: flex; flex-direction: column; padding: var(--e-3); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.document__titre { margin-bottom: .25rem; font-size: 1.15rem; }
.document__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.25rem; margin: auto 0 0; padding-top: var(--e-2); }
.document__pdf { text-decoration: none; }
.document__pdf:hover { text-decoration: underline; }
.document__actions .lien-fleche { margin: 0; }
.document__pdf { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; font-weight: 800; color: var(--marron); }
.document__pdf span { font-weight: 400; color: var(--encre-douce); }

/* ----- Entrées de l'accueil : clairement cliquables ----- */
.entree { cursor: pointer; display: flex; flex-direction: column; }
.entree__corps { display: flex; flex-direction: column; flex: 1; }
.entree__corps .lien-fleche { margin-top: auto; padding-top: var(--e-2); }
.entree:hover { box-shadow: var(--ombre-forte); }
.entree:hover h3 a { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 3px; }

/* ----- Rendez-vous : icônes ----- */
.rdv__infos i { width: 1.1em; color: var(--orange-texte); }

/* ----- Questions : icône ----- */
.questions summary span { display: inline-flex; gap: .6rem; align-items: baseline; }
.questions summary i { color: var(--orange-texte); }

/* ----- Bandeau de contact ----- */
.bandeau-fin__grille { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e-3); }
.bandeau-fin__contact a { font-weight: 800; color: var(--marron); }
.bandeau-fin .boutons { margin-top: 0; }

/* ----- Agenda : le mois tient dans la hauteur de l'écran ----- */
.calendar-section { padding-block: var(--e-3) var(--e-4); }
.calendar-section .section-head { margin-bottom: var(--e-2); }
@media (max-height: 62rem) and (min-width: 40rem) {
  .calendar-section { padding-block: .75rem var(--e-2); }
  .calendar-section .section-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .calendar-section .section-intro, .calendar-section .section-eyebrow { display: none; }
  .calendar-section .calendar { padding: var(--e-2); }
  .calendar-section .calendar__toolbar { margin-bottom: var(--e-1); }
  .calendar-section .cal-week { grid-template-rows: 1.3rem repeat(3, .95rem) .2rem; row-gap: 2px; }
  .calendar-section .cal-event, .calendar-section [class*="cal-bar"] { font-size: .72rem; line-height: .95rem; }
  .calendar-section .calendar { margin-top: 0; }
  .calendar-section .cal-week--head { grid-template-rows: auto; }
  .calendar-section .cal-grid__dow { padding-block: .3rem; }
}
.fiche__texte--court { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ----- Sondage ----- */
.sondage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--e-4); align-items: start; }
.sondage__ateliers { display: grid; gap: var(--e-3); margin: var(--e-3) 0; padding: 0; list-style: none; }
.sondage__ateliers .fiche__titre { font-size: 1.1rem; }
.choix { margin: 0 0 var(--e-3); padding: 0; border: 0; }
.choix legend { margin-bottom: .5rem; font-weight: 800; color: var(--encre); }
.choix__option { display: flex; gap: .6rem; align-items: center; min-height: 2.75rem; padding: .25rem .75rem; border-radius: 12px; cursor: pointer; }
.choix__option:hover { background: var(--jaune-clair); }
.choix__option input { width: 1.25rem; height: 1.25rem; accent-color: var(--marron); }
.choix__autre { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding: .25rem .75rem; }
.choix__autre input { flex: 1; min-width: min(100%, 10rem); min-height: 2.75rem; padding: .5rem .75rem; border: 2px solid var(--line-strong); border-radius: var(--rayon-champ); font: inherit; }
@media (max-width: 52rem) { .sondage { grid-template-columns: minmax(0, 1fr); } }
/* Cases et boutons radio : hors du style des champs texte (.champ input) */
.champ input:is([type="checkbox"], [type="radio"]) { flex: none; width: 1.35rem; min-width: 0; height: 1.35rem; min-height: 0; margin: 0; padding: 0; accent-color: var(--marron); }
.champ .choix__option { display: flex; margin: 0; font-weight: 700; }
.champ .choix__autre label { display: inline; margin: 0; }
.champ .choix__autre input[type="text"] { width: auto; min-height: var(--bouton-h-petit); }

/* Contact : coordonnées avec icônes et plan du siège */
.coordonnees li { display: flex; gap: var(--e-2); align-items: flex-start; }
.coordonnees__icone { display: grid; flex: none; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50% 45% 55% 50%; color: var(--marron); background: var(--jaune); }
.coordonnees a { font-weight: 700; }
.contact-plan { grid-column: 1 / -1; height: clamp(14rem, 10rem + 10vw, 20rem); border-radius: var(--rayon); overflow: hidden; }

/* Formulaires envoyés sans rechargement (formulaires.js) */
.bouton[aria-busy="true"] { cursor: progress; opacity: .85; }
.bouton[aria-busy="true"]::after { content: ""; width: 1em; height: 1em; border: 3px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: envoi-tourne .8s linear infinite; }
@keyframes envoi-tourne { to { transform: rotate(360deg); } }
.envoi-merci { padding: var(--e-4) var(--e-3); border-radius: var(--rayon); text-align: center; background: var(--blanc); box-shadow: var(--ombre); animation: envoi-apparait .5s ease-out; }
.envoi-merci:focus { outline: none; }
.envoi-merci__icone { display: inline-grid; place-items: center; width: 4rem; height: 4rem; margin-bottom: var(--e-2); border-radius: 50%; font-size: 1.6rem; color: var(--marron); background: var(--jaune); }
.envoi-merci__titre { margin: 0 0 .5rem; font-size: var(--t-1); font-weight: 800; color: var(--marron); }
.envoi-merci__texte { max-width: 40ch; margin: 0 auto; }
@keyframes envoi-apparait { from { opacity: 0; transform: translateY(.75rem) scale(.97); } }
@media (prefers-reduced-motion: reduce) { .bouton[aria-busy="true"]::after, .envoi-merci { animation: none; } }

/* Logos des partenaires : lien vers leur site */
.partenaires a { display: block; padding: .5rem; border-radius: var(--rayon); transition: transform var(--duree-rapide) var(--courbe); }
.partenaires a:hover { transform: translateY(-2px); box-shadow: var(--ombre); }

/* Agenda : choix liste / calendrier, liste par mois, rendez-vous passés */
.vues { display: inline-flex; gap: .25rem; margin-bottom: var(--e-4); padding: .3rem; border-radius: var(--rayon-plein); background: var(--jaune-clair); }
.vues__lien { display: inline-flex; gap: .5rem; align-items: center; min-height: 2.75rem; padding: .4rem 1.2rem; border-radius: var(--rayon-plein); font-weight: 800; color: var(--marron); text-decoration: none; }
.vues__lien[aria-current="page"] { color: var(--blanc); background: var(--marron); }
.vues__lien:not([aria-current]):hover { background: var(--blanc); }
.agenda-liste__titre { margin: 0 0 var(--e-2); font-size: var(--t-2); color: var(--marron); }
.agenda-liste__mois { margin: var(--e-4) 0 var(--e-2); font-size: var(--t-1); color: var(--orange-texte); }
.agenda-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 30rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.agenda-liste__item { display: grid; grid-template-columns: auto 1fr; gap: var(--e-3); align-items: start; padding: var(--e-3); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.agenda-liste__item .rdv__date { margin: 0; }
.agenda-liste__item time { display: contents; }
.agenda-liste__texte { max-width: var(--mesure); margin: .5rem 0 0; }
.agenda-passes { margin-top: var(--e-5); }
.agenda-passes summary { display: flex; gap: .75rem; align-items: center; cursor: pointer; list-style: none; }
.agenda-passes summary::-webkit-details-marker { display: none; }
.agenda-passes summary::after { content: "\f078"; font: var(--fa-font-solid); color: var(--orange-texte); transition: transform .2s ease; }
.agenda-passes[open] summary::after { transform: rotate(180deg); }
.agenda-passes summary .agenda-liste__titre { margin: 0; }
.agenda-liste--passe .agenda-liste__item { box-shadow: none; border: 1px solid var(--trait); }
.agenda-liste--passe .rdv__date { background: var(--jaune-clair); }
@media (max-width: 40rem) { .agenda-liste__item { gap: var(--e-2); padding: var(--e-2); } .rdv__affiche { width: 4rem; } }

/* On parle de nous : coupures en petites vignettes, agrandies au clic */
.presse { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr)); gap: var(--e-3); margin: 0; padding: 0; list-style: none; }
.presse__article { display: grid; grid-template-columns: 6.5rem 1fr; gap: var(--e-2); align-items: start; padding: var(--e-2); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.presse__vignette { display: block; padding: 0; border: 1px solid var(--trait); border-radius: 6px; overflow: hidden; background: var(--blanc); cursor: zoom-in; transform: rotate(-2deg); transition: transform var(--duree-rapide) var(--courbe); }
.presse__article:nth-child(even) .presse__vignette { transform: rotate(2deg); }
.presse__vignette:hover, .presse__vignette:focus-visible { transform: rotate(0) scale(1.04); }
.presse__vignette img { display: block; width: 100%; height: 8.5rem; object-fit: cover; object-position: top; }
.presse__titre { margin: 0 0 .25rem; font-size: 1rem; line-height: 1.3; color: var(--marron); }
.presse__source { margin: 0; font-size: .9rem; color: var(--encre-douce); }
@media (prefers-reduced-motion: reduce) { .presse__vignette { transform: none !important; } }

/* Pied de page : liens légaux à gauche, SIRET et crédit à droite, sur une ligne */
.pied__bas { align-items: baseline; }
.pied__bas p { margin: 0; font-size: .9rem; }
.pied__liens { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.1rem; }
.pied__credit { text-align: right; }
@media (max-width: 60rem) { .pied__bas { flex-direction: column; } .pied__credit { text-align: left; } }

/* Page Crédits */
.credits-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: var(--e-3); margin: var(--e-3) 0 var(--e-4); padding: 0; list-style: none; }
.credits-photos li { overflow: hidden; border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
.credits-photos img { display: block; width: 100%; height: 9rem; object-fit: cover; }
.credits-photos p { margin: 0; padding: .75rem 1rem; font-size: .95rem; }
.credits-autres { max-width: var(--mesure); padding-left: 1.2rem; }
.credits-autres li { margin-bottom: .5rem; }
.cadre-bas { object-position: 50% 85%; }

@media (max-width: 40rem) { .heros::after { display: none; } }

/* ----- Fiche d'un événement (modale de l'agenda, site public) -----
   Couche du thème sur modal.css et sections/calendar.css (partagés avec le tableau de bord) :
   fond brun sans flou, en-tête jaune clair, intertitres en phrase, partage en ligne. */
.event-modal { --em-radius: var(--rayon); --em-radius-sm: var(--rayon-champ); color: var(--encre); }
.modal::backdrop { background: var(--voile); backdrop-filter: none; }
.event-modal .modal__header { padding-block: var(--e-2); border-bottom: 0; background: var(--jaune-clair); }
.event-modal .modal__title { font-size: var(--t-1); font-weight: 800; color: var(--marron); }
.event-modal .modal__close { width: var(--bouton-h-petit); height: var(--bouton-h-petit); border-radius: 50%; color: var(--marron); background: var(--blanc); }
.event-modal .modal__close:hover { background: var(--jaune); }
.event-modal__facts { gap: 0; border: 0; border-radius: var(--em-radius-sm); background: var(--creme); }
.event-modal__fact { flex-basis: 14rem; column-gap: var(--e-2); padding: var(--e-2); background: transparent; }
.event-modal__fact-icon { width: 2.5rem; height: 2.5rem; border-radius: 58% 42% 50% 50% / 52% 52% 48% 48%; font-size: 1rem; color: var(--marron); background: var(--jaune); }
.event-modal__fact-label { font-size: .95rem; font-weight: 800; letter-spacing: 0; text-transform: none; color: var(--encre-douce); }
.event-modal__fact dd { font-weight: 700; color: var(--encre); }
.event-modal__map-toggle { min-height: var(--bouton-h-petit); color: var(--orange-texte); font-size: 1rem; }
.event-modal__section-title { font-size: 1.05rem; font-weight: 800; letter-spacing: 0; text-transform: none; color: var(--marron); }
.event-modal__contact { gap: var(--e-1) var(--e-3); font-size: 1rem; }
.event-modal__contact-link { min-height: var(--bouton-h-petit); color: var(--orange-texte); }
.event-modal__contact i { color: var(--orange-texte); }
.share-list { display: flex; flex-wrap: wrap; gap: var(--e-1); margin: 0; padding: 0; list-style: none; }
.share-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: var(--bouton-h-petit); height: var(--bouton-h-petit); padding: 0; border: 2px solid var(--jaune); border-radius: var(--rayon-plein); font: 800 .95rem/1 var(--police); color: var(--marron); background: var(--blanc); text-decoration: none; cursor: pointer; transition: transform var(--duree-rapide) var(--courbe); }
.share-btn:hover { color: var(--marron); background: var(--jaune-clair); transform: translateY(-1px); }
.share-btn--copier { padding-inline: 1rem; }
.share-feedback { margin: var(--e-1) 0 0; font-weight: 700; color: var(--marron); }
.share-feedback:empty { display: none; }
.event-modal__footer { padding-block: var(--e-2); background: var(--blanc); }
.event-modal__actions .btn { min-height: var(--bouton-h-petit); padding: .5rem var(--bouton-x-petit); }
/* Formulaire d'inscription : mêmes champs que le formulaire de contact */
.event-modal .form-grid { gap: var(--e-2) var(--e-3); }
.event-modal .form-field label, .event-modal .party legend { font-weight: 800; font-size: 1rem; color: var(--encre); }
.event-modal .form-field input { min-height: var(--bouton-h); border: 2px solid var(--line-strong); border-radius: var(--rayon-champ); }
.event-modal .form-field input[aria-invalid="true"] { border-color: var(--erreur); box-shadow: none; }
.event-modal .form-error, .event-modal .form-required { font-weight: 700; color: var(--erreur); }
.event-modal .form-hint, .event-modal__notice { font-size: .95rem; color: var(--encre-douce); }
.event-modal__notice i { color: var(--orange-texte); }
.event-modal .party__counter { border-color: var(--trait); border-radius: var(--rayon-champ); background: var(--creme); }
.event-modal .party__step { width: var(--bouton-h-petit); height: var(--bouton-h-petit); border-radius: 50%; color: var(--marron); background: var(--jaune); }
.event-modal .party__step:hover { background: var(--jaune-fonce); }
.event-modal .party__controls input { min-height: var(--bouton-h-petit); border-radius: var(--rayon-champ); }
.event-modal .alert { border-radius: var(--rayon-champ); }
.event-modal__success { align-items: center; text-align: center; }
.event-modal__success-icon { display: inline-grid; place-items: center; width: 4rem; height: 4rem; border-radius: 50%; font-size: 1.6rem; color: var(--marron); background: var(--jaune); animation: envoi-apparait .5s ease-out; }
.event-modal__success-lead { max-width: 34rem; font-size: 1.15rem; font-weight: 800; line-height: 1.45; color: var(--marron); }
@media (prefers-reduced-motion: reduce) { .event-modal__success-icon { animation: none; } }

/* ----- Lettre d'information : encart jaune clair aux bords arrondis ----- */
.newsletter__inner { padding: var(--e-4); border-radius: var(--rayon); background: var(--jaune-clair); }
.newsletter__text p { margin-bottom: 0; }
.newsletter__label { font-weight: 800; }
.newsletter .form-hint { font-size: .95rem; color: var(--encre-douce); }
.newsletter__done-icon { color: var(--marron); background: var(--jaune); }
@media (max-width: 40rem) { .newsletter__inner { padding: var(--e-3); } }

/* ----- Rythme vertical : moins de vide sous le fil d'Ariane et l'en-tête de page ----- */
.ariane + .section, .ariane + .legal { padding-top: var(--e-4); }
.page-tete + .section:not([class*="section--"]) { padding-top: var(--e-3); }
.newsletter { padding-top: 0; }

/* ----- Pages légales, plan du site : alignées sur le fil d'Ariane, lignes de 46rem ----- */
.legal .legal__container { width: min(100% - 2.5rem, var(--largeur)); max-width: none; padding-inline: 0; }
.legal .legal__container > * { max-width: 46rem; }
.legal h1 { margin-bottom: var(--e-3); }
.legal h2 { color: var(--marron); }

/* ----- Page d'erreur (404, 500) ----- */
.erreur__corps { max-width: 46rem; text-align: center; }
.erreur__corps .page-tete__intro { margin-inline: auto; }
.erreur__nav { margin-top: var(--e-4); padding: var(--e-3); border-radius: var(--rayon); background: var(--jaune-clair); }
.erreur__nav h2 { font-size: var(--t-1); }
.erreur__nav ul { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--e-1); margin: 0; padding: 0; list-style: none; }
.erreur__nav a { display: inline-flex; align-items: center; min-height: var(--bouton-h-petit); padding: .35rem 1.1rem; border-radius: var(--rayon-plein); font-weight: 800; color: var(--marron); background: var(--blanc); text-decoration: none; }
.erreur__nav a:hover { background: var(--jaune); }

/* ----- Visionneuse (photos, coupures de presse) : voile brun, boutons clairs ----- */
.lightbox { background: var(--voile-fort); }
.lightbox::backdrop { background: var(--voile); }
.lightbox__btn { color: var(--marron); background: var(--blanc); }
.lightbox__btn:hover, .lightbox__btn:focus-visible { color: var(--marron); background: var(--jaune); }
.lightbox__count { color: var(--blanc); }

/* ----- Petits écrans : aucun défilement horizontal (motifs débordants, boutons longs) ----- */
main { overflow-x: clip; }
@media (max-width: 40rem) { .bouton { white-space: normal; text-align: center; } }

/* =====================================================================
   Passe du 2026-10-27 : formes ondulées, grands motifs de fond, réseaux sociaux,
   listes repliées, dispositions variées de « Nos actions »
   ===================================================================== */

/* ----- Formes ondulées (N1) : six contours organiques en masque SVG, étirés à l'image.
   Derrière, un second contour décalé (jaune) en guise de cadre. ----- */
.forme { position: relative; isolation: isolate; }
.forme::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--jaune); -webkit-mask: var(--forme-fond) center / 100% 100% no-repeat; mask: var(--forme-fond) center / 100% 100% no-repeat; transform: translate(3%, 4%) rotate(-2deg); pointer-events: none; }
.forme img { border: 0; border-radius: 0; box-shadow: none; -webkit-mask: var(--forme) center / 100% 100% no-repeat; mask: var(--forme) center / 100% 100% no-repeat; }
.heros .forme::before { background: var(--blanc); }
.forme-1 { --forme: var(--forme-1); --forme-fond: var(--forme-4); }
.forme-2 { --forme: var(--forme-2); --forme-fond: var(--forme-5); }
.forme-3 { --forme: var(--forme-3); --forme-fond: var(--forme-6); }
.forme-4 { --forme: var(--forme-4); --forme-fond: var(--forme-1); }
.forme-5 { --forme: var(--forme-5); --forme-fond: var(--forme-2); }
.forme-6 { --forme: var(--forme-6); --forme-fond: var(--forme-3); }
.forme-2::before, .forme-5::before { transform: translate(-3%, 4%) rotate(2deg); }
.forme-3::before, .forme-6::before { transform: translate(2%, -3%) rotate(3deg); }

/* Pastilles (icônes, initiales) : même famille de contours, variée selon la position */
.fiche__icone, .document__icone, .coordonnees__icone, .portrait__photo { border-radius: 0; -webkit-mask: var(--forme, var(--forme-1)) center / 100% 100% no-repeat; mask: var(--forme, var(--forme-1)) center / 100% 100% no-repeat; }
:is(.fiches, .documents-liste, .coordonnees, .portraits) > li:nth-child(6n+2) { --forme: var(--forme-2); }
:is(.fiches, .documents-liste, .coordonnees, .portraits) > li:nth-child(6n+3) { --forme: var(--forme-3); }
:is(.fiches, .documents-liste, .coordonnees, .portraits) > li:nth-child(6n+4) { --forme: var(--forme-4); }
:is(.fiches, .documents-liste, .coordonnees, .portraits) > li:nth-child(6n+5) { --forme: var(--forme-5); }
:is(.fiches, .documents-liste, .coordonnees, .portraits) > li:nth-child(6n) { --forme: var(--forme-6); }

/* ----- Grands motifs floraux de fond : hors du flux, très effacés, coupés au bord de la section ----- */
.fond-motif { position: relative; isolation: isolate; overflow: clip; }
.fond-motif::before { content: ""; position: absolute; z-index: -1; width: var(--motif-fond-taille); aspect-ratio: 1; background: var(--motif-fond) center / contain no-repeat; opacity: var(--motif-fond-opacite); pointer-events: none; }
.section--jaune-clair.fond-motif::before { opacity: var(--motif-fond-opacite-jaune); }
/* Texte orange plus foncé dans ces sections : contraste ≥ 4,5:1 même sur un trait du motif */
.fond-motif { --orange-texte: var(--secondary); }
.fond-motif--droite::before { top: var(--e-3); right: calc(var(--motif-fond-taille) * -.3); rotate: 14deg; }
.fond-motif--gauche::before { bottom: var(--e-3); left: calc(var(--motif-fond-taille) * -.3); rotate: -12deg; }
.fond-motif--fleur-graines { --motif-fond: var(--motif-fleur-graines); }
.fond-motif--fleur-feuilles { --motif-fond: var(--motif-fleur-feuilles); }
.fond-motif--pousse-grande { --motif-fond: var(--motif-pousse-grande); }
.fond-motif--graines-envol { --motif-fond: var(--motif-graines-envol); }
.fond-motif--branche-fleurie { --motif-fond: var(--motif-branche-fleurie); }

/* ----- Réseaux sociaux : boutons ronds, icône seule, nom accessible ----- */
.reseaux { display: flex; flex-wrap: wrap; gap: var(--e-1); margin: 0; padding: 0; list-style: none; }
.reseaux li { margin: 0; }
.reseau { display: inline-grid; place-items: center; width: var(--reseau-taille); height: var(--reseau-taille); border: 2px solid var(--marron); border-radius: 50%; font-size: 1.15rem; color: var(--marron); background: var(--blanc); text-decoration: none; transition: transform var(--duree-rapide) var(--courbe); }
.pied .reseau { color: var(--marron); }
/* Icône Font Awesome Free (facebook-f, CC BY 4.0) en SVG en ligne : évite de charger toute la police des marques */
.reseau__icone { width: 1.1rem; height: 1.1rem; }
.reseau:hover, .pied .reseau:hover { color: var(--blanc); background: var(--marron); transform: translateY(-2px); }
.reseau:focus-visible { outline: 3px solid var(--marron); outline-offset: 3px; }
.reseaux-bloc { margin-top: var(--e-3); }
.reseaux-bloc__titre { margin: 0 0 .5rem; font-weight: 800; color: var(--marron); }

/* ----- Contact : colonnes de même hauteur, la zone de message prend la place restante ----- */
.formulaire .champ[data-champ="message"] { display: flex; flex: 1; flex-direction: column; }
.formulaire .champ[data-champ="message"] textarea { flex: 1; min-height: 9rem; resize: vertical; }
.formulaire > .bouton { align-self: flex-start; }

/* ----- Listes repliées : 3 éléments visibles, les autres dans un <details> ----- */
.liste-plus { margin-top: var(--e-3); }
.liste-plus__bouton { list-style: none; }
.liste-plus__bouton::-webkit-details-marker { display: none; }
.liste-plus__bouton::after { content: "\f078"; font: var(--fa-font-solid); font-size: .8em; transition: transform var(--duree-rapide) var(--courbe); }
.liste-plus[open] > .liste-plus__bouton::after { transform: rotate(180deg); }
.liste-plus__fermer, .liste-plus[open] .liste-plus__ouvrir { display: none; }
.liste-plus[open] .liste-plus__fermer { display: inline; }
.liste-plus > ul { margin-top: var(--e-3); }

/* ----- « Nos actions » : une disposition par section (PublicPagesController::DISPOSITIONS) ----- */
/* Sections d'une même action : rythme plus serré que celui des pages */
.groupe-action .section { padding-block: var(--e-4); }
.groupe-action .groupe-action__tete { padding-top: var(--e-4); }

/* Titres centrés : la place du motif du logo reste réservée, le titre reste centré */
:is(.disposition--chapeau, .disposition--citation, .disposition--bande, .disposition--carte) .titre-motif { margin-inline: auto; }

/* Chapeau : principes centrés, en grand */
.disposition--chapeau .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); max-width: 50rem; text-align: center; }

.disposition--chapeau .texte p { max-width: none; font-size: var(--t-1); line-height: 1.55; }

/* Encart : grande image, texte posé sur un panneau qui la chevauche */
@media (min-width: 52.01rem) {
  .disposition--encart .duo, .disposition--encart-inverse .duo { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0; }
  .disposition--encart .duo__image, .disposition--encart-inverse .duo__image { grid-row: 1; }
  .disposition--encart .duo__image { grid-column: 1 / 9; }
  .disposition--encart-inverse .duo__image { grid-column: 5 / 13; order: 0; }
  .disposition--encart .duo__image img, .disposition--encart-inverse .duo__image img { aspect-ratio: 3 / 2; }
  .disposition--encart .section__corps, .disposition--encart-inverse .section__corps { position: relative; z-index: 2; grid-row: 1; padding: var(--e-4); border-radius: var(--rayon); background: var(--blanc); box-shadow: var(--ombre); }
  .disposition--encart .section__corps { grid-column: 7 / 13; }
  .disposition--encart-inverse .section__corps { grid-column: 1 / 7; }
  .disposition--encart .texte p:last-child, .disposition--encart-inverse .texte p:last-child { margin-bottom: 0; }
}

/* Décalé : petite image descendue, première phrase en exergue */
.disposition--decale .duo { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: start; }
.disposition--decale .duo__image { margin-top: var(--e-5); }
.disposition--decale .duo__image img { aspect-ratio: 1; }
.disposition--decale .texte > p:first-child { font-size: var(--t-1); line-height: 1.5; color: var(--marron); }
@media (max-width: 52rem) { .disposition--decale .duo { grid-template-columns: minmax(0, 1fr); } .disposition--decale .duo__image { max-width: 20rem; margin-top: 0; } }

/* Citation : titre centré, premier paragraphe en grand, guillemet en icône */
.disposition--citation .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); max-width: 52rem; text-align: center; }

.disposition--citation .texte p { margin-inline: auto; }
.disposition--citation .texte > p:first-child { max-width: none; font-size: var(--t-1); line-height: 1.55; color: var(--encre); }
.disposition--citation .texte > p:first-child::before { content: "\f10d"; display: block; margin-bottom: var(--e-1); font: var(--fa-font-solid); font-size: 2rem; color: var(--orange); }
.disposition--citation .texte > p:last-child { font-weight: 700; color: var(--marron); }

/* Horaire : le déroulé de la matinée en trois étapes côte à côte */
.disposition--horaire .texte ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--e-2); max-width: none; margin: var(--e-3) 0; padding: 0; list-style: none; }
.disposition--horaire .texte li { margin: 0; padding: var(--e-2); border-radius: var(--rayon-champ); background: var(--jaune-clair); }
.disposition--horaire .texte li strong { font-size: var(--t-1); color: var(--marron); }

/* Bande : fond jaune clair, texte centré et resserré */
.disposition--bande .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); max-width: 46rem; text-align: center; }

.disposition--bande .texte p { margin-inline: auto; }
.disposition--bande .texte > p:last-child { font-weight: 700; }

/* Cycle : titre pleine largeur, séances en grille numérotée */
.disposition--cycle .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); }
.disposition--cycle .texte ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); gap: var(--e-2); max-width: none; margin: var(--e-3) 0; padding: 0; list-style: none; counter-reset: seance; }
.disposition--cycle .texte li { position: relative; margin: 0; padding: var(--e-2) var(--e-2) var(--e-2) 3.75rem; border-radius: var(--rayon-champ); font-size: 1.0625rem; background: var(--jaune-clair); counter-increment: seance; }
.disposition--cycle .texte li::before { content: counter(seance); position: absolute; top: var(--e-2); left: var(--e-2); display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; font-weight: 800; color: var(--blanc); background: var(--marron); }

/* Titres longs de ces dispositions : motif du logo calé en haut à droite du titre */
:is(.disposition--cycle, .disposition--livrets) .titre-motif { position: relative; max-width: 46rem; padding-right: calc(var(--motif-titre-l) + .75rem); }
:is(.disposition--cycle, .disposition--livrets) .titre-motif::after { top: 0; right: 0; margin: 0; }

/* Livrets : titre et lien sur une ligne, cartes compactes */
.disposition--livrets .duo--texte { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e-2) var(--e-4); }
.disposition--livrets .duo--texte .boutons { margin-top: 0; }
.disposition--livrets .duo--texte__titre { flex: 1 1 26rem; }
.disposition--livrets .documents-liste { grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: var(--e-2); }
.disposition--livrets .document { padding: var(--e-2) var(--e-3); }
@media (min-width: 40.01rem) {
  .disposition--livrets .document { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--e-2); }
  .disposition--livrets .document__icone { grid-row: span 2; margin: 0; }
}
.disposition--livrets .document__titre { font-size: 1.0625rem; }
.disposition--livrets .document__actions { padding-top: .25rem; }

/* Colonnes : texte sur deux colonnes sous le titre */
.disposition--colonnes .duo--texte { grid-template-columns: minmax(0, 1fr); gap: var(--e-2); }
.disposition--colonnes .texte { columns: 2 22rem; column-gap: var(--e-4); }
.disposition--colonnes .texte p { break-inside: avoid; }

/* Carte : texte court au centre d'une forme ondulée jaune clair */
.disposition--carte .duo--texte { position: relative; isolation: isolate; grid-template-columns: minmax(0, 1fr); gap: var(--e-2); max-width: 46rem; padding: var(--e-5) clamp(1.5rem, 1rem + 5vw, 5rem); text-align: center; }
.disposition--carte .duo--texte::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--jaune-clair); -webkit-mask: var(--forme-3) center / 100% 100% no-repeat; mask: var(--forme-3) center / 100% 100% no-repeat; }

.disposition--carte .texte p { margin-inline: auto; }
.disposition--carte .texte > p:last-child { margin-bottom: 0; }

@media (prefers-reduced-motion: reduce) { .reseau:hover, .pied .reseau:hover { transform: none; } .liste-plus__bouton::after { transition: none; } }