/* =============================================================
   CLINICAL STUDY v78 — SCIENCE-PAGE CONTINUITY + VISUAL POLISH
   The Clinical page now feels like the next chapter of Science:
   same typography, colour hierarchy, editorial rhythm and contrast,
   while keeping Clinical-specific data and participant storytelling.
   ============================================================= */

body.clinical-v78 {
  --v78-paper:#f7f2ec;
  --v78-paper-deep:#f1e9e0;
  --v78-ink:#242124;
  --v78-muted:#5a5652;
  --v78-red:#9e2437;
  --v78-gold:#e6b86f;
  --v78-dark:#141216;
  --v78-line:rgba(36,33,36,.12);
}

/* -------------------------------------------------------------
   1) SCIENCE-PAGE TYPOGRAPHY + CONTRAST
   ------------------------------------------------------------- */

body.clinical-v78 main > .section .section-heading h2,
body.clinical-v78 main > .section .programme__heading h2 {
  max-width:22ch !important;
  margin:0 !important;
  color:var(--v78-ink) !important;
  font-size:clamp(44px,4.6vw,68px) !important;
  font-weight:560 !important;
  line-height:1 !important;
  letter-spacing:-.055em !important;
  text-wrap:balance !important;
}

body.clinical-v78 main > .section .eyebrow {
  margin:0 0 14px !important;
  color:var(--v78-red) !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  letter-spacing:.145em !important;
  text-transform:uppercase !important;
}

body.clinical-v78 .programme__heading > p:last-child,
body.clinical-v78 .section-heading > p:last-child,
body.clinical-v78 .section-heading--split > p,
body.clinical-v78 .evidence-card p:last-child,
body.clinical-v78 .feedback-context > p:last-child,
body.clinical-v78 .trec-reading p,
body.clinical-v78 .findings-ribbon__intro > p:last-child,
body.clinical-v78 .findings-ribbon__items p {
  color:var(--v78-muted) !important;
}

/* Dark chapters: Science-page readability contract. */
body.clinical-v78 .journey .section-heading h2,
body.clinical-v78 .films .section-heading h2 {
  color:#fff !important;
}

body.clinical-v78 .journey .eyebrow,
body.clinical-v78 .films .eyebrow {
  color:var(--v78-gold) !important;
}

body.clinical-v78 .journey .section-heading--split > p,
body.clinical-v78 .films .section-heading--split > p,
body.clinical-v78 .journey-track p,
body.clinical-v78 .journey__footer p,
body.clinical-v78 .journey__measure span,
body.clinical-v78 .film-note p {
  color:rgba(255,255,255,.72) !important;
}

body.clinical-v78 .journey-track h3,
body.clinical-v78 .journey__footer strong,
body.clinical-v78 .film-note > div > span {
  color:#fff !important;
}

/* -------------------------------------------------------------
   2) PROGRAMME — IMAGE-LED EDITORIAL OPENING
   ------------------------------------------------------------- */

body.clinical-v78 .programme {
  background:linear-gradient(180deg,#fbf8f3 0%,var(--v78-paper) 100%) !important;
}

body.clinical-v78 .programme__grid {
  display:grid !important;
  grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr) !important;
  grid-template-areas:
    "heading heading"
    "media ledger"
    "support ledger" !important;
  column-gap:clamp(52px,6vw,92px) !important;
  row-gap:30px !important;
  align-items:start !important;
}

body.clinical-v78 .programme__heading {
  grid-area:heading !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr) !important;
  column-gap:clamp(44px,6vw,86px) !important;
  row-gap:14px !important;
  align-items:start !important;
  padding-bottom:46px !important;
  border-bottom:1px solid var(--v78-line) !important;
}

body.clinical-v78 .programme__heading .eyebrow {
  grid-column:1 / -1 !important;
  margin:0 !important;
}

body.clinical-v78 .programme__heading > p:last-child {
  margin:4px 0 0 !important;
  max-width:37ch !important;
  font-size:17px !important;
  line-height:1.62 !important;
}

body.clinical-v78 .programme__media-v78 {
  grid-area:media !important;
  margin:0 !important;
  overflow:hidden !important;
  aspect-ratio:4 / 3 !important;
  border-radius:18px !important;
  background:#e9dfd7 !important;
}

body.clinical-v78 .programme__media-v78 img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 47% !important;
}

body.clinical-v78 .protocol-ledger {
  grid-area:ledger !important;
  display:block !important;
  border-top:1px solid var(--v78-ink) !important;
  border-left:0 !important;
  background:transparent !important;
}

body.clinical-v78 .protocol-ledger article {
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:46px 1fr !important;
  gap:18px !important;
  padding:23px 0 !important;
  border:0 !important;
  border-bottom:1px solid var(--v78-line) !important;
  background:transparent !important;
  transition:none !important;
}

body.clinical-v78 .protocol-ledger article:hover {
  padding-left:0 !important;
  background:transparent !important;
}

body.clinical-v78 .protocol-ledger__index {
  display:grid !important;
  place-items:center !important;
  width:34px !important;
  height:34px !important;
  margin:0 !important;
  border:1px solid rgba(158,36,55,.24) !important;
  border-radius:50% !important;
  color:var(--v78-red) !important;
  background:transparent !important;
  font-size:10px !important;
  font-weight:800 !important;
}

body.clinical-v78 .protocol-ledger h3 {
  margin:0 !important;
  color:var(--v78-ink) !important;
  font-size:21px !important;
  line-height:1.18 !important;
  font-weight:590 !important;
  letter-spacing:-.028em !important;
}

body.clinical-v78 .protocol-ledger p {
  margin:6px 0 0 !important;
  color:var(--v78-muted) !important;
  font-size:14.5px !important;
  line-height:1.52 !important;
}

body.clinical-v78 .programme__support-v78 {
  grid-area:support !important;
  display:grid !important;
  grid-template-columns:minmax(150px,.42fr) minmax(0,1fr) !important;
  gap:28px !important;
  align-items:start !important;
  padding-top:24px !important;
  border-top:1px solid var(--v78-line) !important;
}

body.clinical-v78 .programme__number {
  grid-area:auto !important;
  align-self:start !important;
  padding:0 !important;
}

body.clinical-v78 .programme__number-label {
  display:block !important;
  margin:0 0 8px !important;
  color:var(--v78-red) !important;
  font-size:9.5px !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}

body.clinical-v78 .programme__number strong {
  display:block !important;
  margin:0 !important;
  color:var(--v78-ink) !important;
  font-size:66px !important;
  line-height:.88 !important;
  font-weight:500 !important;
  letter-spacing:-.07em !important;
}

body.clinical-v78 .programme__number > span:last-child {
  display:block !important;
  max-width:16ch !important;
  margin-top:10px !important;
  color:var(--v78-muted) !important;
  font-size:12px !important;
  line-height:1.4 !important;
}

body.clinical-v78 .interpretation-note {
  grid-area:auto !important;
  align-self:start !important;
  margin:0 !important;
  padding:0 0 0 24px !important;
  border:0 !important;
  border-left:1px solid var(--v78-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--v78-ink) !important;
}

body.clinical-v78 .interpretation-note > span {
  color:var(--v78-red) !important;
  font-size:9.5px !important;
}

body.clinical-v78 .interpretation-note p {
  margin:10px 0 0 !important;
  color:var(--v78-muted) !important;
  font-size:13.5px !important;
  line-height:1.55 !important;
}

body.clinical-v78 .interpretation-note strong {
  color:var(--v78-ink) !important;
}

/* -------------------------------------------------------------
   3) JOURNEY — CINEMATIC, HIGH-CONTRAST PROCESS CHAPTER
   ------------------------------------------------------------- */

body.clinical-v78 .journey {
  background:
    radial-gradient(circle at 82% 15%,rgba(158,36,55,.23),transparent 30%),
    radial-gradient(circle at 8% 96%,rgba(230,184,111,.065),transparent 30%),
    linear-gradient(135deg,#111014 0%,#191318 70%,#111014 100%) !important;
}

body.clinical-v78 .journey-track {
  margin-top:62px !important;
  border-top:1px solid rgba(230,184,111,.32) !important;
}

body.clinical-v78 .journey-track::before {
  background:linear-gradient(90deg,transparent,var(--v78-gold),var(--v78-red),var(--v78-gold),transparent) !important;
  opacity:.8 !important;
}

body.clinical-v78 .journey-track li {
  min-height:220px !important;
  padding-top:46px !important;
  border-right:1px solid rgba(255,255,255,.09) !important;
}

body.clinical-v78 .journey-track__number {
  color:var(--v78-gold) !important;
  font-size:10px !important;
}

body.clinical-v78 .journey-track h3 {
  font-size:19px !important;
  line-height:1.2 !important;
}

body.clinical-v78 .journey-track p {
  font-size:13.5px !important;
  line-height:1.55 !important;
}

body.clinical-v78 .journey__footer {
  border-top-color:rgba(255,255,255,.12) !important;
}

/* -------------------------------------------------------------
   4) EVIDENCE — SCIENCE-LIKE EDITORIAL COLUMNS, NOT CARDS
   ------------------------------------------------------------- */

body.clinical-v78 .evidence,
body.clinical-v78 .trec,
body.clinical-v78 .feedback {
  background:var(--v78-paper) !important;
}

body.clinical-v78 .evidence__layout {
  grid-template-columns:minmax(300px,.62fr) minmax(0,1.38fr) !important;
  gap:clamp(54px,7vw,104px) !important;
}

body.clinical-v78 .evidence__heading > p:last-child {
  margin-top:24px !important;
  color:var(--v78-muted) !important;
  font-size:17px !important;
  line-height:1.62 !important;
}

body.clinical-v78 .evidence-strip {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  grid-template-rows:auto auto !important;
  border-top:1px solid var(--v78-ink) !important;
  border-bottom:1px solid var(--v78-line) !important;
  background:transparent !important;
}

body.clinical-v78 .evidence-hub {
  order:-1 !important;
  grid-column:1 / -1 !important;
  grid-row:1 !important;
  padding:17px 0 16px !important;
  border-bottom:1px solid var(--v78-line) !important;
  color:var(--v78-red) !important;
}

body.clinical-v78 .evidence-card {
  grid-row:2 !important;
  min-height:260px !important;
  padding:30px 27px 32px !important;
  border:0 !important;
  border-right:1px solid var(--v78-line) !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.clinical-v78 .evidence-card:last-child {
  border-right:0 !important;
}

body.clinical-v78 .evidence-card__icon {
  width:32px !important;
  height:32px !important;
  border-color:rgba(158,36,55,.22) !important;
  color:var(--v78-red) !important;
  font-size:13px !important;
}

body.clinical-v78 .evidence-stack__type {
  color:var(--v78-red) !important;
  font-size:9.5px !important;
  letter-spacing:.11em !important;
}

body.clinical-v78 .evidence-card h3 {
  margin:10px 0 0 !important;
  color:var(--v78-ink) !important;
  font-size:22px !important;
  line-height:1.16 !important;
}

body.clinical-v78 .evidence-card p:last-child {
  margin-top:13px !important;
  color:var(--v78-muted) !important;
  font-size:14.5px !important;
  line-height:1.56 !important;
}

/* -------------------------------------------------------------
   5) TREC — GRAPH AS THE EDITORIAL CENTREPIECE
   Small labels, strong data, generous whitespace.
   ------------------------------------------------------------- */

body.clinical-v78 .trec__summary {
  margin-top:48px !important;
  border-top:1px solid var(--v78-ink) !important;
  border-bottom:1px solid var(--v78-line) !important;
}

body.clinical-v78 .trec__summary p {
  padding-top:22px !important;
  padding-bottom:22px !important;
}

body.clinical-v78 .trec__summary span {
  color:var(--v78-red) !important;
  font-size:9px !important;
  letter-spacing:.11em !important;
}

body.clinical-v78 .trec__summary strong {
  color:var(--v78-ink) !important;
  font-size:14px !important;
  line-height:1.5 !important;
}

body.clinical-v78 .trec-chart {
  margin:54px 0 0 !important;
  padding:34px 0 30px !important;
  border:0 !important;
  border-top:1px solid var(--v78-line) !important;
  border-bottom:1px solid var(--v78-line) !important;
  border-radius:0 !important;
  background:rgba(255,255,255,.28) !important;
  box-shadow:none !important;
}

body.clinical-v78 .trec-chart__header {
  padding:0 4px 24px !important;
  border-bottom:1px solid var(--v78-line) !important;
}

body.clinical-v78 .chart-kicker {
  margin-bottom:8px !important;
  color:var(--v78-red) !important;
  font-size:9.5px !important;
  font-weight:800 !important;
  letter-spacing:.12em !important;
}

body.clinical-v78 .trec-chart__header h3 {
  color:var(--v78-ink) !important;
  font-size:24px !important;
  line-height:1.18 !important;
  letter-spacing:-.035em !important;
  font-weight:590 !important;
}

body.clinical-v78 .trec-chart__legend {
  gap:16px !important;
  color:#6d6763 !important;
  font-size:9.5px !important;
  font-weight:720 !important;
  letter-spacing:.075em !important;
}

body.clinical-v78 .trec-chart__scale {
  color:#77706b !important;
  font-size:9px !important;
}

body.clinical-v78 .bar b {
  font-size:9px !important;
  font-weight:720 !important;
  color:#625d59 !important;
}

body.clinical-v78 .bar--booster b {
  color:var(--v78-red) !important;
}

body.clinical-v78 .age-group__label {
  padding-top:12px !important;
}

body.clinical-v78 .age-group__label strong {
  color:var(--v78-ink) !important;
  font-size:12.5px !important;
  font-weight:650 !important;
}

body.clinical-v78 .age-group__label span {
  margin-top:3px !important;
  color:var(--v78-red) !important;
  font-size:9.5px !important;
  font-weight:800 !important;
}

body.clinical-v78 .age-group__flag {
  padding:4px 7px !important;
  font-size:7.5px !important;
  letter-spacing:.08em !important;
}

body.clinical-v78 .trec-chart figcaption {
  margin-top:18px !important;
  color:#6d6763 !important;
  font-size:11.5px !important;
  line-height:1.5 !important;
}

body.clinical-v78 .trec-reading {
  margin-top:28px !important;
  grid-template-columns:42px 1fr !important;
  gap:20px !important;
  padding:25px 0 !important;
  border:0 !important;
  border-bottom:1px solid var(--v78-line) !important;
  border-radius:0 !important;
}

body.clinical-v78 .trec-reading__mark {
  color:var(--v78-red) !important;
  font-size:48px !important;
}

body.clinical-v78 .trec-reading h3 {
  color:var(--v78-ink) !important;
  font-size:20px !important;
}

body.clinical-v78 .trec-reading p {
  color:var(--v78-muted) !important;
  font-size:14.5px !important;
  line-height:1.57 !important;
}

/* Findings ribbon remains a dark evidence checkpoint but gains readable contrast. */
body.clinical-v78 .findings-ribbon {
  border-radius:16px !important;
  background:linear-gradient(135deg,#171317,#21171c) !important;
}

body.clinical-v78 .findings-ribbon__intro > p:last-child,
body.clinical-v78 .findings-ribbon__items p {
  color:rgba(255,255,255,.70) !important;
}

body.clinical-v78 .findings-ribbon__items h4,
body.clinical-v78 .findings-ribbon__intro h3 {
  color:#fff !important;
}

/* -------------------------------------------------------------
   6) OUTCOMES — CLEANER VISUAL HIERARCHY
   ------------------------------------------------------------- */

body.clinical-v78 .feedback__grid {
  grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr) !important;
  column-gap:clamp(56px,7vw,104px) !important;
}

body.clinical-v78 .feedback__heading > p:last-child {
  margin-top:24px !important;
  color:var(--v78-muted) !important;
  font-size:16.5px !important;
  line-height:1.6 !important;
}

body.clinical-v78 .questionnaire-structure {
  padding-bottom:24px !important;
  border-bottom:1px solid var(--v78-line) !important;
}

body.clinical-v78 .questionnaire-structure strong {
  color:var(--v78-ink) !important;
  font-size:clamp(40px,4vw,58px) !important;
}

body.clinical-v78 .questionnaire-structure span {
  color:#6d6763 !important;
  font-size:9.5px !important;
}

body.clinical-v78 .outcome {
  padding:18px 0 !important;
  border-bottom:1px solid var(--v78-line) !important;
}

body.clinical-v78 .outcome span {
  color:var(--v78-ink) !important;
  font-size:15px !important;
}

body.clinical-v78 .outcome strong {
  color:var(--v78-red) !important;
  font-size:26px !important;
}

body.clinical-v78 .outcome i {
  height:3px !important;
  margin-top:12px !important;
  background:#e6ddd5 !important;
}

body.clinical-v78 .outcome i::after {
  background:var(--v78-red) !important;
}

body.clinical-v78 .feedback-context {
  padding-top:22px !important;
  border-top:1px solid var(--v78-line) !important;
}

body.clinical-v78 .feedback-context > p:last-child {
  color:var(--v78-muted) !important;
  font-size:14.5px !important;
  line-height:1.57 !important;
}

/* -------------------------------------------------------------
   7) FILMS — STRONGER READABILITY + CLEANER HUMAN ENDING
   ------------------------------------------------------------- */

body.clinical-v78 .films {
  background:
    radial-gradient(circle at 15% 15%,rgba(158,36,55,.15),transparent 26%),
    linear-gradient(135deg,#151216,#1d171b) !important;
}

body.clinical-v78 .film-card__caption span,
body.clinical-v78 .film-card__caption strong,
body.clinical-v78 .film-card__index,
body.clinical-v78 .film-card__platform {
  color:#fff !important;
}

body.clinical-v78 .film-card__caption span {
  opacity:.82 !important;
}

body.clinical-v78 .film-card__wash {
  background:linear-gradient(180deg,rgba(12,10,12,.03) 28%,rgba(12,10,12,.72) 100%) !important;
}

body.clinical-v78 .film-card__body {
  background:#fbf8f3 !important;
}

body.clinical-v78 .film-card__body h3 {
  color:var(--v78-ink) !important;
  font-size:29px !important;
}

body.clinical-v78 .film-card__body p {
  color:var(--v78-muted) !important;
  font-size:14.5px !important;
  line-height:1.57 !important;
}

body.clinical-v78 .film-card__meta,
body.clinical-v78 .film-card__action {
  color:var(--v78-red) !important;
}

body.clinical-v78 .film-note {
  border-color:rgba(255,255,255,.13) !important;
}

body.clinical-v78 .film-note p {
  color:rgba(255,255,255,.72) !important;
}

/* -------------------------------------------------------------
   RESPONSIVE — preserve the Science relationship without
   forcing desktop editorial geometry onto small screens.
   ------------------------------------------------------------- */

@media (max-width:1020px) {
  body.clinical-v78 .programme__grid {
    grid-template-columns:1fr !important;
    grid-template-areas:
      "heading"
      "media"
      "ledger"
      "support" !important;
    row-gap:32px !important;
  }

  body.clinical-v78 .programme__heading {
    grid-template-columns:1fr !important;
    row-gap:0 !important;
    padding-bottom:36px !important;
  }

  body.clinical-v78 .programme__heading .eyebrow {
    margin-bottom:14px !important;
  }

  body.clinical-v78 .programme__heading > p:last-child {
    margin-top:22px !important;
  }

  body.clinical-v78 .programme__support-v78 {
    grid-template-columns:minmax(140px,.4fr) 1fr !important;
  }

  body.clinical-v78 .evidence__layout,
  body.clinical-v78 .feedback__grid {
    grid-template-columns:1fr !important;
  }

  body.clinical-v78 .evidence-strip {
    margin-top:4px !important;
  }

  body.clinical-v78 .journey-track li {
    min-height:190px !important;
  }
}

@media (max-width:760px) {
  body.clinical-v78 main > .section .section-heading h2,
  body.clinical-v78 main > .section .programme__heading h2 {
    font-size:clamp(38px,10.5vw,52px) !important;
  }

  body.clinical-v78 .programme__media-v78 {
    border-radius:14px !important;
  }

  body.clinical-v78 .programme__support-v78 {
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  body.clinical-v78 .interpretation-note {
    padding:20px 0 0 !important;
    border-left:0 !important;
    border-top:1px solid var(--v78-line) !important;
  }

  body.clinical-v78 .evidence-strip {
    grid-template-columns:1fr !important;
    grid-template-rows:auto !important;
  }

  body.clinical-v78 .evidence-hub,
  body.clinical-v78 .evidence-card {
    grid-column:1 !important;
    grid-row:auto !important;
  }

  body.clinical-v78 .evidence-card {
    min-height:0 !important;
    padding:25px 0 !important;
    border-right:0 !important;
    border-bottom:1px solid var(--v78-line) !important;
  }

  body.clinical-v78 .trec-chart {
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.clinical-v78 .trec-chart__header h3 {
    font-size:21px !important;
  }

  body.clinical-v78 .trec-chart__legend {
    font-size:9px !important;
  }

  body.clinical-v78 .age-group__label strong {
    font-size:12px !important;
  }

  body.clinical-v78 .age-group__label span {
    font-size:9px !important;
  }

  body.clinical-v78 .film-card__body h3 {
    font-size:27px !important;
  }
}