/* Variables */

:root {
	--blue: #00b9ff;
	--darkblue: #0088bb;
	--black: #161618;
	--darkgrey: #222222;
	--grey: #6b6b6e;
	--lightgrey: #e6e6e6;
	--lightgrey-2: #c1c1c1;
	--lightgrey-3: #929295;
	--white: #efefef;
}

/* Colors */

.blue {color: var(--blue) !important}
.darkblue { color: var(--darkblue) !important}
.black {color: var(--black) !important}
.darkgrey {color: var(--darkgrey) !important}
.grey {color: var(--grey) !important}
.lightgrey {color: var(--lightgrey) !important}
.lightgrey-2 {color: var(--lightgrey-2) !important}
.lightgrey-3 {color: var(--lightgrey-3) !important}
.white {color: var(--white) !important}

/* General */

::selection {
	background: var(--darkblue);
	color: var(--white);
	text-shadow: none;
}
::-moz-selection {
	background: var(--darkblue);
	color: var(--white);
	text-shadow: none;
}
html {
	overflow-x: hidden;
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--lightgrey-2);
}
body {
	overflow-x: hidden;
}
.doc-padding {
	padding: 30px;
}
.doc-padding-horizontal {
	padding-left: 30px;
	padding-right: 30px;
}
.doc-padding-vertical {
	padding-top: 30px;
	padding-bottom: 30px;
}

/* Text */

h1, .uk-h1 {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 90px;
	font-weight: 300;
	line-height: 1.1;
	letter-spacing: -0.04em;
	color: var(--darkgrey);
}
h2, .uk-h2 {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 70px;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.04em;
	color: var(--white);
}
h3, .uk-h3 {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 40px;
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.04em;
	color: var(--white);
}
h4, .uk-h4 {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.1;
	color: var(--lightgrey-2);
}
h5, .uk-h5 {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--lightgrey-2);
}
h6, .uk-h6 {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--lightgrey-2);
}
p, li, a {
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 18px;
	font-weight: 300;
	color: var(--lightgrey-2);
}

/* Header */

.header {
	height: 100vh;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
}
.header-small {
	height: 35vh;
	min-height: 140px;
}
.header-xsmall {
	height: 140px;
}
.header-footer {
	border-bottom: 15px solid var(--blue);
}
header p {
	margin-bottom: -3px !important;
	font-size: 14px;
	color: var(--darkgrey);
}
.header-inline {
	margin-top: calc(-1 * 15vh);
	border-radius: 10px;
	overflow: hidden;
	position: relative;
}
.header-inline > img {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	object-fit: cover;
	object-position: 50% 50%;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.header-darken {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-color: #000000;
	opacity: 0.7;
	width: 100%;
	height: 100%;
	z-index: 2;
}
.header-arrow svg {
	color: var(--blue);
	width: 90px;
	margin-left: 10px;
	height: auto;
}
.header-nav {
	min-height: 80px;
}
.navbar {
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99;
	background-color: #FFFFFF;
}
.uk-navbar-center:not(:only-child) {
	top: 0;
	transform: translateX(-50%);
}
.uk-navbar-right:not(:only-child) {
	align-items: start;
}
.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle {
	min-height: 140px;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: -0.5px;
	transition: 0.3s ease;
}
.navbar-scroll .uk-navbar-nav > li > a,.navbar-scroll  .uk-navbar-item, .navbar-scroll .uk-navbar-toggle {
	min-height: 70px !important;
}
.uk-navbar-nav > li > a {
	text-transform: none;
	min-height: 70px !important;
	color: var(--black) !important;
}
.uk-navbar-nav > li.uk-active > a {
	color: var(--blue) !important;
}
.uk-navbar-nav li a {
	transition: 0.2s ease all;
}
.uk-navbar-nav li a:hover {
	color: var(--blue) !important;
}
.uk-parent > a > .uk-icon {
	transform: rotate(90deg);
	transform-origin: 50% 50%;
}
.uk-parent > a[aria-expanded="true"] > .uk-icon {
	color: var(--blue) !important;
}
.uk-navbar-dropdown .uk-icon {
	color: var(--blue) !important;
	width: 25px !important;
}
.nav-logo {
	height: 80px;
	width: auto;
	transition: 0.3s ease;
}
.navbar-scroll .nav-logo {
	height: 50px;
}
.uk-navbar-dropdown {
	background-color: var(--black);
	border-radius: 5px;
	padding: 20px 15px;
	width: auto;
	max-width: 350px;
}
.uk-navbar-dropdown-nav > li > a {
	color: var(--white) !important;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: -0.5px;
	white-space: nowrap
}
.uk-navbar-dropdown-nav > li.uk-active > a {
	color: var(--blue) !important;
}
.language-switch > span {
	position: relative;
	display: flex;
	flex-flow: row;
	gap: 0.25em;
	justify-content: center;
	font-size: 14px;
}
.language-switch > span::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	transform: translate(-50%,-50%);
	transition: 0.3s ease;
	background-color: var(--lightgrey);
	height: 100%;
	width: 100%;
	padding: 3px 9px;
	border-radius: 5px;
	margin-left: -3px;
}
.language-switch:hover > span::after {
	background-color: var(--lightgrey-2);
}
.language-switch > span > span {
	display: flex;
	z-index: 2;
	position: relative;
	color: var(--black);
}
.language-switch svg polyline {
	stroke-width: 1.5;
}
.languages-dropdown {
	box-shadow: none;
	background-color: var(--lightgrey);
	border-radius: 5px;
	padding: 15px 20px;
	width: auto;
	min-width: 0;
}
.languages-dropdown li > a {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: -0.5px;
	color: var(--black);
}
.uk-offcanvas-bar {
	background-color: var(--black);
}
.topbar {
	background-color: var(--black);
	padding-top: 10px;
	padding-bottom: 10px;
}
.topbar .uk-navbar-nav > li > a {
	min-height: auto !important;
	color: var(--lightgrey) !important;
	font-size: 0.75rem !important;
	align-items: self-start;
}
.topbar .uk-navbar-nav > li > a:hover {
	color: var(--blue) !important;
}
.topbar .uk-navbar-nav > li.uk-active > a {
	color: var(--blue) !important;
}
.topbar .uk-navbar-dropdown-nav > li > a {
	font-size: 0.875rem !important;
}

/* Footer & Contact Section */

.map {
	margin-top: -40px;
	margin-bottom: -56px;
	display: flex;
	flex-flow: row;
	justify-content: flex-end;
}
.map > div {
	width: 500px;
	max-width: 100%;
}
.map > div img {
	width: 100%;
	height: auto;
}
footer {
	border-top: 1px solid var(--grey);
	background-color: #1C1C1E;
}
.footer-logo {
	width: 200px;
}
.footer-border {
	height: 100%;
	border-right: 1px solid var(--grey);
}
footer p {
	color: var(--lightgrey-3);
}
footer h5 {
	font-family: 'IBM Plex Mono', monospace;
	color: var(--lightgrey-3);
	font-weight: 400;
	font-size: 16px;
}
footer li a {
	font-family: 'IBM Plex Mono', monospace;
	color: var(--white);
	font-weight: 400;
	font-size: 16px;
	text-decoration: none !important;
	transition: 0.2s ease all;
}
footer li a:hover {
	color: var(--blue);
}
.copy {
	font-family: 'IBM Plex Mono', monospace;
	color: var(--lightgrey-3);
	font-size: 16px;
	font-weight: 400;
	margin: 0;
}
.footer-divider {
	position: relative;
	height: 8px;
}
.footer-divider::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	height: 100%;
	width: 200vw;
	background-color: var(--blue);
}
@keyframes blink {
	0%, 100% { fill: #3a3a3e; }
	50% 	 { fill: var(--blue); }
}
svg ellipse.is-blinking {
	animation: blink 2s infinite;
	Optional: smooth easing;
	animation-timing-function: ease-in-out;
}

/* Main */

main {
	background-color: #1C1C1E;
	background-image: url('../medien/bg-topo.svg');
	background-size: cover;
	background-position: 50% 50%;
}
/* 23.02.2026 - Igor - Alles soll in dieser Farbe sein.*/
/*
img, .uk-card video {
	filter: grayscale(1);
	transition: 0.3s ease filter;
}
img:hover, .uk-card video:hover {
	filter: grayscale(0);
}
*/
.remove-last-margin >:last-child {
	margin-bottom: 0 !important;
}
.ul-styled ul {
	list-style-type: none; 
}
.ul-styled ul li {
	margin-bottom: 15px;
	position: relative;
}
.ul-styled ul li:before {
	content: '';
	position: absolute;
	left: -30px;
	top: 0;
	height: 25px;
	width: 25px;
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDIwIDIwIiBhcmlhLWhpZGRlbj0idHJ1ZSI+CiAgPHBvbHlsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwYjlmZiIgc3Ryb2tlLXdpZHRoPSIxLjAzIiBwb2ludHM9IjEwIDYgMTQgMTAgMTAgMTQiPjwvcG9seWxpbmU+CiAgPHBvbHlsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwYjlmZiIgc3Ryb2tlLXdpZHRoPSIxLjAzIiBwb2ludHM9IjYgNiAxMCAxMCA2IDE0Ij48L3BvbHlsaW5lPgo8L3N2Zz4K');
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: contain;
}
hr, .uk-hr {
	border-top-color: var(--grey);
}
.uk-accordion-title {
	color: var(--lightgrey);
}
.uk-accordion-title:hover {
	color: var(--blue) !important;
}
.uk-badge {
	background-color: var(--darkblue);
}
.uk-label {
	background-color: var(--darkblue);
}
.uk-description-list > dt {
	color: var(--grey);
}
.uk-description-list > dd {
	color: var(--lightgrey);
}
.uk-breadcrumb > * > * {
	color: var(--white);
}
.uk-breadcrumb > * > a:hover {
	color: var(--blue) !important;
}
.uk-breadcrumb > :last-child > span, .uk-breadcrumb > :last-child > a:not([href]) {
	color: var(--lightgrey-2);
}
.uk-progress::-webkit-progress-bar {
	background-color: var(--lightgrey);
}
.uk-progress::-webkit-progress-value {
	background-color: var(--blue);
}
.uk-progress::-moz-progress-bar {
	background-color: var(--blue);
}
.uk-heading {
	color: var(--white);
	line-height: 1.2;
}
.uk-tab > .uk-active > a {
	color: var(--blue);
	border-color: var(--blue);
}
p a {
	text-decoration: underline;
}
p a:hover {
	color: var(--blue);
}
.uk-placeholder {
	border-color: var(--lightgrey-3);
	color: var(--lightgrey-3);
}
.ap-name {
	font-size: 1.8rem;
}
.uk-grid-divider.uk-grid-small > :not(.uk-first-column)::before, .uk-grid-divider.uk-grid-column-small > :not(.uk-first-column)::before {
	border-color: var(--grey);
}
.text-decoration-none {
	text-decoration: none !important;
}

/* Button */

.uk-button-default {
	display: flex;
	flex-flow: row;
	justify-content: center;
	background-color: var(--black) !important;
	color: var(--white) !important;
	padding: 15px 18px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.2;
	border: 1px solid var(--grey);
	border-radius: 5px;
	font-family: 'IBM Plex Mono', monospace;
	overflow: hidden;
	text-transform: none;
	transition: 0.3s ease all;
}
.uk-button-default span {
	display: flex;
	align-items: center;
}
.uk-button-default .uk-icon {
	position: relative;
	padding-left: 20px;
	margin-left: 20px;
	color: var(--blue) !important;
	transform-origin: 50% 50%;
	transition: 0.3s ease all;
}
.uk-button-default .uk-icon::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 1px;
	height: 100px;
	background-color: var(--grey);
	transition: 0.15s ease all;
}
.uk-button-default:hover, a.uk-card:hover .uk-button-default {
	color: var(--blue) !important;
	border-color: var(--blue) !important;
	padding-left: 33px;
	padding-right: 5px;
	border-radius: 10px;
}
.uk-button-default:hover .uk-icon, a.uk-card:hover .uk-button-default .uk-icon {
	margin-left: 5px;
	margin-right: 28px;
	padding-left: 5px;
	transform: scale(1.3);
}
.uk-button-default:hover .uk-icon::before, a.uk-card:hover .uk-button-default .uk-icon::before {
	opacity: 0 !important;
}
.button-icon-left .uk-icon {
	padding-left: 0;
	margin-left: 0;
	padding-right: 20px;
	margin-right: 20px;
}
.button-icon-left .uk-icon::before {
	left: auto;
	right: 0;
}
.button-icon-left:hover {
	padding-right: 33px;
	padding-left: 5px;
}
.button-icon-left:hover .uk-icon {
	margin-left: 5px;
	margin-right: 28px;
	padding-left: 0;
	padding-right: 5px;
}
.button-inverted {
	background-color: var(--white) !important;
	border-color: var(--lightgrey-2) !important;
	color: var(--black) !important;
}
.button-inverted .uk-icon::before {
	background-color: var(--lightgrey-2);
	opacity: 0.8;
}
.button-inverted:hover, a.uk-card:hover .button-inverted {
	color: var(--blue) !important;
	border-color: var(--blue) !important;
}
.button-transparent {
	background-color: transparent !important;
}
.totop {
	padding: 10px 10px;
	border: 1px solid var(--lightgrey);
	border-radius: 5px;
	transition: 0.2s ease;
}
.totop:hover {
	border-color: var(--blue);
}

/* Panel */

.panel {
	border-radius: 10px;
}
.panel-hell {
	background-color: var(--white);
}
.panel-dunkel {
	border: 1px solid var(--grey);
}
.panel-header {
	padding: 25px;
}
.panel-hell .panel-header {
	border-bottom: 1px solid var(--lightgrey-2);
}
.panel-dunkel .panel-header {
	border-bottom: 1px solid var(--grey);
}
.panel-icon {
	height: 40px;
	width: 40px;
	object-fit: contain;
	object-position: 50% 50%;
}
.panel .section-bg {
	border-radius: 10px;
}
.panel-hell h1 {
	color: var(--black);
}
.panel-hell h2 {
	color: var(--black);
}
.panel-hell h3 {
	color: var(--black);
}
.panel-hell h4 {
	color: var(--black);
}
.panel-hell h5 {
	color: var(--black);
}
.panel-hell h6 {
	color: var(--darkgrey);
}
.panel-hell p, .panel-hell li, .panel-hell a {
	color: var(--darkgrey);
}
.panel-number {
	font-family: 'IBM Plex Mono', monospace;
	font-weight: 400;
}

/* Card */

.uk-card {
	border-radius: 5px;
	background-color: #000 !important;
	overflow: hidden;
	text-decoration: none !important;
}
a.uk-card {
	transition: 0.3s ease all;
}
a.uk-card:hover {
	transform: scale(1.05);
}
.uk-card img {
	border-radius: 5px;
}
/* contact cards: role keeps two lines so the phone numbers start on one line */
@media (min-width: 640px) {
	.ap-role {
		min-height: 2.8em;
	}
}
/* cards fill the column, so cards in one row end at the same height */
.uk-flex-top > .uk-width-1-1:has(> .uk-card.uk-height-1-1) {
	align-self: stretch;
}
.uk-card-body h3 {
	min-height: 2.2em;
}
.uk-card-body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
.uk-card-body > *:last-child {
	margin-top: auto !important;
}
.number-card {
	border-radius: 5px;
	background-color: var(--black);
}
.number {
	font-size: 60px;
	color: var(--lightgrey);
	font-weight: 300;
	line-height: 1.1;
	letter-spacing: -0.04em;
	margin-top: 20px;
	margin-bottom: 0;
	position: relative;
	padding-right: 20px;
}
.number::after {
	content: '';
	height: calc(100% - 15px);
	width: 20px;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNy4wOTQiIGhlaWdodD0iNTEuOTY4IiB2aWV3Qm94PSIwIDAgMTcuMDk0IDUxLjk2OCI+CiAgPHBhdGggaWQ9IlBmYWRfNCIgZGF0YS1uYW1lPSJQZmFkIDQiIGQ9Ik0wLDEyLjg1MSw2LjQyNiw2LjQyNiwwLDAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIuMTIxIDcuOTI2KSByb3RhdGUoLTkwKSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDBiOWZmIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMyIvPgogIDxsaW5lIGlkPSJMaW5pZV8yMCIgZGF0YS1uYW1lPSJMaW5pZSAyMCIgeTI9IjQ4IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg4LjU0NyAyLjQ2OCkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzAwYjlmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjMiLz4KPC9zdmc+Cg==');
	background-size: contain;
	background-position: 100% 100%;
	background-repeat: no-repeat;
}

/* Canvas */

.canvas-journey-title {
	margin: 20px;
	margin-bottom: 70px;
}
.canvas-journey-content {
	position: relative;
	aspect-ratio: 3/1;
	margin-bottom: 40px;
	display: flex;
	flex-flow: row;
}
.canvas-journey-content > * {
	position: relative;
	flex: 1;
}
.canvas-journey-content > div:last-of-type {
	flex: 0 0 auto;
	width: 10px;
}
.canvas-journey-step-content {
	position: absolute;
	left: 0;
	z-index: 1;
}
.canvas-journey-step-title {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 16px;
	font-weight: 400;
	margin-top: 20px;
	margin-bottom: 0;
}
.canvas-journey-step-icon {
	margin-bottom: 1px;
}
.canvas-journey-step-point {
	height: 10px;
	width: 10px;
	background-color: transparent;
}
.canvas-journey-svg {
	width: 100%;
	height: auto;
	aspect-ratio: 3/1;
}
.canvas-journey-svg-text-hover {
	cursor: pointer;
}
.canvas-journey-step-icon a,
.canvas-journey-step-icon {
	touch-action: manipulation;
}
.canvas-journey-svg a {
	text-decoration: none;
}
.canvas-journey-svg .canvas-step-text {
	transition: fill 0.15s ease;
	pointer-events: bounding-box;
}
.canvas-journey-svg a:hover .canvas-step-text,
.canvas-journey-svg .canvas-step-text.canvas-journey-svg-text-hover:hover {
	fill: #00b9ff;
	text-decoration: none;
}
.canvas-journey-mobile-list {
	display: none;
}
.canvas-journey-mobile-item,
.canvas-journey-mobile-item:link,
.canvas-journey-mobile-item:visited,
.canvas-journey-mobile-item:hover,
.canvas-journey-mobile-item:active,
.canvas-journey-mobile-item:focus {
	display: flex;
	align-items: center;
	gap: 16px;
	position: relative;
	padding: 18px 0;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}
.canvas-journey-mobile-item {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.5s ease, transform 0.5s ease;
}
.canvas-journey-mobile-item.is-visible {
	opacity: 1;
	transform: translateY(0);
}
.canvas-journey-mobile-icon {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.canvas-journey-mobile-icon svg {
	width: 22px;
	height: auto;
}
.canvas-journey-mobile-label {
	font-family: 'IBM Plex Mono', monospace;
	font-size: 18px;
	color: #C1C1C1;
	transition: color 0.15s ease;
}
.canvas-journey-mobile-item:hover .canvas-journey-mobile-label,
.canvas-journey-mobile-item:focus-visible .canvas-journey-mobile-label {
	color: #00b9ff;
}
.modal-canvas .uk-modal-body {
	border-radius: 15px;
	background-color: var(--black);
	padding: 50px;
}

/* Table */

table {
	border-collapse: collapse;
	width: 100%;
}
td {
	border: none;
	padding: 12px 16px;
	color: var(--lightgrey-3);
	transition: 0.2s ease all;
}
th {
	border: none;
	padding: 12px 16px;
	text-align: left;
	background-color: var(--black);
	color: var(--lightgrey-2);
	font-size: 22px;
	font-weight: 300;
}
td:first-child, th:first-child {
	border-radius: 5px 0 0 5px;
}
td:last-child, th:last-child {
	border-radius: 0 5px 5px 0;
}
tr {
	background-color: var(--darkgrey);
	transition: 0.2s ease all;
}
tr:nth-child(even) {
	background-color: #1C1C1E;
}
tr:hover td {
	background-color: var(--blue);
	color: var(--black);
}

/* Form */

.uk-input, .uk-select, .uk-textarea {
	background-color: transparent !important;
	color: var(--lightgrey) !important;
	border-radius: 5px;
	margin-top: 5px;
}

/* Timeline */

.timeline-line {
	height: 100%;
	width: 1px;
	background-color: var(--blue);
}
.timeline-card {
	background-color: var(--black);
	border-radius: 20px;
}
.timeline-item-invisible {
	visibility: hidden;
}
.timeline-date {
	font-family: 'IBM Plex Mono', monospace;
	color: var(--blue);
	font-weight: 500;
	font-size: 2em;
}

/* 404 */

.vnv-text-container * {
	color: var(--darkgrey);
}
.vnv-text-container h1 {
	color: var(--blue);
	font-family: 'IBM Plex Mono', monospace;
	color: var(--blue);
	font-weight: 500;
	font-size: 10rem;
}

/* News */

.news-teaser-small-link {
	text-decoration: none !important;
}
.news-teaser-small-link img {
	transition: 0.2s ease all;
}
.news-teaser-small-link h4 {
	transition: 0.2s ease all;
}
.news-teaser-small-link:hover img {
	transform: scale(1.05);
}
.news-teaser-small-link:hover h4 {
	color: var(--blue) !important;
}

/* Breakpoint XL and over */
@media (min-width: 1600px) {
	
}

/* Breakpoint XL and under */
@media (max-width: 1599px) {
	.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle {
		min-height: 120px;
	}
	.nav-logo {
		height: 60px;
	}
	.navbar-scroll .nav-logo {
		height: 40px;
	}
	h1, .uk-h1 {
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	h2, .uk-h2 {
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	h3, .uk-h3 {
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	.header-xsmall {
		height: 120px;
	}
}

/* Breakpoint L and over */
@media (min-width: 1200px) {
	
}

/* Breakpoint L and under */
@media (max-width: 1199px) {
	.footer-border {
		border-right: none;
		border-bottom: 1px solid var(--grey);
	}
	.modal-canvas .uk-modal-body {
		padding: 30px;
	}
}

/* Breakpoint M and over */
@media (min-width: 960px) {
	.uk-container {
		padding-left: 30px;
		padding-right: 30px;
	}
	.panel h2 {
		font-size: 60px;
	}
}

/* Breakpoint M and under */
@media (max-width: 959px) {
	.doc-padding {
		padding: 20px;
	}
	.doc-padding-horizontal {
		padding-left: 20px;
		padding-right: 20px;
	}
	.doc-padding-vertical {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	h1, .uk-h1 {
		font-size: 70px;
	}
	h2, .uk-h2 {
		font-size: 50px;
	}
	h3, .uk-h3 {
		font-size: 30px;
	}
}

/* Breakpoint S and over */
@media (min-width: 640px) {
	
}

/* Breakpoint S and under */
@media (max-width: 639px) {
	.canvas-journey-svg {
		display: none;
	}
	.canvas-journey-mobile-list {
		display: block;
	}
	.doc-padding {
		padding: 15px;
	}
	.doc-padding-horizontal {
		padding-left: 15px;
		padding-right: 15px;
	}
	.doc-padding-vertical {
		padding-top: 15px;
		padding-bottom: 15px;
	}
	h1, .uk-h1 {
		font-size: 45px;
	}
	h2, .uk-h2 {
		font-size: 40px;
	}
	h3, .uk-h3 {
		font-size: 26px;
	}
	.uk-navbar-nav > li > a, .uk-navbar-item, .uk-navbar-toggle {
		min-height: 80px;
	}
	.nav-logo {
		height: 40px;
	}
	.navbar-scroll .nav-logo {
		height: 25px;
	}
	.header-xsmall {
		height: 80px;
	}
	.modal-canvas .uk-modal-body {
		padding: 20px;
	}
}
/* 23.02.2026 - Igor */
.topbar .top_nav-icon svg { 
	transform: translateX(-1px); 
	height: 16px;
	width: 16px;	
}

/* 25.02.2025 Jörg */
.header-with-model {
	position: relative;
	overflow: hidden;
}

.header-model {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.header-with-model::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255,255,255,0.6); /* Transparenz hier steuern */
	z-index: 1;
	pointer-events: none;
}

.header-with-model > *:not(.header-model) {
	position: relative;
	z-index: 2;
}
/* 06.03.2026 - Igor */
.uk-accordion-title::before {
	content: "";
	width: 1.4em;
	height: 1.4em;
	margin-left: 10px;
	float: right;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20fill%3D%22%23d3d3d3%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%3Crect%20fill%3D%22%23d3d3d3%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%3C%2Fsvg%3E");
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
.uk-open > .uk-accordion-title::before {
	background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Crect%20fill%3D%22%23d3d3d3%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%3C%2Fsvg%3E");
}
.uk-accordion-title {
	display: block;
	font-family: 'IBM Plex Sans', 'IBM Plex Sans Fallback', sans-serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
	overflow: hidden;
}
.uk-accordion-content {
	margin-top: 10px;
}
ul.uk-accordion li.uk-open {
	padding-bottom:20px;
}
.uk-border-square {
	aspect-ratio: 3 / 2;
	object-fit: cover;
	width: 100%;
	height: auto;
}

.uk-card-media-bottom video {
	aspect-ratio: 700 / 470;
	object-fit: cover;
	height: auto !important;
	display: block;
}

/* 11.11.2026: UIkit is loaded with defer. Until it initialises, mimic the classes it adds
   (uk-navbar, uk-drop, uk-offcanvas, uk-modal, uk-accordion, uk-icon), so the first paint
   already matches the final layout and nothing shifts (CLS). Each rule stops applying once
   UIkit has set its class. Icon sizes use :where() so existing class rules still win. */
[uk-navbar]:not(.uk-navbar) { display: flex; position: relative; }
.uk-navbar-dropdown:not(.uk-drop),
[uk-dropdown]:not(.uk-drop),
[uk-offcanvas]:not(.uk-offcanvas),
[uk-modal]:not(.uk-modal) { display: none; }
[uk-accordion]:not(.uk-accordion) > :not(.uk-open) > .uk-accordion-content { display: none; }
:where([uk-icon]:not(.uk-icon)) { display: inline-block; line-height: 0; }
:where([uk-icon]:empty) { width: 20px; height: 20px; }
:where([uk-icon*="ratio: 0.8"]:empty) { width: 16px; height: 16px; }
:where([uk-icon*="ratio: 0.9"]:empty) { width: 18px; height: 18px; }
:where([uk-icon*="ratio: 1.1"]:empty) { width: 22px; height: 22px; }
:where([uk-icon*="ratio: 1.2"]:empty) { width: 24px; height: 24px; }
.topbar .top_nav-icon:empty { width: 16px; height: 16px; }