.phase-page {
  min-height: 60vh;
}

.page-hero {
  border-bottom: var(--border-width) solid var(--border-color);
  padding-block: clamp(var(--space-16), 8vw, 7rem);
}

.page-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(17rem, 0.65fr);
  gap: clamp(var(--space-10), 6vw, var(--space-20));
  align-items: end;
}

.page-hero__copy {
  max-width: 54rem;
}

.page-hero__title {
  max-width: 13em;
  margin-bottom: var(--space-6);
  font-size: clamp(2.8rem, 5.5vw, 5rem);
}

.page-hero__intro {
  max-width: 46rem;
  margin: 0;
  color: var(--color-graphite);
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
}

.page-hero__actions {
  margin-top: var(--space-8);
}

.page-hero__aside {
  border-top: var(--border-width) solid var(--accent);
  padding-top: var(--space-5);
  color: var(--color-graphite);
}

.phase-section {
  padding-block: clamp(var(--space-14), 7vw, var(--space-24));
}

.phase-section--warm {
  background: var(--color-warm-paper);
}

.phase-section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.65fr);
  gap: var(--space-10);
  align-items: end;
  margin-bottom: var(--space-10);
}

.phase-section-heading h2 {
  margin: 0;
}

.phase-section-heading p:last-child {
  color: var(--color-graphite);
}

.programme-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: var(--border-width) solid var(--color-ink);
  border-bottom: var(--border-width) solid var(--border-color);
}

.programme-path {
  min-width: 0;
  padding: var(--space-8);
}

.programme-path + .programme-path {
  border-left: var(--border-width) solid var(--border-color);
}

.programme-path__title {
  margin-bottom: var(--space-3);
  font-size: var(--font-h3);
}

.programme-path__body {
  color: var(--color-graphite);
}

.programme-path__meta {
  margin-block: var(--space-5);
  color: var(--color-graphite);
  font-size: var(--font-meta);
}

.phase-stack > * + * {
  margin-top: var(--space-8);
}

.phase-index-row {
  display: grid;
  grid-template-columns: 4rem minmax(0, 1fr) minmax(13rem, 0.35fr);
  gap: var(--space-6);
  padding-block: var(--space-7);
  border-top: var(--border-width) solid var(--border-color);
}

.phase-index-row__number {
  color: var(--accent);
  font-family: var(--font-serif);
}

.phase-index-row__meta {
  color: var(--color-graphite);
  font-size: var(--font-meta);
}

.status-note {
  border-top: var(--border-width) solid var(--accent);
  padding: var(--space-6) 0 0;
}

.status-note h2 {
  margin-bottom: var(--space-2);
  font-size: var(--font-h3);
}

.status-note p {
  color: var(--color-graphite);
}

.phase-filter-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: end;
  margin-bottom: var(--space-8);
  padding-block: var(--space-5);
  border-top: var(--border-width) solid var(--color-ink);
  border-bottom: var(--border-width) solid var(--border-color);
}

.phase-filter-controls {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.phase-filter-controls a {
  display: inline-flex;
  min-height: var(--control-height);
  align-items: center;
  padding-inline: var(--space-4);
  border: var(--border-width) solid var(--border-color);
  color: var(--color-ink);
  text-decoration: none;
}

.phase-filter-controls a[aria-current="page"] {
  border-color: var(--color-ink);
  background: var(--color-ink);
  color: var(--color-paper);
}

.person-directory {
  border-bottom: var(--border-width) solid var(--border-color);
}

.person-directory-row {
  display: grid;
  grid-template-columns: minmax(15rem, 0.75fr) minmax(0, 1.25fr);
  gap: var(--space-10);
  padding-block: var(--space-7);
  border-top: var(--border-width) solid var(--border-color);
}

.person-directory-row__roles,
.person-directory-row__meta {
  margin-bottom: var(--space-2);
  color: var(--accent);
  font-family: var(--font-sans);
  font-size: var(--font-meta);
  font-weight: 600;
  letter-spacing: var(--tracking-ui);
  text-transform: uppercase;
}

.person-directory-row__identity h2 {
  margin-bottom: var(--space-2);
  font-size: var(--font-h3);
}

.person-directory-row__position,
.person-directory-row__details {
  color: var(--color-graphite);
}

.call-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
  gap: clamp(var(--space-10), 5vw, var(--space-20));
  align-items: start;
}

.call-detail-sidebar {
  border-top: var(--border-width) solid var(--accent);
  padding-top: var(--space-5);
}

.call-detail-sidebar dl {
  margin: 0;
}

.call-detail-sidebar dt {
  margin-top: var(--space-4);
  color: var(--color-graphite);
  font-size: var(--font-meta);
  font-weight: 600;
  text-transform: uppercase;
}

.call-detail-sidebar dd {
  margin: var(--space-1) 0 0;
}

.phase-topic-grid,
.about-model-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: var(--border-width) solid var(--color-ink);
}

.phase-topic-grid > *,
.about-model-grid > * {
  padding: var(--space-7);
  border-bottom: var(--border-width) solid var(--border-color);
}

.phase-topic-grid > * + *,
.about-model-grid > * + * {
  border-left: var(--border-width) solid var(--border-color);
}

.phase-prose {
  max-width: 48rem;
}

.phase-prose > * + * {
  margin-top: var(--space-5);
}

.phase-prose h2,
.phase-prose h3 {
  margin-top: var(--space-10);
}

@media (max-width: 64rem) {
  .page-hero__grid,
  .call-detail-grid,
  .phase-section-heading {
    grid-template-columns: 1fr;
  }

  .programme-grid,
  .about-model-grid,
  .phase-topic-grid {
    grid-template-columns: 1fr;
  }

  .programme-path + .programme-path,
  .phase-topic-grid > * + *,
  .about-model-grid > * + * {
    border-left: 0;
    border-top: var(--border-width) solid var(--border-color);
  }
}

@media (max-width: 48rem) {
  .page-hero {
    padding-block: var(--space-12);
  }

  .page-hero__title {
    font-size: clamp(2.45rem, 12vw, 3.5rem);
  }

  .phase-section {
    padding-block: var(--space-12);
  }

  .phase-index-row,
  .person-directory-row,
  .phase-filter-bar {
    grid-template-columns: 1fr;
  }

  .phase-index-row__number {
    display: none;
  }

  .programme-path {
    padding-inline: 0;
  }
}

/* Phase E: spacing formerly expressed through inline style attributes. */
.phase-inline-actions {
  margin-top: var(--space-8);
}

.phase-result-count {
  margin-block: var(--space-6);
}

.phase-journal-link {
  margin-top: var(--space-5);
}

.phase-back-link {
  margin-top: var(--space-6);
}
