@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/archivo-latin-wght-normal.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url("../fonts/archivo-latin-ext-wght-normal.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

html {
	scroll-padding-top: calc(var(--header-kompakt-hoehe) + var(--wp-admin--admin-bar--height, 0px) + 1.5rem);
}

body {
	letter-spacing: var(--ls-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1,
.h1 {
	font-size: var(--fs-h1);
	line-height: var(--lh-h1);
	font-weight: 700;
	letter-spacing: 0;
}

@media (max-width: 575.98px) {
	h1,
	.h1 {
		hyphens: auto;
	}
}

h2,
.h2 {
	font-size: var(--fs-h2);
	line-height: var(--lh-h2);
	font-weight: 400;
	letter-spacing: 0;
}

.number-display {
	font-size: var(--fs-number);
	line-height: 1;
	font-weight: 700;
}

.section-label {
	display: inline-flex;
	align-items: center;
	gap: 1.5rem;
	font-size: var(--fs-label);
	font-weight: 600;
	line-height: 1.57;
	letter-spacing: var(--ls-label);
	text-transform: uppercase;
	color: var(--color-platinum);
}

.section-label::before {
	content: "";
	width: var(--label-line-width);
	height: 1px;
	background-color: currentColor;
}

.section-label--akzent {
	color: var(--color-akzent-text);
}

.section-label--ohne-linie::before {
	content: none;
}

.text-verlauf {
	background-image: var(--gradient-text-silver);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.container {
	--bs-gutter-x: var(--container-gutter);
}

@media (min-width: 1400px) {
	.container {
		width: calc(100% - 2 * var(--page-margin) + var(--bs-gutter-x));
		max-width: calc(var(--container-max) + var(--bs-gutter-x));
	}
}

.site-main--ohne-hero {
	padding-top: calc(var(--header-offset) + var(--header-height));
	background-color: var(--color-deep-night);
}

.section {
	padding-block: var(--space-section);
}

.btn {
	--bs-btn-padding-x: 1.6875rem;
	--bs-btn-padding-y: 1.125rem;
	--bs-btn-font-size: var(--fs-button);
	--bs-btn-font-weight: 500;
	--bs-btn-line-height: 0.85;
	--bs-btn-border-width: 0;
	--bs-btn-border-radius: var(--btn-radius);
	--bs-btn-color: var(--color-pearl);
	--bs-btn-hover-color: var(--color-pearl);
	--bs-btn-active-color: var(--color-pearl);
	--bs-btn-bg: transparent;
	--bs-btn-hover-bg: transparent;
	--bs-btn-active-bg: transparent;
	position: relative;
	overflow: hidden;
	letter-spacing: var(--ls-button);
	text-transform: uppercase;
}

@media (max-width: 575.98px) {
	.btn:not(.btn-outline):not(.skip-link) {
		width: 100%;
	}

	.btn-outline {
		--bs-btn-padding-y: var(--btn-outline-padding-y);
	}
}

.btn::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--gradient-btn-shine);
	transform: translateX(-100%);
	transition: transform var(--duration-shine) ease;
	pointer-events: none;
}

.btn:hover::after,
.btn:focus-visible::after {
	transform: translateX(100%);
}

@media (prefers-reduced-motion: reduce) {
	.btn::after {
		transition: none;
	}
}

.btn-primary {
	background-image: var(--gradient-btn-akzent);
	box-shadow: var(--shadow-btn-akzent);
}

.farbwelt-silber .btn-primary {
	--bs-btn-color: var(--color-midnight);
	--bs-btn-hover-color: var(--color-midnight);
	--bs-btn-active-color: var(--color-midnight);
}

.btn-navy {
	background-image: var(--gradient-navy);
	box-shadow: var(--shadow-btn-navy);
}

.btn-silver {
	--bs-btn-color: var(--color-midnight);
	--bs-btn-hover-color: var(--color-midnight);
	--bs-btn-active-color: var(--color-midnight);
	background-image: var(--gradient-silver);
	box-shadow: var(--shadow-btn-silver);
}

.btn-grey {
	background-image: var(--gradient-grey);
	box-shadow: var(--shadow-btn-grey);
}

.btn-outline {
	--bs-btn-border-width: 1px;
	--bs-btn-border-color: var(--btn-outline-border);
	--bs-btn-hover-border-color: var(--btn-outline-border);
	--bs-btn-active-border-color: var(--btn-outline-border);
	--bs-btn-border-radius: var(--btn-outline-radius);
	--bs-btn-padding-y: calc(1.125rem - 1.5px);
}

.btn-primary:focus-visible,
.btn-primary:active {
	box-shadow: var(--shadow-btn-akzent);
}

.btn-navy:focus-visible,
.btn-navy:active {
	box-shadow: var(--shadow-btn-navy);
}

.btn-silver:focus-visible,
.btn-silver:active {
	box-shadow: var(--shadow-btn-silver);
}

.btn-grey:focus-visible,
.btn-grey:active {
	box-shadow: var(--shadow-btn-grey);
}

.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: var(--link-arrow-gap);
	font-size: var(--fs-button);
	font-weight: 500;
	line-height: 1;
	letter-spacing: var(--ls-button);
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-ruby);
	transition: color var(--duration-hover) ease;
}

.link-arrow::after {
	content: "";
	width: var(--link-arrow-width);
	height: var(--link-arrow-height);
	background-color: currentColor;
	-webkit-mask: url("../img/icon-arrow-right.svg") no-repeat center / contain;
	mask: url("../img/icon-arrow-right.svg") no-repeat center / contain;
	transition: transform var(--duration-hover) ease;
}

.link-arrow:hover {
	color: var(--color-ruby);
}

.link-arrow:hover::after,
.link-arrow:focus-visible::after {
	transform: translateX(var(--link-arrow-shift));
}

.link-arrow--muted {
	color: var(--color-silver);
}

.link-arrow--muted:hover,
.link-arrow--muted:focus-visible {
	color: var(--color-pearl);
}

@media (prefers-reduced-motion: reduce) {
	.link-arrow::after {
		transition: none;
	}
}

:focus-visible {
	outline: 2px solid var(--color-blush);
	outline-offset: 3px;
}

.skip-link:focus {
	position: fixed;
	top: 1rem;
	left: 1rem;
	z-index: 2000;
}
