.story-context {
  padding: 96px 0 112px;
  border-top: 2px solid var(--ink);
}

.story-context h2,
.story-context h3 {
  color: var(--ink);
  letter-spacing: -.035em;
  text-wrap: balance;
}

.story-context h2 {
  margin: 0;
  font-size: clamp(2.25rem, 4.6vw, 4.1rem);
  line-height: 1.18;
}

.story-context h3 {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 2.05rem);
  line-height: 1.3;
}

.story-context-introduction { background: #fff; }

.story-context-editorial {
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  align-items: start;
  gap: 76px;
}

.story-context-editorial > header {
  position: sticky;
  top: 108px;
}

.story-context-editorial > header p {
  max-width: 38ch;
  margin: 22px 0 0;
  color: #4b4b4b;
  line-height: 1.8;
  text-wrap: pretty;
}

.story-context-narrative {
  margin: 0;
  border-top: 2px solid var(--ink);
}

.story-context-narrative > div {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr);
  gap: 26px;
  padding: 26px 0 28px;
  border-bottom: 1px solid #9d9d98;
}

.story-context-narrative dt {
  color: var(--ink);
  font-size: .84rem;
  font-weight: 850;
}

.story-context-narrative dd {
  max-width: 68ch;
  margin: 0;
  color: #303030;
  font-size: 1rem;
  line-height: 1.9;
  text-wrap: pretty;
}

.story-context-scope { background: #fff; }

.story-context-scope-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 2px solid var(--ink);
  border-radius: 14px;
  overflow: hidden;
}

.story-context-scope-columns > section {
  min-width: 0;
  padding: 32px;
}

.story-context-scope-columns > section + section {
  border-left: 2px solid var(--ink);
  background: var(--soft);
}

.story-context-scope-columns ul,
.story-current-status ul,
.story-qualification-layout ul,
.story-qualification-layout ol {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.story-context-scope-columns li,
.story-current-status li,
.story-qualification-layout li {
  position: relative;
  padding: 12px 0 12px 30px;
  border-top: 1px solid #aaa;
  color: #303030;
  line-height: 1.7;
  text-wrap: pretty;
}

.story-context-scope-columns li::before,
.story-current-status li::before,
.story-qualification-layout ul li::before {
  content: "✓";
  position: absolute;
  left: 2px;
  top: 12px;
  font-weight: 900;
}

.story-context-evidence { background: var(--yellow); }

.story-context-evidence-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, .75fr);
  align-items: start;
  gap: 78px;
}

.story-evidence-results > dl {
  margin: 32px 0 0;
  border-top: 2px solid var(--ink);
}

.story-evidence-results > dl > div {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  gap: 22px;
  padding: 22px 0;
  border-bottom: 1px solid var(--ink);
}

.story-evidence-results dt {
  align-self: center;
  font-size: .84rem;
  font-weight: 850;
}

.story-evidence-results dd { margin: 0; }
.story-evidence-results strong,
.story-evidence-results small { display: block; }
.story-evidence-results strong { font-size: clamp(1.35rem, 2.6vw, 2rem); line-height: 1.35; }
.story-evidence-results small { margin-top: 3px; color: #404030; font-size: .72rem; font-weight: 750; }

.story-evidence-note {
  max-width: 67ch;
  margin: 20px 0 0;
  color: #3a3a2d;
  font-size: .8rem;
  line-height: 1.75;
}

.story-current-status {
  padding: 30px;
  border: 2px solid var(--ink);
  border-radius: 14px;
  background: #fff;
}

.story-current-status > p {
  margin: 18px 0 0;
  color: #3d3d3d;
  line-height: 1.85;
  text-wrap: pretty;
}

.story-current-status li { font-size: .9rem; }

.story-context-qualification { background: var(--soft); }

.story-qualification-layout {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}

.story-qualification-layout > section {
  min-width: 0;
  padding: 32px 34px 34px 0;
}

.story-qualification-layout > section + section {
  padding-right: 0;
  padding-left: 34px;
  border-left: 2px solid var(--ink);
}

.story-qualification-layout ol { counter-reset: story-question; }
.story-qualification-layout ol li { padding-left: 42px; counter-increment: story-question; }
.story-qualification-layout ol li::before {
  content: counter(story-question, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 12px;
  color: #555;
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
}

@media (max-width: 840px) {
  .story-context-editorial,
  .story-context-evidence-layout {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .story-context-editorial > header { position: static; }
}

@media (max-width: 620px) {
  .story-context { padding: 68px 0 78px; }
  .story-context h2 { font-size: clamp(2.1rem, 10vw, 3rem); }

  .story-context-narrative > div {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 20px 0 22px;
  }

  .story-context-scope-columns,
  .story-qualification-layout { grid-template-columns: 1fr; }

  .story-context-scope-columns > section,
  .story-current-status,
  .story-qualification-layout > section { padding: 24px 21px 26px; }

  .story-context-scope-columns > section + section {
    border-top: 2px solid var(--ink);
    border-left: 0;
  }

  .story-context-evidence-layout { gap: 34px; }

  .story-evidence-results > dl > div {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 18px 0;
  }

  .story-qualification-layout > section:first-child { padding-left: 0; }
  .story-qualification-layout > section + section {
    padding-right: 0;
    padding-left: 0;
    border-top: 2px solid var(--ink);
    border-left: 0;
  }
}
