.home-hero {
	position: relative;
	min-height: 831px;
	overflow: hidden;
	background: var(--siliteh-color-ghost-white);
	color: var(--siliteh-color-midnight-navy);
}

@media (min-width: 1280px) {
	.home-hero {
		margin-top: calc(var(--siliteh-header-height) * -1);
	}
}

.home-hero__background {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.home-hero__inner {
	position: relative;
	width: min(calc(100% - 80px), 1320px);
	margin-inline: auto;
	padding-block: 60px 150px;
}


.home-hero__main {
	display: flex;
	flex-direction: column;
	gap: 40px;
	max-width: 945px;
}

.home-hero__heading {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.home-hero h1 {
	max-width: 945px;
	margin: 0;
	font-size: 72px;
	font-weight: 500;
	letter-spacing: -0.03em;
	line-height: 1.3;
	text-transform: capitalize;
}

.home-hero__subtitle {
	max-width: 615px;
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
}

.home-hero__support {
	display: flex;
	gap: 24px;
	align-items: flex-end;
	max-width: 615px;
}

.home-hero__support > p {
	max-width: 340px;
	margin: 0;
	font-size: 16px;
	line-height: 1.25;
}

.home-hero__button {
	flex: 0 0 auto;
	gap: 14px;
	min-height: 64px;
	border-radius: 12px;
	font-size: 20px;
	text-transform: capitalize;
}

.home-hero__button[aria-disabled="true"] {
	cursor: default;
}

.home-hero__button img {
	width: 18px;
	height: 18px;
}

.home-hero__features {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	align-items: center;
	max-width: 970px;
	/* The composition starts this row at the content edge, under the heading,
	   so its last label sits on the light ground beneath the tooling. */
	margin: 64px 0 0;
	padding: 0;
	list-style: none;
}

.home-hero__features li {
	display: flex;
	gap: 12px;
	align-items: center;
	min-height: 64px;
}

.home-hero__features li + li {
	padding-left: 32px;
	border-left: 1px solid var(--siliteh-color-medium-gray-70);
}

.home-hero__features img {
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
}

.home-hero__features strong {
	font-size: 18px;
	line-height: 1.25;
}

/* Every composition anchors the trust row to the hero's bottom edge rather
   than to the copy above it, so it stays on the light ground beneath the
   tooling however tall the copy block is. The inner's bottom padding is the
   measured gap: 150px at desktop, 147px at tablet, 58px on mobile. */
.home-hero__inner {
	display: flex;
	flex-direction: column;
	min-height: inherit;
}

.home-hero__features {
	margin-top: auto;
}

@media (max-width: 1023px) {
	.home-hero {
		min-height: 696px;
	}

	.home-hero h1 {
		font-size: 40px;
		letter-spacing: -0.01em;
	}

	.home-hero__inner {
		padding-bottom: 147px;
	}

	.home-hero__support {
		max-width: 490px;
	}
}

@media (min-width: 601px) and (max-width: 699px) {
	.home-hero__features {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.home-hero__features li + li {
		padding-left: 0;
		border-left: 0;
	}
}

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

	.home-hero__background {
		left: -104%;
		width: 549%;
	}

	.home-hero__inner {
		width: calc(100% - 40px);
		padding-block: 60px 58px;
	}

	.home-hero__main {
		gap: 40px;
	}

	.home-hero h1 {
		font-size: 32px;
	}

	.home-hero__support {
		align-items: flex-start;
	}

	.home-hero__support > p {
		max-width: 260px;
	}

	.home-hero__button {
		position: absolute;
		top: 516px;
		left: 0;
		width: 100%;
	}

	.home-hero__features {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.home-hero__features li + li {
		padding-left: 0;
		border-left: 0;
	}
}