.hero {
	position: relative;
	display: flex;
	width: 100%;
	max-width: 100%;
	min-height: 85vh;
	min-height: 85svh;
	overflow: hidden;
	background: var(--color-black);
	color: var(--color-white);
}

.homepage {
	padding-block: 0;
}

.hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	max-width: 100%;
	height: 100%;
	overflow: hidden;
}

.hero__poster,
.hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
}

.hero__poster {
	background-color: var(--color-black);
	background-position: center;
	background-size: cover;
}

.hero__video {
	opacity: 0;
	object-fit: cover;
	object-position: center center;
	transition: opacity var(--transition-normal);
}

.hero.is-video-playing .hero__video {
	opacity: 1;
}

.hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	background:
		linear-gradient(180deg, rgb(9 9 9 / 14%) 0%, rgb(9 9 9 / 36%) 45%, rgb(9 9 9 / 92%) 100%),
		linear-gradient(90deg, rgb(9 9 9 / 74%) 0%, rgb(9 9 9 / 24%) 72%, rgb(9 9 9 / 10%) 100%);
	pointer-events: none;
}

.hero__inner {
	position: relative;
	z-index: 3;
	display: flex;
	flex: none;
	min-width: 0;
	align-items: flex-end;
	padding-top: var(--space-xl);
	padding-bottom: clamp(6rem, 13vh, 10rem);
}

.hero__content {
	min-width: 0;
	max-width: 48rem;
}

.hero__title {
	max-width: 12ch;
	margin-bottom: var(--space-lg);
	color: var(--color-white);
	font-size: clamp(3rem, 7vw, 7rem);
	font-weight: 600;
	line-height: 0.96;
	letter-spacing: -0.05em;
}

.hero__description {
	max-width: 42rem;
	margin-bottom: 0;
	color: rgb(255 255 255 / 78%);
	font-family: var(--font-body-family);
	font-size: var(--font-body-lg);
	line-height: var(--line-height-body);
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-md);
	margin-top: var(--space-xl);
}

.homepage-section {
	position: relative;
}

.homepage-mission__grid {
	display: grid;
	align-items: center;
	gap: var(--space-3xl);
}

.homepage-mission__copy {
	max-width: 42rem;
}

.homepage-mission__copy h2 {
	max-width: 10ch;
	font-size: var(--font-h2);
}

.homepage-mission__copy .body-large {
	max-width: 38rem;
	margin-bottom: var(--space-xl);
}

.homepage-mission__media img,
.homepage-technology__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.homepage-technology__grid {
	display: grid;
	align-items: center;
	gap: var(--space-3xl);
}

.homepage-technology__copy {
	max-width: 42rem;
}

.homepage-technology__copy h2 {
	max-width: 12ch;
}

.homepage-technology__copy .body-large {
	max-width: 38rem;
}

.homepage-knowledge .card {
	height: 100%;
}

.floating-contact {
	position: fixed;
	right: var(--space-lg);
	bottom: var(--space-lg);
	z-index: var(--z-floating-contact);
	display: flex;
	flex-direction: column;
	gap: var(--space-xs);
}

.floating-contact__item {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	min-width: 5.25rem;
	min-height: 2.75rem;
	gap: var(--space-sm);
	padding: var(--space-xs) var(--space-sm);
	border: var(--border-width) solid var(--color-border-dark);
	border-radius: var(--border-radius-sm);
	background: var(--color-black-secondary);
	color: var(--color-white);
	font-family: var(--font-heading);
	font-size: var(--font-caption);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: var(--shadow-subtle);
}

.floating-contact__item:hover {
	border-color: var(--color-orange);
	background: var(--color-surface);
	color: var(--color-orange);
}

@media (min-width: 48rem) {
	.homepage-mission__grid,
	.homepage-technology__grid {
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.85fr);
	}

	.homepage-technology__media {
		order: -1;
	}
}

@media (max-width: 75rem) {
	.hero__poster {
		background-position: center center;
	}

	.hero__video {
		object-position: center center;
	}
}

@media (max-width: 48rem) {
	.hero {
		min-height: 92vh;
		min-height: 92svh;
	}

	.hero__inner {
		padding-bottom: 7rem;
	}

	.hero__title {
		max-width: 11ch;
		font-size: clamp(2.75rem, 13vw, 4.75rem);
	}

	.hero__description {
		max-width: 34rem;
		font-size: var(--font-body);
	}

	.hero__actions {
		align-items: stretch;
		flex-direction: column;
		max-width: 20rem;
	}

	.hero__actions .button {
		width: 100%;
	}

	.homepage-mission__grid,
	.homepage-technology__grid {
		grid-template-columns: 1fr;
		gap: var(--space-2xl);
	}

	.homepage-mission__copy h2,
	.homepage-technology__copy h2 {
		max-width: none;
	}

	.floating-contact {
		right: max(var(--space-sm), env(safe-area-inset-right));
		bottom: max(var(--space-sm), env(safe-area-inset-bottom));
		flex-direction: row;
		max-width: calc(100% - (2 * var(--container-gutter)));
		gap: var(--space-2xs);
	}

	.floating-contact__item {
		min-width: 4.5rem;
		min-height: 2.625rem;
		padding-inline: var(--space-sm);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hero__video {
		display: none;
		opacity: 0;
	}
}