/* Interior pages: production, book, lab, press, press kit. One stylesheet,
   because they share a page head, an alternating media/copy block and a bio
   list — three components, not five pages of bespoke CSS. */

/* ── page hero (media-backed interior heads) ───────────────────────────── */
.pagehero {
  position: relative; margin-top: -68px; overflow: hidden;
  min-height: min(64svh, 560px);
  display: grid; align-items: end;
  padding-block: clamp(var(--s-9), 16vh, 170px) clamp(var(--s-7), 8vh, var(--s-8));
  background: var(--bg-sunk);
}
.pagehero__media { position: absolute; inset: 0; }
.pagehero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
.pagehero__scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, rgba(4,5,8,.90) 0px, rgba(4,5,8,.64) 92px, rgba(4,5,8,.24) 220px),
    linear-gradient(to top, rgba(4,5,8,.95) 0%, rgba(4,5,8,.72) 40%, rgba(4,5,8,.16) 82%);
}
.pagehero__in { position: relative; z-index: 2; display: grid; gap: var(--s-4); }
.pagehero h1 { font-size: clamp(30px, 4.4vw, 62px); max-width: 17ch; }
.pagehero .lede { max-width: 52ch; }

/* ── alternating discipline blocks ─────────────────────────────────────── */
.disc-list { display: grid; gap: clamp(var(--s-8), 8vw, var(--s-10)); }
.disc {
  display: grid; gap: clamp(var(--s-5), 4vw, var(--s-8));
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  align-items: center;
}
.disc--flip .disc__media { order: 2; }
.disc__media { overflow: hidden; border: 1px solid var(--line); border-radius: 3px; }
.disc__media img {
  width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 10;
  transition: transform 1.1s var(--ease-out);
}
.disc:hover .disc__media img { transform: scale(1.035); }
.disc__copy { display: grid; gap: var(--s-4); align-content: start; max-width: 54ch; }
.disc__copy h2 { font-size: clamp(23px, 2.6vw, 36px); max-width: 20ch; }
.disc__copy p { color: var(--ink-2); font-size: var(--t-sm); line-height: 1.65; }
.disc__copy a {
  color: var(--gold-ink); text-decoration: underline;
  text-decoration-color: var(--gold-line); text-underline-offset: 3px;
}
.disc__copy a:hover { text-decoration-color: var(--gold); }
/* Anything not shipped yet says so plainly rather than being quietly absent. */
.disc__pending {
  font-family: var(--font-display); font-size: var(--t-xs); font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink) !important;
  border-left: 2px solid var(--gold); padding-left: var(--s-3);
}

@media (max-width: 880px) {
  .disc { grid-template-columns: 1fr; }
  .disc--flip .disc__media { order: 0; }
}

/* ── book / lab two-up ─────────────────────────────────────────────────── */
.bookpage {
  display: grid; gap: clamp(var(--s-6), 5vw, var(--s-9));
  grid-template-columns: minmax(0, 1fr) minmax(0, .8fr);
  align-items: start;
}
.bookpage__figure { margin: 0; display: grid; gap: var(--s-3); position: sticky; top: 92px; }
.bookpage__figure img {
  width: 100%; border: 1px solid var(--line); border-radius: 3px;
}
.bookpage__figure figcaption { color: var(--ink-4); }
@media (max-width: 880px) {
  .bookpage { grid-template-columns: 1fr; }
  .bookpage__figure { position: static; grid-row: 1; }
}

/* ── bios ──────────────────────────────────────────────────────────────── */
.bio {
  display: grid; gap: var(--s-3);
  padding-bottom: var(--s-6); border-bottom: 1px solid var(--line);
}
.bio__text { max-width: var(--measure); color: var(--ink-2); line-height: 1.68; }
.creditlist {
  list-style: none; padding: 0; display: grid; gap: var(--s-2);
  max-width: var(--measure); color: var(--ink-2); font-size: var(--t-sm);
}
.creditlist li { padding-left: 1.1em; position: relative; }
.creditlist li::before { content: "—"; position: absolute; left: 0; color: var(--gold); }

/* ── about: portrait beside the prose ─────────────────────────────────── */
.about-split {
  display: grid; gap: clamp(var(--s-6), 5vw, var(--s-9));
  grid-template-columns: minmax(0, .8fr) minmax(0, 1fr);
  align-items: start;
}
.about-split__fig { margin: 0; position: sticky; top: 92px; }
.about-split__fig img {
  width: 100%; height: auto; border: 1px solid var(--line); border-radius: 3px;
}
@media (max-width: 880px) {
  .about-split { grid-template-columns: 1fr; }
  .about-split__fig { position: static; }
}

/* ── press: a stage frame above the head ──────────────────────────────── */
.press-hero {
  position: relative; margin: -68px 0 0; overflow: hidden;
  aspect-ratio: 16 / 7; max-height: 54svh; background: var(--bg-sunk);
}
.press-hero img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 32%; }
.press-hero__scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(to bottom, rgba(4,5,8,.88) 0px, rgba(4,5,8,.5) 110px, transparent 240px),
    linear-gradient(to top, var(--bg) 0%, rgba(4,5,8,.5) 38%, transparent 78%);
}