.maxim-landing {
	background: var(--color-page);
}

.maxim-hero {
	position: relative;
	display: flex;
	min-height: calc(min(720px, 100vh) + 32px);
	min-height: calc(min(720px, 100svh) + 32px);
	align-items: center;
	overflow: hidden;
	background: #eef2f4;
}

/* Hello Elementor/WP can reserve a 32px top row; extend the hero behind it. */
.page-template-page-landing .maxim-hero {
	margin-top: -38px;
}

.maxim-hero__media {
	position: absolute;
	inset: 0;
}

.maxim-hero__media::after {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgb(242 246 247 / 44%) 0%, rgb(242 246 247 / 36%) 25%, rgb(242 246 247 / 14%) 42%, transparent 58%),
		linear-gradient(0deg, rgb(242 246 247 / 6%), transparent 24%);
	content: "";
}

.maxim-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 50%;
}

.maxim-hero__content {
	position: relative;
	z-index: 1;
	padding-block: 150px 96px;
}

.maxim-hero__content .section__eyebrow {
	margin-bottom: var(--space-4);
}

.maxim-hero__title {
	max-width: 780px;
	margin: 0;
	color: var(--color-ink);
	font-family: var(--font-display);
	font-size: clamp(3.35rem, 4.9vw, 5.6rem);
	font-weight: 500;
	letter-spacing: -0.035em;
	line-height: 0.9;
	text-transform: uppercase;
}

.maxim-hero__description {
	max-width: 430px;
	margin: var(--space-5) 0 0;
	color: var(--color-text-muted);
	font-size: var(--font-size-lg);
	line-height: 1.5;
}

.maxim-hero__actions {
	display: flex;
	align-items: center;
	gap: var(--space-6);
	margin-top: var(--space-6);
}

.maxim-hero__secondary {
	display: inline-flex;
	align-items: center;
	gap: var(--space-3);
	color: var(--color-ink);
	font-size: var(--font-size-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

.maxim-hero__play {
	display: grid;
	width: 30px;
	height: 30px;
	place-items: center;
	border: 1px solid var(--color-ink);
	border-radius: var(--radius-pill);
	font-size: 0.55rem;
	transition: background-color var(--transition-fast), color var(--transition-fast);
}

.maxim-hero__secondary:hover .maxim-hero__play {
	background: var(--color-ink);
	color: var(--color-on-dark);
}

@media (min-width: 1500px) {
	.maxim-hero {
		min-height: 812px;
	}
}

@media (max-width: 900px) {
	.maxim-hero {
		min-height: calc(min(760px, 100vh) + 32px);
		min-height: calc(min(760px, 100svh) + 32px);
		align-items: flex-end;
	}

	.maxim-hero__media img {
		object-position: 58% 50%;
	}

	.maxim-hero__media::after {
		background:
			linear-gradient(90deg, rgb(242 246 247 / 70%) 0%, rgb(242 246 247 / 54%) 40%, rgb(242 246 247 / 8%) 80%),
			linear-gradient(0deg, rgb(242 246 247 / 84%) 0%, rgb(242 246 247 / 42%) 36%, transparent 75%);
	}

	.maxim-hero__content {
		padding-block: 180px 72px;
	}
	
	.maxim-hero__title {
		max-width: 540px;
		font-size: clamp(3.1rem, 8.5vw, 4.7rem);
	}

}

@media (max-width: 600px) {
	.maxim-hero {
		min-height: 772px;
	}

	.maxim-hero__media img {
		object-position: 62% 15%;
	}

	.maxim-hero__media::after {
		background:
			linear-gradient(180deg, rgb(242 246 247 / 34%) 0%, transparent 34%),
			linear-gradient(0deg, rgb(242 246 247 / 90%) 0%, rgb(242 246 247 / 74%) 43%, rgb(242 246 247 / 8%) 78%);
	}

	.maxim-hero__content {
		padding-block: 220px 52px;
	}

	.maxim-hero__title {
		max-width: 420px;
		font-size: clamp(3rem, 13vw, 4.5rem);
	}

	.maxim-hero__description {
		max-width: 360px;
		font-size: var(--font-size-base);
	}

	.maxim-hero__actions {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--space-4);
	}
}
