.site-main--about {
	width: 100%;
	max-width: none;
	padding: 0;
	overflow: clip;
}

.about-section {
	padding: var(--ewh-section-space) max(var(--ewh-gutter), calc((100vw - var(--ewh-content-width)) / 2 + var(--ewh-gutter)));
}

.about-hero {
	position: relative;
	display: grid;
	min-height: clamp(38rem, 72vh, 48rem);
	align-items: end;
	padding: var(--ewh-internal-hero-space-top) max(var(--ewh-gutter), calc((100vw - var(--ewh-content-width)) / 2 + var(--ewh-gutter))) var(--ewh-internal-hero-space-bottom);
	overflow: hidden;
}

.about-hero::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgb(0 0 0 / 96%) 0%, rgb(0 0 0 / 78%) 58%, rgb(0 0 0 / 26%) 100%);
	content: "";
}

.about-hero__image {
	position: absolute;
	inset: 0 0 0 auto;
	width: 50%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
	filter: grayscale(1);
}

.about-hero__content {
	position: relative;
	z-index: 1;
	max-width: 67rem;
}

.about-hero :where(h1, .ewh-eyebrow) {
	color: var(--ewh-color-white);
}

.about-hero h1 {
	max-width: 13ch;
	font-size: clamp(3.5rem, 6.5vw, 5.5rem);
}

.about-hero p {
	max-width: 49rem;
	margin: var(--ewh-space-4) 0 0;
	color: rgb(255 255 255 / 76%);
}

.about-overview,
.about-direction,
.about-philosophy,
.about-cta {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--ewh-space-4);
}

.about-overview {
	align-items: center;
}

.about-overview__media {
	grid-column: 1 / span 6;
	aspect-ratio: 4 / 3;
}

.about-overview__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about-overview__content {
	grid-column: 8 / -1;
}

.about-beliefs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding-block: 0;
}

.about-belief {
	position: relative;
	display: flex;
	min-height: 40rem;
	flex-direction: column;
	justify-content: flex-end;
	padding: var(--ewh-space-6);
	overflow: hidden;
	border-left: 1px solid rgb(255 255 255 / 18%);
}

.about-belief:last-child {
	border-right: 1px solid rgb(255 255 255 / 18%);
}

.about-belief__index {
	position: absolute;
	top: var(--ewh-space-4);
	right: var(--ewh-space-4);
	color: rgb(255 255 255 / 7%);
	font-family: var(--ewh-font-display);
	font-size: clamp(9rem, 18vw, 18rem);
	line-height: 0.8;
}

.about-belief :where(h2, .ewh-eyebrow) {
	position: relative;
	color: var(--ewh-color-white);
}

.about-belief p {
	position: relative;
	max-width: 34rem;
	color: rgb(255 255 255 / 72%);
}

.about-direction header {
	grid-column: 1 / span 6;
}

.about-direction__copy {
	grid-column: 8 / -1;
}

.about-philosophy {
	align-items: center;
	background: var(--ewh-color-off-white);
}

.about-philosophy__mark {
	grid-column: 1 / span 5;
	color: var(--ewh-color-navy);
	font-family: var(--ewh-font-display);
	font-size: clamp(12rem, 28vw, 28rem);
	line-height: 0.7;
	opacity: 0.12;
}

.about-philosophy__content {
	grid-column: 7 / -1;
}

.about-section__intro {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: var(--ewh-space-4);
	margin-bottom: var(--ewh-space-6);
}

.about-section__intro > div {
	grid-column: 1 / span 8;
}

.about-process__list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--ewh-color-black);
	list-style: none;
}

.about-process__list li {
	display: flex;
	min-height: 27rem;
	flex-direction: column;
	padding: var(--ewh-space-3);
	border-right: var(--ewh-border);
	border-bottom: var(--ewh-border);
}

.about-process__list li:first-child {
	border-left: var(--ewh-border);
}

.about-process__list span {
	color: var(--ewh-color-muted-text);
	font-size: var(--ewh-font-size-label);
	letter-spacing: 0.1em;
}

.about-process__list h3 {
	margin-top: auto;
}

.about-process__list p {
	margin-bottom: 0;
	color: var(--ewh-color-graphite);
	font-size: var(--ewh-font-size-small);
}

.about-cta {
	align-items: end;
	background: var(--ewh-color-navy);
	color: var(--ewh-color-white);
}

.about-cta > div {
	grid-column: 1 / span 8;
}

.about-cta :where(h2, .ewh-eyebrow) {
	color: var(--ewh-color-white);
}

.about-cta h2 {
	max-width: 16ch;
	margin-bottom: 0;
}

.about-cta .ewh-button {
	grid-column: 10 / -1;
	justify-self: end;
	border-color: var(--ewh-color-white);
	background: var(--ewh-color-white);
	color: var(--ewh-color-black);
}

.site-main--about + .site-footer,
.page-template-page-about .site-footer {
	margin-top: 0;
}

@media (max-width: 64rem) {
	.about-overview,
	.about-direction,
	.about-philosophy,
	.about-cta,
	.about-section__intro {
		grid-template-columns: repeat(8, minmax(0, 1fr));
	}

	.about-overview__media,
	.about-overview__content,
	.about-direction header,
	.about-direction__copy,
	.about-philosophy__mark,
	.about-philosophy__content,
	.about-section__intro > div,
	.about-cta > div,
	.about-cta .ewh-button {
		grid-column: 1 / -1;
	}

	.about-overview__content,
	.about-direction__copy,
	.about-philosophy__content {
		max-width: var(--ewh-reading-width);
	}

	.about-philosophy__mark {
		font-size: 12rem;
	}

	.about-process__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.about-process__list li {
		min-height: 22rem;
		border-left: var(--ewh-border);
	}

	.about-cta .ewh-button {
		justify-self: start;
	}
}

@media (max-width: 48rem) {
	.about-hero {
		min-height: 40rem;
	}

	.about-hero::after {
		background: linear-gradient(180deg, rgb(0 0 0 / 38%) 0%, rgb(0 0 0 / 94%) 48%, var(--ewh-color-black) 100%);
	}

	.about-hero__image {
		width: 100%;
		height: 54%;
	}

	.about-hero h1 {
		font-size: clamp(3rem, 13.5vw, 4.25rem);
	}

	.about-beliefs {
		grid-template-columns: 1fr;
	}

	.about-belief {
		min-height: 31rem;
		padding: var(--ewh-space-4) var(--ewh-gutter);
		border-right: 1px solid rgb(255 255 255 / 18%);
		border-bottom: 1px solid rgb(255 255 255 / 18%);
	}

	.about-process__list {
		grid-template-columns: 1fr;
	}

	.about-process__list li {
		min-height: 16rem;
	}

	.about-cta .ewh-button {
		width: 100%;
	}
}
