/* =====================================================================
   PRÉMICES · Blog Preview C, La table des matières
   Grande LISTE éditoriale typographique, révélation d'image au survol.
   Charte Léonie Ory (crème/noir/rouge signature/or).
   Playfair Display (titres+numéros italiques), Manrope (fonctionnel),
   EB Garamond (méta intimes).
   Toutes classes préfixées .pbc- (aucune collision avec .pba-/.pbb-).
   ===================================================================== */

/* ---------- head ---------- */
.pbc-head{
  max-width:1140px;margin:0 auto;
  padding:clamp(120px,15vh,180px) var(--pad) clamp(56px,7vh,90px);
  display:flex;flex-direction:column;gap:1.4rem;text-align:center;align-items:center;
}
.pbc-head__eyebrow{
  font-family:var(--f-title);font-weight:600;font-size:.78rem;
  letter-spacing:.36em;text-transform:uppercase;color:var(--sig);
  display:inline-flex;align-items:center;gap:.9rem;
}
.pbc-head__eyebrow::before,
.pbc-head__eyebrow::after{content:'';width:34px;height:1px;background:var(--gold-ink)}
.pbc-head__title{
  font-family:var(--f-title);font-weight:500;
  font-size:clamp(2.8rem,7vw,6.4rem);line-height:.98;letter-spacing:-.012em;
}
.pbc-head__title em{font-style:italic;font-weight:400;color:var(--sig)}
.pbc-head__lead{
  font-family:var(--f-detail);font-style:italic;font-size:1.12rem;
  color:var(--text-soft);max-width:56ch;line-height:1.7;
}

/* ---------- filet séparateur or ---------- */
.pbc-filet{
  display:block;max-width:1140px;margin:0 auto;
  height:1px;background:linear-gradient(90deg,transparent,var(--gold-ink) 20%,var(--gold-ink) 80%,transparent);
  opacity:.55;
}

/* ---------- section rubrique ---------- */
.pbc-section{
  max-width:1240px;margin:0 auto;
  padding:clamp(56px,7vh,90px) var(--pad) 0;
}
.pbc-section__head{
  display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;
  padding-bottom:clamp(28px,4vh,44px);
  border-bottom:1px solid var(--line);
}
.pbc-section__label{
  font-family:var(--f-title);font-weight:600;font-size:.82rem;
  letter-spacing:.34em;text-transform:uppercase;color:var(--gold-ink);
}
.pbc-section__count{
  font-family:var(--f-detail);font-style:italic;font-size:1.05rem;
  color:var(--text-soft);
}

/* ---------- layout desktop : liste à gauche, panneau image sticky à droite ---------- */
.pbc-layout{
  display:grid;grid-template-columns:minmax(0,1fr) 360px;
  gap:clamp(40px,5vw,80px);align-items:start;
  padding-top:clamp(28px,4vh,44px);
}
.pbc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.pbc-panel{
  position:sticky;top:clamp(100px,12vh,140px);
  aspect-ratio:4/5;
  border:1px solid var(--line);background:var(--bg-2);
  overflow:hidden;
  transition:opacity .5s var(--ease);
}
.pbc-panel__inner{position:absolute;inset:0}
.pbc-panel__inner img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .55s var(--ease),transform 1.2s var(--ease);
  transform:scale(1.03);
}
.pbc-panel__inner.is-active img{opacity:1;transform:scale(1)}
.pbc-panel__caption{
  position:absolute;left:0;right:0;bottom:0;padding:1.2rem 1.4rem;
  background:linear-gradient(0deg,rgba(10,9,8,.72),rgba(10,9,8,0));
  color:var(--creme);
  font-family:var(--f-detail);font-style:italic;font-size:.9rem;line-height:1.5;
  opacity:0;transform:translateY(6px);transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.pbc-panel__inner.is-active .pbc-panel__caption{opacity:1;transform:translateY(0)}
.pbc-panel__placeholder{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:2rem;text-align:center;
  color:var(--text-soft);font-family:var(--f-detail);font-style:italic;font-size:.95rem;
}
.pbc-panel__placeholder::before{
  content:'';position:absolute;inset:16px;border:1px solid var(--gold-ink);opacity:.35;
  pointer-events:none;
}

/* ---------- ligne d'article ---------- */
.pbc-row{
  position:relative;
  display:grid;grid-template-columns:auto 1fr auto;
  gap:clamp(20px,3vw,44px);align-items:baseline;
  padding:clamp(22px,3vh,34px) 0;
  border-bottom:1px solid var(--line);
  transition:padding-left .45s var(--ease);
}
.pbc-row:last-child{border-bottom:0}
.pbc-row__num{
  font-family:var(--f-title);font-style:italic;font-weight:400;
  font-size:clamp(1.6rem,2.6vw,2.4rem);color:var(--gold-ink);
  line-height:1;letter-spacing:-.01em;
  min-width:2.4em;
  transition:color .35s var(--ease);
}
.pbc-row__body{min-width:0}
.pbc-row__title{
  font-family:var(--f-title);font-weight:500;
  font-size:clamp(1.55rem,3.1vw,2.6rem);line-height:1.08;letter-spacing:-.006em;
  color:var(--text);
  transition:color .35s var(--ease),transform .45s var(--ease);
  margin:0;
}
.pbc-row__title a{color:inherit}
.pbc-row__title a::after{
  content:'';display:inline-block;width:0;height:1px;background:var(--sig);
  vertical-align:middle;margin-left:.6rem;
  transition:width .45s var(--ease);
}
.pbc-row__meta{
  margin-top:.9rem;
  display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.2rem;
  font-family:var(--f-body);font-weight:500;font-size:.72rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--text-soft);
}
.pbc-row__cat{color:var(--sig);font-weight:600}
.pbc-row__dot{
  display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--gold-ink);
}
.pbc-row__cta{
  align-self:center;
  font-family:var(--f-body);font-weight:500;font-size:.72rem;
  letter-spacing:.26em;text-transform:uppercase;
  color:var(--text-soft);
  transition:color .35s var(--ease),transform .35s var(--ease);
  white-space:nowrap;
}
.pbc-row__cta::after{
  content:'\00a0→';transition:transform .35s var(--ease);display:inline-block;
}

/* ---------- hover desktop ---------- */
@media (hover:hover) and (min-width:961px){
  .pbc-row{cursor:pointer}
  .pbc-row:hover{padding-left:clamp(12px,1.6vw,26px)}
  .pbc-row:hover .pbc-row__title{color:var(--sig)}
  .pbc-row:hover .pbc-row__title a::after{width:56px}
  .pbc-row:hover .pbc-row__num{color:var(--sig)}
  .pbc-row:hover .pbc-row__cta{color:var(--sig)}
  .pbc-row:hover .pbc-row__cta::after{transform:translateX(4px)}
}

/* ---------- mobile ---------- */
@media (max-width:960px){
  .pbc-layout{grid-template-columns:1fr}
  .pbc-panel{display:none}
  .pbc-row{grid-template-columns:auto 1fr;gap:1rem 1.2rem;padding:1.4rem 0}
  .pbc-row__cta{grid-column:1 / -1;padding-top:.4rem}
  .pbc-row__num{font-size:1.4rem}
  .pbc-row__title{font-size:1.35rem;line-height:1.15}
  .pbc-row__meta{font-size:.68rem;gap:.5rem .9rem}
}

/* ---------- pied de page / lien final vers /blog ---------- */
.pbc-tail{
  max-width:1140px;margin:0 auto;
  padding:clamp(80px,10vh,140px) var(--pad) clamp(90px,12vh,160px);
  display:flex;flex-direction:column;align-items:center;gap:1.6rem;text-align:center;
}
.pbc-tail__rule{width:80px;height:1px;background:var(--gold-ink);opacity:.6;display:block}
.pbc-tail__note{
  font-family:var(--f-detail);font-style:italic;font-size:1.05rem;color:var(--text-soft);
  max-width:44ch;line-height:1.7;
}
.pbc-tail__cta{
  display:inline-flex;align-items:center;gap:.8rem;
  font-family:var(--f-body);font-weight:600;font-size:.78rem;
  letter-spacing:.28em;text-transform:uppercase;color:var(--sig);
  padding:.9rem 0;border-bottom:1px solid var(--sig);
  transition:color .3s var(--ease),border-color .3s var(--ease),gap .3s var(--ease);
}
.pbc-tail__cta:hover{color:var(--text);border-color:var(--text);gap:1.2rem}

/* ---------- empty state ---------- */
.pbc-empty{
  max-width:640px;margin:0 auto;
  padding:clamp(80px,10vh,140px) var(--pad);
  text-align:center;
}
.pbc-empty p{
  font-family:var(--f-detail);font-style:italic;font-size:1.15rem;
  color:var(--text-soft);line-height:1.7;
}

/* Motion respect */
@media (prefers-reduced-motion:reduce){
  .pbc-row,.pbc-row__title,.pbc-row__num,.pbc-row__cta,.pbc-panel__inner img,.pbc-panel__caption{
    transition:none !important;
  }
}