.eclipsia-rts-hero-mounted > .eclipsia-rts-layer {
	position: absolute;
	inset: 0;
	width: auto;
	max-width: none;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	background:
		radial-gradient(circle at 76% 16%, rgba(69, 58, 135, 0.25), transparent 43%),
		radial-gradient(circle at 18% 72%, rgba(26, 48, 105, 0.2), transparent 50%),
		linear-gradient(148deg, #040711 0%, #071024 48%, #13102c 100%);
	opacity: 1;
	isolation: isolate;
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-layer::after {
	position: absolute;
	inset: auto 0 0;
	height: min(20%, 160px);
	content: "";
	background: linear-gradient(to bottom, transparent, rgba(4, 7, 17, 0.3));
}

.eclipsia-rts-layer > .eclipsia-rts-canvas {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	opacity: 0;
	pointer-events: none;
	transition: opacity 700ms ease;
}

.eclipsia-rts-layer > .eclipsia-rts-canvas.eclipsia-rts-canvas-ready {
	opacity: 1;
}

.eclipsia-rts-layer > .eclipsia-rts-content-shade {
	position: absolute;
	border-radius: 999px;
	background: radial-gradient(
		ellipse at center,
		rgba(4, 8, 20, 0.5) 0%,
		rgba(4, 8, 20, 0.22) 42%,
		transparent 64%
	);
	filter: blur(8px);
	opacity: 0.72;
	pointer-events: none;
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-content-mounted {
	text-shadow: 0 2px 20px rgba(0, 0, 0, 0.42);
}

.eclipsia-rts-navigation-over-hero {
	z-index: 20;
	color: rgba(248, 249, 255, 0.96);
	background: linear-gradient(to bottom, rgba(3, 6, 17, 0.68), rgba(3, 6, 17, 0));
	transition: background-color 220ms ease, color 220ms ease;
}

.eclipsia-rts-navigation-over-hero a {
	color: inherit;
	text-shadow: 0 1px 14px rgba(0, 0, 0, 0.38);
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(224, 231, 255, 0.38);
	border-radius: 999px;
	color: rgba(246, 248, 255, 0.88);
	background: rgba(5, 9, 24, 0.28);
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.2);
	font: 400 22px/1 ui-sans-serif, system-ui, -apple-system, sans-serif;
	cursor: pointer;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	transition: border-color 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue:hover {
	border-color: rgba(238, 242, 255, 0.72);
	background: rgba(20, 25, 53, 0.5);
	transform: translateX(-50%) translateY(2px);
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue:focus-visible {
	outline: 2px solid #e8ecff;
	outline-offset: 4px;
}

.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue > span {
	display: block;
	transform: translateY(-2px);
}

@media (max-width: 639px) {
	.eclipsia-rts-layer > .eclipsia-rts-content-shade {
		filter: blur(6px);
	}

	.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue {
		bottom: max(14px, env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.eclipsia-rts-layer > .eclipsia-rts-canvas,
	.eclipsia-rts-navigation-over-hero,
	.eclipsia-rts-hero-mounted > .eclipsia-rts-scroll-cue {
		transition: none;
	}
}