/* ============================================================
   PROJETS — page construite sur le kit de continuité.
   Spécifique ici : le registre (rail sommaire + collections).
   Les cartes, le hero et la numérotation viennent de kit.css.
   ============================================================ */

/* ---- registre : rail + contenu ---- */
body.projets .pj-layout{
  display:grid;grid-template-columns:minmax(210px,3fr) minmax(0,9fr);
  gap:clamp(28px,4.5vw,80px);align-items:start;
  padding-top:clamp(40px,6vw,90px);
}
body.projets .pj-rail{position:sticky;top:clamp(90px,13vh,130px)}
body.projets .rail-t{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-bottom:14px;
}
body.projets .pj-rail nav{display:flex;flex-direction:column}
body.projets .pj-rail a{
  display:flex;align-items:baseline;gap:12px;
  padding:11px 0;border-top:1px solid var(--line);
  font-family:var(--font-body);font-weight:600;font-size:13.5px;letter-spacing:.01em;
  color:var(--ink-soft);line-height:1.35;
  transition:color .3s var(--ease),padding-left .3s var(--ease);
}
body.projets .pj-rail a:last-child{border-bottom:1px solid var(--line)}
body.projets .pj-rail .rn{
  font-family:var(--font-title);font-weight:400;font-synthesis:none;
  font-size:16px;color:var(--ornament);flex-shrink:0;
}
@media(hover:hover) and (pointer:fine){
  body.projets .pj-rail a:hover{color:var(--ink);padding-left:8px}
}

/* ---- collections : jalon à droite de la tête ---- */
body.projets .collection{padding-block:clamp(30px,4vw,60px)}
body.projets .collection + .collection{border-top:1.5px solid var(--line-strong)}
body.projets .collection .section-head{
  position:relative;
  margin-bottom:clamp(26px,3vw,44px);
  padding-right:clamp(90px,10vw,150px);
}
body.projets .col-num{position:absolute;right:0;top:-.12em;pointer-events:none}
body.projets .collection .section-head .d-2{max-width:24ch}
body.projets .collection .section-head .body-copy{max-width:62ch;color:var(--muted)}

/* ---- pile de dossiers ---- */
body.projets .proj-stack{display:flex;flex-direction:column;gap:clamp(18px,2.2vw,30px)}
body.projets .proj .chip{
  display:inline-flex;width:fit-content;
  margin:0 0 clamp(12px,1.4vw,18px);
}

/* ---- responsive ---- */
@media(max-width:1000px){
  body.projets .pj-layout{grid-template-columns:1fr;gap:24px}
  body.projets .pj-rail{position:static;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.projets .pj-rail nav{flex-direction:row;gap:8px;padding-bottom:6px}
  body.projets .pj-rail a,
  body.projets .pj-rail a:last-child{
    border:1px solid var(--line-strong);border-radius:999px;
    padding:8px 14px;white-space:nowrap;font-size:12.5px;
  }
}
@media(max-width:760px){
  body.projets .collection .section-head{padding-right:0}
  body.projets .col-num{position:static;display:block;margin-bottom:6px;font-size:56px}
}

/* ---- l'empilement d'Expertise, par collection ---- */
@media(min-width:901px){
  body.projets .proj-stack{display:block}
  body.projets .proj-stack .proj{
    position:sticky;top:clamp(86px,11vh,110px);
    box-shadow:0 -14px 44px rgba(var(--ink-rgb),.2);
  }
  body.projets .proj-stack .proj + .proj{margin-top:clamp(24px,4.5vh,48px)}
}
