/* Editorial profile: a readable mission, real posters, and an open masthead. */
.about-page {
  width: 100%;
  --public-section-space: clamp(2rem, 3.8vw, 3.5rem);
}

.about-page :is(h2, h3, p, ol, ul, figure) {
  margin-block-start: 0;
}

.about-page h2 {
  max-width: 23ch;
  font-size: clamp(2rem, 2.8vw, 2.75rem);
  letter-spacing: -0.03em;
  line-height: 1.12;
}

.about-page h3 {
  font-size: clamp(1.15rem, 1.55vw, 1.45rem);
  line-height: 1.2;
}

.about-page .section-kicker {
  margin-bottom: 0.75rem;
}

.about-hero,
.about-board,
.about-model,
.about-evidence,
.about-communities,
.about-standards,
.about-closing {
  padding: var(--public-section-space) max(var(--public-gutter), env(safe-area-inset-right)) var(--public-section-space) max(var(--public-gutter), env(safe-area-inset-left));
  border-bottom: 1px solid var(--line);
}

.about-hero {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  justify-items: center;
  padding-top: clamp(1.5rem, 2.5vw, 2.25rem);
  padding-bottom: clamp(2rem, 3vw, 2.75rem);
  display: grid;
}

.about-hero__content {
  width: min(100%, 52rem);
  margin: 0 auto;
}

.about-hero h1 {
  max-width: none;
  margin: 0 0 clamp(1.25rem, 2vw, 1.75rem);
  font-family: var(--display);
  font-size: clamp(2.75rem, 4vw, 3.75rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-align: center;
}

.about-hero__introduction > p {
  max-width: none;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: clamp(1.05rem, 1.45vw, 1.25rem);
  line-height: 1.55;
}

.about-hero__introduction > p + p {
  margin-top: 0.85rem;
}

.about-hero__introduction > p:last-of-type {
  margin-bottom: 1.5rem;
}

.about-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.2rem;
}

.about-actions > a:not(.primary-action) {
  min-height: 2.75rem;
  align-items: center;
  font-weight: 650;
  display: inline-flex;
}

.about-artwork-strip {
  background: var(--paper);
  grid-template-columns: minmax(0, 1.32fr) minmax(0, 0.86fr) minmax(0, 1fr);
  align-items: start;
  gap: clamp(1rem, 2vw, 2rem);
  padding: 0 var(--public-gutter) var(--public-section-space);
  min-width: 0;
  display: grid;
  overflow: hidden;
}

.about-artwork-strip figure {
  min-width: 0;
  margin: 0;
  display: grid;
}

.about-artwork-strip figure:not(:last-child) {
  border-right: 0;
}

.about-artwork-strip figure:nth-child(2) {
  margin-top: clamp(1rem, 3vw, 3rem);
}

.about-artwork-strip picture {
  align-content: start;
  min-height: 0;
  background: var(--paper);
  display: grid;
  overflow: hidden;
}

.about-artwork-strip img {
  object-fit: contain;
  width: 100%;
  height: auto;
  display: block;
}

.about-artwork-strip figcaption {
  border-top: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-soft);
  padding: 0.65rem 0;
  font-family: var(--sans);
  font-size: 0.75rem;
  letter-spacing: 0;
  text-transform: none;
}

.about-board,
.about-model,
.about-communities,
.about-standards,
.about-closing {
  grid-template-columns: minmax(14rem, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(2rem, 5vw, 5rem);
  display: grid;
}

.about-standards__body {
  max-width: 64rem;
}

.about-board__list {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  display: grid;
}

.about-board__list > li {
  min-width: 0;
  padding: clamp(1rem, 2vw, 1.5rem) 0;
  border-bottom: 1px solid var(--line);
}

.about-board__member {
  min-width: 0;
  grid-template-columns: minmax(10rem, 0.68fr) minmax(0, 1.32fr);
  align-items: baseline;
  gap: 1rem clamp(1.25rem, 3vw, 3rem);
  display: grid;
}

.about-board__list h3 {
  margin-bottom: 0;
  font-family: var(--display);
  font-size: clamp(1.3rem, 1.8vw, 1.65rem);
  font-weight: 400;
}

.about-board__list p {
  max-width: 36ch;
  margin-bottom: 0;
  color: var(--ink-soft);
  line-height: 1.55;
}

.about-model {
  background: var(--paper);
}

.about-model__steps {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  display: grid;
}

.about-model__steps > li {
  min-width: 0;
  width: 100%;
  padding: 1.35rem 0 1.5rem;
  border-bottom: 1px solid var(--line);
}

.about-model__steps > li:nth-child(2) {
  width: 88%;
  margin-left: auto;
}

.about-model__steps > li:nth-child(3) {
  width: 94%;
}

.about-model__steps h3 {
  margin-bottom: 0.7rem;
}

.about-model__steps p,
.about-communities__grid p,
.about-standards__body > p {
  max-width: 42ch;
  margin-bottom: 0;
  color: var(--ink-soft);
}

.about-program-streams {
  grid-column: 1 / -1;
  margin-top: 0;
}

.about-program-streams h3 {
  margin-bottom: 0.9rem;
}

.about-program-streams ul {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  column-gap: clamp(1.5rem, 4vw, 4rem);
}

.about-program-streams li {
  --program-stream-accent: var(--ink);
  min-width: 0;
  width: 100%;
  padding: 1rem 1rem 1rem 1.35rem;
  border-bottom: 1px solid var(--line);
  position: relative;
}

.about-program-streams li::before {
  content: "";
  background: var(--program-stream-accent);
  width: 0.3rem;
  position: absolute;
  inset-block: 0.8rem;
  left: 0;
}

.about-program-streams li:nth-child(even) {
  width: 90%;
  margin-left: auto;
}

.about-program-streams strong,
.about-program-streams span {
  display: block;
}

.about-program-streams strong {
  margin-bottom: 0.45rem;
}

.about-program-streams span {
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.5;
}

.about-evidence {
  padding-block: var(--public-section-space);
}

.about-evidence__copy {
  grid-template-columns: minmax(15rem, 0.72fr) minmax(0, 1.28fr);
  align-items: end;
  gap: clamp(2rem, 5vw, 5rem);
  margin-bottom: 0;
  display: grid;
}

.about-evidence__copy > p:last-child {
  max-width: 56ch;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.65;
}

.about-communities {
  background: var(--paper-deep);
}

.about-communities__grid {
  border-top: 1px solid var(--line);
}

.about-communities__grid article {
  grid-template-columns: minmax(12rem, 0.8fr) minmax(0, 1.2fr);
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--line);
  display: grid;
}

.about-communities__grid h3,
.about-communities__grid p {
  margin-bottom: 0;
}

.about-communities__grid h3 a {
  text-underline-offset: 0.2em;
}

.about-standards__body > p {
  margin-bottom: 1.25rem;
}

.about-standards__body ul {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.5rem;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
  display: grid;
}

.about-standards__body li {
  border-bottom: 1px solid var(--line);
}

.about-standards__body li:not(:last-child) {
  border-right: 0;
}

.about-standards__body a {
  min-height: 3.5rem;
  padding: 0.8rem 0;
  align-items: center;
  font-weight: 650;
  display: flex;
}

.about-closing {
  border-bottom: 1px solid var(--line);
}

.about-closing > div:last-child > p {
  max-width: 56ch;
  color: var(--paper);
  line-height: 1.65;
}

.about-closing__actions {
  margin-top: 1.5rem;
}

.about-closing__actions > a:not(.primary-action) {
  color: var(--paper);
}

@media (prefers-reduced-motion: no-preference) {
  html[data-artwork-motion-ready="true"]
    .about-artwork-strip
    figure[data-artwork-reveal="about-artwork-strip-poster"][data-artwork-reveal-state="pending"] {
    clip-path: inset(0 18% 0 0);
    transform: translateX(calc(-1 * var(--artwork-motion-distance-mobile)));
  }

  html[data-artwork-motion-ready="true"]
    .about-artwork-strip
    figure:nth-child(2)[data-artwork-reveal-state="pending"] {
    clip-path: inset(0 0 0 18%);
    transform: translateX(var(--artwork-motion-distance-mobile));
  }

  html[data-artwork-motion-ready="true"]
    .about-artwork-strip
    figure[data-artwork-reveal="about-artwork-strip-poster"][data-artwork-reveal-state="visible"] {
    clip-path: inset(0);
    transform: translateX(0);
    transition:
      clip-path var(--artwork-motion-artwork) var(--artwork-motion-easing),
      transform var(--artwork-motion-artwork) var(--artwork-motion-easing);
  }

  html[data-artwork-motion-ready="true"]
    .about-artwork-strip
    figure:nth-child(2)[data-artwork-reveal-state="visible"] {
    transition-delay: var(--artwork-motion-stagger);
  }

  html[data-artwork-motion-ready="true"]
    .about-artwork-strip
    figure:nth-child(3)[data-artwork-reveal-state="visible"] {
    transition-delay: calc(2 * var(--artwork-motion-stagger));
  }
}

@media (max-width: 62rem) {
  .about-hero,
  .about-board,
  .about-model,
  .about-evidence__copy,
  .about-communities,
  .about-standards,
  .about-closing {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-model__steps {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-program-streams {
    grid-column: 1;
  }
}

@media (max-width: 44rem) {
  .about-hero,
  .about-board,
  .about-model,
  .about-evidence,
  .about-communities,
  .about-standards,
  .about-closing {
    padding-right: max(1rem, env(safe-area-inset-right));
    padding-left: max(1rem, env(safe-area-inset-left));
  }

  .about-board__list,
  .about-program-streams ul,
  .about-standards__body ul {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-artwork-strip {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-artwork-strip figure:nth-child(2) {
    margin-top: 0;
  }

  .about-artwork-strip figure:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid var(--paper);
  }

  .about-board__member {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.45rem;
  }

  .about-model__steps > li,
  .about-model__steps > li:nth-child(2),
  .about-model__steps > li:nth-child(3),
  .about-program-streams li,
  .about-program-streams li:nth-child(even) {
    width: 100%;
    margin-left: 0;
  }

  .about-communities__grid article {
    grid-template-columns: minmax(0, 1fr);
  }

  .about-communities__grid article > p:last-child {
    grid-column: 1;
  }

  .about-standards__body li:not(:last-child) {
    border-right: 0;
  }
}