/* Legal Rescue, the site. Home page as validated on 13/11/2026 (v12), then the inner pages. Home layout, as a path: hero (one stamped word in the title), situations (a stage where each fiche rises over the previous one), what Legal Rescue does, three steps, who we are, last band, footer. One sentence per block. */
:root{
  --red:#B3261E; --red-d:#951E17; --red-l:#FF6A55; --ink:#16151B; --paper:#FFFFFF; --sheet:#F3F2EF; --kraft:#D9C29A; --kraft-d:#BFA272; --kraft-dd:#A88A5B; --kraft-l:#EFE3CC;
  --pencil:#67646E; --rule:#E2E0DB;
  --grot:"Schibsted Grotesk","Avenir Next","Segoe UI",sans-serif; --cond:"Barlow Condensed","Arial Narrow",sans-serif; color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:var(--grot);font-size:16px;line-height:1.55;margin:0}
p,h1,h2,h3,figure,ul{margin:0}
ul{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible,textarea:focus-visible{outline:2px solid var(--red);outline-offset:3px}
img{max-width:100%;display:block}
.gut{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.in{max-width:1160px;margin:0 auto}
.label{font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
h2{font-weight:900;font-size:clamp(32px,5vw,56px);line-height:1;letter-spacing:-.045em;text-wrap:balance}
.w{display:inline-block}
.stamp{position:relative;color:var(--red);border:3px solid currentColor;outline:1.4px solid currentColor;outline-offset:3.5px;padding:6px 14px 7px;transform:rotate(-3deg);font-family:var(--cond);text-transform:uppercase;letter-spacing:.07em;display:inline-flex;flex-direction:column;align-items:center;gap:2px;text-align:center;line-height:1.05}
.stamp small{font-size:11.5px;font-weight:600}
.stamp strong{font-size:28px;font-weight:700;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.stamp .rule{align-self:stretch;border-top:1.4px solid currentColor;margin:2px 0}
/* header: transparent on the photo, white once you scroll */
.hdr{position:fixed;top:0;left:0;right:0;z-index:40;color:#fff;transition:background .25s,color .25s,box-shadow .25s}
.hdr .in{display:flex;align-items:center;justify-content:space-between;height:70px;gap:16px}
.hdr .lg{height:26px;position:relative;display:block}
.hdr .lg .l2{position:absolute;inset:0;opacity:0;transition:opacity .25s}
.hdr .lg .l1{transition:opacity .25s}
.hdr.solid{background:#fff;color:var(--ink);box-shadow:0 1px 0 var(--rule)}
.hdr.solid .lg .l1{opacity:0}.hdr.solid .lg .l2{opacity:1}
.nav{display:flex;align-items:center;gap:6px;font-size:15px}
.nav>button,.nav>a{border:0;background:transparent;padding:9px 12px;border-radius:10px;display:inline-flex;align-items:center;gap:6px;font-weight:500}
.nav>button:hover,.nav>a:hover{background:rgba(255,255,255,.14)}
.hdr.solid .nav>button:hover,.hdr.solid .nav>a:hover{background:var(--sheet)}
.nav>button[aria-expanded="true"] svg{transform:rotate(180deg)}
.space{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:6px 14px 6px 7px;font-weight:700;font-size:14.5px;transition:border-color .2s,background .2s}
.hdr.solid .space{border-color:var(--rule)}
.space:hover{background:rgba(255,255,255,.14)}
.hdr.solid .space:hover{background:var(--sheet)}
.space i{width:26px;height:20px;border-radius:3px 6px 2px 2px;background:var(--kraft);display:inline-block;position:relative}
.space i::after{content:"";position:absolute;left:0;top:-4px;width:12px;height:5px;background:var(--kraft-d);border-radius:2px 2px 0 0}
.burger{display:none;border:1px solid currentColor;background:transparent;border-radius:10px;width:42px;height:42px;align-items:center;justify-content:center;opacity:.9}
@media (max-width:900px){.nav{display:none}.burger{display:inline-flex}.hdr .right{display:flex;gap:8px;align-items:center}}
.right{display:flex;align-items:center;gap:10px}
.mspace{display:none}
@media (max-width:900px){.mspace{display:inline-flex;padding:6px 7px}.mspace b{display:none}}
/* mega menu */
.mega{position:fixed;left:0;right:0;top:70px;z-index:39;background:#fff;color:var(--ink);box-shadow:0 30px 60px -30px rgba(0,0,0,.35);border-top:1px solid var(--rule);display:none}
.mega.on{display:block}
.mega .in{display:grid;grid-template-columns:repeat(4,1fr) 1.1fr;gap:26px;padding-block:28px 32px}
.mh{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px}
.mcol li a{display:block;padding:6px 0;font-size:15px;border-bottom:1px solid transparent}
.mcol li a:hover{border-color:var(--ink)}
.tools{background:var(--kraft-l);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px}
.tool{display:block;background:#fff;border-radius:10px;padding:10px 12px;transition:transform .15s}
.tool:hover{transform:translateX(3px)}
.tool b{display:block;font-size:15px}.tool small{color:var(--pencil);font-size:13px}
.mega.tools-only .mcol{display:none}
.mega.tools-only .in{grid-template-columns:1fr;max-width:520px;margin-left:auto}
/* phone menu */
.mmenu{position:fixed;inset:0;z-index:50;background:#fff;color:var(--ink);overflow-y:auto;padding:84px max(18px,env(safe-area-inset-right,0px)) 40px max(18px,env(safe-area-inset-left,0px));display:none}
.mmenu.on{display:block}
.mmenu .x{position:fixed;top:14px;right:16px;width:42px;height:42px;border:1px solid var(--rule);border-radius:10px;background:#fff;font-size:22px}
.mmenu .space{border-color:var(--rule);margin-bottom:20px}
.mmenu .mh{margin-top:18px}
.mmenu li a{display:block;padding:9px 0;border-bottom:1px solid var(--rule);font-size:16px}

/* hero: the photo, a title with one stamped word (like RESCUE in the logo), the box to write in, three ways in */
.hero{position:relative;min-height:min(100svh,880px);display:flex;align-items:center;color:#fff;overflow:hidden;padding-block:120px 64px}
.hbg{position:absolute;inset:0;background:#2a2119 url(photos/fleuriste-large.webp) 68% center/cover no-repeat;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,15,12,.88) 0%,rgba(20,15,12,.64) 44%,rgba(20,15,12,.1) 74%,rgba(20,15,12,0) 100%)}
@media (max-width:900px){.hero{align-items:flex-start;padding-block:262px 40px;background:#1d1611}.hbg{bottom:auto;height:330px;background-position:76% 30%;background-size:cover}.hero::after{background:linear-gradient(180deg,rgba(20,15,12,.05) 0,rgba(20,15,12,.12) 200px,#1d1611 330px)}}
.hero .in{position:relative;z-index:2;width:100%}
.htx{max-width:820px;display:flex;flex-direction:column;gap:22px}
h1{font-weight:900;font-size:clamp(38px,4.6vw,62px);line-height:1;letter-spacing:-.045em}
h1 .ln{display:block}
.sw{display:inline-block;font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.94em;color:var(--red-l);border:.065em solid currentColor;outline:.028em solid currentColor;outline-offset:.07em;padding:.02em .16em .03em;line-height:.95;transform:rotate(-2deg);margin:.12em 0 0 .1em;vertical-align:.04em}
.sub{font-size:clamp(17px,2vw,20px);color:rgba(255,255,255,.88);max-width:40ch}
.composer{width:100%;text-align:left;border-radius:26px;background:#fff;color:var(--ink);padding:18px 14px 12px 22px;display:flex;flex-direction:column;gap:6px;box-shadow:0 30px 70px -30px rgba(0,0,0,.75)}
.composer textarea{width:100%;border:0;outline:0;resize:none;background:transparent;font:inherit;font-size:18px;line-height:1.5;min-height:84px;max-height:260px;overflow-y:auto;color:var(--ink)}
.cbar{display:flex;justify-content:space-between;align-items:center;gap:10px}
.cbar span{font-size:13px;color:var(--pencil)}
.composer textarea::placeholder{color:var(--pencil)}
.send{width:46px;height:46px;border-radius:50%;border:0;background:var(--red);color:#fff;display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .15s,transform .15s}
.send:hover{background:var(--red-d);transform:translateY(-1px)}.send:active{transform:scale(.95)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.35);background:rgba(20,15,12,.35);color:#fff;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600;backdrop-filter:blur(6px);transition:background .15s,border-color .15s}
.chips button:hover{background:rgba(255,255,255,.18);border-color:#fff}
.chips button i{width:16px;height:12px;border-radius:2px 4px 0 0;background:var(--kraft);display:inline-block}

/* situations: one stage; each fiche stops, the next one rises and covers it exactly, titles in the same place */
.sit{background:var(--sheet);padding-top:84px}
.sit .head{padding-bottom:28px}
.deck{display:flex;flex-direction:column;gap:30px;padding-bottom:84px}
.card{position:relative;padding-top:34px}
.ctab{position:absolute;top:0;height:36px;display:inline-flex;align-items:center;padding:0 18px;background:var(--kraft);border-radius:12px 14px 0 0;font-family:var(--cond);font-weight:700;font-size:14.5px;letter-spacing:.12em;text-transform:uppercase;color:#4E3B1F;white-space:nowrap;left:0}
.ctab{transition:background .3s,color .3s}
.card.covered{visibility:hidden;transition:visibility 0s .3s}
@media (max-width:600px){.ctab{font-size:12.5px;padding:0 11px;letter-spacing:.08em}}
.cbody{height:100%;background:var(--paper);border-radius:0 22px 22px 22px;border-top:7px solid var(--kraft);display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;padding:28px;box-shadow:0 -10px 34px -22px rgba(0,0,0,.35),0 30px 60px -40px rgba(0,0,0,.5)}
@media (max-width:900px){.cbody{grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:16px;padding:16px}}
.cph{min-height:0}
.cph img{width:100%;height:100%;min-height:300px;object-fit:cover;border-radius:14px}
@media (max-width:900px){.cph{height:clamp(130px,23svh,210px)}.cph img{min-height:0;height:100%}.ctx h3{font-size:26px}}
.ctx{display:flex;flex-direction:column;gap:20px;min-width:0;justify-content:center}
@media (max-width:900px){.ctx{justify-content:flex-start;gap:14px}}
.ctx h3{font-weight:900;font-size:clamp(28px,3.6vw,44px);line-height:1.02;letter-spacing:-.04em;text-wrap:balance}
.tps{border-top:2px solid var(--ink)}
.tps a{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 2px;border-bottom:1px solid var(--rule)}
.tps b{display:block;font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.tps small{display:block;color:var(--pencil);font-size:13.5px}
.sit .intro{color:var(--pencil);font-size:17px;max-width:62ch;margin-top:14px}
@media (max-width:900px){.tps a{padding:8px 2px}.tps b{font-size:15px}.tps small{font-size:12.5px}}
.tps i{font-style:normal;color:var(--red);font-size:20px;flex:none;transition:transform .15s}
.tps a:hover i{transform:translateX(4px)}
.btn-ink{align-self:flex-start;border:0;background:var(--ink);color:#fff;border-radius:12px;padding:13px 20px;font-weight:700;font-size:15.5px;transition:transform .15s,background .15s}
.btn-ink:hover{background:#000;transform:translateY(-1px)}
/* the stage, switched on by the script */
.sit.stack .deck{padding-bottom:0}
.sit.stack .stage{position:relative;height:calc(3 * 100svh)}
.sit.stack .pin{position:sticky;top:0;height:100svh;display:flex;align-items:center;padding-top:76px;padding-bottom:20px}
.sit.stack .deck{position:relative;width:100%;height:min(640px,calc(100svh - 130px))}
.sit.stack .card{position:absolute;inset:0;will-change:transform}
.sit.stack .card .cbody{height:calc(100% - 0px)}
.sit.stack .cbody{overflow:hidden}
@media (max-width:900px){.sit.stack .tps small{display:none}}

/* why */
.why{background:var(--kraft-l);padding-block:90px}
.wgrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
@media (max-width:900px){.wgrid{grid-template-columns:1fr;gap:30px}}
.wtx{display:flex;flex-direction:column;gap:18px}
.wtx p{font-size:18px;color:#4A4650;max-width:44ch}
.checks{display:flex;flex-direction:column;gap:8px}
.checks li{display:flex;gap:10px;font-size:16px}
.checks li::before{content:"✓";flex:none;width:20px;height:20px;border:1.5px solid var(--ink);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;margin-top:2px}
.btn-red{align-self:flex-start;border:0;background:var(--red);color:#fff;border-radius:12px;padding:13px 20px;font-weight:700;font-size:16px;transition:background .15s,transform .15s}
.btn-red:hover{background:var(--red-d);transform:translateY(-1px)}
.folder{position:relative;height:420px;max-width:460px;width:100%;margin:0 auto}
.f-back{position:absolute;left:0;right:0;bottom:0;height:262px;background:var(--kraft-d);border-radius:8px 16px 6px 6px}
.f-sheets{position:absolute;left:16px;right:16px;bottom:214px;height:156px}
.f-sh{position:absolute;left:0;right:0;height:48px;background:#fff;border-radius:6px;box-shadow:0 8px 18px -12px rgba(0,0,0,.45);display:flex;align-items:center;gap:10px;padding:0 14px;font-size:14px}
.f-sh::before{content:"✓";flex:none;width:18px;height:18px;border:1.4px solid var(--ink);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800}
.f-sh b{font-weight:700}
.f-sh.a{bottom:104px}.f-sh.b{bottom:52px}.f-sh.c{bottom:0}
.f-cover{position:absolute;left:0;right:0;bottom:0;height:228px;background:var(--kraft);border-radius:4px 14px 6px 6px;box-shadow:0 -8px 16px -12px rgba(0,0,0,.35)}
.f-cover .el{position:absolute;right:28px;top:0;bottom:0;width:4px;background:#1c1b20;border-radius:2px;opacity:.85}
.f-label{position:absolute;left:20px;right:50px;top:24px;background:#fff;border-radius:4px;padding:11px 13px}
.f-label small{display:block;font-family:var(--cond);font-weight:700;letter-spacing:.14em;font-size:11px;color:var(--pencil)}
.f-label b{display:block;font-size:17px;border-bottom:1.5px solid var(--ink);padding-bottom:2px}
.f-label span{display:block;font-family:var(--cond);font-weight:600;font-size:12px;letter-spacing:.08em;color:var(--pencil);margin-top:6px}

/* steps */
.steps{padding-block:90px}
.steps h2{margin:12px 0 34px}
.sgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.sgrid{grid-template-columns:1fr}}
.scard{border-top:2px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.scard .n{font-family:var(--cond);font-weight:700;font-size:64px;line-height:.9;color:var(--red)}
.scard h3{font-weight:900;font-size:26px;letter-spacing:-.03em;line-height:1.05}
.scard p{color:var(--pencil);font-size:16px}
.mini{margin-top:auto;background:var(--sheet);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:7px;font-size:13.5px}
.mini .me{align-self:flex-start;background:var(--ink);color:#fff;border-radius:12px 12px 12px 4px;padding:8px 11px}
.mini .ok{display:flex;gap:8px;align-items:center}
.mini .ok::before{content:"✓";flex:none;width:16px;height:16px;border:1.4px solid currentColor;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:800}
.mini .two{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mini .two span{background:#fff;border-radius:8px;padding:8px;text-align:center;font-weight:600}

/* about */
.about{background:var(--ink);color:#fff;padding-block:90px}
.about .label{color:var(--red-l)}
.agrid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
@media (max-width:900px){.agrid{grid-template-columns:1fr;gap:28px}}
.about .lead{color:#C9C7D1;font-size:18px;margin-top:18px;max-width:48ch}
.eng{margin-top:26px;display:flex;flex-direction:column;gap:10px}
.eng li{display:flex;gap:12px;font-size:15px;color:#A9A6B2}
.eng b{display:block;color:#fff;font-size:17px}
.eng li::before{content:"✓";flex:none;width:22px;height:22px;border:1.5px solid #fff;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;margin-top:1px}
.agrid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:22px}
.figs{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px}
@media (max-width:900px){.figs{grid-template-columns:1fr}}
.figs div{border-top:1px solid #3A3943;padding-top:10px}
.figs b{display:block;font-family:var(--cond);font-weight:700;font-size:56px;line-height:1;font-variant-numeric:tabular-nums}
.figs span{font-size:14px;color:#A9A6B2}
.figs small{display:block;font-size:12.5px;color:#8E8B98;grid-column:1/-1}
@media (max-width:900px){.agrid img{aspect-ratio:3/2}}

/* last band */
.final{background:var(--kraft);padding-block:84px}
.final .in{max-width:760px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.final h2{color:#2A2016}
.final .fline{color:#4E3B1F;font-size:17px;margin-top:-8px}
.final .composer{box-shadow:none;border:1.5px solid #2A2016}

/* footer */
.ftr{background:var(--ink);color:#C9C7D1;padding-block:44px;font-size:14px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px}
@media (max-width:900px){.fgrid{grid-template-columns:1fr 1fr}.fgrid>div:first-child{grid-column:1/-1}}
.ftr .flg{height:24px;margin-bottom:12px}
.ftr h3{font-family:var(--cond);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#8E8B98;margin-bottom:8px}
.ftr ul{display:flex;flex-direction:column;gap:6px}
.ftr a:hover{color:#fff}
.legal{margin-top:28px;padding-top:16px;border-top:1px solid #2B2933;display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between;color:#8E8B98;font-size:13px}

/* the dossier panel */
.veil{position:fixed;inset:0;z-index:59;background:rgba(22,21,27,.45);opacity:0;pointer-events:none;transition:opacity .3s}
.veil.on{opacity:1;pointer-events:auto}
.cv{position:fixed;z-index:60;top:0;right:0;bottom:0;width:min(580px,100%);background:var(--paper);display:flex;flex-direction:column;box-shadow:-30px 0 60px -30px rgba(0,0,0,.45);transform:translateX(104%);transition:transform .45s cubic-bezier(.2,.8,.2,1);visibility:hidden}
.cv.on{transform:none;visibility:visible}
@media (max-width:760px){.cv{top:auto;left:0;width:100%;height:calc(100% - 18px);border-radius:22px 22px 0 0;transform:translateY(104%)}.cv.on{transform:none}}
.cv-head{background:var(--kraft);padding:calc(14px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) 14px 18px;display:flex;flex-direction:column;gap:10px}
@media (max-width:760px){.cv-head{border-radius:22px 22px 0 0;padding-top:14px}}
.cv-tabrow{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cv-tab{font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#4E3B1F}
.cv-acts{display:flex;gap:8px}
.cv-acts button{border:1px solid rgba(78,59,31,.35);background:rgba(255,255,255,.55);border-radius:10px;height:36px;padding:0 12px;font-size:13.5px;color:#2A2016}
.cv-acts button.x{width:36px;padding:0;font-size:20px;line-height:1}
.cv-label{background:#fff;border-radius:6px;padding:9px 12px}
.cv-label small{display:block;font-family:var(--cond);font-weight:700;letter-spacing:.14em;font-size:11px;color:var(--pencil)}
.cv-label b{display:block;font-size:16px;min-height:22px;border-bottom:1.5px solid var(--ink)}
.boxes{display:flex;gap:6px;flex-wrap:wrap}
.boxes span{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.5);border-radius:999px;padding:4px 10px 4px 5px;font-size:12.5px;color:#4E3B1F;transition:background .3s,color .3s}
.boxes span i{width:16px;height:16px;border-radius:50%;border:1.4px solid currentColor;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:9px;font-weight:800}
.boxes span.ok{background:var(--ink);color:#fff}
.boxes span.ok i::after{content:"✓"}
.cv-body{flex:1;overflow-y:auto;padding:22px 20px;background:var(--paper) linear-gradient(transparent 31px,#EFEDE8 32px) 0 0/100% 32px}
.cv-col{display:flex;flex-direction:column;gap:16px}
.msg{align-self:flex-end;background:var(--ink);color:#fff;border-radius:14px 14px 4px 14px;padding:10px 14px;font-size:15px;max-width:88%;min-height:44px}
.ai{display:flex;flex-direction:column;gap:12px;background:#fff;border-left:3px solid var(--red);padding:2px 0 4px 14px}
.ai .who{font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.srcl{display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.srcl .s{display:flex;gap:8px;align-items:flex-start;transition:opacity .25s}
.srcl .s.wait{opacity:.25}
.srcl .s::before{content:"✓";flex:none;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1.4px solid currentColor;border-radius:50%;font-size:9px;font-weight:800;margin-top:2px}
.ans{font-size:16px;line-height:1.6;min-height:3em}
.stampwrap{padding:4px 0 2px 4px;transition:opacity .25s,transform .25s cubic-bezier(.7,0,.9,.4)}
.stampwrap.hide{opacity:0;transform:scale(1.8) rotate(-12deg)}
.ref{font-family:var(--cond);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.next{display:flex;flex-wrap:wrap;gap:8px;transition:opacity .3s}
.next.hide{opacity:0}
.next button{border:1px solid var(--rule);background:var(--paper);border-radius:999px;padding:7px 13px;font-size:14px}
.next button.law{background:var(--ink);border-color:var(--ink);color:#fff}
.caret{display:inline-block;width:2px;height:1em;background:var(--ink);vertical-align:-2px;margin-left:2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.cv-bot{border-top:1px solid var(--rule);background:var(--paper);padding:10px 16px calc(12px + env(safe-area-inset-bottom,0px))}
.cv-bot .field small{display:block;font-family:var(--cond);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--pencil);margin-bottom:4px}
.cv-bot .row{display:flex;gap:10px;align-items:center;border-bottom:1.5px solid var(--ink);padding-bottom:6px}
.cv-bot textarea{flex:1;min-width:0;border:0;outline:0;resize:none;background:transparent;font:inherit;font-size:16px;min-height:26px;color:var(--ink)}
body.lock{overflow:hidden}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* ================= shared, inner pages ================= */
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body:not(.home) main{padding-top:70px}
button.space{background:transparent;color:inherit;font:inherit;font-weight:700;font-size:14.5px}
.hdr.solid .space{color:var(--ink)}
button.tool{border:0;text-align:left;width:100%;font:inherit;color:var(--ink)}
.tool.all{background:transparent;border:1px dashed var(--kraft-dd)}
.mmenu li button{display:block;width:100%;text-align:left;padding:9px 0;border:0;border-bottom:1px solid var(--rule);background:transparent;font-size:16px}
.mmenu button.space{display:inline-flex;margin-bottom:20px}
.btn-ink,.btn-red,.btn-line{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center}
.btn-ink:focus-visible,.btn-red:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.btn-ink:active,.btn-red:active,.btn-line:active{transform:scale(.98)}
.btn-ink:disabled,.btn-red:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-line{border:1.5px solid var(--ink);background:transparent;color:var(--ink);border-radius:12px;padding:12px 18px;font-weight:700;font-size:15.5px;transition:background .15s,color .15s}
.btn-line:hover{background:var(--ink);color:#fff}
.btn-txt{border:0;background:transparent;padding:10px 4px;font-weight:600;color:var(--pencil);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.btn-txt:hover{color:var(--ink)}
a.law{border-bottom:1px dotted currentColor;white-space:nowrap}
a.law:hover{color:var(--red)}
.crumbs{display:flex;flex-wrap:wrap;gap:6px 8px;font-size:13.5px;color:var(--pencil);margin-bottom:18px}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs span[aria-current]{color:var(--ink);max-width:46ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
a.label:hover{text-decoration:underline;text-underline-offset:3px}
.alead{font-size:clamp(17px,2vw,19px);color:#4A4650;max-width:60ch;margin-top:14px}
.ameta{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:16px;font-family:var(--cond);font-weight:600;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.ameta span+span::before{content:"·";margin-right:16px;color:var(--rule)}
.mh{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px}

/* the head of an inner page: a sheet of paper */
.ahead{background:var(--sheet);padding-block:44px 40px;border-bottom:1px solid var(--rule)}
.ahead h1{font-size:clamp(32px,4.4vw,54px);margin-top:12px;max-width:22ch;text-wrap:balance}
@media (max-width:900px){.ahead{padding-block:26px 28px}.ahead h1{font-size:clamp(30px,8.4vw,40px)}}

/* ================= article ================= */
.alay{background:var(--sheet);padding-bottom:80px}
.agrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}
@media (max-width:1020px){.agrid{grid-template-columns:1fr}.aside{display:none}}
.sheet{position:relative;background:var(--paper);border-radius:0 22px 22px 22px;border-top:7px solid var(--kraft);padding:36px clamp(18px,4.4vw,56px) 40px;margin-top:36px;box-shadow:0 30px 60px -44px rgba(0,0,0,.45)}
.sheet>.ctab{top:-41px;left:0}
.sheet.narrow{max-width:820px;margin-inline:auto}
.prose{font-size:17.5px;line-height:1.7;color:#25232B;max-width:720px}
.prose>*+*{margin-top:1em}
.prose h2{font-size:clamp(25px,2.8vw,32px);line-height:1.12;letter-spacing:-.035em;color:var(--ink);margin-top:1.9em;scroll-margin-top:96px}
.prose h3{font-size:20.5px;font-weight:800;letter-spacing:-.02em;line-height:1.25;margin-top:1.6em;color:var(--ink)}
.prose h4{font-size:17.5px;font-weight:800;margin-top:1.4em}
.prose a{color:var(--red);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prose a:hover{color:var(--red-d);text-decoration-thickness:2px}
.prose strong{font-weight:700;color:var(--ink)}
.prose ul,.prose ol{padding-left:1.25em}
.prose ul{list-style:none;padding-left:0}
.prose ul>li{position:relative;padding-left:22px}
.prose ul>li::before{content:"";position:absolute;left:4px;top:.72em;width:7px;height:7px;background:var(--red);transform:rotate(45deg)}
.prose ol{list-style:decimal}
.prose li+li{margin-top:.45em}
.prose blockquote{border-left:3px solid var(--kraft);background:var(--kraft-l);padding:14px 18px;border-radius:0 12px 12px 0;font-size:16.5px}
.prose .lead{font-size:19px;line-height:1.6;color:var(--ink)}
.prose .lead p+p{margin-top:.7em}
.prose table{border-collapse:collapse;width:100%;font-size:15px;line-height:1.45}
.prose th,.prose td{border-bottom:1px solid var(--rule);padding:10px 12px;text-align:left;vertical-align:top}
.prose th{font-family:var(--cond);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:13px;color:var(--pencil);background:var(--sheet)}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--rule);border-radius:12px}
@media (max-width:600px){.prose{font-size:17px}.prose .lead{font-size:18px}.sheet{border-radius:0 18px 18px 18px;margin-top:38px;padding-top:26px}}
.mtoc{display:none;border:1px solid var(--rule);border-radius:12px;padding:0 14px;background:var(--sheet)}
.mtoc summary{cursor:pointer;padding:12px 0;font-family:var(--cond);font-weight:700;font-size:14px;letter-spacing:.12em;text-transform:uppercase;list-style:none}
.mtoc summary::after{content:"+";float:right;font-size:18px;line-height:1}
.mtoc[open] summary::after{content:"–"}
.mtoc ol,.toc ol,.hnav ol{list-style:none;padding:0;margin:0;font-size:15px}
.mtoc ol{padding-bottom:10px}
.mtoc li a,.toc li a,.hnav li a{display:flex;gap:10px;padding:7px 0;border-top:1px solid var(--rule);line-height:1.35}
.mtoc i,.toc i,.hnav i{font-style:normal;font-family:var(--cond);font-weight:700;color:var(--red);min-width:20px}
.toc li a:hover,.mtoc li a:hover,.hnav li a:hover{color:var(--red)}
.toc li a.on,.hnav li a.on{font-weight:700}
@media (max-width:1020px){.mtoc{display:block}}
.aside{position:sticky;top:94px;display:flex;flex-direction:column;gap:16px;margin-top:36px;max-height:calc(100vh - 110px);overflow-y:auto;scrollbar-width:thin}
.side-card{background:var(--paper);border-radius:16px;padding:18px;border:1px solid var(--rule)}
.side-card.ink{background:var(--ink);color:#fff;border-color:var(--ink)}
.side-card.ink .mh{color:var(--red-l)}
.side-card.ink p{font-size:14.5px;color:#C9C7D1;margin-bottom:14px}
.side-card.ink .btn-red{width:100%}
.side-card .sg{display:block;padding-bottom:10px;border-bottom:2px solid var(--ink)}
.side-card .sg b{display:block;font-size:17px;letter-spacing:-.01em}
.side-card .sg small{color:var(--pencil);font-size:13px}
.side-card ul li a{display:block;padding:7px 0;border-bottom:1px solid var(--rule);font-size:14.5px}
.side-card ul li a:hover{color:var(--red)}
/* the guide's stamp inside the text */
.fiche{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center;background:var(--kraft-l);border-radius:18px;padding:24px;margin:2.2em 0!important}
.fiche .fx{padding:6px 10px}
.fiche .ft{font-size:17px;line-height:1.5;color:#3B2E1A;margin:8px 0 14px;font-weight:600}
.fiche .label{margin:0}
@media (max-width:600px){.fiche{grid-template-columns:1fr;gap:14px;padding:20px}.fiche .fx{justify-self:start}}
.endcta{background:var(--ink);color:#fff;border-radius:20px;padding:28px clamp(18px,3vw,32px);margin-top:48px;display:flex;flex-direction:column;gap:14px}
.endcta h2{font-size:clamp(26px,3vw,34px)}
.endcta p{color:#C9C7D1;max-width:56ch}
.endcta .composer{box-shadow:none}
.endcta .composer textarea{min-height:56px;font-size:17px}
.fam{margin-top:48px}
.fam h2{font-size:clamp(24px,2.6vw,30px);margin-bottom:14px}
.byline{margin-top:32px;padding-top:16px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--pencil)}

/* ================= guide (pillar) ================= */
.phero{background:var(--sheet);padding-block:44px 56px}
.pgrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center}
.ptx h1{font-size:clamp(34px,4.6vw,60px);margin-top:12px;text-wrap:balance}
.plead{font-size:clamp(17px,1.8vw,19.5px);color:#3E3B45;margin-top:18px;max-width:58ch;line-height:1.6}
.plead b{color:var(--ink)}
.doors{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:24px}
.pmeta{margin-top:18px;font-family:var(--cond);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.pph{position:relative}
.pph img{width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:22px}
.pph .pst{position:absolute;left:-18px;bottom:-22px;background:var(--paper);box-shadow:0 18px 40px -20px rgba(0,0,0,.5)}
.pph .pst::before{content:"";position:absolute;inset:-10px;background:var(--paper);z-index:-1;border-radius:6px;transform:rotate(3deg)}
@media (max-width:900px){.phero{padding-top:0}.pgrid{grid-template-columns:1fr;gap:34px}.pph{order:-1;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)))}.pph img{border-radius:0;aspect-ratio:auto;height:230px}.pph .pst{left:16px;bottom:-26px}.pph .pst strong{font-size:24px}.ptx .crumbs{margin-top:10px}}
.hub{background:var(--paper);padding-block:56px 80px}
.hgrid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:52px;align-items:start}
@media (max-width:1020px){.hgrid{grid-template-columns:1fr}.hnav{display:none}}
.hnav{position:sticky;top:94px;display:flex;flex-direction:column;gap:18px}
.hcontent{display:flex;flex-direction:column;gap:64px;min-width:0}
.hsec h2,.part h2{font-size:clamp(28px,3.4vw,42px);margin-top:10px;scroll-margin-top:96px}
.hsec,.part{scroll-margin-top:96px}
.hsec .intro{color:var(--pencil);font-size:17px;max-width:62ch;margin-top:12px}
.plan{margin-top:22px;border-top:2px solid var(--ink)}
.plan a{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:14px 2px;border-bottom:1px solid var(--rule)}
.plan i{font-style:normal;font-family:var(--cond);font-weight:700;font-size:28px;color:var(--red);line-height:1}
.plan b{display:block;font-size:17.5px;letter-spacing:-.01em}
.plan small{display:block;color:var(--pencil);font-size:14.5px;margin-top:2px}
.plan em{font-style:normal;color:var(--red);font-size:20px;transition:transform .15s}
.plan a:hover em{transform:translateX(4px)}
.part{position:relative;background:var(--paper);border-radius:0 22px 22px 22px;border:1px solid var(--rule);border-top:7px solid var(--kraft);padding:28px clamp(18px,3.4vw,36px) 30px}
.ph{display:flex;gap:16px;align-items:flex-start}
.ph i{font-style:normal;font-family:var(--cond);font-weight:700;font-size:58px;line-height:.85;color:var(--red);flex:none}
.ph h2{margin-top:2px}
.answer{font-size:18px;line-height:1.65;color:#2E2C34;margin-top:18px;max-width:66ch}
.answer a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:22px 0 0;border-top:2px solid var(--ink)}
.facts div{padding:12px 14px 12px 0;border-bottom:1px solid var(--rule)}
.facts div+div{padding-left:14px;border-left:1px solid var(--rule)}
.facts dt{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--pencil)}
.facts dd{margin:4px 0 0;font-weight:700;font-size:15.5px;line-height:1.35}
@media (max-width:700px){.facts{grid-template-columns:1fr}.facts div+div{padding-left:0;border-left:0}.ph i{font-size:44px}}
.reads{margin-top:24px}
.reads .tps{border-top-width:1px}
.timeline{list-style:none;padding:0;margin-top:26px;position:relative}
.timeline::before{content:"";position:absolute;left:118px;top:8px;bottom:8px;width:2px;background:var(--kraft)}
.timeline li{display:grid;grid-template-columns:104px 1fr;gap:30px;padding:0 0 26px;position:relative}
.timeline li::after{content:"";position:absolute;left:112px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--paper);border:3px solid var(--red)}
.timeline .when{font-family:var(--cond);font-weight:700;font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--red);line-height:1.15;text-align:right}
.timeline b{display:block;font-size:18px;letter-spacing:-.01em}
.timeline p{color:#3E3B45;font-size:16px;margin-top:4px;max-width:60ch}
.ref{display:inline-block;margin-top:6px;font-family:var(--cond);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
@media (max-width:700px){.timeline::before{left:7px}.timeline li{grid-template-columns:1fr;gap:4px;padding-left:30px}.timeline li::after{left:1px}.timeline .when{text-align:left}}
.rtable{margin-top:22px;overflow-x:auto;border-top:2px solid var(--ink)}
.rtable table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45}
.rtable th,.rtable td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-bottom:1px solid var(--rule)}
.rtable thead th{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--pencil)}
.rtable tbody th{font-weight:800;width:26%}
@media (max-width:700px){.rtable thead{display:none}.rtable tr{display:block;padding:12px 0;border-bottom:1px solid var(--rule)}.rtable th,.rtable td{display:block;border:0;padding:3px 0;width:auto!important}.rtable td::before{content:attr(data-label);display:block;font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--pencil)}}
.tnote{margin-top:12px;font-size:14px;color:var(--pencil)}
.faq{margin-top:22px;border-top:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;padding:16px 2px;font-weight:800;font-size:17.5px;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--cond);font-weight:700;font-size:24px;line-height:1;color:var(--red);flex:none;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--red)}
.faq details>div{padding:0 2px 18px;color:#3E3B45;font-size:16.5px;max-width:70ch}
.srcs{margin-top:18px;display:flex;flex-direction:column;border-top:2px solid var(--ink)}
.srcs li{padding:10px 0;border-bottom:1px solid var(--rule);font-size:15px}
.srcs a{display:inline-flex;gap:8px;align-items:center}
.srcs a::after{content:"↗";color:var(--red)}
.srcs a:hover{color:var(--red)}
.gcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 16px;margin-top:40px}
@media (max-width:900px){.gcards{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.gcards{grid-template-columns:1fr}}
.gcard{position:relative;display:block;padding-top:0}
.gcard .ctab{top:-34px}
.gcard .gb{display:block;background:var(--sheet);border-radius:0 16px 16px 16px;border-top:5px solid var(--kraft);padding:16px;min-height:118px;transition:transform .15s,box-shadow .15s}
.gcard:hover .gb{transform:translateY(-3px);box-shadow:0 20px 40px -26px rgba(0,0,0,.45)}
.gcard b{display:block;font-size:18px;letter-spacing:-.02em}
.gcard small{display:block;color:var(--pencil);font-size:14px;margin-top:4px}
.gcard .ctab{height:32px;font-size:13px}

/* ================= all guides ================= */
.bsearch{position:relative;margin-top:22px;max-width:560px}
.bsearch input{width:100%;font:inherit;font-size:17px;border:1.5px solid var(--ink);border-radius:14px;padding:13px 16px;background:#fff}
.bsearch input:focus{outline:2px solid var(--red);outline-offset:2px}
#bcount{display:block;margin-top:8px;font-size:13.5px;color:var(--pencil);min-height:1em}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.chips a{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:7px 13px;font-size:14px;font-weight:600;transition:border-color .15s}
.chips a:hover{border-color:var(--ink)}
.bwrap{display:flex;flex-direction:column;gap:56px;padding-block:66px 80px}
.bsec{position:relative;scroll-margin-top:90px}
.bhead{position:relative;height:0}
.bhead .ctab{top:-36px}
.bbody{background:var(--paper);border:1px solid var(--rule);border-top:7px solid var(--kraft);border-radius:0 22px 22px 22px;padding:24px clamp(16px,3vw,32px)}
.btop{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:16px}
.btop h2{font-size:clamp(26px,3vw,36px)}
.btop p{color:var(--pencil);margin-top:6px}
@media (max-width:700px){.btop{flex-direction:column;align-items:flex-start}}
.blist small{max-width:70ch}
.more summary{cursor:pointer;padding:14px 2px;font-weight:700;color:var(--red);list-style:none}
.more summary::-webkit-details-marker{display:none}
.more[open] summary{display:none}
.blist li.hide{display:none}
.bsec.hide{display:none}

/* ================= à propos ================= */
.ahero{background:var(--ink);color:#fff;padding-block:52px 64px;position:relative;overflow:hidden}
.ahero .crumbs{color:#8E8B98}.ahero .crumbs span[aria-current]{color:#fff}
.ahero .label{color:var(--red-l)}
.ahero h1{font-size:clamp(34px,5vw,64px);margin-top:12px;max-width:18ch}
.ahero .alead{color:#C9C7D1}
.ahero .ast{color:var(--red-l);position:absolute;right:max(16px,calc((100% - 1160px)/2));bottom:46px}
@media (max-width:900px){.ahero .ast{position:static;margin-top:28px}}
.awrap{display:flex;flex-direction:column;gap:20px;padding-block:56px 80px;max-width:860px}
.asec{padding-block:20px}
.asec h2{font-size:clamp(28px,3.4vw,40px);margin:10px 0 16px}
.does{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:10px}
.does>div{background:var(--sheet);border-radius:18px;padding:22px}
@media (max-width:700px){.does{grid-template-columns:1fr}}
.crosses{display:flex;flex-direction:column;gap:8px}
.crosses li{display:flex;gap:10px;font-size:16px}
.crosses li::before{content:"×";flex:none;width:20px;height:20px;border:1.5px solid var(--red);color:var(--red);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;margin-top:2px}
.afigs{background:var(--ink);color:#fff;border-radius:22px;padding:26px}
.afigs .figs{margin-top:0}
.afigs small{display:block;margin-top:14px;color:#8E8B98;font-size:12.5px}

/* ================= avec un avocat ================= */
.cgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:48px;align-items:start}
@media (max-width:960px){.cgrid{grid-template-columns:1fr;gap:30px}}
.csteps{list-style:none;padding:0;margin-top:26px;display:flex;flex-direction:column;gap:14px}
.csteps li{display:flex;gap:14px}
.csteps .n{font-family:var(--cond);font-weight:700;font-size:40px;line-height:.9;color:var(--red);min-width:26px}
.csteps b{display:block;font-size:17.5px}
.csteps p{color:var(--pencil);font-size:15.5px}
.lead-form{position:relative;background:var(--paper);border-radius:0 22px 22px 22px;border-top:7px solid var(--kraft);padding:26px clamp(18px,3vw,28px) 22px;box-shadow:0 30px 60px -40px rgba(0,0,0,.5);margin-top:36px}
.lead-form>.lf-top>.ctab{top:-41px}
.prog{height:4px;background:var(--rule);border-radius:4px;overflow:hidden}
.prog i{display:block;height:100%;width:33.3%;background:var(--red);transition:width .3s}
.lf-step{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--pencil);margin-top:8px}
.lf-pane{display:none;border:0;padding:0;margin:14px 0 0}
.lf-pane.on{display:block}
.lf-pane legend{font-weight:900;font-size:24px;letter-spacing:-.03em;margin-bottom:14px;padding:0}
.opts{display:flex;flex-direction:column;gap:8px}
.opts.row{flex-direction:row;flex-wrap:wrap;margin-bottom:14px}
.opt{position:relative;display:block;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.opt span{display:block;border:1.5px solid var(--rule);border-radius:12px;padding:12px 14px;font-weight:600;font-size:15.5px;transition:border-color .15s,background .15s}
.opt.sm span{padding:8px 13px;font-size:14.5px;border-radius:999px}
.opt:hover span{border-color:var(--ink)}
.opt input:checked+span{border-color:var(--ink);background:var(--ink);color:#fff}
.opt input:focus-visible+span{outline:2px solid var(--red);outline-offset:2px}
.fld{display:block;margin-top:12px}
.fld>span{display:block;font-size:14px;font-weight:700;margin-bottom:5px}
.fld em{font-style:normal;font-weight:500;color:var(--pencil)}
.fld input,.fld textarea{width:100%;font:inherit;font-size:16px;border:1.5px solid var(--rule);border-radius:12px;padding:12px 14px;background:#fff;color:var(--ink)}
.fld input:focus,.fld textarea:focus{outline:0;border-color:var(--ink)}
.fld input[aria-invalid="true"]{border-color:var(--red)}
.chk{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:14.5px;color:#3E3B45;cursor:pointer}
.chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--red);flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px}
.lf-nav{display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.lf-nav .btn-red{margin-left:auto;min-width:150px}
.lf-err{margin-top:12px;color:var(--red);font-weight:600;font-size:14.5px}
.lf-note{margin-top:14px;font-size:13px;color:var(--pencil)}
.lf-done{text-align:center;padding:26px 0 8px;display:flex;flex-direction:column;align-items:center;gap:18px}
.lf-done p{max-width:40ch;color:#3E3B45}
.cfaq{padding-block:64px 80px}
.cfaq h2{margin-top:10px}

/* ================= legal, 404 ================= */
.legal-p .prose h2{font-size:24px}
.legal-p .alay,.legal-p>.gut{background:var(--sheet);padding-bottom:80px}
.nf .tps{margin:24px 0;max-width:720px}
.nfst{margin-bottom:18px}

/* ================= the dossier panel, live ================= */
.cv-note{font-size:12px;color:var(--pencil);margin-top:6px}
.cv-note a{text-decoration:underline}
.cv-col .msg{align-self:flex-end}
.cv-col .ai .ans p+p{margin-top:.6em}
.cv-col .ai.wait .ans::after{content:"";display:inline-block;width:28px;height:8px;background:radial-gradient(circle,var(--pencil) 2.5px,transparent 3px) 0 50%/10px 8px repeat-x;animation:dots 1s steps(3) infinite}
@keyframes dots{0%{width:8px}100%{width:30px}}
.cv-col .ai .stampwrap{padding-top:6px}
.cv-call{background:var(--kraft-l);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
.cv-call b{font-size:15.5px}
.cv-call p{font-size:14px;color:#4E3B1F}
.cv-call input{width:100%;font:inherit;font-size:16px;border:1.5px solid rgba(78,59,31,.3);border-radius:10px;padding:10px 12px;background:#fff}
.cv-call input:focus{outline:0;border-color:var(--ink)}
.cv-call label.chk{font-size:13px;margin-top:2px}
.cv-call .btn-red{align-self:flex-start}
.cv-call .ok{font-weight:700;color:var(--ink)}
.next button{transition:border-color .15s,background .15s}
.next button:hover{border-color:var(--ink)}
.next button.law:hover{background:#000}
[hidden]{display:none!important}
@media (max-width:600px){.ameta span+span::before{display:none}.ameta{gap:4px 14px}}
@media (max-width:1020px){.hnav{display:none!important}}
main{overflow-x:clip}
.ptx h1{font-size:clamp(32px,3.7vw,52px)}

/* ================= header, footer (14/11 : only what matters) ================= */
.hcta{display:inline-flex;align-items:center;border:0;background:var(--red);color:#fff;border-radius:999px;padding:10px 17px;font-weight:700;font-size:14.5px;transition:background .15s,transform .15s;white-space:nowrap}
.hcta:hover{background:var(--red-d);transform:translateY(-1px)}
.hcta:active{transform:scale(.97)}
.hcta .s{display:none}
@media (max-width:900px){.hdr .hcta{padding:8px 13px;font-size:14px}.hdr .hcta .l{display:none}.hdr .hcta .s{display:inline}}
.nav>a[aria-current],.nav>button[aria-current]{font-weight:700}
.mega .in{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 34px}
.mcol ul{display:flex;flex-direction:column;gap:2px}
.mcol li a{padding:9px 10px;margin:0 -10px;border-radius:10px;border:0!important;transition:background .15s}
.mcol li a:hover{background:var(--sheet)}
.mcol li b{display:block;font-size:15.5px;font-weight:800;letter-spacing:-.01em}
.mcol li small{display:block;color:var(--pencil);font-size:13px;line-height:1.35;margin-top:2px}
.mall{grid-column:1/-1;border-top:1px solid var(--rule);padding-top:14px;font-weight:700;color:var(--red)}
.mall:hover span{display:inline-block;transform:translateX(3px)}
.mmenu .mcta{width:100%;margin-top:22px}
.mmenu .mcta .s{display:none}
.fgrid{grid-template-columns:1.25fr 1.35fr .8fr;gap:32px}
@media (max-width:900px){.fgrid{grid-template-columns:1fr 1fr}.fgrid>.fb{grid-column:1/-1}}
@media (max-width:560px){.fgrid{grid-template-columns:1fr}}
.ftr .fb p{max-width:38ch;margin-bottom:16px}
.ftr .fb .hcta .s{display:none}
.ftr ul.two{display:grid;grid-template-columns:1fr 1fr;gap:6px 20px}
.ftr a.credit{color:#fff;text-decoration:underline;text-underline-offset:3px}
.btn-line.light{border-color:rgba(255,255,255,.6);color:#fff;margin-top:26px}
.btn-line.light:hover{background:#fff;color:var(--ink)}

/* ================= article head on its guide's photo ================= */
.ahead.photo{position:relative;overflow:hidden;background:#1d1611;color:#fff;border-bottom:0;padding-block:58px 66px}
.ahead.photo .abg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}
.ahead.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,15,12,.92) 0%,rgba(20,15,12,.76) 46%,rgba(20,15,12,.32) 100%)}
.ahead.photo .in{position:relative;z-index:2}
.ahead.photo .crumbs{color:rgba(255,255,255,.72)}
.ahead.photo .crumbs a:hover,.ahead.photo .crumbs span[aria-current]{color:#fff}
.ahead.photo .label{color:var(--red-l)}
.ahead.photo h1{color:#fff;max-width:20ch}
.ahead.photo .ameta{color:rgba(255,255,255,.78)}
.ahead.photo .ameta span+span::before{color:rgba(255,255,255,.4)}
.ahead.photo .alead{color:rgba(255,255,255,.86)}
@media (max-width:900px){.ahead.photo{padding-block:34px 44px}.ahead.photo::after{background:linear-gradient(180deg,rgba(20,15,12,.62) 0%,rgba(20,15,12,.86) 100%)}}

/* ================= à propos (14/11 : le problème, pour qui, ce qu'on fait, les sources, l'avocat) ================= */
.ahead.photo.tall{padding-block:72px 84px}
.ahead.photo.tall h1{font-size:clamp(34px,4.8vw,62px);max-width:17ch}
.ahgrid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
.ahead.photo .ast{color:var(--red-l);background:rgba(20,15,12,.35);margin-bottom:8px}
.ahead.photo .doors{margin-top:26px}
.ahead.photo .btn-line.light{margin-top:0}
@media (max-width:900px){.ahgrid{grid-template-columns:1fr;gap:26px}.ahead.photo.tall{padding-block:40px 52px}.ahead.photo .ast{justify-self:start}}
.ab-pb{padding-block:80px;background:var(--paper)}
.ab-pb h2,.ab-who h2,.ab-src h2,.ab-av h2{margin-top:12px;max-width:22ch}
.ab-pb .intro{color:var(--pencil);font-size:18px;max-width:62ch;margin-top:16px}
.pbl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:38px}
@media (max-width:900px){.pbl{grid-template-columns:1fr}}
.pbl li{border-top:2px solid var(--ink);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.pbl b{font-family:var(--cond);font-weight:700;font-size:62px;line-height:.95;color:var(--red);font-variant-numeric:tabular-nums}
.pbl p{font-size:16.5px;color:#2E2C34}
.pbl small{font-family:var(--cond);font-weight:600;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.ab-who{background:var(--sheet);padding-block:80px}
.whos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:34px}
@media (max-width:900px){.whos{grid-template-columns:1fr 1fr}}
.who{position:relative;display:block;border-radius:18px;overflow:hidden;aspect-ratio:4/5;color:#fff;max-width:100%}
.who img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.who::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,15,12,0) 35%,rgba(20,15,12,.88) 100%)}
.who:hover img{transform:scale(1.04)}
.who .wl,.who b{position:absolute;left:16px;right:16px;z-index:2}
.who .wl{top:14px;font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--kraft);color:#4E3B1F;border-radius:8px;padding:4px 9px;left:14px;right:auto}
.who b{bottom:16px;font-size:18px;line-height:1.2;letter-spacing:-.01em}
@media (max-width:560px){.who b{font-size:15.5px;left:12px;right:12px;bottom:12px}}
.ab-does{background:var(--kraft-l);padding-block:84px}
.ab-eng{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:10px}
@media (max-width:900px){.ab-eng{grid-template-columns:1fr}}
.ab-eng li{color:#4A4650}
.ab-eng li::before{border-color:var(--ink)}
.ab-eng b{color:var(--ink)}
.ab-src{padding-block:80px;background:var(--ink);color:#fff}
.ab-src .label{color:var(--red-l)}
.sgrid2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
@media (max-width:900px){.sgrid2{grid-template-columns:1fr;gap:26px}}
.srcl2{border-top:1px solid #3A3943}
.srcl2 li{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid #3A3943}
.srcl2 b{font-size:17px}
.srcl2 span{color:#C9C7D1;font-size:15.5px}
@media (max-width:600px){.srcl2 li{grid-template-columns:1fr;gap:4px}}
.ab-av{padding-block:84px}
.avgrid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:48px;align-items:center}
.avgrid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:22px}
.avgrid p{font-size:17.5px;color:#3E3B45;margin:16px 0 22px;max-width:56ch}
@media (max-width:900px){.avgrid{grid-template-columns:1fr;gap:26px}.avgrid img{aspect-ratio:3/2}}
.avgrid img{height:auto}
@media (min-width:901px){.pph img{height:auto}}

/* ================= repasse 14/11 ================= */
/* situations: the deck starts right under the title (no more centring in the screen), and each fiche hides the one
   beneath it entirely, tab row included, so two tabs never show at once */
.sit.stack .pin{align-items:flex-start;padding-top:92px}
@media (max-width:900px){.sit.stack .pin{padding-top:82px}}
.sit.stack .card{background:var(--sheet)}
.sit .head{padding-bottom:8px}
.facts.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.facts.n1{grid-template-columns:1fr}
@media (max-width:700px){.facts.n2{grid-template-columns:1fr}}
.pcta{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:24px}
.pcta .btn-red{font-size:16.5px;padding:14px 22px}
.pcta a.more{font-weight:700;color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.pcta a.more:hover{color:var(--red)}
.mini .two a{background:#fff;border-radius:8px;padding:8px;text-align:center;font-weight:600;border:1px solid var(--rule);transition:border-color .15s,background .15s}
.mini .two a:hover{border-color:var(--ink)}
.mini .two a:focus-visible{outline:2px solid var(--red);outline-offset:2px}
/* situations: the stage rises under the title; the pinned deck keeps clear of the fixed header */
.sit.stack .stage{margin-top:-64px}
.sit.stack .pin{pointer-events:none}
.sit.stack .deck{pointer-events:auto}
@media (max-width:900px){.sit.stack .stage{margin-top:-58px}}
.cbar span{font-size:12.5px}
/* the next fiche stays hidden until it rises into the deck (no tab peeking at the bottom of the screen) */
.sit.stack .deck{clip-path:inset(-80px -80px 0 -80px)}
/* language switch */
.lsw{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:36px;padding:0 9px;border:1px solid currentColor;border-radius:10px;font-family:var(--cond);font-weight:700;font-size:13.5px;letter-spacing:.1em;opacity:.85;transition:opacity .15s,background .15s}
.lsw:hover{opacity:1;background:rgba(127,127,127,.12)}
@media (max-width:900px){.lsw{height:34px;min-width:34px;padding:0 7px}}

/* ================= mon espace ================= */
.esp-wrap{background:var(--sheet);padding-block:44px 80px}
.esp-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:52px;align-items:start}
@media (max-width:960px){.esp-grid{grid-template-columns:1fr;gap:36px}}
.esp-side h1{font-size:clamp(32px,4vw,50px);margin-top:12px;max-width:16ch;text-wrap:balance}
.esp-form{position:relative;margin-top:44px;background:var(--paper);border-radius:0 22px 22px 22px;border-top:7px solid var(--kraft);padding:22px clamp(18px,3vw,26px);box-shadow:0 30px 60px -44px rgba(0,0,0,.5)}
.esp-step{position:absolute;top:-41px;left:0;height:34px}
.esp-step .ctab{top:0}
.esp-form .btn-red{width:100%;margin-top:16px;font-size:16.5px;padding:14px 20px}
.esp-note{margin-top:12px;font-size:13.5px;color:var(--pencil)}
.esp-done{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.esp-done p{font-size:17px;color:#2E2C34;max-width:42ch}
.esp-prev{position:relative}
.ep-card{position:relative;padding-top:34px}
.ep-card>.ctab{top:0}
.ep-body{background:var(--paper);border-radius:0 22px 22px 22px;border-top:7px solid var(--kraft);padding:22px;display:flex;flex-direction:column;gap:16px;box-shadow:0 30px 60px -40px rgba(0,0,0,.45)}
.ep-badge{align-self:flex-start;font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:var(--sheet);color:var(--pencil);border-radius:8px;padding:4px 9px}
.ep-badge.mine{background:var(--ink);color:#fff}
.ep-body .cv-label{border:1px solid var(--rule)}
.ep-state{font-weight:900;font-size:24px;letter-spacing:-.03em;line-height:1.1}
.ep-stamp{padding:4px 0 2px 6px}
.ep-blocks{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.ep-blocks{grid-template-columns:1fr}}
.ep-b{background:var(--sheet);border-radius:14px;padding:14px}
.ep-b ul{display:flex;flex-direction:column;gap:8px;font-size:14px}
.ep-b li b{display:block;font-size:14.5px}
.ep-b li span{font-family:var(--cond);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--pencil)}
.ep-chk li{display:flex;gap:8px}
.ep-chk li::before{content:"";flex:none;width:14px;height:14px;border:1.5px solid var(--ink);border-radius:3px;margin-top:2px}
.ep-b.ink{grid-column:1/-1;background:var(--ink);color:#fff}
.ep-b.ink .mh{color:var(--red-l)}
.ep-b.ink p{font-size:14.5px;color:#C9C7D1}
.hdr .hsp{display:inline-flex}
.hdr .hsp[aria-current]{background:var(--sheet)}
@media (max-width:900px){.hdr .hsp{padding:6px 7px}.hdr .hsp b{display:none}}
/* header, calmer (14/11): the language is the nav's last quiet item, « Mon espace » a plain link, the phone bar keeps
   only the logo, the action and the menu */
.nav>a.lsw{border:0;min-width:0;height:auto;padding:9px 8px;margin-left:4px;font-family:var(--cond);font-weight:700;font-size:13px;letter-spacing:.12em;opacity:.6;border-radius:8px}
.nav>a.lsw:hover{opacity:1}
.hdr .hsp{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;font-weight:600;font-size:15px;border:0;background:transparent;transition:background .15s}
.hdr .hsp i{width:20px;height:15px;border-radius:2px 5px 2px 2px;background:var(--kraft);display:inline-block;position:relative;flex:none}
.hdr .hsp i::after{content:"";position:absolute;left:0;top:-3px;width:9px;height:4px;background:var(--kraft-d);border-radius:2px 2px 0 0}
.hdr .hsp:hover{background:rgba(127,127,127,.14)}
.hdr .hsp[aria-current]{background:rgba(127,127,127,.14)}
@media (max-width:900px){.hdr .hsp{display:none}}
.mm-space{display:flex;align-items:center;gap:10px;padding:12px 14px;margin-bottom:8px;border:1px solid var(--rule);border-radius:12px;font-weight:700}
.mm-space i{width:22px;height:16px;border-radius:2px 5px 2px 2px;background:var(--kraft);display:inline-block;position:relative}
.mm-space i::after{content:"";position:absolute;left:0;top:-3px;width:10px;height:4px;background:var(--kraft-d);border-radius:2px 2px 0 0}
/* FR | EN toggle (14/11) and « Espace » as a plain text link */
.ltog{display:inline-flex;align-items:center;padding:3px;border-radius:999px;border:1px solid rgba(127,127,127,.35);gap:2px}
.ltog a{font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.1em;padding:4px 9px;border-radius:999px;line-height:1;opacity:.7;transition:opacity .15s,background .15s}
.ltog a:hover{opacity:1}
.ltog a[aria-current]{opacity:1;background:var(--ink);color:#fff;pointer-events:none}
.hdr:not(.solid) .ltog{border-color:rgba(255,255,255,.4)}
.hdr:not(.solid) .ltog a[aria-current]{background:#fff;color:var(--ink)}
.hdr .hsp{font-weight:600}
.hdr .hsp i{display:none}
@media (max-width:900px){.ltog a{padding:4px 7px;font-size:12px}}

/* ================= situations, native stacking (14/11) =================
   No script any more: each fiche sticks under the header and the next one slides over it at the speed of the scroll
   (the browser's own scrolling, so it follows the finger or the wheel exactly). Fiches share one height so the one on
   top always covers the one beneath. */
.sit .stage{margin-top:0}
.sit .pin{position:static;height:auto;display:block;padding:0}
.sit .deck{display:flex;flex-direction:column;gap:22px;padding-bottom:84px;height:auto;clip-path:none}
.sit .card{position:sticky;top:86px;background:var(--sheet);padding-top:34px;transform:none!important;visibility:visible!important}
.sit .card .cbody{height:min(600px,calc(100svh - 150px));overflow:hidden}
@media (max-width:900px){
  .sit .card{top:74px}
  .sit .card .cbody{height:min(640px,calc(100svh - 120px))}
  .sit .tps small{display:none}
}
@media (max-height:620px){.sit .card{position:relative;top:auto}.sit .card .cbody{height:auto}}
