/* franckmarcheix.com : feuille unique, partie de celle de Confidences de Coach (même ossature),
   avec sa propre palette (encre, os, cobalt) et les sections de l'accueil d'auteur en fin de fichier.
   Clair (papier) par défaut, sections sombres (encre) pour le rythme.
   Toutes les animations tombent sous prefers-reduced-motion, et rien n'est caché sans JS. */

:root{
  --papier:#f2f0eb;
  --papier-2:#e5e1d8;
  --papier-3:#fbfaf7;
  --encre:#0f1115;
  --encre-2:#1b1e25;
  --encre-3:#3a3f4b;
  --gris:#5a5f6b;
  --gris-clair:#aab0bd;
  --braise:#2b46d4;        /* fonds de bouton, texte blanc dessus */
  --braise-texte:#2541c4;  /* mots en italique sur papier */
  --braise-vif:#93a6ff;    /* accents sur fond sombre */
  --miel:#f2b544;
  --sauge:#9fb59a;
  --trait:rgba(15,17,21,.12);
  --trait-clair:rgba(242,240,235,.16);
  --rayon:22px;
  --rayon-l:34px;
  --ombre:0 30px 60px -30px rgba(23,20,28,.45), 0 8px 20px -12px rgba(23,20,28,.25);
  --serif:"Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans:"Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --marge:clamp(16px, 4vw, 56px);
  --large:1320px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--encre);font-family:var(--sans);font-size:17px;line-height:1.65;
  font-feature-settings:"ss01";-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
em{font-style:italic}
h1 em,h2 em,h3 em{font-style:inherit;color:inherit}
:focus-visible{outline:2px solid var(--braise);outline-offset:3px;border-radius:6px}
.visuellement-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.evitement{position:absolute;left:-999px;top:8px;background:var(--encre);color:var(--papier);padding:10px 16px;border-radius:10px;z-index:100}
.evitement:focus{left:8px}

/* ---------- barre de lecture ---------- */
#progression{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));
  background:var(--braise);z-index:80}

/* ---------- en-tête ---------- */
.entete{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;align-items:center;gap:22px;padding:14px var(--marge);
  background:var(--papier);border-bottom:1px solid transparent;transition:border-color .3s, transform .5s var(--ease), background .3s}
.entete.pleine{border-bottom-color:var(--trait)}
.entete.cachee{transform:translateY(-100%)}
.marque{display:flex;flex-direction:column;text-decoration:none;margin-right:auto;white-space:nowrap;line-height:1}
.marque-nom{font-family:var(--serif);font-size:28px;letter-spacing:-.01em}
.marque-sous{font-size:12.5px;font-weight:600;color:var(--gris);margin-top:5px}
.nav{display:flex;align-items:center;gap:4px}
.nav a{position:relative;text-decoration:none;font-weight:600;font-size:15px;padding:10px 12px}
.nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:0 50%;transition:transform .4s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.loupe,.burger{width:44px;height:44px;border-radius:12px;border:0;background:transparent;box-shadow:inset 0 0 0 1px var(--trait);display:grid;place-items:center;flex:none}
.loupe svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.loupe:hover{background:var(--encre);color:var(--papier)}
.burger{display:none;gap:5px;align-content:center}
.burger span{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;transition:transform .35s var(--ease)}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.menu-mobile{position:fixed;inset:0;z-index:65;background:var(--papier);color:var(--encre);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:100px var(--marge) 40px}
.menu-mobile[hidden]{display:none}
.menu-mobile a{font-family:var(--serif);font-size:clamp(42px,12vw,72px);line-height:1.1;text-decoration:none;opacity:0;transform:translateY(20px);animation:monte .6s var(--ease) forwards}
.menu-mobile a:nth-child(2){animation-delay:.06s}.menu-mobile a:nth-child(3){animation-delay:.12s}.menu-mobile a:nth-child(4){animation-delay:.18s}
@keyframes monte{to{opacity:1;transform:none}}

/* ---------- éléments communs ---------- */
.surtitre{display:block;font-size:15px;font-weight:700;color:var(--braise-texte);margin:0 0 14px;padding-top:12px;border-top:2px solid currentColor;width:fit-content}
.sombre .surtitre{color:var(--braise-vif)}
h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;margin:0}
h1,h2,h3,.carte-titre,.suite-titre,.glissiere-carte p{text-wrap:balance}
h2{font-size:clamp(40px,6vw,84px);line-height:.98}
.bouton{position:relative;display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:999px;border:0;font-weight:700;font-size:16px;text-decoration:none;
  transition:transform .35s var(--ease), background .3s, color .3s, box-shadow .3s;will-change:transform;isolation:isolate;overflow:hidden}
.bouton svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.bouton:hover svg{transform:translateX(4px)}
.bouton::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--braise);transform:translateY(101%);transition:transform .45s var(--ease)}
.bouton:hover::before{transform:none}
.bouton-encre{background:var(--encre);color:var(--papier)}
.bouton-braise{background:var(--braise);color:#fff}
.bouton-braise::before{background:var(--encre)}
.bouton-clair{background:var(--papier);color:var(--encre)}
.bouton-clair:hover{color:#fff}
.bouton-ligne{box-shadow:inset 0 0 0 1.5px var(--encre);color:var(--encre)}
.bouton-ligne:hover{color:#fff;box-shadow:none}
.bouton-ligne-clair{box-shadow:inset 0 0 0 1.5px var(--papier);color:var(--papier);background:transparent}
.bouton-ligne-clair:hover{color:#fff;box-shadow:none}
.pastille{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:0;background:var(--papier-3);box-shadow:inset 0 0 0 1px var(--trait);
  font-size:14px;font-weight:600;text-decoration:none;transition:background .25s,color .25s,transform .3s var(--ease)}
.pastille small{font-size:12px;color:var(--gris);font-weight:700}
.pastille:hover{background:var(--encre);color:var(--papier);transform:translateY(-2px)}
.pastille:hover small{color:var(--gris-clair)}
.pastille.actif,.pastille[aria-pressed="true"]{background:var(--encre);color:var(--papier)}
.pastille-petite{padding:5px 12px;font-size:13px}
.lien-fleche{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:3px}
.lien-fleche svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform .35s var(--ease)}
.lien-fleche:hover svg{transform:translateX(5px)}
.section{padding:clamp(80px,11vw,150px) var(--marge);max-width:var(--large);margin:0 auto}
.section-tete{margin-bottom:clamp(36px,5vw,64px);max-width:900px}
.section-tete-ligne{display:flex;justify-content:space-between;align-items:end;gap:24px;max-width:none;flex-wrap:wrap}
.sombre{background:var(--encre);color:var(--papier)}

/* ---------- accueil : hero ---------- */
.hero{position:relative;min-height:0;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:40px;
  padding:140px var(--marge) 40px;max-width:1440px;margin:0 auto}
.hero-titre{font-size:clamp(60px,9.6vw,156px);line-height:.86;letter-spacing:-.035em;margin:0 0 30px}
.surligne{background:linear-gradient(var(--miel),var(--miel)) 0 88%/0% .16em no-repeat;transition:background-size 1.1s var(--ease)}
.js .surligne{animation:surligne 1.1s var(--ease) 1.1s forwards}
@keyframes surligne{to{background-size:100% .16em}}
.ligne{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.ligne>span{display:inline-block}
.js .ligne>span{transform:translateY(105%);animation:leve 1.1s var(--ease) forwards}
.js .ligne:nth-child(2)>span{animation-delay:.12s}
.js .ligne:nth-child(3)>span{animation-delay:.24s}
@keyframes leve{to{transform:none}}
.js .entree{opacity:0;transform:translateY(18px);animation:monte .9s var(--ease) var(--d,0s) forwards}
.hero-chapo{font-size:clamp(18px,1.5vw,21px);max-width:560px;color:var(--encre-3);margin:0 0 28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}

.hero-scene{position:relative;height:min(76vh,680px);perspective:1200px}
.hero-pile{position:absolute;inset:0;transform-style:preserve-3d}
.pile-portrait,.pile-carte{position:absolute;margin:0;border-radius:var(--rayon);overflow:hidden;box-shadow:var(--ombre);
  transform:translate3d(calc(var(--tx,0px) + var(--ex,0px)),calc(var(--ty,0px) + var(--ey,0px)),0) rotate(var(--er,0deg));transition:transform .9s var(--ease);will-change:transform}
.pile-portrait{width:58%;height:78%;right:8%;top:6%;border-radius:200px 200px var(--rayon) var(--rayon)}
.pile-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.pile-carte{width:62%;aspect-ratio:16/9;background:var(--encre)}
.pile-carte img{width:100%;height:100%;object-fit:cover}
.pile-carte figcaption{position:absolute;left:10px;bottom:10px;background:rgba(23,20,28,.82);color:var(--papier);font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;backdrop-filter:blur(6px)}
.pile-1{left:0;top:2%;rotate:-6deg;--a:.45s;--b:0s}
.pile-2{left:-6%;top:48%;rotate:4deg;width:54%;--a:.6s;--b:1.8s}
.pile-3{right:-2%;bottom:0;rotate:-3deg;width:50%;--a:.75s;--b:3.2s}
.js .pile-portrait{animation:pose 1.2s var(--ease) .2s backwards}
.js .pile-carte{animation:pose 1.2s var(--ease) var(--a) backwards}
@keyframes pose{from{opacity:0;transform:translate3d(0,60px,0) scale(.92)}}

/* ---------- galerie des invités : défilement horizontal épinglé ---------- */
.invites{position:relative;background:var(--papier);color:var(--encre)}
.invites-cadre{padding:clamp(50px,7vw,90px) 0}
.invites-tete{padding:0 var(--marge);max-width:var(--large);margin:0 auto 40px}
.invites-tete h2{margin-bottom:14px}
.invites-aide{color:var(--encre-3);margin:0;max-width:52ch}
.invites-piste{display:flex;gap:28px;padding:0 var(--marge);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.invites-piste::-webkit-scrollbar{display:none}
.invite-carte{flex:none;width:min(78vw,400px);text-decoration:none;scroll-snap-align:start}
.invite-image{aspect-ratio:16/9;border-radius:var(--rayon);overflow:hidden;background:var(--papier-2)}
.invite-image img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .8s var(--ease), transform 1s var(--ease)}
.invite-carte:hover .invite-image img,.invite-carte:focus-visible .invite-image img,.invite-carte.net .invite-image img{filter:none}
.invite-carte:hover .invite-image img{transform:scale(1.05)}
.invite-carte{opacity:.55;transition:opacity .6s var(--ease)}
.invite-carte.net,.invite-carte:hover,.invite-carte:focus-visible,html:not(.epingle) .invite-carte{opacity:1}
.invite-nom{font-family:var(--serif);font-size:clamp(32px,3vw,44px);line-height:1;margin:18px 0 8px}
.invite-sujet{color:var(--encre-3);margin:0 0 8px;line-height:1.4}
.invite-nb{color:var(--braise-texte);font-weight:700;font-size:14px;margin:0}
.invite-fin{display:flex;flex-direction:column;justify-content:flex-end;gap:16px;aspect-ratio:16/11;height:auto;padding:30px;border-radius:var(--rayon);box-shadow:inset 0 0 0 1px var(--trait);transition:background .4s,color .4s}
.invite-fin:hover{background:var(--braise);color:#fff}
.invite-fin-texte{font-family:var(--serif);font-size:clamp(40px,4vw,60px);line-height:1}
.invite-fin-lien{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.invite-fin-lien svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
/* sur grand écran, la piste avance quand on fait défiler la page */
.epingle .invites-cadre{overflow:hidden}
.epingle .invites-piste{overflow:visible;scroll-snap-type:none;transform:translate3d(var(--decal,0px),0,0);will-change:transform;width:max-content}
.epingle .invite-carte{width:clamp(340px,32vw,520px)}
.invites + .section{position:relative;padding-top:clamp(40px,5vw,72px)}

/* ---------- cartes ---------- */
.carte-lien{display:block;text-decoration:none;height:100%}
.carte-image{position:relative;aspect-ratio:16/9;border-radius:var(--rayon);overflow:hidden;background:var(--encre-2);isolation:isolate}
.carte-image img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease), filter .6s}
.carte-lien:hover .carte-image img{transform:scale(1.07)}
.carte-lecture{position:absolute;right:14px;bottom:14px;width:52px;height:52px;border-radius:50%;background:rgba(250,245,237,.92);backdrop-filter:blur(6px);
  display:grid;place-items:center;transition:transform .5s var(--ease), background .3s;box-shadow:0 10px 24px -8px rgba(0,0,0,.4)}
.carte-lecture::before{content:"";width:0;height:0;border-left:14px solid var(--encre);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px;transition:border-color .3s}
.carte-lien:hover .carte-lecture{transform:scale(1.14);background:var(--braise)}
.carte-lien:hover .carte-lecture::before{border-left-color:#fff}
.carte-corps{padding:18px 4px 0}
.carte-meta{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:13px;color:var(--gris);margin:0 0 8px;font-weight:600}
.carte-invite{color:var(--braise-texte);font-weight:800;letter-spacing:.02em}
.sombre .carte-invite{color:var(--braise-vif)}
.carte-titre{font-family:var(--serif);font-size:clamp(23px,2vw,28px);line-height:1.12;letter-spacing:-.01em}
.carte-titre{background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .6s var(--ease);display:inline}
.carte-lien:hover .carte-titre{background-size:100% 1.5px}
.carte-extrait{color:var(--encre-3);margin:12px 0 0;max-width:60ch}
.grille-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:52px 30px}

/* bento « à la une » */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.bento-carte{position:relative}
.bento-1{grid-column:span 2;grid-row:span 2}
.bento-1 .carte-titre{font-size:clamp(32px,3.4vw,52px)}
.bento-1 .carte-image{aspect-ratio:16/10}
.bento-1 .carte-lecture{width:76px;height:76px;right:22px;bottom:22px}
.bento-1 .carte-lecture::before{border-left-width:20px;border-top-width:13px;border-bottom-width:13px}
.js [data-cadre] img{scale:var(--z,1.18);transition:transform 1s var(--ease)}

/* ---------- chiffres ---------- */
.chiffres{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--large);margin:0 auto;padding:0 var(--marge);gap:0}
.chiffre{padding:34px 26px;border-left:1px solid var(--trait)}
.chiffre:first-child{border-left:0}
.chiffre strong{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(56px,7vw,104px);line-height:.9;letter-spacing:-.03em}
.chiffre span{display:block;margin-top:10px;color:var(--gris);font-weight:600;font-size:15px}

/* ---------- thèmes ---------- */
.themes-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--trait)}
.themes-liste li{border-bottom:1px solid var(--trait)}
.themes-liste a{position:relative;display:grid;grid-template-columns:1fr auto 40px;align-items:center;gap:18px;padding:20px 6px;text-decoration:none;overflow:hidden}
.themes-liste a::before{content:"";position:absolute;inset:0;background:var(--encre);transform:scaleY(0);transform-origin:50% 100%;transition:transform .55s var(--ease);z-index:-1}
.themes-liste a:hover::before{transform:scaleY(1)}
.themes-liste a:hover{color:var(--papier)}
.themes-liste a{isolation:isolate;transition:color .4s}
.theme-nom{font-family:var(--serif);font-size:clamp(36px,5vw,72px);line-height:1;transition:transform .55s var(--ease)}
.themes-liste a:hover .theme-nom{transform:translateX(18px)}
.theme-compte{font-size:14px;font-weight:700;color:var(--gris)}
.themes-liste a:hover .theme-compte{color:var(--gris-clair)}
.themes-liste svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;transition:transform .55s var(--ease)}
.themes-liste a:hover svg{transform:rotate(45deg);stroke:var(--braise-vif)}
.themes-autres{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.apercu-flottant{position:fixed;left:0;top:0;width:300px;aspect-ratio:16/9;border-radius:18px;overflow:hidden;pointer-events:none;z-index:60;
  opacity:0;scale:.6;rotate:-4deg;transition:opacity .35s, scale .5s var(--ease), rotate .5s var(--ease);box-shadow:var(--ombre)}
.apercu-flottant.visible{opacity:1;scale:1;rotate:3deg}
.apercu-flottant img{width:100%;height:100%;object-fit:cover}

/* ---------- Franck ---------- */
.franck{border-radius:var(--rayon-l);margin:0 clamp(8px,1.5vw,20px);padding:clamp(80px,10vw,140px) var(--marge) clamp(60px,8vw,110px);overflow:hidden;position:relative}
.franck-grille{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center;max-width:var(--large);margin:0 auto;position:relative}
.franck-visuel{position:relative;aspect-ratio:4/5}
.franck-portrait{position:absolute;left:0;top:0;width:68%;height:88%;margin:0;border-radius:240px 240px var(--rayon) var(--rayon);overflow:hidden}
.franck-portrait img,.franck-scene img{width:100%;height:100%;object-fit:cover}
.franck-scene{position:absolute;right:0;bottom:0;width:62%;aspect-ratio:16/10;margin:0;border-radius:var(--rayon);overflow:hidden;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);outline:8px solid var(--encre)}
.franck-texte h2{margin-bottom:26px}
.franck-citation{font-family:var(--serif);font-size:clamp(26px,2.6vw,36px);line-height:1.2;color:var(--miel);margin:0 0 24px}
.franck-texte>p:not(.surtitre):not(.franck-citation){color:#d9d0c5;font-size:18px;margin:0 0 34px;max-width:52ch}
.franck-videos{max-width:var(--large);margin:clamp(70px,9vw,120px) auto 0;position:relative}
.glissiere{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,24%);gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:18px;
  scrollbar-width:thin;scrollbar-color:var(--encre-3) transparent;cursor:grab}
.glissiere.tire{cursor:grabbing;scroll-snap-type:none}
.glissiere-carte{scroll-snap-align:start;text-decoration:none}
.glissiere-carte p{font-family:var(--serif);font-size:22px;line-height:1.15;margin:14px 0 0}
.glissiere-carte:hover .carte-image img{transform:scale(1.07)}
.glissiere-carte:hover .carte-lecture{transform:scale(1.14);background:var(--braise)}
.glissiere-carte:hover .carte-lecture::before{border-left-color:#fff}

/* ---------- livre offert ---------- */
.aimant{border-radius:var(--rayon-l);margin:clamp(40px,6vw,80px) clamp(8px,1.5vw,20px) 0;padding:clamp(70px,9vw,120px) var(--marge);position:relative;overflow:hidden;
  background:var(--encre)}
.aimant-grille{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(40px,6vw,90px);align-items:center;max-width:1180px;margin:0 auto}
.aimant-livre{position:relative;max-width:380px;justify-self:center;perspective:1400px}
.aimant-livre picture{display:block;transform:rotateY(var(--ry,0deg)) rotateX(var(--rx,0deg));transform-origin:30% 50%;will-change:transform}
.aimant-livre img{position:relative;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));border-radius:6px}
.aimant h2{font-size:clamp(40px,5vw,72px);margin-bottom:16px}
.aimant-sous{font-family:var(--serif);font-size:clamp(22px,2vw,28px);color:var(--miel);margin:0 0 20px}
.aimant-points{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:10px;color:#e4dbcf}
.aimant-points li{display:flex;gap:12px;align-items:baseline}
.aimant-points li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--braise-vif);translate:0 -2px}
.aimant-champs{display:flex;gap:10px;flex-wrap:wrap;padding:8px;border-radius:999px;background:rgba(244,237,226,.08);box-shadow:inset 0 0 0 1px var(--trait-clair);max-width:620px}
.aimant-champs input{flex:1 1 220px;min-width:0;background:transparent;border:0;color:var(--papier);font:inherit;padding:12px 18px;outline:0}
.aimant-champs input::placeholder{color:#a79e94}
.aimant-etiquette{display:block;font-weight:700;font-size:15px;margin:0 0 10px 4px;color:var(--papier)}
.aimant-champs:focus-within{box-shadow:inset 0 0 0 1.5px var(--miel)}
.aimant-accord{display:flex;gap:10px;align-items:flex-start;margin:16px 0 0 10px;font-size:14px;color:#cfc5b9;cursor:pointer}
.aimant-accord input{accent-color:var(--braise);width:18px;height:18px;margin-top:2px;flex:none}
.aimant-message{min-height:1.5em;margin:12px 0 0 10px;font-weight:700;color:var(--miel)}
.aimant-papier{margin-top:28px;border-top:1px solid var(--trait-clair);padding-top:18px;color:#d9d0c5;max-width:620px}
.aimant-papier summary{cursor:pointer;font-weight:700;color:var(--papier);list-style:none;display:flex;align-items:center;gap:10px}
.aimant-papier summary::before{content:"+";display:grid;place-items:center;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--trait-clair);transition:rotate .3s}
.aimant-papier[open] summary::before{rotate:45deg}
.aimant-papier summary::-webkit-details-marker{display:none}
.papier-form{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.papier-form select{font:inherit;padding:12px 16px;border-radius:999px;background:var(--encre-2);color:var(--papier);border:1px solid var(--trait-clair)}

/* ---------- pages de liste ---------- */
.liste-tete{padding:clamp(140px,16vw,200px) var(--marge) 20px;max-width:var(--large);margin:0 auto}
.titre-page{font-size:clamp(56px,10vw,150px);line-height:.9;letter-spacing:-.035em;margin:0 0 22px}
.liste-compte{color:var(--gris);font-weight:600;max-width:70ch}
.filtres{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.section-liste{padding-top:40px}
.carte.cachee-filtre{display:none}
.vide{color:var(--gris);font-size:18px}

/* ---------- article ---------- */
.article-tete{max-width:1100px;margin:0 auto;padding:clamp(130px,14vw,170px) var(--marge) 40px;text-align:center}
.fil{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;font-size:14px;color:var(--gris);font-weight:600;margin-bottom:28px}
.fil a{text-decoration:none}
.fil a:hover{color:var(--braise-texte)}
.article-invite{display:inline-flex;align-items:center;gap:10px;font-weight:800;color:var(--braise-texte);letter-spacing:.04em;margin:0 0 16px;font-size:16px}
.point{width:9px;height:9px;border-radius:50%;background:var(--braise);}
.article-titre{font-size:clamp(44px,6.6vw,98px);line-height:.98;letter-spacing:-.03em;margin:0 0 26px;text-wrap:balance}
.mot{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.mot>span{display:inline-block}
.js .mot>span{transform:translateY(110%);animation:leve .9s var(--ease) calc(var(--i) * 45ms + .1s) forwards}
.article-meta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;color:var(--gris);font-weight:600;font-size:15px;margin:0}
.article-meta time{margin-right:6px}
.article-corps{max-width:1100px;margin:0 auto;padding:0 var(--marge)}
.article-ecran{margin:10px 0 60px}
.ecran{position:relative;aspect-ratio:16/9;border-radius:var(--rayon-l);overflow:hidden;background:var(--encre);box-shadow:0 50px 90px -40px rgba(23,20,28,.6)}
.ecran-lancer{position:absolute;inset:0;width:100%;border:0;padding:0;background:var(--encre);display:block}
.ecran-lancer img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease), filter .6s;filter:saturate(.95)}
.ecran-lancer:hover img{transform:scale(1.04);filter:saturate(1.1) brightness(.9)}
.ecran .lecture{position:absolute;left:50%;top:50%;width:104px;height:104px;border-radius:50%;translate:-50% -50%;background:var(--braise);display:grid;place-items:center;
  transition:scale .5s var(--ease)}
.ecran .lecture::before{content:"";border-left:28px solid #fff;border-top:17px solid transparent;border-bottom:17px solid transparent;margin-left:8px}
.ecran-lancer:hover .lecture{scale:1.12}
.ecran-note{position:absolute;left:50%;bottom:16px;translate:-50% 0;font-size:12px;font-weight:600;color:rgba(255,255,255,.85);background:rgba(23,20,28,.6);padding:5px 12px;border-radius:999px;white-space:nowrap}
.ecran iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ecran-image img{width:100%;height:100%;object-fit:cover}
.prose{max-width:68ch;margin:0 auto;font-size:clamp(18px,1.3vw,20px);line-height:1.75;color:var(--encre-2)}
.prose p{margin:0 0 1.2em}
.prose>p:first-child::first-letter{font-family:var(--serif);float:left;font-size:4.6em;line-height:.8;margin:.08em .1em 0 0;color:var(--braise-texte)}
.prose h2{font-size:clamp(32px,3.4vw,46px);margin:1.6em 0 .6em;line-height:1.05}
.prose h3{font-size:clamp(26px,2.6vw,34px);margin:1.4em 0 .5em;line-height:1.1}
.prose a{color:var(--braise-texte);text-decoration-thickness:1.5px;text-underline-offset:3px;word-break:break-word}
.prose a:hover{color:var(--encre)}
.prose ul{padding-left:1.2em;margin:0 0 1.2em}
.prose li{margin:.3em 0}
.prose li::marker{color:var(--braise)}
.prose img{border-radius:14px;margin:1.4em auto}
.prose .ecran{margin:1.6em 0}
.prose strong{color:var(--encre)}
.et-vous{position:relative;font-family:var(--serif);font-size:clamp(28px,3vw,40px)!important;line-height:1.18!important;color:var(--encre)!important;
  margin:1.6em 0!important;padding:34px 36px 30px 36px;background:var(--papier-3);border-radius:var(--rayon);box-shadow:inset 0 0 0 1px var(--trait)}
.et-vous::before{content:"Et vous ?";display:block;font-family:var(--sans);font-size:15px;font-weight:800;color:var(--braise-texte);margin-bottom:12px}
.et-vous::after{content:"”";position:absolute;right:22px;top:-18px;font-size:120px;line-height:1;color:var(--miel)}
.prose>p.et-vous:first-child::first-letter{all:unset}
.article-partage{max-width:68ch;margin:40px auto 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:26px;border-top:1px solid var(--trait);font-weight:700;font-size:14px}
.article-partage span{color:var(--gris);margin-right:6px;font-size:14px}
.article-partage a,.article-partage button{padding:8px 14px;border-radius:999px;border:0;background:var(--papier-3);box-shadow:inset 0 0 0 1px var(--trait);text-decoration:none;font-weight:700;font-size:14px;transition:background .25s,color .25s}
.article-partage a:hover,.article-partage button:hover{background:var(--encre);color:var(--papier)}
.suite{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:var(--large);margin:clamp(60px,8vw,100px) auto 0;padding:0 var(--marge)}
.suite-lien{position:relative;display:flex;flex-direction:column;gap:10px;padding:32px;border-radius:var(--rayon);background:var(--papier-3);box-shadow:inset 0 0 0 1px var(--trait);
  text-decoration:none;overflow:hidden;isolation:isolate;transition:color .4s}
.suite-lien::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--encre);clip-path:circle(0% at var(--cx,50%) var(--cy,50%));transition:clip-path .7s var(--ease)}
.suite-lien:hover{color:var(--papier)}
.suite-lien:hover::before{clip-path:circle(150% at var(--cx,50%) var(--cy,50%))}
.suite-suiv{text-align:right}
.suite-sens{font-size:14px;font-weight:700;color:var(--gris)}
.suite-lien:hover .suite-sens{color:var(--braise-vif)}
.suite-titre{font-family:var(--serif);font-size:clamp(22px,2.2vw,30px);line-height:1.15}

/* ---------- pages simples ---------- */
.lecture-colonne{padding:20px var(--marge) 40px;max-width:1100px;margin:0 auto}
.contact-mail a{font-family:var(--serif);font-size:clamp(30px,5vw,60px);text-decoration:none;color:var(--braise-texte);word-break:break-word;
  background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size .6s var(--ease)}
.contact-mail a:hover{background-size:100% 2px}

/* ---------- recherche ---------- */
.recherche{position:fixed;inset:0;z-index:95;background:rgba(23,20,28,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:start center;padding:12vh 16px 20px}
.recherche[hidden]{display:none}
.recherche-boite{width:min(720px,100%);background:var(--papier-3);border-radius:var(--rayon);box-shadow:0 40px 80px -20px rgba(0,0,0,.5);overflow:hidden;animation:monte .4s var(--ease);transform:translateY(10px);opacity:0}
.recherche-champ{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--trait)}
.recherche-champ svg{width:22px;height:22px;fill:none;stroke:var(--gris);stroke-width:2;stroke-linecap:round;flex:none}
.recherche-champ input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:19px;outline:0;color:var(--encre)}
.recherche-champ kbd{font:inherit;font-size:12px;color:var(--gris);padding:3px 8px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--trait)}
.recherche-resultats{list-style:none;margin:0;padding:8px;max-height:60vh;overflow:auto}
.recherche-resultats a{display:block;padding:12px 14px;border-radius:12px;text-decoration:none}
.recherche-resultats a:hover,.recherche-resultats a:focus{background:var(--papier-2);outline:0}
.recherche-resultats b{display:block;font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.2}
.recherche-resultats small{color:var(--gris);font-weight:600}
.recherche-resultats mark{background:rgba(242,181,68,.45);color:inherit;border-radius:3px}

/* ---------- pied ---------- */
.pied{background:var(--encre);color:var(--papier);margin:clamp(40px,6vw,80px) clamp(8px,1.5vw,20px) 0;border-radius:var(--rayon-l) var(--rayon-l) 0 0;padding:clamp(60px,8vw,100px) var(--marge) 30px;overflow:hidden}
.aimant+.pied{margin-top:12px}
h1 em,h2 em,h3 em{font-style:inherit;color:inherit}
.pied-grille{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:34px;max-width:var(--large);margin:0 auto;padding-bottom:40px;border-bottom:1px solid var(--trait-clair)}
.pied-grille p{color:#c9bfb3;margin:0;max-width:40ch}
.pied-grille a{display:block;text-decoration:none;color:#d9d0c5;padding:4px 0;transition:color .2s, transform .3s var(--ease)}
.pied-grille a:hover{color:var(--braise-vif);transform:translateX(4px)}
.pied-titre{font-size:15px!important;font-weight:700;color:var(--gris-clair)!important;margin-bottom:14px!important}
.pied-bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;max-width:var(--large);margin:0 auto;padding-top:24px;font-size:14px;color:#a79e94}
.ic-copyright a{color:inherit}

/* ---------- encart glissant (livre offert) ---------- */
.encart{position:fixed;right:18px;bottom:18px;z-index:75;display:flex;gap:14px;align-items:center;width:min(340px,calc(100% - 36px));padding:14px 40px 14px 14px;
  background:var(--encre);color:var(--papier);border-radius:20px;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);transform:translateY(140%);transition:transform .7s var(--ease)}
.encart.visible{transform:none}
.encart img{width:64px;height:auto;flex:none;filter:drop-shadow(0 8px 12px rgba(0,0,0,.5));rotate:-6deg}
.encart-sur{margin:0;font-size:13px;font-weight:700;color:var(--miel)}
.encart-titre{margin:2px 0 6px;font-family:var(--serif);font-size:22px;line-height:1.1}
.encart-lien{font-weight:700;font-size:14px;text-decoration:none;border-bottom:1.5px solid var(--braise-vif)}
.encart-fermer{position:absolute;right:8px;top:8px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(244,237,226,.1);color:var(--papier);font-size:18px;line-height:1}

/* ---------- apparitions au défilement ---------- */
.js .rv{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease), transform 1.1s var(--ease);transition-delay:var(--rd,0s)}
.js .rv.zoom{transform:scale(.92)}
.js .rv.vu{opacity:1;transform:none}
.js .surtitre.rv{--trait:0}
.js .surtitre.rv.vu{--trait:1}
.js .volet{clip-path:inset(100% 0 0 0 round var(--rayon));transition:clip-path 1.4s var(--ease)}
.js .volet.vu{clip-path:inset(0 0 0 0 round var(--rayon))}
.js .franck-portrait.volet{clip-path:inset(100% 0 0 0 round 240px 240px var(--rayon) var(--rayon))}
.js .franck-portrait.volet.vu{clip-path:inset(0 0 0 0 round 240px 240px var(--rayon) var(--rayon))}
.js .volet img{scale:1.25;transition:scale 1.8s var(--ease)}
.js .volet.vu img{scale:1}

/* ---------- phrase qui s'allume au défilement ---------- */
.manifeste{position:relative;padding:clamp(80px,10vw,140px) var(--marge)}
.manifeste-cadre{max-width:1180px;margin:0 auto}
.manifeste-texte{margin:0}
.manifeste-texte p{font-family:var(--serif);font-size:clamp(40px,6.4vw,104px);line-height:1.02;letter-spacing:-.025em;margin:0;text-wrap:balance}
.manifeste-texte .m{opacity:var(--o,1);transition:opacity .25s linear}
.manifeste-source{display:inline-block;margin-top:34px;font-weight:700;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:3px;color:var(--braise-texte)}
.epingle .manifeste{height:190vh;padding:0 var(--marge)}
.epingle .manifeste-cadre{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center}
.epingle .manifeste-cadre{pointer-events:none}
.epingle .manifeste-cadre a{pointer-events:auto}
.epingle .section:has(+ .manifeste){padding-bottom:40px}

/* ---------- article : l'écran s'élargit, la question se signe ---------- */
.article-ecran .ecran{transform:scale(var(--ez,1));transition:transform .2s linear}
.et-vous{background-image:linear-gradient(var(--braise),var(--braise));background-repeat:no-repeat;background-position:0 0;background-size:5px 0%;transition:background-size 1.2s var(--ease)}
.et-vous.vu,html:not(.js) .et-vous{background-size:5px 100%}

/* ---------- transitions de page (navigateurs qui savent) ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:.35s var(--ease) both sort}
::view-transition-new(root){animation:.55s var(--ease) both entre}
::view-transition-group(video){animation-duration:.6s;animation-timing-function:var(--ease)}
@keyframes sort{to{opacity:0;transform:translateY(-14px)}}
@keyframes entre{from{opacity:0;transform:translateY(20px)}}

/* ---------- tailles ---------- */
@media (max-width:1100px){
  .bento{grid-template-columns:repeat(2,1fr)}
  .chiffres{grid-template-columns:repeat(2,1fr)}
  .chiffre:nth-child(3){border-left:0}
  .chiffre{border-top:1px solid var(--trait)}
  .pied-grille{grid-template-columns:1fr 1fr}
  .glissiere{grid-auto-columns:minmax(260px,40%)}
}
@media (max-width:900px){
  .nav{display:none}
  .burger{display:grid}
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:120px;gap:30px}
  .hero-scene{height:min(110vw,520px)}
  .franck-grille,.aimant-grille{grid-template-columns:1fr}
  .franck-visuel{max-width:520px}
  .aimant-livre{max-width:260px}
  .themes-liste a{grid-template-columns:1fr 30px}
  .theme-compte{display:none}
  .apercu-flottant{display:none}
}
@media (max-width:640px){
  body{font-size:16px}
  .marque-nom{font-size:22px}
  .entete{top:10px;gap:8px}
  .bento{grid-template-columns:1fr}
  .bento-1{grid-column:auto;grid-row:auto}
  .bento-1 .carte-lecture{width:58px;height:58px}
  .bento-1 .carte-lecture::before{border-left-width:15px;border-top-width:10px;border-bottom-width:10px}
  .chiffre{padding:24px 14px}
  .suite{grid-template-columns:1fr}
  .suite-suiv{text-align:left}
  .ecran .lecture{width:70px;height:70px}
  .ecran .lecture::before{border-left-width:20px;border-top-width:12px;border-bottom-width:12px;margin-left:6px}
  .ecran-note{display:none}
  .et-vous{padding:26px 22px 22px}
  .pied-grille{grid-template-columns:1fr}
  .glissiere{grid-auto-columns:78%}
  .aimant-champs{border-radius:22px}
  .aimant-champs .bouton{width:100%;justify-content:center}
}
@media (max-width:420px){
  .marque-sous{display:none}
}

/* ---------- moins d'animations ---------- */

/* ---------- accueil : le livre offert dès le haut de page ---------- */
.hero-livre{display:flex;gap:22px;align-items:center;max-width:600px;padding:18px 22px 16px 18px;border-radius:var(--rayon);background:var(--papier-3);box-shadow:0 1px 0 var(--trait),0 18px 40px -24px rgba(23,20,28,.35)}
.hero-livre-couv{flex:none;width:96px}
.hero-livre-couv img{width:100%;height:auto;border-radius:4px;filter:drop-shadow(0 10px 14px rgba(23,20,28,.28))}
.hero-livre-corps{flex:1;min-width:0}
.hero-livre-titre{font-family:var(--serif);font-size:clamp(22px,1.9vw,27px);line-height:1.1;margin:0 0 10px}
.hero-livre-etiquette{display:block;font-size:14px;font-weight:700;margin:0 0 6px}
.hero-livre-champs{display:flex;gap:8px;flex-wrap:wrap}
.hero-livre-champs input{flex:1 1 200px;min-width:0;font:inherit;padding:12px 16px;border-radius:999px;border:0;background:var(--papier);box-shadow:inset 0 0 0 1px var(--trait);color:var(--encre)}
.hero-livre-champs input:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--braise)}
.hero-livre-champs .bouton{padding:12px 20px}
.hero-livre-accord{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0;font-size:13px;color:var(--encre-3);cursor:pointer;line-height:1.4}
.hero-livre-accord input{accent-color:var(--braise);width:16px;height:16px;margin-top:1px;flex:none}
.hero-livre .aimant-message{margin:6px 0 0;font-size:14px;color:var(--braise-texte);min-height:0}
.hero-lien{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-weight:700;color:var(--encre);text-decoration:none;border-bottom:1px solid var(--trait);padding-bottom:2px}
.hero-lien:hover{border-color:currentColor}
.hero-lien svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.aimant-papier a{color:var(--miel)}

/* ---------- les livres ---------- */
.livres{display:grid;gap:clamp(60px,8vw,110px);max-width:1080px}
.livre{display:grid;grid-template-columns:minmax(200px,320px) 1fr;gap:clamp(30px,5vw,70px);align-items:center}
.livre:nth-child(even){grid-template-columns:1fr minmax(200px,320px)}
.livre:nth-child(even) .livre-visuel{order:2}
.livre-visuel img{width:100%;height:auto;filter:drop-shadow(0 30px 40px rgba(23,20,28,.3));border-radius:4px}
.livre h2{font-size:clamp(38px,4.4vw,64px);margin:0 0 10px}
.livre-sous{font-family:var(--serif);font-size:clamp(20px,1.8vw,26px);color:var(--encre-3);margin:0 0 18px}
.livre-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* ---------- fin d'article : pour aller plus loin ---------- */
.aller-loin{max-width:880px;margin:clamp(40px,6vw,70px) auto 0;padding:0 var(--marge)}
.aller-loin-grille{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.aller-loin-carte{display:flex;gap:18px;align-items:center;padding:20px;border-radius:var(--rayon);background:var(--papier-3);box-shadow:inset 0 0 0 1px var(--trait);
  text-decoration:none;color:var(--encre);transition:box-shadow .3s,transform .4s var(--ease)}
.aller-loin-carte:hover{box-shadow:inset 0 0 0 1.5px var(--encre);transform:translateY(-3px)}
.aller-loin-carte picture{flex:none;width:76px}
.aller-loin-carte img{width:100%;height:auto;border-radius:3px;box-shadow:0 10px 18px -8px rgba(23,20,28,.4)}
.aller-loin-carte>span{display:flex;flex-direction:column;gap:4px;min-width:0}
.aller-loin-carte small{font-size:13px;font-weight:700;color:var(--braise-texte)}
.aller-loin-carte strong{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.4vw,30px);line-height:1.05}
.aller-loin-carte em{font-style:normal;color:var(--encre-3);font-size:15px;line-height:1.4}
.aller-loin-carte b{margin-top:6px;font-size:14px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--trait)}
.aller-loin-formation{background:var(--encre);color:var(--papier);box-shadow:none}
.aller-loin-formation:hover{box-shadow:inset 0 0 0 1.5px var(--miel)}
.aller-loin-formation small{color:var(--braise-vif)}
.aller-loin-formation em{color:#d9d0c5}
.aller-loin-formation b{text-decoration-color:var(--trait-clair)}
.aller-loin-grille>:only-child{grid-column:1/-1}
.livres-suite{font-family:var(--serif);font-size:clamp(24px,2.4vw,32px);margin:0;border-top:1px solid var(--trait);padding-top:40px}
.livres-suite a{color:var(--braise-texte)}

/* ---------- les formations ---------- */
.formations{display:grid;gap:clamp(56px,7vw,90px)}
.famille{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:clamp(24px,4vw,60px);align-items:start;scroll-margin-top:100px}
.famille h2{font-size:clamp(34px,3.4vw,48px);position:sticky;top:110px;margin:0}
.famille-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--trait)}
.famille-liste a{display:grid;grid-template-columns:1fr auto;gap:4px 24px;padding:22px 4px;border-bottom:1px solid var(--trait);text-decoration:none;color:var(--encre);transition:background .3s,padding .4s var(--ease)}
.famille-liste a:hover{background:var(--papier-3);padding-left:16px;padding-right:16px}
.famille-liste a.avec-image{grid-template-columns:132px 1fr auto;column-gap:22px}
.formation-image{grid-row:1/span 2;align-self:center;display:block;width:132px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--trait)}
.formation-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.formation-image.entiere img{object-fit:contain}
.famille-liste a:hover .formation-image img{transform:scale(1.06)}
.avec-image .formation-titre,.avec-image .formation-sujet{grid-column:2}
.avec-image .formation-voir{grid-column:3}
.formation-titre{font-family:var(--serif);font-size:clamp(24px,2.2vw,30px);line-height:1.1}
.formation-sujet{grid-column:1;color:var(--encre-3);font-size:15px}
.formation-voir{grid-column:2;grid-row:1/span 2;align-self:center;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px;color:var(--braise-texte)}
.formation-voir svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;transition:transform .3s}
.famille-liste a:hover .formation-voir svg{transform:translate(2px,-2px)}
@media (max-width:640px){
  .hero-livre{flex-direction:column;align-items:flex-start;padding:18px}
  .hero-livre-couv{width:80px}
  .hero-livre-champs .bouton{width:100%;justify-content:center}
  .livre,.livre:nth-child(even){grid-template-columns:1fr}
  .livre:nth-child(even) .livre-visuel{order:0}
  .livre-visuel{max-width:240px}
  .aller-loin-grille{grid-template-columns:1fr}
  .famille{grid-template-columns:1fr}
  .famille h2{position:static}
  .famille-liste a{grid-template-columns:1fr}
  .famille-liste a.avec-image{grid-template-columns:96px 1fr;column-gap:16px}
  .formation-image{width:96px;grid-row:1/span 3;align-self:start}
  .avec-image .formation-voir{grid-column:2}
  .formation-voir{grid-column:1;grid-row:auto;margin-top:6px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .rv,.js .entree,.js .ligne>span,.js .mot>span,.js .pile-portrait,.js .pile-carte{opacity:1!important;transform:none!important;translate:none!important;scale:none!important}
  .js .volet{clip-path:none!important}
  .js .volet img{scale:1!important}
  .js .surligne{background-size:100% .16em}
  .js [data-cadre] img{scale:1!important}
  .manifeste-texte .m{opacity:1!important}
  .article-ecran .ecran{transform:none!important}
  .et-vous{background-size:5px 100%!important}
  .aimant-livre picture{transform:none!important}
  @view-transition{navigation:none}
}

/* ---------- franckmarcheix : accueil d'auteur ---------- */
.fm-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(30px,5vw,80px);
  padding:clamp(120px,14vh,160px) var(--marge) clamp(60px,8vw,110px);max-width:none;margin:0}
.fm-hero-texte{max-width:640px;justify-self:end}
.fm-nom{font-size:clamp(64px,9vw,148px);line-height:.86;letter-spacing:-.035em;margin:0 0 32px;font-weight:400}
.fm-chapo{font-size:clamp(17px,1.4vw,20px);color:rgba(242,240,235,.78);max-width:56ch;margin:0 0 34px}
.fm-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px 30px}
.fm-actions .hero-lien{color:var(--papier)}
.fm-hero-photo{margin:0;border-radius:var(--rayon-l);overflow:hidden;aspect-ratio:4/5;max-height:78vh;box-shadow:0 60px 120px -40px rgba(43,70,212,.55)}
.fm-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:62% 30%}

.fm-parcours .section-tete h2{max-width:20ch}
.fm-etapes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.fm-etapes li{border-top:2px solid var(--encre);padding-top:26px}
.fm-etape-quand{font-weight:700;font-size:14px;color:var(--braise-texte);margin:0 0 10px;letter-spacing:.02em}
.fm-etapes h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,2.8vw,40px);line-height:1.05;margin:0 0 14px}
.fm-etapes p{margin:0 0 14px;color:var(--encre-3)}
.fm-liens{display:flex;flex-wrap:wrap;gap:8px 18px}
.fm-liens a{font-weight:700;color:var(--braise-texte);text-decoration:none;border-bottom:1.5px solid currentColor}

.fm-dealer{border-radius:var(--rayon-l);margin:0 clamp(8px,1.5vw,20px);padding:clamp(80px,10vw,140px) var(--marge)}
.fm-dealer-grille{max-width:var(--large);margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,6vw,90px);align-items:center}
.fm-dealer h2{font-size:clamp(48px,6vw,92px);line-height:.95;margin:0 0 26px}
.fm-grand{font-family:var(--serif);font-size:clamp(26px,2.6vw,36px);line-height:1.15;color:var(--papier);margin:0 0 24px}
.fm-dealer p{color:rgba(242,240,235,.78)}
.fm-methodes{list-style:none;margin:26px 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.fm-methodes li{border:1px solid var(--trait-clair);border-radius:999px;padding:8px 16px;font-size:15px;color:var(--papier)}
.fm-dealer .bouton{margin-top:10px}
.fm-dealer-photo{margin:0}
.fm-dealer-photo img{border-radius:var(--rayon);width:100%;aspect-ratio:870/640;object-fit:cover}
.fm-dealer-photo figcaption{margin-top:16px;font-size:15px;color:rgba(242,240,235,.62);max-width:46ch}

.fm-inception-grille{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:start}
.fm-inception h2{font-size:clamp(48px,6vw,92px);line-height:.95;margin:0 0 14px}
.fm-role{font-weight:700;color:var(--braise-texte);margin:0}
.fm-inception p{font-size:clamp(17px,1.3vw,19px)}
.fm-citation{margin:30px 0;padding:0 0 0 24px;border-left:3px solid var(--braise)}
.fm-citation p{font-family:var(--serif);font-size:clamp(28px,2.8vw,40px);line-height:1.12;margin:0;color:var(--encre)}

.fm-livres-rangee{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,60px)}
.fm-livre{text-decoration:none;display:flex;flex-direction:column;gap:6px}
.fm-livre picture{display:block;border-radius:8px;overflow:hidden;box-shadow:var(--ombre);margin-bottom:16px;transition:transform .6s var(--ease)}
.fm-livre:hover picture{transform:translateY(-8px) rotate(-1deg)}
.fm-livre img{width:100%;aspect-ratio:352/500;object-fit:cover}
.fm-livre-titre{font-family:var(--serif);font-size:clamp(24px,2vw,30px);line-height:1.1}
.fm-livre-sous{color:var(--gris);font-size:15px}

.fm-temoins{border-radius:var(--rayon-l);margin:0 clamp(8px,1.5vw,20px)}
.fm-temoins-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,30px);align-items:start}
.fm-temoins .ecran{grid-column:span 2;margin:0}
.fm-temoin{margin:0;padding:28px;border:1px solid var(--trait-clair);border-radius:var(--rayon)}
.fm-temoin blockquote{margin:0 0 18px}
.fm-temoin blockquote p{margin:0;font-size:16px;line-height:1.6;color:rgba(242,240,235,.86)}
.fm-temoin-grand blockquote p{font-family:var(--serif);font-size:clamp(22px,1.8vw,27px);line-height:1.22;color:var(--papier)}
.fm-temoin figcaption{font-size:14px;color:rgba(242,240,235,.6);line-height:1.45}
.fm-temoin figcaption strong{display:block;color:var(--papier);font-size:16px;margin-bottom:2px}
.ecran-bunny{background:#000}

.fm-episodes{list-style:none;margin:0;padding:0;border-top:1px solid var(--trait)}
.fm-episodes a{display:grid;grid-template-columns:170px 1fr 28px;gap:20px;align-items:center;padding:22px 6px;border-bottom:1px solid var(--trait);text-decoration:none;transition:padding .4s var(--ease),background .3s}
.fm-episodes a:hover{background:var(--papier-3);padding-left:16px;padding-right:16px}
.fm-episode-date{color:var(--gris);font-size:14px}
.fm-episode-titre{font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:1.15}
.fm-episodes svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}

.fm-formations-grille{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px)}
.fm-formation{text-decoration:none;display:flex;flex-direction:column;gap:6px}
.fm-formation .formation-image{width:100%;margin-bottom:12px;grid-row:auto}
.fm-formation .formation-titre{font-size:clamp(22px,1.8vw,26px)}
.fm-formation:hover .formation-image img{transform:scale(1.06)}

.fm-conversation{border-radius:var(--rayon-l);margin:0 clamp(8px,1.5vw,20px) clamp(8px,1.5vw,20px);padding:clamp(80px,10vw,140px) var(--marge);text-align:center}
.fm-conversation-cadre{max-width:760px;margin:0 auto}
.fm-conversation h2{font-size:clamp(48px,6vw,92px);line-height:.95;margin:0 0 22px}
.fm-conversation p{color:rgba(242,240,235,.78);font-size:clamp(17px,1.4vw,20px);margin:0 0 34px}

.podcast-lecteur{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:1.4em 0;min-height:60px}
.podcast-lecteur a{color:var(--gris);font-size:15px}
.rdv-action{margin:34px 0 8px}
.rdv-note{color:var(--gris);font-size:14px}

@media (max-width:900px){
  .fm-hero{grid-template-columns:1fr;padding-top:110px}
  .fm-hero-texte{justify-self:start}
  .fm-hero-photo{aspect-ratio:4/3;order:-1}
  .fm-etapes,.fm-dealer-grille,.fm-inception-grille{grid-template-columns:1fr}
  .fm-temoins-grille{grid-template-columns:1fr}
  .fm-temoins .ecran{grid-column:auto}
  .fm-formations-grille{grid-template-columns:repeat(2,1fr)}
  .fm-livres-rangee{grid-template-columns:repeat(3,1fr);gap:14px}
  .fm-episodes a{grid-template-columns:1fr 24px;gap:6px 14px}
  .fm-episode-date{grid-column:1}
  .fm-episode-titre{grid-column:1}
  .fm-episodes svg{grid-column:2;grid-row:1/span 2}
}
@media (max-width:560px){
  .fm-livres-rangee{grid-template-columns:1fr 1fr}
  .fm-formations-grille{grid-template-columns:1fr}
}
/* Inception -> livres : un seul souffle, pas deux */
.fm-inception{padding-bottom:clamp(40px,5vw,70px)}
.fm-inception + .fm-livres{padding-top:clamp(40px,5vw,70px)}
/* Couvertures : jamais plus grandes que leur définition (352 px) ne le permet */
.fm-livres-rangee{grid-template-columns:repeat(3,minmax(0,250px));justify-content:start}
@media (max-width:700px){.fm-livres-rangee{grid-template-columns:repeat(2,minmax(0,200px))}}
.fm-livres .section-tete{margin-bottom:32px}
/* Podcast : tous les épisodes du flux, lecteur au clic */
.fm-episode{display:grid;grid-template-columns:190px 1fr auto;gap:8px 24px;align-items:center;padding:20px 6px;border-bottom:1px solid var(--trait)}
.fm-episode .fm-episode-titre{font-size:clamp(20px,1.7vw,25px)}
.fm-episode-duree{color:var(--gris)}
.fm-episode-lecteur{margin:0;min-height:0}
.fm-episode-lecteur:not(:has(button)){grid-column:1/-1;min-height:60px}
.fm-ecouter{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--encre);background:none;color:var(--encre);border-radius:999px;padding:9px 18px 9px 14px;font:inherit;font-size:15px;cursor:pointer;transition:background .3s,color .3s}
.fm-ecouter:hover,.fm-ecouter:focus-visible{background:var(--encre);color:var(--papier)}
.fm-ecouter svg{width:16px;height:16px;fill:currentColor}
.fm-podcast{padding-top:clamp(40px,5vw,70px)}
.fm-podcast-tout{padding-top:0}
@media (max-width:700px){.fm-episode{grid-template-columns:1fr auto}.fm-episode-date,.fm-episode-titre{grid-column:1}.fm-episode-lecteur{grid-column:2;grid-row:1/span 2}}

/* ======================================================================
   Refonte du 05/11 (retour de Franck : trop sombre, trop de vide, sections
   qui se ressemblent). Fond clair, bandes de couleur franches et pleine
   largeur, bleu nuit au lieu du noir, vraies photos récentes.
   ====================================================================== */
:root{--papier:#f5f1e8;--blanc:#ffffff;--nuit:#15225f;--nuit-2:#1d2c73}
.sombre,.pied{background:var(--nuit)}
.pied{margin:0;border-radius:0}
.fond-blanc{background:var(--blanc)}
.fond-creme{background:var(--papier)}
.fond-nuit{background:var(--nuit);color:var(--papier)}
.fm2-section{padding-top:clamp(56px,7vw,100px);padding-bottom:clamp(56px,7vw,100px)}
.fm2-section .section-tete{margin-bottom:clamp(28px,3.5vw,44px)}
.accueil .section-tete h2{font-size:clamp(44px,5.4vw,80px);line-height:.98;margin:0}
.accueil .fm-podcast,.accueil .fm-inception{padding-top:clamp(56px,7vw,100px);padding-bottom:clamp(56px,7vw,100px)}

/* hero clair : texte à gauche, deux photos qui se chevauchent à droite */
.fm2-hero{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:clamp(30px,5vw,80px);
  max-width:calc(var(--large) + 2 * var(--marge));margin:0 auto;padding:clamp(110px,13vh,150px) var(--marge) clamp(50px,6vw,80px)}
.fm2-hero .fm-chapo{color:var(--encre-3)}
.fm2-hero .fm-actions .hero-lien{color:var(--encre)}
.fm2-hero-photos{position:relative;padding:0 0 12% 0}
.fm2-hero-photos figure{margin:0;overflow:hidden;border-radius:var(--rayon-l)}
.fm2-photo-grande{width:88%;margin-left:auto!important;aspect-ratio:4/4.4;box-shadow:0 50px 100px -50px rgba(21,34,95,.55)}
.fm2-photo-grande img{width:100%;height:100%;object-fit:cover;object-position:60% 40%}
.fm2-photo-petite{position:absolute!important;left:0;bottom:0;width:36%;aspect-ratio:3/4.4;border:8px solid var(--papier);border-radius:28px!important;box-shadow:var(--ombre)}
.fm2-photo-petite img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}

/* la salle pleine, sur toute la largeur */
.fm2-salle{margin:0;background:var(--papier)}
.fm2-salle-image img{display:block;width:100%;height:clamp(300px,52vw,760px);object-fit:cover;object-position:50% 45%}
.fm2-salle figcaption{max-width:var(--large);margin:0 auto;padding:18px var(--marge) 26px;color:var(--encre-3);font-size:15px}

/* parcours */
.fm-etapes li{border-top-color:var(--nuit)}

/* Dealer d'Histoires : bande bleu nuit, photos à gauche */
.fm2-dealer{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.fm2-dealer-photos{position:relative;padding-bottom:22%}
.fm2-dealer-photos figure{margin:0;overflow:hidden;border-radius:var(--rayon)}
.fm2-dealer-grande img{width:100%;aspect-ratio:4/3.4;object-fit:cover;object-position:35% 50%}
.fm2-dealer-petite{position:absolute!important;right:-4%;bottom:0;width:52%;border:6px solid var(--nuit);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.fm2-dealer-petite img{width:100%;aspect-ratio:3/2;object-fit:cover}
.fm2-dealer h2{font-size:clamp(48px,5.6vw,84px);line-height:.95;margin:0 0 22px}
.fm2-dealer p{color:rgba(245,241,232,.82)}
.fm2-dealer .fm-grand{color:var(--papier)}
.fm2-dealer .bouton{margin-top:8px}

/* Inception Code : portrait noir et blanc */
.fm2-inception{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.fm2-inception-photo{margin:0;border-radius:var(--rayon);overflow:hidden}
.fm2-inception-photo img{width:100%;aspect-ratio:4/4.2;object-fit:cover;object-position:30% 50%}
.fm2-inception h2{font-size:clamp(48px,5.6vw,84px);line-height:.95;margin:0 0 10px}
.fm2-inception .fm-role{margin-bottom:18px}

/* témoignages */
.fm2-temoins-tete{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(20px,3vw,40px);align-items:center;margin-bottom:clamp(28px,3.5vw,44px)}
.fm2-temoins-tete .ecran{margin:0}
.fm2-temoin-phare{margin:0}
.fm2-temoin-phare blockquote{margin:0 0 18px}
.fm2-temoin-phare p{font-family:var(--serif);font-size:clamp(23px,2vw,30px);line-height:1.2;margin:0}
.fm2-temoin-phare figcaption,.fm2-temoin figcaption{font-size:14px;color:var(--gris);line-height:1.45}
.fm2-temoin-phare strong,.fm2-temoin strong{display:block;color:var(--encre);font-size:16px;margin-bottom:2px}
.fm2-mur{columns:3 300px;column-gap:clamp(16px,2vw,24px)}
.fm2-temoin{break-inside:avoid;margin:0 0 clamp(16px,2vw,24px);padding:24px 26px;background:var(--papier);border-radius:var(--rayon)}
.fond-creme .fm2-temoin,.fm2-temoins-page .fm2-temoin{background:var(--blanc)}
.fm2-temoin blockquote{margin:0 0 14px}
.fm2-temoin p{margin:0;font-size:16px;line-height:1.6;color:var(--encre-2)}
.fm2-temoin-pro p{font-family:var(--serif);font-size:22px;line-height:1.25;color:var(--encre)}
.fm2-temoin:nth-child(3n+2){background:var(--nuit);color:var(--papier)}
.fm2-temoin:nth-child(3n+2) p,.fm2-temoin:nth-child(3n+2) strong{color:var(--papier)}
.fm2-temoin:nth-child(3n+2) figcaption{color:rgba(245,241,232,.66)}
.fm2-mur-suite{text-align:center;margin:clamp(20px,3vw,36px) 0 0}
.fm2-temoins-page{padding-top:0}

/* livres */
.accueil .fm-livres-rangee{grid-template-columns:repeat(3,minmax(0,250px));justify-content:start;gap:clamp(20px,4vw,56px)}

/* appel final : photo + texte */
.fm2-conversation{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:center}
.fm2-conversation-photo{margin:0;border-radius:var(--rayon);overflow:hidden;max-width:420px}
.fm2-conversation-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%}
.fm2-conversation h2{font-size:clamp(48px,5.6vw,84px);line-height:.95;margin:0 0 22px}
.fm2-conversation p{color:rgba(245,241,232,.82);font-size:clamp(17px,1.4vw,20px);margin:0 0 30px;max-width:46ch}

@media (max-width:900px){
  .fm2-hero,.fm2-dealer,.fm2-inception,.fm2-conversation,.fm2-temoins-tete{grid-template-columns:1fr}
  .fm2-hero{padding-top:100px}
  .fm2-hero-photos{max-width:560px}
  .fm2-dealer-petite{right:0}
  .fm2-conversation-photo{max-width:320px}
}
@media (max-width:560px){
  .fm2-photo-petite{width:40%}
  .accueil .fm-livres-rangee{grid-template-columns:repeat(2,minmax(0,200px))}
}
.fm2-photo-grande img{object-position:78% 40%}
.pied{background:#0d1645}
.fm2-photo-grande img{object-position:60% 40%}
.podcast-audio{width:100%;max-width:640px;height:44px}
.fm-episode-lecteur:not(:has(button)){display:block}
.podcast-iframe{display:block;border:0;width:100%;height:200px;border-radius:12px}

/* page de remerciement de l'aimant Dark Vador */
.fm2-merci{max-width:1040px;margin:0 auto;padding-top:clamp(24px,3vw,40px)}
.fm2-merci-suite{text-align:center;margin:40px 0 0}
/* lecteur Dark Vador : affiche maison, la vidéo Bunny ne se charge qu'au clic */
.dv-lecteur{position:relative;aspect-ratio:16/9;border-radius:var(--rayon-l);overflow:hidden;isolation:isolate;
  background:radial-gradient(120% 90% at 18% 85%,#2b46d4 0%,rgba(43,70,212,0) 55%),linear-gradient(135deg,#0b1035 0%,#15225f 60%,#0d1645 100%);
  box-shadow:0 60px 110px -50px rgba(13,22,69,.85),0 0 0 1px rgba(255,255,255,.06) inset}
.dv-photo{position:absolute;inset:0 0 0 auto;width:52%;z-index:0}
.dv-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;transition:transform 1.2s var(--ease);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 22%,#000 50%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.55) 22%,#000 50%)}
.dv-lancer{position:absolute;inset:0;z-index:1;display:flex;align-items:center;width:100%;padding:0 0 0 clamp(24px,6vw,72px);
  border:0;background:none;color:#fff;font:inherit;text-align:left;cursor:pointer}
.dv-texte{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(12px,1.6vw,20px);max-width:56%}
.dv-etiquette{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--braise-vif);
  padding:7px 14px;border-radius:999px;background:rgba(147,166,255,.12);border:1px solid rgba(147,166,255,.3)}
.dv-titre{font-family:var(--serif);font-size:clamp(28px,3.6vw,52px);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.dv-titre em{font-style:italic;color:var(--braise-vif)}
.dv-action{display:inline-flex;align-items:center;gap:16px;margin-top:6px;font-weight:700;font-size:16px}
.dv-rond{position:relative;display:grid;place-items:center;width:clamp(64px,7vw,84px);aspect-ratio:1;border-radius:50%;background:#fff;color:#2b46d4;
  box-shadow:0 18px 40px -12px rgba(0,0,0,.6);transition:transform .45s var(--ease)}
.dv-rond svg{width:38%;height:38%;fill:currentColor;margin-left:8%}
.dv-rond::before,.dv-rond::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid rgba(255,255,255,.55);animation:dv-onde 2.6s ease-out infinite}
.dv-rond::after{animation-delay:1.3s}
@keyframes dv-onde{from{transform:scale(1);opacity:.9}to{transform:scale(1.9);opacity:0}}
.dv-lancer:hover .dv-rond,.dv-lancer:focus-visible .dv-rond{transform:scale(1.08)}
.dv-lecteur:hover .dv-photo img{transform:scale(1.04)}
.dv-lancer:focus-visible{outline:3px solid var(--braise-vif);outline-offset:-6px;border-radius:var(--rayon-l)}
.dv-lecteur iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2;background:#000}
.dv-lecteur.joue{aspect-ratio:16/9}
@media (max-width:700px){
  .dv-lecteur{aspect-ratio:auto;display:flex;flex-direction:column;cursor:pointer}
  .dv-photo{position:relative;inset:auto;width:100%;aspect-ratio:2/3}
  .dv-photo img{object-position:50% 50%;-webkit-mask-image:linear-gradient(0deg,transparent 0%,#000 30%);mask-image:linear-gradient(0deg,transparent 0%,#000 30%)}
  .dv-lancer{position:relative;inset:auto;margin-top:-72px;padding:0 22px 28px}
  .dv-texte{max-width:100%}
  .dv-lecteur.joue{display:block;aspect-ratio:16/9}
}
@media (prefers-reduced-motion:reduce){.dv-rond::before,.dv-rond::after{animation:none;opacity:0}}