/* Approved About v2. English About only; shared pages keep their existing styles. */
.about-approved { --header-height: 128px; }
.about-approved .site-header { height: var(--header-height); }
.about-approved .brand picture { display: block; line-height: 0; }
.about-approved .brand__logo { width: 280px; height: 46px; max-width: none; }
.about-approved .brand--footer .brand__logo { width: 250px; height: auto; }
.about-approved .language-switcher__list a { text-transform: lowercase; }
.about-approved h1,
.about-approved h2 { letter-spacing: 0; }
.about-approved .about-hero { background: #d1d6db; }
.about-approved .about-hero__media { display: block; z-index: -1; opacity: .55; }
.about-approved .about-hero__photo { display: block; object-position: center; }
.about-approved .about-hero__overlay {
	z-index: -2;
	background: linear-gradient(180deg, rgb(11 44 37 / 20%) 0%, rgb(11 44 37 / 82%) 100%);
}
.about-approved .about-leadership__photo { display: block; object-position: center; }
.about-approved .about-audience__photo { display: block; }

@media (min-width: 901px) {
	/* Keep normal document flow: longer CMS text expands each section safely. */
	.about-approved .about-hero { padding-block: 182px 112px; }
	.about-approved .about-audience__images { aspect-ratio: 629.28 / 451.73; }
	.about-approved .about-audience__photo { min-height: 0; }
	/* The reference shows these groups 14px into their reveal. Preserve their
	 * optical placement with spacing, without leaving text translucent. */
	.about-approved .about-leadership { padding-block: 134px 106px; }
	.about-approved .about-mission { padding-top: 134px; padding-bottom: 50px; }
	.about-approved .about-values { padding-top: 64px; padding-bottom: 120px; }
	.about-approved .about-values .section-heading { position: relative; top: 14px; }
	.about-approved .about-audience,
	.about-approved .about-cta { padding-top: 134px; padding-bottom: 106px; }
	.about-approved .about-overview__copy { position: relative; top: 14px; }
	.about-approved .site-footer { padding-bottom: 35px; }
}

@media (max-width: 1100px) {
	.about-approved .brand__logo { width: 220px; height: auto; }
	.about-approved .primary-navigation__list { gap: 18px; }
}
@media (max-width: 900px) {
	.about-approved { --header-height: 78px; }
}
@media (max-width: 760px) {
	.about-approved { --header-height: 70px; }
	.about-approved .brand__logo,
	.about-approved .site-header.is-scrolled .brand__logo { width: 194px; height: auto; }
	.about-approved .site-header__cta { display: none; }
	.about-approved .menu-toggle { margin-left: auto; }
	.about-approved .about-hero__media { opacity: .55; }
	.about-approved .about-hero__overlay {
		background: linear-gradient(180deg, rgb(11 44 37 / 20%) 0%, rgb(11 44 37 / 90%) 100%);
	}
	.about-approved .about-leadership__caption {
		bottom: 11px;
		padding: 13px 16px;
		font-size: 12px;
		line-height: 20.5px;
		text-align: center;
	}
	/* Match the reference's optical offsets without fixing content heights. */
	.about-approved .about-mission { padding-top: 86px; padding-bottom: 24px; }
	.about-approved .about-values .section-heading { position: relative; top: 14px; }
	.about-approved .about-audience,
	.about-approved .about-cta { padding-top: 86px; padding-bottom: 58px; }
	.about-approved .about-audience__photo {
		aspect-ratio: 284 / 380.34;
		height: auto;
		min-height: 0;
	}
	.about-approved .brand--footer .brand__logo { width: 194px; height: auto; }
	.about-approved .site-footer__tagline { max-width: 274px; margin-top: 33px; }
}