/* Company story: source-ordered editorial bands, without unverified imagery. */
.ax-about-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: end;
  gap: var(--ax-8);
  padding-block: var(--ax-3) var(--ax-4);
}
.ax-about-page .ax-about-promise {
  max-width: 11ch;
  font-size: var(--ax-h1-fluid);
  line-height: 1.04;
}
.ax-about-origin { color: var(--ax-text-muted); }
.ax-about-hero__intro { padding-bottom: var(--ax-1); }
.ax-about-split {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  align-items: start;
  gap: var(--ax-10);
}
.ax-about-split > * { min-width: 0; }
.ax-about-story__photo { margin: 0; }
.ax-about-chapters { display: grid; gap: var(--ax-4); padding: 0; list-style: none; }
.ax-about-chapter {
  display: grid;
  grid-template-columns: var(--ax-6) minmax(0, 1fr);
  gap: var(--ax-3);
  padding-top: var(--ax-3);
}
.ax-about-chapter__number { font-size: var(--ax-subhead); line-height: 1; color: var(--ax-accent); }
.ax-about-page .ax-about-heading {
  font-size: clamp(var(--ax-h3-m), 2.2cqi, var(--ax-subhead));
  line-height: 1.15;
  text-wrap: balance;
}
.ax-about-development__intro { padding-top: var(--ax-4); }
.ax-about-parts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ax-4); }
.ax-about-part { padding-top: var(--ax-3); }
.ax-about-practices { display: grid; gap: var(--ax-4); }
.ax-about-practice { padding-top: var(--ax-3); }
.ax-about-invitation { padding-top: var(--ax-3); }
.ax-about-invitation > a { align-self: start; }
.ax-about-closing__lead { max-width: 48ch; }
.ax-about-team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ax-4); }
.ax-about-team { row-gap: var(--ax-8); }
.ax-about-person { min-width: 0; }
.ax-about-person__portrait .ax-media__img { object-position: 50% 25%; }
.ax-about-person__copy { padding-top: var(--ax-3); }
.ax-about-page .ax-about-person__name { font-size: var(--ax-subhead); line-height: 1.2; margin: 0; }
.ax-about-person__role { color: var(--ax-text-muted); margin-top: var(--ax-1); font-size: var(--ax-body); }
@media (max-width: 540px) {
  .ax-about-page .ax-about-team { grid-template-columns: minmax(0, 1fr); }
}
/* Open questions from review stay visibly unfinished. */
.ax-about-pending { color: var(--ax-gold-11); background: var(--ax-gold-01); border: 1px dashed var(--ax-gold-09); padding-inline: .25em; font-weight: 700; }
@media (max-width: 1100px) {
  .ax-about-hero, .ax-about-split { gap: var(--ax-6); }
}
@media (max-width: 900px) {
  .ax-about-hero, .ax-about-split, .ax-about-parts { grid-template-columns: minmax(0, 1fr); }
  .ax-about-team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ax-about-hero { gap: var(--ax-4); padding-block: 0; }
  .ax-about-hero__intro, .ax-about-development__intro { padding-block: 0; }
  .ax-about-chapter { grid-template-columns: var(--ax-4) minmax(0, 1fr); gap: var(--ax-2); }
  .ax-about-chapter__number { font-size: var(--ax-h3-m); }
}

/* The development heading is long, so it sits above its lead at every width (as below 900px) and keeps to two lines. */
.ax-about-page #about-development .ax-about-split { grid-template-columns: minmax(0, 1fr); gap: var(--ax-6); }
.ax-about-page #about-development .ax-about-development__intro { padding-top: 0; }
/* Story paragraphs use the same 24px rhythm as the other text sections. */
.ax-about-page #about-story .ax-about-split > :last-child { gap: var(--ax-3); }
