/* Final preservation pass: trim only the loose chapter joins, not the hero or
   the intentional space inside product illustrations. About stays untouched. */
@media (min-width: 901px) {
  .search-case-study :is(#the-idea, #search-evidence, #search-research, #old-search,
    #customer-needs, #search-experience, #search-recovery, #search-final-flow,
    #search-next-learning) { padding-block: 92px; }
  .mutton-case-study #design-problem { padding-block: 88px 106px; }
  .mutton-case-study #mutton-experience { padding-top: 84px; }
  .mutton-case-study #chefs-pick { padding-bottom: 88px; }
  .mutton-case-study #delivery { padding-top: 92px; }
  .fns-outcome-story #the-experience { padding-top: 84px; }
  .freshness-case-study :is(#the-reframe, #the-direction, #arriving-at-the-solution,
    #freshness-proof, #freshness-time, #freshness-process, #freshness-senses) { padding-block: 56px; }
  .sensei-case-study :is(#context, #video-tips, #assisted-creation, #team-review,
    #outcomes, #the-experience) { padding-bottom: 70px; }
  .sensei-case-study :is(#video-tips, #assisted-creation, #team-review,
    #outcomes, #the-experience) { padding-top: 70px; }
  .gaming-case-study .game-section { padding-block: 88px; }
}

/* Match the existing portfolio's type roles and annotation colour. Retain
   survey qualifiers, labels and proportional time bars exactly as supplied. */
.sensei-case-study :is(.case-handwriting, .sensei-principle-word) {
  font-family: "Bradley Hand", "Segoe Print", "Comic Sans MS", cursive;
  color: var(--case-blue-ink);
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: .01em;
}
.sensei-case-study :is(.sensei-decision-copy, .sensei-ai-explanation) > p:not(.case-kicker):not(.case-handwriting),
.sensei-case-study .sensei-tip-topics dd {
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--case-muted);
  max-width: 46ch;
}
.sensei-case-study :is(.sensei-survey-numeral, .sensei-time-result strong,
  .sensei-business-results dd, .sensei-activity dd) {
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -.025em;
  font-weight: 650;
}
.sensei-case-study :is(.sensei-time-after strong, .sensei-survey-numeral) { color: var(--case-blue-ink); }
.sensei-case-study :is(.sensei-time-result > div > span, .sensei-business-results dt,
  .sensei-activity dt, .sensei-survey-question) { font-size: .9375rem; line-height: 1.5; }
.sensei-case-study :is(.sensei-result-note, .sensei-survey-note, .sensei-demo-qualification,
  .sensei-gallery-note) { font-size: .875rem; line-height: 1.6; }
.sensei-case-study .sensei-business-results dd { font-size: clamp(2rem, 3.7vw, 3.2rem); }
.sensei-case-study .sensei-time-result strong { font-size: clamp(5rem, 10vw, 8rem); }
.sensei-case-study .sensei-survey-mark { color: var(--case-blue-ink); opacity: .7; }
@media (max-width: 767px) {
  .sensei-case-study :is(.sensei-decision-copy, .sensei-ai-explanation) > p:not(.case-kicker):not(.case-handwriting),
  .sensei-case-study .sensei-tip-topics dd { font-size: 1rem; }
  .sensei-case-study .sensei-time-result strong { font-size: clamp(4rem, 16vw, 6rem); }
}

.showcase-youtube {
  position: relative; display: block; overflow: hidden; isolation: isolate;
  aspect-ratio: 16 / 9; border-radius: 18px; background: #17151d; color: #fff;
  text-decoration: none;
}
.showcase-youtube img { width: 100%; height: 100%; object-fit: cover; }
.showcase-youtube > span {
  position: absolute; inset: 45% 0 0; display: flex; flex-direction: column;
  justify-content: flex-end; gap: 6px; padding: 24px;
  background: linear-gradient(transparent, rgb(12 10 20 / 85%));
  font-size: 1rem; line-height: 1.4;
}
.showcase-youtube small { font-size: .75rem; font-weight: 400; }
.showcase-youtube:focus-visible { outline: 3px solid var(--portfolio-purple); outline-offset: 5px; }
.showcase-youtube:hover > span { text-decoration: underline; }
.film-file-link { text-decoration: none; box-sizing: border-box; }
.film-file-link:focus-visible { outline: 3px solid var(--portfolio-purple); outline-offset: 4px; }
.showcase-fallback-host { position: relative; }
.showcase-poster-fallback {
  position: absolute; inset: 0; display: grid; place-items: center; border-radius: inherit;
  overflow: hidden; background: #fdfdfc;
}
.showcase-poster-fallback img { width: 100%; height: 100%; object-fit: contain; }
.showcase-poster-fallback button {
  position: absolute; bottom: 20px; max-width: calc(100% - 24px);
  padding: 10px 16px; min-height: 44px; border: 1px solid #d8d3df;
  border-radius: 24px; background: #fff; color: #151922; font: inherit;
  font-size: .875rem; cursor: pointer;
}
.showcase-poster-fallback button:focus-visible { outline: 3px solid var(--portfolio-purple); outline-offset: 3px; }

/* Small-screen repairs, verified in WebKit as well as Chromium. Keep the
   locked desktop compositions and all original case-study content intact. */
/* An absolutely positioned crop otherwise expands to its tall source image's
   intrinsic height in WebKit. Restore the intended crop at every Safari width;
   this matches the existing Chromium composition, including desktop. */
.mutton-selected-detail img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}
@media (max-width: 767px) {
  /* Long fades leave paragraphs pale during a normal thumb scroll. */
  .fns-case-study .case-can-reveal {
    transition-duration: .25s, .35s;
  }
}
@media (max-width: 600px) {
  /* These are product decisions to read, not thumbnail montages. */
  .fns-outcome-story .story-special-stage {
    grid-template-columns: minmax(0, 310px);
    gap: 40px;
  }
  .fns-outcome-story .story-special-stage figure:last-child { padding-top: 0; }
  .fns-outcome-story .story-trust-proof {
    grid-template-columns: minmax(0, 1fr);
    gap: 36px;
  }
  .fns-outcome-story .story-trust-proof figure:last-child {
    width: min(78%, 280px);
    justify-self: center;
  }
  .fns-outcome-story .story-production-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fns-outcome-story .story-production-wall figure:nth-child(n) { transform: none; }
  .fns-outcome-story .story-production-wall figcaption { font-size: .8125rem; }
}