/* We Are Solutions : design v2.1 "La descente jusqu'à la racine" (2026-10-13), À VALIDER. Base v2 + section 18 (v2.1).
   Aucune ressource distante. Polices OFL locales (assets/fonts). Aucun style inline requis (CSP stricte). */

@font-face{font-family:"Bricolage";src:url(fonts/bricolage.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(fonts/instrument-sans.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(fonts/instrument-serif-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(fonts/instrument-serif.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}

/* ---------- 1. Tokens ---------- */
:root{
  /* encre (fonds sombres) */
  --ink-0:#050B0A; --ink-1:#091412; --ink-2:#0F1F1C; --ink-3:#173029;
  /* papier (fonds clairs) */
  --paper:#F3EEE2; --paper-2:#E8E0CD; --paper-3:#FBF8F0;
  /* lumière : l'unique accent */
  --light:#FFB22E; --light-hi:#FFC95C; --light-deep:#FF8A1F; --light-ink:#8A4A00;
  /* profondeur : teinte de marque, décor seulement */
  --teal-300:#34C3B3; --teal-500:#1B8F86; --teal-700:#0F5C57;
  /* texte */
  --text-d:#EEF4F1; --muted-d:#A9BCB6; --field-d:#8FA39D;
  --text-l:#0A1513; --muted-l:#44534F; --field-l:#5E6B67;
  /* états */
  --err-d:#FF9A8F; --err-l:#A3231A; --ok-d:#7BE0A0; --ok-l:#14663A;
  /* type */
  --f-display:"Bricolage","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;
  --f-body:"Instrument Sans","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  --f-serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  /* espace (base 4 px) */
  --s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.5rem;--s6:2rem;--s7:3rem;--s8:4.5rem;--s9:7rem;--s10:11rem;
  --gut:clamp(1.25rem,4vw,3rem); --max:84rem; --narrow:46rem;
  --r1:10px;--r2:20px;--r3:32px;--pill:999px;
  --ease:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1);
  --hdr:3.5rem;
  /* thème par défaut = sombre ; .light bascule */
  --bg:var(--ink-1); --bg-2:var(--ink-2); --fg:var(--text-d); --fg-2:var(--muted-d);
  --acc:var(--light); --line:rgba(238,244,241,.16); --field:var(--field-d);
  --focus:var(--light-hi); --err:var(--err-d); --ok:var(--ok-d); --card:var(--ink-2);
}
.light{
  --bg:var(--paper); --bg-2:var(--paper-2); --fg:var(--text-l); --fg-2:var(--muted-l);
  --acc:var(--light-ink); --line:rgba(10,21,19,.18); --field:var(--field-l);
  --focus:#0A1513; --err:var(--err-l); --ok:var(--ok-l); --card:var(--paper-3);
}
.amber{
  --bg:var(--light); --bg-2:var(--light-hi); --fg:var(--text-l); --fg-2:var(--text-l);
  --acc:var(--text-l); --line:rgba(10,21,19,.3); --focus:#0A1513;
}

/* ---------- 2. Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 2rem);background:var(--ink-0)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;font:400 clamp(1.0625rem,1rem + .25vw,1.1875rem)/1.6 var(--f-body);color:var(--text-d);background:var(--ink-0);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1;letter-spacing:-.035em;margin:0;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
::selection{background:var(--light);color:#0A1513}
.sr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:1rem;top:-5rem;z-index:100;background:var(--light);color:#0A1513;padding:.75rem 1.25rem;border-radius:var(--pill);font-weight:600;text-decoration:none;transition:transform .2s var(--ease)}
.skip:focus{transform:translateY(5.75rem)}
.wrap{width:min(100% - 2*var(--gut),var(--max));margin-inline:auto}
.narrow{width:min(100% - 2*var(--gut),var(--narrow));margin-inline:auto}
.band{background:var(--bg);color:var(--fg);position:relative;isolation:isolate}
.sec{padding-block:clamp(4.5rem,9vw,9rem)}
.grain::after{content:"";position:absolute;inset:0;border-radius:inherit;background:url(grain.svg);opacity:.5;mix-blend-mode:overlay;pointer-events:none;z-index:-1}
.light.grain::after{opacity:.35;mix-blend-mode:multiply}

/* signalement des textes manquants : visibles, jamais masqués */
.todo{background:transparent;color:inherit;border:1.5px dashed currentColor;border-radius:6px;padding:0 .35em;font-size:.88em;white-space:normal;box-decoration-break:clone;-webkit-box-decoration-break:clone}

/* ---------- 3. Typographie ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:.75rem;font:600 .8125rem/1.2 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.eyebrow::before{content:"";width:2.25rem;height:2px;background:currentColor;border-radius:2px}
.h-xxl{font-size:clamp(2.9rem,1rem + 9.2vw,9.25rem);line-height:.9;letter-spacing:-.05em}
.h-xl{font-size:clamp(2.5rem,1rem + 6vw,6.25rem);line-height:.94;letter-spacing:-.045em}
.h-l{font-size:clamp(2rem,1rem + 3.6vw,4rem);line-height:1;letter-spacing:-.04em}
.h-m{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.25rem);letter-spacing:-.03em;line-height:1.1}
.lede{font-size:clamp(1.1875rem,1rem + .9vw,1.625rem);line-height:1.45;color:var(--fg-2);max-width:40rem;text-wrap:pretty}
.serif{font-family:var(--f-serif);font-style:italic;font-weight:400;letter-spacing:-.02em}
.h-xxl .serif,.h-xl .serif,.h-l .serif{letter-spacing:-.03em}
.hl{color:var(--light)}
.light .hl{color:var(--light-ink)}
.prose p{max-width:62ch;text-wrap:pretty}
.prose p+p{margin-top:1em}

/* ---------- 4. Boutons ---------- */
.btn{--b-bg:var(--light);--b-fg:#0A1513;display:inline-flex;align-items:center;gap:.75rem;min-height:3.25rem;padding:.8rem 1.6rem;border-radius:var(--pill);
  font:600 1.0625rem/1.2 var(--f-body);text-decoration:none;border:2px solid transparent;background:var(--b-bg);color:var(--b-fg);cursor:pointer;
  box-shadow:0 0 0 0 rgba(255,178,46,0);transition:transform .2s var(--ease),box-shadow .25s var(--ease),background-color .2s}
.btn svg{width:1.25rem;height:1.25rem;flex:none;transition:transform .25s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 40px -8px rgba(255,178,46,.6)}
.btn:hover svg{transform:translateX(4px)}
.btn:active{transform:translateY(0) scale(.97)}
.btn--ghost{--b-bg:transparent;--b-fg:var(--fg);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--fg);box-shadow:none}
.light .btn:not(.btn--ghost){--b-bg:#0A1513;--b-fg:#F3EEE2}
.light .btn:not(.btn--ghost):hover{box-shadow:0 10px 40px -10px rgba(10,21,19,.6)}
.light .btn:not(.btn--ghost) svg{color:var(--light)}
.amber .btn:not(.btn--ghost){--b-bg:#0A1513;--b-fg:#F3EEE2}
.amber .btn:not(.btn--ghost) svg{color:var(--light)}
.btn[aria-disabled=true],.btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.link{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;text-decoration:none;min-height:2.75rem;color:var(--fg)}
.link span{background:linear-gradient(currentColor,currentColor) 0 100%/100% 2px no-repeat;padding-bottom:2px;transition:background-size .3s var(--ease)}
.link:hover span{background-size:0 2px;background-position:100% 100%}
.link svg{width:1.1rem;height:1.1rem;transition:transform .25s var(--ease)}
.link:hover svg{transform:translateX(4px)}

/* ---------- 5. En-tête ---------- */
.hdr{position:fixed;inset:.75rem 0 auto 0;z-index:50;pointer-events:none}
.hdr__bar{pointer-events:auto;width:min(100% - 1.5rem,var(--max));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:var(--hdr);padding:.375rem .5rem .375rem 1rem;border:1px solid rgba(238,244,241,.16);border-radius:var(--pill);
  background:rgba(9,20,18,.9);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);color:var(--text-d);
  box-shadow:0 10px 40px -12px rgba(0,0,0,.6);transition:background-color .3s}
.brand{display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;font:700 1.125rem/1 var(--f-display);letter-spacing:-.03em;min-height:2.75rem}
.brand svg{width:2rem;height:2rem;color:var(--text-d)}
.brand .mark-dot{fill:var(--light)}
.brand b{font-weight:700}
.brand i{font-style:normal;font-weight:400;opacity:.75;margin-right:.18em}
.nav{display:none}
.nav ul{display:flex;gap:.25rem}
.nav a{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 .9rem;border-radius:var(--pill);text-decoration:none;font-weight:500;font-size:.9375rem;color:var(--muted-d);transition:color .2s,background-color .2s}
.nav a:hover{color:var(--text-d);background:rgba(238,244,241,.08)}
.nav a[aria-current=page]{color:#0A1513;background:var(--text-d)}
.hdr .btn{min-height:2.75rem;padding:.5rem 1.2rem;font-size:.9375rem}
.hdr .btn--cta{display:none}
.menu{position:relative}
.menu summary{list-style:none;display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;padding:0 1.1rem;border-radius:var(--pill);border:1px solid rgba(238,244,241,.22);cursor:pointer;font-weight:600;font-size:.9375rem}
.menu summary::-webkit-details-marker{display:none}
.menu summary i{width:1rem;height:.625rem;position:relative;display:inline-block}
.menu summary i::before,.menu summary i::after{content:"";position:absolute;left:0;width:100%;height:2px;background:currentColor;border-radius:2px;transition:transform .25s var(--ease)}
.menu summary i::before{top:0}.menu summary i::after{bottom:0}
.menu[open] summary i::before{transform:translateY(4px) rotate(45deg)}
.menu[open] summary i::after{transform:translateY(-4px) rotate(-45deg)}
.menu__panel{position:absolute;right:-.5rem;top:calc(100% + .9rem);width:min(22rem,calc(100vw - 1.5rem));padding:1rem;border-radius:var(--r2);border:1px solid rgba(238,244,241,.16);background:#091412;box-shadow:0 30px 80px -20px #000}
.menu__panel a:not(.btn){display:flex;align-items:center;min-height:3rem;padding:0 .75rem;text-decoration:none;font:600 1.5rem/1 var(--f-display);letter-spacing:-.03em;border-radius:var(--r1)}
.menu__panel a[aria-current=page]{color:var(--light)}
.menu__panel .btn{margin-top:.75rem;width:100%;justify-content:center}
.menu[open] .menu__panel{animation:pop .25s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@media (min-width:62rem){
  .nav{display:block}.menu{display:none}.hdr .btn--cta{display:inline-flex}
}

/* ---------- 6. Accueil : hero ---------- */
.hero{min-height:max(100svh,40rem);display:grid;align-content:end;padding:calc(var(--hdr) + 7rem) 0 clamp(3rem,6vw,6rem);overflow:hidden;
  background:
   radial-gradient(60rem 36rem at 85% 105%,rgba(255,178,46,.2),transparent 62%),
   radial-gradient(52rem 40rem at 5% -10%,rgba(27,143,134,.34),transparent 62%),
   linear-gradient(180deg,#07100E,var(--ink-1))}
.hero__roots{position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%;pointer-events:none}
.hero__roots svg{width:100%;height:100%}
@media (min-width:62rem){.hero__roots{left:auto;width:58%;right:0}}
@media (max-width:61.99rem){.hero__roots{opacity:.8}}
.hero__title{max-width:14ch;font-size:clamp(3.1rem,1rem + 9.2vw,9.25rem)}
.hero__title .l{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero__title .l>span{display:inline-block}
.hero__title .serif{color:var(--light);padding-right:.08em}
.hero__sub{margin-top:clamp(1.5rem,3vw,2.5rem)}
.hero .cta-row{margin-top:clamp(1.75rem,3vw,2.5rem)}
.hero__sig{margin-top:clamp(2.5rem,5vw,4.5rem);display:flex;align-items:center;gap:1rem;color:var(--muted-d);font-size:.9375rem}
.hero__sig::before{content:"";width:3rem;height:1px;background:var(--muted-d)}
.hero__scroll{position:absolute;right:var(--gut);bottom:clamp(3rem,6vw,6rem);display:none;writing-mode:vertical-rl;font:600 .75rem/1 var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted-d)}
@media (min-width:62rem){.hero__scroll{display:block}}

/* racines : tracé */
.r-line{fill:none;stroke:var(--teal-500);stroke-linecap:round;opacity:.7}
.r-main{fill:none;stroke-linecap:round}
.r-tip{fill:var(--light)}
.r-halo{opacity:.35}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.2s var(--ease) forwards}
.d0{animation-delay:.2s}.d1{animation-delay:.5s}.d2{animation-delay:.85s}.d3{animation-delay:1.2s}.d4{animation-delay:1.55s}.d5{animation-delay:1.9s}.d6{animation-delay:2.2s}
.r-main.draw{animation-duration:3.2s;animation-delay:.6s}
.r-tip,.r-halo{opacity:0;animation:fade 1s 3.4s var(--ease) forwards}
.r-halo{animation-name:halo}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes halo{to{opacity:.35}}
@keyframes rise{from{transform:translateY(105%)}to{transform:none}}
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .hero__title .l>span{animation:rise 1s var(--ease) backwards}
  .hero__title .l:nth-child(2)>span{animation-delay:.12s}
  .hero__sub,.hero .cta-row,.hero__sig,.hero .eyebrow{animation:up .9s var(--ease) .45s backwards}
  .hero .cta-row{animation-delay:.6s}.hero__sig{animation-delay:.75s}
}
@media (prefers-reduced-motion:reduce){
  .draw{stroke-dashoffset:0;animation:none}.r-tip{opacity:1;animation:none}.r-halo{opacity:.45;animation:none}
}

/* ---------- 7. Bandeau défilant ---------- */
.ticker{background:var(--light);color:#0A1513;overflow:hidden;white-space:nowrap;border-block:1px solid #0A1513}
.ticker__track{display:inline-flex;animation:tick 38s linear infinite;will-change:transform}
.ticker__group{display:inline-flex;align-items:center;gap:1.75rem;padding:.9rem .875rem;font:700 clamp(1.25rem,1rem + 1vw,1.75rem)/1 var(--f-display);letter-spacing:-.03em}
.ticker__group span.serif{font-weight:400;font-size:1.15em}
.ticker__group i{width:.6rem;height:.6rem;background:#0A1513;border-radius:50%;flex:none}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker__track{animation:none}.ticker{white-space:normal}.ticker__group+.ticker__group{display:none}.ticker__group{flex-wrap:wrap}}

/* ---------- 8. La descente (fil narratif) ---------- */
.descent{background:var(--ink-1);color:var(--text-d);position:relative;isolation:isolate}
.descent__stage{position:relative;overflow:hidden;padding:clamp(5rem,9vw,8rem) 0;display:grid;align-content:center}
.descent__glow{position:absolute;left:50%;bottom:-30%;width:120vmax;height:80vmax;margin-left:-60vmax;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,178,46,.55),rgba(255,138,31,.18) 55%,transparent);opacity:.18}
.descent__head{max-width:46rem}
.descent__head .h-l{margin-top:1rem;font-size:clamp(1.75rem,1rem + 2.4vw,3.25rem)}
.descent__head p{margin-top:.75rem;color:var(--muted-d);font-size:.9375rem}
.descent__grid{display:grid;gap:2.5rem;margin-top:clamp(1.25rem,3.5vh,3rem);grid-template-columns:1fr}
.chain{position:relative;display:grid;gap:0}
.chain li{position:relative;padding:0 0 clamp(1rem,2.4vh,1.75rem) 3.25rem}
.chain li:last-child{padding-bottom:0}
.chain li::before{content:"";position:absolute;left:0;top:.35rem;width:1.5rem;height:1.5rem;border-radius:50%;border:2px solid var(--teal-300);background:var(--ink-1);transition:background-color .4s,border-color .4s,box-shadow .6s}
.chain li::after{content:"";position:absolute;left:calc(.75rem - 1px);top:2rem;bottom:.35rem;width:2px;background:linear-gradient(var(--teal-300),var(--light));border-radius:2px;transform-origin:top}
.chain li:last-child::after{display:none}
.chain__tag{display:block;font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--teal-300);margin-bottom:.6rem}
.chain__txt{display:block;font:600 clamp(1.3rem,.9rem + 2.1vw,2.75rem)/1.08 var(--f-display);letter-spacing:-.035em;text-wrap:balance;max-width:30ch}
.chain li:last-child .chain__tag{color:var(--light)}
.chain li:last-child::before{border-color:var(--light);background:var(--light);box-shadow:0 0 0 6px rgba(255,178,46,.2),0 0 60px 8px rgba(255,178,46,.6)}
.chain li:last-child .chain__txt{color:var(--light-hi)}
.gauge{display:none}
.descent__out{margin-top:clamp(1.25rem,3vh,2.5rem);display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}
.descent__out p{font:600 clamp(1.1rem,1rem + .9vw,1.6rem)/1.15 var(--f-display);letter-spacing:-.03em;max-width:24ch}
@media (min-width:62rem){
  .descent__grid{grid-template-columns:minmax(0,1fr) 7rem;align-items:stretch}
  .gauge{display:block;position:relative;--gh:19rem;height:var(--gh);align-self:start}
  .gauge::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:repeating-linear-gradient(180deg,var(--line) 0 2px,transparent 2px 14px);margin-left:-1px}
  .gauge b{position:absolute;left:50%;top:0;width:1.25rem;height:1.25rem;margin-left:-.625rem;border-radius:50%;background:var(--light);box-shadow:0 0 30px 6px rgba(255,178,46,.7);transform:translateY(calc(var(--p,0)*(var(--gh) - 1.25rem)))}
}
/* mode animé : piste haute, scène collante, éléments révélés au défilement */
@media (prefers-reduced-motion:no-preference){
  .js .descent__track{height:420svh;position:relative}
  .js .descent__stage{position:sticky;top:0;height:100svh;min-height:34rem;padding:calc(var(--hdr) + 2rem) 0 1.5rem;align-content:safe center}
  .js .chain li{opacity:0;transform:translateY(28px);transition:opacity .6s var(--ease),transform .7s var(--ease),filter .6s}
  .js .chain li.is-past{opacity:.38;transform:none}
  .js .chain li.is-active{opacity:1;transform:none}
  .js .chain li::after{transform:scaleY(0);transition:transform .8s var(--ease-io)}
  .js .chain li.is-past::after{transform:scaleY(1)}
  .js .chain li:not(.is-past):not(.is-active)::before{border-color:var(--line)}
  .js .chain li.is-active::before,.js .chain li.is-past::before{background:var(--teal-300)}
  .js .chain li:last-child.is-active::before{background:var(--light)}
  .js .descent__glow{opacity:calc(.12 + var(--bloom,0)*.88);transform:scale(calc(.55 + var(--bloom,0)*.6));transform-origin:50% 100%}
  .js .descent__out{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease) .2s,transform .7s var(--ease) .2s}
  .js .descent.is-done .descent__out{opacity:1;transform:none}
  .js .descent__stage .chain{margin-top:0}
}
@media (max-width:61.99rem) and (prefers-reduced-motion:no-preference){
  .js .chain li{padding-bottom:1.25rem}
  .js .chain__txt{font-size:clamp(1.15rem,4.8vw,1.6rem)}
  .js .descent__head .h-l{font-size:clamp(1.75rem,8vw,2.5rem)}
  .js .descent__head p{display:none}
}

/* ---------- 9. Offres (accueil, cartes) ---------- */
.light-sec{background:var(--paper)}
.sec__head{display:grid;gap:1.25rem;margin-bottom:clamp(2.5rem,5vw,4.5rem);max-width:56rem}
.bento{display:grid;gap:1rem}
.card{--fg:var(--text-d);--fg-2:var(--muted-d);--acc:var(--light);--line:rgba(238,244,241,.16);position:relative;display:flex;flex-direction:column;gap:1.25rem;padding:clamp(1.5rem,3vw,2.25rem);border-radius:var(--r3);background:var(--ink-1);color:var(--text-d);overflow:hidden;text-decoration:none;isolation:isolate;
  border:1px solid rgba(238,244,241,.1);transition:transform .35s var(--ease),border-color .3s}
.card::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .35s;
  background:radial-gradient(28rem 20rem at var(--mx,50%) var(--my,0%),rgba(255,178,46,.2),transparent 65%)}
.card:hover{transform:translateY(-4px);border-color:rgba(255,178,46,.55)}
.card:hover::before{opacity:1}
.card__n{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;color:var(--light)}
.card h3{font-size:clamp(1.75rem,1.2rem + 1.8vw,2.5rem);letter-spacing:-.04em;line-height:1.02}
.card p{color:var(--muted-d)}
.card .link{margin-top:auto;color:var(--text-d)}
.card__art{width:100%;max-width:22rem;height:auto;color:var(--teal-300);margin-top:auto}
.card__art .a{stroke:var(--light);fill:none}
.card__art .af{fill:var(--light)}
.card__art .s{fill:none;stroke:currentColor}
.card--wide .card__art{max-width:30rem}
@media (min-width:48rem){
  .bento{grid-template-columns:repeat(6,1fr)}
  .bento .card{grid-column:span 3}
  .bento .card--wide{grid-column:span 6;flex-direction:row;align-items:stretch;gap:3rem}
  .bento .card--wide>div{flex:1 1 45%}
  .bento .card--wide .card__art{flex:1 1 55%;min-width:0;align-self:center}
}
@media (min-width:62rem){
  .bento .card{grid-column:span 2;min-height:32rem}
  .bento .card--wide{grid-column:span 2;flex-direction:column;gap:1.25rem}
  .bento .card--wide>div{flex:none}
  .bento .card--wide .card__art{margin-top:auto}
}

/* ---------- 10. Méthode en 3 étapes ---------- */
.steps{display:grid;gap:0;counter-reset:st}
.step{position:relative;display:grid;gap:.75rem 2rem;padding-block:clamp(1.75rem,3vw,2.75rem);border-top:1px solid var(--line);grid-template-columns:auto 1fr}
.step:last-child{border-bottom:1px solid var(--line)}
.step__n{font:700 clamp(3.5rem,2rem + 7vw,8rem)/.8 var(--f-display);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px var(--fg);min-width:1.2em;transition:color .3s,-webkit-text-stroke-color .3s}
.step:hover .step__n{color:var(--acc);-webkit-text-stroke-color:var(--acc)}
.step h3{font-size:clamp(1.5rem,1.1rem + 1.8vw,2.5rem);letter-spacing:-.035em}
.step p{grid-column:2;color:var(--fg-2);max-width:46ch}
@media (min-width:48rem){
  .step{grid-template-columns:12rem 1fr 1fr;align-items:baseline}
  .step p{grid-column:3}
}

/* ---------- 11. Pourquoi nous / listes à grands numéros ---------- */
.bigs{display:grid;gap:clamp(1.5rem,3vw,2.5rem)}
.big{border-top:2px solid var(--fg);padding-top:1.25rem;display:grid;gap:.75rem}
.big b{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;color:var(--acc)}
.big p{font:600 clamp(1.25rem,1.05rem + .9vw,1.75rem)/1.2 var(--f-display);letter-spacing:-.025em;text-wrap:balance}
@media (min-width:48rem){.bigs{grid-template-columns:repeat(2,1fr)}}
@media (min-width:75rem){.bigs--4{grid-template-columns:repeat(4,1fr)}}

/* ---------- 12. Signature im|possible ---------- */
.sig{padding-block:clamp(4rem,10vw,10rem);text-align:center;overflow:hidden}
.sig p{font:700 clamp(2.4rem,1rem + 7.6vw,8.5rem)/.98 var(--f-display);letter-spacing:-.055em;text-wrap:balance;max-width:16ch;margin-inline:auto}
.im{position:relative;display:inline-block}
.im::after{content:"";position:absolute;left:-.04em;right:-.04em;top:56%;height:.09em;background:currentColor;transform-origin:left;transform:scaleX(1);border-radius:4px}
.sig .serif{font-weight:400}
.sig small{display:block;margin-top:2rem;font:600 .8125rem/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase}
@media (prefers-reduced-motion:no-preference){
  .js .im::after{transform:scaleX(0);transition:transform .9s var(--ease-io) .5s}
  .js .im{transition:opacity .7s var(--ease) 1.2s}
  .js .is-in .im::after,.js .im.is-in::after{transform:scaleX(1)}
  .js .is-in .im{opacity:.3}
}
.im{opacity:.3}

/* ---------- 13. Appel final & pied ---------- */
.final{padding-block:clamp(5rem,10vw,10rem);text-align:left;overflow:hidden;
  background:radial-gradient(50rem 30rem at 80% 120%,rgba(255,178,46,.28),transparent 65%),radial-gradient(40rem 30rem at 0% 0%,rgba(27,143,134,.3),transparent 65%),var(--ink-1)}
.final .h-xl{max-width:14ch}
.final p{margin-top:1.5rem}
.final .cta-row{margin-top:2.25rem}
.ftr{background:var(--ink-0);color:var(--muted-d);padding:clamp(3.5rem,6vw,6rem) 0 0;overflow:hidden;position:relative}
.ftr__grid{display:grid;gap:2.5rem;padding-bottom:3rem}
.ftr h2{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--text-d);margin-bottom:1rem}
.ftr ul{display:grid;gap:0}
.ftr a{display:inline-flex;align-items:center;min-height:2.75rem;text-decoration:none;color:var(--muted-d);transition:color .2s}
.ftr a:hover{color:var(--light)}
.ftr address{font-style:normal;line-height:1.7}
.ftr__sig{font:600 1.125rem/1.3 var(--f-display);letter-spacing:-.02em;color:var(--text-d);max-width:18ch;margin-top:1rem}
.ftr__word{font:700 clamp(4rem,3rem + 15vw,19rem)/.78 var(--f-display);letter-spacing:-.065em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(238,244,241,.22);user-select:none;margin-bottom:-.12em;padding-top:1rem}
.ftr__low{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;border-top:1px solid rgba(238,244,241,.12);padding:1rem 0;font-size:.875rem}
@media (min-width:48rem){.ftr__grid{grid-template-columns:1fr 1fr}}
@media (min-width:64rem){.ftr__grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}

/* ---------- 14. Pages intérieures ---------- */
.phead{padding:calc(var(--hdr) + clamp(5rem,10vw,9rem)) 0 clamp(3rem,6vw,6rem);position:relative;overflow:hidden;
  background:radial-gradient(48rem 30rem at 90% 0%,rgba(27,143,134,.34),transparent 62%),radial-gradient(40rem 26rem at 0% 110%,rgba(255,178,46,.14),transparent 65%),var(--ink-1)}
.phead__grid{display:grid;gap:2.5rem;align-items:end}
.phead h1{margin-top:1.5rem}
.phead .lede{margin-top:1.75rem}
.phead .cta-row{margin-top:2rem}
.phead__art{width:100%;max-width:34rem;justify-self:end;color:var(--teal-300)}
.phead__art .a{stroke:var(--light);fill:none}.phead__art .af{fill:var(--light)}.phead__art .s{fill:none;stroke:currentColor}
@media (min-width:62rem){.phead__grid{grid-template-columns:1.25fr 1fr}}
.crumb{font-size:.875rem;color:var(--muted-d)}
.crumb a{text-decoration:none;display:inline-flex;align-items:center;min-height:2.75rem}
.crumb a:hover{color:var(--light)}

/* cartes empilées (offres) */
.pile{display:grid;gap:1.25rem}
.pile .card{min-height:0;padding:clamp(1.5rem,4vw,3rem);gap:2rem;background:linear-gradient(160deg,var(--ink-3),var(--ink-2) 55%);border-color:rgba(238,244,241,.14)}
.pile__body{display:grid;gap:1.5rem}
.pile dl{display:grid;gap:1.25rem;margin:0}
.pile dt{font:600 .75rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:.4rem}
.pile dd{margin:0;color:var(--text-d)}
@media (min-width:62rem){
  .pile{gap:0}
  .pile .card{position:sticky;top:calc(var(--hdr) + 2rem);flex-direction:row;align-items:center;gap:3rem;min-height:26rem;margin-bottom:1.5rem;box-shadow:0 -30px 60px -30px rgba(0,0,0,.6)}
  .pile .card:nth-child(2){top:calc(var(--hdr) + 3.5rem)}
  .pile .card:nth-child(3){top:calc(var(--hdr) + 5rem)}
  .pile__body{flex:1.2}
  .pile .card__art{flex:1;max-width:26rem;margin:0}
  .pile dl{grid-template-columns:1fr 1fr}
}
/* situations */
.situ{display:grid;gap:1rem}
.situ a{display:grid;gap:.5rem;padding:1.5rem;border-radius:var(--r2);background:var(--paper-3);text-decoration:none;border:1px solid var(--line);transition:transform .3s var(--ease),background-color .3s,color .3s}
.situ a:hover{transform:translateY(-3px);background:#0A1513;color:var(--paper)}
.situ q{font:600 clamp(1.25rem,1rem + 1vw,1.75rem)/1.15 var(--f-display);letter-spacing:-.03em;quotes:none}
.situ span{color:var(--muted-l);transition:color .3s}
.situ a:hover span{color:var(--light)}
@media (min-width:48rem){.situ{grid-template-columns:1fr 1fr}}
@media (min-width:75rem){.situ{grid-template-columns:repeat(4,1fr)}}
.note{padding:clamp(1.5rem,3vw,2.5rem);border-radius:var(--r3);border:1px solid var(--line);display:grid;gap:1rem}
.note .h-m{max-width:24ch}

/* FAQ */
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;min-height:4.5rem;padding-block:1rem;font:600 clamp(1.25rem,1.05rem + .8vw,1.625rem)/1.2 var(--f-display);letter-spacing:-.025em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:2.75rem;height:2.75rem;border-radius:50%;border:1.5px solid var(--line);position:relative;transition:transform .3s var(--ease),background-color .2s,border-color .2s}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:.9rem;height:2px;background:currentColor;margin:-1px 0 0 -.45rem;border-radius:2px}
.faq summary i::after{transform:rotate(90deg);transition:transform .3s var(--ease)}
.faq summary:hover i{border-color:var(--fg)}
.faq details[open] summary i{transform:rotate(180deg);background:var(--fg);border-color:var(--fg);color:var(--bg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .ans{padding:0 0 1.75rem;color:var(--fg-2);max-width:60ch}
.faq details[open] .ans{animation:up .4s var(--ease)}
.split{display:grid;gap:2rem}
@media (min-width:62rem){.split{grid-template-columns:1fr 1.6fr;gap:4rem}.split>:first-child{position:sticky;top:calc(var(--hdr) + 3rem);align-self:start}}

/* liste « pour qui » */
.ticks{display:grid;gap:.25rem}
.ticks li{display:flex;gap:1rem;align-items:baseline;padding:1rem 0;border-top:1px solid var(--line);font:500 clamp(1.125rem,1rem + .7vw,1.5rem)/1.3 var(--f-body)}
.ticks li::before{content:"";flex:none;width:.7rem;height:.7rem;border-radius:50%;background:var(--acc);transform:translateY(-.05em)}
.ticks--ok li::before{width:1.1rem;height:.6rem;border-radius:0;background:none;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg) translateY(-.3em)}

/* exemple (chaîne horizontale, page méthode) */
.ex{display:grid;gap:0;counter-reset:ex}
.ex li{position:relative;padding:1.25rem 0 1.25rem 4rem;border-top:1px solid var(--line);font:600 clamp(1.25rem,1rem + 1.5vw,2.25rem)/1.1 var(--f-display);letter-spacing:-.03em}
.ex li::before{counter-increment:ex;content:"0" counter(ex);position:absolute;left:0;top:1.35rem;font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;color:var(--acc)}
.ex li:last-child{color:var(--light-hi)}
.light .ex li:last-child{color:var(--light-ink)}
.ex small{display:block;margin-top:.5rem;font:600 .75rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2)}

/* Générateur d'idées : spectre */
.spectrum{position:relative;margin-block:clamp(2rem,4vw,3.5rem)}
.spectrum__bar{height:.75rem;border-radius:var(--pill);background:linear-gradient(90deg,var(--teal-700),var(--teal-300) 45%,var(--light) 80%,var(--light-deep))}
.spectrum__dots{display:flex;justify-content:space-between;margin-top:-1.05rem;padding-inline:.5rem}
.spectrum__dots i{width:1.35rem;height:1.35rem;border-radius:50%;background:var(--ink-1);border:3px solid var(--fg);transition:transform .3s var(--ease)}
.spectrum:hover .spectrum__dots i{transform:translateY(-.4rem)}
.spectrum:hover .spectrum__dots i:nth-child(2n){transform:translateY(.4rem)}
.spectrum__labels{display:flex;justify-content:space-between;margin-top:1.25rem;font:600 .8125rem/1.2 var(--f-body);letter-spacing:.14em;text-transform:uppercase}
.three{display:grid;gap:1rem}
@media (min-width:48rem){.three{grid-template-columns:repeat(3,1fr)}}
.three .card{min-height:0}
.three .card p{color:var(--text-d);font:500 clamp(1.125rem,1rem + .5vw,1.35rem)/1.4 var(--f-body)}
.input-chips{display:flex;flex-wrap:wrap;gap:.6rem}
.chip{display:inline-flex;align-items:center;min-height:2.5rem;padding:0 1rem;border-radius:var(--pill);border:1px solid var(--line);font-weight:600;font-size:.9375rem}

/* Sites one page : fenêtre de navigateur */
.browser{border-radius:var(--r2);background:var(--ink-2);border:1px solid rgba(238,244,241,.18);box-shadow:0 50px 100px -30px #000,0 0 80px -10px rgba(255,178,46,.25);overflow:hidden;transform:perspective(1400px) rotateY(-9deg) rotateX(4deg);transition:transform .6s var(--ease);max-width:34rem;justify-self:end;width:100%}
.browser:hover{transform:perspective(1400px) rotateY(-3deg) rotateX(1deg)}
.browser__bar{display:flex;align-items:center;gap:.4rem;padding:.75rem 1rem;border-bottom:1px solid rgba(238,244,241,.12)}
.browser__bar i{width:.65rem;height:.65rem;border-radius:50%;background:rgba(238,244,241,.25)}
.browser__bar span{margin-left:.75rem;flex:1;height:1.4rem;border-radius:var(--pill);background:rgba(238,244,241,.08);font:500 .75rem/1.4rem var(--f-body);padding-inline:.8rem;color:var(--muted-d)}
.browser__page{padding:1.5rem;display:grid;gap:.9rem}
.sk{height:.7rem;border-radius:var(--pill);background:rgba(238,244,241,.16)}
.sk--h{height:2.2rem;width:78%;background:var(--text-d);border-radius:.5rem}
.sk--h2{height:2.2rem;width:52%;background:var(--light);border-radius:.5rem}
.sk--w{width:92%}.sk--m{width:70%}.sk--s{width:40%}
.sk--btn{width:7rem;height:2.2rem;border-radius:var(--pill);background:var(--light);margin-top:.5rem}
.sk-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:.5rem}
.sk-row div{height:4.5rem;border-radius:.6rem;background:linear-gradient(160deg,rgba(52,195,179,.35),rgba(238,244,241,.06))}
@media (prefers-reduced-motion:reduce){.browser,.browser:hover{transform:none}}
@media (max-width:47.99rem){.browser{transform:none}}
.tl{display:grid;gap:0;position:relative}
.tl li{position:relative;padding:0 0 2.5rem 4rem;font:500 clamp(1.125rem,1rem + .7vw,1.5rem)/1.35 var(--f-body)}
.tl li:last-child{padding-bottom:0}
.tl li::before{counter-increment:tl;content:counter(tl);position:absolute;left:0;top:-.15rem;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--bg);border:2px solid var(--fg);display:grid;place-items:center;font:700 1rem/1 var(--f-display)}
.tl li::after{content:"";position:absolute;left:calc(1.375rem - 1px);top:2.9rem;bottom:.1rem;width:2px;background:var(--line)}
.tl li:last-child::after{display:none}
.tl{counter-reset:tl}
.included{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r3);overflow:hidden}
.included li{background:var(--bg);padding:1.5rem;font-weight:500;display:flex;gap:1rem;align-items:flex-start}
.included li::before{content:"";flex:none;width:1.1rem;height:.6rem;margin-top:.5rem;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg)}
@media (min-width:48rem){.included{grid-template-columns:1fr 1fr}}
.demo-note{padding:clamp(1.5rem,3vw,2.5rem);border-radius:var(--r3);background:var(--ink-2);border:1px dashed rgba(255,178,46,.6);display:grid;gap:.75rem;color:var(--text-d)}
.demo-note p{color:var(--muted-d)}

/* À propos */
.team{display:grid;gap:1rem}
.team__c{padding:1.75rem;border-radius:var(--r3);background:var(--paper-3);border:1px dashed var(--field-l);display:grid;gap:1.25rem;align-content:start}
.team__av{width:6rem;height:6rem;border-radius:50%;background:repeating-linear-gradient(45deg,var(--paper-2) 0 8px,var(--paper) 8px 16px);border:1px dashed var(--field-l);display:grid;place-items:center;font:600 .75rem/1.2 var(--f-body);text-align:center;color:var(--muted-l)}
@media (min-width:48rem){.team{grid-template-columns:1fr 1fr}}
.official{display:grid;gap:1rem;padding:clamp(1.5rem,3vw,2.5rem);border-radius:var(--r3);background:var(--ink-2);border:1px solid rgba(238,244,241,.12)}
.official dl{display:grid;gap:1rem 3rem;margin:0}
.official dt{font:600 .75rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:.35rem}
.official dd{margin:0}
@media (min-width:48rem){.official dl{grid-template-columns:repeat(3,auto);justify-content:start}}

/* Contact et formulaire */
.cgrid{display:grid;gap:3rem}
@media (min-width:62rem){.cgrid{grid-template-columns:1.35fr 1fr;gap:5rem;align-items:start}.cgrid aside{position:sticky;top:calc(var(--hdr) + 2rem)}}
.form{display:grid;gap:1.5rem;padding:clamp(1.5rem,3.5vw,3rem);border-radius:var(--r3);background:var(--paper-3);color:var(--text-l);border:1px solid var(--line);box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.form .req-note{font-size:.9375rem;color:var(--muted-l)}
.field{display:grid;gap:.5rem}
.field label,.field legend{font-weight:600;font-size:1rem;line-height:1.3}
.field .hint{font-size:.9375rem;color:var(--muted-l)}
.field input,.field select,.field textarea{width:100%;min-height:3.25rem;padding:.8rem 1rem;font:400 1.0625rem/1.4 var(--f-body);color:var(--text-l);background:#fff;border:1.5px solid var(--field-l);border-radius:var(--r1);transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:9rem;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#0A1513}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:3px solid #0A1513;outline-offset:2px;border-color:#0A1513}
.field.has-err input,.field.has-err textarea,.field.has-err select{border-color:var(--err-l);border-width:2px;background:#FFF6F4}
.field .err{display:none;gap:.5rem;align-items:center;color:var(--err-l);font-weight:600;font-size:.9375rem}
.field.has-err .err{display:flex}
.field .err::before{content:"!";flex:none;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--err-l);color:#fff;display:grid;place-items:center;font-size:.8125rem}
.two{display:grid;gap:1.5rem}
@media (min-width:48rem){.two{grid-template-columns:1fr 1fr}}
.check{display:flex;gap:.9rem;align-items:flex-start;min-height:2.75rem}
.check input{flex:none;width:1.5rem;height:1.5rem;margin:.1rem 0 0;accent-color:#0A1513}
.check label{font-weight:400;font-size:1rem;cursor:pointer}
.check label a{font-weight:600}
.form .btn{justify-self:start}
.form .legal{font-size:.875rem;color:var(--muted-l);line-height:1.55;max-width:60ch}
.alert{display:flex;gap:1rem;padding:1.25rem 1.5rem;border-radius:var(--r2);border:2px solid;font-weight:600;align-items:flex-start}
.alert p{font-weight:400}
.alert strong{display:block;font-family:var(--f-display);font-size:1.25rem;letter-spacing:-.02em;margin-bottom:.25rem}
.alert--err{border-color:var(--err-l);background:#FFF1EE;color:#6E1710}
.alert--err a{color:inherit}
.alert--ok{border-color:var(--ok-l);background:#EAF7EE;color:#0D4727}
.alert__i{flex:none;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 1rem/1 var(--f-display)}
.alert--err .alert__i{background:var(--err-l)}.alert--ok .alert__i{background:var(--ok-l)}
.spinner{width:1.25rem;height:1.25rem;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none;border-right-color:currentColor;opacity:.6}}
.success{display:grid;gap:1.25rem;justify-items:start;padding:clamp(2rem,5vw,4rem);border-radius:var(--r3);background:var(--paper-3);color:var(--text-l);border:1px solid var(--line)}
.success>svg{width:5rem;height:5rem;color:var(--ok-l)}
.success .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1s var(--ease) .1s forwards}
.info{display:grid;gap:2rem}
.info h2{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--light);margin-bottom:.75rem}
.info a{display:inline-flex;align-items:center;min-height:2.75rem}
.info address{font-style:normal}
.next li{display:flex;gap:1rem;align-items:baseline;padding:.85rem 0;border-top:1px solid var(--line)}
.next b{font:700 .875rem/1 var(--f-display);color:var(--light)}
.state-bar{position:fixed;left:50%;bottom:1rem;transform:translateX(-50%);z-index:60;display:flex;flex-wrap:wrap;gap:.25rem;justify-content:center;padding:.35rem;border-radius:var(--pill);background:#0A1513;border:1px solid rgba(238,244,241,.3);box-shadow:0 10px 40px -10px #000;max-width:calc(100vw - 1rem)}
.state-bar span{padding:0 .75rem;display:inline-flex;align-items:center;font:600 .75rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted-d)}
.state-bar a{display:inline-flex;align-items:center;min-height:2.5rem;padding:0 .9rem;border-radius:var(--pill);text-decoration:none;font-weight:600;font-size:.875rem;color:var(--text-d)}
.state-bar a[aria-current=page]{background:var(--light);color:#0A1513}

/* Pages légales */
.doc{display:grid;gap:2.5rem}
@media (min-width:62rem){.doc{grid-template-columns:16rem 1fr;gap:5rem}.doc nav{position:sticky;top:calc(var(--hdr) + 2rem);align-self:start}}
.doc nav ol{display:grid;counter-reset:l}
.doc nav a{display:flex;gap:.75rem;align-items:center;min-height:2.5rem;text-decoration:none;font-size:.9375rem;color:var(--muted-l);transition:color .2s}
.doc nav a::before{counter-increment:l;content:counter(l,decimal-leading-zero);font:600 .75rem/1 var(--f-body);letter-spacing:.1em;color:var(--light-ink)}
.doc nav a:hover{color:var(--text-l)}
.doc article>section{padding:1.75rem 0;border-top:1px solid var(--line)}
.doc h2{font-size:clamp(1.35rem,1.1rem + .9vw,1.85rem);letter-spacing:-.03em;margin-bottom:.75rem}
.doc p{max-width:66ch}
.doc .status{display:inline-flex;margin-top:1.25rem;padding:.35rem .9rem;border:1.5px dashed currentColor;border-radius:var(--pill);font-size:.875rem;font-weight:600}

/* 404 */
.nf{min-height:100svh;display:grid;align-content:center;padding:calc(var(--hdr) + 5rem) 0 4rem;position:relative;overflow:hidden;
  background:radial-gradient(40rem 30rem at 70% 60%,rgba(255,178,46,.16),transparent 65%),radial-gradient(40rem 30rem at 0% 0%,rgba(27,143,134,.3),transparent 65%),var(--ink-1)}
.nf__n{font:700 clamp(7rem,4rem + 22vw,24rem)/.8 var(--f-display);letter-spacing:-.07em;color:transparent;-webkit-text-stroke:2px rgba(238,244,241,.4);display:flex;align-items:center;gap:.02em}
.nf__n .o{display:inline-block;width:.62em;height:.62em;border-radius:50%;background:var(--light);box-shadow:0 0 80px 10px rgba(255,178,46,.55);-webkit-text-stroke:0}
.nf h1{margin-top:2rem}
.nf p{margin-top:1.25rem}
.nf .cta-row{margin-top:2rem}
@media (prefers-reduced-motion:no-preference){.nf__n .o{animation:glow 3.2s ease-in-out infinite alternate}}
@keyframes glow{from{box-shadow:0 0 50px 4px rgba(255,178,46,.35)}to{box-shadow:0 0 110px 20px rgba(255,178,46,.7)}}

/* ---------- 15. Révélations au défilement ---------- */
@media (prefers-reduced-motion:no-preference){
  .js [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
  .js [data-reveal].is-in{opacity:1;transform:none}
  .js [data-reveal="2"]{transition-delay:.1s}.js [data-reveal="3"]{transition-delay:.2s}.js [data-reveal="4"]{transition-delay:.3s}
}

/* ---------- 16. Mouvement réduit (filet global) ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .btn:hover,.card:hover,.situ a:hover{transform:none}
}
@media (forced-colors:active){.btn,.card{border:2px solid ButtonText}.r-line,.r-main{stroke:CanvasText}}

/* ---------- 17. Compléments de page ---------- */
.about-h1{max-width:20ch;font-size:clamp(2.2rem,1rem + 5vw,5.5rem)}
.sigline{margin-top:2rem;font-size:clamp(1.75rem,1rem + 3vw,3.5rem);line-height:1.05;color:var(--light)}
.bigs--3{display:grid}
@media (min-width:62rem){.bigs--3{grid-template-columns:repeat(3,1fr)}}
.legal-status{color:var(--light-hi)}
.phead .phead__art{align-self:center}
.phead__art svg{width:100%;height:auto}
.included li:last-child:nth-child(odd){grid-column:1/-1}
@media (max-width:47.99rem){.state-bar{flex-wrap:nowrap;bottom:.5rem}.state-bar span{display:none}.state-bar a{padding:0 .75rem}}

/* =====================================================================
   18. v2.1 : rythme, hiérarchie des 4 offres, Immersion, formulaire « Vos problèmes »
   ===================================================================== */

/* 18.1 Finesses typographiques et tactiles */
body{font-kerning:normal;-webkit-tap-highlight-color:transparent}
a,button,summary,label{touch-action:manipulation}
.lede,.big p,.step p,.faq .ans{text-wrap:pretty}
.step__n,.card__n,.big b,.next b,.vow__n,.rail__n{font-variant-numeric:lining-nums tabular-nums}
.situ q{quotes:"«\202F" "\202F»"}
.situ q::before{content:open-quote}.situ q::after{content:close-quote}

/* 18.2 Progression de lecture (JS pose --sp) et transition douce entre pages */
.sp{position:fixed;left:0;right:0;top:0;height:3px;z-index:70;background:var(--light);transform:scaleX(var(--sp,0));transform-origin:0 50%;pointer-events:none}
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vt-out .2s var(--ease) both}
  ::view-transition-new(root){animation:vt-in .35s var(--ease) both}
}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(8px)}}

/* 18.3 Rythme : les bandes sont des feuilles qui glissent l'une sur l'autre */
.sec.band,.final.band,.ftr{--sheet:clamp(1.25rem,3.4vw,3rem);border-radius:var(--sheet) var(--sheet) 0 0;margin-top:calc(var(--sheet)*-1)}
.descent + .sec.band{margin-top:0}
.sec{padding-block:clamp(5rem,10vw,10rem)}
.sec__head{gap:1.25rem;margin-bottom:clamp(2.75rem,6vw,5.5rem)}
.sec__head .lede{margin-top:.25rem}

/* 18.4 Titres mot à mot (le texte reste dans le DOM, lu normalement) */
.wd .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.wd .w>span{display:inline-block}
@media (prefers-reduced-motion:no-preference){
  .js .wd[data-reveal]{opacity:1;transform:none;transition:none}
  .js .wd .w>span{transform:translateY(112%);transition:transform .85s var(--ease)}
  .js .wd.is-in .w>span{transform:none}
  .w2>span{transition-delay:.05s!important}.w3>span{transition-delay:.1s!important}.w4>span{transition-delay:.15s!important}.w5>span{transition-delay:.2s!important}.w6>span{transition-delay:.25s!important}
  .w7>span{transition-delay:.3s!important}.w8>span{transition-delay:.35s!important}.w9>span{transition-delay:.4s!important}.w10>span{transition-delay:.45s!important}.w11>span{transition-delay:.5s!important}.w12>span{transition-delay:.55s!important}
}

/* 18.5 En-tête : 7 liens sans CTA entre 62 et 80 rem ; menu mobile soigné */
@media (min-width:62rem){.hdr .btn--cta{display:none}.nav a{padding:0 .7rem;font-size:.9rem}}
@media (min-width:80rem){.hdr .btn--cta{display:inline-flex}.nav a{padding:0 .9rem;font-size:.9375rem}}
.menu__panel{max-height:calc(100svh - 6rem);overflow:auto;overscroll-behavior:contain;counter-reset:mn}
.menu__panel a:not(.btn):not(.menu__alt){counter-increment:mn;gap:.9rem;transition:background-color .2s,color .2s}
.menu__panel a:not(.btn):not(.menu__alt)::before{content:counter(mn,decimal-leading-zero);font:600 .75rem/1 var(--f-body);letter-spacing:.12em;color:var(--teal-300);min-width:1.5rem}
.menu__panel a:not(.btn):not(.menu__alt):hover{background:rgba(238,244,241,.08)}
.menu__alt{display:flex;align-items:center;min-height:3rem;margin-top:.25rem;padding:0 .75rem;color:var(--light);font-weight:600;font-size:.9375rem;text-underline-offset:.22em}

/* 18.6 Étiquette « Nouveau » et chemins (comprendre / imaginer, puis construire) */
.badge{display:inline-flex;align-items:center;gap:.5rem;padding:.38rem .85rem .38rem .7rem;border-radius:var(--pill);background:var(--light);color:#0A1513;font:700 .75rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase}
.badge i{width:.5rem;height:.5rem;border-radius:50%;background:#0A1513}
@media (prefers-reduced-motion:no-preference){.badge i{animation:blink 2.4s ease-in-out infinite}}
@keyframes blink{50%{transform:scale(.55);opacity:.5}}
.card__top{display:flex;align-items:center;justify-content:flex-start;gap:1rem;flex-wrap:wrap}
.card__top .grp{font:600 .75rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted-d)}
.path{grid-column:1/-1;display:flex;align-items:center;gap:1rem;margin-top:1.75rem;font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--acc)}
.path:first-child{margin-top:0}
.path::after{content:"";flex:1;height:1px;background:var(--line)}

/* 18.7 Accueil : 4 offres hiérarchisées */
.offers4{display:grid;gap:1rem}
.offers4 .card{min-height:0}
.card--new{border-color:rgba(255,178,46,.55);background:radial-gradient(30rem 22rem at 100% 0%,rgba(255,178,46,.18),transparent 65%),var(--ink-1)}
.card--lead .card__art{max-width:30rem;margin-top:auto}
.card--row{gap:1.5rem}
.card--row>div{display:flex;flex-direction:column;gap:1.1rem;flex:1}
.card--row .card__art{max-width:11rem;margin:0;align-self:flex-end}
.card--row .link{margin-top:.5rem}
.card--row h3{font-size:clamp(1.5rem,1.1rem + 1.4vw,2.1rem)}
@media (min-width:48rem){
  .offers4{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:62rem){
  .offers4{grid-template-columns:repeat(12,1fr)}
  .offers4 .card--lead{grid-column:span 7;min-height:34rem}
  .offers4 .card--new{grid-column:span 5;min-height:34rem}
  .offers4 .card--row{grid-column:span 6}
}
@media (min-width:75rem){
  .card--row{flex-direction:row;align-items:stretch}
  .card--row .card__art{max-width:12rem;align-self:center}
}
.card__art .n{fill:var(--ink-1);stroke:currentColor}
.phead__art .n{fill:var(--ink-1);stroke:currentColor}
@media (prefers-reduced-motion:no-preference){
  .js .card[data-reveal] .links{opacity:0}
  .js .card[data-reveal].is-in .links{animation:fade .8s var(--ease) 1.1s forwards}
  .js .card[data-reveal] .enter{transform:translate(120px,-70px);opacity:0}
  .js .card[data-reveal].is-in .enter{animation:enter 1.5s var(--ease) .25s forwards}
  .phead--in .enter{animation:enter 1.7s var(--ease) .4s backwards}
  .phead--in .links{animation:fade .9s var(--ease) 1.5s backwards}
  .pulse{transform-origin:160px 104px;animation:pulse 3.4s ease-out 2s infinite}
  .phead--in .ring{transform-origin:160px 104px;animation:turn 90s linear infinite}
}
@keyframes enter{from{transform:translate(120px,-70px);opacity:0}to{transform:none;opacity:1}}
@keyframes pulse{from{transform:scale(1);opacity:.55}to{transform:scale(1.9);opacity:0}}
@keyframes turn{to{transform:rotate(360deg)}}

/* « Une conviction » */
.belief{--fg:var(--text-d);--fg-2:var(--muted-d);--acc:var(--light);--line:rgba(238,244,241,.2);margin-top:clamp(4rem,8vw,7rem);padding:clamp(2rem,5vw,4.5rem);border-radius:var(--r3);background:radial-gradient(40rem 24rem at 100% 100%,rgba(255,178,46,.22),transparent 65%),#0A1513;color:var(--text-d);display:grid;gap:1.5rem}
.belief__t{font:700 clamp(2rem,1rem + 4.8vw,5.25rem)/.98 var(--f-display);letter-spacing:-.045em;max-width:16ch;text-wrap:balance}
.belief__t .serif{color:var(--light)}
.belief__s{display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;align-items:center;color:var(--muted-d)}

/* 18.8 /offres/ : pile de 4, filtres de situation */
@media (min-width:62rem){
  .pile .card:nth-child(4){top:calc(var(--hdr) + 6.5rem)}
  .pile .card{min-height:24rem}
}
.pile .card--new{background:radial-gradient(34rem 24rem at 100% 0%,rgba(255,178,46,.18),transparent 65%),linear-gradient(160deg,var(--ink-3),var(--ink-2) 55%);border-color:rgba(255,178,46,.55)}
.situ li{display:flex}
.situ a{flex:1;position:relative;padding-right:3.5rem}
.situ a i{position:absolute;right:1.25rem;top:1.4rem;width:1.5rem;height:1.5rem;color:var(--light-ink);transition:transform .3s var(--ease),color .3s}
.situ a i svg{width:100%;height:100%}
.situ a:hover i{transform:translateX(4px);color:var(--light)}
@media (min-width:48rem){.situ li:last-child:nth-child(odd){grid-column:1/-1}}
@media (min-width:75rem){
  .situ{grid-template-columns:repeat(6,1fr)}
  .situ li{grid-column:span 2}
  .situ li:nth-child(4),.situ li:nth-child(5){grid-column:span 3}
}
.situ__more{margin-top:2.5rem;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center}
.situ__more p{font:500 clamp(1.125rem,1rem + .6vw,1.4rem)/1.35 var(--f-body);max-width:40rem}
.light .btn--ghost{--b-fg:var(--text-l);border-color:rgba(10,21,19,.45)}
.light .btn--ghost:hover{border-color:#0A1513}

/* détails d'interaction sobres */
.step h3{transition:transform .35s var(--ease)}
.step:hover h3{transform:translateX(.5rem)}
.big{align-content:start;transition:border-color .3s}
.split .eyebrow+.h-l,.split .eyebrow+h2{margin-top:1rem}
.big:hover{border-top-color:var(--acc)}
.ftr__word{transition:-webkit-text-stroke-color .5s}
.ftr__word:hover{-webkit-text-stroke-color:var(--light)}

/* 18.9 Immersion : en-tête, engagements visibles d'emblée */
.phead--in .phead__grid{align-items:center}
.phead__art--in{max-width:36rem}
.vows{display:grid;gap:.75rem;margin-top:clamp(2.5rem,5vw,4.5rem)}
.vows li{display:flex;gap:.9rem;align-items:center;padding:1rem 1.15rem;border-radius:var(--r2);border:1px solid rgba(238,244,241,.18);background:rgba(238,244,241,.05)}
.vows svg{flex:none;width:2.1rem;height:2.1rem;color:var(--light)}
.vows b{font-weight:600}
.vows span{line-height:1.3}
.vows__more{margin-top:.75rem}
@media (min-width:40rem){.vows{grid-template-columns:1fr 1fr}}
@media (min-width:75rem){.vows{grid-template-columns:repeat(4,1fr)}}

.idea__t{max-width:15ch;margin-top:1.25rem}
.idea__t .serif{color:var(--light-ink)}
.idea__cols{display:grid;gap:2rem;margin-top:clamp(2.5rem,6vw,5rem)}
.idea__cols p{border-top:2px solid var(--fg);padding-top:1.25rem;font:500 clamp(1.125rem,1rem + .55vw,1.35rem)/1.5 var(--f-body)}
@media (min-width:62rem){.idea__cols{grid-template-columns:repeat(3,1fr);gap:3rem}}

.duo{display:grid;gap:3.5rem}
.duo .h-l{margin-bottom:1.5rem}
.duo__b .h-l{color:var(--fg-2)}
.ticks--no li::before{width:.8rem;height:.8rem;border-radius:0;transform:translateY(.05em);
  background:linear-gradient(45deg,transparent 42%,var(--fg-2) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--fg-2) 42% 58%,transparent 58%)}
.duo__b .ticks li{color:var(--fg-2)}
@media (min-width:62rem){.duo{grid-template-columns:1fr 1fr;gap:5rem}}

.months{max-width:56rem;margin:0 0 clamp(2.5rem,5vw,4rem)}
.months__bar{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}
.months__bar i{height:.7rem;border-radius:var(--pill);background:var(--acc)}
.months__bar i:nth-child(n+2){background:repeating-linear-gradient(90deg,var(--acc) 0 10px,transparent 10px 16px)}
.months__l{display:grid;grid-template-columns:repeat(3,1fr);margin-top:.7rem;font:600 .8125rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2)}

.frise{position:relative;display:grid}
.frise__i{position:relative;padding:0 0 clamp(2.25rem,4.5vw,3.75rem) 3.25rem}
.frise__i:last-child{padding-bottom:0}
.frise__i::before{content:"";position:absolute;left:0;top:.2rem;width:1.5rem;height:1.5rem;border-radius:50%;border:2px solid var(--acc);background:var(--acc);box-shadow:0 0 0 6px rgba(138,74,0,.16);transition:background-color .4s,border-color .4s,box-shadow .6s}
.frise__i::after{content:"";position:absolute;left:calc(.75rem - 1px);top:1.9rem;bottom:-.1rem;width:2px;background:var(--line)}
.frise__ln{position:absolute;left:calc(.75rem - 1px);top:1.9rem;bottom:-.1rem;width:2px;background:var(--acc);z-index:1;transform-origin:top}
.frise__i:last-child::after,.frise__i:last-child .frise__ln{display:none}
.frise__when{display:block;margin-bottom:.6rem;font:600 .8125rem/1.2 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--acc)}
.frise__b h3{font-size:clamp(1.5rem,1.1rem + 1.7vw,2.5rem);letter-spacing:-.035em;line-height:1.05}
.frise__b p{margin-top:.7rem;max-width:52ch;color:var(--fg-2)}
.frise__tag{display:inline-flex;margin-top:1rem;padding:.4rem .9rem;border:1.5px solid var(--acc);border-radius:var(--pill);color:var(--acc);font:600 .8125rem/1.2 var(--f-body)}
.js .frise__i:not(.is-lit)::before{background:var(--bg);border-color:rgba(10,21,19,.3);box-shadow:none}
.js .frise__ln{transform:scaleY(0);transition:transform .9s var(--ease-io)}
.js .frise__i.is-lit .frise__ln{transform:scaleY(1)}
@media (min-width:48rem){
  .frise__i{padding-left:15rem}
  .frise__i::before{left:11rem}
  .frise__i::after,.frise__ln{left:calc(11.75rem - 1px)}
  .frise__when{position:absolute;left:0;top:.3rem;width:10rem;margin:0;text-align:right}
}

.bigs--5{display:grid}
@media (min-width:62rem){
  .bigs--5{grid-template-columns:repeat(6,1fr)}
  .bigs--5 .big{grid-column:span 2}
  .bigs--5 .big:nth-child(n+4){grid-column:span 3}
}
.deliver__n{margin-top:clamp(2.5rem,5vw,4rem);max-width:46rem;font-size:clamp(1.1rem,1rem + .5vw,1.35rem)}

.charter{display:grid;gap:1rem}
.vow{position:relative;display:grid;gap:.65rem;align-content:start;padding:1.5rem 1.5rem 1.75rem;border-radius:var(--r2);background:var(--paper-3);border:1px solid var(--line);transition:transform .3s var(--ease),border-color .3s}
.vow:hover{transform:translateY(-3px);border-color:var(--fg)}
.vow__n{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;color:var(--acc)}
.vow h3{font-size:clamp(1.35rem,1.1rem + .9vw,1.75rem);letter-spacing:-.03em;line-height:1.1;padding-right:2.5rem}
.vow p{color:var(--fg-2);font-size:1.0625rem}
.vow::before{content:"";position:absolute;right:1.25rem;top:1.25rem;width:1.75rem;height:1.75rem;border-radius:50%;border:2px solid var(--acc)}
.vow::after{content:"";position:absolute;right:calc(1.25rem + .5rem);top:calc(1.25rem + .55rem);width:.75rem;height:.4rem;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg)}
@media (min-width:48rem){.charter{grid-template-columns:1fr 1fr}}
@media (min-width:75rem){.charter{grid-template-columns:repeat(4,1fr)}}
.note--price{margin-bottom:clamp(4rem,8vw,7rem)}

/* 18.10 Formulaire « Vos problèmes » */
.phead__anon{display:inline-flex;align-items:center;gap:.7rem;margin-top:1.75rem;padding:.55rem 1.1rem .55rem .8rem;border:1.5px dashed rgba(255,178,46,.65);border-radius:var(--pill);color:var(--light-hi);font-size:.9375rem;font-weight:500}
.phead__anon svg{width:1.4rem;height:1.4rem;flex:none}
fieldset{border:0;margin:0;padding:0;min-width:0}
.pform{display:grid;gap:clamp(2rem,4vw,3rem);padding:clamp(1.25rem,3.5vw,3rem);border-radius:var(--r3);background:var(--paper-3);color:var(--text-l);border:1px solid var(--line);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);align-content:start}
.pform .req-note{font-size:.9375rem;color:var(--muted-l);margin-top:-1rem}
.pform .btn{justify-self:start;--b-bg:#0A1513;--b-fg:var(--paper)}
.pform .btn svg{color:var(--light)}
.pform .btn:hover{box-shadow:0 10px 40px -10px rgba(10,21,19,.6)}
.opt{font-weight:400;font-size:.875rem;color:var(--muted-l);margin-left:.35rem}
.field legend{padding:0;margin-bottom:.4rem}

.rail__n{flex:none;width:2rem;height:2rem;border-radius:50%;border:2px solid var(--field-l);display:grid;place-items:center;font:700 .9375rem/1 var(--f-display);color:var(--text-l);position:relative;transition:background-color .3s,border-color .3s}


.seg{display:grid;gap:.75rem}
.seg__o{position:relative}
.seg__o input,.chip-o input{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;padding:0;opacity:0;cursor:pointer;z-index:1}
.seg__o label{display:flex;gap:.9rem;align-items:flex-start;min-height:3.5rem;height:100%;padding:.95rem 1.15rem;border-radius:var(--r2);border:1.5px solid var(--field-l);background:#fff;font-weight:400;transition:border-color .2s,background-color .2s,transform .2s var(--ease)}
.seg__o label b{display:block;font-weight:600}
.seg__o label small{display:block;margin-top:.2rem;font-size:.9375rem;line-height:1.4;color:var(--muted-l)}
.seg__dot{flex:none;width:1.4rem;height:1.4rem;margin-top:.1rem;border-radius:50%;border:2px solid var(--field-l);background:#fff;position:relative;transition:border-color .2s}
.seg__dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#0A1513;transform:scale(0);transition:transform .25s var(--ease)}
.seg__o:hover label{border-color:#0A1513}
.seg__o input:active+label{transform:scale(.985)}
.seg__o input:checked+label{border-color:#0A1513;background:var(--paper);box-shadow:inset 0 0 0 1px #0A1513}
.seg__o input:checked+label .seg__dot{border-color:#0A1513}
.seg__o input:checked+label .seg__dot::after{transform:scale(1)}
.seg__o input:focus-visible+label,.chip-o input:focus-visible+label{outline:3px solid #0A1513;outline-offset:3px}
@media (min-width:40rem){.seg{grid-template-columns:repeat(3,1fr)}.seg--big,.seg--sm{grid-template-columns:repeat(2,1fr)}}
.seg--big label{min-height:6.5rem}
.reply{display:grid}

.ctx{display:none}
.ctx--none{display:block}
.ctx--emp,.ctx--boss{gap:.8rem;align-items:flex-start;padding:.9rem 1.1rem;border-radius:var(--r1);background:var(--paper);border-left:4px solid #0A1513;color:var(--text-l)}
.ctx__i{flex:none;width:1.4rem;height:1.4rem;border-radius:50%;background:#0A1513;color:var(--paper);display:grid;place-items:center;font:700 .8125rem/1 var(--f-display)}
.ctx__i::before{content:"i"}

.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.25rem}
.chip-o{position:relative}
.chip-o label{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 1.1rem;border-radius:var(--pill);border:1.5px solid var(--field-l);background:#fff;font-weight:500;font-size:1rem;transition:background-color .2s,color .2s,border-color .2s,transform .2s var(--ease)}
.chip-o:hover label{border-color:#0A1513}
.chip-o input:checked+label{background:#0A1513;color:var(--paper);border-color:#0A1513}
.chip-o input:active+label{transform:scale(.97)}
.bwho{margin-top:1.25rem;display:none;gap:.75rem}

.cfields{display:grid;gap:1.5rem}
.legalbox{display:grid;gap:.55rem;padding:1.25rem 1.4rem;border-radius:var(--r2);background:var(--paper);border:1px solid var(--line);font-size:.9375rem;line-height:1.55;color:var(--muted-l)}
.legalbox h3{font:600 .8125rem/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--text-l);margin-bottom:.25rem}
.check--news{margin-top:.25rem}
.submit{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.btn--submit{min-height:3.75rem;padding-inline:2rem;font-size:1.125rem}
.sub--n{display:none}
.safety{display:flex;gap:.8rem;align-items:flex-start;font-size:.9375rem;color:var(--muted-l)}
.safety__i{flex:none;width:1.4rem;height:1.4rem;border-radius:50%;border:2px solid var(--muted-l);display:grid;place-items:center;font:700 .8125rem/1 var(--f-display)}
.success--pb{max-width:none}
.trust{display:grid;gap:1.25rem}
.trust li{display:flex;gap:1rem;align-items:flex-start;line-height:1.45}
.trust svg{flex:none;width:1.75rem;height:1.75rem;color:var(--light)}
.trust b{display:block;font-weight:600}
.info--pb{gap:2.5rem}

@media (max-width:47.99rem){
  .state-bar{overflow-x:auto;justify-content:flex-start;scrollbar-width:thin;bottom:max(.5rem,env(safe-area-inset-bottom))}
  .state-bar a{flex:none}
}

/* 18.11 Mobile */
@media (max-width:35.99rem){
  .cta-row>.btn{width:100%;justify-content:center}
  .hero{padding-top:calc(var(--hdr) + 5.5rem)}
  .card--lead .card__art,.card--new .card__art{max-width:16rem}
  .final .h-xl{max-width:none}
  .btn--submit{width:100%;justify-content:center}
}
.ftr__low{padding-bottom:max(1rem,env(safe-area-inset-bottom))}
@media (forced-colors:active){.vow,.seg__o label,.chip-o label{border:2px solid ButtonText}.frise__ln{background:Highlight}}

/* correctifs revue 1 */
.field .check input,.check input{min-height:1.5rem;padding:0;border-radius:4px}
.check{align-items:flex-start}
.check label{padding-top:.1rem}
svg .pulse{fill:none}
@media (max-width:47.99rem){
  .card--row{padding-right:1.5rem}
  .card--row .card__art{position:absolute;right:1.25rem;top:1.25rem;max-width:5.25rem;opacity:.9}
  .card--row h3{padding-right:5.5rem}
  .step__n{grid-row:span 2;align-self:start}
}

.legalbox summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.75rem;min-height:2.75rem;font:600 .8125rem/1.2 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--text-l)}
.legalbox summary::-webkit-details-marker{display:none}
.legalbox summary span{font-weight:400;letter-spacing:0;text-transform:none;font-size:.9375rem;color:var(--muted-l)}
.legalbox summary i{margin-left:auto;flex:none;width:2.25rem;height:2.25rem;border-radius:50%;border:1.5px solid var(--field-l);position:relative;transition:transform .3s var(--ease)}
.legalbox summary i::before{content:"";position:absolute;left:50%;top:50%;width:.55rem;height:.55rem;margin:-.4rem 0 0 -.3rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.legalbox[open] summary i{transform:rotate(180deg)}
.legalbox__t{display:grid;gap:.55rem;margin-top:.5rem}
.legalbox{gap:0}
.next li>span{flex:1}
@media (max-width:61.99rem){.info__trust{display:none}}
@media (max-width:61.99rem){.phead__art{max-width:20rem;justify-self:start}.phead__art--in{max-width:24rem}}
.success .lede{color:var(--muted-l)}
.success .btn:not(.btn--ghost){--b-bg:#0A1513;--b-fg:var(--paper)}
.success .btn:not(.btn--ghost) svg{color:var(--light)}
.success .btn--ghost{--b-fg:var(--text-l);border-color:rgba(10,21,19,.45)}
/* v2.2 : affichage conditionnel du formulaire /problemes/ piloté par form.js (classes is-emp, is-reply) : voir live.css */

/* =====================================================================
   19. Espace dirigeant « Offre au résultat » (/espace/) : composants des maquettes design/v2.1/espace/espace.css.
   Jamais .card dans l'espace (cartes marketing) : .pcard, .tpick, .rng, .tot. Aucun style= dans les gabarits.
   ===================================================================== */
.idbar{padding:calc(var(--hdr) + 1rem) 0 .5rem;background:var(--ink-0);color:var(--muted-d);font-size:.875rem}
.idbar a{color:inherit}
.subnav{display:flex;flex-wrap:wrap;gap:.25rem 1rem;align-items:center;padding:.5rem 0;background:var(--ink-0);color:var(--text-d)}
.subnav a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--text-d)}
.es{background:var(--ink-1);color:var(--text-d)}
.es .lead{color:var(--muted-d);margin-bottom:var(--s6)}
.es .sheet{max-width:var(--narrow);margin-inline:auto}
.es .sheet--wide{max-width:60rem}
.es h1{margin-bottom:.5rem;font-size:clamp(2rem,1.4rem + 2vw,3rem)}
.pform .sec-t{font:600 1.25rem/1.2 var(--f-display);letter-spacing:-.02em}
.pform a{color:var(--light-ink)}
.pform a.btn{color:var(--b-fg)}   /* UX M1 : le lien-bouton garde sa couleur de bouton (17:1), pas celle des liens du papier */
.pform .hint,.hint{font-size:.9375rem;color:var(--muted-l)}
.pform fieldset{border:0;padding:0;margin:0;min-width:0}
.pform .field{display:grid;gap:.5rem}
.pform .field label,.pform .field legend{font-weight:600;line-height:1.3}
.pform .field input,.pform .field select,.pform .field textarea{width:100%;min-height:3.25rem;padding:.8rem 1rem;font:400 1.0625rem/1.4 var(--f-body);color:var(--text-l);background:#fff;border:1.5px solid var(--field-l);border-radius:var(--r1)}
.pform .field textarea{min-height:7rem;resize:vertical}
.pform .field input:focus-visible,.pform .field select:focus-visible,.pform .field textarea:focus-visible{outline:3px solid #0A1513;outline-offset:2px}
.pform .field.has-err input{border:2px solid var(--err-l);background:#FFF6F4}
.pform .err{display:none;gap:.5rem;align-items:center;color:var(--err-l);font-weight:600;font-size:.9375rem}
.pform .has-err .err{display:flex}
.pform .err::before{content:"!";flex:none;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--err-l);color:#fff;display:grid;place-items:center;font-size:.8125rem}
.pform .btn--ghost{--b-bg:transparent;--b-fg:var(--text-l);border-color:rgba(10,21,19,.45)}
.pform .btn--ghost svg{color:currentColor}
.pform .why{font-size:.9375rem;color:var(--muted-l)}
.row-btn{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center}

/* Rail à 5 étapes (posé sur le fond sombre de la page) */
.rail5{margin:0 0 var(--s6);color:var(--text-d)}
.rail5 ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem}
.rail5 li{display:grid;justify-items:center;align-content:start;gap:.4rem;text-align:center;font-size:.8125rem;line-height:1.25;color:var(--muted-d);font-weight:600}
.rail5 .rail__n{position:relative;flex:none;width:2rem;height:2rem;border-radius:50%;border:2px solid var(--field-d);display:grid;place-items:center;font:700 .9375rem/1 var(--f-display);color:var(--text-d)}
.rail5 li[aria-current=step]{color:var(--text-d)}
.rail5 li[aria-current=step] .rail__n{background:var(--light);color:#0A1513;border-color:var(--light)}
.rail5 li.is-done{color:var(--text-d)}
.rail5 li.is-done .rail__n{background:var(--ink-3);border-color:var(--light);color:transparent}
.rail5 li.is-done .rail__n::after{content:"";position:absolute;width:.7rem;height:.4rem;border-left:2.5px solid var(--light);border-bottom:2.5px solid var(--light);transform:rotate(-45deg) translate(1px,-1px)}
.rail5__live{font-size:.875rem;color:var(--muted-d);margin-top:var(--s3);text-align:center}
@media (max-width:35.99rem){.rail5 li{font-size:.75rem}}

/* Pastille de type */
.typ{display:inline-flex;align-items:center;gap:.5rem;padding:.3rem .8rem .3rem .45rem;border:1px solid #0A1513;border-radius:var(--pill);font:600 .875rem/1.2 var(--f-body);color:var(--text-l);background:transparent}
.typ svg{width:1.25rem;height:1.25rem;flex:none}

/* Statut : texte + pastille, jamais la couleur seule */
.st{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.9375rem}
.st::before{content:"";width:.6rem;height:.6rem;border-radius:50%;border:2px solid currentColor}

/* Choix du type */
.tpick{display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:36rem){.tpick--many{grid-template-columns:repeat(2,1fr)}}
@media (min-width:64rem){.tpick--many{grid-template-columns:repeat(3,1fr)}}
.tpick__o{position:relative}
.tpick__o input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:1}
.tpick__o label{position:relative;display:grid;gap:.4rem 1rem;grid-template-columns:2.5rem 1fr;align-items:start;min-height:5.5rem;height:100%;padding:1.1rem 1.2rem;border:1px solid var(--muted-l);border-radius:var(--r2);background:#fff;color:var(--text-l)}
.tpick__ic{width:2.5rem;height:2.5rem;border-radius:50%;background:#0A1513;color:var(--paper);display:grid;place-items:center}
.tpick__ic svg{width:1.4rem;height:1.4rem}
.tpick__t{display:block;font:600 1.25rem/1.2 var(--f-display);letter-spacing:-.02em;padding-right:2rem}
.tpick__p{display:block;color:var(--muted-l);font-size:.9375rem;margin-top:.25rem}
.tpick__o:hover label{border-color:#0A1513}
.tpick__o input:focus-visible+label{outline:3px solid #0A1513;outline-offset:3px}
.tpick__o input:checked+label{border:3px solid #0A1513;background:var(--paper-2);padding:calc(1.1rem - 2px) calc(1.2rem - 2px)}
.tpick__o input:checked+label::after{content:"";position:absolute;right:1rem;top:1rem;width:1.5rem;height:1.5rem;border-radius:50%;background:#0A1513}
.tpick__o input:checked+label .tpick__t::after{content:"";display:inline-block;position:absolute;right:1.45rem;top:1.35rem;width:.7rem;height:.4rem;border-left:2.5px solid var(--light);border-bottom:2.5px solid var(--light);transform:rotate(-45deg)}
.tpick--err .tpick__o label{border-color:var(--err-l);border-width:2px}

/* Objectifs */
.obj{border:0;padding:var(--s5);margin:0;border-radius:var(--r2);background:var(--paper-2);display:grid;gap:var(--s5);min-width:0}
.obj>legend{font:600 1.25rem/1.2 var(--f-display);letter-spacing:-.02em;padding:0;float:left;width:100%;margin-bottom:var(--s4)}
.obj>legend+*{clear:both}
.obj.is-locked input,.obj.is-locked textarea{background:var(--paper-2);border-style:dashed}
.obj__lock{display:flex;gap:.6rem;align-items:center;font-size:.9375rem;color:var(--muted-l)}
.obj__lock svg{width:1.25rem;height:1.25rem;flex:none}
.obj [hidden]{display:none}
.row3{display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:36rem){.row3{grid-template-columns:1fr 1fr 1fr}}
.seg2{display:grid;gap:.75rem;grid-template-columns:1fr}
@media (min-width:36rem){.seg2{grid-template-columns:1fr 1fr}}

/* Note « résultat de marché » */
.note{display:flex;gap:.8rem;padding:var(--s4) var(--s5);background:var(--paper-2);border-left:4px solid var(--light-ink);border-radius:var(--r1);font-size:.9375rem}
.note b{flex:none;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--light-ink);color:#fff;display:grid;place-items:center;font:700 .875rem/1 var(--f-body)}

/* Curseur (.rng) : sans JS, seule la saisie libre existe, pleine largeur */
.rng{display:grid;gap:.75rem;border:0;padding:0;margin:0;min-width:0}
.rng__top{display:grid;gap:.25rem}
.rng__lab{font-weight:600;font-size:1.0625rem;padding:0}
.rng__val{display:block;font:700 1.75rem/1.1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;min-height:1.9rem}
.rng.is-unset .rng__val{font-weight:500;color:var(--muted-l)}
.rng__sub{font-size:.9375rem;color:var(--muted-l);min-height:1.4em}
.rng__track,.rng__val,.rng__sub{display:none}
.rng.has-js .rng__track{display:grid;gap:.25rem}
.rng.has-js .rng__val,.rng.has-js .rng__sub{display:block}
.rng input[type=range]{-webkit-appearance:none;appearance:none;width:100%;min-height:2.75rem;height:2.75rem;margin:0;background:transparent;cursor:pointer;--fill:0%;padding:0;border:0}
.rng input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:var(--pill);background:linear-gradient(to right,#0A1513 var(--fill),rgba(10,21,19,.14) var(--fill))}
.rng input[type=range]::-moz-range-track{height:8px;border-radius:var(--pill);background:rgba(10,21,19,.14)}
.rng input[type=range]::-moz-range-progress{height:8px;border-radius:var(--pill);background:#0A1513}
.rng input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-10px;border-radius:50%;background:#0A1513;border:3px solid var(--paper-3);box-shadow:0 0 0 1px #0A1513}
.rng input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#0A1513;border:3px solid var(--paper-3);box-shadow:0 0 0 1px #0A1513}
.rng.is-unset input[type=range]::-webkit-slider-runnable-track{background:rgba(10,21,19,.14)}
.rng.is-unset input[type=range]::-moz-range-progress{background:transparent}
.rng.is-unset input[type=range]::-webkit-slider-thumb{background:var(--paper-3);border-color:#0A1513}
.rng.is-unset input[type=range]::-moz-range-thumb{background:var(--paper-3);border-color:#0A1513}
.rng input[type=range]:focus-visible{outline:3px solid #0A1513;outline-offset:4px;border-radius:var(--r1)}
.rng__bounds{display:flex;justify-content:space-between;gap:1rem;font-size:.875rem;color:var(--muted-l)}
.rng__free{display:grid;gap:.5rem;grid-template-columns:minmax(0,1fr) auto;align-items:end}
.rng__free>label{grid-column:1/-1;font-weight:600;font-size:.9375rem}
.rng__free .unit{display:flex;align-items:center;min-height:3.25rem;font-weight:600;padding-inline:.25rem}
.pform .rng__free select{width:auto;min-width:7.5rem}
.rng.has-err .rng__free input{border:2px solid var(--err-l);background:#FFF6F4}
.rng.has-err .err{display:flex}

/* Barre de total collante */
.tot{position:sticky;bottom:0;z-index:20;display:grid;gap:var(--s3);grid-template-columns:1fr;align-items:center;padding:var(--s4) var(--gut) calc(var(--s4) + env(safe-area-inset-bottom));background:var(--ink-2);color:var(--text-d);border-top:2px solid var(--light)}
.tot__amt{display:block;font:700 2rem/1.05 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.tot__meta{font-size:.9375rem;color:var(--muted-d)}
.tot .btn{justify-self:stretch;justify-content:center}
@media (min-width:36rem){.tot{grid-template-columns:auto 1fr auto;gap:var(--s6)}.tot .btn{justify-self:end}}

/* Cartes de demande (C7) */
.pcards{display:grid;gap:var(--s5);list-style:none;margin:0;padding:0}
.pcard{display:grid;gap:var(--s3);padding:var(--s5);border-radius:var(--r2);background:var(--paper-3);color:var(--text-l);border:1px solid var(--line)}
.pcard h3{font:600 1.375rem/1.2 var(--f-display);letter-spacing:-.02em}
.pcard__n{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:#0A1513;color:var(--paper);font:700 .9375rem/1 var(--f-display);margin-right:.5rem}
.pcard dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem 1rem;margin:0}
.pcard dt{color:var(--muted-l)}
.pcard dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.pcard__act{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}
.pcard a{color:var(--light-ink)}
.ibtn{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:1.5px solid rgba(10,21,19,.45);background:transparent;color:var(--text-l);cursor:pointer}
.ibtn svg{width:1.25rem;height:1.25rem}
.pcard .linkdel{margin-left:auto;color:var(--err-l);font-weight:600;min-height:2.75rem;display:inline-flex;align-items:center}
.addp{display:grid;place-items:center;min-height:5rem;border:2px dashed var(--field-d);border-radius:var(--r2);color:var(--text-d);font-weight:600;text-decoration:none;padding:var(--s4)}
.addp:hover{border-color:var(--light)}
.addp:focus-visible{outline:3px solid var(--focus);outline-offset:3px}

/* Récapitulatif (C9) */
.tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.tbl caption{text-align:left;font:600 1.25rem/1.2 var(--f-display);padding-bottom:var(--s3)}
.tbl th,.tbl td{padding:.9rem .75rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.tbl .num{text-align:right;white-space:nowrap}
.tbl ul{margin:0;padding-left:1.1rem}
.tbl tfoot th,.tbl tfoot td{font-size:1.125rem;border-bottom:0}
@media (max-width:63.99rem){   /* UX B1 : 6 colonnes ne tiennent pas dans la feuille avant 64 rem (la feuille large fait 60 rem) */
 .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .tbl,.tbl tbody,.tbl tfoot,.tbl tr,.tbl th,.tbl td{display:block}
 .tbl tr{padding:var(--s3) 0;border-bottom:1px solid var(--line)}
 .tbl th,.tbl td{border:0;padding:.25rem 0}
 .tbl td[data-label]::before{content:attr(data-label) " : ";color:var(--muted-l)}
 .tbl .num{text-align:left;white-space:normal}
}
.total-big{display:grid;gap:.25rem;padding:var(--s5);border-radius:var(--r2);background:#0A1513;color:var(--text-d)}
.total-big b{font:700 2rem/1.05 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.total-big span{color:var(--muted-d)}
.pay{display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:48rem){.pay{grid-template-columns:repeat(3,1fr)}}
.pay article{padding:var(--s5);border-radius:var(--r2);background:#fff;border:1.5px solid var(--field-l)}
.pay h3{font:600 1.0625rem/1.3 var(--f-body)}
.pay p{font:700 1.5rem/1.2 var(--f-display);font-variant-numeric:tabular-nums;margin-top:.5rem}
.pay small{display:block;color:var(--muted-l);margin-top:.25rem;font-size:.9375rem}
.lvl{padding:var(--s5);border-radius:var(--r2);background:var(--paper-2);border-left:4px solid #0A1513;display:grid;gap:.5rem}
.lvl b{font:600 1.125rem/1.3 var(--f-display)}
.errsum{padding:var(--s4) var(--s5);border:2px solid var(--err-l);background:#FFF1EE;color:#6E1710;border-radius:var(--r2)}
.errsum ul{margin:.5rem 0 0;padding:0;list-style:none}
.errsum a{display:block;min-height:2.75rem;line-height:2.75rem;color:inherit;font-weight:600}

/* Barre collante : le champ ciblé ne doit jamais être masqué (WCAG 2.4.11) */
html{scroll-padding-bottom:9rem}
.pform{grid-template-columns:minmax(0,1fr)}
.pform>*{min-width:0}
.pcard a.btn{color:#0A1513}
.subnav form{display:inline-flex;margin:0}
.subnav .linkbtn{display:inline-flex;align-items:center;min-height:2.75rem;padding:0;border:0;background:none;color:var(--text-d);font:inherit;text-decoration:underline;cursor:pointer}
.subnav a:focus-visible,.subnav .linkbtn:focus-visible{outline:3px solid var(--light-hi);outline-offset:3px}
.pcard__t{display:flex;align-items:center;gap:.25rem}
.pcard ul{margin:0;padding-left:1.1rem}
.pcard form{display:inline-flex;margin:0}
.pcard__act--page{margin-top:var(--s5);display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center}
.pcard__act--page .linkdel{margin-left:0;color:#FFB4A8}
.es .alert{background:var(--paper-3);color:var(--text-l);border-color:var(--light)}
.es .pcard .btn{--b-bg:#0A1513;--b-fg:var(--paper)}
.pform .why{font-size:.9375rem;color:var(--muted-l)}
.err-line{color:var(--err-l);font-weight:600}
.es code{overflow-wrap:anywhere;word-break:break-all;font-size:.85rem}
.es .warns{padding-left:1.25rem}.es .warns li{margin-bottom:.75rem}

/* ---- Revue UX lot 5 ---- */
/* M2 : cibles >= 44 px, 8 px d'écart */
.es .row-btn a:not(.btn),.es .tbl a,.es .pform>p>a:not(.btn),.es .pcard__act--page a:not(.btn){display:inline-flex;align-items:center;min-height:2.75rem}
.es .row-btn{gap:var(--s3) var(--s4)}
/* M3 : repères visibles sous les curseurs, et description des crans */
.rng__ticks{position:relative;height:1.9rem;margin:0}
.rng__tick{position:absolute;top:0;left:var(--p,0%);transform:translateX(-50%);padding-top:.5rem;font-size:.875rem;line-height:1.2;color:var(--muted-l);font-variant-numeric:tabular-nums;white-space:nowrap}
.rng__tick::before{content:"";position:absolute;top:0;left:50%;width:2px;height:.4rem;background:var(--muted-l);transform:translateX(-50%)}
.rng__tick:first-child{transform:none}.rng__tick:first-child::before{left:0;transform:none}
.rng__tick:last-child{transform:translateX(-100%)}.rng__tick:last-child::before{left:auto;right:0;transform:none}
.rng.has-ticks .rng__bounds{display:none}
.rng__scale{display:none;margin:0}
.rng.has-js .rng__scale{display:block}
/* M4 : clauses décisives mises en évidence (gras + filet + fond : jamais la couleur seule) */
.es .warns{list-style:decimal;margin-top:var(--s4)}
.es .warns li::marker{font-weight:700}
.es .warns .warn--key{border-left:4px solid var(--light-ink);background:var(--paper-2);padding:var(--s4) var(--s5);border-radius:var(--r2);font-size:1.0625rem}
.es .warns .warn--key b{font-weight:800}
.es .warns .warn--key+.warn--key{margin-top:var(--s4)}
/* m1 : deux cartes quand il n'y a qu'une demande */
@media (min-width:48rem){.pay--2{grid-template-columns:repeat(2,1fr)}}
/* m3 : une seule ligne utile dans la barre de total sur petit écran */
@media (max-width:35.99rem){.tot .tot__aside{display:none}}

/* ---- Lot 6 : signature (C10, C10b) et suivi (C11) ---- */
.warn__tag{display:inline-block;font:800 .75rem/1 var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--text-l);border:1.5px solid var(--text-l);border-radius:var(--pill);padding:.25rem .6rem;margin-right:.4rem;vertical-align:.1em}
.es .steps{padding-left:1.25rem;display:grid;gap:.6rem}
.timeline{list-style:none;margin:0;display:grid;gap:.9rem;border-left:3px solid var(--field-l);padding:0 0 0 var(--s5)}
.timeline li{position:relative;padding-block:.2rem}
.timeline li::before{content:"";position:absolute;left:calc(-1 * var(--s5) - 10px);top:.45rem;width:1rem;height:1rem;border-radius:50%;border:2px solid #0A1513;background:var(--paper)}
.timeline li.is-done::before{background:#0A1513}
.timeline li[aria-current=step]{font-weight:700}
.pform .check{min-height:2.75rem}
.pform form.pform--in{display:grid;gap:var(--s5)}
.pform .field .check input{width:1.5rem;height:1.5rem;min-height:1.5rem;padding:0;flex:none}   /* la case ne prend pas la largeur des champs texte (débordement à 320 px) */
.check label{min-width:0;overflow-wrap:anywhere}

/* Intégration au site réel : ajouts minimes à v2.css (design v2.1). Aucune ressource distante. */
[hidden]{display:none!important}
.btn__lbl{display:inline-flex;align-items:center;gap:.75rem}
.btn__busy{display:none;align-items:center;gap:.6rem}
.btn.is-busy .btn__lbl{display:none}
.btn.is-busy .btn__busy{display:inline-flex}
.charter__more{margin-top:2.5rem}
/* v2.2 : /problemes/ et /contact/ simplifiés. Affichage conditionnel piloté par form.js (classes is-emp, is-reply, is-anon) : pas de :has(). */
.pform--v22,.form--v22{display:grid;gap:1.5rem}
.pform--v22 fieldset{border:0;padding:0;margin:0;min-width:0}
.only-boss{display:grid;gap:1.5rem}
.pform.is-emp .only-boss{display:none}
.pform--v22 .cfields--v22{display:none}
.pform--v22.is-reply .cfields--v22{display:grid;gap:1.25rem;padding:1.25rem;border-radius:var(--r2);background:var(--paper);border:1px solid var(--line);animation:up .4s var(--ease)}
.pform.is-emp .ctx--emp{display:flex}
.pform.is-emp .newsbox,.pform.is-anon .newsbox{display:none}
.sub--y{display:none}
.sub--n{display:inline}
.pform.is-reply .sub--y{display:inline}
.pform.is-reply .sub--n{display:none}
.check--reply{padding:1rem 1.15rem;border-radius:var(--r2);border:1.5px solid var(--field-l);background:#fff;align-items:center}
.check--reply label{display:grid;gap:.15rem;cursor:pointer;padding-top:0}
.check--reply label small{font-size:.9375rem;color:var(--muted-l)}
.check--reply:has(input:checked){border-color:#0A1513;background:var(--paper)}
.datanote{display:grid;gap:.5rem;padding:1.1rem 1.25rem;border-radius:var(--r2);border:1px solid #0A1513;background:var(--paper);font-size:.9375rem;line-height:1.55;color:var(--muted-l)}
.datanote strong{color:var(--text-l)}
.datanote summary{cursor:pointer;min-height:2.75rem;display:flex;align-items:center;font-weight:600;color:var(--text-l);text-decoration:underline;text-underline-offset:.2em}
.datanote .legalbox__t{display:grid;gap:.55rem;padding-bottom:.5rem}
.legal--v22,.form .legal.legal--v22,.pform .legal.legal--v22{font-size:.9375rem}   /* `.form .legal` (v2.css, .875rem) est plus spécifique : sans ce doublement le texte était calculé à 14 px */
/* Mention IA (Sites, Idées) : détachée du bloc « aucun service d'IA en ligne ne reçoit vos coordonnées » qui la précède */
.legal--ai,.form .legal.legal--ai,.pform .legal.legal--ai{margin:.75rem 0 0;padding-top:.75rem;border-top:1px solid var(--line)}
.field select{width:100%}
@media (prefers-reduced-motion:reduce){.pform--v22.is-reply .cfields--v22{animation:none}}
/* v2.2 : cases à cocher lisibles. Avant, `.field input` (bordure + fond) faisait afficher une case décochée comme remplie (noire). */
.check input[type=checkbox],.pform .field .check input[type=checkbox],.form .field .check input[type=checkbox]{-webkit-appearance:none;appearance:none;width:1.5rem;height:1.5rem;min-height:1.5rem;padding:0;flex:none;border:2px solid #0A1513;border-radius:5px;background:#fff center/1rem no-repeat;cursor:pointer}
.check input[type=checkbox]:checked,.pform .field .check input[type=checkbox]:checked,.form .field .check input[type=checkbox]:checked{background-color:#0A1513;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23F7F5F0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5l3.2 3.2L13 4.8'/%3E%3C/svg%3E")}
.check input[type=checkbox]:focus-visible{outline:3px solid #0A1513;outline-offset:3px}
@media (forced-colors:active){.check input[type=checkbox]{border-color:ButtonText}.check input[type=checkbox]:checked{background-color:Highlight}}
/* v2.3 : à 768 px l'étiquette « Comment nous avez-vous connus ? » passe sur 2 lignes ; on aligne les champs sur le bas de la rangée (sélecteur ciblé : pas d'effet sur nom/e-mail qui portent des erreurs). */
@media (min-width:48rem){.form--v22 .two:has(select),.pform--v22 .two:has(select){align-items:end}}
/* v2.3 : collision de noms. `.note` (v2.css l.974, encart d'app : ligne flex avec pastille) écrasait `.note` marketing de /offres/ et /immersion/ (eyebrow + titre + lede) : le paragraphe devenait une colonne de 120 px et la page débordait de 69 à 99 px à 390 px. On rétablit la mise en page marketing pour les `.note` qui contiennent un .eyebrow ou un .lede. */
.note:has(>.eyebrow,>.lede){display:grid;gap:1rem;padding:clamp(1.5rem,3vw,2.5rem);background:none;border:1px solid var(--line);border-radius:var(--r3);font-size:inherit}
/* Corrections lot 6 (revue UX) : M3 détail relié à la case, M4 liste numérotée N3, M2 engagement près du bouton, impression */
.check-detail{margin:.25rem 0 0;padding-left:2.75rem;max-width:62ch}
.es .steps--num{list-style:decimal;padding-left:1.75rem}
.es .steps--num>li{display:list-item;list-style:decimal;padding-left:.35rem}
.es .steps--num>li::marker{font-weight:800}
.note--inline{display:flex;margin-top:.6rem}
#sign-commit{margin:0}
@media print{
  .es .steps--num,.warn--key{break-inside:avoid}
  body{background:#fff}
  .hdr,.ftr,.es .row-btn,.es form{display:none}
}

/* Logo W-fil (image SVG autonome) */
.brand img{display:block;width:auto;height:2rem}

/* Calculateur */
.calcs{display:grid;gap:2.5rem;max-width:56rem}
.calc{border:0;padding:0;margin:0;display:grid;gap:1.25rem;min-width:0;padding-bottom:2.5rem;border-bottom:1px solid var(--line)}
.calc legend{padding:0;margin-bottom:.5rem}
.calc input[aria-invalid="true"]{border-color:var(--err-l);border-width:2px;background:#FFF6F4}
.calc__err{display:flex}
.calc__err:empty{display:none}
.calc__out{font:600 1.25rem/1.4 var(--f-display);min-height:1.5em}
.calc__out:empty{min-height:0}
.calc__err{color:var(--err-l);font-weight:600;font-size:.9375rem}

/* Calculateur : aides et erreurs lisibles sur fond sombre (revue branding) */
.calcs .hint{color:var(--muted-d)}
.calcs .calc__err{color:var(--err-d)}
.doc .tblwrap{overflow-x:auto}
.doc table.retention{width:100%;border-collapse:collapse;margin:1rem 0 1.25rem;font-size:.9375rem}
.doc table.retention th,.doc table.retention td{text-align:left;vertical-align:top;padding:.7rem .9rem;border-top:1px solid var(--line)}
.doc table.retention th{font-weight:600;border-top:0}
@media (max-width:39.99rem){
.doc table.retention thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.doc table.retention,.doc table.retention tbody,.doc table.retention tr,.doc table.retention td{display:block;width:100%}
.doc table.retention tr{padding:.5rem 0;border-top:1px solid var(--line)}
.doc table.retention td{border:0;padding:.2rem 0}
.doc table.retention td+td::before{content:"Durée : ";font-weight:600}
}

/* S39 revue P0 / confidentialité (revue-ux-p0.md) */
/* P0 : paragraphes de la section finale séparés ; lien « Vous êtes employé… » : l'unique soulignement suit le texte, la flèche reste collée à la dernière ligne */
.sec>.wrap>p+p{margin-top:1.25rem}
.sec>.wrap>p>.link{display:inline;min-height:0;padding-block:.5rem;max-width:34rem;line-height:1.6}
.sec>.wrap>p>.link span{display:inline;background:none;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.25em}
.sec>.wrap>p>.link svg{display:inline-block;vertical-align:-.2em;margin-left:.45rem}
.sec>.wrap>p>.link:hover span{text-decoration-color:transparent}
.sec>.wrap>p>.link:hover svg{transform:translateX(4px)}
.sec>.wrap>p:last-child{margin-top:1.5rem}
/* Confidentialité : lecture mobile plus dense (même texte) */
@media (max-width:39.99rem){
.doc{gap:1.5rem}
.doc article>section{padding:1.1rem 0}
.doc article p{font-size:.9375rem;line-height:1.55}
.doc h2{margin-bottom:.5rem}
.doc nav ol{grid-template-columns:1fr 1fr;column-gap:1rem}
.doc nav a{min-height:2.75rem;font-size:.875rem}
.doc table.retention{margin:.5rem 0 1rem}
.doc table.retention tr{padding:.65rem 0}
.doc table.retention td{font-size:.875rem;line-height:1.45}
.doc table.retention td:first-child{font-weight:600;font-size:.9375rem}
.doc table.retention td+td{color:var(--muted-l)}
.doc table.retention td+td::before{font-weight:600;color:var(--text-l)}
}
/* P0 : le titre « Ce que vous pouvez demander » ne touche plus la carte qui le chevauche */
.sec.light>.wrap>.h-l+.pile{margin-top:1.75rem}

/* S39 / avis legal : sections repliables de la confidentialité (details.fold). Texte intégral dans le HTML ; impression : tout déplié. */
.doc .fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.75rem;min-height:2.75rem}
.doc .fold>summary::-webkit-details-marker{display:none}
.doc .fold>summary h2{margin:0}
.doc .fold>summary i{margin-left:auto;flex:none;width:2.25rem;height:2.25rem;border-radius:50%;border:1.5px solid var(--field-l);position:relative;transition:transform .3s var(--ease)}
.doc .fold>summary i::before{content:"";position:absolute;left:50%;top:50%;width:.55rem;height:.55rem;margin:-.4rem 0 0 -.3rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.doc .fold[open]>summary i{transform:rotate(180deg)}
.doc .fold[open]>summary{margin-bottom:.5rem}
.doc .fold--sub{margin:1rem 0 1.25rem}
.doc .fold--sub>summary{font-weight:600;font-size:.9375rem;margin-bottom:0}
.doc .fold--sub[open]>summary{margin-bottom:.5rem}
@media print{
  .doc .fold>summary i{display:none}
  .doc .fold:not([open])>*:not(summary){display:block}
  .doc nav{display:none}
}
@media print{.doc .fold::details-content{content-visibility:visible;display:block;height:auto}}
.doc article>section,.doc .fold--sub{scroll-margin-top:calc(var(--hdr) + 1rem)}

.sec>.wrap>h2.h-l+p{margin-top:1rem}

/* v2.4 : texte invisible. `.note` (encart sur papier, v2.css l.974) posé dans une bande sombre héritait du texte clair : #EEF4F1 sur #E8E0CD = 1,18:1 (page Générateur d'idées). On fixe le texte foncé : #0A1513 sur #E8E0CD ≈ 14:1. Les `.note` marketing (eyebrow/lede, fond transparent) gardent la couleur de la bande. */
.note:not(:has(>.eyebrow,>.lede)){color:var(--text-l)}

/* v3 : bouton « échange téléphonique » (rdv_button), encart /contact/, suite du calculateur, réassurance, lien Communication. Aucune couleur nouvelle : tout hérite de la bande. */
.rdv{display:grid;gap:.5rem;justify-items:start}
.rdv__sub,.rdv__note,.rdv__phone{margin:0;font-size:.9375rem;line-height:1.5;max-width:60ch}
.rdv a:not(.btn){text-decoration:underline;text-underline-offset:.2em}
.call{display:grid;gap:1rem;justify-items:start;margin-bottom:clamp(2rem,4vw,3rem)}
.call>p{margin:0;max-width:60ch}
.calc__next{display:grid;gap:1rem;justify-items:start;margin-top:2.5rem}
.calc__next>p{margin:0;max-width:60ch}
.form .reassure{margin:0;font-size:.9375rem;color:var(--muted-l)}
.pform .hint--comm{margin:-.75rem 0 0;font-size:.9375rem;color:var(--muted-l);max-width:60ch}
.idea__comm{margin-top:clamp(2rem,4vw,3rem);max-width:60ch}
.subject .chips{margin-top:.25rem}
/* v2.4 : /problemes/ en cartes (maquettes design/v2.4/problemes-*.html). Aucune couleur nouvelle : jetons de v2.css. */
.pcards{display:grid;gap:1.25rem}
.pcards__t{margin:0}
.pcards__l{margin:0;max-width:62ch}
.pform .ctx--cards{display:flex;gap:.8rem;align-items:flex-start;padding:.9rem 1.1rem;border-radius:var(--r1);background:var(--paper);border-left:4px solid #0A1513;color:var(--text-l)}
.pitems{display:grid;gap:1.25rem}
.pitem{display:grid;gap:1.25rem;padding:clamp(1.1rem,3vw,1.75rem);border:1.5px solid var(--field-l);border-radius:var(--r2);background:var(--paper-3);min-width:0;margin:0}
.pitem__head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.pitem__t{font:700 1.25rem/1.2 var(--f-display);letter-spacing:-.02em;padding:0;margin:0}
.pitem__rm{min-height:2.75rem;padding:.5rem 1rem;border:1.5px solid var(--field-l);border-radius:var(--pill);background:#fff;color:var(--text-l);font:600 .9375rem/1.2 var(--f-body);cursor:pointer;text-align:center}
.pitem__rm:hover{border-color:#0A1513}
.pitem__rm:focus-visible,.btn--add:focus-visible{outline:3px solid #0A1513;outline-offset:3px}
.pitem__budget{display:grid;gap:1.25rem;padding-top:1.1rem;border-top:1px dashed var(--field-l)}
.pitem__amt{display:grid;gap:.6rem}
.pform.is-emp .pitem__budget,.pform.is-emp .ptotal,.pform.is-emp .pamounts{display:none}
.money{display:flex;align-items:stretch;max-width:16rem}
.money__u{display:grid;place-items:center;padding:0 .9rem;border:1.5px solid var(--field-l);border-right:0;border-radius:var(--r1) 0 0 var(--r1);background:var(--paper-2);font:600 1rem/1 var(--f-body);color:var(--text-l)}
.field .money input,.pform .field .money input{border-radius:0 var(--r1) var(--r1) 0;min-width:0;font-variant-numeric:tabular-nums;text-align:right}
.pitem__unknown{display:flex;gap:.75rem;align-items:center;min-height:2.75rem}
.pitem__unknown input{flex:none}
.pitem__unknown label{font-size:.9375rem;font-weight:400;cursor:pointer}
.pitem__amt.is-unknown .money{opacity:.55}
.btn--add{display:inline-flex;align-items:center;gap:.6rem;min-height:3rem;padding:.7rem 1.3rem;border:2px dashed #0A1513;border-radius:var(--pill);background:transparent;color:var(--text-l);font:600 1rem/1.2 var(--f-body);cursor:pointer;justify-self:start}
.btn--add:hover{background:var(--paper-2);border-style:solid}
.btn--add svg{width:1.1rem;height:1.1rem}
.btn--add[disabled]{opacity:.5;cursor:not-allowed}
.addrow{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.25rem}
.addrow .hint{margin:0;font-size:.9375rem;color:var(--muted-l)}
.addrow .hint:empty{display:none}
.pamounts{margin:0;font-size:.9375rem}
.ptotal{display:grid;gap:.25rem;padding:1rem 1.15rem;border-radius:var(--r2);background:var(--paper);border:1px solid #0A1513;font-size:.9375rem;color:var(--text-l)}
.ptotal:empty{display:none}
.pitem .field.has-err input,.pitem .field.has-err textarea{border-color:var(--err-l);border-width:2px;background:#FFF6F4}
.pitem .field.has-err .err{display:flex}
@media (max-width:30rem){.pitem__head{flex-wrap:wrap}}

/* v2.5 : /rdv/ auto-hébergé (créneaux libres lus côté serveur). Aucune couleur nouvelle. */
.alert--info{border-color:#0A1513;background:var(--paper-2);color:var(--text-l)}
.rdv-audience{margin:0 0 1.5rem;max-width:62ch}
.rdvform{display:grid;gap:1.5rem;max-width:44rem}
.rdvform[hidden]{display:none}
.rdv-slots{display:grid;gap:1rem;border:0;padding:0;margin:0;min-width:0}
.rdv-slots legend{padding:0;margin-bottom:.5rem}
.rdv-pick{display:grid;gap:1.1rem}
.rdv-pick .lbl{display:block;font-weight:600;margin-bottom:.35rem}
.rdv-pick .chips{max-height:15rem;overflow:auto;padding:.25rem}
.rdv-chosen{margin:0;font-weight:600}
.rdv-chosen:empty{display:none}
.rdv-slots.has-err .err{display:flex}
.rdv-slots .err{display:none;gap:.5rem;align-items:center;color:var(--err-l);font-weight:600;font-size:.9375rem}
.rdvform.is-nosl>*:not(.rdv-slots):not(#form-summary){display:none}
.rdv__phone{margin:1.5rem 0 0;max-width:62ch}
/* Demande d'Immersion (?depuis=immersion) : prix fixe, pas de budget par carte ; complément d'excellence (saisie libre, sans valeur ni exemple). */
.pform.is-imm .pitem__amt,.pform.is-imm .ptotal,.pform.is-imm .pamounts{display:none}
.excel{display:grid;gap:.75rem;margin:0;padding:1.1rem 1.25rem;border:1.5px solid var(--field-l);border-radius:var(--r2);background:var(--paper-3);min-width:0}
.excel[hidden]{display:none}
.excel legend{padding:0 .4rem;font:700 1.125rem/1.2 var(--f-display)}
.excel__row{display:flex;align-items:stretch;gap:.75rem;flex-wrap:wrap}
.excel__row input{max-width:12rem;font-variant-numeric:tabular-nums;text-align:right}
.excel__u{display:grid;align-items:center;font-weight:600}
.excel__note{margin:0;font-size:.9375rem}
.excel.has-err .err{display:flex}
/* V1.0 · revue UX v2.3 point 4 : bloc replié « Précisions (facultatif) » de /contact/ */
.more{border-top:1px solid var(--field-l);border-bottom:1px solid var(--field-l)}
.more>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;min-height:2.75rem;font-weight:600;color:var(--text-l)}
.more>summary::-webkit-details-marker{display:none}
.more>summary .opt{font-weight:400}
.more>summary i{margin-left:auto;flex:none;width:1.75rem;height:1.75rem;border-radius:50%;border:1.5px solid var(--field-l);position:relative;transition:transform .3s var(--ease)}
.more>summary i::before{content:"";position:absolute;left:50%;top:50%;width:.45rem;height:.45rem;margin:-.32rem 0 0 -.25rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.more[open]>summary i{transform:rotate(180deg)}
.more__in{padding:.25rem 0 1rem}
@media (prefers-reduced-motion:reduce){.more>summary i{transition:none}}

/* V1.0 · lot 17 S67 : critères de résolution (.crit, .ptpl, .sent), champ de montant (.amt). Jetons de v2.css seulement, aucune couleur nouvelle.
   Les maquettes v2.5 (S71) n'existent pas encore : partie à relire par le designer. */
.crits{display:grid;gap:var(--s4)}
.crits__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s4)}
.crits__none{margin:0;padding:var(--s4) var(--s5);background:var(--paper-2);border-left:4px solid var(--light-ink);border-radius:var(--r1)}
li.crit,article.crit{display:grid;gap:var(--s2);padding:var(--s5);border:1px solid var(--field-l);border-left-width:4px;border-radius:var(--r2);background:#fff;color:var(--text-l)}
li.crit h3,article.crit h4{margin:0;font:600 1.25rem/1.2 var(--f-display);letter-spacing:-.02em}
li.crit p,article.crit p{margin:0}
li.crit--confirmed,article.crit--ok{border-left-color:var(--ok-l)}
li.crit--to_confirm,li.crit--incomplete{border-left-color:var(--light-ink)}
li.crit--legacy,article.crit--ko{border-left-color:var(--err-l)}
li.crit--locked{border-style:dashed;border-left-style:solid;background:var(--paper-2)}
.crit__state b{display:inline-flex;align-items:center;min-height:1.75rem;padding:.1rem .8rem;border:1.5px solid currentColor;border-radius:var(--pill);font:600 .875rem/1.3 var(--f-body)}
li.crit--confirmed .crit__state b{color:var(--ok-l);background:#EAF7EE}
li.crit--to_confirm .crit__state b,li.crit--incomplete .crit__state b{color:var(--text-l);background:var(--paper-2);border-color:var(--light-ink)}
li.crit--legacy .crit__state b{color:#6E1710;background:#FFF1EE;border-color:var(--err-l)}
li.crit a,.crit__rm,.crits .linkdel{display:inline-flex;align-items:center;min-height:2.75rem}
.crits .linkdel,.crit__rm{color:var(--err-l);font-weight:600}
.crits .addp{color:var(--text-l);border-color:var(--field-l);text-decoration:none}
.crits .addp:hover{border-color:var(--text-l)}
.crit__g{display:grid;gap:var(--s4);padding-top:var(--s5);border-top:1px solid var(--line)}
.crit__g[hidden],.pform .field[hidden]{display:none}
.crit__g>legend{float:left;width:100%;margin:0 0 var(--s2);padding:0}
.crit__g>legend+*{clear:both}
.crit__ex{padding:var(--s3) var(--s4);background:var(--paper-2);border-radius:var(--r1);font-size:.9375rem}
.crit__ex summary{cursor:pointer;display:flex;align-items:center;min-height:2.75rem;font-weight:600}
.crit__ex ul{margin:.25rem 0 .75rem;padding-left:1.25rem}
.crit__ater{display:grid;gap:var(--s3);padding:var(--s4) var(--s5);background:var(--paper-2);border-left:4px solid var(--light-ink);border-radius:var(--r1)}
.crit__ater h2{margin:0}
.crit__rm{background:none;border:0;padding:0 .25rem;justify-self:start;font-family:inherit;font-size:.9375rem;text-decoration:underline;cursor:pointer}
.crit__rm:focus-visible,.crit__add:focus-visible{outline:3px solid #0A1513;outline-offset:3px}
.crit__add{justify-self:start}
.ptpl-family{display:grid;gap:var(--s3);margin-bottom:var(--s5)}
.ptpl{display:grid;gap:.4rem;padding:1.1rem 1.2rem;border:1px solid var(--muted-l);border-radius:var(--r2);background:#fff;color:var(--text-l)}
.ptpl__t{margin:0;font:600 1.25rem/1.2 var(--f-display);letter-spacing:-.02em}
.ptpl .hint{margin:0}
.ptpl:hover{border-color:#0A1513}
.ptpl:focus-within{outline:3px solid #0A1513;outline-offset:3px}
.ptpl.is-on{border:3px solid #0A1513;background:var(--paper-2);padding:calc(1.1rem - 2px) calc(1.2rem - 2px)}
.tpick--err{border:2px solid var(--err-l);border-radius:var(--r2);padding:var(--s4)}
.sent,.resolved{display:grid;gap:var(--s3);padding:var(--s5);background:#fff;border-left:4px solid var(--light-ink);border-radius:var(--r1);color:var(--text-l)}
.sent h2,.resolved h2,.resolved h3,.sent p,.resolved p{margin:0}
.sent__text{font-size:1.0625rem;line-height:1.6}
.sent__text--pending{color:var(--muted-l)}
.sent__warns{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2);font-size:.9375rem}
.sent__warns li{padding:var(--s2) var(--s3);background:var(--paper-2);border-radius:var(--r1)}
.sent__foot{font-size:.9375rem}
.pill{display:inline-flex;align-items:center;padding:.05rem .65rem;border:1.5px solid var(--light-ink);border-radius:var(--pill);background:var(--paper-2);color:var(--text-l);font:600 .8125rem/1.5 var(--f-body)}
/* Champ de montant à côté du curseur : champ visible en permanence, suffixe visible, 44 px au moins. Sous 56 rem : champ sous le curseur. */
.amt{align-items:end}
.amt input{min-height:2.75rem;font-variant-numeric:tabular-nums}
.amt .unit{color:var(--muted-l)}
@media (min-width:56rem){
  .rng.has-js:has(.amt){grid-template-columns:minmax(0,1fr) 15rem;column-gap:var(--s6);align-items:start}
  .rng.has-js:has(.amt)>*{grid-column:1}
  .rng.has-js:has(.amt)>.amt{grid-column:2;grid-row:1/span 3}
}
@media (prefers-reduced-motion:reduce){.ptpl,.crit__g{transition:none}}
/* V1.0 · lot 17 S68 : /problemes/ v1.5 (famille, état actuel, objectif, constat, échéance ; aide de « résolu » par rôle ; exemples ; note « indicatif »). Jetons existants. */
.only-emp{display:none}
.pform.is-emp .only-emp{display:block}
.pform.is-emp .boss-i{display:none}
.pitem__more{display:grid;gap:1.25rem;padding-top:1.1rem;border-top:1px dashed var(--field-l)}
.pitem__ex{margin:0;padding:.6rem .9rem;border-left:4px solid var(--light-ink);background:var(--paper-2);border-radius:var(--r1);color:var(--text-l)}
.pitem__exs{font-size:.9375rem}
.pitem__exs summary{cursor:pointer;display:flex;align-items:center;min-height:2.75rem;font-weight:600}
.pitem__exs ul{margin:.25rem 0 .5rem;padding-left:1.25rem}
.prequal{max-width:62ch;margin:0}
/* V1.0 · corrections de la revue design (2026-10-15). Appliquées telles que proposées par le designer ; à recapturer (1440 / 768 / 390). */
/* M-1 : radios. `color-scheme: dark` rendait les radios natifs en disques pleins ; même style que les cases à cocher (v2.2). */
.check input[type=radio],.pform .field .check input[type=radio]{-webkit-appearance:none;appearance:none;width:1.5rem;height:1.5rem;min-height:1.5rem;padding:0;flex:none;border:2px solid #0A1513;border-radius:50%;background:#fff;cursor:pointer}
.check input[type=radio]:checked{background:radial-gradient(circle,#0A1513 0 45%,#fff 50%)}
.check input[type=radio]:focus-visible{outline:3px solid #0A1513;outline-offset:3px}
@media (forced-colors:active){.check input[type=radio]{border-color:ButtonText}.check input[type=radio]:checked{background:Highlight}}
/* M-2 : alertes à plusieurs enfants (porte de génération, délai) : empilées, jamais en colonnes (`.alert{display:flex}` de v2.css). */
#gate,#criteria-delay{display:grid;gap:var(--s3);align-items:start}
#gate ul,#criteria-delay ul{margin:0;padding-left:1.1rem}
/* M-3 : récapitulatif C9, colonne « Ce que « résolu » veut dire » (phrase de 700 caractères) et colonnes courtes. */
@media (min-width:64rem){.tbl td[data-label^="Ce que"]{min-width:9rem;width:30%}}
@media (min-width:80rem){.tbl td[data-label^="Ce que"]{min-width:22rem;width:46%}}
@media (min-width:56rem){.tbl td[data-label="Délai"],.tbl td[data-label^="Date"]{white-space:nowrap}.tbl td[data-label^="Ce que"] .sent__text{font-size:.9375rem;line-height:1.5}}
/* m-1 : l'alerte d'erreur reste rouge dans l'espace client (`.es .alert` de v2.css l'écrasait). */
.es .alert.alert--err{border-color:var(--err-l);background:#FFF1EE;color:#6E1710}
/* m-2 : le titre de page passe devant les titres de section (même taille avant). */
.pform h1.sec-t{font-size:1.75rem;line-height:1.15}
/* m-5 : « Ce que vous payez » collé aux cartes. */
.es .pay{margin-top:var(--s3)}
/* m-6 : espacement régulier des options d'une carte de modèle. */
.ptpl .check{min-height:2.75rem;margin:0}
.ptpl .hint{margin-bottom:var(--s2)}

/* V1.1 : formulaires par offre (/contact/) et tronc commun (réponse, téléphone, créneau). Jetons existants uniquement. */
.oblocks{display:grid;gap:1.5rem}
.oblock{display:grid;gap:1.5rem;min-width:0}
.oblock__lede{margin:0;color:var(--muted-l)}
.oblock__next{margin:0}
.ostep{display:block;min-width:0;margin:0;padding:1rem 0 0;border:0;border-top:1px solid var(--field-l)}
.ostep__t{float:left;width:100%;margin:0 0 1.5rem;padding:0;font:700 1.0625rem/1.3 var(--f-display);color:var(--text-l)}
.ostep__t+*{clear:both}
.ostep__in{display:grid;gap:1.5rem;min-width:0}
.tronc{display:grid;gap:1.25rem}
.tronc__t{margin:1rem 0 0}
.oblock .chip-o label,.tronc .chip-o label{height:auto;min-height:2.75rem;padding:.55rem 1.1rem;line-height:1.3}
.oblock .field[hidden],.tronc .field[hidden],.chip-o[hidden]{display:none}

/* V1.1 passe B : parcours en 4 étapes de « Site ou outil sur mesure », coordonnées en fieldset, résumé d'erreurs en liste, corps de champ à 1 rem. Jetons existants uniquement. */
.tronc-fs{display:block;min-width:0;margin:0;padding:0;border:0}
.tronc-fs>.tronc__t{float:left;width:100%;margin:1rem 0 1.25rem;padding:0}
.tronc-fs>.tronc__t+*{clear:both}
.ostep__t:focus,.tronc__t:focus{outline:3px solid #0A1513;outline-offset:4px}
.oblock__req{color:var(--text-l)}
.submit--steps{gap:.75rem 1rem}
.submit--steps .stepcount{margin:0;flex:1 0 100%;font-weight:600;color:var(--text-l)}
.submit--steps .btn[type=button]{min-height:2.75rem}
#form-summary strong{font-size:1.0625rem;margin-bottom:.5rem}
#form-summary ul{list-style:none;margin:0;padding:0;display:grid;gap:0}
#form-summary a{display:flex;align-items:center;min-height:2.75rem;padding-block:.25rem;text-decoration:underline;text-underline-offset:.2em}
.field .err,.pform .err{align-items:flex-start}
.form .field input,.form .field textarea,.form .field select,.pform .field input,.pform .field textarea,.pform .field select{font-size:1rem}

/* V1.1 passe B (C8d, C9) : invitation à confirmer un critère complet. Ce n'est pas une erreur : bandeau neutre (`.alert--warn`), case mise en évidence (`.check--todo`). */
.alert--warn{border-color:var(--light-ink);border-left-width:.5rem;background:var(--paper-2);color:var(--text-l)}
.alert--warn a{color:inherit}
.check--todo{padding:.75rem 1rem;border:2px solid var(--light-ink);border-radius:var(--r1);background:var(--paper-3)}
.check--todo{flex-wrap:wrap}
.check--todo .check-detail{flex:1 1 100%;margin:.5rem 0 0;padding-left:2.4rem;font-weight:600}

/* V1.1 passe D : bloc « Être rappelé(e) », bandeau d'avertissement, en-tête de l'espace à petite largeur. */
.callback{margin-top:2.5rem}
.callback>*+*{margin-top:1rem}
.callback>h2{margin-bottom:.75rem}
.callback .alert{margin:0 0 1rem}
.alert--warn ul{margin:0;padding:0;list-style:none}
@media (max-width:30rem){
  .subnav{gap:.25rem 1rem}
  .subnav a,.subnav .linkbtn{min-height:2.75rem}
  .callback__sep{display:none}
  .callback__chg{display:block}
}
.field .phone-read{margin:0;font-size:.9375rem;line-height:1.45;color:var(--text-l);overflow-wrap:anywhere}
.field .phone-read:not(.is-on){margin-top:-.5rem}
.phone-read span{display:block;text-wrap:pretty}
.field .phone-read.is-on{font-weight:600;margin-top:.5rem}
.field .phone-read.is-on #phone-read-f{font-weight:400}
.phone-read span:empty{display:none}