/* ════════════════════════════════════════════════════════
   dossier.css — Foyer CSS partagé fiches dossier `.doss-*`
   Pages : blog-saint-francois.html · blog-petit-bourg-50k-778-m2.html ·
           blog-jay-family-saint-francois.html — plus les articles dossier
           du blog (ex. blog-delai-construction-guadeloupe.html) et le
           gabarit templates/article-dossier.html.
   DRY (feedback_shared_sections_same_classes) : CSS réellement identique
   entre les pages vit ici. Le spécifique-page (variante colonne unique
   Jay, split éditorial, budget CIOP, hover nav…) reste dans le <style>
   inline de chaque page, commenté.
   Lié APRÈS style.css, AVANT le <style> inline de chaque page (cascade).
   ════════════════════════════════════════════════════════ */

/* ── Barre de progression lecture (3 pages) ───────── */
#read-progress{
  position:fixed;top:0;left:0;height:2px;width:0;
  background:var(--copper);z-index:9999;
  transition:width .08s linear;pointer-events:none
}

/* ── Masthead — vocabulaire commun aux 3 pages ───── */
.doss-mast{
  max-width:1340px;margin:0 auto;
  padding:calc(var(--nav-h) + 2rem) 1.25rem 2rem
}
.doss-mast__rule{
  grid-area:rule;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1.2rem;
  font-family:var(--sans);font-size:max(11px,.6rem);letter-spacing:.22em;text-transform:uppercase;
  color:var(--mid);padding-bottom:1rem;border-bottom:1px solid var(--dark)
}
.doss-mast__edition{color:var(--copper-text-light)}
.doss-mast__back{
  display:inline-flex;align-items:center;gap:.9rem;
  font-family:var(--sans);font-size:max(11px,.6rem);letter-spacing:.24em;text-transform:uppercase;
  color:var(--mid);text-decoration:none;transition:color .3s ease
}
.doss-mast__back::before{content:'';width:1.2rem;height:1px;background:var(--copper);transition:width .3s ease}
.doss-mast__back-lead,.doss-mast__back-tail{white-space:nowrap}
/* Item G (Founder 2026-07-17) : en mobile étroit, « Retour aux dossiers » + la
   ligne d'édition ne tenaient pas côte à côte → le space-between cédait, le lien
   passait SOUS l'édition. On raccourcit le lien à « Retour » sous 480px : édition
   à gauche, retour à droite, sur une seule ligne, sans rapetisser la typo. */
@media(max-width:480px){
  .doss-mast__back-tail{display:none}
  /* Plancher 11 px (2026-10-31) : à 11 px la ligne d'édition repassait sur deux
     lignes ; on resserre l'interlettrage plutôt que de rapetisser la typo. */
  .doss-mast__rule,.doss-mast__back{letter-spacing:.1em}
  .doss-mast__rule{gap:.8rem}
}
@media(pointer:fine){
  .doss-mast__back:hover{color:var(--copper)}
  .doss-mast__back:hover::before{width:1.6rem}
}

.doss-mast h1,
.doss-mast__title{
  grid-area:h1;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.9rem,7vw,2.6rem);color:var(--dark);line-height:1.05;letter-spacing:-.02em;
  text-wrap:balance;margin:0
}
.doss-mast h1 em,
.doss-mast__title em{font-style:italic;color:var(--copper-text-light)}

.doss-mast__meta{grid-area:facts;display:flex;flex-direction:column;gap:.6rem}
.doss-mast__meta-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem}
.doss-mast__meta-row dt{
  font-family:var(--sans);font-size:max(11px,.58rem);letter-spacing:.2em;text-transform:uppercase;
  color:var(--copper-text-light);margin:0;flex-shrink:0
}
.doss-mast__meta-row dd{font-family:var(--serif);font-style:italic;font-size:.94rem;color:var(--dark);margin:0}

/* ── Pied de fiche (1-B) — CTA = pied de la cartouche, MÊME grammaire mobile/desktop.
   Filet inset pleine largeur + rangée space-between : lead cuivre à gauche,
   « Voir le projet » lien encre + trail à droite. Jamais de --mid au repos. ── */
.doss-mast__cta{
  grid-area:cta;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.9rem 1.4rem;
  padding-top:1.2rem
}
/* R-2 (2026-07-17, Founder) : sur les dossiers, « Voir le projet » est retiré (on
   EST déjà dans le projet) — un seul CTA reste. space-between sur 1 enfant l'étire
   en pleine largeur (bancal) ; ce modificateur rééquilibre sur la gauche. */
/* CTA unique fiche « Je suis intéressé » — CENTRÉ dans la colonne (Founder
   2026-07-17), desktop + mobile, cohérent avec l'ourlet centré dessous. */
.doss-mast__cta--single{justify-content:center}
/* R-8 (Founder 2026-07-17) : ZÉRO filet autour du CTA et de l'ourlet — ni sur la
   fiche ni sur la cartouche. L'ourlet « N personnes intéressées » est centré dans
   la colonne texte. Même traitement fiche ↔ cartouche (encart identique). */
.doss-mast__cta-primary,.doss-mast__cta-secondary{
  font-family:var(--sans);font-weight:300;font-size:max(11px,.68rem);letter-spacing:.16em;text-transform:uppercase;
  text-decoration:none;cursor:pointer
}
.doss-mast__cta-primary{
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--copper-text-light);background:rgba(184,115,51,.06);
  border:1px solid var(--copper);border-radius:0;padding:.7rem 1.4rem;
  transition:background .25s ease
}
@media(pointer:fine){
  .doss-mast__cta-primary:hover{background:rgba(184,115,51,.12)}
}
.doss-mast__cta-secondary{
  position:relative;display:inline-flex;align-items:center;
  color:var(--dark);border-bottom:1px solid rgba(44,44,40,.18);padding-bottom:.2rem
}
.doss-mast__cta-secondary::after{
  content:'';position:absolute;left:0;bottom:-1px;width:100%;height:1px;background:var(--dark);
  transform:scaleX(0);transform-origin:left center;transition:transform 600ms cubic-bezier(.16,1,.3,1)
}
@media(pointer:fine){
  .doss-mast__cta-secondary:hover::after{transform:scaleX(1)}
}
@media(min-width:900px){
  .doss-mast__cta-primary,.doss-mast__cta-secondary{font-size:.78rem;letter-spacing:.18em}
}

/* ── Ourlet — compteur, dernière ligne de l'encart. Typo pure, zéro filet (R-8),
   CENTRÉ dans la colonne texte (Founder 2026-07-17). ── */
.doss-mast__counter{
  grid-area:counter;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;text-align:center;gap:.6rem;
  padding-top:1rem
}
.doss-mast__counter-num{
  font-family:var(--serif);font-weight:400;font-style:normal;
  font-size:1.05rem;color:var(--dark);line-height:1
}
.doss-mast__counter-label{
  font-family:var(--sans);font-weight:300;font-size:max(11px,.62rem);letter-spacing:.2em;text-transform:uppercase;
  color:var(--mid);line-height:1.3
}

/* ── Légende « Projection » sous la photo (saint-francois, petit-bourg) ── */
.doss-mast__caption{
  grid-area:cap;display:flex;align-items:baseline;gap:.6rem;margin-top:.2rem;
  font-family:var(--serif);font-style:italic;font-size:.78rem;
  color:var(--mid);letter-spacing:.015em
}
.doss-mast__caption::before{
  content:'';width:1.2rem;height:1px;background:var(--copper);
  flex-shrink:0;transform:translateY(-.25rem)
}

@media(min-width:900px){
  .doss-mast{padding:calc(var(--nav-h) + 3rem) 2.5rem 3rem}
}

/* ── Masthead — variante « diptyque photo » (défaut : saint-francois, petit-bourg) ── */
.doss-mast__card{
  display:grid;row-gap:1.5rem;grid-template-columns:1fr;
  grid-template-areas:"rule" "h1" "photo" "facts" "cta" "counter";
  background:var(--paper);border:1px solid var(--cream-dk);border-radius:4px;
  padding:1.6rem 1.35rem 1.9rem
}
.doss-mast__photo{
  grid-area:photo;position:relative;overflow:hidden;border-radius:4px;
  height:46vh;min-height:280px;max-height:420px;background:var(--photo-bg)
}
.doss-mast__photo img{
  width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.04);transition:transform 2.2s cubic-bezier(.2,.8,.2,1)
}
.doss-mast__photo.loaded img{transform:scale(1)}
.doss-mast__hr{display:none;width:2.6rem;height:1px;background:var(--copper);opacity:.5}
/* Wrapper h1+hr+facts (mobile : transparent, chaque enfant garde son propre
   grid-area sur la cartouche — cf. .doss-mast__card ci-dessus). Neutralise
   toute rétention de mise en page mobile (R-1, cf. media 900px). */
.doss-mast__info{display:contents}

/* ── 3-A « Cartouche fermée » — le card CONSERVE fond+cadre+radius au desktop
   (fin du "dissolve"). Photo encastrée, radius uniforme (fin de l'orphelin).
   R-1 (2026-07-17) : h1+hr+facts fusionnés dans .doss-mast__info, UNE seule
   ligne de grille en face de la photo — fin de la distribution d'espace sur
   3 lignes auto qui créait le filet orphelin (70px de vide au-dessus du H1,
   95px sous le filet). Rythme du filet contrôlé par margin, pas par la grille. ── */
@media(min-width:900px){
  .doss-mast__card{
    max-width:1120px;margin:0 auto;row-gap:1rem;
    background:var(--paper);border:1px solid var(--cream-dk);border-radius:4px;padding:2.2rem;
    grid-template-columns:1.6fr 1fr;
    /* R-7 (2026-07-17, Founder) : la fiche adopte L'ENCART DE LA CARTOUCHE projets
       — photo pleine hauteur à gauche, TOUT le reste (titre + faits + note + CTA +
       ourlet) empilé à DROITE, RIEN sous la photo. Le client retrouve le même
       encart qu'il a cliqué sur /projets, puis l'article commence dessous. */
    grid-template-areas:
      "rule  rule"
      "photo info"
      "photo cta"
      "photo counter";
    column-gap:3rem
  }
  .doss-mast__rule{margin-bottom:2.6rem}
  .doss-mast__info{
    display:flex;flex-direction:column;justify-content:flex-start;grid-area:info
  }
  /* R-3 (2026-07-17, Founder) : « la photo vend, le titre n'est qu'un hook » — 4.4rem
     dans une colonne de 384px (1.6fr/1fr @1120px) forçait 5 lignes de 2 mots. Descendu
     à 3.4rem : la photo reste dominante, le H1 tient en ≤3 lignes. */
  .doss-mast h1,
  .doss-mast__title{font-size:clamp(2.4rem,3.4vw,3.4rem);margin-bottom:0}
  /* Photo à ASPECT paysage fixe (4/3) + alignée en HAUT : son aspect carré ne
     pousse plus les rangées (fin du vide étiré) → contenu naturel, ourlet remonté
     juste sous le CTA, bas de photo ≈ hauteur du contenu. object-fit recadre. */
  /* align-self:START (pas stretch) : la photo prend la LARGEUR de sa colonne et
     l'aspect 4/3 en dérive la hauteur. Avec stretch, la hauteur étirée pilotait
     la largeur (largeur = hauteur × 4/3) → la photo débordait sur le texte. */
  .doss-mast__photo{aspect-ratio:4/3;height:auto;width:100%;min-height:0;max-height:none;align-self:start;border-radius:3px}
  .doss-mast__photo picture{display:block;width:100%;height:100%}
  .doss-mast__hr{display:block;margin:1.4rem 0}
  /* Note « Projection… » : dans la colonne droite (sous les faits), en retrait. */
  .doss-mast__caption{align-self:start;margin-top:.4rem}
}

/* ── Masthead — variante « colonne unique » (jay-family, pas de photo) ──
   Modificateur .doss-mast--single sur le <header>. Spécificité (0,2,x)
   volontaire : neutralise à coup sûr le "dissolve" desktop de la variante
   diptyque ci-dessus, quel que soit l'ordre des règles dans la cascade.
   R-2 (2026-07-17, Founder) : article partenariat hors périmètre cartouche
   (faits + CTA réservés aux PROJETS) → grid réduite à rule/h1/hr, le CTA
   sobre vit dans .doss-nav en pied de page. */
.doss-mast--single .doss-mast__card{
  row-gap:1.5rem;grid-template-columns:1fr;
  grid-template-areas:"rule" "h1" "hr";
  background:var(--paper);border:1px solid var(--cream-dk);border-radius:4px
}
.doss-mast--single .doss-mast__hr{display:block;grid-area:hr}
@media(min-width:900px){
  .doss-mast--single .doss-mast__card{
    max-width:820px;margin:0 auto;padding:2.6rem 2.8rem 3rem
  }
  .doss-mast--single .doss-mast__rule{margin-bottom:.4rem}
  .doss-mast--single .doss-mast h1{align-self:auto;font-size:clamp(2.4rem,4.4vw,3.6rem);margin-bottom:0}
  .doss-mast--single .doss-mast__hr{margin:.4rem 0}
}

/* ── Corps éditorial commun (3 pages) ─────────────── */
.doss-body{
  max-width:720px;margin:0 auto;
  padding:5rem 2.5rem 3rem;
  font-family:var(--sans);font-weight:300;font-size:1rem;
  color:var(--dark);line-height:1.85
}
.doss-body p,
.doss-body--cream p{margin:0 0 1.5rem}
/* R-B-a (2026-07-19, Signature 1) : drop-cap + italique BORNÉS au seul chapô-lead
   (classe .doss-lead posée sur le paragraphe d'ouverture). Avant : `> p:first-of-type`
   se redéclenchait sur le 1er <p> de CHAQUE .doss-body (chapô + chaque section) →
   monotonie italique (D2). Portée : les 3 pages `.doss-*` + le gabarit dossier
   ré-vérifiés — aucune n'a plus d'un .doss-lead par page. */
.doss-body .doss-lead{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:1.18rem;color:var(--dark);line-height:1.68;margin-bottom:2rem
}
.doss-body .doss-lead::first-letter{
  font-family:var(--serif);font-size:3.4em;float:left;line-height:.9;
  margin:.05em .14em -.05em 0;color:var(--copper-text-light);font-weight:400;font-style:normal
}
/* R-D1 (2026-07-19, Signature 1) : l'eyebrow-bloc + le rythme du h2 sont désormais
   IDENTIQUES en fond paper (.doss-body) ET en fond cream (.doss-body--cream) — avant,
   `.doss-body h2` ne ciblait jamais les h2 des sections cream (wrapper différent),
   qui retombaient au h2 par défaut du navigateur (.num inline, margin:0, D1). */
.doss-body h2,
.doss-body--cream h2{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.7rem,2.6vw,2.2rem);
  color:var(--dark);line-height:1.12;letter-spacing:-.015em;
  margin:4rem 0 1.4rem;position:relative
}
.doss-body h2 .num,
.doss-body--cream h2 .num{
  display:block;font-style:italic;font-size:.9rem;
  color:var(--copper-text-light);letter-spacing:.02em;margin-bottom:.8rem;
  font-weight:400
}

/* Liens du corps — filet cuivre discret (2026-07-25, réserves Supervisor D-4) :
   style.css:172 pose `a{text-decoration:none;color:inherit}` site-wide → sans ce
   filet, un lien injecté par i18n (data-fr/data-en) dans le corps éditorial est
   indiscernable du texte (WCAG 1.4.1). Jamais de soulignement bleu par défaut,
   le texte reste encre.
   2026-07-26 : .doss-split__text, .doss-status__note et .doss-status__budget-ciop
   sont des sections sœurs de .doss-body qui échappaient à ce même filet — ajoutées
   ici, même dispositif, pas de second foyer. */
.doss-body a,
.doss-body--cream__inner a,
.doss-faq__a a,
.doss-split__text a,
.doss-status__note a,
.doss-status__budget-ciop a{
  color:inherit;
  border-bottom:1px solid rgba(184,115,51,.55);
  padding-bottom:.05em;
  transition:color .3s ease,border-bottom-color .3s ease
}
@media(pointer:fine){
  .doss-body a:hover,
  .doss-body--cream__inner a:hover,
  .doss-faq__a a:hover,
  .doss-split__text a:hover,
  .doss-status__note a:hover,
  .doss-status__budget-ciop a:hover{color:var(--copper-text-light);border-bottom-color:var(--copper)}
}

/* Typo des sections cream (2026-07-25, réserves Supervisor D-5) : le wrapper
   .doss-body--cream__inner (posé inline, layout seulement, par page) n'hérite
   pas de .doss-body → ses <p> retombaient à line-height:normal. Trou identique
   au fix R-D1 des h2 ci-dessus. Typo SEULEMENT, zéro propriété de layout — le
   layout inline des pages reste maître. */
.doss-body--cream__inner{
  font-family:var(--sans);font-weight:300;font-size:1rem;
  color:var(--dark);line-height:1.85
}

/* Titre FAQ (2026-07-25, réserves Supervisor D-6) : #faq-heading (h2 sans
   classe) n'était ciblé par aucune règle → rendu Jost 700/24px par défaut
   navigateur au lieu de la voix serif des autres h2 du corps. */
.doss-faq h2{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.7rem,2.6vw,2.2rem);
  color:var(--dark);line-height:1.12;letter-spacing:-.015em;
  margin:0 0 2rem
}

/* ── Galerie « À l'intérieur » — mosaïque éditoriale (saint-francois, petit-bourg) ── */
.doss-interior{display:grid;grid-template-columns:repeat(12,1fr);gap:3px}
.doss-interior__cell{position:relative;overflow:hidden;grid-column:span 4}
.doss-interior__cell img{
  width:100%;height:38vh;min-height:280px;max-height:400px;
  object-fit:cover;display:block;
  transition:transform 1s cubic-bezier(.16,1,.3,1)
}
.doss-interior__cell--wide{grid-column:span 8}
.doss-interior__cell--wide img{height:48vh;min-height:340px;max-height:520px}
.doss-interior:hover .doss-interior__cell img:not(:hover){filter:brightness(.88)}
@media(hover:hover) and (pointer:fine){
  .doss-interior__cell:hover img{transform:scale(1.015)}
}
@media(prefers-reduced-motion:reduce){
  .doss-interior__cell img{transition:none}
  .doss-interior__cell:hover img{transform:none}
}
@media(max-width:1000px){
  .doss-interior{grid-template-columns:1fr 1fr}
  .doss-interior__cell{grid-column:span 1}
  .doss-interior__cell--wide{grid-column:1 / -1}
  .doss-interior__cell img,
  .doss-interior__cell--wide img{height:42vh;min-height:280px;max-height:400px}
}
@media(max-width:640px){
  .doss-interior{grid-template-columns:1fr;gap:3px}
  .doss-interior__cell,
  .doss-interior__cell--wide{grid-column:1 / -1}
  .doss-interior__cell img,
  .doss-interior__cell--wide img{height:50vh;min-height:300px;max-height:none}
}

/* .doss-counter (boîte copper encadrée, centrée) SUPPRIMÉ (2-A) — remplacé par
   l'ourlet .doss-mast__counter DANS la cartouche (cf. § Masthead ci-dessus). */

/* ── Stats strip 3 colonnes (saint-francois, petit-bourg) ── */
.doss-stats{background:var(--dark);padding:5.5rem 2.5rem;position:relative;overflow:hidden}
.doss-stats::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 55% at 12% 30%,rgba(184,115,51,.08) 0%,transparent 65%)
}
.doss-stats__inner{
  max-width:1340px;margin:0 auto;position:relative;
  display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr
}
.doss-stats__stat{padding:0 2rem;text-align:center}
.doss-stats__sep{background:rgba(255,255,255,.12)}
.doss-stats__val{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2.4rem,4vw,3.6rem);
  color:var(--white);line-height:1;letter-spacing:-.015em;margin-bottom:.6rem
}
.doss-stats__val em{font-style:italic;color:var(--copper)}
.doss-stats__lbl{
  font-family:var(--sans);font-size:max(11px,.6rem);letter-spacing:.22em;
  text-transform:uppercase;color:rgba(255,255,255,.45)
}
@media(max-width:1000px){
  .doss-stats__inner{grid-template-columns:1fr 1fr}
  .doss-stats__stat{padding:2rem 1rem}
  .doss-stats__sep{display:none}
}

/* ── Galeries éditoriales — base commune (3 pages) ── */
.doss-gallery{
  max-width:1340px;margin:5rem auto 2rem;padding:0 2.5rem
}
.doss-gallery--duo{display:grid;grid-template-columns:1fr 1fr;gap:3px}
.doss-gallery--trio{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.doss-gallery img{
  width:100%;height:64vh;min-height:380px;max-height:560px;
  object-fit:cover;display:block;
  transition:transform 1s cubic-bezier(.16,1,.3,1)
}
.doss-gallery--trio img{height:54vh;min-height:320px;max-height:460px}
.doss-gallery--duo picture,.doss-gallery--trio picture{display:block;overflow:hidden;line-height:0}
.doss-gallery__caption{
  max-width:1340px;margin:2rem auto 3.5rem;padding:0 2.5rem;
  display:flex;align-items:baseline;gap:.7rem;
  font-family:var(--serif);font-style:italic;font-size:.78rem;
  color:var(--mid);letter-spacing:.015em
}
.doss-gallery__caption::before{
  content:'';width:1.4rem;height:1px;background:var(--copper);
  flex-shrink:0;transform:translateY(-.25rem)
}
@media(max-width:1000px){
  .doss-gallery--duo,.doss-gallery--trio{grid-template-columns:1fr}
  .doss-gallery img{height:55vh;min-height:320px}
}
@media(max-width:640px){
  .doss-body{padding:3.5rem 1.5rem 2rem}
  .doss-gallery{padding:0 1.5rem}
}

/* ── Figure seule, photo entière au ratio d'origine (jamais recadrée) — 3 placements répartis dans l'article.
   Maquette validée par Benjamin le 2026-10-30 (canevas « Gabarit d'article · photos »). ── */
.doss-figure{margin:5rem auto;padding:0 2.5rem}
.doss-figure picture{display:block;line-height:0}
.doss-figure img{width:100%;height:auto;display:block}
/* Plafonnée à la hauteur de l'écran (choix B, Benjamin 30/10) : la photo tient entière sous la nav, légende comprise. 1.34 = ratio des photos 4:3. */
.doss-figure--plein{max-width:min(1240px, calc((100svh - 8rem) * 1.34 + 5rem))}
.doss-figure--colonne{max-width:900px;margin:1.5rem auto 3.5rem}
.doss-figure--decale{
  max-width:1240px;margin:1rem auto 0;padding-bottom:5rem;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:2.5rem;align-items:end
}
.doss-figure__side{grid-column:1;grid-row:1;padding-bottom:.4rem}
.doss-figure--decale picture{grid-column:2;grid-row:1}
.doss-figure__model{
  display:block;font-family:var(--sans);font-size:.6875rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--copper-text-light);margin:0 0 .8rem
}
.doss-figure__caption{
  max-width:720px;margin-top:1.2rem;
  display:flex;align-items:baseline;gap:.7rem;
  font-family:var(--serif);font-style:italic;font-size:.82rem;line-height:1.5;
  color:var(--mid);letter-spacing:.015em
}
.doss-figure__caption::before{
  content:'';width:1.4rem;height:1px;background:var(--copper);
  flex-shrink:0;transform:translateY(-.25rem)
}
.doss-figure--decale .doss-figure__caption{margin-top:0}
.doss-figure__side .doss-figure__caption{max-width:none}
.doss-body--suite{padding-top:0}
@media(max-width:900px){
  .doss-figure--decale{grid-template-columns:minmax(0,1fr);gap:1.2rem}
  .doss-figure__side,.doss-figure--decale picture{grid-column:1;grid-row:auto}
  .doss-figure__side{padding-bottom:0}
}
@media(max-width:640px){
  .doss-figure{padding:0;margin:3rem 0}
  .doss-figure__caption{padding:0 1.5rem}
  .doss-figure--decale{padding:0 0 3.5rem;margin:0}
  .doss-figure--decale .doss-figure__side{padding:0 1.5rem}
  .doss-figure--decale .doss-figure__caption{padding:0}
}

/* ── Bloc état dossier — core commun (saint-francois, petit-bourg) ── */
.doss-status{
  max-width:720px;margin:4rem auto;padding:0 2.5rem
}
.doss-status__head{
  display:inline-flex;align-items:center;gap:.9rem;margin-bottom:1.8rem;
  font-family:var(--sans);font-size:max(11px,.62rem);letter-spacing:.24em;text-transform:uppercase;
  color:var(--copper-text-light)
}
.doss-status__head::before{content:'';width:1.6rem;height:1px;background:var(--copper)}
.doss-status__title{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.6rem,2.4vw,2rem);
  color:var(--dark);line-height:1.12;letter-spacing:-.015em;margin:0 0 2rem
}
.doss-status__list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:1.2rem
}
.doss-status__item{
  display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:start;
  font-family:var(--sans);font-weight:300;font-size:.9rem;
  color:var(--dark);line-height:1.65
}
.doss-status__dot{
  width:8px;height:8px;border-radius:50%;margin-top:.45rem;flex-shrink:0
}
.doss-status__dot--done{background:var(--copper)}
.doss-status__dot--pending{
  background:transparent;
  border:1.5px solid rgba(184,115,51,.45)
}
.doss-status__note{
  font-family:var(--serif);font-style:italic;font-size:.88rem;
  color:var(--mid);margin:.6rem 0 0;line-height:1.62
}
@media(max-width:640px){
  .doss-status{padding:0 1.5rem}
}

/* ── Closure rule animée — variante commune (saint-francois, petit-bourg) ── */
.doss-closure-rule{
  display:block;width:0;height:1px;
  background:var(--copper);
  transition:width 1.1s cubic-bezier(.16,1,.3,1)
}
.is-revealed .doss-closure-rule{width:4.4rem}

/* ── CTA final dark + photo overlay (saint-francois, petit-bourg) ── */
.doss-cta{
  padding:7rem 2.5rem;position:relative;overflow:hidden;
  background:var(--dark);isolation:isolate
}
.doss-cta__bg{
  position:absolute;inset:0;z-index:-1;
  overflow:hidden
}
.doss-cta__bg img{
  width:100%;height:100%;object-fit:cover;object-position:center 45%;
  opacity:.2;filter:grayscale(.2);display:block
}
.doss-cta__bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to right,rgba(44,44,40,.9) 0%,rgba(44,44,40,.72) 55%,rgba(44,44,40,.55) 100%)
}
.doss-cta__inner{
  max-width:1340px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1.1fr;gap:5rem;align-items:center
}
.doss-cta__lbl{
  display:inline-flex;align-items:center;gap:.9rem;margin-bottom:1.4rem;
  font-family:var(--sans);font-size:max(11px,.62rem);letter-spacing:.24em;text-transform:uppercase;
  color:var(--copper)
}
.doss-cta__lbl::before{content:'';width:1.6rem;height:1px;background:var(--copper)}
.doss-cta h2{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2rem,3.6vw,2.8rem);
  color:var(--white);line-height:1.08;letter-spacing:-.02em;margin:0
}
.doss-cta h2 em{font-style:italic;color:var(--copper)}
.doss-cta__text{
  font-family:var(--serif);font-style:italic;font-size:1.05rem;
  color:rgba(255,255,255,.7);line-height:1.65;margin:0 0 2rem;max-width:42ch
}
.doss-cta__actions{
  display:flex;flex-direction:column;align-items:flex-start;gap:1.2rem
}
.doss-cta__link{
  display:inline-flex;align-items:center;gap:1rem;
  font-family:var(--sans);font-size:max(11px,.68rem);letter-spacing:.22em;text-transform:uppercase;
  color:var(--white);text-decoration:none;
  border-top:1px solid rgba(255,255,255,.25);padding-top:1rem;
  transition:color .3s ease
}
.doss-cta__link::after{
  content:'→';color:var(--copper);
  transition:transform .35s cubic-bezier(.16,1,.3,1)
}
.doss-cta__link:hover{color:var(--copper)}
.doss-cta__link:hover::after{transform:translateX(.4rem)}
.doss-cta__btn{
  display:inline-flex;align-items:center;gap:1rem;
  font-family:var(--sans);font-size:max(11px,.68rem);letter-spacing:.22em;text-transform:uppercase;
  color:rgba(255,255,255,.55);background:none;border:none;cursor:pointer;
  padding:0;transition:color .3s ease
}
.doss-cta__btn::after{
  content:'↗';color:var(--copper);
  transition:transform .35s cubic-bezier(.16,1,.3,1)
}
.doss-cta__btn:hover{color:var(--white)}
.doss-cta__btn:hover::after{transform:translate(.25rem,-.25rem)}
@media(max-width:1000px){
  .doss-cta__inner{grid-template-columns:1fr;gap:2.2rem}
}
@media(max-width:640px){
  .doss-cta{padding:4.5rem 1.5rem}
}

/* ── Nav bas éditorial — base commune (3 pages, hover couleur page-spécifique) ── */
.doss-nav{
  /* Founder 2026-07-17 : fond FONCÉ (comme les blocs sombres au-dessus/en dessous),
     pleine largeur, encadré 2 traits clairs (haut + bas) pour séparer le bloc.
     Padding fluide qui aligne le contenu sur la grille 1340 sans wrapper. */
  background:var(--dark);
  padding:2.6rem max(2.5rem, calc((100% - 1340px) / 2));
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem 2rem;
  border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)
}
/* Taille remontée 2026-07-27 : .6rem = 9,6 px, sous le minimum lisible (typo trop
   petite = rejet Founder). .74rem ≈ 11,8 px, tracking détendu à .2em pour garder
   la même largeur optique, blanc remonté à 78 % (60 % + 9,6 px = illisible sur --dark). */
.doss-nav a{
  font-family:var(--sans);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.78);text-decoration:none;
  display:inline-flex;align-items:center;gap:.8rem;
  transition:color .3s ease
}
@media(pointer:fine){ .doss-nav a:hover{color:var(--copper)} }
.doss-nav a em{font-family:var(--serif);font-style:italic;font-size:.82rem;letter-spacing:0;text-transform:none;color:var(--white)}
/* ≤768 : liens EN LIGNE (Founder 2026-07-22 : plus d'empilement vertical).
   flex-wrap évite le chevauchement — ils passent à la ligne seulement si trop longs. */
@media(max-width:768px){
  .doss-nav{padding:2rem 1.5rem;flex-direction:row;flex-wrap:wrap;gap:.7rem 1.2rem;align-items:center;justify-content:space-between}
  /* resserré pour que les 2 liens tiennent sur une ligne sur téléphone */
  .doss-nav a{letter-spacing:.12em;gap:.5rem}
  .doss-nav a em{font-size:.74rem}
}

/* ── Partage — clôture de dossier, variante B (choix Founder 2026-07-27,
   révise variante A observée en prod le même jour) ──
   Injecté par assets/js/share.js avant .doss-cta (repli .doss-nav) — 5
   fiches dossier, source unique DRY. Filet statique (pas de reveal —
   signature closure-rule animée déjà réservée à .doss-closure-rule ailleurs
   sur ces pages). Bloc centré dans la même colonne que .doss-body (même
   max-width/padding-inline) — eyebrow + filet + canaux centrés horizontalement,
   plus d'alignement gauche sur le fil de lecture (retour Founder 2026-07-27,
   observation prod). align-items:center (pas baseline) sur .doss-share__row :
   l'eyebrow (petites capitales .64rem) et .doss-share__list (icônes SVG 14px +
   texte .84rem) ont des line-box différentes → baseline désaligne visuellement
   leurs centres verticaux, center les fait coïncider. */
.doss-share{
  max-width:720px;margin:0 auto;padding:0 2.5rem 3.5rem;
  text-align:center
}
/* Après une section à fond plein (page T) : le trait ne doit pas se poser sur la
   jointure des deux fonds. Même écart que sur les autres pages (64px). */
.doss-acc + .doss-share{padding-top:4rem}
.doss-share__closure-rule{
  display:block;width:2.6rem;height:1px;background:var(--copper);opacity:.5;
  margin:0 auto 2.2rem
}
.doss-share__row{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.9rem 1.1rem
}
.doss-share__eyebrow{
  font-family:var(--sans);font-size:max(11px,.64rem);letter-spacing:.24em;text-transform:uppercase;
  color:var(--copper-text-light)
}
.doss-share__list{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.9rem 1.1rem}
.doss-share__dot{color:var(--mid)}
.doss-share__item{
  position:relative;display:inline-flex;align-items:center;gap:.45rem;
  font-family:var(--sans);font-weight:300;font-size:.84rem;color:var(--dark);
  text-decoration:none;padding-bottom:.2rem;background:none;border:none;cursor:pointer
}
.doss-share__item svg{width:14px;height:14px;flex-shrink:0;color:var(--copper-text-light)}
.doss-share__item::after{
  content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--copper);
  transform:scaleX(0);transform-origin:left center;transition:transform .5s cubic-bezier(.16,1,.3,1)
}
@media(hover:hover) and (pointer:fine){
  .doss-share__item:hover{color:var(--copper-text-light)}
  .doss-share__item:hover::after{transform:scaleX(1)}
}
.doss-share__item.is-copied{color:var(--copper-text-light)}

.doss-share__mobile-btn{
  display:none;align-items:center;gap:.55rem;
  font-family:var(--sans);font-size:.78rem;letter-spacing:.06em;color:var(--dark);
  background:none;border:1px solid var(--copper);padding:.65rem 1.2rem;cursor:pointer;
  transition:background .25s ease
}
.doss-share__mobile-btn svg{width:15px;height:15px;color:var(--copper-text-light);flex-shrink:0}
@media(hover:hover) and (pointer:fine){
  .doss-share__mobile-btn:hover{background:rgba(184,115,51,.08)}
}
/* Repli mobile natif (Web Share API) : bascule posée par share.js sur .doss-share
   uniquement sous 768px si navigator.share existe — desktop garde toujours la liste. */
.doss-share--native .doss-share__eyebrow,
.doss-share--native .doss-share__list{display:none}
.doss-share--native .doss-share__mobile-btn{display:inline-flex}

@media(max-width:640px){
  .doss-share{padding:0 1.5rem 2.5rem}
}
@media(prefers-reduced-motion:reduce){
  .doss-share__item,.doss-share__mobile-btn{transition:none}
}

/* ── Reveal helpers — Pass 4.5 data-reveal-item (3 pages) ── */
[data-reveal-item]{
  opacity:0;transform:translateY(22px);
  transition:opacity .72s cubic-bezier(.22,1,.36,1),transform .72s cubic-bezier(.22,1,.36,1)
}
[data-reveal-item].is-revealed{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  [data-reveal-item]{opacity:1;transform:none;transition:none}
}

/* Avertissement de fin d'article, en petit comme une mention légale (Benjamin 2026-10-27, article permis). */
.doss-legal{
  max-width:1340px;margin:0 auto 3rem;padding:0 2.5rem;box-sizing:border-box;
  font-family:var(--sans);font-weight:300;font-size:.74rem;line-height:1.6;letter-spacing:.01em;
  color:var(--mid);
}
.doss-legal::before{content:"";display:block;width:2.6rem;height:1px;background:var(--light-border, #E5DDD0);margin-bottom:1rem}
@media (max-width:768px){ .doss-legal{padding:0 1.5rem} }
