/* Fonts, reset, typography and layout. Tokens only. */
@font-face {
	font-family: "Orbitron";
	src: url("../fonts/orbitron-latin-wght.woff2") format("woff2");
	font-weight: 400 900;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-wght.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-body);
	line-height: var(--leading-body);
	color: var(--color-text);
	background: var(--color-bg);
	-webkit-font-smoothing: antialiased;
}

img,
svg,
video { display: block; max-inline-size: 100%; block-size: auto; }

button,
input,
select,
textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

/* Typography */
h1, h2, h3, h4,
.sw-heading {
	margin: 0;
	font-family: var(--font-heading);
	font-weight: var(--weight-regular);
	color: var(--color-heading);
	letter-spacing: var(--tracking-heading);
	overflow-wrap: break-word;
}

h1, .sw-heading--h1 { font-size: var(--text-display); line-height: var(--leading-display); }
h2, .sw-heading--h2 { font-size: var(--text-h2); line-height: var(--leading-h2); }
h3, .sw-heading--h3 { font-size: var(--text-h3); line-height: var(--leading-h3); }
h4, .sw-heading--h4 {
	font-size: var(--text-h4);
	line-height: var(--leading-h4);
	font-weight: var(--weight-medium);
	letter-spacing: var(--tracking-label);
}

p { margin-block: 0; }
p + p { margin-block-start: var(--leading-body); }

a { color: inherit; text-underline-offset: 0.2em; transition: color var(--transition); }
a:hover { color: var(--color-primary); }

:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

/* Layout */
.sw-container {
	inline-size: 100%;
	max-inline-size: calc(var(--container-max) + 2 * var(--gutter));
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.sw-section {
	position: relative;
	padding-block: var(--section-space);
}
.sw-section--alt { background: var(--color-bg-alt); }

/* Two sections on the same background are one section-space apart, not two. */
.sw-section:not(.sw-section--alt) + .sw-section:not(.sw-section--alt),
.sw-section--alt + .sw-section--alt { padding-block-start: 0; }
.sw-section--flush-top { padding-block-start: 0; }

/* Accessibility */
.screen-reader-text,
.sw-visually-hidden {
	position: absolute !important;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.sw-body--locked { overflow: hidden; }

.sw-skip-link:focus {
	position: fixed;
	inset-block-start: var(--space-8);
	inset-inline-start: var(--space-8);
	z-index: 1000;
	inline-size: auto;
	block-size: auto;
	padding: var(--space-8) var(--space-16);
	clip: auto;
	background: var(--color-primary);
	color: var(--color-on-primary);
}

/* Editor (WYSIWYG) content */
.sw-wysiwyg { max-inline-size: 53.75rem; }
.sw-wysiwyg > * + * { margin-block-start: var(--space-24); }
.sw-wysiwyg :is(h2, h3, h4) { margin-block-start: var(--space-48); }
.sw-wysiwyg a { color: var(--color-primary); }
.sw-wysiwyg :is(ul, ol) { padding-inline-start: var(--space-24); }
