/* About overview: scoped to the new page; inherits Pack D typography and palette. */
.ao-page {
  --ao-ink: #19313b;
  --ao-copy: var(--visual-text-secondary, #4b6068);
  --ao-line: #ccd3d4;
  color: var(--ao-ink);
  background: #fff;
}
.ao-page * { box-sizing: border-box; }
.ao-shell { width: min(1280px, calc(100% - 112px)); margin-inline: auto; }
.ao-page :is(h1, h2, p) { margin: 0; }
.ao-page :is(h1, h2) { text-transform: none; }
.ao-page h1 { }
.ao-page h2 { }
.ao-page .ao-clause { display: block; max-width: 100%; text-wrap: balance; }
.ao-page .ao-kicker { margin-bottom: 26px; }
.ao-hero { padding: 112px 0 108px; }
.ao-hero-grid { display: grid; grid-template-columns: 1.12fr 1fr; gap: 72px; align-items: start; }
.ao-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 88px; }
.ao-grid > *, .ao-hero-grid > * { min-width: 0; }
.ao-section { padding: 96px 0; scroll-margin-top: 100px; }
.ao-copy, .ao-card-copy { color: var(--ao-copy); }
.ao-copy > p + p { margin-top: 22px; }
.ao-lead { padding-top: 7px; }
.ao-links { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 32px; }
.ao-link { display: inline-flex; justify-content: space-between; align-items: center; gap: 24px; color: var(--ao-ink); padding: 10px 0; border-bottom: 1px solid currentColor; text-decoration: none; }
.ao-primary { padding: 13px 20px; color: #fff; background: var(--ao-ink); border: 1px solid var(--ao-ink); }
.ao-link:hover { border-bottom-width: 2px; padding-bottom: 9px; }
.ao-primary:hover { color: #fff; background: #274352; border-color: #274352; border-bottom-width: 1px; padding-bottom: 13px; }
.ao-page a:focus-visible { outline: 2px solid var(--ao-ink); outline-offset: 5px; }
.ao-warm { background: var(--visual-surface-warm, #f5f3ee); }
.ao-cool { background: var(--visual-surface-cool, #f2f5f5); }
.ao-next { padding-top: 0; }
.ao-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.ao-card { display: flex; flex-direction: column; min-width: 0; gap: 20px; padding: 40px; color: var(--ao-ink); text-decoration: none; background: var(--visual-surface-cool, #f2f5f5); }
.ao-card .ao-kicker { margin: 0; }
.ao-card h2 { }
.ao-card-copy { max-width: 480px; }
.ao-card-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: auto; padding-top: 18px; }
.ao-card:hover { background: var(--visual-surface-blue, #dceaf0); }
@media (max-width: 1100px) {
  .ao-shell { width: calc(100% - 72px); }
  .ao-grid, .ao-hero-grid { gap: 48px; }
  .ao-hero { padding: 88px 0; }
  .ao-section { padding-block: 80px; }
  .ao-next { padding-top: 0; }
  .ao-card { padding: 32px; }
}
@media (max-width: 800px) {
  .ao-grid, .ao-hero-grid { grid-template-columns: 1fr; gap: 28px; }
  .ao-hero { padding: 76px 0; }
  .ao-hero h1 { }
  .ao-lead { max-width: 640px; padding-top: 0; }
}
@media (max-width: 560px) {
  .ao-shell { width: calc(100% - 48px); }
  .ao-hero { padding: 60px 0 64px; }
  .ao-hero h1 { }
  .ao-page h2 { }
  .ao-page .ao-kicker { margin-bottom: 20px; }
  .ao-section { padding-block: 64px; }
  .ao-copy, .ao-card-copy { }
  .ao-links { gap: 18px 24px; margin-top: 26px; }
  .ao-cards { grid-template-columns: 1fr; gap: 20px; }
  .ao-next { padding-top: 0; }
  .ao-card { padding: 28px; }
  .ao-card .ao-kicker { margin: 0; }
  .ao-card h2 { }
}