/* Site Parents Étoile Réunion — feuille de mise en page unique.
   Charte (couleurs, polices, boutons, tags) : assets/per.css, chargée avant ce fichier.
   Règles : un seul bloc par composant, aucune règle qui en annule une autre, aucun !important.
   Spécification : docs/refonte-gabarits.md */

/* ==========================================================================
   1. Jetons de mise en page
   ========================================================================== */
:root{
  --e1:8px; --e2:16px; --e3:24px; --e4:40px; --e5:64px;   /* échelle d'espacement */
  --large:1700px;                                          /* largeur utile */
  --lecture:1180px;                                        /* largeur de la feuille de contenu */
  --gouttiere:clamp(18px,3vw,34px);
  --or:#D9A441;                                            /* cadre doré */
  --cadre:none;
  --nuit-profond:#0B1D3A;
  --texte-doux:#41556f;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-size:clamp(16px,1.05vw,18px);line-height:1.65;background:var(--or);padding-inline:8px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--ff-display);color:var(--nuit);line-height:1.18;margin:0 0 var(--e2);text-wrap:balance}
h1{font-size:clamp(1.9rem,3.6vw,2.6rem);font-weight:800}
h2{font-size:clamp(1.5rem,2.9vw,2.35rem);font-weight:700}
h3{font-size:clamp(1.15rem,1.7vw,1.38rem);font-weight:700}
h4{font-size:1.05rem;font-weight:700}
p{margin:0 0 1em}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:10px 14px;z-index:99}
.script{font-family:var(--ff-script);font-size:clamp(1.35rem,2.4vw,2rem);color:var(--dore);line-height:1.15;margin:0 0 12px}
.br-large{display:none}
@media(min-width:700px){.br-large{display:inline}}
@media(max-width:600px){body{padding-inline:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:0s;animation-duration:0s}}

/* ==========================================================================
   3. Cadre doré et conteneur
   Liséré doré de 8 px (~2 mm) sur toute la largeur, quelle que soit la fenêtre.
   ========================================================================== */
.cadre{max-width:var(--cadre);margin:0 auto;background:var(--creme);overflow:clip}
.conteneur{max-width:var(--large);margin:0 auto;padding-inline:var(--gouttiere)}

/* ==========================================================================
   4. En-tête 4C (docs/entete-4c.md)
   ========================================================================== */
.entete{position:sticky;top:0;z-index:30;background:var(--creme);border-bottom:1px solid var(--line);padding:14px 0;transition:padding .25s ease,box-shadow .25s ease}
.entete.fixe{padding:8px 0;box-shadow:0 6px 20px rgba(31,59,99,.10)}
.barre{display:flex;flex-wrap:nowrap;align-items:center;gap:28px;max-width:var(--large);margin:0 auto;padding-inline:var(--gouttiere)}
.marque{display:flex;align-items:center;gap:14px;flex:0 1 auto;min-width:0;text-decoration:none;transition:opacity .2s}
.marque:hover{opacity:.8}
.logo-h{height:74px;width:auto;flex:none;transition:height .25s ease}
.entete.fixe .logo-h{height:54px}
.entete a:focus-visible,.entete button:focus-visible{outline:2px solid var(--corail);outline-offset:3px}
.actions-entete{display:flex;gap:10px;align-items:center;flex:none}
.loupe{background:none;border:0;color:var(--nuit);font-size:1.1rem;cursor:pointer;padding:8px}
.burger{display:none;background:none;border:0;color:var(--nuit);font-size:1.7rem;line-height:1;cursor:pointer}

/* ---------- Navigation ---------- */
.entete nav{margin-left:auto}
.entete nav>ul{display:flex;gap:2px;list-style:none;margin:0;padding:0;align-items:center}
.entete nav li{position:relative}
.entete nav>ul>li>a{display:block;font-family:var(--ff-body);font-weight:700;font-size:15px;color:#25405f;text-decoration:none;padding:8px 13px;border-radius:999px;white-space:nowrap;transition:background .25s,color .25s}
.entete nav>ul>li>a:hover,.entete nav>ul>li>a:focus-visible{background:rgba(11,29,58,.07);color:var(--nuit)}
.entete nav>ul>li>a[aria-current]{background:rgba(242,184,76,.35);color:var(--nuit)}
.nav-accueil a{display:flex;align-items:center;gap:8px}
.nav-accueil svg{display:block;flex:none}
.sous-menu{list-style:none;margin:0;padding:10px;background:#fff;border-radius:var(--r-sm);box-shadow:var(--shadow-lg);min-width:262px}
.sous-menu a{display:block;padding:9px 14px;border-radius:10px;color:var(--nuit);font-weight:600;font-size:15px;text-decoration:none}
.sous-menu a:hover{background:var(--creme)}
.don-mobile{display:none}

/* Ordinateur : sous-menus au survol, stables (pont invisible + fermeture différée) */
@media(min-width:901px){
  .nav-accueil span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .sous-menu{position:absolute;top:calc(100% + 8px);left:0;visibility:hidden;opacity:0;transform:translateY(-4px);transition:opacity .18s ease .25s,transform .18s ease .25s,visibility 0s linear .43s}
  .entete nav li:hover>.sous-menu,.entete nav li:focus-within>.sous-menu{visibility:visible;opacity:1;transform:none;transition-delay:0s}
  .sous-menu::before{content:"";position:absolute;left:-10px;right:-10px;top:-14px;height:14px}
}
@media(min-width:901px) and (max-width:1100px){
  .entete{padding:12px 0}
  .barre{gap:14px;padding-inline:28px}
  .logo-h{height:62px}
  .entete nav>ul{gap:0}
  .entete nav>ul>li>a{font-size:14px;padding:8px 9px}
}
/* Mobile : tiroir sous l'en-tête */
@media(max-width:900px){
  .barre{gap:10px}
  .logo-h,.entete.fixe .logo-h{height:46px}
  .actions-entete{order:2;margin-left:auto;gap:8px}
  .actions-entete .btn{white-space:nowrap;padding:0 14px;min-height:40px}
  .burger{order:3;display:flex;align-items:center;justify-content:center;width:44px;height:44px}
  .entete nav{display:none;position:absolute;top:100%;left:0;right:0;margin:0;background:var(--creme);box-shadow:var(--shadow-lg);max-height:76vh;overflow:auto;padding:12px 0}
  .entete nav.ouvert{display:block}
  .entete nav>ul{flex-direction:column;align-items:stretch;gap:0}
  .entete nav>ul>li>a{padding:14px 20px;min-height:44px;border-radius:0}
  .sous-menu{position:static;background:none;box-shadow:none;padding:0 0 8px calc(var(--gouttiere) + 12px)}
  .sous-menu a{padding:8px 0;color:var(--muted)}
}
@media(max-width:400px){
  .actions-entete .btn{display:none}
  .don-mobile{display:block;padding:12px var(--gouttiere) 16px}
  .don-mobile a{display:block;text-align:center;background:var(--corail);color:#fff;border-radius:999px;padding:14px;font-weight:800}
}

/* ==========================================================================
   5. Bannières photo
   ========================================================================== */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;background:var(--nuit-profond)}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1}
.hero .conteneur{position:relative;width:100%}

/* ---------- Accueil : texte aligné sur le logo, voile à gauche ---------- */
.accueil .hero{min-height:min(80vh,660px);padding:var(--e5) 0}
.accueil .hero::after{background:
  linear-gradient(90deg,rgba(5,14,32,.66) 0%,rgba(5,14,32,.46) 32%,rgba(5,14,32,.12) 58%,rgba(5,14,32,0) 72%),
  linear-gradient(180deg,rgba(5,14,32,.3) 0%,rgba(5,14,32,0) 24%,rgba(8,18,38,.15) 100%)}
.accueil .hero .conteneur{text-shadow:0 2px 12px rgba(3,10,24,.9),0 1px 3px rgba(3,10,24,.8)}
.accueil .hero .texte{max-width:580px}
.accueil .hero .script{font-size:clamp(1.35rem,2.1vw,1.8rem);line-height:1.3;margin:0 0 14px;text-wrap:balance}
.accueil .hero h1{color:#fff;font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.1;margin:0 0 18px}
.accueil .hero .texte>p:not(.script,.ligne-urgence){font-size:clamp(1.02rem,1.5vw,1.25rem);color:#eaf1fa;max-width:46ch;line-height:1.65}
.hero .boutons{display:flex;gap:var(--e2);align-items:center;flex-wrap:wrap;margin-top:26px}
.hero .btn{text-shadow:none}
.ligne-urgence{margin:22px 0 0;font-size:.9rem;color:rgba(234,241,250,.82)}
.ligne-urgence::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--corail);margin-right:var(--e1);vertical-align:middle}
.ligne-urgence a{color:#fff;font-weight:800;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4)}
.ligne-urgence a:hover{border-color:#fff}
/* Mobile : la photo d'abord, lumineuse et sans voile, le texte dessous sur fond nuit */
@media(max-width:700px){
  .accueil .hero{display:block;min-height:0;padding:0}
  .accueil .hero>img{position:static;width:100%;height:62vw;max-height:380px;object-position:60% 78%}
  .accueil .hero::after{display:none}
  .accueil .hero .conteneur{padding-top:28px;padding-bottom:36px;text-shadow:none}
}
@media(max-width:600px){.hero .boutons .btn{width:100%;justify-content:center;min-height:48px}}

/* ---------- Pages intérieures : bannière portant le fil d'Ariane seul ---------- */
.hero.petit{min-height:210px;align-items:flex-end;padding:0 0 30px;text-align:center}
.hero.petit>img{object-position:50% 87%}
.hero.petit::after{background:linear-gradient(180deg,rgba(5,14,32,.55) 0%,rgba(5,14,32,.12) 55%,rgba(5,14,32,.35) 100%)}
.fil ol{list-style:none;margin:0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;font-family:var(--ff-body);font-size:16px;color:#eaf1fa;text-shadow:0 2px 10px rgba(3,10,24,.8)}
.fil li+li::before{content:"›";color:var(--dore);margin:0 .4em}
.fil a{color:#eaf1fa;text-decoration:none}
.fil a:hover{text-decoration:underline}
@media(max-width:900px){.hero.petit{min-height:150px}}

/* ==========================================================================
   6. Sections de page
   ========================================================================== */
main section{padding:clamp(44px,6vw,var(--e5)) 0}
.blanc{background:var(--blanc)}
.titre-page{text-align:center;font-size:clamp(1.9rem,3.8vw,2.8rem);margin:0 0 clamp(26px,3vw,var(--e4))}
.titre-page::after{content:"";display:block;width:64px;height:3px;background:var(--dore);border-radius:2px;margin:18px auto 0}
.tete{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--e3);flex-wrap:wrap;margin-bottom:26px}
.tete h2{margin:var(--e1) 0 0}
.tete .aparte{font-size:16px;color:var(--muted);max-width:34ch}
.grille{display:grid;gap:clamp(16px,2vw,20px)}
.g4{grid-template-columns:repeat(auto-fit,minmax(235px,1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));align-items:center;gap:clamp(26px,4vw,52px)}
.chapo{font-size:1.12rem;line-height:1.6;color:var(--nuit)}

/* ==========================================================================
   7. Corps de page : la feuille
   ========================================================================== */
.feuille{max-width:var(--lecture);margin:0 auto;background:var(--blanc);border-radius:var(--r);box-shadow:var(--shadow);padding:clamp(24px,4.5vw,var(--e5))}
.feuille>*:first-child{margin-top:0}
.feuille h2{margin:var(--e4) 0 var(--e2);scroll-margin-top:110px}
.feuille h3{margin:var(--e3) 0 var(--e1)}
.feuille p{margin:0 0 var(--e3)}
.feuille :where(ul,ol):not([class]){padding-left:22px;margin:0 0 var(--e3)}
.feuille li{margin-bottom:.4em}
.feuille img.visuel{width:auto;max-width:min(100%,560px);margin:var(--e4) auto;border-radius:var(--r);box-shadow:var(--shadow)}
.feuille .video,.feuille .carte-map{max-width:720px;margin:var(--e4) auto}
.contenu :where(p,li,dd,h2,h3) a:where(:not(.btn)){color:var(--corail);text-decoration:underline;text-underline-offset:3px}
@media(max-width:600px){.feuille{border-radius:14px;padding:22px 18px}.feuille p{margin-bottom:var(--e2)}.feuille h2{margin-top:var(--e3)}}

/* ==========================================================================
   8. Formats d'image — les trois seuls autorisés
   ========================================================================== */
.img-16-9{aspect-ratio:16/9}
.img-1-1{aspect-ratio:1/1}
.img-4-5{aspect-ratio:4/5}
.img-16-9,.img-1-1,.img-4-5{width:100%;height:auto;object-fit:cover;display:block;border-radius:var(--r)}
.img-1-1.logo{object-fit:contain;background:#fff;padding:10px;border:1px solid var(--line)}

/* ==========================================================================
   9. Composants
   ========================================================================== */
/* ---------- Carte simple (accueil) ---------- */
.carte{padding:clamp(20px,2.4vw,28px)}
a.carte{display:block;text-decoration:none;color:inherit;transition:transform .25s,box-shadow .25s}
a.carte:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.carte h3{margin-bottom:10px}
.carte p{color:var(--texte-doux);font-size:15px;line-height:1.6;margin:0 0 14px}
.carte .suite{font-weight:800;font-size:15px;color:var(--corail)}
.bord-corail{border-top:5px solid var(--corail)}
.bord-dore{border-top:5px solid var(--dore)}
.bord-rose{border-top:5px solid var(--rose)}
.bord-bleu{border-top:5px solid var(--bleu-clair)}

/* ---------- Carte à image (carrefours) ---------- */
.carte-res{display:flex;flex-direction:column;background:var(--blanc);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;color:var(--nuit);text-decoration:none}
a.carte-res{transition:transform .25s,box-shadow .25s}
a.carte-res:hover,a.carte-res:focus-visible{transform:translateY(-4px);box-shadow:0 18px 40px rgba(31,59,99,.14);color:var(--nuit)}
.carte-res>img{width:100%;aspect-ratio:16/9;object-fit:cover}
.carte-res-corps{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.carte-res h3{margin:0 0 .5em;font-size:1.25rem}
.carte-res p{margin:0 0 .8em;color:#3d4f66}
.carte-res ul{margin:0 0 1em;padding-left:18px;font-size:.93rem}
.carte-res li{margin-bottom:.3em}
.carte-res li::marker{color:var(--dore)}
.carte-res .logos{display:flex;gap:10px;margin-bottom:14px}
.carte-res .logos img{width:25%;aspect-ratio:1;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px}
.lien-suite{margin-top:auto;font-weight:800;color:var(--corail)}
.pastille{align-self:flex-start;background:rgba(242,184,76,.3);color:#5b4413;font-weight:800;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:12px}
.pastille-bientot{background:rgba(232,130,94,.18);color:#9a4527}

/* ---------- Grilles de carrefour ---------- */
.hub{max-width:var(--lecture);margin:0 auto}
.hub-chapo{text-align:center;max-width:1000px;margin:0 auto clamp(30px,4vw,48px);font-size:1.12rem;line-height:1.6;color:var(--nuit)}
.hub-kicker{margin:0 0 var(--e2)}
.hub-vedette,.hub-grille{display:grid;gap:var(--e3)}
.hub-vedette{grid-template-columns:repeat(2,1fr);margin-bottom:clamp(40px,5vw,60px)}
.hub-vedette .carte-res>img{aspect-ratio:2/1}
.hub-vedette .carte-res h3{font-size:1.5rem}
.hub-grille{grid-template-columns:repeat(3,1fr)}
@media(max-width:1024px){.hub-grille{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.hub-vedette,.hub-grille{grid-template-columns:1fr}}

/* ---------- Encarts ---------- */
.encart{background:var(--blanc);border-radius:var(--r);box-shadow:var(--shadow);padding:var(--e3)}
.encart-nuit,.siege{background:var(--nuit);color:#fff}
.encart-nuit :is(h2,h3,p),.siege :is(h2,h3,p){color:#fff}
.encart-nuit a:not(.btn),.siege a:not(.btn){color:var(--dore)}
.encart-urgence{margin-top:26px;background:rgba(9,20,40,.55);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-sm);padding:var(--e2) 20px;font-size:14px;line-height:1.6}
.contact-urgence{max-width:900px;margin:var(--e4) auto 0;text-align:center;background:var(--nuit);color:#fff;border:0;font-size:15px}

/* ---------- Citation (témoignages) ---------- */
.citation{font-family:var(--ff-display);font-size:clamp(1.15rem,1.9vw,1.5rem);line-height:1.5;color:var(--nuit);margin:0 0 18px}
.source{font-size:15px;color:var(--muted);margin-bottom:22px}

/* ---------- Listes à puces de couleur ---------- */
.puces{display:grid;grid-template-columns:1fr 1fr;gap:14px var(--e3);margin:0 0 26px;padding:0;list-style:none;font-weight:700;color:var(--nuit);font-size:16px}
.puces li{display:flex;gap:10px;align-items:center;margin:0}
.puces li::before{content:"";width:8px;height:8px;border-radius:99px;background:var(--corail);flex:none}
.puces li:nth-child(4n+2)::before{background:var(--dore)}
.puces li:nth-child(4n+3)::before{background:var(--rose)}
.puces li:nth-child(4n+4)::before{background:var(--bleu-clair)}
@media(max-width:520px){.puces{grid-template-columns:1fr}}

/* ---------- Tags (définis dans per.css) : placement ---------- */
.tag{margin-bottom:var(--e2)}

/* ---------- Boutons complémentaires ---------- */
.btn-clair{background:transparent;color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}
.btn-clair:hover{background:#fff;color:var(--nuit)}
.btn-contour{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.85);box-shadow:none}
.btn-contour:hover,.btn-contour:focus-visible{background:#fff;color:var(--nuit);border-color:#fff}
.lien-fleche{font-weight:800;color:var(--corail);text-decoration:none}

/* ---------- Médias ---------- */
.video{position:relative;padding-top:56.25%;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-lg)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-verticale{padding-top:0;aspect-ratio:9/16;width:min(100%,340px);margin-inline:auto}
.affiche{width:100%;height:auto}
/* Vignette cliquable : le lecteur YouTube ne se charge qu'au clic */
.video-facade{width:min(100%,320px);margin:var(--e3) 0}
.video-facade.paysage{width:100%;margin:0}
.video-facade.paysage .cadre-video{aspect-ratio:16/9}
.video-facade .cadre-video{position:relative;aspect-ratio:9/16;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-lg);background:var(--nuit)}
.video-facade button{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer;display:block}
.video-facade img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.video-facade button:hover img,.video-facade button:focus-visible img{transform:scale(1.04)}
.video-facade .lire{position:absolute;inset:0;display:grid;place-items:center}
.video-facade .lire::before{content:"";width:62px;height:62px;border-radius:50%;background:rgba(9,20,40,.62);border:2px solid rgba(255,255,255,.9);backdrop-filter:blur(2px);transition:background .25s}
.video-facade .lire::after{content:"";position:absolute;width:0;height:0;border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:6px}
.video-facade button:hover .lire::before,.video-facade button:focus-visible .lire::before{background:var(--corail)}
.video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-facade figcaption{margin-top:var(--e1);font-size:.95rem;line-height:1.5;color:var(--texte-doux)}
.video-facade figcaption b{display:block;color:var(--nuit)}
.videos-strip{display:flex;flex-wrap:wrap;gap:var(--e3)}
/* Invitation discrete a partager son experience, sous l'appel principal */
.invite-partage{max-width:var(--lecture);margin:var(--e3) auto 0;display:flex;flex-wrap:wrap;gap:var(--e2);align-items:center;justify-content:center;text-align:center;color:var(--texte-doux)}
.carte-map{display:block;width:100%;min-height:280px;border:0;border-radius:var(--r);box-shadow:var(--shadow);margin:18px 0}

/* ---------- Don : jauge et « où va votre don » ---------- */
.jauge{height:14px;border-radius:10px;background:#EFE7D8;overflow:hidden;max-width:520px}
.jauge span{display:block;height:100%;background:var(--corail);border-radius:10px}
.jauge-txt{font-size:14px;color:var(--muted);margin:10px 0 22px}
.dons{margin:0 0 22px;display:grid;gap:12px}
.dons>div{display:flex;gap:var(--e2);align-items:flex-start}
.dons dt{font-weight:800;color:var(--corail);min-width:78px;flex:none}
.dons dd{margin:0;color:var(--texte-doux);font-size:16px;line-height:1.55}
@media(max-width:600px){.don .btn{width:100%;justify-content:center;min-height:48px}}

/* ---------- Valeurs en vignettes rondes ---------- */
.valeurs{text-align:center}
.valeurs img{width:clamp(120px,13vw,170px);aspect-ratio:1;object-fit:cover;border-radius:50%;margin:0 auto 14px;box-shadow:var(--shadow)}
.valeurs p{font-weight:700;color:var(--nuit);margin:0}

/* ==========================================================================
   10. Blocs propres à l'accueil
   ========================================================================== */
/* ---------- Bandeau agenda ---------- */
.agenda{background:var(--nuit);color:#fff;padding:26px 0}
.agenda .conteneur{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:center}
.agenda .bloc{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.agenda .date{font-family:var(--ff-event);font-size:clamp(1.3rem,2.4vw,1.9rem);font-weight:700;text-transform:uppercase;margin:6px 0 0;line-height:1.2}
.agenda .lieu{font-size:16px;line-height:1.55;color:#d7e4f5;max-width:38ch;margin:0}
.agenda .boutons{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
@media(max-width:860px){.agenda .conteneur{grid-template-columns:1fr}.agenda .boutons{justify-content:flex-start}.agenda .btn{flex:1 1 auto;justify-content:center}}
@media(max-width:600px){.agenda .boutons .btn{width:100%;min-height:48px}}

/* ---------- Actualité ---------- */
.actu{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(20px,3vw,var(--e4));align-items:start}
.actu img{border-radius:var(--r);box-shadow:var(--shadow)}
.actu .texte>h3{margin-top:26px}
.actu .texte>h3:first-child{margin-top:0}
.liste{margin:0 0 var(--e2);padding-left:22px}
@media(max-width:820px){.actu{grid-template-columns:1fr}}

/* ==========================================================================
   11. Gabarits (docs/refonte-gabarits.md, partie 2)
   ========================================================================== */
/* ---------- Commun : sommaire, sections repliables, listes, figures ---------- */
.sommaire{background:var(--blanc);border-radius:var(--r);box-shadow:var(--shadow);padding:var(--e3)}
.sommaire summary{font-family:var(--ff-display);font-weight:700;font-size:1.1rem;color:var(--nuit);cursor:pointer;list-style:none}
.sommaire summary::-webkit-details-marker{display:none}
.sommaire summary::after{content:"▾";margin-left:var(--e1);color:var(--corail)}
.sommaire[open] summary::after{content:"▴"}
.sommaire ol{list-style:none;margin:var(--e2) 0 0;padding:0;counter-reset:s}
.sommaire li{counter-increment:s;border-top:1px solid var(--line)}
.sommaire li:first-child{border-top:0}
.sommaire a{display:flex;gap:10px;padding:var(--e1) 0;color:var(--nuit);text-decoration:none;font-size:.92rem;line-height:1.35}
.sommaire a::before{content:counter(s);color:var(--corail);font-weight:800;min-width:1.2em}
.sommaire a:hover{color:var(--corail)}
@media(min-width:901px){.sommaire{position:sticky;top:110px}.sommaire summary{cursor:default;pointer-events:none}.sommaire summary::after,.sommaire[open] summary::after{content:none}}

.repli{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--creme);margin:0 0 var(--e3)}
.repli summary{display:flex;justify-content:space-between;align-items:center;gap:var(--e2);padding:var(--e2) var(--e3);font-family:var(--ff-display);font-weight:700;font-size:1.15rem;color:var(--nuit);cursor:pointer;list-style:none}
.repli summary::-webkit-details-marker{display:none}
.repli summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;background:var(--blanc);color:var(--corail);display:grid;place-items:center;font-family:var(--ff-body);font-weight:800}
.repli[open] summary::after{content:"−"}
.repli summary:focus-visible{outline:2px solid var(--corail);outline-offset:2px;border-radius:var(--r-sm)}
.repli>:not(summary){margin-inline:var(--e3)}
.repli>:last-child{margin-bottom:var(--e3)}

.liste-etoile,.liste-valeurs,.liste-points{list-style:none;padding:0;margin:0 0 var(--e3)}
.liste-etoile li,.liste-points li{position:relative;padding-left:1.7em;margin:0 0 var(--e1)}
.liste-etoile li::before{content:"★";position:absolute;left:0;top:0;color:var(--dore)}
.liste-points li::before{content:"";position:absolute;left:.3em;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--corail)}
.liste-valeurs li{margin:0 0 var(--e2);padding:var(--e2) var(--e3);background:var(--creme);border-left:4px solid var(--dore);border-radius:0 var(--r-sm) var(--r-sm) 0}
.figure{margin:var(--e4) 0}
.figure img{box-shadow:var(--shadow)}
.figure.moyenne{max-width:420px;margin-inline:auto}
.note{background:var(--creme);border-radius:var(--r-sm);padding:var(--e2) var(--e3);font-weight:700;color:var(--nuit)}

/* ---------- G2 Carrefour : cartes strictement identiques, par 3 ---------- */
.carrefour .hub-grille{margin-bottom:clamp(40px,5vw,60px)}
/* 4 cartes : 2x2 plutot qu'une 4e orpheline sous une rangee de 3 */
/* Grilles de 4 ou 8 cartes : rangees pleines de 4 en grand ecran, 2 par rangee ensuite.
   Les autres comptes (3, 5, 6, 7) gardent les 3 colonnes de base. */
@media(min-width:1200px){
  .carrefour .hub-grille:has(>:nth-child(4)):not(:has(>:nth-child(5))),
  .carrefour .hub-grille:has(>:nth-child(8)):not(:has(>:nth-child(9))){grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:1025px) and (max-width:1199px){
  .carrefour .hub-grille:has(>:nth-child(4)):not(:has(>:nth-child(5))),
  .carrefour .hub-grille:has(>:nth-child(8)):not(:has(>:nth-child(9))){grid-template-columns:repeat(2,minmax(0,1fr))}
}
.carrefour .carte-res h2{font-size:1.3rem;margin:0 0 .5em}

/* ---------- G3 Article : sommaire collant + colonne de lecture ---------- */
.page-article{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--e4);max-width:1280px;margin:0 auto;align-items:start}
.page-article .feuille{max-width:none;margin:0}
@media(max-width:900px){.page-article{grid-template-columns:minmax(0,1fr);gap:var(--e3)}}

/* ---------- G4 Action : encart pratique en tête + colonne latérale ---------- */
.encart-pratique{max-width:var(--lecture);margin:0 auto var(--e4);background:var(--nuit);color:#fff;border-radius:var(--r);padding:var(--e3) var(--e4);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--e3);align-items:center}
.encart-pratique .date{font-family:var(--ff-event);font-size:clamp(1.3rem,2.4vw,1.8rem);font-weight:700;text-transform:uppercase;line-height:1.2;margin:6px 0 var(--e1)}
.encart-pratique .lieu{color:var(--sur-nuit);margin:0}
.encart-pratique .boutons{display:flex;gap:12px;flex-wrap:wrap;max-width:440px;justify-content:flex-end}
.encart-pratique .boutons .btn{white-space:normal;text-align:center;justify-content:center}
.page-action{display:grid;grid-template-columns:minmax(0,800px) 300px;justify-content:center;gap:var(--e4);max-width:var(--lecture);margin:0 auto;align-items:start}
.page-action .feuille{max-width:none;margin:0}
.page-action.une-colonne{grid-template-columns:minmax(0,1fr)}
.encart-pratique.avec-affiche{grid-template-columns:auto minmax(0,1fr) auto}
.affiche-mini{display:block;width:120px;border-radius:12px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.35);transition:transform .25s}
.affiche-mini:hover{transform:scale(1.04)}
.affiche-mini img{width:100%;aspect-ratio:4/5;object-fit:cover}
.lateral{position:sticky;top:110px;display:flex;flex-direction:column;gap:var(--e3)}
.lateral .encart p{font-size:.95rem}
.lateral .btn{display:flex;justify-content:center}
.rappel-action{max-width:var(--lecture);margin:var(--e4) auto 0;text-align:center}
.rappel-action>*{max-width:68ch;margin-inline:auto}
@media(max-width:900px){
  .encart-pratique,.encart-pratique.avec-affiche{grid-template-columns:minmax(0,1fr);padding:var(--e3)}
  .page-action{grid-template-columns:minmax(0,1fr);gap:var(--e3)}
  .lateral{position:static}
}

.intro-illustree{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--e4);align-items:center;margin-bottom:var(--e4)}
.intro-illustree h2{margin-top:0}
.intro-illustree>img{box-shadow:var(--shadow)}
.jumelles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e3);margin:var(--e3) 0 var(--e4)}
.jumelles .carte-res{border:1px solid var(--line)}
.img-16-9.haut{object-position:50% 0}
.groupe-titre{display:flex;align-items:center;gap:12px;margin-bottom:var(--e1)}
.groupe-titre img{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:none}
.groupe-titre h3{margin:0}
.feuille .kicker{display:block;margin:var(--e4) 0 var(--e1)}
.feuille .kicker+h2{margin-top:0}
@media(max-width:900px){.intro-illustree,.jumelles{grid-template-columns:minmax(0,1fr)}}

/* ---------- G5 Liste : entrées de même anatomie ---------- */
.liste-ref{max-width:var(--lecture);margin:0 auto;display:grid;gap:var(--e3)}
.temoignage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--e4);align-items:start}
.temoignage>img{position:sticky;top:110px}
.temoignage h2{margin-top:0}
.temoignage .corps>p{max-width:68ch}
@media(max-width:900px){.temoignage{grid-template-columns:1fr;gap:var(--e3)}.temoignage>img{position:static}}

/* Lignes de référence : média à gauche, texte à droite */
.ressource,.asso{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--e4);align-items:start;padding:var(--e4) 0;border-top:1px solid var(--line)}
.ressource.sans-media{grid-template-columns:minmax(0,1fr)}
.ressource .video{margin:0}
.ressource h2,.ressource h3,.asso h3{margin-top:0}
.ressource img{box-shadow:var(--shadow)}
.media-ressource{margin:0}
.media-ressource figcaption{margin-top:var(--e1);font-size:.9rem;color:var(--texte-doux)}
.asso{grid-template-columns:140px minmax(0,1fr);gap:var(--e3);padding:var(--e3) 0}
.asso img.logo{max-width:140px}
.liens-asso{display:flex;flex-wrap:wrap;gap:var(--e1) var(--e3);margin:0}
.lien-externe::after{content:" ↗";font-size:.85em}
/* Entree identifiee par l'embleme de l'emetteur, pas par une capture d'ecran */
.ressource.logo-ref{grid-template-columns:150px minmax(0,1fr);gap:var(--e3)}
.logo-source{width:100%;height:auto;display:block;object-fit:contain;background:#fff;padding:12px;border:1px solid var(--line);border-radius:var(--r);box-shadow:none}
.feuille h2+.ressource,.feuille h2+.asso,.feuille .chapo+.ressource{border-top:0;padding-top:var(--e2)}
@media(max-width:700px){
  .ressource,.asso{grid-template-columns:minmax(0,1fr);gap:var(--e2)}
  /* Sur telephone le logo n'est plus qu'une vignette de reperage : il situe
     la source en tete d'entree sans manger une pleine largeur d'ecran. */
  .ressource.logo-ref{grid-template-columns:minmax(0,1fr)}
  .asso>img.logo{max-width:82px}
  .logo-source{max-width:130px;padding:8px}
}

/* ---------- Formulaire (partage d'experience) ---------- */
.formulaire{margin:var(--e4) 0}
.formulaire .champ{display:flex;flex-direction:column;gap:8px;margin:0 0 var(--e3)}
.formulaire label{font-weight:700;color:var(--nuit)}
.formulaire .oblig{color:var(--corail)}
.formulaire :is(input[type=text],input[type=email],textarea,select){font:inherit;color:var(--nuit);background:#fff;padding:12px 14px;border:2px solid var(--bleu-clair);border-radius:10px;width:100%;max-width:100%}
.formulaire :is(input,textarea,select):focus{outline:none;border-color:var(--dore)}
.formulaire textarea{resize:vertical;min-height:140px;line-height:1.6}
.formulaire .aide{font-size:.9rem;color:var(--texte-doux)}
.formulaire .champ-case label{display:flex;gap:12px;align-items:flex-start;font-weight:400}
.formulaire .champ-case input{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--nuit)}
.formulaire .cache{position:absolute;left:-9999px}

/* Fil d'actualité */
.actu-entree{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--e4);align-items:start}
.actu-affiche{display:flex;flex-direction:column;gap:var(--e2)}
.actu-affiche img{box-shadow:var(--shadow);border-radius:var(--r)}
.actu-entree .corps>h2{margin-top:0}
.actu-date{font-family:var(--ff-event);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--corail);margin:0 0 var(--e1)}
.actu-entree .tag{margin-bottom:var(--e2)}
@media(max-width:800px){.actu-entree{grid-template-columns:minmax(0,1fr);gap:var(--e3)}.actu-affiche{max-width:420px}}

/* Texte justifié (pages légales) : césure pour éviter les grands blancs */
.texte-justifie p,.texte-justifie li{text-align:justify;hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}

/* Missions bénévoles */
.missions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:var(--e3);margin:var(--e3) 0 var(--e4)}
.mission{display:flex;flex-direction:column;background:var(--creme);border-radius:var(--r);border-top:5px solid var(--dore);padding:var(--e3)}
.missions:has(.mission:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
.mission:nth-child(2){border-top-color:var(--corail)}
.mission:nth-child(3){border-top-color:var(--bleu-clair)}
.mission h3{margin:0 0 var(--e1)}
.mission p{margin-bottom:var(--e1)}
.mission-sous-titre{font-weight:700;color:var(--nuit)}
.mission .liste-points{margin-bottom:var(--e2)}
.mission-statut{font-size:.9rem;color:var(--muted);margin-top:auto}
.mission .btn{align-self:flex-start;margin-top:var(--e1)}
.missions-suite{text-align:center;max-width:720px;margin:0 auto}
@media(max-width:1000px){.missions{grid-template-columns:minmax(0,1fr)}}

/* Encart d'appel à bénévolat (fond rose de la charte) */
.encart-appel{background:rgba(223,169,163,.28);border-radius:var(--r);padding:var(--e4);margin:0 0 var(--e4)}
.encart-appel h2{margin-top:0}
.encart-appel p:last-child{margin-bottom:0}
@media(max-width:600px){.encart-appel{padding:var(--e3) var(--e2)}}

/* Retour de l'association (actualité) */
.retour-per{margin:var(--e4) 0 var(--e3);padding:var(--e4) var(--e4) var(--e3);background:var(--creme);border-left:4px solid var(--dore);border-radius:0 var(--r) var(--r) 0;position:relative}
.retour-per::before{content:"“";position:absolute;top:-6px;left:22px;font-family:var(--ff-display);font-size:5rem;line-height:1;color:var(--dore);opacity:.5}
.retour-per figcaption{margin:0 0 var(--e2);font-weight:700;color:var(--nuit)}
.retour-per figcaption .lbl{display:block;color:var(--corail);margin-bottom:4px}
.retour-per blockquote{margin:0}
.retour-per blockquote p:last-child{margin-bottom:0}
@media(max-width:600px){.retour-per{padding:var(--e3) var(--e2) var(--e2)}}

/* Divers gabarits */
.personnes{list-style:none;margin:0;padding:0}
.personne h3{margin:0 0 .3em}
.identite{font-size:.92rem;color:var(--muted)}
.liste-ordre{padding-left:1.4em;margin:0 0 var(--e3)}
.liste-ordre li{margin-bottom:var(--e1)}
.liste-ordre li::marker{color:var(--corail);font-weight:800}
.encart-don h2{color:#fff;margin-bottom:var(--e2)}
.encart-don .jauge{background:rgba(255,255,255,.18)}
.encart-don .jauge-txt{color:var(--sur-nuit)}
.encart-don .dons dd{color:var(--sur-nuit)}
.encart-don .dons dt{color:var(--dore)}
.encart-pratique h2{color:#fff;margin:0 0 var(--e1)}
.appel-large{max-width:var(--lecture);margin:var(--e4) auto 0;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
.appel-large>img{height:100%;aspect-ratio:auto;min-height:260px}
.rappel-psy{margin-top:var(--e4)}
@media(max-width:900px){.appel-large{grid-template-columns:minmax(0,1fr)}.appel-large>img{aspect-ratio:21/9;min-height:0}}

/* ---------- G6 Simple : colonne étroite ---------- */
.page-simple{max-width:820px;margin:0 auto;display:grid;gap:var(--e3)}
.page-simple .feuille{max-width:none;margin:0}
.encart-nuit .btn{margin-top:var(--e1)}

/* ---------- Bouton « Haut de page » ---------- */
.haut-de-page{position:fixed;right:18px;bottom:18px;z-index:40;width:48px;height:48px;border-radius:50%;background:var(--nuit);color:#fff;display:grid;place-items:center;font-size:1.3rem;font-weight:800;text-decoration:none;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.haut-de-page.visible{opacity:1;visibility:visible}
.haut-de-page:hover{background:var(--corail);color:#fff}

/* ---------- Petits éléments des gabarits ---------- */
.kicker-dore{color:var(--dore)}
.lien-affiche{margin:var(--e1) 0 0;font-size:.9rem;text-align:center}
.lien-affiche a{color:var(--corail);font-weight:700}
.affiche-recadree{object-position:50% 0}
.rappel-action.encart{padding:var(--e4) var(--e3)}
.temoignage .tag{margin-bottom:var(--e2)}
.liste-valeurs strong{font-family:var(--ff-display);color:var(--nuit)}

/* ==========================================================================
   12. Pages sur mesure (en attente des gabarits G1-G6)
   ========================================================================== */
/* ---------- Notre équipe ---------- */
.equipe-duo{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;background:var(--blanc);border-radius:var(--r);box-shadow:var(--shadow);padding:clamp(20px,3vw,36px);margin-bottom:28px}
.equipe-duo>img{width:100%;border-radius:calc(var(--r) - 6px);aspect-ratio:4/3;object-fit:cover}
.personne h2{margin:0 0 .3em}
.personne p{margin:0}
.personne+.personne{margin-top:26px;padding-top:26px;border-top:1px solid var(--line)}
.equipe-bas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e3);align-items:start}
.equipe-bas h2{font-size:1.35rem;margin:0 0 .8em}
.appel>img{aspect-ratio:21/9}
.page-action+.appel,.appel+.rappel-action{margin-top:var(--e4)}
.page-action+.appel{max-width:var(--lecture);margin-inline:auto;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
.page-action+.appel>img{height:100%;aspect-ratio:auto;min-height:260px}
@media(max-width:900px){.page-action+.appel{grid-template-columns:minmax(0,1fr)}.page-action+.appel>img{aspect-ratio:21/9;min-height:0}}
.appel h3{margin:1em 0 .4em;font-size:1.2rem}
.boutons-appel{display:flex;gap:12px;flex-wrap:wrap;margin-top:var(--e1)}
@media(max-width:900px){.equipe-duo,.equipe-bas{grid-template-columns:1fr}}

/* ---------- Contact ---------- */
.contact-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e3);align-items:stretch}
.contact-grille h2{font-size:1.3rem;margin:0 0 .7em}
.contact-grille :is(h2+h2,a+h2){margin-top:1.2em}
.vignette-contact{display:flex;align-items:center;gap:12px;padding:10px 12px;margin-top:10px;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--nuit);font-weight:700;transition:background .2s}
.vignette-contact:hover{background:var(--creme);color:var(--nuit)}
.vignette-contact img{width:44px;height:44px;border-radius:50%;object-fit:cover}
@media(max-width:900px){.contact-grille{grid-template-columns:1fr}}

/* ==========================================================================
   13. Pied de page photo
   ========================================================================== */
.pied{position:relative;isolation:isolate;overflow:hidden;padding:clamp(40px,5vw,52px) 0 26px;color:#eaf1fa;text-shadow:0 1px 6px rgba(4,12,28,.85)}
.pied>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;z-index:-2}
.pied::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,18,38,.56),rgba(10,22,44,.72));z-index:-1}
.pied .colonnes{display:grid;grid-template-columns:1.15fr .7fr 1.25fr .9fr;gap:clamp(20px,3vw,32px)}
.pied a{color:#eaf1fa;text-decoration:none}
.pied a:hover{color:var(--dore)}
.pied .marque img{height:56px;width:56px;flex:0 0 56px;object-fit:contain;padding:8px;border-radius:50%;background:var(--creme)}
.pied .marque>span{min-width:0}
.pied .nom{display:block;font-family:var(--ff-display);font-size:1.25rem;font-weight:800;color:#fff;line-height:1.1}
.pied .slogan{display:block;font-family:var(--ff-script);font-size:1.15rem;color:var(--dore);line-height:1.2;margin-top:2px;white-space:nowrap}
.pied .liens{display:flex;flex-direction:column;gap:10px;font-size:15px}
.vignette,.reseau{display:flex;gap:12px;align-items:center;background:rgba(9,20,40,.55);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:10px 14px;transition:transform .25s,border-color .25s}
.vignette:hover,.reseau:hover{transform:translateY(-2px);border-color:var(--dore)}
.vignette{gap:14px}
.vignette img{width:56px;height:56px;flex:0 0 56px;object-fit:cover;border-radius:10px;background:#fff}
.vignette strong{display:block;font-size:16px;color:#fff}
.vignette em{font-style:normal;color:var(--dore)}
.reseau{font-weight:700;color:#fff}
.reseau img{width:38px;height:38px;flex:0 0 38px;object-fit:contain;border-radius:8px}
.pied-bas{margin-top:20px;border-top:1px solid rgba(255,255,255,.18);padding-top:var(--e2);display:flex;flex-wrap:wrap;gap:12px var(--e3);justify-content:space-between;font-size:13px;color:#cfe0f5}
@media(max-width:960px){.pied .colonnes{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.pied .colonnes{grid-template-columns:1fr}}
@media(max-width:420px){.pied .nom{font-size:1.05rem}.pied .marque img{height:46px;width:46px;flex:0 0 46px}}

/* ==========================================================================
   14. Recherche
   ========================================================================== */
.recherche{display:none;position:fixed;inset:0;background:rgba(21,43,73,.6);z-index:60;padding:clamp(60px,12vh,120px) 16px}
.recherche.ouverte{display:block}
.recherche-boite{max-width:640px;margin:0 auto;background:#fff;border-radius:var(--r-sm);padding:var(--e2);display:grid;grid-template-columns:1fr auto;gap:10px;box-shadow:0 20px 50px rgba(0,0,0,.35)}
.recherche-boite input{font:inherit;padding:14px 16px;border:2px solid var(--bleu-clair);border-radius:10px;width:100%}
.recherche-boite input:focus{outline:none;border-color:var(--dore)}
.recherche-boite .fermer{background:none;border:0;font-size:1.3rem;cursor:pointer;color:var(--nuit)}
.recherche-boite ul{grid-column:1/-1;list-style:none;margin:0;padding:0;max-height:55vh;overflow:auto}
.recherche-boite li a{display:block;padding:12px;border-radius:10px;text-decoration:none;color:var(--nuit)}
.recherche-boite li a:hover{background:var(--creme)}
.recherche-boite li span{display:block;font-size:.88rem;color:var(--muted)}
.recherche-boite li.vide{padding:12px;color:var(--muted)}

/* ---------- Accompagner le deuil : trois espaces de ressources ---------- */
.espaces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e2);margin:var(--e3) 0 var(--e2)}
.espaces a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:var(--e3) var(--e2);background:var(--creme);border-radius:var(--r);color:var(--nuit);text-decoration:none;font-family:var(--ff-display);font-size:1.15rem;transition:transform .25s,box-shadow .25s}
.espaces a:hover,.espaces a:focus-visible{transform:translateY(-3px);box-shadow:var(--shadow);color:var(--nuit)}
.espace-ico{font-size:1.6rem;line-height:1;color:var(--corail)}
.feuille h3.groupe{margin:var(--e3) 0 var(--e1);color:var(--corail);font-size:1.15rem;scroll-margin-top:110px}
.feuille h3.groupe+.ressource{border-top:0;padding-top:var(--e2)}
.ressource h4{font-size:clamp(1.15rem,1.7vw,1.5rem);margin-top:0;scroll-margin-top:110px}
@media(max-width:600px){.espaces{gap:6px}.espaces a{padding:var(--e2) 4px;font-size:.9rem}}

/* ---------- Page événement : Sommet Traverser le deuil ---------- */
.jours ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:var(--e3) 0 0;padding:0}
.jours a{display:inline-block;padding:6px 14px;border-radius:999px;background:var(--creme);color:var(--nuit);text-decoration:none;font-weight:700;font-size:.92rem}
.jours a:hover,.jours a:focus-visible{background:var(--dore)}
.chapo-jour{color:var(--texte-doux);font-style:italic}
.intervenants{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:var(--e2);margin:var(--e2) 0 var(--e3)}
.intervenant{background:#E6EEF7;border-radius:var(--r);padding:var(--e3);scroll-margin-top:110px}
.intervenant:nth-child(even){background:#F6E3DF}
.feuille .intervenant h3{margin:0 0 4px}
.intervenant .role{font-size:.92rem;color:var(--texte-doux);margin-bottom:var(--e1)}
.intervenant .sujet{font-family:var(--ff-display);font-weight:700;color:var(--corail)}
.intervenant p:last-child{margin-bottom:0}
.note-orientation{font-size:.92rem;border-left:3px solid var(--dore);padding-left:12px}