.home-intro {
	position: fixed;
	inset: 0;
	z-index: 9999999;

	display: flex;
	align-items: center;
	justify-content: center;

	overflow: hidden;
	pointer-events: none;
}

html.hd-intro-locked,
html.hd-intro-locked body {
	overflow: hidden !important;
	height: 100% !important;
	scrollbar-gutter: stable;
}

.home-intro ._rows {
	position: absolute;
	inset: -1px 0;

	display: flex;
	flex-direction: column;
}

.home-intro ._row {
	flex: 1 1 0;
	width: 100%;
	height: calc(100% + 2px);
	margin-top: -1px;

	/* background-color: var(--hd-intro-row-color, #000); */
	background-color: #ffffff;
	backface-visibility: hidden;
	transform: translateZ(0);
	will-change: transform;

	transition:
		transform 1.25s cubic-bezier(0.76, 0, 0.24, 1),
		background-color 0.9s ease-in-out;
}

.home-intro ._row:first-child {
	margin-top: 0;
}

.home-intro ._logo {
	position: relative;
	z-index: 2;

	width: min(350px, 80vw);

	opacity: 1;
	transform: scale(1);
}

.home-intro ._logo svg {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.home-intro ._logo path {
	fill-opacity: 0;

	/* stroke: var(--hd-intro-svg-color, #fff); */
	stroke: #000000;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.home-intro.is-ready ._logo path {
	animation:
		home-intro-logo-draw 1.8s ease-in-out forwards,
		home-intro-logo-fill 0.6s ease-in-out 1.4s forwards;
}

.home-intro.is-leaving ._row {
	background-color: var(--hd-intro-leaving-color, rgba(255, 255, 255, 0.8));
}

.home-intro.is-leaving ._row:nth-child(odd) {
	transform: translateX(-105%);
}

.home-intro.is-leaving ._row:nth-child(even) {
	transform: translateX(105%);
}

.home-intro.is-leaving ._logo {
	opacity: 0;
	transform: scale(0.97);

	transition:
		opacity 1.05s ease-in-out,
		transform 1.15s cubic-bezier(0.76, 0, 0.24, 1);
}

@keyframes home-intro-logo-draw {
	from {
		stroke-dashoffset: var(--path-length, 2000px);
	}

	to {
		stroke-dashoffset: 0;
	}
}

@keyframes home-intro-logo-fill {
	0% {
		fill-opacity: 0;
		stroke-opacity: 1;
	}

	100% {
		fill-opacity: 1;
		stroke-opacity: 0;
	}
}

section[class^='home-'],
section[class*=' home-'] {
	overflow-x: hidden;
	overflow-x: clip;
}