/* ===== Page /pedigree-et-adn/ ===== */

.page-head{background:var(--ink-deep,oklch(19% .008 159));padding:clamp(2.5rem,6vw,5rem) 0 clamp(2.25rem,5vw,3.5rem);border-bottom:1px solid var(--color-hairline-dark)}
.page-head .crumb{font:600 13px/1 var(--font-display);color:var(--color-ink-text-soft);letter-spacing:.02em;margin-bottom:1.1rem}
.page-head .crumb a{color:var(--color-accent);text-decoration:none}
.page-head h1{font-size:clamp(2.2rem,5.5vw,3.9rem);line-height:1.02;color:var(--color-paper);letter-spacing:-.02em;max-width:20ch}
.page-head .lede{font-size:clamp(1.02rem,1.4vw,1.32rem);line-height:1.6;color:var(--color-ink-text-soft);max-width:72ch;margin-top:1.2rem}
.page-head .actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.7rem}

/* ===== La chaine de preuve : volets alternes, raisonnement collant =====
   La colonne media (photo 3/4 + fiche) est plus haute que la colonne texte :
   c'est cette difference qui donne sa course au collant. */
.volets{display:grid;gap:clamp(2.5rem,6vw,4.5rem)}
.volet{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.volet+.volet{padding-top:clamp(2.5rem,6vw,4.5rem);border-top:1px solid var(--color-hairline)}
.volet--r .volet__media{order:-1}

.volet__txt{position:sticky;top:7.5rem;align-self:start;padding-top:.35rem}
.pv__step{display:flex;align-items:baseline;gap:.75rem;margin-bottom:1rem}
.pv__num{font:700 clamp(2.6rem,5vw,4.2rem)/.8 var(--font-display);color:transparent;-webkit-text-stroke:1.5px var(--color-accent);letter-spacing:-.03em}
.pv__lab{font:600 12.5px/1 var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent-dark)}
.volet__txt h2{font-size:clamp(1.5rem,2.6vw,2.05rem);line-height:1.14;color:var(--color-ink);letter-spacing:-.015em;scroll-margin-top:7.5rem}
.volet__txt p{font-size:clamp(1rem,1.25vw,1.1rem);line-height:1.68;color:var(--color-body);margin-top:.85rem;max-width:52ch}
.volet__txt p a:not(.btn){color:var(--color-accent-dark)}
.volet__txt .ph{color:var(--color-muted);font-style:italic}

.volet__media{display:grid;gap:clamp(1rem,2vw,1.5rem)}
.volet__media figure{position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--color-paper-3);margin:0}
.volet__media figure img{width:100%;height:100%;object-fit:cover;display:block}
.volet__media figcaption{position:absolute;left:0;bottom:0;z-index:2;background:var(--color-caption-veil);color:var(--color-paper);font:600 12.5px/1 var(--font-display);padding:.5rem .8rem}

.fiche{background:var(--color-ink);color:var(--color-paper);padding:clamp(1.15rem,2vw,1.6rem)}
.fiche dl{margin:0}
.fiche dt{font:600 11.5px/1 var(--font-display);letter-spacing:.13em;text-transform:uppercase;color:var(--color-accent)}
.fiche dd{margin:.5rem 0 0;font-size:14.5px;line-height:1.55;color:var(--color-ink-text-soft)}
.fiche dd+dt{margin-top:1.05rem;padding-top:1.05rem;border-top:1px solid var(--color-hairline-dark)}
.fiche dt.is-off{color:var(--color-ink-text-soft);opacity:.78}
.fiche .ph{color:var(--color-accent);font-style:italic}

@media(max-width:60rem){
  .volet{grid-template-columns:1fr}
  .volet--r .volet__media{order:0}
  .volet__txt{position:static;top:auto}
  .volet__txt p{max-width:none}
  .volet__media figure{aspect-ratio:4/3}
}
/* Ecran court : un texte plus haut que la fenetre ne doit pas se retrouver tronque. */
@media(max-height:44rem) and (min-width:60.0625rem){.volet__txt{position:static}}
@media(prefers-reduced-motion:reduce){.volet__txt{position:static}}

/* Grille des 4 preuves detaillees (reprend le langage visuel des .logo-tile de l'accueil) */
.preuve-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2vw,1.5rem);margin-top:clamp(1.75rem,4vw,2.5rem)}
.preuve-card{background:var(--color-paper);border-radius:16px;padding:clamp(1.5rem,2.5vw,2rem);scroll-margin-top:7.5rem}
.preuve-card__img{height:56px;display:flex;align-items:center;margin-bottom:1rem}
.preuve-card__img img{max-height:100%;width:auto}
.preuve-card h3{font-size:1.25rem;color:var(--color-ink);margin-bottom:.35rem}
.preuve-card__role{display:inline-block;font:600 11.5px/1 var(--font-display);letter-spacing:.03em;text-transform:uppercase;color:var(--color-accent-dark);margin-bottom:.9rem}
.preuve-card p{font-size:14.5px;line-height:1.6;color:var(--color-body)}
@media(max-width:48rem){.preuve-grid{grid-template-columns:1fr}}