/*
 * The index: WebUpp's own register (theme.json defaults are the WebUpp
 * dark tokens), for a catalogue of the styles (Steve, 2026-10-13: a
 * catalogue, not a second WebUpp home page). This file sets the slots
 * WebUpp's child sets in webupp.css, with the same values, since the
 * WebUpp child is not on this site. Loaded on the index (and any page
 * without a style set) only.
 */

:root {
	--wu-glow-tint: #7b3fe4;
	--wu-glow-red: rgba(235, 38, 58, 0.22);
	--wu-glow-purple: rgba(123, 63, 228, 0.22);
	--wu-glow-blue: rgba(47, 107, 255, 0.22);
	--wu-chip-bg: #191428;
	--wu-chip-border: rgba(157, 112, 235, 0.28);
	--wu-button-glow: rgba(123, 63, 228, 0.7);
	--st-header-ground: rgba(10, 10, 18, 0.8);
	--st-glow-a: rgba(235, 38, 58, 0.5);
	--st-glow-b: rgba(123, 63, 228, 0.55);
	--st-glow-c: rgba(47, 107, 255, 0.5);
	--st-display-weight: 800;
}

/* The hero: two lines of type, the ruled sentence under them, one button;
   one soft brand glow behind (CSS only, still under reduced motion). */
html[data-style="index"] .st-hero--plain {
	isolation: isolate;
	padding-block: 72px 56px;
}

html[data-style="index"] .st-hero--plain::before {
	content: "";
	position: absolute;
	top: -320px;
	right: -260px;
	z-index: -1;
	width: 900px;
	height: 900px;
	border-radius: 50%;
	background: radial-gradient(closest-side, var(--wu-glow-purple), transparent 100%);
	pointer-events: none;
}

html[data-style="index"] .st-hero__title {
	max-width: 20ch;
}

html[data-style="index"] .st-hero__lead {
	max-width: 46ch;
}

@media (min-width: 1025px) {
	html[data-style="index"] .st-hero--plain {
		padding-block: 104px 72px;
	}
}

/* The catalogue directly under the hero: no rule between them. */
html[data-style="index"] .st-dirs.wu-section--rule::before {
	display: none;
}

html[data-style="index"] .st-dirs {
	padding-top: 24px;
}