.pixelated-scroll__section {
	color: #252634;
	justify-content: center;
	align-items: center;
	min-height: 100svh;
	display: flex;
	position: relative;
	overflow: hidden;
}

.pixelated-scroll__bg {
	z-index: 0;
	background-color: #000;
	position: absolute;
	inset: 0%;
}

.pixelated-scroll__bg-img {
	opacity: .8;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.pixelated-scroll__content {
	z-index: 1;
	position: relative;
}

.pixelated-scroll__h {
	text-align: center;
	letter-spacing: -.04em;
	max-width: 8em;
	margin-top: 0;
	margin-bottom: 0;
	font-family: Haffer XH, Arial, sans-serif;
	font-size: 6em;
	font-weight: 400;
	line-height: .95;
}

.pixelated-scroll-transition {
	z-index: 10;
	pointer-events: none;
	color: #252634;
	--pixel-color: #252634;
	position: absolute;
	inset: auto 0% 0%;
}

[data-pixelated-scroll-panel] {
	display: flex;
	flex-direction: row;
	width: 100%;
}

[data-pixelated-scroll-column] {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	flex: 1 1 0%;
	min-width: 0;
}

[data-pixelated-scroll-pixel] {
	aspect-ratio: 1;
	width: 100%;
	background-color: var(--pixel-color);
	backface-visibility: hidden;
	will-change: opacity;
}

[data-pixelated-scroll-transition][data-pixel-ratio="2.5/1"] [data-pixelated-scroll-pixel] {
	aspect-ratio: 2.5/1;
}