/* ==========================================================================
   ABOUT PAGE EXTRAS — only components style.css does not provide.
   Built entirely on the global design tokens.
   ========================================================================== */

/* Large Fraunces mission pull-quote (navy ground) */
.pull-quote {
  max-width: 940px;
  margin-inline: auto;
  text-align: center;
}
.pull-quote blockquote {
  margin: 0 0 1.6rem;
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 3.4vw, 2.8rem);
  font-weight: 300;
  line-height: 1.22;
  letter-spacing: -.012em;
  color: var(--on-dark);
  font-variation-settings: "opsz" 144, "SOFT" 30;
  text-wrap: balance;
}
.pull-quote blockquote .accent { font-weight: 300; }
.pull-quote cite {
  display: inline-flex; align-items: center; gap: .6rem;
  font-style: normal;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  color: var(--on-dark-muted);
}
.pull-quote cite::before {
  content: "";
  width: 28px; height: 1px;
  background: var(--brass-2);
}

/* Story paragraphs sit a little larger than default body copy */
.story-copy p { font-size: 1.02rem; }
.story-copy p + p { margin-top: 1em; }

/* Timeline: sticky intro column + list */
.timeline-layout {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}
.timeline-layout__intro { position: sticky; top: calc(var(--header-h, 76px) + 2rem); }
.timeline-layout__intro .lede { margin-bottom: 1.5rem; }
.timeline--milestones .timeline__item { padding-block: 1.15rem; }
.timeline--milestones .timeline__body h4 { font-size: 1.12rem; }

/* Team card: credentials line under the bio */
.team-card__creds {
  font-size: var(--fs-xs);
  color: var(--muted-2);
  letter-spacing: .01em;
  margin: .1rem 0 .95rem;
}
.team-card__creds strong { color: var(--navy); font-weight: 600; }
.team-card .pill-row { margin-top: auto; }
.team-card .chip { font-size: .74rem; padding: .32rem .7rem; }

/* Office quick facts under the split copy */
.office-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 1.5rem;
  margin-top: 1.75rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line);
}
.office-facts li { display: flex; gap: .75rem; align-items: flex-start; font-size: var(--fs-sm); color: var(--muted); }
.office-facts li strong { display: block; color: var(--navy); font-weight: 600; margin-bottom: .1rem; }
.office-facts svg { width: 20px; height: 20px; flex-shrink: 0; stroke: var(--teal); stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; fill: none; margin-top: .1rem; }

/* Credentials strip fine print */
.creds-note { text-align: center; font-size: var(--fs-xs); color: var(--muted-2); margin-top: 1.5rem; }

@media (max-width: 1023px) {
  .timeline-layout { grid-template-columns: 1fr; }
  .timeline-layout__intro { position: static; }
}
@media (max-width: 480px) {
  .office-facts { grid-template-columns: 1fr; }
}