/* Apprendre Autrement : direction artistique v3 « carnet d'auteur » (19/10/2026)
   Chargé après site.css (bloc blog d'origine intact). Remplace refonte.css.
   Références étudiées : adamgrant.net (nom centré, peu de mots, grandes images),
   estherperel.com (mot surligné, portrait réel), ottoscharmer.com (scène réelle).
   Contrainte : noir, blanc papier, UN accent = le jaune surligneur des murs de post-it de Denis.
   Pas de cartes uniformes, pas d'icônes, pas de dégradés, pas de capitales espacées. */
:root {
    --encre: #141414;
    --gris: #66645f;
    --filet: #dcd8ce;
    --fond: #fbfaf6;
    --papier: #f1eee6;
    --surligneur: #f3dc4a;
    --vert: #141414;
    --vert-fonce: #000;
    --serif: "Inter", system-ui, sans-serif;
    --sans: "Inter", system-ui, sans-serif;
    --t-0: clamp(1.05rem, 1rem + .2vw, 1.15rem);
    --t-1: clamp(1.3rem, 1.15rem + .6vw, 1.65rem);
    --t-2: clamp(1.75rem, 1.4rem + 1.4vw, 2.6rem);
    --t-3: clamp(2.3rem, 1.6rem + 2.8vw, 4rem);
    --t-4: clamp(2.8rem, 1.6rem + 5vw, 6.2rem);
    --t-5: clamp(3.2rem, 1.4rem + 7.6vw, 8.8rem);
    --e-1: clamp(1rem, .8rem + .8vw, 1.6rem);
    --e-2: clamp(2.2rem, 1.6rem + 2.6vw, 4rem);
    --e-3: clamp(4rem, 2.6rem + 6vw, 9rem);
    --marge: minmax(0, 3fr);
    --ease: cubic-bezier(.2, .7, .2, 1);
}
body { background: var(--fond); color: var(--encre); font: 400 var(--t-0)/1.62 var(--sans); }
h1, h2, h3 { font-family: var(--serif); font-weight: 500; letter-spacing: -0.015em; }
h4, h5, h6 { font-family: var(--sans); font-weight: 600; letter-spacing: 0; text-transform: none; }
a { color: var(--encre); text-decoration-color: rgba(20, 20, 20, .35); }
a:hover { color: var(--encre); text-decoration-color: var(--encre); }
::selection { background: var(--surligneur); }
:focus-visible { outline: 2px solid var(--encre); }
em { font-style: italic; }

/* Le procédé maison : le surligneur */
mark, .surligne { background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); color: inherit; padding: 0 .06em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* Apparition au scroll */
.js [data-reveal], .js .blog-carte { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.js [data-reveal].vu, .js .blog-carte.vu { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js [data-reveal], .js .blog-carte { opacity: 1; transform: none; transition: none; } }

/* Boutons et liens */
.bouton { background: var(--encre); border: 1px solid var(--encre); color: #fff; border-radius: 0; font: 600 1rem/1.2 var(--sans); padding: .95em 1.6em; transition: background-color .2s, color .2s; }
.bouton:hover { background: #fff; color: var(--encre); border-color: var(--encre); transform: none; box-shadow: none; }
.bouton-second { background: transparent; color: var(--encre); }
.bouton-second:hover { background: var(--encre); color: #fff; }
.bouton-clair { background: #fff; color: var(--encre); border-color: #fff; }
.lien-fleche { font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--encre); padding-bottom: 2px; }
.lien-fleche::after { content: " →"; display: inline-block; transition: transform .25s var(--ease); }
.lien-fleche:hover::after { transform: translateX(4px); }
.enveloppe { width: min(100% - 32px, 1280px); }

/* En-tête : nom centré, rubriques de part et d'autre (desktop) */
.entete { background: rgba(251, 250, 246, .94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--encre); }
.entete-ligne { min-height: 76px; }
.logo { font: 500 1.7rem/1 var(--serif); letter-spacing: -0.02em; white-space: nowrap; }
.logo em { color: var(--encre); font-style: italic; }
.nav > ul > li > a:not(.bouton) { font: 500 1rem/1 var(--sans); padding: 12px 10px; }
.nav > ul > li > a[aria-current]:not(.bouton) { color: var(--encre); box-shadow: none; }
.nav > ul > li > a[aria-current]:not(.bouton) span, .nav > ul > li > a:not(.bouton):hover span { background: linear-gradient(transparent 55%, var(--surligneur) 55%, var(--surligneur) 95%, transparent 95%); }
.nav-cta .bouton { padding: .65em 1.1em; }
@media (min-width: 1100px) {
    .entete-ligne { display: grid; grid-template-columns: 1fr auto 1fr; }
    .logo { grid-column: 2; grid-row: 1; text-align: center; font-size: 1.9rem; }
    .nav { grid-column: 1 / -1; grid-row: 1; }
    .nav > ul { display: grid; grid-template-columns: repeat(3, auto) 1fr repeat(3, auto) auto; align-items: center; }
    .nav > ul > li:nth-child(4) { grid-column: 5; }
    .nav > ul > li:nth-child(5) { grid-column: 6; }
    .nav > ul > li:nth-child(6) { grid-column: 7; }
    .nav > ul > li.nav-cta { grid-column: 8; margin-left: 10px; }
    .burger { display: none; }
}
@media (max-width: 1099px) {
    .burger { display: block; }
    .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--fond); border-bottom: 1px solid var(--encre); max-height: calc(100vh - 76px); overflow-y: auto; }
    .menu-ouvert .nav { display: block; }
    .nav > ul { flex-direction: column; align-items: stretch; gap: 0; padding: 8px 16px 24px; }
    .nav > ul > li > a:not(.bouton) { font: 500 1.9rem/1.1 var(--serif); padding: 16px 0; border-bottom: 1px solid var(--filet); }
    .nav-cta { margin: 20px 0 0; }
    .nav-cta .bouton { display: block; text-align: center; padding: 1em; }
}
.sous-menu { display: none !important; }

/* Grille éditoriale : une marge de notes à gauche */
.sec { width: min(100% - 32px, 1280px); margin: 0 auto; padding-block: var(--e-3) 0; display: grid; gap: 14px 48px; }
.sec-marge { font: italic 400 1.15rem/1.35 var(--serif); color: var(--gris); padding-top: .5em; border-top: 1px solid var(--encre); align-self: start; }
.sec-marge small { display: block; font: 400 .9rem/1.4 var(--sans); font-style: normal; margin-top: .4em; }
.sec-corps > h2:first-child { margin-top: 0; }
.sec-corps h2 { font-size: var(--t-3); line-height: 1.04; letter-spacing: -0.025em; margin: 0 0 .5em; max-width: 18ch; }
.sec-corps h3 { font-size: var(--t-1); line-height: 1.2; margin: 1.6em 0 .4em; }
.sec-corps p, .sec-corps ul, .sec-corps ol { max-width: 64ch; }
.sec-corps ul, .sec-corps ol { padding-left: 1.1em; }
.sec-corps li { margin-bottom: .4em; }
@media (min-width: 900px) {
    .sec { grid-template-columns: var(--marge) minmax(0, 9fr); }
    .sec-plein { grid-template-columns: 1fr; }
}
.sec-plein .sec-corps h2 { max-width: 22ch; }

/* Ouverture de page */
.ouverture { width: min(100% - 32px, 1280px); margin: 0 auto; padding-top: clamp(2.5rem, 2rem + 4vw, 6.5rem); display: grid; gap: 28px 56px; }
.ouverture-fil { font: italic 400 1.1rem/1.3 var(--serif); color: var(--gris); margin: 0 0 1em; }
.ouverture-fil a { color: var(--gris); }
.ouverture h1 { font-size: var(--t-5); line-height: .95; letter-spacing: -0.04em; font-weight: 400; margin: 0; max-width: 12ch; }
.ouverture h1 em { font-style: italic; }
.ouverture .chapeau { font: 400 var(--t-1)/1.42 var(--serif); max-width: 34ch; margin: 0; }
.ouverture-photo { margin: 0; }
.ouverture-photo img { width: 100%; height: 100%; max-height: 640px; object-fit: cover; }
.ouverture-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.6em; }
@media (min-width: 960px) {
    .ouverture-duo { grid-template-columns: 7fr 5fr; align-items: end; }
    .ouverture-duo .ouverture-photo { grid-column: 2; grid-row: 1 / span 2; align-self: stretch; margin-right: calc(-1 * max(16px, (100vw - 1280px) / 2)); }
    .ouverture-duo .ouverture-photo img { max-height: 760px; min-height: 520px; }
}
figcaption { font: italic 400 .98rem/1.4 var(--serif); color: var(--gris); margin-top: 10px; }

/* Photo pleine largeur */
.photo-pleine { margin: var(--e-3) 0 0; }
.photo-pleine img { width: 100%; height: clamp(280px, 56vw, 760px); object-fit: cover; }
.photo-pleine figcaption { width: min(100% - 32px, 1280px); margin: 10px auto 0; }

/* Duo photo + texte, asymétrique */
.duo { width: min(100% - 32px, 1280px); margin: 0 auto; padding-top: var(--e-3); display: grid; gap: 28px 64px; align-items: center; }
.duo figure { margin: 0; }
.duo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.duo h2 { font-size: var(--t-3); line-height: 1.04; letter-spacing: -0.025em; margin: 0 0 .5em; }
.duo p { max-width: 54ch; }
@media (min-width: 900px) {
    .duo { grid-template-columns: 5fr 6fr; }
    .duo-inverse { grid-template-columns: 6fr 5fr; }
    .duo-inverse figure { order: 2; }
    .duo-large { grid-template-columns: 7fr 5fr; }
    .duo-large img { aspect-ratio: 5 / 4; }
}

/* Tuiles des pages pivots : tailles volontairement différentes */
.tuiles { width: min(100% - 32px, 1280px); margin: 0 auto; padding-top: var(--e-2); display: grid; gap: 48px 32px; }
.tuile { display: grid; gap: 10px; align-content: start; color: var(--encre); text-decoration: none; }
.tuile-image { display: block; overflow: hidden; background: var(--papier); }
.tuile-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .9s var(--ease); }
.tuile:hover .tuile-image img { transform: scale(1.035); }
.tuile h3 { font: 500 var(--t-2)/1.05 var(--serif); letter-spacing: -0.02em; margin: 8px 0 0; }
.tuile:hover h3 span { background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); }
.tuile p { color: var(--gris); margin: 0; max-width: 46ch; }
.tuile-lien { font-weight: 600; font-size: .97rem; }
.tuile-lien::after { content: " →"; }
@media (min-width: 900px) {
    .tuiles { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .tuile { grid-column: span 4; }
    .tuile-grande { grid-column: span 7; }
    .tuile-grande .tuile-image img { aspect-ratio: 5 / 4; }
    .tuile-grande h3 { font-size: var(--t-3); }
    .tuile-grande + .tuile { grid-column: span 5; margin-top: 18%; }
    .tuile-large { grid-column: span 6; }
    .tuile-texte { grid-column: span 4; padding-top: 1rem; border-top: 1px solid var(--encre); }
    .tuile-decale { margin-top: 12%; }
}
.tuile-texte h3 { font-size: var(--t-1); }

/* Listes à filets */
.filets { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--encre); max-width: none !important; }
.filets > li { border-bottom: 1px solid var(--filet); margin: 0; }
.filets > li > a, .filets > li > div { display: grid; gap: 6px 32px; padding: 22px 0; color: var(--encre); text-decoration: none; }
.filets .f-titre { font: 500 var(--t-1)/1.2 var(--serif); }
.filets .f-texte { color: var(--gris); }
.filets .f-meta { font-size: .92rem; color: var(--gris); white-space: nowrap; }
.filets > li > a:hover .f-titre { background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); }
@media (min-width: 900px) {
    .filets > li > a, .filets > li > div { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr) minmax(110px, auto); align-items: baseline; }
}

/* Citation */
.citation { width: min(100% - 32px, 1100px); margin: 0 auto; padding-top: var(--e-3); }
.citation blockquote { margin: 0; }
.citation p { font: italic 400 clamp(2rem, 1.3rem + 3vw, 4.2rem)/1.08 var(--serif); letter-spacing: -0.02em; margin: 0 0 .5em; max-width: 24ch; }
.citation footer { font-size: .97rem; color: var(--gris); }
.citation-droite { text-align: right; }
.citation-droite p { margin-left: auto; }

/* Chiffres */
.chiffres-ligne { width: min(100% - 32px, 1280px); margin: var(--e-2) auto 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--encre); border-bottom: 1px solid var(--encre); }
.chiffres-ligne > div { padding: 22px 16px 22px 0; }
.chiffres-ligne > div:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--filet); }
.chiffres-ligne > div:nth-child(n+3) { border-top: 1px solid var(--filet); }
.chiffres-ligne strong { display: block; font: 400 clamp(2.4rem, 1.8rem + 2.6vw, 4.6rem)/1 var(--serif); letter-spacing: -0.03em; }
.chiffres-ligne span { display: block; color: var(--gris); font-size: .95rem; margin-top: 8px; max-width: 24ch; }
@media (min-width: 900px) {
    .chiffres-ligne { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .chiffres-ligne > div { padding: 28px 24px 28px 0; }
    .chiffres-ligne > div + div { padding-left: 24px; border-left: 1px solid var(--filet); }
    .chiffres-ligne > div:nth-child(n+3) { border-top: 0; }
}

/* Couvertures de livres */
.couvertures { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 20px; max-width: none !important; }
.couvertures li { margin: 0; }
.couvertures a, .couvertures li > div { display: block; color: var(--encre); text-decoration: none; }
.couvertures img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; object-position: top; background: #fff; box-shadow: 0 1px 1px rgba(0,0,0,.08), 0 14px 28px -12px rgba(0,0,0,.35); transition: transform .45s var(--ease); margin-bottom: 14px; }
.couvertures a:hover img { transform: translateY(-6px); }
.couvertures b { display: block; font: 500 1.08rem/1.25 var(--serif); }
.couvertures span { display: block; font-size: .88rem; color: var(--gris); margin-top: 3px; }
@media (min-width: 700px) { .couvertures { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .couvertures { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 44px 28px; } }
.livre-vedette { display: grid; gap: 32px 64px; align-items: center; }
.livre-vedette img { width: min(100%, 340px); box-shadow: 0 2px 2px rgba(0,0,0,.08), 0 30px 60px -24px rgba(0,0,0,.45); transform: rotate(-2deg); transition: transform .5s var(--ease); }
.livre-vedette a:hover img { transform: rotate(0); }
@media (min-width: 900px) { .livre-vedette { grid-template-columns: 4fr 5fr; } }

/* Témoignages */
.temoignages { display: grid; gap: 40px 48px; }
.temoignage { margin: 0; padding-top: 18px; border-top: 1px solid var(--encre); }
.temoignage p { font: italic 400 var(--t-1)/1.4 var(--serif); margin: 0 0 .8em; }
.temoignage footer { font-size: .95rem; color: var(--gris); }
.temoignage footer b { color: var(--encre); font-weight: 600; }
@media (min-width: 900px) { .temoignages { grid-template-columns: 1fr 1fr; } .temoignages .temoignage:nth-child(even) { margin-top: 64px; } }

/* Programme de formation (jours) */
.jours { display: grid; gap: 0; border-top: 1px solid var(--encre); }
.jour { display: grid; gap: 8px 32px; padding: 26px 0; border-bottom: 1px solid var(--filet); }
.jour-num { font: italic 400 var(--t-2)/1 var(--serif); }
.jour h3 { margin: 0 0 .3em !important; }
.jour p, .jour ul { margin-bottom: .6em; }
.jour blockquote { margin: .6em 0 1em; font: italic 400 1.15rem/1.45 var(--serif); color: var(--gris); max-width: 56ch; }
@media (min-width: 900px) { .jour { grid-template-columns: 160px minmax(0, 1fr); } }

/* Vidéos */
.videos { display: grid; gap: 20px; grid-template-columns: 1fr; }
.videos iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; background: #000; }
@media (min-width: 760px) { .videos { grid-template-columns: 1fr 1fr; } }
.videos-trois { }
.videos-podcasts .podcast h3 { margin: .8em 0 .3em; } /* demande #17 */
/* demande #22 : parcours M1 à M5, tuiles de même taille */
.tuiles-parcours .tuile { margin-top: 0; }
.tuiles-parcours .tuile-image img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; }
@media (min-width: 1000px) { .tuiles-parcours { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px 24px; } .tuiles-parcours .tuile { grid-column: auto; } .tuiles-parcours .tuile h3 { font-size: var(--t-2); } }
@media (min-width: 1000px) { .videos-trois { grid-template-columns: repeat(3, 1fr); } }

/* Galerie de photos (Maison Pétale…) */
.galerie { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.galerie figure { margin: 0; }
.galerie img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.galerie .g-haute { grid-row: span 2; }
.galerie .g-haute img { aspect-ratio: auto; height: 100%; }
@media (min-width: 900px) { .galerie { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Appel à l'action de fin de page */
.appel { background: var(--encre); color: #fff; margin-top: var(--e-3); padding-block: var(--e-3); }
.appel-grille { display: grid; gap: 28px 64px; align-items: end; }
.appel h2 { font: 400 var(--t-4)/.98 var(--serif); letter-spacing: -0.035em; color: #fff; margin: 0; max-width: 15ch; }
.appel h2 mark { color: #fff; background: linear-gradient(transparent 70%, var(--surligneur) 70%, var(--surligneur) 90%, transparent 90%); }
.appel p { color: #cfccc4; }
.appel-tel { font: 400 var(--t-2)/1.2 var(--serif); }
.appel-tel a, .appel a:not(.bouton) { color: #fff; }
.appel .bouton { background: var(--surligneur); border-color: var(--surligneur); color: var(--encre); }
.appel .bouton:hover { background: #fff; border-color: #fff; }
@media (min-width: 900px) { .appel-grille { grid-template-columns: 7fr 4fr; } }

/* Bande de logos */
.logos { width: min(100% - 32px, 1280px); margin: 0 auto; padding-top: var(--e-3); }
.logos-groupe { display: grid; gap: 12px 40px; padding: 22px 0; border-top: 1px solid var(--filet); }
.logos-groupe:first-of-type { border-top: 1px solid var(--encre); }
.logos-groupe h3 { font: italic 400 1.1rem/1.3 var(--serif); color: var(--gris); margin: 0; }
.logos-groupe ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 22px 40px; }
.logos-groupe li { margin: 0; }
.logos-groupe img { height: 44px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1) contrast(1.05); opacity: .62; mix-blend-mode: multiply; transition: filter .35s, opacity .35s; }
.logos-groupe li:hover img, .logos-groupe li:focus-within img { filter: none; opacity: 1; }
@media (min-width: 900px) { .logos-groupe { grid-template-columns: var(--marge) minmax(0, 9fr); align-items: center; } .logos-groupe img { height: 52px; max-width: 170px; } }
@media (max-width: 600px) { .logos-groupe ul { gap: 18px 26px; } .logos-groupe img { height: 34px; max-width: 120px; } }

/* Contenus importés restants (pages du blog session, etc.) */
.page-titre { border-bottom: 1px solid var(--encre); }
.page-titre h1 { font: 400 var(--t-4)/1 var(--serif); letter-spacing: -0.035em; max-width: 16ch; }
.page-chapeau { font: 400 var(--t-1)/1.42 var(--serif); color: var(--gris); max-width: 46ch; margin: .8em 0 0; }
.contenu img { box-shadow: none; }

/* Fiche formation */
.formation-photo { width: 100%; margin: var(--e-2) 0 0; }
.formation-photo img { height: clamp(260px, 50vw, 640px); }
.fiche { background: var(--papier); padding: 26px; border-top: 3px solid var(--encre); }
.fiche dt { font: italic 400 .98rem/1.3 var(--serif); color: var(--gris); text-transform: none; letter-spacing: 0; }
.fiche dd { font-weight: 600; }
.fiche dl > div { border-bottom-color: #d4cfc2; }
.formation-tete { width: min(100% - 32px, 1280px); }
.formation-tete h1 { font: 400 var(--t-5)/.95 var(--serif); letter-spacing: -0.04em; max-width: 12ch; }
.formation-sous { font: italic 400 var(--t-2)/1.2 var(--serif); color: var(--gris); }
.formation-reperes { font-size: 1rem; }
.formation-reperes li + li::before { content: "/"; color: var(--gris); padding: 0 12px; }
.formation-grille { width: min(100% - 32px, 1280px); }
.formation-grille .contenu { max-width: none; }
.formation-grille .contenu > .chapeau { font: 400 var(--t-1)/1.42 var(--serif); max-width: 40ch; }
.formation-grille .sec { width: 100%; padding-top: var(--e-2); }
@media (min-width: 960px) {
    .formation-grille { grid-template-columns: minmax(0, 1fr) 320px; gap: 64px; }
    .formation-grille .sec { grid-template-columns: minmax(0, 2fr) minmax(0, 7fr); gap: 14px 32px; }
}
.formation-fin { width: min(100% - 32px, 1280px); border-top: 1px solid var(--encre); }
.formation-fin h2 { font: 400 var(--t-3)/1 var(--serif); letter-spacing: -0.03em; }
.autres { width: min(100% - 32px, 1280px); }
.liste-formations a:hover .lf-titre { color: var(--encre); background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); text-decoration: none; }

/* Contact */
.contact-grille { display: grid; gap: 40px 64px; }
@media (min-width: 900px) { .contact-grille { grid-template-columns: 5fr 7fr; } }
.formulaire { max-width: none; background: var(--papier); padding: clamp(22px, 3vw, 44px); }
.formulaire input, .formulaire textarea { border: 0; border-bottom: 1px solid var(--encre); background: transparent; border-radius: 0; padding: 12px 2px; }
.formulaire input:focus, .formulaire textarea:focus { outline: 0; border-bottom-width: 2px; background: #fff; }
.message-ok { background: #fff; border-left: 4px solid var(--surligneur); }

/* Pied de page */
.pied { background: var(--encre); color: #cfccc4; border-top: 0; padding-top: var(--e-3); }
.pied-marque { width: min(100% - 32px, 1280px); margin: 0 auto var(--e-2); font: 400 clamp(2.6rem, 1rem + 8vw, 9rem)/.9 var(--serif); letter-spacing: -0.045em; color: #fff; }
.pied-marque em { font-style: italic; }
.pied-grille { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); border-top: 1px solid rgba(255,255,255,.25); padding-top: 28px; }
.pied h2 { font: italic 400 1.1rem/1.3 var(--serif); color: var(--surligneur); text-transform: none; letter-spacing: 0; }
.pied a, .pied-tel a { color: #fff; text-decoration: none; }
.pied a:hover { color: var(--surligneur); }
.pied-intro p { color: #cfccc4; }
.pied-nom { display: none; }
.pied-bas { border-top-color: rgba(255,255,255,.15); color: #9c998f; }

/* ───── Blog (surcharges seulement) ───── */
.blog .page-titre h1 { font: 400 var(--t-5)/.95 var(--serif); letter-spacing: -0.04em; }
.blog .blog-intro { font: 400 var(--t-1)/1.42 var(--serif); color: var(--gris); max-width: 44ch; }
.blog .blog-total { font: italic 400 1.1rem/1.3 var(--serif); color: var(--encre); text-transform: none; letter-spacing: 0; }
.blog .page-date, .blog .page-date a { font: italic 400 1.05rem/1.3 var(--serif); color: var(--gris); text-decoration: none; }
.blog-meta, .blog-meta a { color: var(--gris); text-decoration: none; font-size: .92rem; }
.blog-carte h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -0.015em; }
.blog-carte h2 a { color: var(--encre); text-decoration: none; }
.blog-carte h2 a:hover { background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); color: var(--encre); }
.blog-vignette { overflow: hidden; display: block; }
.blog-vignette img { border-radius: 0; transition: transform .8s var(--ease); }
.blog-carte:hover .blog-vignette img { transform: scale(1.05); }
.blog-colonne { background: var(--papier); padding: 26px; border-top: 3px solid var(--encre); }
.blog-colonne h2, .blog-colonne h3 { font-family: var(--serif); font-weight: 500; }
.blog-cats a { text-decoration: none; }
.blog-cats a:hover { background: linear-gradient(transparent 58%, var(--surligneur) 58%, var(--surligneur) 92%, transparent 92%); }
@media (min-width: 900px) {
    .blog-liste .blog-carte:first-child:not(.sans-image) { grid-template-columns: 1fr; }
    .blog-liste .blog-carte:first-child:not(.sans-image) .blog-vignette img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
    .blog-liste .blog-carte:first-child h2 { font-size: var(--t-2); line-height: 1.1; }
}
.blog-article .page-titre h1 { font: 400 var(--t-3)/1.04 var(--serif); letter-spacing: -0.03em; max-width: 22ch; }
.blog-article .contenu { font: 400 clamp(1.08rem, 1rem + .3vw, 1.22rem)/1.72 var(--sans); max-width: 66ch; }
.blog-article .contenu > p:first-of-type { font: 400 var(--t-1)/1.45 var(--serif); }
.blog-article .contenu h2 { font: 500 var(--t-2)/1.1 var(--serif); margin-top: 1.8em; }
.blog-article .contenu h3 { font: italic 400 var(--t-1)/1.3 var(--serif); text-transform: none; letter-spacing: 0; color: var(--encre); margin: 2em 0 .6em; padding: 0; border: 0; }
.blog-article .contenu h3::first-letter { background: var(--surligneur); }
.blog-article .contenu blockquote { border-left: 3px solid var(--surligneur); font-family: var(--serif); font-style: italic; }
.blog-article .contenu img { width: 100%; max-height: 640px; object-fit: cover; }

/* Reprises de styles (anciennement dans refonte.css) */
.formation-tete { margin-inline: auto; padding-top: clamp(2.5rem, 2rem + 3vw, 5rem); }
.formation-reperes { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 0; margin: 0; padding: 0; }
.formation-reperes li { margin: 0; }
.formation-photo img { width: 100%; object-fit: cover; display: block; }
.formation-grille { padding-top: var(--e-2); border-top: 0; }
.fiche .bouton { display: block; text-align: center; margin-bottom: 14px; }
.js .page-composee [data-reveal] { will-change: opacity, transform; }

/* Corrections après audit design (19/10) */
h1, h2 { text-wrap: balance; }
.lien-fleche::after, .tuile-lien::after { content: "\00a0→"; }
/* Fin de page : plus de bandeau noir, un simple filet sur le papier */
.appel { background: transparent; color: var(--encre); border-top: 1px solid var(--encre); padding-block: var(--e-2) var(--e-3); margin-top: var(--e-3); width: min(100% - 32px, 1280px); margin-inline: auto; }
.appel .enveloppe { width: 100%; }
.appel h2 { color: var(--encre); font-size: var(--t-3); }
.appel h2 mark { color: var(--encre); background: none; }
.appel p { color: var(--gris); }
.appel-tel a, .appel a:not(.bouton) { color: var(--encre); }
.appel .bouton { background: var(--encre); border-color: var(--encre); color: #fff; }
.appel .bouton:hover { background: #fff; color: var(--encre); }
.pied-marque { font-size: clamp(2rem, 1rem + 3vw, 3.6rem); }
/* Chiffres : une ligne de texte, pas une grille de tuiles */
.chiffres-ligne { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 0; border: 0; padding: 0; font: 400 var(--t-1)/1.5 var(--serif); }
.chiffres-ligne > div, .chiffres-ligne > div + div, .chiffres-ligne > div:nth-child(n) { padding: 0; border: 0; display: inline; }
.chiffres-ligne > div + div::before { content: " · "; color: var(--gris); padding: 0 .35em; }
.chiffres-ligne strong { display: inline; font: 500 1em/1 var(--serif); letter-spacing: 0; }
.chiffres-ligne span { display: inline; font: inherit; color: var(--gris); margin: 0 0 0 .3em; max-width: none; }
/* Lisibilité */
.filets .f-titre, .couvertures b, .tuile h3, .jour h3 { font-weight: 600; }
.filets .f-texte, .filets .f-meta, .tuile p { color: #4a4945; }
.filets .f-meta { font-size: .95rem; font-variant-numeric: tabular-nums; }
.sec-corps ul.filets, ul.couvertures { padding-left: 0; }
/* Vidéos en vignettes */
.video { position: relative; display: block; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.video img { width: 100%; height: 100%; object-fit: cover; opacity: .85; transition: opacity .3s, transform .6s var(--ease); }
.video span { position: absolute; left: 16px; bottom: 14px; background: #fff; color: var(--encre); font: 600 .95rem/1 var(--sans); padding: 10px 14px; }
.video:hover img { opacity: 1; transform: scale(1.03); }
/* Accueil : entrées en liste éditoriale */
.entrees { width: min(100% - 32px, 1280px); margin: 0 auto; padding-top: var(--e-3); }
.entrees .tuile-grande { display: block; color: var(--encre); text-decoration: none; }
.entrees .tuile-grande img { width: 100%; height: clamp(260px, 48vw, 620px); object-fit: cover; }
.entrees .tuile-grande h3 { font: 500 var(--t-3)/1 var(--serif); margin: 18px 0 6px; }
.entrees .tuile-grande p { color: #4a4945; max-width: 52ch; }

/* ───── Parcours « Les essentiels de la facilitation » (19/10, soir) ───── */
h1, h2, h3, .logo, .pied-marque { letter-spacing: -0.01em; }
.ouverture h1, .formation-tete h1 { letter-spacing: -0.025em; line-height: 1; }

/* Frise du parcours : un chemin, pas des cartes */
.frise { list-style: none; margin: var(--e-2) 0 0; padding: 0; display: grid; gap: 0; counter-reset: etape; position: relative; }
.frise li { margin: 0; position: relative; }
.frise a { display: grid; grid-template-columns: 64px 1fr; gap: 2px 18px; padding: 0 0 30px; color: var(--encre); text-decoration: none; position: relative; }
.frise a::before { content: ""; position: absolute; left: 27px; top: 54px; bottom: 0; width: 2px; background: var(--encre); }
.frise li:last-child a::before { display: none; }
.frise-num { grid-row: span 3; width: 56px; height: 56px; border: 2px solid var(--encre); border-radius: 50%; display: grid; place-items: center; font: 700 1.05rem/1 var(--serif); background: var(--fond); }
.frise-verbe { font: italic 400 1rem/1.3 var(--serif); color: var(--gris); padding-top: 4px; }
.frise-titre { font: 700 var(--t-1)/1.2 var(--serif); }
.frise-texte { color: #4a4945; max-width: 58ch; }
.frise a:hover .frise-titre { background: linear-gradient(transparent 60%, var(--surligneur) 60%, var(--surligneur) 92%, transparent 92%); }
.frise a:hover .frise-num { background: var(--surligneur); }
.frise-fin .frise-num { background: var(--encre); color: #fff; }
@media (min-width: 1000px) { .frise { grid-template-columns: 1fr 1fr; column-gap: 48px; } .frise li:nth-child(3) a::before, .frise li:nth-child(6) a::before { display: none; } .frise { grid-auto-flow: column; grid-template-rows: repeat(3, auto); } }

/* Les 12 éléments, fil rouge */
.elements { list-style: none; margin: var(--e-1) 0 0; padding: 0 !important; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--encre); max-width: none !important; }
.elements li { margin: 0; padding: 14px 10px 14px 0; border-bottom: 1px solid var(--filet); font: 400 var(--t-1)/1.2 var(--serif); display: flex; gap: 12px; align-items: baseline; }
.elements span { font: 600 .8rem/1 var(--sans); color: var(--gris); font-variant-numeric: tabular-nums; }
@media (min-width: 760px) { .elements { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .elements { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Tableaux (temps, dates) */
.tableau-defile { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: var(--e-1); max-width: 100%; }
.tableau { border-collapse: collapse; width: 100%; min-width: 620px; font-variant-numeric: tabular-nums; }
.tableau caption { text-align: left; font: italic 400 .98rem/1.4 var(--serif); color: var(--gris); padding-bottom: 10px; }
.tableau th, .tableau td { text-align: left; padding: 12px 14px 12px 0; border-bottom: 1px solid var(--filet); vertical-align: top; font-size: 1rem; }
.tableau thead th { font: 600 .9rem/1.3 var(--sans); border-bottom: 2px solid var(--encre); }
.tableau tbody th { font: 400 1.05rem/1.35 var(--serif); max-width: 22ch; }
.tableau tbody th a { color: var(--encre); }
.tableau tfoot th, .tableau tfoot td { font-weight: 700; border-top: 2px solid var(--encre); border-bottom: 0; }
.tableau small { color: var(--gris); font-size: .9rem; }
.tableau .passe { color: #9a978f; }
.tableau .passe small { color: #b2afa7; }
.note-tableau { font-size: .92rem; color: var(--gris); margin-top: 10px; }

/* Étapes de certification */
.etapes-certif { list-style: none; margin: var(--e-1) 0 0; padding: 0 !important; counter-reset: c; border-top: 1px solid var(--encre); }
.etapes-certif li { counter-increment: c; display: grid; grid-template-columns: 52px 1fr; gap: 4px 16px; padding: 20px 0; border-bottom: 1px solid var(--filet); margin: 0; }
.etapes-certif li::before { content: counter(c); grid-row: span 2; font: 700 var(--t-2)/1 var(--serif); }
.etapes-certif b { font: 700 var(--t-1)/1.25 var(--serif); }
.etapes-certif span { color: #4a4945; }

/* Place du module dans le parcours (fiche formation) */
.parcours-etape { margin-top: var(--e-1); padding: 22px 0; border-top: 1px solid var(--encre); border-bottom: 1px solid var(--filet); display: grid; gap: 14px; }
.pe-titre { margin: 0; font: italic 400 1.1rem/1.4 var(--serif); }
.pe-titre a { font-style: normal; }
.pe-points { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 0; }
.pe-points li { display: flex; align-items: center; margin: 0; }
.pe-points li + li::before { content: ""; width: clamp(14px, 4vw, 44px); height: 2px; background: var(--filet); }
.pe-points li.fait + li::before, .pe-points li.fait::before, .pe-points li.ici::before { background: var(--encre); }
.pe-points a { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 6px; border: 2px solid var(--filet); border-radius: 22px; font: 700 .95rem/1 var(--serif); color: var(--gris); text-decoration: none; background: var(--fond); }
.pe-points .fait a { border-color: var(--encre); color: var(--encre); }
.pe-points .ici a { border-color: var(--encre); background: var(--surligneur); color: var(--encre); }
.pe-points .certif a { padding: 0 14px; font: 600 .85rem/1 var(--sans); }
.pe-acquis { margin: 0; max-width: 70ch; }
.pe-nav { margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; font-weight: 600; font-size: .97rem; }
.pe-nav a { text-decoration: none; border-bottom: 1px solid var(--encre); }
.pe-suivant { margin-left: auto; }
@media (max-width: 600px) { .pe-nav { flex-direction: column; } .pe-suivant { margin-left: 0; } }
.sec-corps, .sec-marge { min-width: 0; }
.filets .f-meta { white-space: normal; }
@media (min-width: 900px) { .filets .f-meta { white-space: nowrap; max-width: 22ch; white-space: normal; } }


/* 19/10/2026 : police unique Inter (Richard trouvait l'ancien duo serif/grotesk « trop IA »). */
h1, h2, h3, .ouverture h1, .page-titre h1, .formation-tete h1 { font-weight: 600; letter-spacing: -0.025em; }
h1 em, h2 em, h3 em { font-style: normal; }

/* 19/10/2026 : le nom de l'en-tete passe au-dessus du menu pour que le clic ramene a l'accueil. */
.logo { position: relative; z-index: 5; }

/* 19/10/2026 : nom plus long (Apprendre Autrement Ensemble), taille adaptee a la largeur. */
.logo { font-size: clamp(1rem, 1.45vw, 1.5rem); white-space: nowrap; }
@media (max-width: 640px) { .logo { font-size: 1.02rem; white-space: normal; max-width: 72vw; line-height: 1.15; } }