/* Static dots connect adjacent dark sections without obscuring their content. */
.section-transition-dots {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	overflow: hidden;
}
.section-transition-dots::before,
.section-transition-dots::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	height: 108px;
	background-image: radial-gradient(circle, #76dec94d 1px, transparent 1.3px);
	background-size: 18px 18px;
	mask-composite: intersect;
}
.section-transition-dots::before {
	top: 0;
	mask-image: linear-gradient(#000, transparent), linear-gradient(90deg, transparent 3%, #000 25%, #000 75%, transparent 97%);
}
.section-transition-dots::after {
	bottom: 0;
	mask-image: linear-gradient(transparent, #000), linear-gradient(90deg, transparent 3%, #000 25%, #000 75%, transparent 97%);
}
.hero-personal > .section-transition-dots::before {
	content: none;
}
@media (max-width: 767px) {
	.section-transition-dots::before,
	.section-transition-dots::after {
		height: 72px;
	}
}
/* Fade decorative backgrounds into the shared page base at section edges. */
.moritz-dark-site .section-shell.section-background:not(.hero-personal)::before,
.moritz-dark-site .section-shell.section-background:not(.hero-personal)::after,
.moritz-dark-site .section-shell:not(.hero-personal) > .section-world-background {
	mask-image: linear-gradient(transparent, #000 108px, #000 calc(100% - 108px), transparent);
}
@media (max-width: 767px) {
	.moritz-dark-site .section-shell.section-background:not(.hero-personal)::before,
	.moritz-dark-site .section-shell.section-background:not(.hero-personal)::after,
	.moritz-dark-site .section-shell:not(.hero-personal) > .section-world-background {
		mask-image: linear-gradient(transparent, #000 72px, #000 calc(100% - 72px), transparent);
	}
}
.moritz-dark-site .section-shell.section-background:not(.hero-personal) {
	background-color: #0b1019;
}
