/* Element defaults and typographic roles. Values come from tokens.css. */
*,
*::before,
*::after {
	box-sizing: border-box;
}
/* Lets height animate to and from auto (the card disclosures in
   components.css); browsers without it open at once. */
:root {
	interpolate-size: allow-keywords;
}
html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}
body {
	margin: 0;
	background: var(--ew-color-bg);
	color: var(--ew-color-text-primary);
	font-family: var(--ew-font-body);
	font-size: var(--ew-text-body);
	font-weight: var(--ew-weight-body);
	line-height: var(--ew-leading-body);
	font-synthesis: none;
	text-rendering: optimizeLegibility;
	text-wrap: pretty;
	/* Inherited by every element; only Fraunces has these axes. */
	font-variation-settings: var(--ew-font-heading-variation);
	font-optical-sizing: auto;
}
body.ew-lock {
	overflow: hidden;
}
/* Heading role: Fraunces, soft and wonky, balanced lines, no tracking. */
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	font-family: var(--ew-font-heading);
	font-weight: var(--ew-weight-medium);
	letter-spacing: var(--ew-tracking-heading);
	line-height: var(--ew-leading-heading);
	overflow-wrap: break-word;
	text-wrap: balance;
}
h1 {
	font-size: var(--ew-text-heading-1);
}
h2 {
	font-size: var(--ew-text-heading-2);
}
h3,
.ew-h3,
h4,
h5,
h6 {
	font-size: var(--ew-text-heading-3);
	font-weight: var(--ew-weight-subheading);
	line-height: var(--ew-leading-subheading);
}
:lang(de) :is(h1, h2, h3, h4, .ew-button, .ew-nav__item) {
	hyphens: auto;
}
p,
figure,
blockquote,
dl,
dd,
address {
	margin: 0;
}
address {
	font-style: normal;
}
ul,
ol {
	margin: 0;
	padding: 0;
}
img,
svg,
video,
iframe {
	display: block;
	max-width: 100%;
}
img {
	height: auto;
}
button,
input,
textarea,
select {
	margin: 0;
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
}
button {
	cursor: pointer;
}
a {
	color: inherit;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* One focus ring for everything that can be operated: brass, --ew-line wide,
   outside, offset one and a half line widths. */
:focus {
	outline: none;
}
:focus-visible {
	outline: var(--ew-line) solid var(--ew-color-focus);
	outline-offset: calc(1.5 * var(--ew-line));
}
::selection {
	background: var(--ew-color-selection);
	color: var(--ew-color-ink-900);
}
[hidden] {
	display: none !important;
}
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}