/* ============================================================
   EXPERTISE — PROTOTYPE B « cartes empilées »
   Meme palette, memes polices ; langage de mise en page different :
   chaque expertise est une grande carte qui s'epingle a l'ecran
   pendant que la suivante glisse par-dessus au defilement.
   ============================================================ */

/* hero compact : pas de mot fantome, la copie reprend sa place */

body.expertise-b .ex-hero-copy{margin-top:0}
body.expertise-b .ex-hero-copy .d-1{font-size:clamp(40px,5.6vw,86px);max-width:none}

/* ================= LE JEU DE CARTES ================= */
body.expertise-b .deck-sec{padding-top:clamp(30px,4vw,60px)}
body.expertise-b .deck-sec .section-head{margin-bottom:clamp(18px,2.4vw,34px)}
body.expertise-b .deck{display:block}

body.expertise-b .deck-card{
  position:sticky;top:clamp(76px,10vh,96px);
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(24px,3.6vw,64px);align-items:start;
  min-height:min(78svh,760px);
  border-radius:22px;
  padding:clamp(26px,3.6vw,54px);
  box-shadow:0 -14px 44px rgba(var(--ink-rgb),.14);
}
body.expertise-b .deck-card + .deck-card{margin-top:clamp(26px,5vh,52px)}

/* tonalites : palette existante uniquement */
body.expertise-b .t-blanc{background:var(--panel-2);border:1px solid var(--line)}
body.expertise-b .t-panel{background:var(--panel);border:1px solid var(--line)}
body.expertise-b .t-sable{background:var(--sand-200);border:1px solid var(--line-strong)}
body.expertise-b .t-navy{background:var(--dark);color:var(--cream-on-dark)}

/* colonne gauche : numero jalon, titre, sous-titre, intro */
body.expertise-b .dnum{
  display:block;
  font-family:var(--font-title);font-weight:400;font-synthesis:none;
  font-size:clamp(64px,7vw,120px);line-height:.85;
  color:var(--ornament);
}
body.expertise-b .dc-left h3{
  margin-top:clamp(14px,1.8vw,24px);
  font-family:var(--font-title);font-weight:400;font-synthesis:none;
  font-size:clamp(24px,2.3vw,36px);line-height:1.08;letter-spacing:-.01em;
  text-transform:none;
}
body.expertise-b .dsub{
  margin-top:10px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);
}
body.expertise-b .t-navy .dsub{color:rgba(var(--cream-rgb),.6)}
body.expertise-b .dlead{
  margin-top:clamp(14px,1.8vw,22px);
  color:var(--ink-soft);font-size:clamp(14.5px,1.05vw,16.5px);line-height:1.62;
  max-width:46ch;
}
body.expertise-b .t-navy .dlead{color:rgba(var(--cream-rgb),.8)}
body.expertise-b .t-navy .dlead strong,
body.expertise-b .t-navy .dc-left h3{color:var(--cream-on-dark)}

/* colonne droite : les blocs en deux colonnes, tout visible */
body.expertise-b .dc-right{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(14px,1.6vw,24px);
}
body.expertise-b .dc-right .mini{
  border:1px solid var(--line-strong);border-radius:12px;
  padding:clamp(14px,1.6vw,22px);
  background:rgba(var(--panel-2-rgb),.5);
}
body.expertise-b .t-blanc .dc-right .mini{background:var(--canvas)}
body.expertise-b .t-navy .dc-right .mini{
  background:var(--dark-panel);border-color:rgba(var(--cream-rgb),.15);
}
body.expertise-b .dc-right .mini h4{margin-bottom:10px}
body.expertise-b .t-navy .dc-right .mini h4{color:var(--ornament)}
body.expertise-b .t-navy .dc-right .mini h4::before{border-color:rgba(var(--cream-rgb),.5)}
body.expertise-b .dc-right .mini ul{font-size:13.5px;line-height:1.7}
body.expertise-b .t-navy .dc-right .mini ul{color:rgba(var(--cream-rgb),.72)}
body.expertise-b .t-navy .dc-right .mini li::before{background:var(--ornament)}
/* le dernier bloc (« Projets associés » ou bloc unique) referme la rangee */
body.expertise-b .dc-right .mini:last-child:nth-child(odd){grid-column:1/-1}

/* ecrans peu hauts : on compacte pour que chaque carte tienne sous le pli */
@media(min-width:901px) and (max-height:820px){
  body.expertise-b .deck-card{padding:clamp(20px,2.6vw,34px);min-height:0}
  body.expertise-b .dnum{font-size:clamp(52px,5.6vw,84px)}
  body.expertise-b .dlead{font-size:14px;line-height:1.5}
  body.expertise-b .dc-right .mini{padding:12px 16px}
  body.expertise-b .dc-right .mini ul{font-size:12.5px;line-height:1.6}
}

/* mobile / tablette : plus d'epinglage, cartes en flux normal */
@media(max-width:900px){
  body.expertise-b .deck-card{
    position:static;grid-template-columns:1fr;min-height:0;
    box-shadow:0 10px 30px rgba(var(--ink-rgb),.08);
  }
  body.expertise-b .dc-right{grid-template-columns:1fr}
  body.expertise-b .dc-right .mini:last-child:nth-child(odd){grid-column:auto}
}

/* mouvement reduit : l'epinglage est purement CSS, rien a couper */