.story-overview {
  margin-top: 96px;
}

.story-intro-visual {
  width: min(calc(100% - 48px), var(--case-wide));
  margin: 96px auto 0;
}

.story-intro-visual img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 22px 28px rgba(5, 17, 51, 0.1));
}

.research-blockers {
  max-width: 680px;
  margin: 18px 0 0;
  padding-left: 1.2em;
  font-size: 20px;
  line-height: 1.55;
}

.research-blockers li + li {
  margin-top: 14px;
}

.research-blockers li::marker {
  color: rgba(5, 17, 51, 0.4);
}

.v1-comparison-grid {
  display: grid;
  grid-template-columns: minmax(0, 3192fr) minmax(0, 2900fr);
  gap: 24px;
  align-items: end;
}

.story-plate .v1-comparison-grid img {
  height: auto;
  aspect-ratio: auto;
}

.v1-comparison figcaption {
  margin-inline: auto;
  text-align: center;
}

.exploration-sequence {
  display: grid;
  gap: 72px;
}

.exploration-step {
  margin: 0;
}

.exploration-step img {
  filter: drop-shadow(0 22px 28px rgba(5, 17, 51, 0.08));
}

.exploration-step figcaption {
  margin-inline: auto;
  text-align: center;
}

.validation-figure {
  margin-top: 48px;
}

.craft-system {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(calc(100vw - 48px), var(--case-wide));
  margin: 48px 0;
  margin-left: calc((var(--case-body) - min(calc(100vw - 48px), var(--case-wide))) / 2);
  border-block: 1px solid var(--rule);
}

.craft-embed {
  margin-top: 48px;
}

.craft-embed iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--rule);
  border-radius: 16px;
  background: #fff;
}

.craft-embed figcaption {
  margin-inline: auto;
  text-align: center;
}

.craft-embed figcaption a {
  color: inherit;
  text-decoration-color: rgba(5, 17, 51, 0.28);
  text-underline-offset: 3px;
}

.craft-system article {
  min-width: 0;
  padding: 28px 28px 32px 0;
}

.craft-system article + article {
  padding-left: 28px;
  border-left: 1px solid var(--rule);
}

.craft-system .craft-system-index {
  margin: 0 0 28px;
  font-family: var(--serif);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}

.craft-system h3 {
  margin: 0 0 12px;
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.2;
}

.craft-system article > p:last-child {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

.reflection-notes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(calc(100vw - 48px), var(--case-wide));
  margin: 72px 0 0;
  margin-left: calc((var(--case-body) - min(calc(100vw - 48px), var(--case-wide))) / 2);
  border-block: 1px solid var(--rule);
}

.reflection-notes article {
  min-width: 0;
  padding: 28px 28px 32px 0;
}

.reflection-notes article + article {
  padding-left: 28px;
  border-left: 1px solid var(--rule);
}

.closing-reflection .reflection-note-label {
  margin: 0 0 24px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
}

.reflection-notes h3 {
  margin: 0 0 12px;
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.2;
}

.story-version .case-footer {
  border-top: 0;
}

.closing-reflection .reflection-notes article > p:last-child {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}

.video-library {
  width: min(calc(100vw - 48px), var(--case-wide));
  margin: 120px 0 0 50%;
  transform: translateX(-50%);
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.video-card {
  min-width: 0;
}

.video-card iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(5, 17, 51, 0.08);
}

.video-card h3 {
  margin: 20px 0 8px;
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.25;
}

.video-card p {
  max-width: 430px;
  margin: 0;
  color: rgba(5, 17, 51, 0.7);
  font-size: 15px;
  line-height: 1.55;
}

.video-library + .outcome-divider {
  margin-top: 96px;
}

@media (max-width: 767px) {
  .story-overview {
    margin-top: 72px;
  }

  .research-blockers {
    font-size: 18px;
    line-height: 1.5;
  }

  .exploration-sequence {
    gap: 52px;
  }

  .v1-comparison-grid {
    grid-template-columns: 1fr;
  }

  .video-grid {
    grid-template-columns: 1fr;
  }

  .story-intro-visual {
    width: calc(100% - 32px);
    margin-top: 72px;
  }

  .craft-system {
    grid-template-columns: 1fr;
    width: auto;
    margin: 36px 0;
  }

  .craft-system article,
  .craft-system article + article {
    padding: 24px 0 26px;
    border-left: 0;
  }

  .craft-system article + article {
    border-top: 1px solid var(--rule);
  }

  .craft-system .craft-system-index {
    margin-bottom: 16px;
  }

  .reflection-notes {
    grid-template-columns: 1fr;
    width: calc(100vw - 32px);
    margin-top: 56px;
    margin-left: calc((var(--case-body) - (100vw - 32px)) / 2);
  }

  .reflection-notes article,
  .reflection-notes article + article {
    padding: 24px 0 26px;
    border-left: 0;
  }

  .reflection-notes article + article {
    border-top: 1px solid var(--rule);
  }

  .video-library {
    width: calc(100vw - 32px);
    margin-top: 88px;
  }

  .video-grid {
    gap: 56px;
  }

  .video-card iframe {
    border-radius: 12px;
  }

  .video-library + .outcome-divider {
    margin-top: 72px;
  }
}