/* Shared opening layout for pages under About. */
.section-banner.about-page-banner { padding-top: 80px; }
.about-page-banner .about-page-hero { padding: 80px 40px 64px; align-items: flex-start; justify-content: flex-start; }
.careers-hero.about-page-hero { padding: 160px 40px 64px; }
.section-wrapper.faq.about-page-frame { padding-top: 0; }
.about-page-header { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; max-width: 1000px; margin: 0; text-align: left; }
.about-page-header:not(.about-page-hero) { padding: 0; }
.about-page-header.about-page-hero { max-width: none; }
.about-page-header .about-page-label { display: block; align-self: flex-start; width: fit-content; margin: 0; padding: 4px 15px; border-radius: 2px; background: #ffffff1a; font-size: 16px; font-weight: 500; line-height: 24px; }
.about-page-header h1 { max-width: 1000px; margin: 24px 0; font-size: clamp(40px, 5vw, 72px); line-height: 1.1; letter-spacing: -.02em; }
.about-page-header > p { max-width: 850px; margin: 0; }
.about-page-header .al-page-breadcrumb { margin-top: 24px; }
@media (max-width: 991px) {
  .section-banner.about-page-banner { padding-top: 60px; }
  .about-page-banner .about-page-hero { padding: 60px 30px 48px; }
  .careers-hero.about-page-hero { padding: 120px 30px 48px; }
}
@media (max-width: 767px) {
  .about-page-banner .about-page-hero { padding: 60px 20px 40px; }
  .careers-hero.about-page-hero { padding: 120px 20px 40px; }
}

/* Images sit beside the shared About header, then stack on smaller screens. */
.about-page-hero.about-hero-with-image { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 48px; max-width: none; margin: 0; }
.about-hero-with-image > .about-page-header { width: 100%; min-width: 0; }
.about-hero-image { display: block; width: 100%; height: auto; object-fit: contain; border: 0; border-radius: 4px; }
@media (max-width: 991px) {
  .about-page-hero.about-hero-with-image { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .about-hero-image { max-width: 480px; justify-self: center; }
}