/* humanfrontier.ai : gabarit commun du prototype « Trois piliers » (29/09/2026).
   Chargé après style.css (et book.css, programme.css, hub2.css, diagnostic.css selon la page).
   En-tête, menu mobile <details>, fil d'Ariane, bloc Suivant, pied de page en quatre colonnes,
   cartes canoniques, et les sections propres aux nouvelles pages. Aucun JavaScript, aucun style en ligne. */

:root { --marine: #152238; --marine2: #33506E; --gold: #C9A24B; --gold-ink: #8A6A1F; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ext { font-size: .82em; }

/* ---------- liens d'action (un lien par bloc, jamais un bloc entier) ---------- */
.pv-go { display: inline-flex; align-items: center; gap: 6px; padding-block: 10px; font-weight: 600; font-size: 14.5px; color: var(--amber-ink); text-decoration: none; }
.pv-go:hover { color: var(--ink); text-decoration: underline; text-underline-offset: .2em; }
.pv-go .ar { transition: transform .15s; } .pv-go:hover .ar { transform: translateX(3px); }
.pv-sec-link { font-size: 14px; color: var(--text); text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: .25em; }
.pv-sec-link:hover { color: var(--ink); text-decoration-color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .pv-go .ar { transition: none; } }

/* ---------- en-tête ---------- */
.hd { position: relative; z-index: 5; }
.hd .wrap { padding-block: 16px; gap: 12px 28px; flex-wrap: nowrap; }
.hd-nav { display: flex; align-items: center; gap: 22px; }
.hd ul { list-style: none; margin: 0; padding: 0; }
.hd-main, .hd-fam { display: flex; align-items: center; gap: 4px 24px; }
.hd-main a { display: inline-block; color: var(--cream); font-size: 14.5px; padding: 6px 0; box-shadow: inset 0 -2px 0 transparent; }
.hd-main a:hover { color: #FFFFFF; text-decoration: none; box-shadow: inset 0 -2px 0 rgba(233,168,58,.55); }
.hd-main a[aria-current] { color: #FFFFFF; box-shadow: inset 0 -2px 0 var(--amber); }
.hd-main a.hd-btn { border: 1px solid var(--amber); color: var(--amber); padding: 7px 14px; font-weight: 600; box-shadow: none; }
.hd-main a.hd-btn:hover, .hd-main a.hd-btn[aria-current] { background: var(--amber); color: var(--ink); box-shadow: none; }
.hd .hd-fam { border-left: 1px solid rgba(255,255,255,.28); padding-left: 22px; gap: 18px; }
.hd-fam a { color: rgba(244,239,228,.78); font-size: 13px; }
.hd-fam a:hover { color: var(--amber); text-decoration: none; }
.hd .lang { display: inline-block; color: var(--cream); border: 1px solid rgba(255,255,255,.35); padding: 5px 10px; font-size: 12.5px; font-weight: 500; letter-spacing: .04em; }
.hd .lang:hover { border-color: var(--amber); }

/* menu mobile : <details> natif, sans script */
.nav-m { display: none; }
.nav-m summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 14px; border: 1px solid rgba(255,255,255,.4); color: var(--cream); font-size: 14px; font-weight: 500; user-select: none; }
.nav-m summary::-webkit-details-marker { display: none; }
.nav-m summary:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.nav-m-ico { position: relative; width: 18px; height: 2px; background: currentColor; box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor; }
.nav-m[open] summary { background: var(--amber); border-color: var(--amber); color: var(--ink); }
.nav-m[open] .nav-m-ico { background: transparent; box-shadow: none; }
.nav-m[open] .nav-m-ico::before, .nav-m[open] .nav-m-ico::after { content: ""; position: absolute; left: 0; top: 0; width: 18px; height: 2px; background: currentColor; transform: rotate(45deg); }
.nav-m[open] .nav-m-ico::after { transform: rotate(-45deg); }
.nav-m-panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--deep); border-top: 1px solid rgba(255,255,255,.14); border-bottom: 4px solid var(--amber); padding: 6px var(--gutter) 16px; box-shadow: 0 18px 30px -14px rgba(0,0,0,.45); }
.nm-main a { display: flex; align-items: center; min-height: 48px; border-bottom: 1px solid rgba(255,255,255,.12); font-family: var(--serif); font-size: 21px; color: var(--cream); }
.nm-main a:hover { color: var(--amber); text-decoration: none; }
.nm-main a.hd-btn { color: var(--amber); }
.nm-main a[aria-current] { color: #FFFFFF; box-shadow: inset 4px 0 0 var(--amber); padding-left: 14px; }
.nm-fam { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 24px; padding-top: 10px; }
.nm-fam a { display: inline-flex; align-items: center; min-height: 44px; color: rgba(244,239,228,.8); font-size: 14px; }
.nm-fam .lang { min-height: 0; }

@media (max-width: 1079px) {
  .hd-nav { display: none; }
  .nav-m { display: block; }
}

/* ---------- fil d'Ariane ---------- */
.crumbs { background: var(--warm); border-bottom: 1px solid var(--rule); }
.crumbs ol { list-style: none; margin: 0; padding: 10px 0; display: flex; flex-wrap: wrap; align-items: baseline; row-gap: 2px; font-size: 13px; color: var(--muted); }
.crumbs li + li::before { content: "›"; margin: 0 10px; color: var(--faint); }
.crumbs a { color: var(--text); }
.crumbs a:hover { color: var(--ink); }
.crumbs [aria-current] { color: var(--ink); font-weight: 500; }

/* ---------- bloc Suivant ---------- */
.nx { background: var(--cream); border-top: 1px solid var(--rule); }
.nx .wrap { padding-block: 34px 38px; }
.nx-card { border-left: 5px solid var(--amber); padding: 4px 0 4px 22px; display: flex; flex-direction: column; gap: 8px; max-width: 780px; }
.nx-k { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--amber-ink); }
.nx h2 { font-size: clamp(26px, 3vw, 34px); line-height: 1.15; color: var(--ink); }
.nx-p { font-size: 15.5px; line-height: 1.6; color: var(--text); }
.nx-l { margin-top: 6px; }
.nx-go { display: inline-block; background: var(--deep); color: #FFFFFF; font-weight: 600; font-size: 14.5px; padding: 11px 18px; }
.nx-go:hover { background: var(--amber); color: var(--ink); text-decoration: none; }

/* ---------- pied de page en quatre colonnes ---------- */
.ft .wrap { display: block; padding-block: 40px 22px; }
.ft-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 40px; }
.ft-h { font: 600 11px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--amber); margin: 0 0 8px; }
.ft ul { list-style: none; margin: 0; padding: 0; }
.ft li a { display: inline-block; padding: 5px 0; font-size: 14px; color: rgba(255,255,255,.86); }
.ft li a:hover { color: var(--amber); }
.ft .ft-line { border-top: 1px solid rgba(255,255,255,.16); margin-top: 28px; padding-top: 14px; font-size: 12.5px; color: rgba(255,255,255,.62); }
@media (max-width: 900px) { .ft-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .ft-cols { gap: 18px 16px; } .ft .wrap { padding-block: 28px 18px; } .ft li a { display: inline-flex; align-items: center; min-height: 40px; padding: 0; font-size: 13.5px; } .ft .ft-line { margin-top: 18px; } }

/* ---------- cartes canoniques ---------- */
.cc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.cc-grid2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cc { background: #FFFFFF; border: 1px solid var(--rule); border-top: 5px solid var(--deep); padding: 18px 20px 6px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cc.rv { border-top-color: var(--marine); }
.cc.gd { border-top-color: var(--gold); }
.cc .cc-k { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.cc h3 { font-size: 23px; line-height: 1.15; font-weight: 500; color: var(--ink); }
.cc .cc-sub { font-size: 16.5px; line-height: 1.35; font-style: italic; color: var(--text); }
.cc .cc-p { font-size: 14.5px; line-height: 1.6; color: var(--text); }
.cc .cc-p b { color: var(--ink); font-weight: 600; }
.cc .pv-go { margin-top: auto; }
.cc .pv-facts { margin-top: 4px; }
.pv-facts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; border-top: 1px solid var(--rule); margin: 0; }
.pv-facts div { padding: 9px 12px 9px 0; border-bottom: 1px solid var(--rule); display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pv-facts dt { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 500; }
.pv-facts dd { margin: 0; font-size: 14px; line-height: 1.45; color: var(--ink); }
.pv-facts dd b { font-weight: 600; white-space: nowrap; }
@media (max-width: 900px) { .cc-grid { grid-template-columns: minmax(0, 1fr); } .cc-grid2 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- accueil ---------- */
.stance-head .title { margin: 0; }
.more-link { margin-top: 2px; }
.hp-prof { border-top: 1px solid var(--ink); }
.hp-prof .wrap { padding-block: 30px 30px; display: flex; flex-direction: column; gap: 16px; }
.hp-chips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hp-chips li { background: var(--warm); border-top: 3px solid var(--ink); padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hp-chips li.dest { border-top-color: var(--amber); background: #FFF8EA; }
.hp-chips b { font-size: 21px; font-weight: 500; line-height: 1.2; color: var(--ink); }
.hp-links { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 24px; }

.hp-pil { border-top: 1px solid var(--rule); }
.hp-pil .wrap { padding-block: 34px 38px; display: flex; flex-direction: column; gap: 20px; }
.hp-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pil { background: #FFFFFF; border: 1px solid var(--rule); border-top: 5px solid var(--deep); padding: 20px 22px 10px; display: flex; flex-direction: column; gap: 10px; min-width: 0; scroll-margin-top: 12px; }
.pil.p-for { border-top-color: var(--amber); }
.pil.p-gov { border-top-color: var(--marine); }
.pil-k { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--amber-ink); }
.pil-t { font-size: 21px; line-height: 1.3; color: var(--ink); }
.pil-p { font-size: 14.5px; line-height: 1.6; color: var(--text); }
.pil-l { list-style: none; margin: auto 0 0; padding: 6px 0 0; border-top: 1px solid var(--rule); display: flex; flex-wrap: wrap; gap: 0 20px; }
.pil-l a { display: inline-block; padding: 8px 0; font-weight: 600; font-size: 14.5px; color: var(--deep); }
.pil-l a:hover { color: var(--amber-ink); }

.hp-start { border-top: 1px solid var(--rule); }
.hp-start .wrap { padding-block: 34px 38px; display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 16px 64px; align-items: start; }
.hp-start h2 { font-size: 30px; line-height: 1.2; }
.start { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.start li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 24px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--rule); }
.st-who { font-family: var(--serif); font-size: 20px; line-height: 1.3; color: var(--ink); }
.start a { display: inline-block; padding: 6px 0; font-weight: 600; font-size: 14.5px; color: var(--amber-ink); text-align: right; }
.start a:hover { color: var(--ink); }

.hp-book { border-top: 1px solid var(--rule); }
.hp-book .wrap { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 24px 56px; padding-block: 40px; align-items: center; }
.hp-cover { display: block; width: 100%; height: auto; border: 1px solid var(--rule); box-shadow: 10px 10px 0 var(--amber); transform: rotate(-2deg); }
.hp-book-t { display: flex; flex-direction: column; gap: 12px; max-width: 660px; }
.hp-book-t h2 { font-size: 34px; line-height: 1.1; }
.hp-book-t .book-sub { font-size: 21px; line-height: 1.3; font-style: italic; color: var(--ink); margin-top: -4px; }
.hp-book-t p { font-size: 15px; line-height: 1.65; color: var(--text); }
.hp-book-t .bk-actions { display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: center; margin-top: 4px; }

.hp-auth { border-top: 1px solid var(--rule); }
.hp-auth .wrap { padding-block: 34px 30px; display: flex; flex-direction: column; gap: 10px; }
.hp-auth h2 { font-size: 30px; line-height: 1.2; }
.hp-auth p { font-size: 15px; line-height: 1.65; color: var(--text); max-width: 720px; }

@media (max-width: 960px) { .hp-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 800px) {
  .hp-pillars { grid-template-columns: minmax(0, 1fr); }
  .hp-start .wrap { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .start li { grid-template-columns: minmax(0, 1fr); }
  .start a { text-align: left; padding: 4px 0 2px; }
  .st-who { font-size: 19px; }
  .hp-book .wrap { grid-template-columns: minmax(0, 1fr); }
  .hp-cover { width: 150px; }
  .hp-chips b { font-size: 19px; }
}

/* ---------- le modèle ---------- */
.md-hero .wrap { padding-block: 40px 18px; display: flex; flex-direction: column; gap: 14px; }
.md-hero h1 { font-size: clamp(34px, 4.6vw, 52px); line-height: 1.08; text-wrap: balance; }
.md-hero h1::after { content: ""; display: block; width: 72px; height: 5px; background: var(--amber); margin-top: 18px; }
.md-hero .lead { font-size: 16.5px; line-height: 1.65; color: var(--text); max-width: 780px; }
.md-diag .wrap { padding-block: 14px 36px; }
.md-test { border-top: 1px solid var(--rule); }
.md-test .wrap { padding-block: 36px 40px; display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr) minmax(0, 300px); gap: 20px 40px; align-items: start; }
.md-test h2 { font-size: 30px; line-height: 1.2; margin-top: 6px; }
.md-quote { margin: 0; font-size: clamp(23px, 2.6vw, 30px); line-height: 1.28; color: var(--ink); border-left: 4px solid var(--amber); padding-left: 20px; }
.md-strat { display: flex; flex-direction: column; gap: 8px; border-top: 3px solid var(--amber); background: #FFF8EA; padding: 12px 16px 14px; }
.md-strat p:last-child { font-size: 14.5px; line-height: 1.6; color: var(--text); }
.md-manif { border-top: 1px solid var(--rule); }
.md-manif .wrap { padding-block: 32px; display: flex; flex-direction: column; gap: 10px; }
.md-manif h2 { font-size: 28px; line-height: 1.2; }
.md-manif p { font-size: 15.5px; line-height: 1.65; color: var(--text); max-width: 820px; }
.md-cta { border-top: 1px solid var(--rule); }
.md-cta .wrap { padding-block: 26px 36px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
@media (max-width: 900px) { .md-test .wrap { grid-template-columns: minmax(0, 1fr); } }

/* ---------- diagnostic : « Et maintenant » ---------- */
.dg-next { border-top: 1px solid var(--rule); }
.dg-next .wrap { padding-block: 36px 40px; display: flex; flex-direction: column; gap: 18px; }
.dg-next h2 { font-size: 30px; line-height: 1.2; }
.dg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 900px) { .dg-cards { grid-template-columns: minmax(0, 1fr); } }

/* ---------- formation : moyeu, programmes, organisations, formateurs ---------- */
.hb-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }
.pg-sec.hb-card { background: #FFFFFF; border: 1px solid var(--rul); border-top: 5px solid #173D2E; padding: 22px 24px 6px; gap: 10px; }
.pg-sec.hb-card + .hb-card { border-top-color: var(--gold); }
.hb-card h2 { font-size: 26px; line-height: 1.18; color: var(--ink); }
.hb-card .pv-links { margin-top: auto; }
@media (max-width: 800px) { .hb-two { grid-template-columns: minmax(0, 1fr); } }

.pg-form .frow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
.pg-form .frow label { flex-direction: column; align-items: stretch; gap: 5px; font-size: 13px; color: var(--txt); }
.pg-form fieldset.fs-grouped { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 20px; }
.pg-form .fg { display: flex; flex-direction: column; gap: 8px; border-top: 2px solid var(--rul); padding-top: 8px; min-width: 0; }
.pg-form .fg-h { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--mut); font-weight: 600; }
.pg-form label { align-items: flex-start; }
.pg-form label input[type=checkbox] { margin-top: 4px; flex: none; }
@media (max-width: 900px) { .pg-form fieldset.fs-grouped { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .pg-form .frow { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) { .pg-form fieldset.fs-grouped { grid-template-columns: minmax(0, 1fr); } }

.pg-scroll-s { overflow-x: auto; }
.pg-note.pg-price { font-size: 14px; color: var(--ink); font-weight: 500; margin-top: 14px; }

/* « Où il se situe » : le mini-schéma du moyeu */
.mm { --hf: #173D2E; --hf2: #2F6B4F; --rv: #152238; --rv2: #33506E; --gd: #8A6A1F; --gd2: #C9A24B; display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); gap: 18px 22px; align-items: start; }
.mm p { margin: 0; }
.mm .mm-k { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 600; margin-bottom: 8px; }
.mm-mods { display: grid; grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1fr); align-items: stretch; }
.mm-plus { align-self: center; justify-self: center; width: 28px; height: 28px; border: 1.5px solid var(--gd2); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--gd); background: #FFFFFF; font-size: 17px; line-height: 1; }
.mm-box { border: 1px solid var(--rul); border-top: 4px solid var(--hf); background: #FFFFFF; padding: 12px 14px 2px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mm-box.rv { border-top-color: var(--rv); }
.mm-box.gd { border-top-color: var(--gd2); background: #FAF6EC; margin-top: 12px; }
.mm-solo .mm-box { border-top-color: var(--rv2); background: #F1F4F8; }
.mm-box.cur { box-shadow: inset 0 0 0 2px var(--hf); background: #F4F7F5; }
.mm-box.rv.cur, .mm-solo .mm-box.cur { box-shadow: inset 0 0 0 2px var(--rv); background: #F1F4F8; }
.mm-box.gd.cur { box-shadow: inset 0 0 0 2px var(--gd2); background: #FAF6EC; }
.mm .mm-t { display: flex; align-items: center; gap: 8px; }
.mm-t b { font-size: 19px; font-weight: 500; line-height: 1.2; color: var(--ink); }
.mm .mm-d { font-size: 13.5px; line-height: 1.45; color: var(--txt); }
.mm-this { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; font-weight: 600; color: var(--acc); padding: 9px 0 11px; }
.mm-box .pv-go { padding-block: 8px; font-size: 14px; }
.mm .pv-num { flex: none; }
@media (max-width: 720px) {
  .mm { grid-template-columns: minmax(0, 1fr); }
  .mm-mods { grid-template-columns: minmax(0, 1fr); row-gap: 8px; }
}

.tr-kit { background: #FFF8EA; border-left: 5px solid var(--amb); padding: 20px 24px; display: flex; flex-direction: column; gap: 10px; }
.tr-kit h2 { font-size: 26px; line-height: 1.18; color: var(--c1); }
.pv-page .tr-kit p { max-width: 760px; }
.pv-page .or-contact { margin-top: 30px; }
.pv-page .or-contact .btn { color: var(--ink); }

/* ---------- à propos ---------- */
.ab h1 { font-size: clamp(32px, 4vw, 42px); line-height: 1.12; }
.ab-fam .wrap { padding-block: 34px 36px; display: flex; flex-direction: column; gap: 16px; }
.ab-fam h2, .ab-contact h2 { font-size: 30px; line-height: 1.2; }
.fam { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.fam li { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr) auto; gap: 2px 24px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.fam b { font-size: 22px; font-weight: 500; color: var(--ink); }
.fam span { font-size: 15px; color: var(--text); }
.fam a { font-weight: 600; font-size: 14.5px; color: var(--deep); }
.ab-contact { border-top: 1px solid var(--rule); }
.ab-contact .wrap { padding-block: 30px 38px; display: flex; flex-direction: column; gap: 14px; }
@media (max-width: 640px) { .fam li { grid-template-columns: minmax(0, 1fr); } }

/* le lien de langue et les liens sortants ne cassent jamais la mise en page mobile */
@media (max-width: 480px) {
  .hd .brand .disp { font-size: 21px; }
  .pv-page .pv-links { gap: 0 18px; }
}

/* le modèle : le schéma garde une taille lisible sur grand écran */
.md-diag .diagram { max-width: 900px; }
/* le livre : un lien sortant garde son seul ↗, sans la flèche ajoutée par book.css */
.bk-further a:has(.ext)::after { content: none; }

/* ===== Passe après le test utilisateurs (29/09/2026) ===== */
/* en-tête collant sur mobile : overflow-x: clip ne crée pas de conteneur de défilement (hidden casserait sticky) */
body { overflow-x: clip; }
@media (max-width: 1079px) {
  .hd { position: sticky; top: 0; z-index: 30; }
  .nav-m-panel { max-height: calc(100vh - 76px); overflow-y: auto; }
}
.hd .lang, .nm-fam .lang { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; }
.hd-fam .lang { min-height: 34px; }

/* accueil : bouton du diagnostic dès le premier écran mobile */
.stance .stance-cta { display: none; }
@media (max-width: 1079px) {
  .stance .stance-cta { display: flex; gap: 8px; }
  .stance .stance-cta .fine { color: rgba(255,255,255,.72); }
}
/* accueil : sur petit écran, les trois zones en liste plutôt qu'un schéma coupé */
.zones-m { display: none; }
@media (max-width: 600px) {
  .hp-diag .diagram-scroll, .hp-diag .scroll-hint { display: none; }
  .zones-m { display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
  .zones-m li { display: flex; flex-direction: column; gap: 1px; padding: 9px 0 9px 12px; border-bottom: 1px solid var(--rule); border-left: 3px solid var(--rule); }
  .zones-m li:nth-child(2) { border-left-color: var(--green); background: rgba(47,107,79,.05); }
  .zones-m b { font-size: 19px; font-weight: 400; color: var(--ink); }
  .zones-m span { font-size: 13px; color: var(--muted); }
}
.hp-chips a { font-size: 21px; font-weight: 500; line-height: 1.2; color: var(--ink); text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: .2em; }
.hp-chips a:hover { color: var(--amber-ink); text-decoration-color: currentColor; }
@media (max-width: 560px) { .hp-chips a { font-size: 19px; } }

/* pages programme : « Où il se situe » en haut, blocs communs repliés, tableaux empilés sur mobile */
.pg-situer { padding-top: 26px; }
.pg-fold { gap: 0; padding-top: 26px; }
.pg-fold details { border-top: 1px solid var(--rul); }
.pg-fold details:last-child { border-bottom: 1px solid var(--rul); }
.pg-fold summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 52px; padding-block: 8px; font-size: 22px; line-height: 1.2; color: var(--c1); }
.pg-fold summary::-webkit-details-marker { display: none; }
.pg-fold summary::after { content: "+"; font-family: var(--sans); font-size: 22px; color: var(--acc); flex: none; }
.pg-fold details[open] summary::after { content: "−"; }
.pg-fold summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.pg-fold details > p, .pg-fold details > ul { margin: 0 0 16px; }
@media (max-width: 600px) {
  .pg-table.pg-stack thead { display: none; }
  .pg-table.pg-stack, .pg-table.pg-stack tbody { display: block; }
  .pg-table.pg-stack tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--rul); }
  .pg-table.pg-stack td { border: 0; padding: 0; }
  .pg-table.pg-stack td:first-child { grid-column: 1; }
  .pg-table.pg-stack td.t { grid-column: 2; white-space: normal; text-align: right; max-width: 150px; }
  .pg-table.pg-stack td:last-child { grid-column: 1 / -1; }
  .pg-table.pg-stack td:last-child:empty { display: none; }
  .pg-table.pg-stack tr.key { background: var(--tint); padding-inline: 8px; }
  .pg-table.pg-stack tr.key td { background: none; }
}
/* le moyeu : tuiles de certificats de même hauteur visuelle */
.pv-chips li { min-height: 76px; justify-content: flex-end; }

/* diagnostic : « Et maintenant » juste sous le résultat, affiché avec lui (le script n'est pas modifié) */
#result[hidden] + .dg-next { display: none; }
.diag .dg-next { display: flex; flex-direction: column; gap: 16px; border-top: 1px solid var(--rule); padding-top: 22px; }
.dg-news form { display: flex; flex-direction: column; gap: 8px; }
.dg-news label { font-size: 13px; color: var(--text); }
.dg-news .field { display: flex; gap: 8px; flex-wrap: wrap; }
.dg-news input[type=email] { flex: 1 1 160px; min-width: 0; font: 500 14.5px/1.3 var(--sans); color: var(--ink); background: #FFFFFF; border: 1px solid var(--rule); border-radius: 0; padding: 10px 12px; }
.dg-news button { font: 600 14.5px/1.3 var(--sans); background: var(--amber); color: var(--ink); border: 1px solid var(--amber); border-radius: 0; padding: 10px 16px; cursor: pointer; }
.dg-news button:hover { background: var(--deep); border-color: var(--deep); color: #FFFFFF; }
.dg-news .consent { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; line-height: 1.5; }
.dg-news .consent input { flex: none; margin: 3px 0 0; }
.dg-news .fine { font-size: 12px; }
.loop button { background: var(--amber); border-color: var(--amber); color: var(--ink); font-weight: 600; }
.loop button:hover { background: var(--deep); border-color: var(--deep); color: #FFFFFF; }
@media (max-width: 1079px) { html { scroll-padding-top: 84px; } }

/* ===== Passe 3 (29/09/2026) : page Formation recomposée ===== */
.fx .fx-hero h1 { font-size: clamp(32px, 4.4vw, 50px); max-width: 980px; }
.fx .fx-hero .intro { font-size: 16.5px; max-width: 820px; }
.fx .fx-jump { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.fx .fx-jump a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid rgba(244,239,228,.45); color: #F4EFE4; font-size: 14px; font-weight: 500; }
.fx .fx-jump a:hover { background: var(--amb); border-color: var(--amb); color: var(--ink); text-decoration: none; }
.fx-sec { padding-top: 56px; scroll-margin-top: 16px; }
.fx .fx-num { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--mut); }
.fx .fx-num b { width: 36px; height: 36px; border-radius: 50%; background: var(--ink); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font: 500 19px/1 var(--serif); letter-spacing: 0; }
.fx-head { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.fx-head h2 { font-size: clamp(28px, 3.3vw, 40px); line-height: 1.1; color: var(--ink); max-width: 900px; text-wrap: balance; }
.fx .fx-strap { font-size: 23px; font-style: italic; color: var(--amb-ink); }
.fx .fx-lede { font-size: 15.5px; line-height: 1.65; color: var(--txt); max-width: 900px; }

.fx-card { background: #FFFFFF; border: 1px solid var(--rul); border-top: 6px solid #173D2E; border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 22px 44px -30px rgba(20,22,26,.5); min-width: 0; }
.fx-card.rv { border-top-color: #152238; }
.fx-card.gd { border-top-color: #C9A24B; }
.fx-wide { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
.fx-wide .fx-media { padding: 28px; background: #F1F4F8; display: flex; flex-direction: column; justify-content: flex-start; }
.fx-wide.gd { background: #FFFDF7; border-color: #E3D3A6; }
.fx-wide.gd .fx-media { background: linear-gradient(160deg, #F6ECD2 0%, #EEDDB0 100%); }
.vg { display: block; border-radius: 4px; overflow: hidden; box-shadow: 0 16px 30px -16px rgba(10,16,28,.6); transition: transform .2s ease, box-shadow .2s ease; }
.vg svg { display: block; width: 100%; height: auto; }
.vg:hover { transform: translateY(-3px); box-shadow: 0 22px 36px -16px rgba(10,16,28,.65); }
.vg:focus-visible { outline: 3px solid var(--amb); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .vg { transition: none; } .vg:hover { transform: none; } }
.fx-ab .fx-media .vg { border-radius: 0; box-shadow: none; }
.fx-ab .fx-media .vg:hover { transform: none; filter: brightness(1.08); }
.fx-body { padding: 26px 30px 28px; display: flex; flex-direction: column; gap: 14px; flex: 1; }
.fx .fx-k { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; font-size: 11px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); }
.fx .fx-st { background: #FFF3DA; border: 1px solid var(--amb); color: var(--amb-ink); padding: 3px 9px; letter-spacing: .1em; }
.fx .fx-t { font-size: clamp(28px, 2.9vw, 36px); line-height: 1.08; font-weight: 500; color: var(--ink); }
.fx .fx-hook { font-size: 20px; line-height: 1.38; font-style: italic; color: var(--ink); }
.fx-blk { display: flex; flex-direction: column; gap: 5px; }
.fx .fx-l { font-size: 10.5px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--acc); }
.fx .fx-card.rv .fx-l { color: #33506E; } .fx .fx-card.hf .fx-l { color: #2F6B4F; } .fx .fx-card.gd .fx-l { color: #8A6A1F; }
.fx .fx-blk p { font-size: 14.5px; line-height: 1.6; color: var(--txt); }
.fx .fx-gets li { position: relative; padding-left: 18px; font-size: 14.5px; line-height: 1.5; color: var(--ink); font-weight: 500; margin-bottom: 5px; }
.fx .fx-gets li::before { content: ""; position: absolute; left: 1px; top: .55em; width: 7px; height: 7px; background: var(--amb); }
.fx .fx-why { background: #FFF8EA; border-left: 4px solid var(--amb); padding: 12px 16px; }
.fx .fx-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.fx .fx-pills li { font-size: 12.5px; line-height: 1.35; color: var(--ink); background: #F6F4EF; border: 1px solid var(--rul); border-radius: 999px; padding: 6px 12px; }
.fx-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; }
.fx-facts div { background: #F1F4F8; border-radius: 4px; padding: 10px 12px; display: flex; flex-direction: column; gap: 3px; }
.fx-facts dt { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #33506E; }
.fx-facts dd { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink); }
.fx .fx-price { font-size: 14px; font-weight: 600; color: var(--ink); }
.fx .fx-btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 6px; }
.fx .fx-btns .btn { font-size: 15px; padding: 13px 22px; }
.fx .fx-btns .btn.outline { padding: 12px 20px; }
.fx-ab { display: grid; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); align-items: stretch; }
.fx-ab > .fx-card:last-child { grid-column: 3; }
.fx .fx-then { align-self: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.fx-then span { display: flex; align-items: center; justify-content: center; }
.fx-then-a, .fx-then-b { width: 34px; height: 34px; border-radius: 50%; color: #FFFFFF; font: 500 18px/1 var(--serif); }
.fx-then-a { background: #173D2E; } .fx-then-b { background: #152238; }
.fx-then-ar { font-size: 26px; color: var(--gd2, #C9A24B); line-height: 1; }
.fx-compact { display: flex; flex-direction: column; gap: 22px; }
.fx-cert { background: #FFFFFF; border: 1px solid var(--rul); border-radius: 6px; padding: 24px 26px; display: flex; flex-direction: column; gap: 12px; }
.fx-cert h2 { font-size: 26px; line-height: 1.2; color: var(--ink); }
.fx .fx-cert p { font-size: 14.5px; line-height: 1.6; color: var(--txt); max-width: 860px; }
.fx .fx-cert .pv-chips li { min-height: 0; font-size: 16px; padding: 10px 14px; }
.fx .hb-two { margin-top: 0; }
@media (max-width: 960px) {
  .fx-wide { grid-template-columns: minmax(0, 1fr); }
  .fx-wide .fx-media { padding: 0; }
  .fx-wide .vg { border-radius: 0; box-shadow: none; }
  .fx-ab { grid-template-columns: minmax(0, 1fr); row-gap: 8px; }
  .fx-ab > .fx-card:last-child { grid-column: 1; }
  .fx .fx-then { flex-direction: row; padding: 6px 0; }
  .fx-then-ar { transform: rotate(90deg); }
}
@media (max-width: 600px) {
  .fx-body { padding: 20px 18px 22px; }
  .fx-facts { grid-template-columns: minmax(0, 1fr); }
  .fx .fx-btns .btn { flex: 1 1 100%; text-align: center; }
  .fx .fx-hook { font-size: 18.5px; }
  .fx-sec { padding-top: 44px; }
}

/* ===== Passe 3 : page Livre, page de promotion ===== */
.bp-hero.band { background: radial-gradient(120% 90% at 20% 30%, #21553F 0%, #173D2E 55%, #10301F 100%); color: var(--cream); border-bottom: 4px solid var(--amber); }
.bp-hero .wrap { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 40px 84px; align-items: center; padding-block: 64px 70px; }
.bp-cover { justify-self: center; width: min(380px, 80vw); }
.bp-cover img { display: block; width: 100%; height: auto; transform: rotate(-2.5deg); box-shadow: 0 34px 60px -20px rgba(0,0,0,.6), 16px 16px 0 rgba(233,168,58,.92); }
.bp-hero-t { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.bp-hero .lbl { color: var(--amber); font-size: 12px; }
.bp-hero h1 { font-size: clamp(50px, 7vw, 86px); line-height: .98; color: #FFFFFF; letter-spacing: -.01em; }
.bp-sub { font-size: clamp(23px, 2.7vw, 32px); line-height: 1.2; font-style: italic; color: #FFFFFF; max-width: 620px; }
.bp-sub em { color: var(--amber); }
.bp-hook { font-size: 17px; line-height: 1.65; color: rgba(255,255,255,.86); max-width: 620px; }
.bp-cta { margin-top: 4px; }
.btn.bp-big { font-size: 17px; padding: 16px 30px; box-shadow: 0 10px 24px -12px rgba(0,0,0,.5); }
.bp-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.bp-tags li { font-size: 12.5px; letter-spacing: .03em; color: var(--cream); border: 1px solid rgba(255,255,255,.35); padding: 6px 12px; }

.bp-why .wrap { padding-block: 64px 60px; display: flex; flex-direction: column; gap: 30px; }
.bp-why h2, .bp-head h2, .bp-toc h2 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.1; text-wrap: balance; }
.bp-why-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.bp-why-l li { border-top: 4px solid var(--amber); padding-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.bp-n { font-size: 60px; line-height: .9; color: var(--amber); }
.bp-why-l h3 { font-size: 23px; line-height: 1.18; font-weight: 500; color: var(--ink); }
.bp-why-l p { font-size: 14.5px; line-height: 1.62; color: var(--text); }

.bp-gives { border-top: 1px solid var(--rule); }
.bp-gives .wrap { padding-block: 60px 56px; display: flex; flex-direction: column; gap: 28px; }
.bp-head { display: flex; flex-direction: column; gap: 10px; max-width: 860px; }
.bp-head p { font-size: 17px; line-height: 1.6; color: var(--text); }
.bp-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.bp-grid li { background: #FFFFFF; border: 1px solid var(--rule); border-radius: 6px; padding: 22px 22px 20px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 16px 34px -28px rgba(20,22,26,.5); }
.bp-grid li:first-child { background: var(--deep); border-color: var(--deep); }
.bp-grid li:first-child h3 { color: #FFFFFF; } .bp-grid li:first-child p { color: rgba(255,255,255,.82); } .bp-grid li:first-child .bp-ic { stroke: var(--amber); background: rgba(255,255,255,.08); }
.bp-ic { width: 44px; height: 44px; padding: 9px; border-radius: 50%; background: #FFF3DA; fill: none; stroke: var(--amber-ink); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.bp-grid h3 { font-size: 21px; line-height: 1.2; font-weight: 500; color: var(--ink); }
.bp-grid p { font-size: 14px; line-height: 1.6; color: var(--text); }
.bp-aside { font-size: 14px; color: var(--muted); }
.bp-aside a { font-weight: 600; }

.bp-ch1 .wrap { padding-block: 60px; }
.bp-ch1-card { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 32px 64px; align-items: center; background: var(--cream); border-radius: 8px; padding: 44px 52px; border-left: 8px solid var(--amber); }
.bp-ch1-vis { position: relative; width: 220px; justify-self: center; }
.bp-ch1-vis img { position: relative; z-index: 1; display: block; width: 100%; height: auto; transform: rotate(-4deg); box-shadow: 0 20px 40px -18px rgba(0,0,0,.55); }
.bp-page { position: absolute; z-index: 0; top: 18px; left: 46px; width: 100%; height: 100%; background: #FFFFFF; border: 1px solid var(--rule); transform: rotate(5deg); box-shadow: 0 16px 30px -18px rgba(0,0,0,.4); display: flex; flex-direction: column; gap: 10px; padding: 36px 24px 0 60px; }
.bp-page span { display: block; height: 5px; background: #E8E3D8; border-radius: 2px; }
.bp-page span:nth-child(2n) { width: 80%; }
.bp-ch1-t { display: flex; flex-direction: column; gap: 14px; }
.bp-ch1-t .lbl { color: var(--amber-ink); font-weight: 600; font-size: 12px; }
.bp-ch1-t h2 { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.08; }
.bp-ch1-t p { font-size: 16px; line-height: 1.65; color: var(--text); max-width: 640px; }
.bp-ch1-t .bp-alone { font-size: 22px; font-style: italic; color: var(--ink); }

.bp-toc { border-top: 1px solid var(--rule); }
.bp-toc .bk-toc .read { margin-left: 4px; }

.bp-quote.band { background: var(--deep); }
.bp-quote .wrap { padding-block: 64px; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.bp-quote blockquote { margin: 0; font-size: clamp(27px, 3.6vw, 44px); line-height: 1.2; color: #FFFFFF; max-width: 940px; text-wrap: balance; }
.bp-cite { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--amber); }
.bp-auth .wrap { padding-block: 44px 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.bp-sig { font-size: clamp(24px, 2.6vw, 30px); font-style: italic; color: var(--ink); }
.bp-by { font-size: 14.5px; color: var(--text); }
.bp-by a { font-weight: 600; }
.bp-close .wrap { padding-block: 30px 60px; display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
.bp-close h2 { font-size: clamp(24px, 2.8vw, 34px); line-height: 1.22; max-width: 820px; text-wrap: balance; }
.bp-soon { font-size: 13px; color: var(--muted); letter-spacing: .03em; }
@media (max-width: 1000px) { .bp-why-l { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 880px) {
  .bp-hero .wrap { grid-template-columns: minmax(0, 1fr); padding-block: 40px 48px; }
  .bp-cover { width: min(240px, 64vw); }
  .bp-ch1-card { grid-template-columns: minmax(0, 1fr); padding: 30px 22px; }
  .bp-ch1-vis { width: 150px; }
  .bp-page { left: 30px; padding: 24px 14px 0 40px; gap: 7px; }
}
@media (max-width: 600px) {
  .bp-why-l { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .bp-why .wrap, .bp-gives .wrap { padding-block: 44px; }
  .bp-grid { grid-template-columns: minmax(0, 1fr); }
  .btn.bp-big { display: block; text-align: center; }
  .bp-cta { width: 100%; }
  .bp-quote .wrap { padding-block: 44px; }
}
.fx-wide .fx-media { gap: 14px; }
.fx .fx-rep { margin-top: 10px; }
.fx-wide .fx-facts { grid-template-columns: minmax(0, 1fr); }
.fx-wide .fx-facts div { background: #FFFFFF; }
.fx-wide.gd .fx-pills li { background: rgba(255,255,255,.7); border-color: #D9C48F; }
@media (max-width: 960px) { .fx-wide .fx-media > :not(.vg) { margin-inline: 18px; } .fx-wide .fx-media { padding-bottom: 18px; } }
@media (max-width: 960px) { .fx .fx-then { justify-self: center; } }
.bp-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bp-grid li:first-child { grid-column: span 2; justify-content: center; }
.bp-grid li:first-child h3 { font-size: 26px; }
.bp-grid li:first-child p { font-size: 15px; }
@media (max-width: 1000px) { .bp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .bp-grid { grid-template-columns: minmax(0, 1fr); } .bp-grid li:first-child { grid-column: auto; } }

/* ===== Vignettes « Couverture » (style 1 de vg.py, retenu le 30/09/2026) ===== */
.v1 { --c: #173D2E; --c2: #2F6B4F; container-type: inline-size; display: flex; flex-direction: column; aspect-ratio: 3 / 4; background: #F4EFE4; border: 1px solid #D9D2C2; box-shadow: 6px 6px 0 #C9A24B; color: var(--ink); text-decoration: none; transition: transform .15s ease; min-width: 0; }
a.v1:hover { transform: translateY(-3px); text-decoration: none; color: var(--ink); }
a.v1:focus-visible { outline: 3px solid var(--amber); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) { a.v1 { transition: none; } a.v1:hover { transform: none; } }
.v1.t-hf { --c: #173D2E; --c2: #2F6B4F; } .v1.t-rv { --c: #152238; --c2: #33506E; } .v1.t-rv2 { --c: #33506E; --c2: #4A6A8C; } .v1.t-gd { --c: #5B4418; --c2: #8A6A1F; }
.v1-top { flex: 1; display: flex; flex-direction: column; gap: 3cqi; padding: 7cqi 7cqi 5cqi; }
.v1-lbl { font-size: max(9px, 3.8cqi); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid #CFC6B3; padding-bottom: 3cqi; line-height: 1.4; }
.v1-t { font: 500 max(17px, 10cqi)/1.08 var(--serif); color: var(--ink); margin-top: 3cqi; }
.v1-rule { width: 14cqi; height: 2px; background: #C9A24B; flex: none; }
.v1-s { font: italic 400 max(12.5px, 5.7cqi)/1.3 var(--serif); color: var(--c2); }
.v1-bot { background: var(--c); color: #F4EFE4; padding: 5.5cqi 7cqi 4.5cqi; display: flex; flex-direction: column; gap: 3.5cqi; }
.v1 .vf { display: flex; flex-direction: column; gap: 1cqi; }
.v1 .vf span { font-size: max(10.5px, 4.5cqi); letter-spacing: .02em; color: #F4EFE4; line-height: 1.45; }
.v1 .vf span::before { content: ""; display: inline-block; width: 5px; height: 5px; background: #C9A24B; margin-right: 8px; vertical-align: middle; }
.v1-brand { font-size: max(8.5px, 3.5cqi); letter-spacing: .16em; text-transform: uppercase; color: rgba(244,239,228,.65); border-top: 1px solid rgba(244,239,228,.25); padding-top: 3cqi; }

/* grandes cartes (Practitioner, Advanced) : vignette de taille fixe, centrée, puis les repères */
.fx-wide { grid-template-columns: minmax(0, 360px) minmax(0, 1fr); }
.fx-wide .fx-media { align-items: stretch; padding: 32px 30px 28px; }
.v1.v1-lg { width: 100%; max-width: 280px; align-self: center; margin-bottom: 10px; }
/* cartes A et B : la vignette en couverture à côté du titre */
.fx-top { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 22px; align-items: start; padding: 28px 30px 4px; }
.fx-top-t { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.fx-top .fx-body, .fx-card .fx-top + .fx-body { padding-top: 18px; }
.v1.v1-sm { width: 150px; }
/* pages programme : la vignette en couverture dans l'en-tête */
.pg-hero.pg-hero-v { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 20px 56px; align-items: center; }
.pg-hero-t { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.v1.v1-hero { width: 200px; box-shadow: 8px 8px 0 #C9A24B, 0 24px 40px -20px rgba(0,0,0,.6); border-color: rgba(255,255,255,.2); transform: rotate(2deg); }
@media (max-width: 960px) {
  .fx-wide { grid-template-columns: minmax(0, 1fr); }
  .fx-wide .fx-media { padding: 26px 18px 18px; }
  .fx-wide .fx-media > :not(.v1) { margin-inline: 0; }
  .v1.v1-lg { max-width: 240px; }
}
@media (max-width: 900px) {
  .pg-hero.pg-hero-v { grid-template-columns: minmax(0, 1fr); }
  .v1.v1-hero { display: none; }
}
@media (max-width: 600px) {
  .fx-top { grid-template-columns: 112px minmax(0, 1fr); gap: 16px; padding: 20px 18px 0; }
  .v1.v1-sm { width: 112px; box-shadow: 4px 4px 0 #C9A24B; }
  .v1.v1-sm .v1-brand, .v1.v1-sm .v1-s { display: none; }
  .v1.v1-lg { max-width: 220px; }
}
.fx-wide .fx-btns { margin-top: 8px; }

/* ===== Passe 5 (30/09/2026) : schéma des trois zones ===== */
.zf { margin: 0; background: #FFFFFF; border: 1px solid var(--rule); border-top: 5px solid var(--amber); border-radius: 12px; padding: 18px 20px 20px; box-shadow: 0 24px 50px -30px rgba(15,40,28,.55), 0 2px 6px rgba(15,40,28,.06); display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.zf-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 16px; }
.zf-svg { display: block; width: 100%; height: auto; }
.zf .legend { border-top: 1px solid var(--rule); padding-top: 12px; }
.zf .note { font-size: 13px; line-height: 1.6; color: var(--muted); max-width: 820px; }
.zf-m { display: none; list-style: none; margin: 0; padding: 0; }
.hp-zf { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.md-diag .zf { max-width: 980px; }
@media (max-width: 600px) {
  .zf { padding: 14px 14px 16px; }
  .zf-svg { display: none; }
  .zf-m { display: flex; flex-direction: column; }
  .zm { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 8px; position: relative; box-shadow: 0 10px 20px -14px rgba(0,0,0,.5); }
  .zm b { font-size: 20px; font-weight: 500; line-height: 1.2; }
  .zm span { font-size: 13px; line-height: 1.4; }
  .zm.z1 { background: linear-gradient(180deg, #245A43, #153828); color: #F4EFE4; } .zm.z1 span { color: rgba(244,239,228,.8); }
  .zm.z2 { background: linear-gradient(180deg, #4A9A70, #2F6B4F); color: #FFFFFF; padding-bottom: 36px; } .zm.z2 span { color: rgba(255,255,255,.88); }
  .zm.z2 em { position: absolute; right: 14px; bottom: 9px; font-size: 15px; color: #FFFFFF; }
  .zm.z2 em::after { content: ""; display: inline-block; width: 11px; height: 11px; border-radius: 50%; background: #FFFFFF; border: 2px solid #14161A; margin-left: 8px; vertical-align: -1px; box-shadow: 0 0 0 5px rgba(255,255,255,.25); }
  .zm.z3 { background: linear-gradient(180deg, #F6D08A, #E9A83A); color: #14161A; } .zm.z3 span { color: rgba(20,22,26,.75); }
  .zm-lim, .zm-hf { display: flex; align-items: center; gap: 10px; padding: 8px 4px; font-size: 12px; letter-spacing: .04em; color: var(--ink); }
  .zm-lim::before { content: ""; flex: none; width: 34px; height: 3px; background: #14161A; }
  .zm-hf::before { content: ""; flex: none; width: 34px; height: 14px; background: linear-gradient(90deg, rgba(62,138,99,.1), #9FBF8E, #F0CF8C, rgba(242,196,109,.1)); border-radius: 3px; }
}

/* ===== les quatre profils : matrice 2 × 2 ===== */
.pm { display: grid; grid-template-columns: 30px auto minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto auto auto; column-gap: 10px; row-gap: 6px; align-items: stretch; }
.pm p { margin: 0; }
.pm-y { grid-column: 1; grid-row: 1 / 3; display: flex; align-items: center; justify-content: center; }
.pm-yt { writing-mode: vertical-rl; transform: rotate(180deg); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--green); font-weight: 600; white-space: nowrap; }
.pm-yhi, .pm-ylo { grid-column: 2; font-size: 11.5px; color: var(--muted); display: flex; }
.pm-yhi { grid-row: 1; align-items: flex-start; padding-top: 4px; } .pm-ylo { grid-row: 2; align-items: flex-end; padding-bottom: 4px; }
.pm-grid { grid-column: 3 / 5; grid-row: 1 / 3; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pm-xlo { grid-column: 3; grid-row: 3; font-size: 11.5px; color: var(--muted); } .pm-xhi { grid-column: 4; grid-row: 3; font-size: 11.5px; color: var(--muted); text-align: right; }
.pm-x { grid-column: 3 / 5; grid-row: 4; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--green); font-weight: 600; text-align: center; border-top: 2px solid var(--green); padding-top: 6px; }
.pq { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 18px 18px 18px; border-radius: 10px; min-height: 168px; box-shadow: 0 16px 30px -22px rgba(0,0,0,.55); overflow: hidden; }
.pq .pq-ic { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
.pq-zone { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; opacity: .82; }
.pq .pq-name { font-size: 24px; line-height: 1.15; font-weight: 500; color: inherit; text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: .18em; }
.pq .pq-name:hover { text-decoration-color: currentColor; }
.pq-line { font-size: 13.5px; line-height: 1.45; opacity: .9; }
.pq-dest { position: absolute; top: 14px; right: 14px; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; background: #C9A24B; color: #14161A; padding: 4px 9px; border-radius: 999px; }
.pq-cons { background: linear-gradient(160deg, #245A43, #153828); color: #F4EFE4; }
.pq-expl { background: linear-gradient(160deg, #6E8F7C, #4E6F5E); color: #FFFFFF; }
.pq-dele { background: linear-gradient(160deg, #F6D08A, #E9A83A); color: #14161A; }
.pq-dele .pq-name { text-decoration-color: rgba(20,22,26,.3); }
.pq-navi { background: linear-gradient(160deg, #4A9A70, #2F6B4F); color: #FFFFFF; box-shadow: 0 0 0 3px #C9A24B, 0 20px 36px -20px rgba(0,0,0,.6); }
.hp-prof .pm { margin-top: 4px; }

/* cartes de profil détaillées */
.pcs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 18px; }
.pc { background: #FFFFFF; border: 1px solid var(--rule); border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 16px 34px -28px rgba(0,0,0,.5); scroll-margin-top: 90px; }
.pc-band { padding: 16px 16px 14px; display: flex; flex-direction: column; gap: 6px; }
.pc-band .pq-ic { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.pc-zone { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; opacity: .85; }
.pc-band h3 { font-size: 22px; line-height: 1.15; font-weight: 500; color: inherit; }
.pc.pq-cons .pc-band { background: linear-gradient(160deg, #245A43, #153828); color: #F4EFE4; }
.pc.pq-expl .pc-band { background: linear-gradient(160deg, #6E8F7C, #4E6F5E); color: #FFFFFF; }
.pc.pq-dele .pc-band { background: linear-gradient(160deg, #F6D08A, #E9A83A); color: #14161A; }
.pc.pq-navi .pc-band { background: linear-gradient(160deg, #4A9A70, #2F6B4F); color: #FFFFFF; }
.pc.pq-navi { box-shadow: 0 0 0 3px #C9A24B, 0 18px 34px -24px rgba(0,0,0,.55); }
.pc-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.pc-body p { font-size: 13.5px; line-height: 1.6; color: var(--text); }
.pc-tell { margin-top: auto; background: #FFF8EA; border-left: 4px solid var(--amber); padding: 10px 12px; font-size: 13.5px; line-height: 1.5; color: var(--ink); }
.pc-tell .pc-tl strong { display: block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--amber-ink); margin-bottom: 3px; }
@media (max-width: 1000px) { .pcs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .pcs { grid-template-columns: minmax(0, 1fr); }
  .pm { grid-template-columns: 22px minmax(0, 1fr) minmax(0, 1fr); column-gap: 8px; }
  .pm-yhi, .pm-ylo { display: none; }
  .pm-grid { grid-column: 2 / 4; gap: 8px; }
  .pm-xlo { grid-column: 2; } .pm-xhi { grid-column: 3; } .pm-x { grid-column: 2 / 4; }
  .pq { padding: 12px 12px 14px; min-height: 150px; gap: 4px; }
  .pq .pq-name { font-size: 18px; }
  .pq-line { display: none; }
  .pq-zone { font-size: 9px; letter-spacing: .08em; }
  .pq .pq-ic { width: 24px; height: 24px; }
  .pq-dest { position: static; align-self: flex-start; font-size: 9px; padding: 3px 7px; }
}

/* ===== diagnostic : du caractère, sans toucher au script (ids et classes inchangés) ===== */
.diag.band { background: linear-gradient(180deg, #F4EFE4 0, #FCFBF9 420px, #FFFFFF 100%); }
.diag .diag-head { background: radial-gradient(120% 120% at 15% 10%, #21553F 0%, #173D2E 60%, #10301F 100%); color: #F4EFE4; border-radius: 14px; padding: 30px 32px 28px; border-bottom: 5px solid var(--amber); box-shadow: 0 26px 50px -30px rgba(10,30,20,.7); }
.diag .diag-head .lbl.green { color: var(--amber); }
.diag .diag-head h1 { color: #FFFFFF; font-size: clamp(30px, 4.2vw, 44px); }
.diag .diag-head .lead { color: rgba(255,255,255,.86); }
.diag .privacy-line { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.25); color: #F4EFE4; border-radius: 6px; }
.diag .map { border-radius: 14px; border-top: 4px solid var(--green); box-shadow: 0 20px 40px -30px rgba(10,30,20,.55); }
.diag .map-foot .counter b { color: var(--green); font-size: 22px; }
.diag .result { border-radius: 14px; border: 0; border-top: 6px solid var(--amber); background: linear-gradient(170deg, #FFFFFF 0%, #FFF6E2 100%); box-shadow: 0 0 0 1px #EBD9AE, 0 28px 50px -30px rgba(90,60,10,.55); padding: 26px 28px 26px; }
.diag .result h2 { font-size: clamp(30px, 3.6vw, 40px); color: var(--deep); }
.diag .result h2::before { content: ""; display: block; width: 56px; height: 4px; background: var(--amber); margin-bottom: 12px; }
.diag .result .next { background: #FFFFFF; border-left: 4px solid var(--green); padding: 12px 14px; border-radius: 0 8px 8px 0; }
.diag .rows { border-top: 0; gap: 12px 16px; margin-top: 4px; }
.diag .row { background: #FFFFFF; border: 1px solid var(--rule); border-radius: 10px; padding: 14px 16px; box-shadow: 0 10px 24px -22px rgba(0,0,0,.45); transition: border-color .2s, box-shadow .2s; }
.diag .row.answered { border-color: #B9D4C4; box-shadow: inset 4px 0 0 var(--green), 0 10px 24px -22px rgba(0,0,0,.45); }
.diag .row p { font-size: 14px; }
.diag .row .n { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; border-radius: 50%; background: var(--warm); border: 1px solid var(--rule); color: var(--muted); font-size: 11.5px; margin-right: 6px; }
.diag .row.answered .n { background: var(--green); border-color: var(--green); color: #FFFFFF; }
.diag .seg { border: 0; background: transparent; gap: 5px; }
.diag .seg button { border: 1px solid var(--rule); border-radius: 8px; background: #FFFFFF; min-height: 44px; padding: 6px 0; transition: background .15s, border-color .15s, transform .15s; }
.diag .seg button:last-child { border-right: 1px solid var(--rule); }
.diag .seg button:hover { border-color: var(--green); background: #F4F7F5; }
.diag .seg button b { font-size: 15px; color: var(--ink); }
.diag .seg button[aria-pressed="true"] { background: var(--amber); border-color: var(--amber); box-shadow: 0 6px 14px -8px rgba(154,95,0,.7); transform: translateY(-1px); }
.diag .scale-key { opacity: .8; }
.diag .dg-next { border-top: 0; background: #FFFFFF; border-radius: 14px; padding: 22px 22px 24px; box-shadow: 0 0 0 1px var(--rule), 0 24px 44px -32px rgba(0,0,0,.5); }
.diag .dg-next .cc { border-radius: 10px; }
@media (prefers-reduced-motion: reduce) { .diag .row, .diag .seg button { transition: none; } .diag .seg button[aria-pressed="true"] { transform: none; } }
@media (max-width: 860px) { .diag .seg { max-width: none; } }
@media (max-width: 600px) {
  .diag .diag-head { padding: 22px 18px 20px; border-radius: 12px; }
  .diag .result { padding: 20px 18px; }
  .diag .dg-next { padding: 16px 14px 18px; }
}
@media (max-width: 600px) { .pm-yt { font-size: 8.5px; letter-spacing: .05em; } .pm { grid-template-columns: 18px minmax(0, 1fr) minmax(0, 1fr); } }
.nm-main a[aria-current] { padding-left: 14px; }
/* carte du diagnostic : quadrants teintés aux couleurs des profils, en CSS seulement (le SVG et le script sont inchangés) */
.diag #frontier-map {
  background-image: linear-gradient(rgba(110,143,124,.18), rgba(110,143,124,.18)), linear-gradient(rgba(47,107,79,.2), rgba(47,107,79,.2)),
                    linear-gradient(rgba(30,77,58,.13), rgba(30,77,58,.13)), linear-gradient(rgba(233,168,58,.24), rgba(233,168,58,.24));
  background-size: 44.2% 39.7%, 44.2% 39.7%, 44.2% 39.7%, 44.2% 39.7%;
  background-position: 17.33% 9.75%, 96.5% 9.75%, 17.33% 75.6%, 96.5% 75.6%;
  background-repeat: no-repeat;
}

/* Livre : note de l'auteur en entier (30/09/2026) */
.bp-auth .wrap { padding-block: 56px 28px; display: block; text-align: left; }
.bp-note { max-width: 700px; margin-inline: auto; border-left: 4px solid var(--amber); padding: 4px 0 4px 30px; display: flex; flex-direction: column; gap: 14px; }
.bp-note .lbl { color: var(--amber-ink); font-weight: 600; }
.bp-note h2 { font-size: clamp(28px, 3.2vw, 38px); line-height: 1.12; }
.bp-note p { font-size: 16.5px; line-height: 1.75; color: var(--text); }
.bp-note .bp-sig { font-size: clamp(24px, 2.6vw, 30px); line-height: 1.25; font-style: italic; color: var(--ink); margin-top: 6px; }
.bp-note .bp-sig strong { font-weight: 500; }
.bp-note .bp-by { font-size: 14.5px; }
.bp-note .bp-by a { font-weight: 600; }
@media (max-width: 600px) { .bp-note { padding-left: 18px; } .bp-note p { font-size: 15.5px; } .bp-auth .wrap { padding-block: 40px 20px; } }