/* Spartan AI redesign: tokens and global type.
   Every other sprt-*.css file reads these variables; do not redefine them elsewhere.
   All rules are scoped under body.sprt so the layer can be switched off in one place. */

:root {
	/* Colour */
	--sprt-paper: #f8f6f2;      /* page background, warm off-white */
	--sprt-surface: #ffffff;    /* raised panels on paper */
	--sprt-ink: #160a33;        /* deep indigo: text, dark sections, footer */
	--sprt-ink-soft: #4a4263;   /* secondary text on paper */
	--sprt-violet: #5a3fd0;     /* brand accent, taken from the logo */
	--sprt-violet-deep: #3d2a9e;
	--sprt-lilac: #b9a8ff;      /* glow, accents on ink */
	--sprt-signal: #2f6bff;     /* second glow stop, links on ink */
	--sprt-line: #e4dfd8;       /* hairlines on paper */
	--sprt-line-ink: rgba(248, 246, 242, 0.16); /* hairlines on ink */
	--sprt-on-ink: #f8f6f2;
	--sprt-on-ink-soft: rgba(248, 246, 242, 0.72);

	/* Type */
	--sprt-serif: "Newsreader", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
	--sprt-sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
	--sprt-mono: "DM Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

	--sprt-fs-display: clamp(2.5rem, 1.6rem + 3.2vw, 3.75rem);
	--sprt-fs-h2: clamp(2rem, 1.4rem + 2.2vw, 3.25rem);
	--sprt-fs-h3: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem);
	--sprt-fs-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
	--sprt-fs-body: 1rem;
	--sprt-fs-small: 0.875rem;
	--sprt-fs-label: 0.8125rem;

	/* Shape and space */
	--sprt-radius-pill: 999px;
	--sprt-radius-panel: 20px;
	--sprt-radius-control: 8px;
	--sprt-gutter: clamp(1.25rem, 5.5vw, 5rem);
	--sprt-maxw: 1280px;
	--sprt-section-y: clamp(4rem, 9vw, 8rem);
}

body.sprt {
	background-color: var(--sprt-paper);
	color: var(--sprt-ink);
	font-family: var(--sprt-sans);
	font-size: var(--sprt-fs-body);
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

body.sprt h1,
body.sprt h2,
body.sprt h3,
body.sprt .firwl-h1,
body.sprt .firwl-h2,
body.sprt .firwl-h3 {
	font-family: var(--sprt-serif);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1.1;
	text-transform: none;
}

body.sprt h4,
body.sprt h5,
body.sprt h6,
body.sprt .firwl-h4,
body.sprt .firwl-h5,
body.sprt .firwl-h6 {
	font-family: var(--sprt-sans);
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.3;
	text-transform: none;
}

body.sprt p,
body.sprt li {
	font-family: var(--sprt-sans);
}

body.sprt a {
	color: inherit;
}

/* The parent theme sets `* { outline: none !important }`, so the ring needs !important. */
body.sprt :focus-visible {
	outline: 2px solid var(--sprt-violet) !important;
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	body.sprt *,
	body.sprt *::before,
	body.sprt *::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}

	html:has(body.sprt) {
		scroll-behavior: auto !important;
	}
}
