/**
 * Our Mission page layout — Figma nodes 153:3969 (desktop) / 153:4130 (mobile).
 */

.ipopi-about {
	display: flex;
	flex-direction: column;
	background: var(--ipopi-color-background-base, #ffffff);
}

/* Hero block */
.ipopi-about .wp-block-ipopi-page-hero .ipopi-page-hero__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: var(--ipopi-space-600, 40px) var(--ipopi-space-400, 24px) var(--ipopi-space-400, 24px);
	gap: var(--ipopi-space-400, 24px);
}

.ipopi-about .wp-block-ipopi-page-hero .ipopi-page-hero__title {
	text-align: left;
}

.ipopi-about .wp-block-ipopi-page-hero .ipopi-page-hero__media img {
	object-position: center 60%;
}

/* Content body wrapper */
.ipopi-about__body {
	display: flex;
	flex-direction: column;
	gap: var(--ipopi-space-600, 40px);
	max-width: 1280px;
	width: 100%;
	margin: 0 auto;
	padding: var(--ipopi-space-600, 40px) var(--ipopi-space-400, 24px);
	box-sizing: border-box;
}

.ipopi-about__body .wp-block-ipopi-content-section .ipopi-section__inner,
.ipopi-about__body .wp-block-ipopi-accordion-section .ipopi-section__inner {
	padding: 0;
}

/* Section titles scoped to About page */
.ipopi-about .ipopi-content-section__title,
.ipopi-about .ipopi-accordion-section__title {
	margin-bottom: var(--ipopi-space-300, 16px);
	font-size: var(--ipopi-type-heading-4-mobile-size, 40px);
	line-height: var(--ipopi-type-heading-4-mobile-line-height, 48px);
	letter-spacing: var(--ipopi-type-heading-4-mobile-letter-spacing, -0.4px);
}

.ipopi-about .ipopi-content-section__title {
	text-align: left;
}

.ipopi-about .ipopi-content-section__body,
.ipopi-about .ipopi-accordion-section__intro {
	color: var(--ipopi-color-text, #2b2827);
}

.ipopi-about .ipopi-accordion-section__intro {
	margin-bottom: var(--ipopi-space-300, 16px);
}

@media (min-width: 768px) {
	.ipopi-about {
		gap: 0;
	}

	.ipopi-about .wp-block-ipopi-page-hero .ipopi-page-hero__inner {
		padding: var(--ipopi-space-1000, 72px) var(--ipopi-space-700, 48px) 0;
		gap: var(--ipopi-space-700, 48px);
	}

	.ipopi-about .wp-block-ipopi-page-hero .ipopi-page-hero__title {
		text-align: center;
	}

	.ipopi-about__body {
		gap: var(--ipopi-space-700, 48px);
		padding: var(--ipopi-space-700, 48px) var(--ipopi-space-700, 48px) var(--ipopi-space-1000, 72px);
	}

	.ipopi-about .ipopi-content-section__title,
	.ipopi-about .ipopi-accordion-section__title {
		font-size: var(--ipopi-type-heading-4-size, 48px);
		line-height: var(--ipopi-type-heading-4-line-height, 58px);
		letter-spacing: var(--ipopi-type-heading-4-letter-spacing, -0.48px);
	}
}