/**
 * Element defaults, focus, and the skip link.
 * Values come from tokens.css.
 */

.kpp-theme {
	margin: 0;
	background: var(--kpp-color-canvas);
	color: var(--kpp-color-ink);
	font-family: var(--kpp-font-sans);
	font-size: var(--kpp-text-md);
	font-weight: var(--kpp-weight-regular);
	line-height: var(--kpp-leading-body);
	color-scheme: light;
	accent-color: var(--kpp-bg-cta);
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

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

.kpp-theme h1,
.kpp-theme h2,
.kpp-theme h3 {
	font-family: var(--kpp-font-serif);
	font-weight: var(--kpp-weight-semibold);
	line-height: var(--kpp-leading-heading);
	letter-spacing: 0;
	color: var(--kpp-color-ink);
}

.kpp-theme h1 {
	line-height: var(--kpp-leading-h1);
}

.kpp-theme h3 {
	line-height: var(--kpp-leading-h3);
}

.kpp-theme h4 {
	font-family: var(--kpp-font-sans);
	font-weight: var(--kpp-weight-semibold);
	font-size: var(--kpp-text-xl);
	line-height: var(--kpp-leading-h4);
	letter-spacing: 0;
	color: var(--kpp-color-ink);
}

.kpp-theme a {
	color: var(--kpp-color-sap);
	text-underline-offset: 0.18em;
}

.kpp-theme a:hover {
	color: var(--kpp-color-sap-deep);
}

.kpp-theme :focus {
	outline: none;
}

.kpp-theme :focus-visible {
	outline: 3px solid var(--kpp-color-focus);
	outline-offset: 3px;
}

.kpp-theme .skip-link:focus {
	position: fixed;
	z-index: 100000;
	top: var(--kpp-space-4);
	inset-inline-start: var(--kpp-space-4);
	width: auto;
	height: auto;
	margin: 0;
	clip: auto;
	clip-path: none;
	overflow: visible;
	padding: var(--kpp-space-3) var(--kpp-space-4);
	background: var(--kpp-color-ink);
	color: var(--kpp-color-on-ink);
	line-height: 1.2;
	text-decoration: none;
}

.kpp-theme .screen-reader-text,
.kpp-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.kpp-theme ::selection {
	background: var(--kpp-color-ochre-soft);
	color: var(--kpp-color-ink);
}

.kpp-main:focus {
	outline: none;
}

.kpp-main:focus-visible {
	outline: 3px solid var(--kpp-color-focus);
	outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
	html:focus-within {
		scroll-behavior: auto;
	}

	.kpp-theme *,
	.kpp-theme *::before,
	.kpp-theme *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

html {
	scroll-behavior: smooth;
}

@media print {
	.kpp-header,
	.kpp-footer,
	.kpp-newsletter,
	.kpp-nav__toggle,
	.kpp-skip,
	.skip-link {
		display: none !important;
	}

	.kpp-theme {
		background: transparent;
		color: var(--kpp-color-ink);
	}

	.kpp-theme a {
		text-decoration: underline;
	}
}