/*
 * Fonts, reset and element defaults. Classless: everything here styles plain
 * HTML so editor content and plugin output look right without theme classes.
 */
@font-face {
	font-family: "Geist";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/geist-var.woff2") format("woff2");
}
@font-face {
	font-family: "Geist Mono";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/geist-mono-var.woff2") format("woff2");
}

@layer reset {
	*, *::before, *::after { box-sizing: border-box; }
	html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
	body { margin: 0; }
	img, svg, video, canvas { display: block; max-width: 100%; }
	img, video { height: auto; }
	input, button, textarea, select { font: inherit; color: inherit; max-width: 100%; }
	h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; }
	ul[class], ol[class] { margin: 0; padding: 0; list-style: none; }
	@media (prefers-reduced-motion: reduce) {
		*, *::before, *::after { animation-duration: var(--gp-motion-reduced) !important; transition-duration: var(--gp-motion-reduced) !important; scroll-behavior: auto !important; }
	}
}

@layer base {
	html { scroll-behavior: smooth; scroll-padding-top: var(--gp-s6); }
	body {
		background: var(--gp-paper);
		color: var(--gp-ink);
		font-family: var(--gp-font);
		font-size: var(--gp-fs-base);
		line-height: var(--gp-lh-body);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
	}
	a { color: var(--gp-ink-2); text-underline-offset: var(--gp-link-underline-offset); text-decoration-thickness: var(--gp-link-underline-width); }
	a:hover { color: var(--gp-ink-black); }
	:focus-visible { outline: 2px solid var(--gp-ink); outline-offset: 2px; border-radius: var(--gp-space-hair); }
	h1, h2, h3, h4 { font-weight: 300; letter-spacing: var(--gp-track-display); line-height: var(--gp-lh-heading); text-wrap: balance; }
	h3, h4 { font-weight: 500; letter-spacing: var(--gp-track-heading); line-height: var(--gp-lh-title); }
	p { text-wrap: pretty; }
	b, strong { font-weight: 600; }
	code, kbd, pre { font-family: var(--gp-mono); font-size: var(--gp-fs-code); }
	hr { border: 0; border-top: 1px solid var(--gp-line); margin: var(--gp-s10) 0; }
	::placeholder { color: var(--gp-muted); opacity: 1; }
	::selection { background: var(--gp-selection); }
}

@layer utilities {
@media print {
	@page { margin: var(--gp-print-margin); }
	body { background: var(--gp-white); color: var(--gp-ink-black); font-size: var(--gp-fs-print); }
	.gp-header, .gp-footer, .gp-pond, .gp-halo, .gp-nl, .gp-railshare, .gp-article__comments, form, .novashare-inline, .novashare-floating { display: none; }
	.gp-hero { min-height: 0; padding: var(--gp-s4) 0; }
	.gp-wrap { max-width: none; padding: 0; }
	.gp-railcard--toc, .gp-plancheck { position: static; }
	.gp-article__layout, .gp-split { display: block; }
	.gp-prose, .gp-article__main { max-width: none; color: var(--gp-ink-black); }
	h1, h2, h3, h4 { break-after: avoid; }
	p, li { orphans: 3; widows: 3; }
	img, figure { break-inside: avoid; }
	a { color: var(--gp-ink-black); }
}

}

@layer utilities {
	.gp-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: var(--gp-offset-hair); overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } }
