/* humanfrontier.ai : feuille de style unique (remplace style.css, site2.css, hub2.css, book.css, readers.css, diagnostic.css, programme.css).
   Crimson Pro pour les titres, Work Sans pour le texte.
   Relief v1 : rythme par bandes (blanc, crème, vert profond), couleurs de marque en surface, une seule ombre système,
   mises en avant par la taille, la couleur et le serif, jamais par la graisse. Aucun script hors diagnostic et lecteurs. */

:root {
  --white: #FFFFFF; --warm: #F6F3EC; --ink: #14161A; --text: #3D4046; --muted: #6B6E73; --faint: #9A9DA3;
  --green: #2F6B4F; --deep: #173D2E; --deep2: #1F4A39; --gold: #E9A83A; --gold-ink: #8A5A10; --rule: #D9D6CF; --rule2: #ECEAE4;
  --onband: #F4EFE4; --onband2: #C6D3CB; --onrule: rgba(244,239,228,.28);
  --shadow: 0 18px 40px -18px rgba(20,22,26,.35), 0 2px 6px rgba(20,22,26,.08);
  --gutter: clamp(16px, 5vw, 72px); --max: 1120px; --measure: 34em;
  --sans: "Work Sans", "Helvetica Neue", Arial, sans-serif; --serif: "Crimson Pro", Georgia, "Times New Roman", serif;
}
html { color-scheme: light; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--white); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.6; overflow-x: hidden; overflow-wrap: anywhere; -webkit-font-smoothing: antialiased; }
p, ul, ol, figure, blockquote, h1, h2, h3, h4 { margin: 0; }
h1, h2, h3, h4, .disp, blockquote { font-family: var(--serif); font-weight: 400; color: var(--ink); overflow-wrap: normal; }
h1 { font-size: clamp(34px, 4.4vw, 46px); line-height: 1.1; font-weight: 500; letter-spacing: -.005em; }
h2 { font-size: clamp(26px, 3vw, 32px); line-height: 1.18; font-weight: 500; }
h3 { font-size: 22px; line-height: 1.25; font-weight: 500; }
a { color: var(--green); text-decoration: none; text-underline-offset: .15em; }
a:hover { color: var(--ink); text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible, textarea:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
img, svg { max-width: 100%; height: auto; }
strong, b { font-weight: inherit; color: inherit; }
em { font-style: italic; }
[hidden] { display: none !important; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: var(--white); padding: 8px 12px; z-index: 20; }
.skip:focus { left: 8px; color: var(--white); text-decoration: none; }
ul, ol { padding-left: 1.2em; }
p + p, li + li { margin-top: .7em; }
/* longueur de ligne : 60 à 75 caractères pour tout texte courant (tableaux, figures et grilles non concernés) */
main p, main li, main dd, main dt, main blockquote, main figcaption { max-width: var(--measure); }
.start li, .fam li, .row { max-width: none; }
/* liens visibles dans le texte courant */
main p a:not(.btn), main li a:not(.btn), main dd a { text-decoration: underline; text-decoration-color: rgba(47,107,79,.45); text-decoration-thickness: 1px; }
main p a:not(.btn):hover, main li a:not(.btn):hover { text-decoration-color: currentColor; }
.fine, .sub { font-size: 14px; line-height: 1.55; color: var(--muted); }
.lead { font-size: 19px; line-height: 1.5; color: var(--text); max-width: var(--measure); }
.kicker { font-family: var(--sans); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--green); margin-bottom: 14px; }
.lbl { display: block; font-size: 13.5px; color: var(--muted); margin-bottom: 6px; }
.lbl.green { color: var(--green); }
.svgt { font-family: var(--sans); } .svgd { font-family: var(--serif); }

/* layout : trois fonds (blanc, crème, vert profond) */
.band { padding-inline: var(--gutter); padding-block: clamp(48px, 7vw, 88px); border-top: 1px solid var(--rule2); background: var(--white); }
.band.warm { background: var(--warm); border-top-color: var(--rule); }
.band.deep { background: var(--deep); color: var(--onband); border-top: 0; }
.band.deep h1, .band.deep h2, .band.deep h3, .band.deep .disp, .band.deep blockquote { color: var(--white); }
.band.deep p, .band.deep li, .band.deep .lead, .band.deep .fine, .band.deep .sub { color: var(--onband); }
.band.deep .fine, .band.deep .sub, .band.deep .lbl, .band.deep .p-zone, .band.deep .cc-k { color: var(--onband2); }
.band.deep .kicker, .band.deep .lbl { color: var(--gold); }
.band.deep a:not(.btn) { color: var(--white); text-decoration: underline; text-decoration-color: rgba(244,239,228,.45); }
.band.deep a:not(.btn):hover { color: var(--white); text-decoration-color: var(--gold); }
.band.deep + .band.deep { border-top: 1px solid var(--onrule); }
.band:first-child, main > .band:first-child { border-top: 0; }
.wrap { max-width: var(--max); margin-inline: auto; }
.wrap.narrow { max-width: 680px; }
.sec-head { margin-bottom: 32px; max-width: 760px; }
.sec-head .sub, .sec-head .lead { margin-top: 10px; }
.page-head { max-width: 800px; padding-bottom: 8px; margin-inline: auto; }
.band.page-head { max-width: none; }
.page-head .lead { max-width: none; }
.page-head .lead { margin-top: 22px; font-size: 21px; }
.page-head .fine { margin-top: 14px; }
/* filet or au-dessus des titres de section */
.band > .wrap > h2::before, .sec-head > h2::before, .band > .wrap > .sec-head h2::before, .book-text .lbl::before, .author h2::before, .loop-grid h2::before, .excerpts .lbl::before, .note .lbl::before, .crit-grid .lbl::before, .dg-next h2::before {
  content: ""; display: block; width: 56px; height: 4px; background: var(--gold); margin-bottom: 18px;
}
.band.deep > .wrap > h2::before { background: var(--gold); }

/* header */
.site-head { padding-inline: var(--gutter); border-bottom: 1px solid var(--rule); background: var(--white); overflow-x: clip; }
.site-head .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; padding-block: 18px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); white-space: nowrap; }
.brand svg { flex: 0 0 auto; }
.brand:hover { text-decoration: none; }
.brand .disp { font-size: 23px; font-weight: 500; line-height: 1; }
.nav-d { display: flex; align-items: center; gap: 28px; }
.nav-d ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px 18px; }
.nav-d li, .nav-m-panel li, .foot li { margin: 0; }
.nav-main a { color: var(--text); font-size: 14px; padding: 6px 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.nav-main a:hover { color: var(--ink); text-decoration: none; border-bottom-color: var(--rule); }
.nav-main a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--gold); }
.nav-fam { border-left: 1px solid var(--rule); padding-left: 18px; gap: 4px 14px; }
.nav-fam a { color: var(--text); font-size: 14px; font-weight: 500; white-space: nowrap; }
.site-head .lang { flex: none; color: var(--muted); border: 1px solid var(--rule); padding: 5px 10px; font-size: 12.5px; line-height: 1.6; letter-spacing: .04em; white-space: nowrap; }
.site-head .lang:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.nav-m { display: none; }
.nav-m summary { list-style: none; cursor: pointer; font-size: 14.5px; color: var(--ink); border: 1px solid var(--rule); padding: 7px 12px; }
.nav-m summary::-webkit-details-marker { display: none; }
.nav-m-panel { position: absolute; left: 0; right: 0; background: var(--white); border-bottom: 1px solid var(--rule); padding: 8px var(--gutter) 20px; z-index: 15; }
.nav-m-panel ul { list-style: none; margin: 0; padding: 0; }
.nav-m-panel li { margin: 0; }
.nav-m-panel a { display: block; padding: 11px 0; border-bottom: 1px solid var(--rule2); color: var(--ink); font-size: 16px; }
.nav-m-panel a[aria-current="page"] { color: var(--green); }
.nm-fam { margin-top: 10px; }
.nm-fam a { color: var(--ink); font-weight: 500; }
@media (max-width: 1100px) {
  .nav-d { display: none; }
  /* 23/10/2026 : plus de position: relative ici, le panneau du menu se place sur toute la largeur de l'en-tête (comme sur les deux autres sites) */
  .nav-m { display: block; }
  .site-head { position: relative; }
}

/* buttons, forms : plein vert sur fond clair, plein or sur fond profond, contour pour le secondaire */
.btn { display: inline-block; background: var(--green); color: var(--white); border: 1px solid var(--green); padding: 13px 24px; font: inherit; font-size: 15px; line-height: 1.2; cursor: pointer; text-decoration: none; border-radius: 0; }
.btn:hover, .btn:focus-visible { background: var(--deep); border-color: var(--deep); color: var(--white); text-decoration: none; }
.btn.outline { background: transparent; color: var(--green); }
.btn.outline:hover, .btn.outline:focus-visible { background: var(--green); color: var(--white); }
.band.deep .btn { background: var(--gold); border-color: var(--gold); color: var(--deep); }
.band.deep .btn:hover, .band.deep .btn:focus-visible { background: var(--white); border-color: var(--white); color: var(--deep); }
.band.deep .btn.outline { background: transparent; color: var(--white); border-color: rgba(244,239,228,.6); }
.band.deep .btn.outline:hover, .band.deep .btn.outline:focus-visible { background: var(--white); color: var(--deep); border-color: var(--white); }
.band.deep a:focus-visible, .band.deep button:focus-visible, .band.deep input:focus-visible { outline-color: var(--gold); }
.cta { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 40px; }
form label { display: block; font-size: 14px; color: var(--ink); margin-bottom: 6px; }
.field { display: flex; flex-wrap: wrap; gap: 10px; }
input[type="email"], input[type="text"], textarea { font: inherit; font-size: 15px; padding: 11px 12px; border: 1px solid var(--rule); background: var(--white); color: var(--ink); border-radius: 0; min-width: 0; flex: 1 1 240px; }
form button { background: var(--green); color: var(--white); border: 1px solid var(--green); padding: 11px 20px; font: inherit; font-size: 15px; cursor: pointer; border-radius: 0; }
form button:hover { background: var(--deep); border-color: var(--deep); }
label.consent { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--text); margin-top: 16px; line-height: 1.5; }
label.consent input { margin-top: 4px; flex: none; }
form .fine { display: block; margin-top: 12px; }
fieldset { border: 0; padding: 0; margin: 0 0 16px; }
legend { font-size: 14px; color: var(--ink); margin-bottom: 8px; padding: 0; }
fieldset label { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; font-size: 15px; }
fieldset label input { margin-top: 5px; }

/* bandeau Position : vert profond, filet or épais, structure commune aux trois sites */
.stance { border-bottom: 6px solid var(--gold); }
.stance-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px 72px; align-items: start; }
.stance .lbl { color: var(--gold); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 18px; }
.stance-title { font-family: var(--serif); font-size: clamp(34px, 4.4vw, 52px); line-height: 1.08; color: var(--white); font-weight: 500; }
.stance-sub { font-family: var(--serif); font-size: 23px; line-height: 1.35; font-style: italic; color: var(--onband); margin-top: 18px; max-width: 520px; }
.stance-named { font-family: var(--serif); font-size: 18px; line-height: 1.45; color: var(--onband); margin-top: 16px; max-width: 520px; }
.stance-body { padding-top: 6px; max-width: var(--measure); border-left: 1px solid var(--onrule); padding-left: 32px; }
.stance-body p { font-size: 15.5px; line-height: 1.65; }
.stance-body .claim { margin-top: 22px; padding-top: 16px; border-top: 3px solid var(--gold); color: var(--white); font-family: var(--serif); font-size: 20px; line-height: 1.35; }

/* home */
.s-entry { padding-block: clamp(56px, 8vw, 104px); }
.entry { display: flex; flex-direction: column; gap: 26px; align-items: flex-start; padding-block: 8px 0; }
.devise { font-size: clamp(52px, 8.6vw, 112px); line-height: 1; font-weight: 500; letter-spacing: -.015em; color: var(--deep); }
.s-entry .cta .fine { font-size: 15px; color: var(--text); }
.start { list-style: none; padding: 0; margin: 0; border-top: 2px solid var(--deep); }
.start li { display: grid; grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 8px 40px; padding: 26px 0; border-bottom: 1px solid var(--rule); margin: 0; align-items: baseline; }
.start .st-who { font-family: var(--serif); font-size: 24px; color: var(--deep); line-height: 1.25; }
.start .st-links, .start li > a { font-size: 16.5px; line-height: 1.7; }
.start a { color: var(--green); text-decoration: underline; text-decoration-color: rgba(47,107,79,.4); text-decoration-thickness: 1px; }
.start a:hover { color: var(--ink); text-decoration-color: var(--ink); }
.start .st-sep { color: var(--muted); }
.rv-line { margin-top: 32px; font-size: 18px; font-family: var(--serif); color: var(--ink); background: var(--white); border-left: 4px solid var(--gold); padding: 16px 22px; max-width: 40em; }
.rv-line a { color: var(--green); margin-left: 6px; }
.pages { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.s-pages h2 { margin-bottom: 32px; }
.pages li { margin: 0; padding: 26px 28px 30px; background: var(--warm); border-top: 5px solid var(--green); }
.pages li:nth-child(2) { border-top-color: var(--gold); }
.pages li:nth-child(3) { border-top-color: var(--deep); }
.pages li a { font-family: var(--serif); font-size: 32px; color: var(--deep); display: inline-block; margin-bottom: 12px; line-height: 1.15; text-decoration: none; }
.pages li a:hover { color: var(--green); text-decoration: none; }
.pages li p { font-size: 15.5px; }
.book-grid { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 32px 80px; align-items: center; }
.s-book .book-sub { color: var(--gold); }
.s-book .book-text .lbl::before { background: var(--gold); }
.hp-cover { width: 100%; display: block; }
.book-text { max-width: var(--measure); }
.book-text h2 { font-size: clamp(36px, 4.4vw, 52px); }
.book-sub { font-family: var(--serif); font-size: 25px; line-height: 1.3; color: var(--green); margin: 10px 0 20px; }
.bk-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.author { max-width: var(--measure); }
.hp-links { margin-top: 18px; }
.hp-links a + a { margin-left: 20px; }
.loop-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 24px 72px; align-items: start; }
.loop-grid .sub { margin-top: 10px; font-size: 16px; }
.s-loop form { background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--green); padding: 26px 28px 24px; }

/* accueil : grande figure du modèle */
.fig.home-fig { margin-top: clamp(40px, 5vw, 64px); }
.fig-cap { font-family: var(--sans); font-size: 15.5px; color: var(--text); margin-top: 16px; max-width: none; }
.fig-cap a { color: var(--green); text-decoration: underline; text-decoration-color: rgba(47,107,79,.45); }

/* model */
.fig { margin: 0; }
.fig figcaption { font-family: var(--sans); font-size: 13.5px; color: var(--muted); margin-bottom: 14px; }
.scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.profiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 40px; }
.profile { padding: 26px 28px 30px; background: var(--white); border: 1px solid var(--rule); border-top: 5px solid var(--green); }
.p-zone { font-size: 13.5px; color: var(--text); margin-bottom: 8px; }
.profile h3 { font-size: 28px; margin-bottom: 14px; color: var(--deep); }
.profile p { font-size: 15.5px; }
.p-tell { margin-top: 16px; padding-left: 16px; border-left: 3px solid var(--gold); font-style: italic; }
.p-tl { font-style: normal; color: var(--text); display: block; font-size: 13px; margin-bottom: 2px; }
.s-profiles .cta-row .fine { font-size: 14.5px; }
.crit-grid { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 24px 64px; align-items: start; }
.crit-main { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; align-content: start; }
.crit-main .md-quote { grid-column: 1 / -1; font-size: clamp(26px, 3vw, 36px); line-height: 1.25; border-left: 5px solid var(--gold); padding-left: 26px; margin-bottom: 28px; color: var(--deep); max-width: 22em; }
.crit-main p { max-width: none; margin: 0; font-size: 16px; }
.crit-grid .lbl { color: var(--gold-ink); }
.strat { margin-top: 56px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.strat .sub { grid-column: 1 / -1; color: var(--gold-ink); font-family: var(--serif); font-size: 22px; max-width: none; margin: 0 0 -4px; padding: 0 0 10px; border-bottom: 1px solid var(--rule); }
.strat-c { background: var(--white); border: 1px solid var(--rule); border-top: 5px solid var(--gold); box-shadow: var(--shadow); padding: 26px 30px 30px; }
.strat-c h3 { font-size: clamp(27px, 2.8vw, 34px); line-height: 1.15; color: var(--deep); margin-bottom: 14px; }
.strat-c p { margin: 0; font-size: 15.5px; line-height: 1.62; max-width: none; }
/* Pourquoi une méthode est nécessaire · Le contrôle humain en pratique : deux colonnes titrées */
.rs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 64px; align-items: start; }
.rs-c h3 { font-size: clamp(23px, 2.3vw, 27px); line-height: 1.2; color: var(--deep); margin-bottom: 12px; }
.rs-c h3::before { content: ""; display: block; width: 44px; height: 4px; background: var(--gold); margin-bottom: 16px; }
.rs-c p { font-size: 15px; line-height: 1.65; color: var(--text); max-width: none; margin: 0; }
.closing { font-family: var(--serif); font-size: clamp(28px, 3.2vw, 38px); line-height: 1.3; color: var(--deep); max-width: 24em; border-top: 4px solid var(--gold); padding-top: 28px; }
.next { padding-block: 32px; background: var(--warm); border-top: 1px solid var(--rule); }
.next p { font-size: 15px; }
.next-k { color: var(--muted); margin-right: 10px; }
.next a { font-family: var(--serif); font-size: 24px; color: var(--green); }
.next a:hover { color: var(--deep); }

/* diagnostic */
.s-diag { background: var(--warm); }
.s-diag .page-head { margin-bottom: 36px; }
.map { border: 0; background: var(--white); padding: 24px 24px 18px; box-shadow: var(--shadow); border-top: 5px solid var(--green); }
.map .scroll svg { display: block; width: 100%; max-width: 780px; margin-inline: auto; }
.map-note { font-size: 13.5px; color: var(--muted); margin-top: 14px; }
.map-foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; margin-top: 14px; font-size: 14px; color: var(--muted); border-top: 1px solid var(--rule2); padding-top: 12px; }
.map.done .reveal { display: none; }
.counter #count { color: var(--ink); font-family: var(--serif); font-size: 20px; }
.result { margin-top: 24px; border: 0; border-top: 6px solid var(--gold); padding: 32px; background: var(--deep); color: var(--onband); }
.result h2 { margin-bottom: 14px; color: var(--white); font-size: clamp(28px, 3.4vw, 40px); }
.result p { max-width: var(--measure); color: var(--onband); }
.result .scores { color: var(--onband2); font-size: 14.5px; }
.result #result-desc { font-family: var(--serif); font-size: 20px; line-height: 1.4; color: var(--white); margin-top: 14px; }
.result .next { background: transparent; border: 0; padding: 0; margin-top: 14px; }
.result .caveat { margin-top: 14px; font-size: 14.5px; color: var(--onband2); }
.result .btn { background: var(--gold); border-color: var(--gold); color: var(--deep); }
.result .btn:hover, .result .btn:focus-visible { background: var(--white); border-color: var(--white); color: var(--deep); }
.result .btn.outline { background: transparent; color: var(--white); border-color: rgba(244,239,228,.6); }
.result .btn.outline:hover, .result .btn.outline:focus-visible { background: var(--white); color: var(--deep); }
.result a:not(.btn) { color: var(--white); text-decoration: underline; text-decoration-color: rgba(244,239,228,.45); }
.result a:focus-visible, .result button:focus-visible { outline-color: var(--gold); }
.rv-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.grid-note { margin-top: 20px; font-size: 13.5px; color: var(--onband2); max-width: var(--measure); }
.rows { margin-top: 40px; border-top: 2px solid var(--deep); }
.row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: 10px 32px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--rule); }
.row p { font-size: 16px; color: var(--ink); display: flex; gap: 14px; }
.row .n { font-family: var(--serif); color: var(--green); font-size: 24px; line-height: 1; flex: none; width: 1.4em; padding-top: 1px; }
.row.answered .n { color: var(--gold-ink); }
.seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.seg button { font: inherit; font-size: 13.5px; background: var(--white); color: var(--text); border: 1px solid var(--rule); padding: 9px 6px; cursor: pointer; border-radius: 0; display: flex; align-items: center; justify-content: center; gap: 7px; }
.seg button .dot { width: 10px; height: 10px; border: 1px solid var(--muted); border-radius: 50%; display: inline-block; }
.seg button:hover { border-color: var(--green); color: var(--ink); }
.seg button[aria-pressed="true"] { border-color: var(--green); color: var(--white); background: var(--green); }
.seg button[aria-pressed="true"] .dot { background: var(--gold); border-color: var(--gold); }
.scale-key { display: none; }
.dg-next { margin-top: 0; }
.band.deep .dg-cards li { background: var(--white); color: var(--text); }
.band.deep .dg-cards p { color: var(--text); }
.band.deep .dg-cards .cc-k { color: var(--muted); }
.band.deep .dg-cards h3 { color: var(--deep); }
.band.deep .dg-cards a:not(.btn) { color: var(--green); text-decoration-color: rgba(47,107,79,.45); }
.dg-cards { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.dg-cards li { margin: 0; background: var(--white); border-top: 5px solid var(--green); padding: 26px 26px 30px; }
.dg-cards li:nth-child(2) { border-top-color: var(--gold); }
.dg-cards li:nth-child(3) { border-top-color: var(--deep); }
.dg-cards .cc-k { font-size: 13.5px; color: var(--muted); margin-bottom: 6px; }
.dg-cards h3 { margin-bottom: 10px; font-size: 26px; color: var(--deep); }
.dg-cards p + p { margin-top: 12px; }
.dg-cards p { font-size: 15.5px; }

/* book */
.book-hero { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 32px 80px; align-items: center; }
.book-cover img { width: 100%; display: block; }
.book-hero-t { max-width: 44em; }
.book-hero-t h1 { font-size: clamp(44px, 6vw, 72px); color: var(--white); }
.book-hero-t .book-sub { font-size: clamp(24px, 2.6vw, 30px); margin: 12px 0 26px; color: var(--gold); font-style: normal; }
.s-bookhero .bp-hook { font-size: 17.5px; }
.bp-hook { font-size: 17px; }
.bp-hook + .bp-hook { margin-top: 12px; }
.bp-tags { list-style: none; padding: 0; margin: 24px 0 0; display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: 14px; color: var(--muted); }
.bp-tags li { margin: 0; }
.s-why h2 { margin-bottom: 32px; }
.bp-why-l { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 48px; counter-reset: why; }
.bp-why-l li { margin: 0; border-top: 1px solid var(--rule); padding-top: 18px; font-size: 15.5px; counter-increment: why; display: grid; grid-template-columns: 2.2em minmax(0, 1fr); grid-template-areas: "n h" "n p"; gap: 0 12px; align-items: start; align-content: start; }
.bp-why-l li::before { content: counter(why); font-family: var(--serif); font-size: 44px; line-height: 1; color: var(--gold-ink); grid-area: n; }
.bp-why-l li h3 { grid-area: h; }
.bp-why-l li h3, .bp-why-l li strong { display: block; font-family: var(--serif); font-size: 24px; line-height: 1.25; margin-bottom: 8px; color: var(--deep); }
.bp-why-l li p { grid-area: p; }
.bp-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.bp-grid li { margin: 0; border: 1px solid var(--onrule); border-top: 4px solid var(--gold); background: var(--deep2); padding: 22px 24px 26px; font-size: 15.5px; }
.bp-grid li h3, .bp-grid li strong { display: block; font-family: var(--serif); font-size: 23px; line-height: 1.25; margin-bottom: 10px; color: var(--white); }
.s-gives .sec-head .lead { font-size: 20px; }
.bp-aside { margin-top: 32px; font-size: 16px; color: var(--text); }
.excerpts { max-width: 40rem; margin-inline: auto; }
.excerpts p { max-width: none; }
/* extraits : trois citations de même poids, chacune suivie de sa légende de chapitre */
.excerpts h2 { margin-bottom: 14px; }
.excerpts h2::before { content: ""; display: block; width: 56px; height: 4px; background: var(--gold); margin-bottom: 18px; }
.excerpts .bp-ex-intro { font-size: 16.5px; line-height: 1.65; }
.bp-ex { margin: 28px 0 0; }
.bp-ex + .bp-ex { margin-top: 26px; }
.excerpts .bp-ex blockquote { max-width: none; margin: 0; font-family: var(--serif); font-size: clamp(21px, 2.1vw, 24px); line-height: 1.38; color: var(--deep); background: var(--warm); border-left: 5px solid var(--gold); padding: 22px 28px 24px; }
.excerpts .bp-ex figcaption { max-width: none; margin-top: 10px; padding-left: 33px; font-family: var(--sans); font-size: 14px; line-height: 1.45; color: var(--muted); }
.s-toc h2 { margin-bottom: 14px; }
.bk-parts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 24px 0; }
.bk-part { background: var(--white); padding: 22px 24px 26px; border-top: 4px solid var(--green); }
.bk-part:nth-child(2) { border-top-color: var(--gold); }
.bk-part:nth-child(3) { border-top-color: var(--deep); }
.bk-part .lbl { font-family: var(--serif); font-size: 21px; color: var(--deep); margin-bottom: 12px; line-height: 1.25; }
.bk-toc { list-style: none; padding: 0; margin: 0; }
.bk-toc li { margin: 0; padding: 7px 0; border-top: 1px solid var(--rule2); display: flex; gap: 12px; font-size: 15.5px; align-items: baseline; }
.bk-toc .n, .bk-toc b { color: var(--green); font-family: var(--serif); font-size: 19px; min-width: 1.4em; }
.s-quote .quote { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.25; max-width: 22em; border-left: 5px solid var(--gold); padding-left: 28px; color: var(--white); }
.position { margin-top: 24px; font-family: var(--serif); font-size: 22px; color: var(--gold); padding-left: 33px; }
.note { max-width: 38rem; margin-inline: auto; }
.note p { max-width: none; }
.note h2 { margin-bottom: 18px; }
.bp-by { margin-top: 24px; font-size: 14.5px; color: var(--muted); text-align: right; }
.closing-q { font-size: clamp(26px, 3.2vw, 38px); line-height: 1.3; max-width: 24em; font-weight: 400; color: var(--deep); border-top: 4px solid var(--gold); padding-top: 28px; }

/* readers */
.rd-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 300px); gap: 24px 64px; align-items: start; }
.rd-hero .kicker { grid-column: 1 / -1; margin-bottom: 0; }
.rd-hero .lead { margin-top: 20px; }
.rd-hero h1 em { color: var(--green); font-style: italic; }
.rd-cover img { width: 100%; display: block; }
.rd-steps-list { list-style: none; padding: 0; margin: 36px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.rd-steps-list li { margin: 0; display: flex; gap: 18px; border: 1px solid var(--onrule); border-top: 4px solid var(--gold); padding: 22px 24px 26px; background: var(--deep2); }
.rd-steps-list .n { font-family: var(--serif); font-size: 48px; color: var(--gold); line-height: .9; }
.rd-steps-list h3 { margin-bottom: 8px; font-size: 24px; }
.rd-steps-list p { font-size: 15.5px; }
.rd-steps-list a { display: inline-block; margin-top: 12px; }
.s-tools .intro { margin: -16px 0 28px; color: var(--muted); }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.tool { padding: 24px 26px 28px; background: var(--warm); border-top: 4px solid var(--green); }
.tool:nth-child(3) { border-top-color: var(--gold); }
.tool:nth-child(4) { border-top-color: var(--deep); }
.tool h3 { margin-bottom: 8px; font-size: 25px; color: var(--deep); }
.tool p { font-size: 15.5px; }
.tool .go { display: inline-block; margin-top: 12px; }
.tool .where { display: block; margin-top: 8px; font-size: 13.5px; color: var(--muted); }
.tool details { margin-top: 12px; }
.tool summary { cursor: pointer; color: var(--green); }
.tool details ol { margin-top: 10px; }
.tool details p { margin-top: 10px; color: var(--muted); font-size: 14.5px; }
.rd-cert { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; background: var(--white); border: 1px solid var(--rule); padding: 0 32px 34px; }
.rd-cert > .lbl { display: block; background: var(--deep); color: var(--gold); margin: 0 -32px 24px; padding: 14px 32px; border-bottom: 4px solid var(--gold); font-size: 13.5px; letter-spacing: .06em; text-transform: uppercase; }
.rd-cert h3 { font-size: clamp(28px, 3vw, 36px); margin-bottom: 10px; color: var(--deep); }
.rd-cert .lead { color: var(--green); font-family: var(--serif); font-size: 21px; }
.rd-cert ul { margin-top: 12px; }
.rd-cert .fine { margin-top: 12px; }
.rd-later { margin-top: 40px; }
.rd-later-head { display: flex; gap: 20px; align-items: baseline; border-top: 2px solid var(--deep); padding-top: 18px; max-width: 52em; }
.rd-later-head .soon { color: var(--green); font-size: 13.5px; white-space: nowrap; }
.cols2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.card { background: var(--white); border-top: 4px solid var(--green); padding: 22px 24px 26px; }
.card:nth-child(2) { border-top-color: var(--gold); }
.card h3 { margin-bottom: 8px; color: var(--deep); }
.card p { font-size: 15.5px; }
.card .go { display: inline-block; margin-top: 10px; }
.card .fine { margin-top: 10px; }
.rd-form { margin-top: 40px; border-top: 2px solid var(--deep); padding-top: 24px; max-width: 640px; }
.rd-form h3 { margin-bottom: 16px; }
.rd-form .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; padding: 0; border: 0; margin-bottom: 12px; }
.rd-form .row label { display: block; }
.rd-form .row input { width: 100%; }
.rd-form button { margin-top: 16px; }
.share { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 64px; align-items: start; }
.share .bk-actions { margin-top: 0; }
.share .fine { grid-column: 1 / -1; }
#share-list { display: inline-flex; flex-wrap: wrap; gap: 12px; }

/* about */
.about-grid { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 36rem); justify-content: center; gap: 24px 64px; align-items: start; }
.about-grid .fine { margin-top: 12px; }
.about-photo { margin: 24px 0 0; max-width: 240px; }
.about-photo img { display: block; width: 100%; height: auto; }
@media (max-width: 640px) { .about-photo { max-width: 200px; margin-top: 16px; } }
.about-grid h1, .about-grid h2 { color: var(--deep); }
.about-body { max-width: none; font-size: 16.5px; border-left: 4px solid var(--gold); padding-left: 28px; }
.about-body p { max-width: none; }
.fam { list-style: none; padding: 0; margin: 24px 0 0; border-top: 1px solid var(--onrule); }
.fam li { margin: 0; display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr) auto; gap: 8px 24px; padding: 18px 0; border-bottom: 1px solid var(--onrule); align-items: baseline; }
.fam .disp { font-family: var(--serif); font-size: 24px; color: var(--gold); }
.about-body .contact { margin-top: 28px; }

/* documents (training, privacy, legal, signup, 404) */
.doc h1 { margin-bottom: 20px; color: var(--deep); }
.doc h2 { font-size: 24px; margin-top: 36px; margin-bottom: 10px; }
.doc p + p { margin-top: 12px; }
.doc .lead { margin-bottom: 16px; }
.doc .muted { color: var(--muted); font-size: 14px; margin-top: 32px; }
.doc .pg-note { margin-top: 28px; color: var(--muted); }
.doc .pg-note a + a { margin-left: 16px; }
.doc .btn { margin-top: 8px; }

/* footer : vert profond, texte clair */
.foot { padding-inline: var(--gutter); padding-block: 52px 40px; border-top: 6px solid var(--gold); background: var(--deep); color: var(--onband); }
.ft-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 48px; }
.ft-h { font-family: var(--serif); font-size: 20px; color: var(--gold); margin-bottom: 12px; font-weight: 400; }
.foot ul { list-style: none; padding: 0; margin: 0; }
.foot li { margin: 0; padding: 4px 0; font-size: 15px; }
.foot a { color: var(--onband); }
.foot a:hover { color: var(--white); text-decoration: underline; text-decoration-color: var(--gold); }
.foot a:focus-visible { outline-color: var(--gold); }
.ft-line { margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--onrule); font-size: 13.5px; color: var(--onband2); }

/* responsive */
@media (max-width: 920px) {
  .stance-grid, .loop-grid, .crit-grid, .about-grid, .share, .rd-hero, .rs-grid { grid-template-columns: minmax(0, 1fr); }
  .about-grid { justify-content: stretch; }
  .stance-body { border-left: 0; padding-left: 0; border-top: 1px solid var(--onrule); padding-top: 24px; }
  .rd-hero .rd-cover { max-width: 240px; }
  .pages, .bk-parts, .rd-steps-list { grid-template-columns: minmax(0, 1fr); }
  .book-grid { grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 24px 32px; }
  .book-hero { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); gap: 24px 40px; }
  .about-body { border-left: 0; padding-left: 0; border-top: 4px solid var(--gold); padding-top: 20px; }
}
@media (max-width: 640px) {
  .band { padding-block: 44px; }
  /* carte du diagnostic entière sur téléphone : textes agrandis dans le repère du SVG */
  #frontier-map .svgd-name { font-size: 24px; }
  #frontier-map .svgt { font-size: 24px; }
  #frontier-map .svgt-axis { font-size: 24px; letter-spacing: 0; }
  #frontier-map .svgt-y { transform: translate(-24px, 242px) rotate(-90deg); }
  #frontier-map .svgt-axis:not(.svgt-y) { text-anchor: end; transform: translateX(213px); }
  #frontier-map .svgd-you { font-size: 24px; }
  .map { padding: 12px 8px 8px; }
  .start li, .profiles, .strat, .crit-main, .bp-why-l, .bp-grid, .grid, .cols2, .dg-cards, .ft-cols, .book-hero, .book-grid, .rd-form .row { grid-template-columns: minmax(0, 1fr); }
  .book-cover { max-width: 260px; }
  .s-book .book3d { max-width: 280px; }
  .rd-cert { padding-inline: 20px; }
  .rd-cert > .lbl { margin-inline: -20px; padding-inline: 20px; }
  .row { grid-template-columns: minmax(0, 1fr); }
  .seg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fam li { grid-template-columns: minmax(0, 1fr); }
  .site-head .wrap { padding-block: 14px; }
  .bp-by { text-align: left; }
  .result { padding: 24px 20px; }
  .devise { font-size: clamp(44px, 13vw, 60px); }
}

.next-d { margin-top: 8px; font-size: 15px; color: var(--text); max-width: var(--measure); }

/* Lot 1 (annotations de l'auteur, 21/10/2026), sur le modèle de riftveil.ai :
   colonnes de texte centrées ; les deux frontières tracées sur toute la hauteur des figures des zones (accueil, Le modèle),
   avec leur nom en titre sur leur ligne ; blocs de description aux largeurs exactes des zones ; figure des quatre profils
   en grand sur bande profonde ; couverture du livre en volume (CSS seul). */

/* colonnes de lecture centrées */
.band.doc.txt > .wrap.narrow { max-width: 38rem; }
.doc.txt p, .doc.txt li, .doc.txt .lead { max-width: none; }
.s-author .author { max-width: 38rem; margin-inline: auto; }
.s-author .author p { max-width: none; }
.s-quote > .wrap, .s-close > .wrap, .s-closing > .wrap { width: fit-content; }

/* figure des zones : une seule grille pour les zones, les lignes des frontières et les blocs de description,
   donc des limites qui tombent l'une sous l'autre à toutes les largeurs */
.zf-grid { position: relative; display: grid; grid-template-rows: auto auto auto; }
.zf-model .zf-grid { grid-template-columns: minmax(0, 250fr) minmax(0, 320fr) minmax(0, 350fr); --l1: 27.1739%; --l2: 61.9565%; }
.zf-home .zf-grid { grid-template-columns: minmax(0, 380fr) minmax(0, 420fr) minmax(0, 400fr); --l1: 31.6667%; --l2: 66.6667%; }
.zf-z1 { grid-area: 2 / 1; } .zf-z2 { grid-area: 2 / 2; } .zf-z3 { grid-area: 2 / 3; }
.zf-d1 { grid-area: 3 / 1; } .zf-d2 { grid-area: 3 / 2; } .zf-d3 { grid-area: 3 / 3; }
.zf-z { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 30px 18px 32px; min-height: 214px; }
.zf-z p { max-width: none; margin: 0; }
.zf-n { font-family: var(--serif); font-size: clamp(21px, 2.2vw, 26px); line-height: 1.15; font-weight: 500; }
.zf-s { font-size: 14px; line-height: 1.45; margin-top: 12px; max-width: 17em; }
.zf-z p.zf-s { margin-top: 12px; max-width: 17em; }
.zf-z1, .zf-d1 { background: var(--deep); }
.zf-z2, .zf-d2 { background: var(--green); }
.zf-z3, .zf-d3 { background: linear-gradient(90deg, var(--green) 0, rgba(47,107,79,.55) 9%, rgba(47,107,79,0) 25.7%), var(--gold); }
.zf-z1 .zf-n { color: var(--onband); } .zf-z1 .zf-s { color: #E4EEE8; }
.zf-z2 .zf-n { color: var(--white); } .zf-z2 .zf-s { color: #F2F7F4; }
.zf-z3 .zf-n { color: var(--ink); } .zf-z3 .zf-s { color: #3D3426; }
.zf-z p.zf-here { align-self: flex-end; margin-top: 18px; display: flex; align-items: center; gap: 10px; font-family: var(--serif); font-style: italic; font-size: 16px; line-height: 1.2; color: var(--white); }
.zf-here::after { content: ""; flex: none; width: 14px; height: 14px; border-radius: 50%; background: var(--white); border: 1.5px solid var(--ink); }
.zf-d { margin: 0; max-width: none; padding: 22px 22px 26px; font-size: 15px; line-height: 1.6; border-top: 1px solid rgba(255,255,255,.16); }
.zf-d1 { color: var(--onband); }
.zf-d2 { color: var(--white); }
.zf-d3 { color: var(--ink); padding-left: calc(25.7% + 4px); border-top-color: rgba(20,22,26,.12); }
/* les frontières : nom en titre dans un encadré centré sur sa ligne, ligne franche jusqu'au bas de la figure */
.zf-f { grid-row: 1; grid-column: 1 / -1; justify-self: start; align-self: stretch; position: relative; z-index: 3; margin-bottom: 30px; transform: translateX(-50%);
  background: var(--white); border: 1px solid var(--rule); border-top: 4px solid var(--ink); box-shadow: var(--shadow); padding: 14px 20px 18px; }
.zf-f1 { margin-left: var(--l1); }
.zf-f2 { margin-left: var(--l2); border-top-color: var(--green); }
.zf-model .zf-f { width: min(340px, 32%); }
.zf-f p { max-width: none; margin: 0; }
.zf-fn { font-family: var(--serif); font-size: clamp(22px, 2.2vw, 26px); line-height: 1.15; font-weight: 500; color: var(--deep); text-align: center; }
.zf-f2 .zf-fn { color: var(--green); }
.zf-f p.zf-fd { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--rule2); font-size: 14.5px; line-height: 1.55; color: var(--text); }
.zf-home .zf-f { padding: 10px 20px 12px; white-space: nowrap; }
.zf-l { grid-column: 1 / -1; justify-self: start; width: 4px; position: relative; z-index: 2; pointer-events: none; }
.zf-l1 { margin-left: calc(var(--l1) - 2px); }
.zf-l2 { margin-left: calc(var(--l2) - 2px); }
.zf-la { grid-row: 1; }
.zf-lb { grid-row: 2 / -1; }
.zf-l1.zf-la { background: var(--ink); }
.zf-l1.zf-lb { background: var(--onband); }
.zf-l2.zf-la { background: repeating-linear-gradient(180deg, var(--green) 0 10px, transparent 10px 16px); }
.zf-l2.zf-lb { background: repeating-linear-gradient(180deg, rgba(244,239,228,.92) 0 10px, transparent 10px 16px); }
/* accueil : zones plus hautes, noms seuls */
.zf-home .zf-z { min-height: clamp(200px, 23vw, 290px); }
.zf-home .zf-n { font-size: clamp(26px, 3vw, 36px); line-height: 1.15; }
.zf-home .zf-z3 { background: linear-gradient(90deg, var(--green) 0, rgba(47,107,79,.55) 9%, rgba(47,107,79,0) 30%), var(--gold); }
/* Le modèle : la remarque qui explique le danger, sur toute la largeur */
.zf-warn { margin-top: clamp(40px, 5vw, 56px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 16px 56px; align-items: start;
  background: var(--white); border-left: 6px solid var(--gold); box-shadow: var(--shadow); padding: clamp(24px, 3vw, 36px) clamp(22px, 3.4vw, 44px); }
.zf-warn p { max-width: none; margin: 0; }
.zf-warn .zf-warn-k { font-family: var(--serif); font-size: clamp(24px, 2.6vw, 32px); line-height: 1.25; color: var(--deep); }
.zf-warn .zf-warn-t { font-size: 16.5px; line-height: 1.65; color: var(--text); padding-top: 4px; }

/* Le modèle : quatre manières de travailler avec l'IA, bande profonde, en-tête centré, figure en grand */
.s-profiles .pf-head { max-width: 46rem; margin: 0 auto; text-align: center; }
.s-profiles .pf-head h2::before { margin-inline: auto; }
.s-profiles .pf-head p { max-width: none; }
.s-profiles .pf-head p.fine { font-size: 15.5px; line-height: 1.6; color: var(--onband); margin-top: 14px; }
.s-profiles .pf-head .sub { font-size: 17px; color: var(--onband2); margin-top: 10px; }
.pf { margin: clamp(32px, 4vw, 48px) auto 0; max-width: 1000px; }
.pf-panel { background: var(--white); border-top: 5px solid var(--gold); box-shadow: 0 26px 50px -22px rgba(0,0,0,.55), 0 3px 10px rgba(0,0,0,.22); padding: clamp(18px, 3vw, 34px) clamp(14px, 3.6vw, 46px) clamp(18px, 2.6vw, 28px); }
.pf-grid { display: grid; grid-template-columns: minmax(0, 190px) 28px minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(184px, auto) minmax(184px, auto) 28px auto auto; }
.pf p { max-width: none; margin: 0; }
.pf-panel .pf-grid .pf-yt, .pf-panel .pf-grid .pf-xt { font-size: 13px; letter-spacing: .1em; line-height: 1.4; color: var(--green); }
.pf-panel .pf-grid .pf-yt { grid-area: 1 / 3 / 2 / 5; align-self: end; padding: 0 0 12px 4px; }
.pf-panel .pf-grid .pf-xt { grid-area: 6 / 3 / 7 / 5; text-align: center; padding-top: 6px; }
.pf-panel .pf-grid .pf-yv, .pf-panel .pf-grid .pf-xv { position: relative; font-size: 15.5px; line-height: 1.35; color: var(--ink); }
.pf-panel .pf-grid .pf-yv { grid-column: 1; align-self: center; text-align: right; padding-right: 18px; }
.pf-panel .pf-grid .pf-y1 { grid-row: 2; } .pf-panel .pf-grid .pf-y2 { grid-row: 3; }
.pf-yv::after { content: ""; position: absolute; top: 50%; right: -14px; width: 24px; height: 2px; margin-top: -1px; background: var(--ink); }
.pf-panel .pf-grid .pf-xv { grid-row: 5; text-align: center; padding-top: 12px; }
.pf-panel .pf-grid .pf-x1 { grid-column: 3; } .pf-panel .pf-grid .pf-x2 { grid-column: 4; }
.pf-xv::before { content: ""; position: absolute; left: 50%; top: -14px; width: 2px; height: 22px; margin-left: -1px; background: var(--ink); }
.pf-ya { grid-area: 1 / 2 / 5 / 3; position: relative; }
.pf-ya::before { content: ""; position: absolute; left: 50%; top: 8px; bottom: 13px; width: 2px; margin-left: -1px; background: var(--ink); }
.pf-ya::after { content: ""; position: absolute; left: 50%; top: 0; margin-left: -7px; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 13px solid var(--ink); }
.pf-xa { grid-area: 4 / 2 / 5 / 5; position: relative; }
.pf-xa::before { content: ""; position: absolute; top: 50%; left: 13px; right: 8px; height: 2px; margin-top: -1px; background: var(--ink); }
.pf-xa::after { content: ""; position: absolute; top: 50%; right: 0; margin-top: -7px; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 13px solid var(--ink); }
.pf-q { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 26px 30px 28px; box-shadow: inset 0 0 0 3px var(--white); }
.pf-hl { grid-area: 2 / 3; background: var(--gold); }
.pf-hh { grid-area: 2 / 4; background: var(--green); }
.pf-ll { grid-area: 3 / 3; background: var(--deep); }
.pf-lh { grid-area: 3 / 4; background: var(--warm); box-shadow: inset 0 0 0 3px var(--white), inset 0 0 0 4px var(--rule); }
.pf .pf-pos { font-size: 14.5px; line-height: 1.4; }
.pf .pf-n { font-family: var(--serif); font-size: clamp(26px, 2.8vw, 34px); line-height: 1.12; font-weight: 500; overflow-wrap: normal; }
.pf .pf-hl .pf-n { color: var(--ink); } .pf .pf-hl .pf-pos { color: #3D3426; }
.pf .pf-hh .pf-n { color: var(--white); } .pf .pf-hh .pf-pos { color: #E4EEE8; }
.pf .pf-ll .pf-n { color: var(--onband); } .pf .pf-ll .pf-pos { color: var(--onband2); }
.pf .pf-lh .pf-n { color: var(--deep); } .pf .pf-lh .pf-pos { color: var(--text); }
/* les quatre cartes, inchangées, sur la bande profonde */
.band.deep .profile h3 { color: var(--deep); }
.band.deep .profile p, .band.deep .profile .p-zone, .band.deep .profile .p-tl { color: var(--text); }
.s-profiles .cta-row { justify-content: center; }

/* Le diagnostic : carte entière entre la tablette et le téléphone (textes du SVG à 13 px au moins) */
@media (min-width: 641px) and (max-width: 860px) {
  #frontier-map .svgt { font-size: 15px; }
  #frontier-map .svgt-axis { font-size: 15px; letter-spacing: .5px; }
  #frontier-map .svgd-you { font-size: 15.5px; }
  #frontier-map .you-pill { x: -100px; width: 200px; height: 26px; y: 16px; rx: 13px; }
}

/* La couverture du livre en volume : légère perspective, tranche des pages à droite, dos plus sombre à gauche,
   ombre portée en plusieurs couches, liseré et halo clairs qui la détachent du fond vert. CSS seul. */
.book3d { position: relative; display: block; transform: perspective(1500px) rotateY(-14deg); transform-style: preserve-3d;
  box-shadow: 0 0 2px 1px rgba(244,239,228,.42), 0 2px 4px rgba(0,0,0,.25), 0 14px 26px -8px rgba(0,0,0,.5), 0 36px 64px -20px rgba(0,0,0,.65), 0 0 56px 10px rgba(244,239,228,.16), 0 0 150px 46px rgba(244,239,228,.11); }
.book3d img { display: block; width: 100%; height: auto; }
.book3d::before { content: ""; position: absolute; top: 1.2%; bottom: 1.2%; left: 100%; width: 30px; transform-origin: 0 50%; transform: rotateY(90deg);
  background: linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,0) 30%, rgba(0,0,0,.08)), repeating-linear-gradient(90deg, #F7F3EA 0 2px, #DDD6C6 2px 3px); }
.book3d::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 7%; pointer-events: none; transform: translateZ(.5px);
  background: linear-gradient(90deg, rgba(0,0,0,.45) 0, rgba(0,0,0,.18) 34%, rgba(255,255,255,.16) 50%, rgba(0,0,0,.14) 66%, rgba(0,0,0,0) 100%); }
.s-book, .s-bookhero, .s-rdhero { overflow: clip; }
.band:not(.deep) .book3d { box-shadow: 0 2px 4px rgba(20,22,26,.16), 0 14px 26px -8px rgba(20,22,26,.32), 0 34px 60px -22px rgba(20,22,26,.42); }


/* Pour les lecteurs : le formulaire à côté de son titre */
@media (min-width: 921px) {
  .rd-form { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); grid-auto-flow: row dense; gap: 0 56px; align-items: start; }
  .rd-form > h3, .rd-form > fieldset { grid-column: 1; }
  .rd-form > fieldset { grid-row: span 4; }
  .rd-form > .row, .rd-form > .consent, .rd-form > button, .rd-form > .fine { grid-column: 2; }
  .rd-form > button { justify-self: start; }
  .rd-form > label.consent { margin-top: 4px; }
}

/* entre le téléphone et la tablette : encadrés des frontières sur la largeur, chacun attaché à sa ligne */
@media (min-width: 641px) and (max-width: 919px) {
  .zf-model .zf-f { transform: none; }
  .zf-model .zf-f1 { margin-left: 0; width: calc((var(--l1) + var(--l2)) / 2 - 10px); }
  .zf-model .zf-f2 { margin-left: calc((var(--l1) + var(--l2)) / 2 + 10px); width: calc(100% - (var(--l1) + var(--l2)) / 2 - 10px); }
  .zf-model .zf-d { padding: 18px 14px 22px; font-size: 14.5px; }
  .zf-model .zf-d3 { padding-left: calc(25.7% + 2px); }
  .zf-model .zf-z { padding-inline: 12px; }
  .pf-grid { grid-template-columns: minmax(0, 132px) 24px minmax(0, 1fr) minmax(0, 1fr); }
  .pf-q { padding: 20px 18px 22px; }
  .zf-warn { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 920px) {
  .crit-main { grid-template-columns: minmax(0, 1fr); }
  .crit-main p + p { margin-top: .9em; }
}
@media (max-width: 640px) {
  /* zones empilées ; chaque frontière est une ligne horizontale, son encadré posé dessus */
  .zf-model .zf-grid, .zf-home .zf-grid { grid-template-columns: minmax(0, 1fr); }
  .zf-model .zf-z1 { grid-area: 1 / 1; } .zf-model .zf-d1 { grid-area: 2 / 1; } .zf-model .zf-f1, .zf-model .zf-l1.zf-la { grid-area: 3 / 1; }
  .zf-model .zf-z2 { grid-area: 4 / 1; } .zf-model .zf-d2 { grid-area: 5 / 1; } .zf-model .zf-f2, .zf-model .zf-l2.zf-la { grid-area: 6 / 1; }
  .zf-model .zf-z3 { grid-area: 7 / 1; } .zf-model .zf-d3 { grid-area: 8 / 1; }
  .zf-home .zf-z1 { grid-area: 1 / 1; } .zf-home .zf-f1, .zf-home .zf-l1.zf-la { grid-area: 2 / 1; }
  .zf-home .zf-z2 { grid-area: 3 / 1; } .zf-home .zf-f2, .zf-home .zf-l2.zf-la { grid-area: 4 / 1; }
  .zf-home .zf-z3 { grid-area: 5 / 1; }
  .zf-f, .zf-model .zf-f { justify-self: center; width: auto; max-width: calc(100% - 48px); margin: 22px 0; transform: none; }
  .zf-home .zf-f { white-space: normal; }
  .zf-l { justify-self: stretch; align-self: center; width: auto; height: 4px; margin: 0; }
  .zf-lb { display: none; }
  .zf-l2.zf-la { background: repeating-linear-gradient(90deg, var(--green) 0 10px, transparent 10px 16px); }
  .zf-z { min-height: 0; padding: 26px 18px 18px; }
  .zf-home .zf-z { min-height: 140px; padding-bottom: 26px; }
  .zf-z3, .zf-home .zf-z3 { background: linear-gradient(180deg, var(--green) 0, rgba(47,107,79,.55) 22px, rgba(47,107,79,0) 64px), var(--gold); }
  .zf-d3 { background: var(--gold); }
  .zf-d { border-top: 0; padding: 4px 18px 24px; }
  .zf-d3, .zf-model .zf-d3 { padding-left: 18px; }
  .zf-z p.zf-here { margin-top: 14px; }
  .zf-warn { grid-template-columns: minmax(0, 1fr); border-left-width: 5px; }
  /* quatre profils : axes conservés, valeurs de l'axe vertical le long de l'axe */
  .pf-panel { padding: 16px 10px 16px; }
  .pf-grid { grid-template-columns: 34px 16px minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(168px, auto) minmax(168px, auto) 22px auto auto; }
  .pf-panel .pf-grid .pf-yv { writing-mode: vertical-rl; transform: rotate(180deg); text-align: center; justify-self: center; padding: 0; font-size: 14px; line-height: 1.2; }
  .pf-yv::after { display: none; }
  .pf-panel .pf-grid .pf-xv { font-size: 14px; padding-top: 10px; }
  .pf-xv::before { top: -11px; height: 18px; }
  .pf-panel .pf-grid .pf-yt, .pf-panel .pf-grid .pf-xt { font-size: 13px; letter-spacing: .06em; }
  .pf-panel .pf-grid .pf-yt { grid-column: 2 / 5; padding-left: 22px; }
  .pf-q { padding: 14px 10px 16px; gap: 6px; justify-content: flex-start; }
  .pf .pf-n { font-size: 19px; }
  .pf .pf-pos { font-size: 13px; line-height: 1.35; }
  .pf-ya::before { bottom: 11px; }
  .pf-xa::before { left: 9px; }
  .book3d { transform: perspective(1500px) rotateY(-8deg); }
  .rs-grid { gap: 28px; }
  .excerpts .bp-ex blockquote { padding: 18px 18px 20px; }
  .excerpts .bp-ex figcaption { padding-left: 23px; }
}

/* Lot 3 (annotations de l'auteur, 21/10/2026) */

/* accueil : la page Le modèle devient l'accueil. Le titre de la bande Position devient le h1 (même rendu),
   l'en-tête du modèle devient un h2 de même taille qu'avant */
h1.stance-title { letter-spacing: normal; overflow-wrap: anywhere; }
.band.page-head .page-head h2 { font-size: clamp(34px, 4.4vw, 46px); line-height: 1.1; letter-spacing: -.005em; }
/* Rester informé, sur bande profonde : le formulaire reste une carte claire */
.band.deep.s-loop form { border: 0; border-top: 5px solid var(--gold); box-shadow: 0 26px 50px -24px rgba(0,0,0,.6), 0 2px 8px rgba(0,0,0,.2); }
.band.deep.s-loop form .fine { color: var(--muted); }
.band.deep.s-loop form a:not(.btn) { color: var(--green); text-decoration-color: rgba(47,107,79,.45); }
.band.deep.s-loop form a:not(.btn):hover { color: var(--ink); }
.band.deep.s-loop form a:focus-visible, .band.deep.s-loop form input:focus-visible, .band.deep.s-loop form button:focus-visible { outline-color: var(--green); }

/* Le diagnostic : carte au langage de la figure des quatre profils (quadrants teintés, noms en grand serif, axes nets) */
.map { border-top-color: var(--gold); }
#frontier-map .you-pill2, #frontier-map .svgd-you2 { display: none; }
/* les douze affirmations : cartes à relief, grand numéro, choix en boutons segmentés */
.rows { margin-top: 40px; border-top: 0; display: grid; gap: 14px; }
.rows .row { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 14px 36px; padding: 20px 24px 20px 20px; background: var(--white); border: 1px solid var(--rule); border-left: 5px solid var(--rule);
  box-shadow: 0 12px 26px -18px rgba(20,22,26,.32), 0 1px 3px rgba(20,22,26,.06); transition: border-color .15s ease; }
.rows .row.answered { border-left-color: var(--gold); }
.rows .row p { font-size: 16.5px; line-height: 1.5; gap: 18px; align-items: baseline; }
.rows .row .n { font-size: 42px; line-height: .8; width: 1.2em; text-align: right; color: var(--green); }
.rows .row.answered .n { color: var(--gold-ink); }
.rows .seg { gap: 1px; background: rgba(47,107,79,.45); border: 1.5px solid var(--green); }
.rows .seg button { border: 0; padding: 12px 8px; font-size: 14px; color: var(--ink); background: var(--white); transition: background-color .12s ease; }
.rows .seg button:hover { background: #EAF2EC; color: var(--ink); }
.rows .seg button[aria-pressed="true"], .rows .seg button[aria-pressed="true"]:hover { background: var(--deep); color: var(--white); }
.rows .seg button .dot { border-color: var(--green); }
.rows .seg button[aria-pressed="true"] .dot { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 0 2px rgba(233,168,58,.35); }
.rows .seg button:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; position: relative; z-index: 1; }
/* Et maintenant : la carte Riftveil Practitioner et son certificat */
.dg-cards .dg-cert { display: block; width: 100%; height: auto; margin: 18px 0 8px; box-shadow: 0 12px 26px -16px rgba(20,22,26,.5), 0 1px 4px rgba(20,22,26,.14); }

/* Pour les lecteurs : spécimen du certificat à droite du bloc Practitioner */
.rd-cert { grid-template-columns: minmax(0, 1fr) minmax(0, 400px); column-gap: 48px; align-items: center; }
.rd-cert > .lbl { grid-column: 1 / -1; }
.rd-cert-img { margin: 0; }
.rd-cert-img img { display: block; width: 100%; height: auto; box-shadow: var(--shadow); }

/* couverture en volume : bords lissés (pas d'escalier) */
.book3d, .book3d img { -webkit-backface-visibility: hidden; backface-visibility: hidden; outline: 1px solid transparent; }

/* La formation : les programmes avec leurs certificats, dans l'ordre de riftveil.ai */
.fm-col { max-width: 40rem; margin-inline: auto; }
.fm-col p { max-width: none; }
.fm-head h1 { color: var(--deep); margin-bottom: 20px; }
.fm-head .lead { font-size: 20px; }
.fm-lbl { font-size: 13.5px; color: var(--green); margin-bottom: 8px; }
.fm-name { font-size: clamp(30px, 3.4vw, 42px); line-height: 1.12; color: var(--deep); }
.fm-hook { font-family: var(--serif); font-style: italic; font-size: clamp(20px, 2vw, 24px); line-height: 1.38; color: var(--ink); margin-top: 14px; max-width: none; }
.fm-step { font-size: 16.5px; line-height: 1.65; margin-top: 20px; max-width: none; }
.fm-in { font-family: var(--serif); font-size: 22px; line-height: 1.3; color: var(--deep); }
.fm-cert-img { margin: 0; }
.fm-cert-img img { display: block; width: 100%; height: auto; box-shadow: 0 24px 48px -22px rgba(20,22,26,.55), 0 2px 6px rgba(20,22,26,.14); }
.fm-p-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 600px); gap: 32px 64px; align-items: center; }
.fm-p-text { border-left: 5px solid var(--gold); padding-left: 28px; }
.fm-w .fm-intro { max-width: 44rem; margin: 0 auto 44px; }
.fm-w-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 48px; }
.fm-card { background: var(--warm); border-top: 5px solid var(--green); padding: 26px 26px 30px; }
.fm-card + .fm-card { border-top-color: var(--gold); }
.fm-card .fm-cert-img { margin-bottom: 24px; }
.fm-card .fm-name { font-size: clamp(25px, 2.5vw, 31px); }
.fm-card .fm-hook { font-size: clamp(19px, 1.8vw, 22px); }
.fm-a-grid { display: grid; grid-template-columns: minmax(0, 540px) minmax(0, 1fr); gap: 32px 64px; align-items: center; }
.fm-end .fm-cert { font-family: var(--serif); font-size: clamp(22px, 2.4vw, 28px); line-height: 1.35; color: var(--white); margin-bottom: 26px; }
@media (max-width: 920px) {
  .fm-p-grid, .fm-a-grid { grid-template-columns: minmax(0, 1fr); }
  .rd-cert { grid-template-columns: minmax(0, 1fr); }
  .rd-cert-img { max-width: 520px; margin-top: 4px; }
}
@media (max-width: 640px) {
  .fm-w-grid { grid-template-columns: minmax(0, 1fr); }
  .fm-p-text { padding-left: 18px; }
  .fm-card { padding: 20px 18px 24px; }
  .rows .row { grid-template-columns: minmax(0, 1fr); padding: 16px 14px 16px 12px; }
  .rows .row .n { font-size: 34px; }
  #frontier-map .you-pill, #frontier-map .svgd-you { display: none; }
  #frontier-map .you-pill2, #frontier-map .svgd-you2 { display: inline; }
}

/* 23/10/2026 : le menu du haut et les deux autres sites.
   17 h 30 (demande de l'auteur) : les deux autres sites se distinguent des pages du site : filet vertical et espace, pastille carrée
   à la couleur de marque du site visé (une pastille = une couleur), flèche de lien externe après le nom ; sur téléphone, filet et
   légende « Les trois sites ».
   19 h 45 (décision de l'auteur, variante A) : les deux autres sites à la taille des liens du menu (plus petits seulement entre
   1 101 et 1 279 px, faute de place), graisse 500, couleur pleine du texte, pastille de 9 px ; au survol et au focus clavier, le nom
   prend la couleur de marque du site visé. Le lien de langue sort du groupe : sur ordinateur, à l'extrême droite de l'en-tête, après
   son propre espace ; sur téléphone, à côté du bouton « Menu », visible sans ouvrir le menu (il n'est plus dans le panneau).
   Couleurs de marque : un seul endroit, les variables --fam-… (pastilles) et --fam-…-t (texte au survol et au focus : la nuance
   lisible sur le fond de l'en-tête, contraste d'au moins 4,5:1 ; AttestScope : son laiton foncé). */
.site-head { --fam-hf: #2F6B4F; --fam-rv: #33506E; --fam-as: #9C7A2E; --fam-hf-t: #2F6B4F; --fam-rv-t: #33506E; --fam-as-t: #7A5C1E; }
.site-head .wrap { column-gap: 24px; }
.nav-d { margin-left: auto; }
.site-head .wrap > .lang { margin-left: 4px; }
.nav-d .nav-fam { padding-left: 22px; gap: 4px 18px; }
.nav-fam a { display: inline-flex; align-items: center; gap: 7px; }
.nm-fam a { display: flex; align-items: center; gap: 10px; }
.nav-fam a::before, .nm-fam a::before { content: ""; flex: none; width: 9px; height: 9px; background: var(--fam-c, var(--muted)); }
/* la flèche de lien externe (↗), dessinée en CSS : les polices des sites n'ont pas ce caractère */
.nav-fam a::after, .nm-fam a::after { content: ""; flex: none; width: .66em; height: .66em; background-color: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.4h4.2v4.2' fill='none' stroke='%23000' stroke-width='1.25'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.2 7.8 7.6 2.4M3.4 2.4h4.2v4.2' fill='none' stroke='%23000' stroke-width='1.25'/%3E%3C/svg%3E") center / contain no-repeat; }
:is(.nav-fam, .nm-fam) a[href*="humanfrontier.ai"] { --fam-c: var(--fam-hf); --fam-t: var(--fam-hf-t); }
:is(.nav-fam, .nm-fam) a[href*="riftveil.ai"] { --fam-c: var(--fam-rv); --fam-t: var(--fam-rv-t); }
:is(.nav-fam, .nm-fam) a[href*="attestscope.ai"] { --fam-c: var(--fam-as); --fam-t: var(--fam-as-t); }
:is(.nav-fam, .nm-fam) a:is(:hover, :focus-visible) { color: var(--fam-t, var(--ink)); text-decoration: none; }
.nav-m-panel .nm-main li:last-child a, .nav-m-panel .nm-fam li:last-child a { border-bottom: 0; }
.nav-m-panel .nm-fam { margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--rule); }
.nm-fam::before { content: "Les trois sites"; content: "Les trois sites" / ""; display: block; font-size: 11.5px; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding-bottom: 2px; }
html[lang="en"] .nm-fam::before { content: "The three sites"; content: "The three sites" / ""; }
/* entre 1 101 et 1 279 px, espacements resserrés (et, sous 1 180 px puis sous 1 130 px, les deux autres sites un peu plus petits)
   pour que le menu reste sur une ligne, dans la largeur de l'en-tête */
@media (max-width: 1279px) {
  .site-head .wrap { column-gap: 20px; }
  .nav-d { gap: 18px; }
  .nav-d .nav-main { column-gap: 12px; }
  .nav-d .nav-fam { padding-left: 16px; column-gap: 14px; }
}
@media (max-width: 1179px) {
  .site-head .wrap { column-gap: 16px; }
  .nav-d { gap: 14px; }
  .nav-d .nav-main { column-gap: 10px; }
  .nav-d .nav-fam { padding-left: 12px; column-gap: 12px; }
  .nav-fam a { font-size: 13px; gap: 6px; }
}
@media (max-width: 1129px) {
  .site-head .wrap { column-gap: 12px; }
  .site-head .wrap > .lang { margin-left: 6px; }
  .nav-d { gap: 12px; }
  .nav-d .nav-main { column-gap: 8px; }
  .nav-d .nav-fam { padding-left: 10px; }
  .nav-fam a { font-size: 12.5px; }
}
/* téléphone et tablette : le lien de langue à côté du bouton « Menu », à la même hauteur que lui */
@media (max-width: 1100px) {
  .site-head .wrap { column-gap: 10px; }
  .site-head .wrap > .lang { margin-left: auto; align-self: stretch; display: inline-flex; align-items: center; }
  .nav-m { flex: none; }
  .nav-m summary { white-space: nowrap; }
}
/* très petits écrans (moins de 360 px) : le nom du site, le bouton de langue et « Menu » tiennent sur la ligne */
@media (max-width: 359px) {
  .site-head .wrap { column-gap: 8px; }
  .brand .disp { font-size: 20px; }
  .site-head .wrap > .lang { padding-inline: 8px; }
  .nav-m summary { padding-inline: 10px; }
}

/* impression : fonds clairs, texte encre, sans ombre */
@media print {
  main *, footer *, .site-head * { color: #000 !important; background: transparent !important; box-shadow: none !important; text-shadow: none !important; }
  body, .band, .foot { background: #fff !important; color: #000 !important; }
  .site-head, .nav-m, .skip, .cta, .bk-actions, .rv-cta, .s-loop form { display: none !important; }
  .band { border-top: 1px solid #999; padding-block: 24px; }
  .pages li, .zf-z, .zf-d, .zf-f, .zf-warn, .pf-q, .profile, .strat-c, .bp-grid li, .rd-steps-list li, .dg-cards li, .tool, .card, .bk-part, .rd-cert { border: 1px solid #999 !important; }
  .pages li, .profile, .strat-c, .bp-grid li, .bp-why-l li, .rd-steps-list li, .dg-cards li, .tool, .card, .bk-part, .rd-cert, .start li, .row, .fig, .zf-warn { break-inside: avoid; }
  .zf-l { background: #000 !important; }
  .book3d { transform: none; }
  a { text-decoration: underline; }
}

/* Riftveil, l’outil du modèle (accueil, après « Le critère de test », 30/10/2026) : composants du site (bande foncée, citation, étapes) */
.s-rvtool .lbl { margin-bottom: 14px; }
.s-rvtool .rvt-quote { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.25; max-width: 22em; border-left: 5px solid var(--gold); padding-left: 28px; color: var(--white); }
.band > .wrap > h2.rvt-quote::before { content: none; display: none; }
.s-rvtool .rvt-p { margin-top: 24px; padding-left: 33px; font-size: 17px; line-height: 1.6; max-width: 40em; }
.rvt-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.rvt-steps li { flex-direction: column; gap: 10px; padding: 20px 20px 24px; max-width: none; }
.rvt-steps .n { font-size: 40px; }
.rvt-steps h3 { font-size: 22px; margin-bottom: 6px; color: var(--white); }
.rvt-steps p { font-size: 14.5px; line-height: 1.5; max-width: none; }
.s-rvtool .rvt-foot { margin-top: 28px; font-family: var(--serif); font-size: 22px; color: var(--gold); max-width: none; }
.s-rvtool .cta-row { margin-top: 28px; }
.profile .p-rv { margin-top: 14px; font-size: 15px; }
.band.deep .profile .p-rv a { color: var(--green); text-decoration-color: rgba(47,107,79,.45); }
@media (max-width: 1080px) { .rvt-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .rvt-steps { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 28px; } .rvt-steps li { flex-direction: row; align-items: baseline; gap: 16px; padding: 14px 18px 16px; } .rvt-steps .n { font-size: 30px; min-width: .8em; } .rvt-steps h3 { font-size: 20px; margin-bottom: 2px; } .s-rvtool .rvt-quote { padding-left: 20px; } .s-rvtool .rvt-p { padding-left: 25px; } }
/* « Et maintenant » (diagnostic) : couverture du livre, petite */
.dg-cards .dg-cover { display: block; width: 120px; margin: 18px 0 8px; }
.dg-cards .dg-cover img { display: block; width: 100%; height: auto; box-shadow: 0 10px 22px -14px rgba(20,22,26,.5), 0 1px 4px rgba(20,22,26,.14); }
/* 30/10/2026, 21 h 24 (corrections approuvées) : bloc Riftveil, « Aucun verdict… » en or (la règle .band.deep p l’emportait, rapport visuel M4) */
.band.deep p.rvt-foot { color: var(--gold); }
/* Diagnostic, « Et maintenant » : la couverture du livre et son lien alignés sur le certificat et son lien de la carte voisine (rapport visuel M5) */
.dg-next .dg-cards li:has(> :is(.dg-cover, .dg-cert)) { display: flex; flex-direction: column; }
.dg-next .dg-cards li > :is(.dg-cover, .dg-cert) { margin-top: auto; }
.dg-next .dg-cards li > .cc-p:has(+ :is(.dg-cover, .dg-cert)) { margin-bottom: 18px; }