/*
 * Base: reset, document typography and plain elements (html, body, h1-h6, p, li, a, img, button, input, :focus).
 * No classes except .screen-reader-text. Values reproduce what Oxygen + Automatic.css computed.
 */

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

html {
	font-size: 62.5%;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	min-block-size: 100vh;
	background-color: var(--white);
	font-family: var(--font-body);
	font-size: var(--text-m);
	line-height: 1.5;
	text-wrap: pretty;
}

[id] {
	scroll-margin-top: var(--offset, 0);
}

/* ---- Headings ---- */
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	max-width: 100%;
	color: var(--base);
	font-weight: var(--heading-font-weight);
	line-height: 1.2;
	text-wrap: pretty;
}

h1 {
	font-size: var(--h1);
}

h2 {
	font-size: var(--h2);
}

h3 {
	font-size: var(--h3);
}

h4 {
	font-size: var(--h4);
	line-height: var(--heading-line-height);
}

h5 {
	font-size: var(--h5);
}

h6 {
	font-size: var(--h6);
}

/* ---- Text ---- */
p,
li {
	line-height: var(--text-line-height);
}

b,
strong {
	font-weight: bolder;
}

small {
	font-size: 80%;
}

/* ---- Links ---- */
a {
	background-color: transparent;
}

/* "body a" keeps the specificity Automatic.css had, so plugin link rules win or lose as before. */
body a {
	color: var(--primary);
	font-weight: 400;
	text-decoration: none;
	transition: var(--transition);
}

body a:hover {
	color: var(--primary-hover);
}

/* Links inside headings take the heading colour (after the body a rule on purpose). */
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: currentcolor;
	font-weight: inherit;
	text-decoration: inherit;
}

@media (hover: hover) and (pointer: fine) {
	h1 a:hover,
	h2 a:hover,
	h3 a:hover,
	h4 a:hover,
	h5 a:hover,
	h6 a:hover {
		color: currentcolor;
	}
}

/* ---- Media ---- */
img {
	border-style: none;
	object-fit: var(--object-fit, cover);
	object-position: var(--object-position, 50% 50%);
}

svg:not(:root) {
	overflow: hidden;
}

/* ---- Form controls ---- */
button,
input,
textarea,
select {
	margin: 0;
	font: inherit;
	font-size: 100%;
	line-height: 1.15;
}

button,
input {
	overflow: visible;
}

button {
	text-transform: none;
}

button,
[type="submit"] {
	appearance: button;
}

/* Snippet 165 forces the white background and no native search styling. */
[type="search"] {
	background: var(--white);
	appearance: none;
	outline-offset: -2px;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
	appearance: none;
}

[type="search"]:focus,
[type="search"]:focus-visible {
	outline: none;
}

span.required {
	color: var(--color-required);
}

label.screen-reader-text {
	display: none;
}

/* ---- Focus ---- */
:focus {
	outline: none;
	box-shadow: none;
}

:focus-visible {
	outline: var(--focus-width) solid currentcolor;
	outline-offset: var(--focus-offset);
}

/* ---- Accessibility helpers ---- */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	overflow-wrap: normal;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important; /* user preference beats every component transition */
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}