/* =====================================================================
   desle.immo · assets/v2/pages/vendre-documents.css · page /vendre/documents/
   (v2, 16/10/2026). Chargé après assets/v2/site.css, qui reste intact.
   Ici seulement ce que la page ajoute : hero (fil d'Ariane, réponse,
   règle PEB en bloc Ink, frise horizontale des 4 étapes), guide à
   sommaire collant (≥ 1200 px), fiches documents (classes ve-* d'origine,
   restylées), pastilles d'obligation, encadrés « Côté acheteur », cas
   particuliers, changements 2026, sources, et la check-list imprimable
   (bloc .pc d'origine, inchangé).
   Préfixe dc- pour les composants neufs, ve- pour les classes reprises.
   ===================================================================== */

/* ── 00 Hero ─────────────────────────────────────────────────────────── */
.dc-haut{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 24px;margin-bottom:clamp(22px,3vw,34px)}
.dc-maj{font:400 var(--fs-mono)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--texte)}
.dc-maj::before{content:"";display:inline-block;width:6px;height:6px;margin-right:10px;vertical-align:1px;background:var(--accent)}
.ve-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:400 var(--fs-mono)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sourd)}
.ve-crumbs a{display:inline-flex;align-items:center;min-height:32px;color:var(--sourd);transition:color .2s}
@media (hover:hover){.ve-crumbs a:hover{color:var(--texte)}}
.ve-crumbs .sep{color:var(--filet-fort)}
.ve-crumbs [aria-current]{color:var(--texte)}

.dc-hero__grille{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"titre" "texte" "regle";gap:clamp(28px,3.6vw,44px) clamp(32px,4.5vw,64px)}
.dc-hero__titre{grid-area:titre}
.dc-hero__texte{grid-area:texte;display:grid;gap:clamp(24px,3vw,32px);align-content:start}
.dc-regle{grid-area:regle}
@media (min-width:1080px){.dc-hero__grille{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"titre titre" "texte regle";align-items:start}}
.dc-hero .di-h1{max-width:22ch}
.dc-reponse{max-width:62ch;padding-left:clamp(16px,2vw,24px);border-left:2px solid var(--accent);font-size:var(--fs-lead);line-height:1.6;color:var(--texte);text-wrap:pretty}
.dc-direct{max-width:62ch;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.6;color:var(--texte);text-wrap:pretty}

.ve-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.ve-tools .di-btn svg{flex:none}
.ve-tools-note{font:400 var(--fs-mono)/1.4 var(--mono);letter-spacing:.06em;color:var(--sourd)}

/* règle PEB : bloc Ink, le seul aplat sombre du haut de page */
.ve-rule{display:grid;gap:14px;align-content:start;padding:clamp(24px,3vw,36px);border-radius:var(--radius);background:var(--fond);color:var(--texte)}
.ve-rule .di-icone{margin-bottom:6px}
.ve-rule-k{font:500 var(--fs-mono)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sourd)}
.ve-rule-k::before{content:"";display:inline-block;width:6px;height:6px;margin-right:10px;vertical-align:1px;background:var(--accent)}
.ve-rule-t{font:600 clamp(1.375rem,1.1rem + 1vw,1.875rem)/1.15 var(--font);letter-spacing:-.025em;color:var(--texte);text-wrap:balance}
.ve-rule p:last-child{font-size:1rem;line-height:1.62;color:var(--sourd);text-wrap:pretty}

/* frise horizontale des 4 étapes (liens) : 2 × 2 sur mobile, 4 en ligne dès 720 px */
.ve-stepnav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:clamp(36px,5vw,60px);padding:1px;background:var(--filet);border-radius:var(--radius);overflow:clip}
@media (min-width:720px){.ve-stepnav{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ve-stepnav a{position:relative;display:grid;gap:14px;align-content:start;min-height:104px;padding:18px clamp(14px,1.8vw,22px) 20px;background:var(--fond);font:600 clamp(1.0625rem,.98rem + .35vw,1.25rem)/1.2 var(--font);letter-spacing:-.015em;color:var(--texte);transition:background-color .3s}
.ve-stepnav a > span{display:flex;align-items:center;gap:10px;font:500 12px/1 var(--mono);letter-spacing:.12em;color:var(--sourd)}
.ve-stepnav a > span::before{content:"";flex:none;width:8px;height:8px;background:var(--accent);transform:rotate(45deg)}
.ve-stepnav__fil{flex:1;height:1px;background:var(--filet-fort);transform-origin:left}
.ve-stepnav a::after{content:"↓";position:absolute;right:clamp(14px,1.8vw,22px);bottom:18px;font:500 12px/1 var(--mono);color:var(--sourd);transition:transform .3s var(--ease),color .3s}
@media (hover:hover){
  .ve-stepnav a:hover{background:var(--fond-survol)}
  .ve-stepnav a:hover::after{color:var(--texte);transform:translateY(3px)}
}

/* ── Le guide : sommaire collant à gauche (≥ 1200 px) ────────────────── */
.dc-sommaire__in{display:grid;gap:22px;padding:28px var(--gouttiere) 8px}
.dc-sommaire__nav,.dc-sommaire__imprimer{display:none}
@media (min-width:1200px){
  .dc-guide{display:grid;grid-template-columns:232px minmax(0,1fr);width:min(var(--wrap),100% - 2 * var(--gouttiere));margin-inline:auto}
  .dc-guide > .di-section{grid-column:2;min-width:0}
  .dc-sommaire{grid-column:1;grid-row:1 / span 20;border-left:1px solid var(--filet)}
  .dc-sommaire__in{position:sticky;top:calc(var(--header-h) + 28px);max-height:calc(100vh - var(--header-h) - 56px);max-height:calc(100dvh - var(--header-h) - 56px);overflow-y:auto;padding:28px 24px 28px 20px;gap:26px}
  .dc-sommaire__nav,.dc-sommaire__imprimer{display:block}
  .dc-sommaire__imprimer{justify-self:start;display:inline-flex}
  /* dans la colonne, les sections gardent leurs guides sur leurs bords */
  .dc-guide .di-wrap{width:auto;margin-inline:0}
  .dc-guide .di-wrap:not(.di-guides){padding-inline:clamp(28px,3vw,44px)}
}
.dc-sommaire__titre{margin-bottom:10px;color:var(--sourd)}
.dc-sommaire__nav ol{border-top:1px solid var(--filet)}
.dc-sommaire__nav a{position:relative;display:flex;align-items:baseline;gap:10px;min-height:38px;padding:9px 0 9px 14px;border-bottom:1px solid var(--filet);font-size:.9375rem;line-height:1.3;color:var(--sourd);transition:color .25s}
.dc-sommaire__nav a .di-mono{flex:none;color:inherit}
.dc-sommaire__nav a::before{content:"";position:absolute;left:0;top:50%;width:2px;height:0;background:var(--accent);transform:translateY(-50%);transition:height .35s var(--ease)}
@media (hover:hover){.dc-sommaire__nav a:hover{color:var(--texte)}}
.dc-sommaire__nav a[aria-current]{color:var(--texte);font-weight:500}
.dc-sommaire__nav a[aria-current]::before{height:60%}

/* légende des pastilles (dans le sommaire ; seule, sous 1200 px) */
.ve-legend{display:flex;flex-wrap:wrap;gap:10px 18px;font-size:.875rem;line-height:1.4;color:var(--sourd)}
.ve-legend > span{display:inline-flex;align-items:center;gap:8px}
@media (min-width:1200px){
  .ve-legend{display:grid;gap:14px}
  .ve-legend > span{display:grid;gap:5px;justify-items:start}
}

/* ── Pastilles d'obligation (classes d'origine) ──────────────────────── */
.ve-badge{display:inline-flex;align-items:center;gap:7px;min-height:24px;padding:3px 8px;border:1px solid var(--filet-fort);border-radius:var(--radius);font:500 var(--fs-mono)/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;color:var(--texte)}
.ve-badge.is-req{background:var(--texte);border-color:var(--texte);color:var(--fond)}
.ve-badge.is-req::before{content:"";flex:none;width:6px;height:6px;background:var(--accent)}
.ve-badge.is-case{border-color:var(--texte)}
.ve-badge.is-rec{border-style:dashed;color:var(--sourd)}

/* ── Étapes : tête (picto, titre, réponse) puis fiches documents ─────── */
.dc-etape-tete{display:grid;gap:20px;max-width:54rem}
.ve-step-k + br{display:none}
.ve-step-k{display:block;margin-bottom:12px;font:500 12px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sourd)}

.ve-docs{counter-reset:doc;container-type:inline-size;margin-top:clamp(30px,4vw,48px);border-top:1px solid var(--filet-fort)}
.ve-doc{counter-increment:doc;display:grid;gap:12px;padding:clamp(20px,2.4vw,28px) 0;border-bottom:1px solid var(--filet)}
.ve-doc-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px}
.ve-doc-name{display:flex;align-items:baseline;gap:12px;font:600 clamp(1.125rem,1.05rem + .3vw,1.3125rem)/1.25 var(--font);letter-spacing:-.015em;color:var(--texte);text-wrap:balance}
.ve-doc-name::before{content:counter(doc,decimal-leading-zero);flex:none;font:500 var(--fs-mono)/1 var(--mono);letter-spacing:.1em;color:var(--sourd);transform:translateY(-2px)}
.ve-doc-note{max-width:68ch;font-size:1rem;line-height:1.62;color:var(--sourd);text-wrap:pretty}
/* les quatre repères Qui / Coût / Délai / Validité : grille à filets, 2 × 2 puis 4 en ligne */
.ve-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:4px;padding:1px;background:var(--filet);border-radius:var(--radius);overflow:clip}
@container (min-width:760px){.ve-meta{grid-template-columns:repeat(4,minmax(0,1fr))}}
@container (max-width:330px){.ve-meta{grid-template-columns:minmax(0,1fr)}}
.ve-meta > div{min-width:0;padding:12px 14px 13px;background:var(--fond)}
.ve-meta dt{margin-bottom:6px;font:500 var(--fs-mono)/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sourd)}
.ve-meta dd{font-size:.9375rem;line-height:1.45;color:var(--texte);overflow-wrap:anywhere}

/* encadré « Côté acheteur » */
.ve-buyer{margin-top:clamp(26px,3vw,36px);padding:clamp(18px,2.2vw,24px) clamp(18px,2.4vw,28px);border:1px solid var(--filet);border-left:2px solid var(--accent);border-radius:var(--radius);background:var(--blanc)}
.ve-buyer-k{margin-bottom:12px;font:500 var(--fs-mono)/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--texte)}
.ve-buyer ul{display:grid;gap:8px}

/* listes à puces carrées (fiches acheteur, cas particuliers) */
.ve-buyer li,.dc-liste li{position:relative;padding-left:20px;font-size:.98rem;line-height:1.58;color:var(--sourd);text-wrap:pretty}
.ve-buyer li::before,.dc-liste li::before{content:"";position:absolute;left:2px;top:.62em;width:5px;height:5px;background:var(--accent)}
.dc-liste{display:grid;gap:9px}
.ve-buyer li b,.dc-liste li b{font-weight:600;color:var(--texte)}

/* liens dans le texte (classe d'origine) */
a.ve-link{color:var(--texte);font-weight:500;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
@media (hover:hover){a.ve-link:hover{text-decoration-thickness:2px}}

/* ── 05 Cas particuliers ─────────────────────────────────────────────── */
.ve-case .di-pad{display:flex;flex-direction:column;gap:14px}
.ve-case .di-pad > * + *{margin-top:0}

/* ── 06 Changements 2026 : date mono | texte | statut ────────────────── */
.ve-changes{border-top:1px solid var(--filet-fort)}
.ve-changes li{display:grid;grid-template-columns:minmax(0,1fr);gap:10px 28px;padding:clamp(18px,2.2vw,26px) 0;border-bottom:1px solid var(--filet)}
@media (min-width:720px){.ve-changes li{grid-template-columns:9rem minmax(0,1fr)}}
.ve-changes .d{font:500 clamp(1rem,.9rem + .4vw,1.25rem)/1.2 var(--mono);letter-spacing:-.01em;color:var(--texte);font-variant-numeric:tabular-nums}
.ve-changes li > div{max-width:68ch;font-size:1rem;line-height:1.62;color:var(--sourd);text-wrap:pretty}
.ve-changes li > div > b{display:block;margin-bottom:6px;font-size:1.0625rem;font-weight:600;color:var(--texte)}
.ve-changes .s{display:flex;width:fit-content;align-items:center;gap:8px;margin-top:12px;min-height:26px;padding:3px 9px;border:1px solid var(--filet-fort);border-radius:var(--radius);font:500 var(--fs-mono)/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--texte)}
.ve-changes .s::before{content:"";width:6px;height:6px;background:var(--accent)}

/* ── 07 Avec moi : appel en bloc Ink ─────────────────────────────────── */
.ve-cta{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(28px,4vw,48px);align-items:center;padding:clamp(28px,4vw,52px);border-radius:var(--radius);background:var(--fond);color:var(--texte)}
@container (min-width:760px){.ve-cta{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}}
.ve-cta__texte{display:grid;gap:22px;align-content:start}
.ve-cta__texte .di-h2{max-width:18ch}
.ve-cta__visuel{border:1px solid var(--filet);border-radius:var(--radius)}

/* ── 08 Sources ──────────────────────────────────────────────────────── */
.ve-sources{counter-reset:src;border-top:1px solid var(--filet-fort)}
.ve-sources li{counter-increment:src;display:grid;grid-template-columns:2.5rem minmax(0,1fr);align-items:baseline;column-gap:8px;padding:12px 0;border-bottom:1px solid var(--filet);font-size:.98rem;line-height:1.45}
.ve-sources li::before{content:counter(src,decimal-leading-zero);grid-row:1 / span 2;font:500 var(--fs-mono)/1.6 var(--mono);letter-spacing:.08em;color:var(--sourd)}
.ve-sources a.ve-link{justify-self:start}
.ve-sources a.ve-link::after{content:"↗";display:inline-block;margin-left:6px;font-family:var(--mono);font-size:.8em;color:var(--sourd)}
.ve-sources small{grid-column:2;margin-top:4px;font:400 var(--fs-mono)/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sourd)}
.ve-legal{max-width:none;margin-top:clamp(24px,3vw,36px);padding-top:16px;border-top:1px solid var(--filet);font:400 var(--fs-mono)/1.7 var(--mono);letter-spacing:.04em;color:var(--sourd)}

/* ── Check-list imprimable : bloc .pc d'origine, invisible à l'écran ─── */
/* ================= CHECK-LIST IMPRIMABLE =================
   Invisible a l'ecran. A l'impression, la page web disparait
   et seule la feuille .pc s'imprime (A4, 2 pages). */
.pc{ display:none; }
@media print{
  @page{
    size:A4; margin:13mm 13mm 16mm 13mm;
    @bottom-left{ content:"Check-list préparée par Loïc Deslé · desle.immo · +32 451 01 52 49 · mise à jour 9 octobre 2026 · Information générale, le notaire fait foi"; font-family:'Space Grotesk',Arial,sans-serif; font-size:7pt; color:#5E6470; vertical-align:top; padding-top:4mm; }
    @bottom-right{ content:counter(page) " / " counter(pages); font-family:'IBM Plex Mono',monospace; font-size:7pt; color:#159E91; vertical-align:top; padding-top:4mm; }
  }
  html, body{ background:#fff !important; }
  body{ overflow:visible !important; cursor:auto !important; }
  body > *:not(.pc){ display:none !important; }
  .pc{ display:block !important; font-family:'Space Grotesk',Arial,sans-serif; color:#101418; font-size:8.6pt; line-height:1.35; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .pc *{ box-sizing:border-box; }
  .pc-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:8mm; padding-bottom:3.2mm; border-bottom:0.5mm solid #159E91; }
  .pc-mark{ font-size:17pt; font-weight:600; letter-spacing:-.03em; line-height:1; }
  .pc-mark span{ color:#159E91; }
  .pc-sub{ font-family:'IBM Plex Mono',monospace; font-size:7pt; letter-spacing:.12em; text-transform:uppercase; color:#5E6470; margin-top:1.6mm; }
  .pc-contact{ text-align:right; font-family:'IBM Plex Mono',monospace; font-size:7.6pt; line-height:1.55; color:#101418; }
  .pc-contact b{ font-weight:500; color:#159E91; }
  .pc-title{ font-size:15.5pt; font-weight:600; letter-spacing:-.025em; line-height:1.12; margin:5mm 0 1.6mm; }
  .pc-lede{ font-size:8.6pt; color:#38404a; margin:0 0 1.2mm; max-width:none; }
  .pc-rule{ display:flex; gap:3mm; align-items:baseline; margin:2.6mm 0 0; padding:2mm 3mm; border:0.3mm solid #159E91; border-radius:2px; font-size:8.4pt; }
  .pc-rule b{ font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:7pt; letter-spacing:.12em; text-transform:uppercase; color:#159E91; white-space:nowrap; }
  .pc-legend{ font-family:'IBM Plex Mono',monospace; font-size:6.8pt; color:#5E6470; margin:2mm 0 0; letter-spacing:.03em; }
  .pc p{ max-width:none; }
  .pc-step{ margin-top:4.2mm; }
  .pc-step h2{ break-after:avoid; page-break-after:avoid; }
  .pc tr{ break-inside:avoid; page-break-inside:avoid; }
  .pc thead{ display:table-header-group; }
  .pc-buyer{ break-before:avoid; page-break-before:avoid; }
  .pc-step h2{ display:flex; align-items:baseline; gap:2.4mm; font-size:10.6pt; font-weight:600; letter-spacing:-.01em; margin:0 0 1.4mm; line-height:1.2; }
  .pc-step h2 .n{ font-family:'IBM Plex Mono',monospace; font-size:7.6pt; font-weight:500; color:#fff; background:#159E91; border-radius:2px; padding:.4mm 1.5mm .2mm; letter-spacing:.04em; }
  .pc-step h2 .w{ font-family:'IBM Plex Mono',monospace; font-weight:400; font-size:7pt; color:#5E6470; letter-spacing:.06em; text-transform:uppercase; margin-left:auto; }
  .pc table{ width:100%; border-collapse:collapse; table-layout:fixed; }
  .pc th{ font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:6.6pt; letter-spacing:.1em; text-transform:uppercase; color:#5E6470; text-align:left; padding:1mm 1.4mm .9mm; border-bottom:0.3mm solid #101418; }
  .pc td{ padding:1.15mm 1.4mm 1mm; border-bottom:0.2mm solid #d5d8de; vertical-align:top; font-size:8.1pt; line-height:1.3; }
  .pc td.c{ width:6mm; padding-left:0; padding-right:0; }
  .pc .box{ display:block; width:3.2mm; height:3.2mm; border:0.3mm solid #101418; border-radius:0.4mm; margin-top:.25mm; }
  .pc td.doc b{ font-weight:600; }
  .pc td.doc em{ font-style:normal; font-family:'IBM Plex Mono',monospace; font-size:6.3pt; letter-spacing:.06em; text-transform:uppercase; color:#0f7a70; display:block; margin-top:.4mm; }
  .pc td.doc em.k{ color:#5E6470; }
  .pc td.note{ color:#38404a; }
  .pc col.c{ width:6mm; } .pc col.doc{ width:30%; } .pc col.qui{ width:17%; } .pc col.del{ width:13.5%; }
  .pc-buyer{ font-size:7.5pt; color:#38404a; margin:1.3mm 0 0; padding-left:2.2mm; border-left:0.4mm solid #c9cdd4; }
  .pc-buyer b{ font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:6.5pt; letter-spacing:.1em; text-transform:uppercase; color:#5E6470; margin-right:1.4mm; }
  .pc-cases{ display:grid; grid-template-columns:1fr 1fr; gap:2.4mm 5mm; margin-top:1.6mm; }
  .pc-case{ break-inside:avoid; font-size:7.9pt; line-height:1.34; color:#38404a; }
  .pc-case b{ display:block; color:#101418; font-size:8.4pt; font-weight:600; margin-bottom:.6mm; }
  .pc-end{ break-inside:avoid; page-break-inside:avoid; display:flex; align-items:center; gap:6mm; margin-top:5mm; padding:4.2mm 5mm; border:0.4mm solid #101418; border-radius:2px; }
  .pc-end-txt{ flex:1; }
  .pc-end-t{ font-size:13pt; font-weight:600; letter-spacing:-.02em; line-height:1.15; margin:0 0 1.8mm; }
  .pc-end-t span{ color:#159E91; }
  .pc-end p{ font-size:8.4pt; color:#38404a; margin:0 0 1.4mm; max-width:none; }
  .pc-end-c{ font-family:'IBM Plex Mono',monospace; font-size:8.6pt; line-height:1.6; color:#101418; }
  .pc-end-c b{ font-weight:500; color:#159E91; }
  .pc-qr{ flex:none; width:30mm; text-align:center; }
  .pc-qr svg{ display:block; width:30mm; height:30mm; }
  .pc-qr small{ display:block; font-family:'IBM Plex Mono',monospace; font-size:6.2pt; letter-spacing:.06em; color:#5E6470; margin-top:1.2mm; line-height:1.35; }
  .pc-foot{ font-family:'IBM Plex Mono',monospace; font-size:6.4pt; letter-spacing:.03em; color:#5E6470; margin-top:3mm; line-height:1.5; }
  .pc-sec{ font-size:10.6pt; font-weight:600; margin:5mm 0 0; padding-top:2.4mm; border-top:0.3mm solid #101418; }
  .pc-pb{ break-before:page; page-break-before:always; }
}
/* v2 : le corps réserve la hauteur du header fixe ; rien de tel sur papier */
@media print{
  body{padding:0 !important}
}