/* Give prototype research the same canvas and type roles as the main story.
   Canonical FnS only: content, evidence, source crops and order stay unchanged. */
.fns-case-study #research {
  --research-block-gap: clamp(88px, 8vw, 112px);
  --research-column-gap: clamp(32px, 4vw, 56px);
  max-width: 1240px;
  padding-inline: 0;
}

.fns-case-study #research :is(.story-walkthrough, .fns-research-intro,
    .case-research-board, .story-recordings, .fns-paired-findings) {
  max-width: none;
}

/* These introduce new story beats, not individual findings. Keep the shared
   section-title size; the panel and finding titles remain shared subheads. */
.fns-case-study #main-content #research.fns-prototype-research
    :is(.story-recordings > h3, .fns-paired-findings > header h3) {
  font-size: var(--fns-title);
  line-height: 1.16;
  font-weight: 650;
  letter-spacing: -.03em;
  text-wrap: balance;
}
.fns-case-study #main-content #research.fns-prototype-research
    :is(.case-research-positive h3, .story-finding-stat h4) {
  font-size: var(--fns-subhead);
}
/* Findings are a compact follow-on to the interviews, not another large reveal. */
.fns-case-study #main-content #research.fns-prototype-research
    .fns-paired-findings > header h3 {
  font-size: min(var(--fns-title), 2rem);
}

/* One column rhythm for the result, interview films and tested screens. */
.fns-case-study #research :is(.case-research-board, .case-interview-players,
    .fns-paired-findings) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--research-column-gap);
}
.fns-case-study #research .case-research-board {
  margin-block: 48px 0;
}
.fns-case-study #research .case-preference { gap: 24px; }
.fns-case-study #research .case-preference strong.case-ratio {
  font-size: clamp(5rem, 8.8vw, 7rem);
}
.fns-case-study #research .fns-preference-thumb {
  width: clamp(80px, 8vw, 112px);
}
.fns-case-study #research .fns-preference-copy > p {
  max-width: 27ch;
  margin-top: 16px;
}
.fns-case-study #research .case-research-positive {
  padding: 32px;
}
.fns-case-study #research .case-research-positive ul { gap: 16px; }

/* Keep the sessions close to their summary; the tested details stay compact. */
.fns-case-study #research .story-recordings { margin-top: 56px; }
.fns-case-study #research .case-interview-players { margin-top: 36px; }
.fns-case-study #research .story-recordings + .fns-paired-findings { margin-top: 72px; }
.fns-case-study #research .fns-paired-findings { row-gap: 28px; }
.fns-case-study #research .story-visual-finding { gap: 16px; }
.fns-case-study #research .story-visual-finding figure {
  max-width: 360px;
  align-self: flex-start;
}
.fns-case-study #research .fns-finding-fix p { max-width: 44ch; }

@media (max-width: 767px) {
  .fns-case-study #research {
    --research-block-gap: 64px;
    --research-column-gap: 24px;
  }
  .fns-case-study #research :is(.case-research-board, .case-interview-players,
      .fns-paired-findings) {
    grid-template-columns: minmax(0, 1fr);
  }
  .fns-case-study #research .case-research-board {
    margin-top: 32px;
    row-gap: 32px;
  }
  .fns-case-study #research .case-preference { gap: 16px; }
  .fns-case-study #research .case-preference strong.case-ratio { font-size: 4rem; }
  .fns-case-study #research .fns-preference-thumb { width: 80px; }
  .fns-case-study #research .fns-preference-copy > p { margin-top: 10px; }
  .fns-case-study #research .case-research-positive { padding: 24px; }
  .fns-case-study #research .story-recordings { margin-top: 40px; }
  .fns-case-study #research .case-interview-players {
    margin-top: 28px;
    row-gap: 24px;
  }
  .fns-case-study #research .story-recordings + .fns-paired-findings { margin-top: 56px; }
  .fns-case-study #research .fns-paired-findings { row-gap: 32px; }
  .fns-case-study #research .story-visual-finding { gap: 16px; }
}
