.case-cover {
  padding-block: var(--space-16);
  border-bottom: var(--border-subtle);
  background: var(--color-surface);
}

.case-study > article {
  counter-reset: case-section;
}

.case-cover h1 {
  max-width: 20ch;
}

.case-cover__summary {
  max-width: 60ch;
  margin-top: var(--space-6);
  font-family: var(--font-serif);
  font-size: var(--text-lead);
}

.case-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-12);
  color: var(--color-text-secondary);
  font-size: var(--text-compact);
}

.case-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4) var(--grid-gutter);
  margin-top: var(--space-12);
  padding-top: var(--space-8);
  border-top: var(--border-subtle);
}

.case-facts div,
.case-decision dl div,
.case-evidence dl div,
.case-record dl div,
.case-card dl div {
  display: grid;
  gap: var(--space-1);
}

.case-facts dt,
.case-decision dt,
.case-evidence dt,
.case-record dt,
.case-card dt {
  color: var(--color-text-secondary);
  font-size: var(--text-metadata);
  font-weight: 600;
}

.case-facts dd,
.case-decision dd,
.case-evidence dd,
.case-record dd,
.case-card dd {
  margin: 0;
}

.case-evidence-profile {
  display: grid;
  gap: var(--space-4);
  margin-top: var(--space-8);
  padding-top: var(--space-8);
  border-top: var(--border-subtle);
}

.case-evidence-profile__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}

.case-evidence-profile h2 {
  font-size: var(--text-h4);
}

.case-study__cover-media,
.case-toc {
  margin-top: var(--space-12);
}

.case-toc {
  padding: var(--space-6);
  border: var(--border-standard);
  border-radius: var(--radius-3);
  background: var(--color-surface);
}

.case-toc ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2) var(--space-8);
  padding-left: var(--space-6);
}

.case-toc a {
  display: inline-flex;
  min-height: 2.75rem;
  align-items: center;
}

.case-study__section {
  counter-increment: case-section;
  padding-block: var(--space-16);
}

.case-study__section > .container > .overline::before {
  content: counter(case-section, decimal-leading-zero) " · ";
}

.case-study__section--surface {
  border-block: var(--border-subtle);
  background: var(--color-surface);
}

.case-study__section h2 {
  margin-bottom: var(--space-8);
}

.case-study__section h3 {
  margin-top: var(--space-8);
  margin-bottom: var(--space-3);
  font-size: var(--text-h4);
}

.case-study__section p + p,
.case-study__section p + ul,
.case-study__section ul + p,
.case-study__section figure,
.case-study__section dl {
  margin-top: var(--space-6);
}

.case-study__section ul {
  padding-left: var(--space-6);
}

.case-study__section li + li {
  margin-top: var(--space-2);
}

.case-component-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--grid-gutter);
}

.case-timeline {
  position: relative;
  display: grid;
  gap: var(--space-8);
  padding-left: var(--space-8);
  list-style: none;
}

.case-timeline::before {
  position: absolute;
  top: var(--space-2);
  bottom: var(--space-2);
  left: 0.4375rem;
  width: 1px;
  background: var(--color-border-strong);
  content: "";
}

.case-timeline > li {
  position: relative;
}

.case-timeline > li::before {
  position: absolute;
  top: 0.5rem;
  left: calc(-1 * var(--space-8));
  width: 0.9375rem;
  height: 0.9375rem;
  border: var(--border-emphasis);
  border-radius: var(--radius-round);
  background: var(--color-canvas);
  content: "";
}

.case-callout,
.case-decision,
.case-evidence,
.case-record,
.case-card,
.case-conclusion {
  padding: var(--space-6);
  border: var(--border-standard);
  border-radius: var(--radius-3);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.case-callout {
  border-left: var(--border-emphasis);
}

.case-callout[data-tone="attention"] {
  border-left-color: var(--color-attention);
  background: var(--color-attention-soft);
}

.case-callout[data-tone="info"] {
  border-left-color: var(--color-info);
  background: var(--color-info-soft);
}

.case-callout[data-tone="valid"] {
  border-left-color: var(--color-valid);
  background: var(--color-valid-soft);
}

.case-decision dl,
.case-evidence dl,
.case-record dl,
.case-card dl {
  display: grid;
  gap: var(--space-4);
}

.case-decision--discarded {
  border-style: dashed;
}

.case-evidence__heading,
.case-card__heading,
.case-record__heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}

.case-evidence__heading h3,
.case-card__heading + h2,
.case-record__heading h3 {
  margin-top: var(--space-1);
}

.case-card h2 {
  font-size: var(--text-h4);
}

.case-evidence-links {
  font-size: var(--text-compact);
}

.case-evidence-links a + a {
  margin-left: var(--space-1);
}

.badge[data-claim-status="verified"],
.badge[data-evidence-availability="public"] {
  border-color: var(--color-valid);
  background: var(--color-valid-soft);
  color: var(--color-valid);
}

.badge[data-claim-status="partial"],
.badge[data-evidence-availability="partially-public"] {
  border-color: var(--color-attention);
  background: var(--color-attention-soft);
  color: var(--color-attention);
}

.case-code {
  border: var(--border-standard);
  border-radius: var(--radius-3);
  background: var(--color-inverse);
  color: var(--color-inverse-text);
  overflow: clip;
}

.case-code figcaption {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border-strong);
}

.case-code .metadata {
  color: var(--color-border-strong);
}

.case-code pre {
  max-width: 100%;
  padding: var(--space-6);
  overflow: auto;
  font-size: var(--text-compact);
  line-height: 1.5;
  tab-size: 2;
}

.case-code > p {
  padding: 0 var(--space-4) var(--space-4);
}

.case-figure img {
  width: 100%;
  height: auto;
  border: var(--border-subtle);
  border-radius: var(--radius-3);
  background: var(--color-surface-secondary);
}

.case-figure figcaption,
.case-figure__description {
  margin-top: var(--space-3);
  color: var(--color-text-secondary);
  font-size: var(--text-compact);
}

.case-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: var(--grid-gutter);
}

.case-metrics > div,
.case-implementation-tools dl > div,
.case-resources li {
  padding: var(--space-4);
  border: var(--border-subtle);
  border-radius: var(--radius-2);
  background: var(--color-surface);
}

.case-metrics dd,
.case-implementation-tools dd {
  margin: var(--space-2) 0 0;
}

.case-metrics__value {
  color: var(--color-brand);
  font-size: var(--text-h3);
  font-weight: 600;
  line-height: var(--leading-heading);
}

.case-conclusion {
  margin-top: var(--space-8);
  border-left: var(--border-emphasis);
}

.case-implementation-tools {
  margin-top: var(--space-8);
}

.case-implementation-tools dl {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--grid-gutter);
}

.case-implementation-tools dt {
  font-weight: 600;
}

.case-resources ul {
  display: grid;
  gap: var(--space-4);
  padding: 0;
  list-style: none;
}

.case-navigation {
  display: grid;
  gap: var(--space-6);
  padding-block: var(--space-12);
  border-top: var(--border-subtle);
}

.case-navigation__adjacent {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-4);
}

@media (max-width: 47.999rem) {
  .case-cover,
  .case-study__section {
    padding-block: var(--space-12);
  }

  .case-facts,
  .case-toc ol,
  .case-component-grid {
    grid-template-columns: 1fr;
  }

  .case-breadcrumb {
    margin-bottom: var(--space-8);
  }

  .case-study__section h2 {
    margin-bottom: var(--space-6);
  }
}