.rah-heading {
	--rah-spot-x: 50%;
	--rah-spot-y: 50%;
	--rah-spot-size: 90px;
	--rah-spot-color: #fff;
	--rah-spot-blend: difference;
	--rah-highlight-color: #b8ff2c;
	--rah-scroll-start-color: #686868;
	--rah-scroll-end-color: #ffffff;
	margin: 0;
}

.rah-heading-link {
	color: inherit;
	text-decoration: inherit;
}

.rah-highlight {
	color: var(--rah-highlight-color);
	font-weight: 700;
}

.rah-word {
	display: inline-block;
	white-space: nowrap;
}

.rah-char {
	display: inline-block;
	position: relative;
	will-change: transform, opacity;
}


.rah-heading.rah-has-spotlight {
	position: relative;
	isolation: isolate;
}

.rah-heading.rah-has-spotlight::after {
	content: "";
	position: absolute;
	left: var(--rah-spot-x);
	top: var(--rah-spot-y);
	width: var(--rah-spot-size);
	height: var(--rah-spot-size);
	border-radius: 50%;
	background: var(--rah-spot-color);
	transform: translate(-50%, -50%) scale(.85);
	opacity: 0;
	pointer-events: none;
	z-index: 10;
	mix-blend-mode: var(--rah-spot-blend);
	transition: opacity .18s ease, transform .18s ease;
}

.rah-heading.rah-has-spotlight.rah-spotlight-active::after {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1);
}

@media (hover: none), (pointer: coarse) {
	.rah-heading.rah-has-spotlight::after {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rah-heading .rah-char {
		opacity: 1 !important;
		transform: none !important;
		will-change: auto !important;
	}

	.rah-heading.rah-has-spotlight::after {
		transition: none;
	}
}