/* transmia.fr v3, la façade : sol ink-blue la nuit, calcaire le jour, une seule lampe ambre.
   Source Serif 4 (texte, optique automatique) + Geist. Un seul rayon : 2 px, partout. */

@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/source-serif-4.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400 700;font-display:swap;src:url(/assets/fonts/source-serif-4-italic.woff2) format("woff2")}
@font-face{font-family:"Geist";font-style:normal;font-weight:300 700;font-display:swap;src:url(/assets/fonts/geist.woff2) format("woff2")}

:root{
  --night:#0e1524;--night-2:#16203a;--night-3:#1f2b4a;
  --stone:#e4e6e4;--stone-2:#d8dcd9;--card:#eff1ef;--ink:#12192b;--ink-soft:#4a5368;--line:#c5cac6;
  --amber:#e4a441;--amber-soft:#f3d49b;--amber-deep:#85540f;
  --moon:#dde2ee;--moon-soft:#b9c2d6;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;--sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:2px;--wrap:1320px;--text:66ch;--gut:clamp(1.25rem,4.2vw,4.5rem);--sh-h:64px;
  --ease:cubic-bezier(.23,1,.32,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--stone);color:var(--ink);font:400 17.5px/1.62 var(--sans);overflow-x:clip}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--amber-deep);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--ink);text-decoration-thickness:2px}
.hh a:not(.btn):hover,.pl a:not(.btn):hover,.hero a:not(.btn):hover,.band-dark a:not(.btn):hover,.px a:hover,.sf a:hover,.mhero a:not(.btn):hover,.fx a:not(.btn):hover{color:var(--amber-soft)}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
::selection{background:var(--amber);color:var(--night)}
h1,h2,h3{font-family:var(--serif);font-optical-sizing:auto;font-weight:600;line-height:1.08;letter-spacing:-.018em;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2.4rem,1rem + 4.4vw,4.5rem);line-height:1.02}
.hero h1{font-size:clamp(2.6rem,1rem + 5vw,5.2rem);line-height:1;max-width:16em}
h2{font-size:clamp(1.9rem,1.1rem + 2.4vw,3.2rem)}
h3{font-size:1.4rem;font-weight:600;line-height:1.2}
p{margin:0 0 1em}
ul,ol{padding-left:1.25em;margin:0 0 1em}
li{margin:.3em 0}
.prose ul:not([class]){list-style:none;padding-left:1.3em}
.prose ul:not([class])>li{position:relative}
.prose ul:not([class])>li::before{content:"";position:absolute;left:-1.3em;top:.62em;width:.55em;height:.55em;background:var(--amber)}
.wrap{width:min(100% - 2 * var(--gut),var(--wrap));margin:0 auto;padding:0}
.prose>p,.prose>ul,.prose>ol,.prose>h2,.prose>h3,.prose>.source,.prose>.note,.prose>.lede,.prose>.answer,.prose>.faq,.prose>details,.prose>.callout,.prose>form,.prose>.eyebrow,.prose>blockquote{max-width:var(--text)}
.prose .table-wrap{max-width:60rem}
.hero .wrap.prose .answer{max-width:60rem}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:8px 12px;z-index:200}
.skip:focus{left:8px;top:8px}
.skip:hover{color:#fff}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ------------------------------------------------------------ en-tête -- */
.sh{position:sticky;top:0;z-index:100;height:var(--sh-h);color:var(--stone);background:color-mix(in oklab,var(--night) 92%,transparent);border-bottom:1px solid color-mix(in oklab,var(--moon) 14%,transparent);transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s}
body:has(.hero,.mhero,.hh) .sh{margin-bottom:calc(var(--sh-h) * -1);background:linear-gradient(180deg,rgba(14,21,36,.78),rgba(14,21,36,0));border-bottom-color:transparent}
.sh.is-solid,body:has(.hero,.mhero,.hh) .sh.is-solid{background:var(--night);border-bottom-color:rgba(215,220,234,.14)}
.sh__in{height:100%;max-width:1440px;margin:0 auto;padding:0 var(--gut);display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.sh__brand{font:600 1.5rem/1 var(--serif);letter-spacing:-.015em;color:inherit;text-decoration:none}
.sh__brand:hover{color:inherit}
.sh__nav{display:flex;align-items:center;gap:clamp(1rem,2.2vw,2.1rem)}
.sh__nav a{color:inherit;text-decoration:none;font:500 .98rem/1 var(--sans)}
.sh__nav a:not(.btn){padding:.5rem 0;box-shadow:inset 0 -2px 0 transparent;transition:box-shadow .2s}
.sh__nav a:not(.btn):hover,.sh__nav a[aria-current=page]{color:inherit;box-shadow:inset 0 -2px 0 var(--amber)}
.sh__toggle{display:none;background:none;border:1px solid color-mix(in oklab,currentColor 40%,transparent);border-radius:var(--r);color:inherit;padding:.55rem .85rem;font:500 .95rem/1 var(--sans);cursor:pointer}

/* ------------------------------------------------------------ boutons -- */
.btn{display:inline-block;background:var(--amber);color:var(--night);border:0;border-radius:var(--r);padding:.95rem 1.5rem;font:600 1rem/1.2 var(--sans);text-decoration:none;cursor:pointer;text-align:center;white-space:nowrap;transition:transform 140ms var(--ease),background-color 160ms}
.btn:hover{background:#f0b758;color:var(--night)}
.btn:active{transform:translateY(1px) scale(.985)}
.btn--sm,.btn-small{padding:.6rem 1rem;font-size:.95rem}
.sh .btn{background:transparent;color:var(--amber);box-shadow:inset 0 0 0 1.5px var(--amber)}
.sh .btn:hover{background:var(--amber);color:var(--night)}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--stone)}
.cta-note{display:block;font-size:.95rem;color:var(--ink-soft);margin-top:.7rem}
.band-dark .cta-note,.hero .cta-note,.mhero .cta-note{color:var(--moon)}

/* ----------------------------------------------------------- sections -- */
section{padding:clamp(3.2rem,7vw,5.5rem) 0}
section.tight{padding:clamp(2rem,4vw,3rem) 0}
.band{background:var(--stone-2)}
.band-dark{background:var(--night);color:var(--moon)}
.band-dark h2,.band-dark h3,.band-dark h1{color:var(--stone)}
.band-dark a:not(.btn){color:var(--amber)}
.eyebrow{display:block;font:600 .8rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:1rem}
.band-dark .eyebrow,.hero .eyebrow{color:var(--amber)}
.lede{font-size:1.2rem;line-height:1.55;color:var(--ink-soft);max-width:60ch}
.band-dark .lede,.hero .lede{color:var(--moon)}
.answer{background:var(--card);padding:1.4rem 1.5rem;margin:0 0 1.8rem;max-width:var(--text);border-radius:var(--r);position:relative}
.answer::before{content:"";display:block;width:2.4rem;height:3px;background:var(--amber);margin-bottom:.9rem}
.answer p:last-child{margin:0}
.note{font-size:.98rem;color:var(--ink-soft)}
.source{font-size:.9rem;color:var(--ink-soft)}
.band-dark .note,.band-dark .source{color:var(--moon-soft)}
.callout{background:color-mix(in oklab,var(--amber) 16%,var(--card));padding:1.2rem 1.4rem;max-width:var(--text);border-radius:var(--r)}
.signature{font-family:var(--serif);font-style:italic;color:var(--ink-soft)}

/* premier écran des pages intérieures : une bande de nuit, le haut de la façade */
.hero{position:relative;isolation:isolate;background:var(--night);color:var(--moon);padding:calc(var(--sh-h) + clamp(3.6rem,7vw,5.4rem)) 0 clamp(2.8rem,6vw,4.6rem);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,21,36,.94) 0%,rgba(14,21,36,.78) 36%,rgba(14,21,36,.34) 66%,rgba(14,21,36,.12) 100%),url(/assets/plate/nuit.webp) 60% 28%/cover no-repeat}
.hero h1,.hero h2,.hero h3{color:var(--stone)}
.hero p,.hero li{color:var(--moon)}
.hero a:not(.btn){color:var(--amber)}
.hero .answer{background:rgba(231,230,224,.97);color:var(--ink);border-left-color:var(--amber);box-shadow:0 18px 40px -12px rgba(0,0,0,.5)}
.hero .answer p,.hero .answer li{color:var(--ink)}
.hero .answer a{color:var(--amber-deep)}
.hero .callout,.hero .card{background:rgba(231,230,224,.97);color:var(--ink)}
.hero .callout p,.hero .card p,.hero .card li{color:var(--ink)}
.hero form.lead label{color:var(--stone)}
.hero ul,.hero ol{color:var(--moon)}
.crumbbar{position:absolute;top:var(--sh-h);left:0;right:0;z-index:5;background:none;pointer-events:none}
.crumbbar a{pointer-events:auto}
.breadcrumb{font-size:.9rem;color:var(--moon-soft);padding:.9rem 0 0;width:min(100% - 2 * var(--gut),var(--wrap));margin:0 auto}
.breadcrumb a{color:var(--moon-soft)}
.breadcrumb ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem}
.breadcrumb li{margin:0}
.breadcrumb li+li::before{content:"/";margin-right:.4rem;color:var(--moon-soft)}
.breadcrumb li[aria-current]{color:var(--moon)}

/* ------------------------------------------------ grilles et blocs -- */
.grid{display:grid;gap:1.4rem}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.5rem}
.card h3{margin-bottom:.35em}
.card p:last-child{margin-bottom:0}
a.card{display:block;text-decoration:none;color:var(--ink);transition:transform .2s var(--ease)}
a.card:hover{transform:translateY(-2px);color:var(--ink)}
a.card .more{color:var(--amber-deep);font-weight:600;margin-top:.7rem;display:block}
.price{font:600 2.2rem/1.1 var(--serif);margin:.2em 0}
.tag{display:inline-block;font:600 .8rem/1 var(--sans);color:var(--ink);background:var(--stone-2);border-radius:var(--r);padding:.4rem .6rem;margin-bottom:.7rem}
.timeline{list-style:none;padding:0;margin:0;border-left:2px solid var(--amber-deep);max-width:var(--text)}
.timeline li{position:relative;padding:0 0 1.6rem 1.7rem;margin:0}
.timeline li::before{content:"";position:absolute;left:-8px;top:.5rem;width:14px;height:14px;background:var(--stone);border:2px solid var(--amber-deep);border-radius:50%}
.timeline .when{font:600 .85rem/1.4 var(--sans);color:var(--amber-deep);text-transform:uppercase;letter-spacing:.08em;display:block}
.timeline h3{margin:.15em 0 .3em;font-size:1.5rem}
.table-wrap{overflow-x:auto;margin:0 0 1.4rem;max-width:100%}
table{border-collapse:collapse;width:100%;font-size:1rem;background:transparent}
th,td{border:0;border-bottom:1px solid var(--line);padding:.85rem .9rem .85rem 0;text-align:left;vertical-align:top}
td:first-child{font-weight:600;font-family:var(--serif);font-size:1.12rem;line-height:1.25}
th{background:transparent;color:var(--ink);font:600 .8rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;border-width:0 0 2px;border-color:var(--ink)}
caption{caption-side:bottom;font-size:.88rem;color:var(--ink-soft);text-align:left;padding-top:.4rem}
.faq details{border-bottom:1px solid var(--line);padding:1rem 0;max-width:var(--text)}
.faq summary{font:600 1.2rem/1.3 var(--serif);cursor:pointer;list-style:none;padding-right:2rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:0;color:var(--amber-deep);font:400 1.5rem/1 var(--sans)}
.faq details[open] summary::after{content:"\2212"}
.faq details>div,.faq details>p{padding-top:.6rem}
.band-dark .faq details{border-color:rgba(215,220,234,.2)}
.band-dark .faq summary::after{color:var(--amber)}
.person-card{display:flex;gap:1rem;align-items:center;margin:2rem 0;padding:1rem 1.25rem;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.person-card img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.person-card p{margin:0;line-height:1.5}
.person-card a{color:inherit}

/* ------------------------------------------------------ formulaires -- */
form.lead{display:grid;gap:1rem;max-width:560px}
label{font-weight:600;font-size:.95rem;display:block;margin-bottom:.3rem}
input,select,textarea{width:100%;font:inherit;font-size:1rem;padding:.75rem .8rem;border:1px solid #8b8f9c;border-radius:var(--r);background:#fff;color:var(--ink)}
textarea{min-height:110px}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:1.4em;font-weight:600}
.form-msg.ok{color:#2a6a46}
.form-msg.err{color:#9b2c2c}
.band-dark .form-msg.ok{color:#8fd8ae}.band-dark .form-msg.err{color:#ffb0a8}
.consent{font-size:.9rem;color:var(--ink-soft)}
.hero .consent,.band-dark .consent{color:var(--moon-soft)}

/* test */
.test-q{background:var(--card);border:0;border-radius:var(--r);padding:1.3rem;margin-bottom:1rem}
.test-q legend{float:left;width:100%;font-weight:600;font-size:1.05rem;padding:0;margin:0 0 .8rem;line-height:1.4}
.test-q legend+*{clear:both}
.test-q fieldset{border:0;padding:0;margin:0}
.choices{display:grid;gap:.5rem}
.choices label{font-weight:400;display:flex;gap:.7rem;align-items:flex-start;border:1px solid var(--line);border-radius:var(--r);padding:.7rem .8rem;cursor:pointer;background:#fff;margin:0}
.choices input{width:auto;margin-top:.35rem;flex:0 0 auto;accent-color:var(--night)}
.choices label:has(input:checked){border-color:var(--night);background:color-mix(in oklab,var(--amber) 14%,#fff)}
.progress{height:6px;background:var(--line);border-radius:var(--r);overflow:hidden;margin:.4rem 0 1.4rem}
.progress span{display:block;height:100%;width:0;background:var(--amber-deep);transition:width .2s}
.dim-head{margin:2.2rem 0 .8rem}
.dim-head .k{font:600 .8rem/1 var(--sans);color:var(--amber-deep);letter-spacing:.12em;text-transform:uppercase}
.score{font:600 clamp(3.2rem,9vw,5rem)/1 var(--serif);color:var(--amber-deep)}
.bars{display:grid;gap:.7rem;max-width:560px}
.bar{display:grid;grid-template-columns:minmax(120px,190px) 1fr 46px;gap:.7rem;align-items:center;font-size:.95rem}
.bar .track{height:10px;background:var(--line);border-radius:var(--r);overflow:hidden}
.bar .fill{height:100%;background:var(--night)}
.bar .fill.low{background:var(--amber-deep)}

/* ---------------------------------------------------- pied de page -- */
.sf{background:var(--night);color:var(--moon-soft);padding:clamp(2.6rem,5vw,4rem) 0 3.2rem;font-size:.97rem}
.sf__in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut);display:grid;gap:clamp(1.5rem,3vw,3rem);grid-template-columns:repeat(5,minmax(0,1fr));align-items:start}
.sf a{color:var(--moon);text-decoration:none}
.sf a:hover{color:var(--amber)}
.sf .sh__brand{color:var(--stone);font-size:1.4rem}
.sf ul{list-style:none;padding:0;margin:0}
.sf li{margin:0}
.sf__sig{font-family:var(--serif);font-style:italic;color:var(--moon);margin:.6rem 0 .4rem}
.sf__lead{grid-column:span 2;max-width:34rem}
.sf__eyebrow{font:600 .76rem/1.2 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--amber);margin:1.5rem 0 1rem}
.sf__lead .sf__eyebrow{margin-top:1.8rem}
.sf__title{color:var(--stone);font-size:clamp(1.8rem,1.25rem + 1.2vw,2.35rem);line-height:1.08;margin-bottom:.8rem}
.sf__lead>p:not(.sf__sig):not(.sf__eyebrow){max-width:34rem}
.sf__cta{display:inline-flex;align-items:center;gap:.7rem;min-height:44px;margin-top:.35rem;padding:.65rem .85rem;border:1px solid var(--amber);color:var(--amber)!important;font-weight:600;line-height:1.3}
.sf__cta:hover{background:var(--amber);color:var(--night)!important}
.sf__label{color:var(--stone);font:600 .78rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .75rem}
.sf__nav a{display:inline-flex;align-items:center;min-height:44px;line-height:1.35;overflow-wrap:anywhere;min-width:0}
.sf__nav{min-width:0}
.sf__family{max-width:var(--wrap);margin:3rem auto 0;padding:1.7rem var(--gut) 0;border-top:1px solid rgba(221,226,238,.18)}
.sf__family .sf__eyebrow{margin:0 0 1.1rem}
.sf__family-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem 1.5rem}
.sf__family-list a{display:block;min-height:44px;padding:.3rem 0}
.sf__family-name,.sf__family-desc{display:block}
.sf__family-name{color:var(--stone);font-weight:600}
.sf__family-desc{margin-top:.15rem;color:var(--moon-soft);font-size:.86rem;line-height:1.35}
.sf__base{max-width:var(--wrap);margin:1.8rem auto 0;padding:1.1rem var(--gut) 0;border-top:1px solid rgba(221,226,238,.12);display:flex;justify-content:space-between;gap:1rem;color:var(--moon-soft);font-size:.88rem}
.sf__base p{margin:0}
.sf__base a{display:inline-block;min-height:44px;padding-top:.55rem;color:var(--stone)}

/* ------------------------------------------------------------ mobile -- */
@media (max-width:900px){
  .sh__toggle{display:block}
  .sh__nav{display:none;position:absolute;left:0;right:0;top:var(--sh-h);flex-direction:column;align-items:flex-start;gap:1.1rem;padding:1.3rem var(--gut) 1.6rem;background:var(--night);color:var(--stone);border-bottom:1px solid rgba(215,220,234,.2)}
  .sh__nav.open{display:flex}
  .sf__in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sf__lead{grid-column:1/-1}
  .sf__family-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  body{font-size:17px}
  .btn{white-space:normal}
  .bar{grid-template-columns:1fr 40px;row-gap:.3rem}
  .bar>span{grid-column:1/-1}
  .hero::before{background:linear-gradient(180deg,rgba(14,21,36,.55) 0%,var(--night) 70%),url(/assets/plate/nuit-s.webp) 62% 0/auto 320px no-repeat}
  .sf__in{grid-template-columns:1fr;gap:1.7rem}
  .sf__lead{grid-column:auto}
  .sf__family-list{grid-template-columns:1fr}
  .sf__base{display:block}
  .sf__base p+p{margin-top:.5rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.progress span,.btn,a.card{transition:none}}
@media print{.sh,.sf,.btn{display:none}}

/* ------------------------------------------- gabarit métier : la façade -- */
.mhero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);grid-template-areas:"main aside";gap:clamp(1.5rem,4vw,4rem);align-items:end;min-height:min(94svh,900px);padding:calc(var(--sh-h) + 3.4rem) var(--gut) clamp(2.2rem,5vh,3.6rem);color:var(--moon);background:var(--night) url(/assets/plate/nuit.webp) 62% 46%/cover no-repeat;overflow:hidden}
.mhero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(105% 85% at 0% 100%,rgba(10,15,28,.9) 0%,rgba(10,15,28,.62) 38%,rgba(10,15,28,.1) 70%,transparent 84%),linear-gradient(180deg,rgba(10,15,28,.55),transparent 20%)}
.mhero__col--matin{grid-area:main;max-width:46rem}
.mhero__col--soir{grid-area:aside;align-self:end;border-top:1px solid rgba(231,230,224,.45);padding-top:1rem}
.mhero__side{display:none}
.mhero h1{font-size:clamp(2.6rem,1rem + 5vw,5.4rem);line-height:1;color:var(--stone);margin:0 0 1.2rem}
.mhero__answer{font-size:1.1rem;line-height:1.6;color:var(--moon);margin:0 0 1.6rem;max-width:40rem}
.mhero .btn{margin-right:1rem}
.mhero .cta-note{display:inline;color:var(--moon)}
.mhero__now{font:400 1.35rem/1.35 var(--serif);font-style:italic;color:var(--stone);margin:0 0 1rem}
.mhero__deps{list-style:none;margin:0;padding:0;font-size:1rem;color:var(--moon)}
.mhero__deps li{margin:0;padding:.55rem 0;border-top:1px solid rgba(231,230,224,.18)}
@media (max-width:900px){
  .mhero{grid-template-columns:1fr;grid-template-areas:"main" "aside";background-image:url(/assets/plate/nuit-p-s.webp);background-position:60% 30%;background-size:auto 70%;align-items:start;min-height:0;padding-top:calc(var(--sh-h) + 9rem)}
  .mhero::before{background:linear-gradient(180deg,rgba(10,15,28,.5) 0%,rgba(10,15,28,.15) 22%,var(--night) 56%)}
  .mhero__col--soir{margin-top:1rem}
}
@media (max-aspect-ratio:1/1) and (min-width:901px){.mhero{background-image:url(/assets/plate/nuit-p-s.webp)}}
.metiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));column-gap:2rem;border-top:1px solid var(--ink)}
.metiers a{display:block;padding:1.1rem 1rem 1.1rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.metiers a strong{display:block;font:600 1.4rem/1.2 var(--serif)}
.metiers a span{display:block;color:var(--ink-soft);font-size:.97rem;margin-top:.3rem}
.metiers a:hover strong{color:var(--amber-deep)}
.metiers [data-soon]{display:block;padding:1.1rem 1rem 1.1rem 0;border-bottom:1px solid var(--line);color:var(--ink-soft)}
.metiers [data-soon] strong{display:block;font:600 1.4rem/1.2 var(--serif)}
.metiers [data-soon]::after{content:"Bientôt";display:inline-block;margin-top:.4rem;font:600 .72rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--amber-deep)}
.famlist{list-style:none;margin:1.4rem 0 1rem;padding:0;border-top:1px solid var(--ink)}
.famlist li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin:0;padding:.75rem 0;border-bottom:1px solid var(--line)}
.famlist a{font:600 1.45rem/1.2 var(--serif);color:var(--ink);text-decoration:none}
.famlist a:hover{color:var(--amber-deep)}
.famlist span{font-size:.95rem;color:var(--ink-soft);white-space:nowrap}
.famlist--big{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));column-gap:3rem}
.famlist--big a{font-size:clamp(1.7rem,1.2rem + 1.4vw,2.4rem)}

/* -------------------------------------------- test : l'immeuble qui s'allume -- */
.tsec{padding-top:clamp(2rem,4vw,3rem)}
.tgrid{display:grid;grid-template-columns:minmax(0,1fr) 21rem;gap:clamp(2rem,5vw,5rem);align-items:start}
.tmain{max-width:46rem}
.tw{position:sticky;top:calc(var(--sh-h) + 1.4rem);padding:0}
.tw__t{font:600 .8rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--amber-deep);margin:0 0 .8rem}
.tw__roof{height:2.6rem;background:var(--ink);clip-path:polygon(3% 100%,8% 8%,92% 8%,97% 100%)}
.tw__list{list-style:none;margin:0;padding:.4rem .9rem .5rem;display:grid;gap:.35rem;background:var(--card);border:3px solid var(--ink);border-top:0}
.tw__list>li{display:grid;grid-template-columns:auto 1fr;gap:.8rem;align-items:center;margin:0;font-size:.92rem;padding:.35rem 0;border-bottom:2px solid var(--ink);box-shadow:0 4px 0 -2px var(--stone-2)}
.tw__list>li:last-child{border-bottom:0;box-shadow:none}
.tw__row{display:flex;gap:.4rem}
.tw__win{--v:0;position:relative;width:1.9rem;height:2.5rem;background:var(--night);box-shadow:0 0 0 2px var(--ink)}
.tw__win::after{content:"";position:absolute;inset:2px;opacity:var(--v);background:linear-gradient(180deg,rgba(255,196,120,.95),rgba(244,140,45,.9)) 50% 0/60% 100% no-repeat,repeating-linear-gradient(180deg,#7d879f 0 2px,#5d667d 2px 4px) 0 0/20% 100% no-repeat,repeating-linear-gradient(180deg,#7d879f 0 2px,#5d667d 2px 4px) 100% 0/20% 100% no-repeat;transition:opacity .35s var(--ease)}
.tw__n{line-height:1.25;color:var(--ink);font-weight:500}
.tw__door{height:3rem;width:2.4rem;margin:0 auto;background:var(--ink);border-radius:1.2rem 1.2rem 0 0}
.tw__score{margin:1.1rem 0 .2rem;display:flex;align-items:baseline;gap:.5rem;color:var(--ink-soft);font-size:.95rem}
.tw__score b{font:600 3rem/1 var(--serif);color:var(--ink);font-variant-numeric:tabular-nums}
.tw__hint{margin:0;font-size:.92rem;color:var(--ink-soft)}
@media (max-width:980px){
  .tgrid{grid-template-columns:1fr}
  .tw{position:sticky;top:var(--sh-h);z-index:20;order:-1;padding:.5rem var(--gut);margin:0 calc(var(--gut) * -1);background:var(--stone);border-bottom:2px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:.8rem}
  .tw__t,.tw__hint,.tw__roof,.tw__door,.tw__n{display:none}
  .tw__list{display:flex;gap:.5rem;padding:0;background:none;border:0}
  .tw__list>li{display:block;padding:0;border:0;box-shadow:none}
  .tw__row{gap:.12rem;flex-direction:column}
  .tw__win{width:.9rem;height:.8rem}
  .tw__score{margin:0;white-space:nowrap}
  .tw__score b{font-size:1.5rem}
}
@media (max-width:380px){
  .tw__list{gap:.3rem}
}

/* réponses du test : cibles grandes, case lisible */
.choices label{padding:.85rem 1rem;min-height:3rem;align-items:center}
.choices input{appearance:none;-webkit-appearance:none;width:1.35rem;height:1.35rem;margin:0;border:2px solid var(--ink);border-radius:50%;background:#fff;display:grid;place-content:center;flex:0 0 auto}
.choices input::before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--amber);transform:scale(0);transition:transform .15s var(--ease)}
.choices input:checked::before{transform:scale(1)}
.choices input:checked{background:var(--night);border-color:var(--night)}
.choices input:focus-visible{outline:3px solid var(--amber);outline-offset:2px}

/* ---- 2. le prix qui reste ---- */
.px{padding:clamp(3.4rem,8vw,6.5rem) 0 clamp(2.4rem,5vw,3.6rem)}
.px__in{width:min(100% - 2 * var(--gut),var(--wrap));margin:0 auto;padding:0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.px h2{line-height:1.02;margin-bottom:1rem}
.px .lede{margin-bottom:1.6rem}
.px__src{border:0;margin:2.2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.px__src legend{grid-column:1/-1;font:600 .85rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-bottom:.9rem;padding:0}
.px__src label{display:block;margin:0;font-weight:400;cursor:pointer}
.px__src input{position:absolute;opacity:0;width:1px;height:1px}
.px__src span{display:block;height:100%;padding:.9rem 1rem;border:1px solid rgba(215,220,234,.28);border-radius:var(--r);color:var(--moon);font-size:.98rem;line-height:1.4;transition:border-color .2s,background-color .2s}
.px__src b{display:block;font:600 1.35rem/1.1 var(--serif);color:var(--stone);margin-bottom:.15rem}
.px__src input:checked+span{border-color:var(--amber);box-shadow:inset 0 0 0 1px var(--amber);background:rgba(228,164,65,.16)}
.px__src input:checked+span b{color:var(--amber)}
.px__src input:focus-visible+span{outline:2px solid var(--amber);outline-offset:3px}
.px__src label:hover span{border-color:rgba(215,220,234,.6)}
.px__big{margin:0 0 1.4rem;display:flex;align-items:baseline;flex-wrap:wrap;gap:.3rem 1rem;color:var(--moon)}
.px__big b{font:600 clamp(3.4rem,1rem + 7vw,7.4rem)/.95 var(--serif);letter-spacing:-.03em;color:var(--stone);font-variant-numeric:tabular-nums}
.px__big span{font:400 1.2rem/1.3 var(--sans)}
.px__chart{position:relative;height:clamp(5rem,12vw,8rem);margin-bottom:2.4rem}
.px__chart>span{position:absolute;inset:0;transition:clip-path .7s var(--ease)}
.px__keep{background:var(--stone);clip-path:inset(0 calc(100% - var(--k)) 0 0)}
.px__range{background:repeating-linear-gradient(90deg,rgba(228,164,65,.85) 0 3px,transparent 3px 7px);clip-path:inset(0 calc(100% - var(--r1)) 0 var(--r0))}
.px__cut{background:repeating-linear-gradient(135deg,var(--amber) 0 3px,transparent 3px 9px);clip-path:inset(0 0 0 var(--c0))}
.px__chart>.px__tick{position:absolute;inset:auto auto -1.7rem auto;white-space:nowrap;transform:translateX(-50%);font:500 .85rem/1 var(--sans);color:var(--moon-soft);transition:none;clip-path:none}
.px__tick::before{content:attr(data-t)}
.px__tick:first-of-type{transform:none}
.px__tick:last-of-type{transform:translateX(-100%)}
.px__chart::after{content:"";position:absolute;left:0;right:0;bottom:-.5rem;height:1px;background:rgba(215,220,234,.35)}
.px__key{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:1rem;color:var(--moon)}
.px__key li{display:flex;align-items:center;gap:.8rem;margin:0}
.px__key i{flex:0 0 1.6rem;height:.9rem;display:block}
.px__key .k1{background:var(--stone)}
.px__key .k2{background:repeating-linear-gradient(90deg,rgba(228,164,65,.85) 0 3px,transparent 3px 7px)}
.px__key .k3{background:repeating-linear-gradient(135deg,var(--amber) 0 3px,transparent 3px 9px)}
.px__note{font-size:1rem;color:var(--moon);margin:0}
.px__cap{font-size:1rem;line-height:1.5;color:var(--moon);margin:1.4rem 0 0;max-width:40rem}
.px__note a{color:var(--moon);text-decoration-color:rgba(221,226,238,.4)}
.px__note a{color:var(--moon)}
@media (max-width:900px){.px__in{grid-template-columns:1fr}}
@media (max-width:640px){.px__src{grid-template-columns:1fr}}


/* ----------------------------------------- l'immeuble de lecture (.floors) -- */
.floors-wrap{position:relative;margin:2.8rem 0 2rem;width:min(100%,64rem)}
.floors-wrap::before{content:"";display:block;height:3.4rem;margin:0 -.4rem;background:
  linear-gradient(180deg,transparent 0,transparent 52%,var(--ink) 52% 100%) 0 0/100% 100% no-repeat,
  repeating-linear-gradient(90deg,transparent 0 12%,var(--ink) 12% 13.5%) 0 0/100% 52% no-repeat;
  clip-path:polygon(2% 100%,5% 12%,95% 12%,98% 100%)}
.floors{list-style:none;margin:0;padding:0;border:3px solid var(--ink);border-top:0;background:var(--card);position:relative;box-shadow:inset 10px 0 0 -7px var(--ink),inset -10px 0 0 -7px var(--ink)}
.floor{display:grid;grid-template-columns:7.2rem minmax(0,1fr) minmax(0,1.5fr);gap:1rem 2.2rem;align-items:start;margin:0;padding:1.6rem 1.8rem 1.9rem 0;border-bottom:3px solid var(--ink);position:relative;box-shadow:0 5px 0 -2px var(--stone-2)}
.floor__w{position:relative;width:3.4rem;height:4.4rem;margin:.1rem 0 0 1.8rem;background:var(--night);box-shadow:0 0 0 3px var(--ink),0 .55rem 0 -1px var(--ink)}
.floor__w::after{content:"";position:absolute;inset:3px;opacity:1;background:
  linear-gradient(180deg,rgba(255,196,120,.95),rgba(244,140,45,.9)) 50% 0/60% 100% no-repeat,
  repeating-linear-gradient(180deg,#7d879f 0 2px,#5d667d 2px 4px) 0 0/20% 100% no-repeat,
  repeating-linear-gradient(180deg,#7d879f 0 2px,#5d667d 2px 4px) 100% 0/20% 100% no-repeat;transition:opacity .6s var(--ease)}
.floors--live .floor:not(.is-lit) .floor__w::after{opacity:0}
.floor__k{display:block;font:600 .82rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:.3rem}
.floor h3{font-size:clamp(1.55rem,1.1rem + 1.1vw,2.1rem);margin:0}
.floor__body p{margin:0 0 .7rem;max-width:44ch}.floor__body p:last-child{margin:0}
.floor__who{font-size:.95rem;color:var(--ink-soft)}
.floors__door{position:relative;height:5rem;width:4rem;margin:0 auto;background:var(--ink);border-radius:2rem 2rem 0 0;display:block}
.floors__door::after{content:"";position:absolute;left:50%;top:58%;width:.5rem;height:.5rem;border-radius:50%;background:var(--amber);transform:translateX(-50%)}
@media (max-width:760px){
  .floor{grid-template-columns:3.8rem minmax(0,1fr);padding:1.3rem 1rem 1.5rem 0}
  .floor__w{width:2rem;height:2.8rem;margin-left:.8rem}
  .floor__body{grid-column:2}
}

/* R4 : un seul traitement des titres de section, sans pictogramme (il ne figurait que sur certains H2 et débordait) */


/* crops de premier écran propres à chaque page */
.hero::before{background-image:linear-gradient(90deg,rgba(14,21,36,.94) 0%,rgba(14,21,36,.78) 36%,rgba(14,21,36,.34) 66%,rgba(14,21,36,.12) 100%),var(--hi,url(/assets/plate/nuit.webp));background-size:100% 100%,var(--hz,cover);background-position:0 0,var(--hp,60% 28%);background-repeat:no-repeat}

/* premiers écrans des pages intérieures : réponse en deux colonnes ; sur téléphone, l'ordre du HTML (la réponse, puis l'action) */
.hero .answer{background:transparent;color:var(--moon);padding:0;box-shadow:none;border-radius:0;max-width:62rem}
.hero .answer::before{margin-bottom:1rem}
.hero .answer p,.hero .answer li{color:var(--moon)}
.hero .answer a{color:var(--amber)}
.hero .answer strong,.hero .answer b{color:var(--stone)}
@media (min-width:900px){.hero .answer{columns:2;column-gap:2.6rem}.hero .answer p{break-inside:avoid-column}}
@media (max-width:760px){
  .hero>.wrap{display:flex;flex-direction:column}
  .hero>.wrap>.btn{align-self:flex-start;width:100%}
}
.hero .wrap.prose>.answer{max-width:62rem}
.hero .answer::before{column-span:all}

/* une seule action par page : le bouton « Faire le test » de l'en-tête s'efface quand la page porte son propre appel */
body:has(form.lead[data-form="diagnostic"]) .sh__nav .btn,body:has(form.lead[data-form="programme"]) .sh__nav .btn,body:has(form.lead[data-form="prescripteur"]) .sh__nav .btn,body:has(#test-form) .sh__nav .btn{display:none}
.floors__lab{position:absolute;left:50%;top:calc(100% + .6rem);transform:translateX(-50%);white-space:nowrap;font:600 1rem/1 var(--sans);color:var(--ink);background:var(--stone);padding:.2rem .4rem}
a.floors__door{margin-bottom:2.4rem;color:var(--amber)}

.eyebrow--sentence{text-transform:none;letter-spacing:.01em;font-size:1rem;font-weight:500}
.sf__lead p a{display:inline-block;padding:.6rem 0}

/* ------------------------------------- figures de décision (R2, 13/10) -- */
.fig{margin:1.6rem 0 1.4rem;max-width:68rem}
.fig__box{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1rem,2.4vw,1.6rem)}
.fig figcaption{font-size:1rem;line-height:1.55;color:var(--ink);margin-top:.9rem;max-width:var(--text)}
.fig figcaption b{font-weight:600}
.fig__t{font:600 .875rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin:0 0 .9rem}
/* fourchettes : une ligne par métier, la barre sur un axe commun */
.rg+.rg{margin-top:1.8rem}
.rg__axis{position:relative;height:1.4rem;margin:0 0 .3rem calc(15rem + 1rem);margin-right:calc(9.5rem + 1rem);border-bottom:1px solid var(--ink-soft)}
.rg__axis span{position:absolute;left:var(--x);bottom:.25rem;transform:translateX(-50%);font:500 .875rem/1 var(--sans);color:var(--ink-soft);white-space:nowrap}
.rg__axis span::before{content:attr(data-t)}
.rg__axis span:first-child{transform:none}
.rg__rows{list-style:none;margin:0;padding:0}
.rg__rows li{display:grid;grid-template-columns:15rem minmax(0,1fr) 9.5rem;gap:.2rem 1rem;align-items:center;margin:0;padding:.55rem 0;border-bottom:1px solid var(--line)}
.rg__n{font:600 1.05rem/1.25 var(--serif);color:var(--ink)}
.rg__s{grid-column:1;grid-row:2;font-size:.875rem;color:var(--ink-soft);line-height:1.3}
.rg__bar{grid-column:2;grid-row:1/3;position:relative;height:1rem;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px calc(100% / var(--ticks,8)))}
.rg__bar::after{content:"";position:absolute;top:0;bottom:0;left:calc(var(--a) / var(--max) * 100%);width:max(6px,calc((var(--b) - var(--a)) / var(--max) * 100%));background:var(--night);border-radius:var(--r)}
.rg__rows li.is-mark .rg__bar::after{background:var(--amber-deep)}
.rg__v{grid-column:3;grid-row:1/3;font:600 1rem/1.25 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
@media (max-width:760px){
  .rg__axis{margin-left:0;margin-right:0}
  .rg__rows li{grid-template-columns:minmax(0,1fr);padding:.7rem 0}
  .rg__n{grid-column:1;grid-row:1}
  .rg__v{grid-column:1;grid-row:2}
  .rg__bar{grid-column:1;grid-row:3;margin:.35rem 0 .15rem}
  .rg__s{grid-column:1;grid-row:4}
}
/* calendrier : une ligne par étape, sur un axe en mois */
.gt__axis{position:relative;height:1.4rem;margin:0 0 .3rem calc(14rem + 1rem);border-bottom:1px solid var(--ink-soft)}
.gt__axis span{position:absolute;left:calc((var(--m) - var(--from)) / (var(--to) - var(--from)) * 100%);bottom:.25rem;transform:translateX(-50%);font:500 .875rem/1 var(--sans);color:var(--ink-soft);white-space:nowrap}
.gt__axis span::before{content:attr(data-t)}
.gt__axis span:first-child{transform:none}
.gt__axis span:last-child{transform:translateX(-100%)}
.gt__axis span.is-close{color:var(--amber-deep);font-weight:600}
.gt__rows{list-style:none;margin:0;padding:0}
.gt__rows li{display:grid;grid-template-columns:14rem minmax(0,1fr);gap:.15rem 1rem;align-items:center;margin:0;padding:.5rem 0;border-bottom:1px solid var(--line)}
.gt__n{font:600 1.05rem/1.25 var(--serif);color:var(--ink)}
.gt__w{grid-column:1;grid-row:2;font-size:.875rem;line-height:1.3;color:var(--ink-soft)}
.gt__bar{grid-column:2;grid-row:1/3;position:relative;height:1.1rem;background:linear-gradient(90deg,transparent calc((0 - var(--from)) / (var(--to) - var(--from)) * 100% - 1px),var(--amber-deep) 0,var(--amber-deep) calc((0 - var(--from)) / (var(--to) - var(--from)) * 100% + 1px),transparent 0)}
.gt__bar::after{content:"";position:absolute;top:0;bottom:0;left:calc((var(--s) - var(--from)) / (var(--to) - var(--from)) * 100%);width:max(8px,calc((var(--e) - var(--s)) / (var(--to) - var(--from)) * 100%));background:var(--night);border-radius:var(--r)}
.gt__rows li.is-us .gt__bar::after{background:repeating-linear-gradient(135deg,var(--night) 0 4px,#3a4766 4px 8px)}
.gt__rows li.is-open .gt__bar::after{background:repeating-linear-gradient(90deg,var(--amber-deep) 0 6px,transparent 6px 10px)}
.gt__key{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;list-style:none;margin:.9rem 0 0;padding:0;font-size:.9rem;color:var(--ink-soft)}
.gt__key li{display:flex;align-items:center;gap:.5rem;margin:0}
.gt__key i{display:block;width:1.6rem;height:.8rem;background:var(--night);border-radius:var(--r)}
.gt__key i.k-us{background:repeating-linear-gradient(135deg,var(--night) 0 4px,#3a4766 4px 8px)}
.gt__key i.k-open{background:repeating-linear-gradient(90deg,var(--amber-deep) 0 6px,transparent 6px 10px)}
.gt__key i.k-close{width:2px;height:1rem;background:var(--amber-deep)}
@media (max-width:760px){
  .gt__axis{margin-left:0}
  .gt__rows li{grid-template-columns:minmax(0,1fr);padding:.65rem 0}
  .gt__n,.gt__w{grid-column:1}
  .gt__n{grid-row:1}.gt__w{grid-row:2}
  .gt__bar{grid-column:1;grid-row:3;margin-top:.35rem}
}
/* clientèle ou titres : deux chemins, ce qui change de mains */
.cs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem}
.cs__path{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.1rem 1.2rem;display:grid;gap:.6rem;align-content:start}
.cs__k{font:600 .8rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin:0}
.cs__h{font:600 1.3rem/1.2 var(--serif);margin:0}
.cs__flow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:.4rem;margin:.3rem 0}
.cs__node{border:2px solid var(--ink);border-radius:var(--r);padding:.55rem .5rem;text-align:center;font:600 .95rem/1.25 var(--sans);background:var(--card)}
.cs__arrow{position:relative;text-align:center;font-size:.9rem;line-height:1.3;color:var(--ink);padding:0 .9rem .9rem 0}
.cs__arrow::before{content:"";position:absolute;left:0;right:.4rem;bottom:.35rem;height:2px;background:var(--amber-deep)}
.cs__arrow::after{content:"";position:absolute;right:0;bottom:0;border:.4rem solid transparent;border-left:.6rem solid var(--amber-deep);border-right:0}
.cs__box{border:2px dashed var(--amber-deep);border-radius:var(--r);padding:.6rem .7rem;font-size:.95rem;line-height:1.4}
.cs__box b{display:block;font:600 .8rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:.2rem}
.cs__tax{font-size:.95rem;line-height:1.45;margin:0;color:var(--ink)}
@media (max-width:760px){.cs{grid-template-columns:1fr}}
@media (max-width:420px){.cs__flow{grid-template-columns:1fr;justify-items:stretch}.cs__arrow{padding:.2rem 0 1.2rem;}.cs__arrow::before{left:50%;right:auto;top:auto;bottom:.2rem;width:2px;height:.9rem}.cs__arrow::after{left:calc(50% - .4rem);right:auto;bottom:-.5rem;border:.4rem solid transparent;border-top:.6rem solid var(--amber-deep);border-bottom:0}}
/* outil « quel montage » */
.mg__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;margin-top:1.6rem}
.mg__form .test-q{margin-bottom:.8rem}
.mg__out{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.1rem,2.4vw,1.6rem)}
.mg__out [data-steps]{list-style:none;padding-left:0}
.mg__out [data-steps] li{margin:0 0 .5rem}
.mg__out h3{font-size:1.45rem;margin:.1rem 0 .6rem}
.mg__out ol,.mg__out ul{padding-left:1.2rem}
.mg__why{background:color-mix(in oklab,var(--amber) 14%,var(--card));padding:.6rem .8rem;border-radius:var(--r);font-size:.98rem}
.mg__tax{border-left:3px solid var(--amber-deep);padding-left:.9rem;font-size:.98rem}
.mg__rules{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.mg__rules li{margin:0;padding:.7rem 0 0;border-top:1px solid var(--line)}
.mg__rules b{display:block;font:600 1.05rem/1.3 var(--serif)}
@media (max-width:900px){.mg__grid{grid-template-columns:1fr}}
.steps6{counter-reset:s6;list-style:none;padding:0;margin:1.4rem 0;max-width:var(--text)}
.steps6>li{counter-increment:s6;position:relative;padding:0 0 .9rem 2.6rem;margin:0}
.steps6>li::before{content:counter(s6);position:absolute;left:0;top:.05rem;width:1.8rem;height:1.8rem;border-radius:50%;display:grid;place-items:center;font:600 .9rem/1 var(--sans);color:var(--night);background:var(--amber)}
/* tableaux de preuve : des cartes sous 600 px, chaque valeur avec l'intitulé de sa colonne */
@media (max-width:600px){
  .table-wrap{overflow:visible}
  .table-wrap table,.table-wrap tbody,.table-wrap tr,.table-wrap td{display:block;width:100%}
  .table-wrap thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .table-wrap tr{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:.8rem .9rem;margin:0 0 .8rem}
  .table-wrap td{border:0;padding:.3rem 0}
  .table-wrap td[data-label]::before{content:attr(data-label);display:block;font:600 .75rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.1rem}
  .table-wrap td:first-child{font-size:1.1rem}
  .table-wrap caption{display:block;padding:0 0 .6rem}
  .band-dark .table-wrap tr{background:var(--night-2);border-color:rgba(215,220,234,.2)}
}
.card h4{font:600 1.2rem/1.25 var(--serif);margin:0 0 .45rem}
.st__cards{margin:1rem 0 1.6rem;grid-template-columns:repeat(2,minmax(0,1fr));max-width:68rem}
@media (max-width:760px){.st__cards{grid-template-columns:1fr}}
.eb__list{list-style:none;padding:0;margin:0}
.eb__list li{margin:0 0 .7rem}
.eb__list li:last-child{margin:0}
@media (max-width:380px){.hero h1{font-size:2.2rem}}
.cs__node::first-letter{text-transform:uppercase}

/* ------------------------------------------- R3 (13/10) : replier sans retirer -- */
.btn{max-width:100%;white-space:normal}
.sh .btn{white-space:nowrap}
@media (min-width:400px){.hh .btn{white-space:nowrap}}
details.src{max-width:var(--text);margin:.4rem 0 1.4rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
details.src>summary{cursor:pointer;list-style:none;position:relative;padding:.75rem 2rem .75rem 0;font:600 .98rem/1.35 var(--sans);color:var(--ink)}
details.src>summary::-webkit-details-marker{display:none}
details.src>summary::after{content:"+";position:absolute;right:.2rem;top:.55rem;font:400 1.4rem/1 var(--sans);color:var(--amber-deep)}
details.src[open]>summary::after{content:"\2212"}
details.src>:not(summary){margin-top:.2rem}
details.src .source{margin-bottom:.9rem}
.src__list{list-style:none;padding-left:1.3em}
.src__list>li{position:relative}
.src__list>li::before{content:"";position:absolute;left:-1.3em;top:.62em;width:.55em;height:.55em;background:var(--amber)}
.st__ways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1.4rem;margin:1rem 0 1.8rem;max-width:68rem}
.way{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:0 1.1rem}
.way>summary{cursor:pointer;list-style:none;position:relative;padding:.95rem 2rem .95rem 0;font:600 1.15rem/1.3 var(--serif)}
.way>summary::-webkit-details-marker{display:none}
.way>summary::after{content:"+";position:absolute;right:0;top:.8rem;font:400 1.4rem/1 var(--sans);color:var(--amber-deep)}
.way[open]>summary::after{content:"\2212"}
.way p{margin:0 0 1rem}
@media (max-width:760px){.st__ways{grid-template-columns:1fr}}
/* outil « quel montage » : trois lignes de synthèse, le rappel des réponses, le détail replié */
.mg__sum{list-style:none;margin:.2rem 0 1rem;padding:0;display:grid;gap:.75rem}
.mg__sum li{margin:0;padding:0 0 .75rem;border-bottom:1px solid var(--line)}
.mg__k{display:block;font:600 .78rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin-bottom:.2rem}
.mg__sum h3{font-size:1.35rem;margin:0}
.mg__sum p{margin:0}
.mg__out .btn{display:inline-block}
.mg__edit{background:none;border:0;padding:0;font:inherit;color:var(--amber-deep);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mg__more{margin-top:.9rem;border-top:1px solid var(--line)}
.mg__more>summary{cursor:pointer;list-style:none;position:relative;padding:.8rem 2rem .8rem 0;font:600 1rem/1.35 var(--sans)}
.mg__more>summary::-webkit-details-marker{display:none}
.mg__more>summary::after{content:"+";position:absolute;right:.2rem;top:.6rem;font:400 1.4rem/1 var(--sans);color:var(--amber-deep)}
.mg__more[open]>summary::after{content:"\2212"}
.px details.src,.band-dark details.src{border-color:rgba(215,220,234,.22)}
.px details.src>summary,.band-dark details.src>summary{color:var(--stone)}
.px details.src>summary::after,.band-dark details.src>summary::after{color:var(--amber)}
.px .px__note+details.src{margin-top:1rem}
@media (max-width:760px){
  .rg__rows li{grid-template-columns:minmax(0,1fr) auto;padding:.6rem 0}
  .rg__n{grid-column:1;grid-row:1}
  .rg__v{grid-column:2;grid-row:1;text-align:right;font-size:.95rem}
  .rg__bar{grid-column:1/-1;grid-row:2;margin:.3rem 0 .1rem}
  .rg__s{grid-column:1/-1;grid-row:3}
  .mg__form .test-q{padding:1rem}
  .mg__form .choices label{padding:.55rem .7rem}
}
.mg__rulesbox>summary{cursor:pointer;list-style:none;position:relative;margin:0;padding-right:2rem}
.mg__rulesbox>summary::-webkit-details-marker{display:none}
.mg__rulesbox>summary::after{content:"+";position:absolute;right:0;top:-.2rem;font:400 1.4rem/1 var(--sans);color:var(--amber-deep);letter-spacing:0}
.mg__rulesbox[open]>summary::after{content:"\2212"}
.mg__rulesbox[open]>summary{margin-bottom:1rem}
@media (max-width:760px){
  section{padding:2.6rem 0}
  .answer{padding:1.1rem 1.1rem}
  .famlist a{font-size:1.2rem}
  .famlist li{padding:.6rem 0}
}
/* /diagnostic/ : test express, étape surlignée, extrait de rapport, récapitulatif à côté du formulaire */
.dq__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;margin-top:1.6rem}
.dq__form .test-q{margin-bottom:.8rem}
.dq__out{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.1rem,2.4vw,1.6rem);position:sticky;top:calc(var(--sh-h) + 1rem)}
.dq__score{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .6rem;margin:0 0 .4rem;color:var(--ink-soft)}
.dq__score b{font:600 3.2rem/1 var(--serif);color:var(--ink);font-variant-numeric:tabular-nums}
.dq__score span{flex-basis:100%;font:600 1.15rem/1.3 var(--serif);color:var(--ink)}
.dq__sum{list-style:none;margin:.6rem 0 1rem;padding:0;display:grid;gap:.7rem}
.dq__sum li{margin:0;padding:0 0 .7rem;border-bottom:1px solid var(--line)}
.dq__sum p{margin:0}
@media (max-width:900px){.dq__grid{grid-template-columns:1fr}.dq__out{position:static}}
.rd{display:block;width:100%;max-width:470px;height:auto;margin:.4rem auto .8rem}
.rd__grid{fill:none;stroke:var(--line);stroke-width:1}
.rd__axis{stroke:var(--line);stroke-width:1}
.rd__shape{fill:rgba(228,164,65,.28);stroke:var(--amber-deep);stroke-width:2.5}
.rd__l{font:500 16px/1 var(--sans);fill:var(--ink-soft)}
.rd__v{font-weight:700;fill:var(--ink)}
@media (max-width:600px){.rd__l{font-size:20px}}
.gt__rows li.is-you{background:color-mix(in oklab,var(--amber) 22%,transparent);box-shadow:inset 3px 0 0 var(--amber-deep)}
.gt__rows li.is-you .gt__n{padding-left:.5rem}
.gt__rows li.is-you .gt__w{padding-left:.5rem;color:var(--ink)}
.gt__axis .gt__you{color:var(--night);background:var(--amber);padding:.15rem .35rem;border-radius:var(--r);font-weight:600;bottom:1.5rem}
.gt.has-you .gt__axis{margin-top:1.6rem}
.rx{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;margin:1.4rem 0 1.6rem}
.rx__list{counter-reset:rx;list-style:none;padding:0;margin:0 0 1.4rem}
.rx__list li{counter-increment:rx;position:relative;margin:0;padding:.75rem 0 .75rem 2.4rem;border-bottom:1px solid var(--line)}
.rx__list li::before{content:counter(rx);position:absolute;left:0;top:.8rem;width:1.7rem;height:1.7rem;border-radius:50%;display:grid;place-items:center;font:600 .85rem/1 var(--sans);color:var(--night);background:var(--amber)}
.rx__list b{font-family:var(--serif);font-size:1.08rem}
.rx__fig{margin:0}
.rx__doc{background:#fff;box-shadow:0 18px 40px -22px rgba(14,21,36,.45)}
.rx__tag{display:inline-block;margin:0 0 .9rem;padding:.35rem .6rem;border:1.5px dashed var(--amber-deep);border-radius:var(--r);font:600 .85rem/1.3 var(--sans);color:var(--amber-deep)}
.rx__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.4rem 1.4rem;border-bottom:2px solid var(--ink);padding-bottom:.6rem}
.rx__idx{margin:0;color:var(--ink-soft)}
.rx__idx b{font:600 3rem/1 var(--serif);color:var(--ink)}
.rx__idx span{display:block;font:600 1.05rem/1.3 var(--serif);color:var(--ink)}
.rx__who{margin:0;font-size:.95rem;color:var(--ink-soft);max-width:22rem}
.rx__h{font:600 .875rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin:1rem 0 .5rem}
.rx__neg,.rx__plan{margin:0;padding-left:1.2rem;font-size:.98rem;line-height:1.45}
.rx__neg li,.rx__plan li{margin:0 0 .45rem}
.rx__plan{list-style:none;padding:0}
.rx__plan span{display:inline-block;min-width:11.5rem;font:600 .9rem/1.3 var(--sans);color:var(--ink)}
@media (max-width:900px){.rx{grid-template-columns:1fr}}
@media (max-width:600px){.rx__plan span{display:block;min-width:0}}
.dg{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:start;margin-top:1.4rem}
.dg__recap{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.1rem,2.4vw,1.6rem);max-width:30rem}
.dg__recap dl{margin:0;display:grid;gap:.8rem}
.dg__recap dt{font:600 .78rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep)}
.dg__recap dd{margin:.15rem 0 0}
@media (max-width:900px){.dg{grid-template-columns:1fr}}
/* /programme/ : haut de page en deux lignes, planificateur sur 24 mois */
.hero__sub{font-size:clamp(1.1rem,1rem + .4vw,1.3rem);line-height:1.5;max-width:52rem;margin:0 0 1.6rem}
.pp__form{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,15rem) auto;gap:1rem 1.4rem;align-items:end;margin:1.4rem 0 .4rem;max-width:56rem}
.pp__form .form-msg{grid-column:1/-1;margin:0}
.pp__out{margin-top:1rem}
.pp__head{font:600 1.1rem/1.45 var(--serif);max-width:var(--text);margin:0 0 1rem}
.pp__list{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.pp__ph{margin:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.3rem;display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:.3rem 1.6rem}
.pp__ph.is-now{box-shadow:inset 4px 0 0 var(--amber-deep)}
.pp__when{grid-column:1;margin:0;font:600 .82rem/1.35 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--amber-deep)}
.pp__ph h3{grid-column:1;margin:0;font-size:1.45rem}
.pp__ph dl{grid-column:2;grid-row:1/4;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem 1.4rem}
.pp__ph dt{font:600 .78rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.pp__ph dd{margin:.2rem 0 0;font-size:.98rem;line-height:1.45}
.pp__total{max-width:var(--text);margin:1rem 0 0;font-size:1rem}
@media (max-width:1100px){.pp__ph dl{grid-template-columns:1fr}}
@media (max-width:760px){.pp__form{grid-template-columns:1fr}.pp__ph{grid-template-columns:1fr}.pp__ph dl{grid-column:1;grid-row:auto}}
@media (max-width:760px){.dq__form .test-q{padding:1rem}.dq__form .choices label{padding:.55rem .7rem}}
.mg__out .mg__sum,.dq__out .dq__sum{padding-left:0}
@media (max-width:760px){
  section{padding:2.2rem 0}
  .rg__rows li{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
}

/* ------------------------------------------- R4 (13/10) : une seule place par fait -- */
/* la décote, intégrée à « Comment se forme le prix » */
.pr:has(.px--in){padding-bottom:0}
.px--in{margin-top:clamp(2rem,5vw,3.5rem)}
.px__h{font-size:clamp(1.7rem,1.1rem + 1.8vw,2.6rem);line-height:1.06;color:var(--stone);margin:0 0 1rem}
.px__statut{font-size:1rem;line-height:1.5;color:var(--moon);margin:1.4rem 0 0;max-width:40rem}
.px__statut a{color:var(--moon)}
.px__cap b{color:var(--stone);font-weight:600}
/* /diagnostic/ : premier écran, mini-frise, deux boutons */
.hero .btn-ghost{background:transparent;color:var(--stone);box-shadow:inset 0 0 0 1.5px var(--stone)}
.hero .btn-ghost:hover{background:var(--stone);color:var(--night)}
.hero__acts{display:flex;flex-wrap:wrap;gap:.8rem 1rem;align-items:center;margin:1.4rem 0 0}
.hero__one{font-size:clamp(1.1rem,1rem + .4vw,1.3rem);line-height:1.5;max-width:46rem;margin:0;color:var(--moon)}
.hero__one b{color:var(--stone)}
.frise{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem;max-width:52rem}
.frise li{margin:0;padding:.55rem .6rem .5rem;border-top:3px solid var(--amber);background:rgba(14,21,36,.55);font:500 .95rem/1.25 var(--sans);color:var(--stone)}
.frise li b{display:block;font:600 1.15rem/1 var(--serif);color:var(--amber);margin-bottom:.2rem}
.frise li.is-long{border-top-color:var(--amber-soft)}
@media (max-width:760px){.frise{grid-template-columns:repeat(3,minmax(0,1fr))}.hero>.wrap>.frise{margin:1rem 0 0}.hero>.wrap>.hero__acts{margin-top:1.2rem}.hero__acts .btn{width:100%}}
/* les six étapes, une seule fois : une phrase sous chaque barre du calendrier */
.gt__d{grid-column:1/-1;margin:.35rem 0 0;font-size:.98rem;line-height:1.5;color:var(--ink);max-width:var(--text)}
@media (max-width:760px){.gt__d{grid-row:4}}
/* test express : un aperçu du résultat, libellé et suite sur la même ligne */
.dq__prev{list-style:none;margin:.4rem 0 .9rem;padding:0;display:grid;gap:.55rem}
.dq__prev li{margin:0;padding:0 0 .55rem;border-bottom:1px solid var(--line)}
.dq__prev b{font-weight:600;color:var(--ink)}
.dq__out .rd--empty .rd__shape{display:none}
.dq__out details.src{margin:.4rem 0 0}
/* /programme/ : prix au premier écran, résultat du planificateur, numéros de phase */
.hero__price{margin:0 0 1.4rem;color:var(--moon);font-size:1.05rem;line-height:1.5}
.hero__price b{color:var(--stone);font-weight:600}
@media (max-width:760px){.hero>.wrap>.hero__price{margin:0 0 1rem}}
.pp__no{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;margin-right:.5rem;border-radius:50%;background:var(--amber);color:var(--night);font:600 .9rem/1 var(--sans);vertical-align:.2em}
.pp__ph.is-out{background:transparent;border-style:dashed}
.pp__ph.is-out h3,.pp__ph.is-out dd{color:var(--ink-soft)}
.pp__res{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--amber-deep);border-radius:var(--r);padding:clamp(1rem,2.4vw,1.5rem);margin:0 0 1.2rem;max-width:68rem}
.pp__res[hidden]{display:none}
.pp__res .pp__head{margin-bottom:.8rem}
.pp__line{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.35rem}
.pp__line li{margin:0;display:flex;flex-wrap:wrap;gap:.1rem .7rem;padding:.35rem 0;border-bottom:1px solid var(--line)}
.pp__line li b{font:600 1.05rem/1.35 var(--serif);min-width:12rem}
.pp__line li.is-now b::after{content:" · ce mois-ci";font:600 .8rem/1 var(--sans);letter-spacing:.06em;color:var(--amber-deep)}
.pp__line li.is-out{color:var(--ink-soft)}
.pp__cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:1rem 2rem}
.pp__cols ul{margin:0;padding-left:1.1rem}
.pp__cols li{margin:0 0 .4rem}
.pp__cols p{margin:0}
@media (max-width:760px){.pp__cols{grid-template-columns:1fr}.pp__line li b{min-width:0}}
.pp__form input,.pp__form select{height:3.1rem;box-sizing:border-box}
.pp__note{max-width:var(--text);margin:.6rem 0 1.4rem;font-weight:500}
.gt__rows li.is-none .gt__bar::after{display:none}
.hero .btn+.btn{margin-left:0}
.page--home .fig figcaption{max-width:none}
.px__cap{max-width:none}
@media (max-width:760px){.frise{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.frise{grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem}.frise li{padding:.4rem .45rem;font-size:.88rem}.frise li b{display:inline;font-size:1rem;margin:0}.hero__one{font-size:1.05rem}}

/* ---- R5, /diagnostic/ ---- */
/* l'offre, sous les boutons du héros : prix, format, délai, déduction */
.hero__offer{max-width:46rem;margin-top:1rem}
.hero__offer b{color:var(--stone)}
/* en dessous de 900 px, « Le Diagnostic en bref » passe avant le formulaire */
@media (max-width:900px){.dg__recap{order:-1;max-width:none}}
/* calendrier surligné : toute la ligne a le même retrait (titre, durée, texte et barre), l'axe suit ce retrait */
.gt.has-you .gt__rows li{padding-left:.75rem;padding-right:.5rem}
.gt.has-you .gt__axis{margin-left:calc(14rem + 1rem + .75rem);margin-right:.5rem}
.gt__rows li.is-you .gt__n,.gt__rows li.is-you .gt__w{padding-left:0}
.gt__rows li.is-you .gt__d{padding-right:.25rem}
/* le badge « Vous » reste entier dans l'axe ; un trait vertical en pointillé (la signature est en trait plein ocre) marque le mois du lecteur sur chaque barre */
.gt__axis span.gt__you{transform:none;width:3.4rem;text-align:center;box-sizing:border-box;left:clamp(0px,calc((var(--m) - var(--from)) / (var(--to) - var(--from)) * 100% - 1.7rem),calc(100% - 3.4rem))}
.gt.has-you .gt__bar::before{content:"";position:absolute;z-index:1;top:-.35rem;bottom:-.35rem;left:calc((var(--you) - var(--from)) / (var(--to) - var(--from)) * 100% - 1px);width:2px;background:repeating-linear-gradient(180deg,var(--amber-deep) 0 4px,transparent 4px 7px)}
.gt.has-you .gt__axis::after{content:"";position:absolute;bottom:-1px;height:.45rem;width:2px;left:calc((var(--you) - var(--from)) / (var(--to) - var(--from)) * 100% - 1px);background:var(--amber-deep)}
@media (max-width:760px){.gt.has-you .gt__axis{margin-left:.75rem}}
.dq__out .dq__score:focus{outline:none}
.dq__out .dq__score:focus-visible{outline:2px solid var(--amber-deep);outline-offset:4px}

/* ---- R5, /programme/ ---- */
/* le héros perd sa façade : un aperçu du calendrier daté à la place */
.hero--pp::before{background:radial-gradient(90% 120% at 100% 0%,#1b2740 0%,var(--night) 60%)}
.pp-hero__fig{margin:1.8rem 0 0;max-width:40rem}
.pp-hero__fig .fig__box{background:rgba(231,230,224,.97)}
.pp-hero__fig figcaption{color:var(--moon)}
.pp-hero__fig figcaption b{color:var(--stone)}
.pp-hero__fig .gt__rows li{grid-template-columns:9.5rem minmax(0,1fr);padding:.4rem 0}
.pp-hero__fig .gt__axis{margin-left:calc(9.5rem + 1rem)}
.pp-hero__fig .gt__n{font-size:1rem}
@media (min-width:1360px){
  .hero--pp>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,34rem);column-gap:clamp(2rem,4vw,4rem);align-items:start}
  .hero--pp>.wrap>*{grid-column:1}
  .hero--pp>.wrap>.pp-hero__fig{grid-column:2;grid-row:1/span 6;margin:0;align-self:center}
}
@media (max-width:760px){.pp-hero__fig .gt__axis{margin-left:0}.pp-hero__fig .gt__rows li{grid-template-columns:minmax(0,1fr)}}
/* les montants connus, portés sur les barres du diagramme des paiements */
.gt__amt{position:absolute;z-index:2;top:50%;transform:translateY(-50%);white-space:nowrap;font:600 .875rem/1 var(--sans);color:var(--ink)}
.gt__amt:empty{display:none}
.gt__amt.is-after{left:calc((var(--e) - var(--from)) / (var(--to) - var(--from)) * 100% + .5rem)}
.gt__amt.is-before{right:calc(100% - (var(--s) - var(--from)) / (var(--to) - var(--from)) * 100% + .5rem)}
.gt__amt.is-in{left:calc((var(--s) - var(--from)) / (var(--to) - var(--from)) * 100% + .5rem);color:var(--stone)}
[data-gt-budget] .gt__bar{height:1.35rem}
/* les cartes d'étape se replient après le calcul : le titre et la date restent, le détail s'ouvre au clic */
.pp__ph{display:block}
.pp__det>summary{cursor:pointer;list-style:none;position:relative;padding-right:2.2rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem 1.2rem}
.pp__det>summary::-webkit-details-marker{display:none}
.pp__det>summary::after{content:"\2212";position:absolute;right:0;top:.1rem;font:400 1.5rem/1 var(--sans);color:var(--amber-deep)}
.pp__det:not([open])>summary::after{content:"+"}
.pp__det>summary h3{order:-1}
.pp__det .pp__when{display:block}
.pp__det dl{margin-top:.8rem;grid-column:auto;grid-row:auto}
/* le récapitulatif daté : une ligne par étape, la date toujours dans la même colonne */
.pp__line li{display:grid;grid-template-columns:minmax(0,17rem) minmax(0,1fr);gap:.1rem 1rem;align-items:baseline}
.pp__line li b{min-width:0}
@media (max-width:760px){.pp__line li{grid-template-columns:minmax(0,1fr)}}
.pp__total{font:600 1.35rem/1.3 var(--serif);margin:.2rem 0 .5rem;color:var(--ink)}
.pp__plus{margin:.6rem 0 .4rem}
[data-pp-parts]{margin:0;padding-left:1.1rem}
.pp-hero__fig .fig__box li,.pp-hero__fig .fig__box .gt__n{color:var(--ink)}
.pp-hero__fig .fig__box .gt__w{color:var(--ink-soft)}
.pp-hero__fig .fig__box .fig__t{color:var(--amber-deep)}
.pp__res{max-width:none}
.gt__amt.is-in{background:var(--night);padding:.15rem .4rem;border-radius:var(--r)}
/* R6, /diagnostic/ : étapes 3 à 5, qui intervient et ce qu'on y décide ; le test express une question à la fois sur mobile ; l'axe du calendrier collant sur mobile */
.gt__qd p{margin:0 0 .25rem}
.gt__qd p:last-child{margin:0}
.dq__form.is-steps fieldset.is-off{display:none}
.dq__steps{margin:0 0 .8rem}
.dq__pos{margin:0 0 .5rem;font:600 .95rem/1.3 var(--sans);color:var(--ink)}
.dq__dots{list-style:none;margin:0;padding:0;display:flex;gap:.35rem}
.dq__dots li{margin:0;flex:1 1 0;max-width:2.75rem}
.dq__dots button{width:100%;aspect-ratio:1;padding:0;border-radius:50%;border:1.5px solid var(--ink);background:#fff;color:var(--ink);font:600 1rem/1 var(--sans);cursor:pointer}
.dq__dots button.is-done{background:var(--night);border-color:var(--night);color:var(--stone)}
.dq__dots button[aria-current]{box-shadow:0 0 0 3px var(--amber)}
.dq__dots button:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
/* R7 : plus d'axe collant (il couvrait l'étape 2 en 390) ; sous 600 px, les mois sont écrits sur chaque ligne et les barres
   courtes (Négocier, Signer) portent leur plage à côté d'elles. */
/* R6, /programme/ : un seul calcul. Le Gantt des étapes vit dans le résultat, commence aujourd'hui, grise ce qui ne tient plus */
.pp__res .pp__fig{margin:.4rem 0 1.2rem;max-width:none}
.pp__res .pp__fig .fig__box{background:var(--stone);border-color:var(--line)}
.gt.has-today .gt__axis{margin-top:1.7rem}
.gt__axis span.gt__today{left:0;transform:none;bottom:1.55rem;color:var(--night);background:var(--amber);padding:.15rem .4rem;border-radius:var(--r);font-weight:600}
.gt.has-today .gt__bar{background:linear-gradient(90deg,var(--amber-deep) 0 2px,transparent 2px),linear-gradient(90deg,transparent calc((0 - var(--from)) / (var(--to) - var(--from)) * 100% - 1px),var(--amber-deep) 0,var(--amber-deep) calc((0 - var(--from)) / (var(--to) - var(--from)) * 100% + 1px),transparent 0)}
.gt__rows li.is-now{background:color-mix(in oklab,var(--amber) 18%,transparent)}
.gt__rows li.is-out .gt__n{color:var(--ink-soft);text-decoration:line-through;text-decoration-thickness:1px}
.gt__rows li.is-out .gt__w{color:var(--ink-soft);font-style:italic}
.pp__k{margin:1.4rem 0 .6rem;font:600 .82rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.pp__res .pp__fig .fig__box{background:none;border:0;padding:0}
@media (max-width:600px){.gt__axis span.is-mid{display:none}}
@media (min-width:761px){.hero--pp>.wrap{display:block}}
.gt__axis span.is-end{transform:translateX(-100%)}
/* R7 : pendant un défilement animé, la page peut être dessinée quelques pixels sous le haut de l'écran : le fond de la racine
   prend la couleur de l'en-tête (le corps garde son fond calcaire), plus de bande claire au-dessus de l'en-tête collant. */
html{background:var(--night)}
/* ---- R7, /diagnostic/ : un seul rôle visible. Le guide d'abord, puis le test express, puis un seul bloc Diagnostic ---- */
.of{background:var(--stone);padding:clamp(2.6rem,6vw,4.4rem) 0}
.of h2{margin-bottom:1.1rem}
.of__box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem 2.4rem;align-items:end;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--amber-deep);border-radius:var(--r);padding:clamp(1.1rem,2.4vw,1.8rem)}
.of__dl{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem 1.6rem}
.of__dl dt{font:600 .78rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep)}
.of__dl dd{margin:.2rem 0 0;line-height:1.45}
.of__dl dd b{font:600 1.35rem/1.2 var(--serif);color:var(--ink)}
.of__go{margin:0}
.of__cmp{grid-column:1/-1;order:3;margin:0;padding-top:.8rem;border-top:1px solid var(--line);font-size:.95rem;line-height:1.5;color:var(--ink-soft)}
@media (max-width:1100px){.of__box{grid-template-columns:minmax(0,1fr);align-items:start}.of__dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.of__dl{grid-template-columns:minmax(0,1fr);gap:.7rem}}
.dg{grid-template-columns:minmax(0,1fr) minmax(0,560px)}
.dg__intro .lede{margin-bottom:.8rem}
@media (max-width:900px){.dg{grid-template-columns:minmax(0,1fr)}}
.dq__rule{margin:.4rem 0 0;font-size:.95rem;line-height:1.45;color:var(--ink-soft)}
.gt__r{display:none}
@media (max-width:600px){
  [data-gt-cal] .gt__rows li.is-short .gt__r{display:block;position:absolute;top:50%;right:calc(100% - (var(--s) - var(--from)) / (var(--to) - var(--from)) * 100% + .45rem);transform:translateY(-50%);white-space:nowrap;font:600 .875rem/1 var(--sans);color:var(--ink)}
}
#calendrier,#vous,#offre,#six-etapes{scroll-margin-top:calc(var(--sh-h) + 1rem)}
@media (min-width:360px) and (max-width:600px){.of__dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem 1rem}.of__dl>div:nth-child(2){grid-column:1/-1;order:3}.of__dl>div:nth-child(4){order:2}.of__dl>div:nth-child(3){order:4;grid-column:1/-1}}
/* ---- R7, /programme/ : les paiements sur le Gantt du résultat, un repère par paiement connu ---- */
.gt__pay{position:absolute;z-index:2;top:50%;left:calc((var(--p) + .5 - var(--from)) / (var(--to) - var(--from)) * 100%);width:.75rem;height:.75rem;transform:translate(-50%,-50%) rotate(45deg);background:var(--amber);border:1.5px solid var(--night);box-sizing:border-box}
.gt__pay.is-m{width:.32rem;height:.32rem;border:0;border-radius:50%;transform:translate(-50%,-50%);background:var(--amber)}
.gt__pay.is-us{background:var(--stone);border-color:var(--amber-deep)}
.pp__key i.k-pub,.pp__key i.k-m,.pp__key i.k-pus{width:.75rem;height:.75rem;border-radius:0;box-sizing:border-box}
.pp__key i.k-pub{background:var(--amber);border:1.5px solid var(--night);transform:rotate(45deg)}
.pp__key i.k-m{width:.4rem;height:.4rem;border-radius:50%;background:var(--amber-deep)}
.pp__key i.k-pus{background:var(--stone);border:1.5px solid var(--amber-deep);transform:rotate(45deg)}
.pp__key{margin-top:.7rem}
.pp__key i.k-pub,.pp__key i.k-pus{margin:0 .1rem 0 .3rem;flex:none}
/* Décisions de Loic du 19/10 : la définition de l'agent déployé, juste sous le barème du suivi. */
.pp__note + .pp__def{margin-top:-.8rem;font-weight:400}
/* Auto-vérification sans JavaScript (apport-cession, fonds de commerce, conseil en cession) : un compteur CSS des cases
   non cochées, et le verdict qui change par :has() quand toutes le sont. */
.ck{max-width:var(--text);margin:1.4rem 0;counter-reset:ck}
.ck fieldset{border:0;padding:0;margin:0;min-width:0}
.ck legend{font:600 .875rem/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-deep);margin:0 0 .8rem;padding:0}
.ck .choices input{border-radius:.3rem}
.ck .choices input::before{border-radius:.15rem}
.ck input:not(:checked){counter-increment:ck}
.ck__out{margin-top:1rem;padding:1rem 1.2rem;border-radius:var(--r);background:var(--card);border-left:4px solid var(--amber-deep)}
.ck__out p{margin:0}
.ck__n::before{content:counter(ck)}
.ck__ok{display:none}
.ck:not(:has(input:not(:checked))) .ck__ok{display:block}
.ck:not(:has(input:not(:checked))) .ck__todo{display:none}
.cs--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:980px){.cs--3{grid-template-columns:1fr}}
/* Trois colonnes : la flèche passe à la verticale, pour que « L'acquéreur » tienne dans son cadre. */
.cs--3 .cs__flow{grid-template-columns:1fr;justify-items:stretch}
.cs--3 .cs__arrow{padding:.2rem 0 1.2rem}
.cs--3 .cs__arrow::before{left:50%;right:auto;top:auto;bottom:.2rem;width:2px;height:.9rem}
.cs--3 .cs__arrow::after{left:calc(50% - .4rem);right:auto;bottom:-.5rem;border:.4rem solid transparent;border-top:.6rem solid var(--amber-deep);border-bottom:0}