/* lato-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/lato-v25-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lato-v25-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* lato-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/lato-v25-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

:root:has(body.frontend) {
	
	--maxWidth: 1570px;
	
	--fontSize14: 0.823rem;
	--fontSize15: 0.882rem;
	--fontSize17: 1rem;
	--fontSize20: 1.176rem;
	--fontSize28: 1.647rem;
	--fontSize36: 2.117rem;
	--iconSize24: 1.4rem;
	--iconSize40: 2.33rem;
	
	
	--headerHeight: 11.9rem;
	--headerHeightSmall: 8rem;
	--sideSpacing: 3.45rem;
	--outerSpacing: calc( calc(100vw - var(--maxWidth)) / 2);
	
	--maxWidthInner: 64rem;
	
	--colorAluminium-7: #252525;
	--colorAluminium-6: #424445;
	--colorAluminium-5: #878B8C;
	--colorAluminium-4: #ABB1B3;
	--colorAluminium-3: #D2D9DB;
	--colorAluminium-2: #F1F4F4;
	--colorAluminium-1: #FCFEFF;

	--colorDarkBlue-1: #D6D9DF;
	--colorDarkBlue-2: #8790A2;
	--colorDarkBlue-3: #15304E;
	
	--colorWhite: #FFFFFF;
	

	@media only screen and (max-width: 1570px) {
		--outerSpacing: 0rem;
	}

	@media only screen and (max-width: 768px) {
		--headerHeight: 5.25rem;
		--headerHeightSmall: 4.5rem;
		--sideSpacing: 1.25rem;
		--outerSpacing: 0rem;
		--maxWidthInner: 100%;
	}
	
	
}


html:has(body.frontend), body.frontend {
	scrollbar-gutter: stable;
}

html:has(body.frontend) {
	font-size: 18.683px;
	
	@media only screen and (max-width: 1570px) {
		font-size: 1.19vw;
	}

	@media only screen and (max-width: 768px) {
		font-size: 4vw;
	}
}

body.frontend {
	margin: 0;
	padding: 0;
	text-align: left;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: var(--fontSize17);
	line-height: 1.7;
	-webkit-text-size-adjust: 100%;
	font-family: 'Lato';
	color: var(--colorAluminium-7);
	/*background-color: lightblue;*/
	
	input[type=text],
	input[type=email],
	input[type=tel],
	input[type=url],
	input[type=search],
	input[type=submit],
	button {
	  appearance: none;
	  -moz-appearance: none;
	  -webkit-appearance: none;
	  border-radius: 0;
	  -moz-border-radius: 0;
	  -webkit-border-radius: 0;
	}
	
	*, *:before, *:after {
		-moz-box-sizing: border-box; 
		-webkit-box-sizing: border-box; 
		box-sizing: border-box;
	}
	
	*:focus:not(:focus-visible) {
	  outline: 0;
	}
	
	img {
		border: 0;
	}

	&.menu-open {
		@media only screen and (max-width: 768px) {
			overflow: hidden;
		}
	}

}


.preview_check {
	position: fixed;
	left: 10px;
	top: 10px;
	z-index: 999999;
	/*display: none;*/
}

body:not(.wp-admin) .preview {
	width: 100%;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	top: 7.1rem;
	height: auto;
	z-index: 999999;
	pointer-events: none;
	opacity: 0.4;
	display: block;
	max-width: var(--maxWidth);
}

.preview_check:checked + .preview {
	display: none;
}



body.frontend .innerwrapper {
	margin: 0 auto;
	width: calc(100% - var(--sideSpacing) - var(--sideSpacing));
	max-width: calc(var(--maxWidth) - var(--sideSpacing) - var(--sideSpacing));
	
	&.small {
		padding-inline: calc(var(--sideSpacing) * 7.5);
	}
	
	.inner__holder {
		width: 100%;
		max-width: var(--maxWidthInner);
		margin-inline: auto;
	}

	@media only screen and (max-width: 768px) {
		width: calc(100% - var(--sideSpacing) * 2);

		&.small {
			padding-inline: 0;
		}
	}

}

body.frontend p {
	&:first-child {
		margin-top: 0;
	}
	
	&:last-child {
		margin-bottom: 0;
	}
}

.fixed-actions {
	--fixedActionSize: 2.35rem;
	--fixedActionGap: 0.58rem;
	--fixedActionInset: 1.1rem;
	--fixedActionBottom: 1.5rem;
	position: fixed;
	bottom: var(--fixedActionBottom);
	display: flex;
	flex-direction: column;
	gap: var(--fixedActionGap);
	z-index: 800;
	

	&.left {
		left: var(--fixedActionInset);
	}

	&.right {
		right: var(--fixedActionInset);
	}

	a,
	button {
		display: block;
		width: var(--fixedActionSize);
		aspect-ratio: 1 / 1;
		font-size: 0;
		line-height: 0;
		background: transparent;
		margin: 0;
		padding: 0;
		border: 0;
		cursor: pointer;

		svg {
			display: block;
			width: 100%;
			height: 100%;
			overflow: visible;
		}
	}

	&.left rect,
	&.right a:not(:first-child) rect {
		stroke: #FFF;
		stroke-width: 1.5;
	}

	@media only screen and (max-width: 768px) {
		display: none;
	}
}


body.frontend header {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	height: var(--headerHeight);
	transition: height 200ms ease-out, box-shadow 200ms ease-out;
	background: linear-gradient(
	  to bottom,
	  rgba(252, 254, 255, 1) 0%,
	  rgba(252, 254, 255, 1) 70%,
	  rgba(252, 254, 255, 0) 100%
	);
	z-index: 999;
	
	
	&:before {
		content: '';
		display: block;
		position: absolute;
		inset: 0;
		background-color: var(--colorWhite);
		opacity: 0;
		transition: opacity 200ms ease-out;
	}
	
	&.is-fixed {
		height: var(--headerHeightSmall);
		box-shadow: 0rem 0.588rem 0.95rem 0rem rgba(0,0,0,0.1);
		
		&:before {
			opacity: 1;	
		}
		
		.header__top {
			.header-actions {
				font-size: var(--fontSize14);
				gap: 0.4em 0;
				
			}

			.innerwrapper {
				.logo {
					width: 10rem;
				}
			}	
		}
		
		nav {
			margin-top: 0;
		}
	}
	
	.header__top {
		width: 100%;
		flex: 1;
		display: flex;
		flex-direction: column;
		position: relative;
		z-index: 6;
		
		.innerwrapper {
			display: flex;
			justify-content: center;
			flex: 1;
			align-items: center;
			
			.logo {
				width: 17.11rem;
				font-size: 0;
				line-height: 0;
				display: block;
				transition: width 200ms ease-out;
				
				img {
					width: 100%;
					height: auto;
				}
			}
		}

		.header-actions {
			position: absolute;
			right: 0;
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			top: 50%;
			transform: translateY(-50%);
			gap: 0.7em 0;
			font-size: var(--fontSize17);
			transition: font-size 200ms ease-out, gap 200ms ease-out;
			z-index: 90;

			.action {
				position: relative;
				z-index: 9;
				
				&:first-child {
					z-index: 10;
					
					button {
						z-index: 11;
					}
					
					ul {
						z-index: 9;
					}
				}

				button {
					width: 100%;
					padding: 0.45em 1.3em 0.55em 0.75em;
					border: 0;
					border-radius: 1.5em 0 0 1.5em;
					background-color: var(--colorDarkBlue-3);
					color: var(--colorWhite);
					font: inherit;
					font-weight: 400;
					line-height: 1.2;
					letter-spacing: 0.04em;
					display: flex;
					align-items: center;
					justify-content: flex-end;
					gap: 0.8em;
					cursor: pointer;
					position: relative;
					z-index: 9;
					text-transform: uppercase;
					transition: background-color 200ms ease-out;

					.icon {
						width: 1.411em;
						height: auto;
						aspect-ratio: 1/1;
					}

					.caret {
						width: 1em;
						height: auto;
						aspect-ratio: 18/8;
						transition: transform 200ms ease-out;
					}
				}

				&:hover,
				&:has(:focus-visible) {
					z-index: 20;
					
					button {
						background-color: var(--colorDarkBlue-2);
					}

					button .caret {
						transform: rotate(180deg);
					}

					ul {
						opacity: 1;
						visibility: visible;
						transform: translateY(0);
					}
				}

				ul {
					position: absolute;
					right: 0;
					top: 100%;
					margin: 0;
					padding: 0;
					list-style: none;
					opacity: 0;
					visibility: hidden;
					overflow: hidden;
					width: auto;
					transform: translateY(-0.4rem);
					transition: max-height 200ms ease-out, opacity 200ms ease-out, transform 200ms ease-out, visibility 200ms ease-out;

					li {
						margin: 0;
						padding: 0;
						list-style: none;

						a {
							display: flex;
							align-items: center;
							padding: 0.5em 3.1em;
							background-color: var(--colorAluminium-2);
							color: var(--colorAluminium-7);
							line-height: 1.2;
							letter-spacing: 0.04em;
							text-decoration: none;
							white-space: nowrap;
							justify-content: end;

							&:hover,
							&:focus-visible {
								background-color: var(--colorDarkBlue-1);
							}
						}
					}
				}
			}
		}
	}
	
	nav {
		width: 100%;
		background: rgba(252, 254, 255, 0.7);
		backdrop-filter: blur(0.2rem);
		margin-top: 1rem;
		transition: margin 200ms ease-out;
		position: relative;
		z-index: 5;
		
		.innerwrapper {
			> ul {
				list-style-type: none;
				margin: 0;
				padding: 0;
				display: flex;
				justify-content: center;
				
				> li {
					list-style-type: none;
					margin: 0;
					padding: 0;
					position: relative;
					
					&:before {
						content: '';
						display: block;
						position: absolute;
						left: 0;
						bottom: 0;
						width: 0%;
						background-color: var(--colorDarkBlue-3);
						height: 0.2rem;
						transition: width 300ms ease-out;
					}
					
					> a {
						display: block;
						text-transform: uppercase;
						padding: 0.35rem 0.7rem;
						font-weight: 700;
						letter-spacing: 0.04em;
						color: inherit;
						text-decoration: none;
					}
					
					&:has(>ul){
						> a {
							position: relative;
							display: flex;
							align-items: center;
							gap: 0 0.8em;
							
							&:after {
								content: '';
								display: block;
								background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='8' fill='none' viewBox='0 0 18 8'><path fill='%23424445' d='M17.256 1.424a.874.874 0 0 0 .047-1.158.706.706 0 0 0-1.06-.051l-5.17 5.172a3.297 3.297 0 0 1-4.645 0L1.256.215a.706.706 0 0 0-1.06.051.874.874 0 0 0 .048 1.158l5.171 5.172a4.704 4.704 0 0 0 6.67 0z'/></svg>");	
								width: 1em;
								height: auto;
								aspect-ratio: 18/8;
								background-repeat: no-repeat;
								background-size: 98% auto;
								transition: transform 200ms ease-out;
							}
						}
					}

					&:hover,
					&:has(:focus-visible) {
						&:before {
							width: 100%;	
						}
						
						> a {
							

							&:after {
								transform: rotate(180deg);
							}
						}

						> ul {
							opacity: 1;
							visibility: visible;
							transform: translate(-50%, 0);
						}
					}
					
					&.current-menu-item,
					&.current-menu-parent {
						&:before {
							width: 100%;	
						}
					}

					> ul {
						position: absolute;
						left: 50%;
						top: 100%;
						width: auto;
						min-width: 100%;
						margin: 0;
						padding: 0;
						list-style: none;
						opacity: 0;
						visibility: hidden;
						transform: translate(-50%, 0.5rem);
						transition: opacity 200ms ease-out, transform 200ms ease-out, visibility 200ms ease-out;

						li {
							margin: 0;
							padding: 0;
							list-style: none;

							a {
								display: flex;
								align-items: center;
								justify-content: center;
								padding: 0.58em 2.5em;
								background-color: var(--colorAluminium-2);
								color: var(--colorAluminium-7);
								font-size: var(--fontSize17);
								font-weight: 400;
								line-height: 1.2;
								letter-spacing: 0.05em;
								text-align: right;
								text-decoration: none;
								white-space: nowrap;
								text-transform: uppercase;

								&:hover,
								&:focus-visible {
									background-color: var(--colorDarkBlue-1);
								}
							}
						}
					}
				}
			}
		}

	}

	.mobile-menu-toggle {
		display: none;
	}

	@media only screen and (max-width: 768px) {
		height: var(--headerHeight);
		background: var(--colorWhite);
		box-shadow: 0 0.3rem 1rem rgba(21, 48, 78, 0.12);

		&:before {
			opacity: 1;
		}

		&.is-fixed {
			height: var(--headerHeight);

			.header__top .innerwrapper .logo {
				width: 10rem;
			}
		}

		.header__top {
			height: 100%;
			flex: none;

			.innerwrapper {
				position: relative;
				justify-content: center;

				.logo {
					width: 10rem;
				}
			}

			.header-actions {
				position: fixed;
				left: 50%;
				right: auto;
				top: auto;
				bottom: 1rem;
				flex-direction: row;
				align-items: flex-end;
				gap: 0.75rem !important;
				font-size: 1rem;
				transform: translateX(-50%);

				.action {
					button {
						width: 3rem;
						aspect-ratio: 1 / 1;
						justify-content: center;
						padding: 0;
						border-radius: 50%;
						box-shadow: 0 0.25rem 0.75rem rgba(21, 48, 78, 0.22);

						.icon {
							width: 1.4rem;
						}

						span,
						.caret {
							display: none;
						}
					}

					ul {
						right: 50%;
						top: auto;
						bottom: calc(100% + 0.6rem);
						transform: translate(50%, 0.4rem);

						li a {
							justify-content: center;
							padding: 0.75rem 1.25rem;
							font-size: var(--fontSize14);
						}
					}

					&:not(.is-open) ul {
						opacity: 0;
						visibility: hidden;
						transform: translate(50%, 0.4rem);
					}

					&.is-open ul {
						opacity: 1;
						visibility: visible;
						transform: translate(50%, 0);
					}
				}
			}
		}

		.mobile-menu-toggle {
			position: absolute;
			right: 0;
			top: 50%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			gap: 0.32rem;
			width: 2.75rem;
			aspect-ratio: 1 / 1;
			padding: 0.65rem;
			border: 0;
			border-radius: 50%;
			background-color: var(--colorDarkBlue-3);
			transform: translateY(-50%);
			cursor: pointer;

			span {
				display: block;
				width: 100%;
				height: 0.12rem;
				border-radius: 1rem;
				background-color: var(--colorWhite);
				transition: transform 200ms ease-out, opacity 200ms ease-out;
			}
		}

		&.nav-open {
			.mobile-menu-toggle {
				span:first-child {
					transform: translateY(0.44rem) rotate(45deg);
				}

				span:nth-child(2) {
					opacity: 0;
				}

				span:last-child {
					transform: translateY(-0.44rem) rotate(-45deg);
				}
			}

			> nav {
				opacity: 1;
				visibility: visible;
				transform: translateX(0);
			}
		}

		> nav {
			position: fixed;
			inset: var(--headerHeight) 0 0;
			z-index: 4;
			height: calc(100dvh - var(--headerHeight));
			margin: 0;
			padding-block: 1.5rem 6rem;
			overflow-y: auto;
			background: rgba(252, 254, 255, 0.98);
			opacity: 0;
			visibility: hidden;
			transform: translateX(100%);
			transition: transform 250ms ease-out, opacity 200ms ease-out, visibility 250ms ease-out;

			.innerwrapper > ul {
				flex-direction: column;
				align-items: stretch;

				> li {
					border-bottom: 1px solid var(--colorAluminium-3);

					&:before {
						display: none;
					}

					> a {
						justify-content: space-between;
						padding: 0.9rem 0;
						font-size: var(--fontSize20);
					}

					> ul {
						position: static;
						width: 100%;
						max-height: 0;
						overflow: hidden;
						opacity: 0;
						visibility: hidden;
						transform: none;
						transition: max-height 250ms ease-out, opacity 200ms ease-out, visibility 250ms ease-out;

						li a {
							justify-content: flex-start;
							padding: 0.7rem 1rem;
							white-space: normal;
							text-align: left;
						}
					}

					&:not(.submenu-open) > ul {
						max-height: 0;
						opacity: 0;
						visibility: hidden;
						transform: none;
					}

					&:not(.submenu-open) > a:after {
						transform: rotate(0deg);
					}

					&.submenu-open {
						> a:after {
							transform: rotate(180deg);
						}

						> ul {
							max-height: 30rem;
							opacity: 1;
							visibility: visible;
							transform: none;
						}
					}
				}
			}
		}
	}
	
	
}

body.frontend main {
	background-color: var(--colorWhite);
	overflow-x: hidden;
}

section {
	--offset: 14.4rem;
	background-color: var(--backgroundColor, transparent);
	color: var(--color, inherit);
	scroll-margin-top: var(--headerHeightSmall);
	
	
	&:not(.section__start):not(.section__start-sub):not(.section__breadcrumb){
		padding-block: 3rem;
	}
	
	&:has(+ .section__faq){
		padding-bottom: var(--offset) !important;
		
		.innerwrapper {
			padding-bottom: 3rem !important;
		}
		
		+ .section__faq {
			margin-top: calc(var(--offset) * -1);
		}
	}
	
	&.no-spacing-top {
		padding-top: 0 !important;
	}
	
	&.no-spacing-bottom {
		padding-bottom: 0 !important;
	}

	@media only screen and (max-width: 768px) {
		--offset: 7rem;

		&:not(.section__start):not(.section__start-sub):not(.section__breadcrumb) {
			padding-block: 2.5rem;
		}
	}
}

section h1 {
	margin: 0;
	font-size: var(--fontSize36);
	letter-spacing: 0.05em;
	line-height: 1.4;
	text-transform: uppercase;
	font-weight: 400;
	
	
	em {
		font-size: var(--fontSize28);
		font-weight: 300;
		letter-spacing: 0.025em;
		font-style: normal;
	}

	@media only screen and (max-width: 768px) {
		font-size: 1.65rem;
		line-height: 1.25;

		em {
			font-size: 1.15rem;
		}
	}
}

section h2 {
	margin: 0;
	font-size: var(--fontSize36);
	letter-spacing: 0.05em;
	line-height: 1.4;
	text-transform: uppercase;
	font-weight: 300;
	
	
	strong {
		font-weight: 700;
		letter-spacing: 0.025em;
	}

	@media only screen and (max-width: 768px) {
		font-size: 1.55rem;
		line-height: 1.3;
	}
}


.section__start {
	/* Breite, nach unten gewölbte Hero-Maske wie im Preview. */
	overflow: hidden;
	-webkit-clip-path: ellipse(62.5% 100% at 50% 0%);
	clip-path: ellipse(62.5% 100% at 50% 0%);
	position: relative;
	
	.innerwrapper {
		display: flex;
		flex-direction: column;
		padding-top: var(--headerHeight);
		text-align: center;
		position: relative;
		z-index: 5;
		
		.content {
			padding-top: 2.8rem;
			display: flex;
			flex-direction: column;
			min-height: 40.5rem;
			justify-content: space-between;
			padding-bottom: 2.6rem;
			
			h1,
			h2 {
				text-transform: none;
				opacity: 0;
			}
			
			h1 {
				display: flex;
				flex-direction: column;
				gap: 0.3em 0;
			}
		}
		
		
	}
	
	.media {
		font-size: 0;
		line-height: 0;
		position: absolute;
		left: 0;
		top: calc(6rem);
		width: 100%;
		height: calc(100% - 6rem);

		&:before,
		&:after {
			content: '';
			position: absolute;
			left: 0;
			z-index: 2;
			width: 100%;
			height: 40%;
			pointer-events: none;
		}

		&:before {
			top: 0;
			background: linear-gradient(to bottom, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0));
		}

		&:after {
			bottom: 0;
			background: linear-gradient(to top, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0));
		}
		
		video,
		img {
			position: absolute;
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: center top;
		}
	}

	@media only screen and (max-width: 768px) {
		clip-path: ellipse(120% 100% at 50% 0%);

		.innerwrapper {
			padding-top: var(--headerHeight);

			.content {
				min-height: 33rem;
				padding-block: 2rem 5rem;

				h2 {
					font-size: 1.4rem;
				}
			}
		}

		.media {
			top: var(--headerHeight);
			height: calc(100% - var(--headerHeight));

			video,
			img {
				object-position: center;
			}
		}
	}
}

.section__start-sub {
	overflow: clip;
	position: relative;
	padding-top: 6rem;
	/*height: 42rem;*/
	
	.media {
		font-size: 0;
		line-height: 0;
		position: relative;
	
		width: 100%;
		height: auto;
		
		
		video,
		img {
			width: 100%;
			height: auto;
			aspect-ratio: 1440/550;
			object-fit: cover;
			object-position: center top;
		}
	}

	@media only screen and (max-width: 768px) {
		height: 20rem;

		.media {
			top: var(--headerHeight);
			height: calc(100% - var(--headerHeight));
			position: absolute;

			img,
			video {
				object-position: center;
				position: absolute;
				height: 100%;
				aspect-ratio: unset;
			}
		}
	}
}

.section__breadcrumb {
	.innerwrapper {
		padding-block: 1rem;
	}

	.breadcrumb {
		ul {
			display: flex;
			align-items: center;
			margin: 0;
			padding: 0;
			list-style: none;
			padding-left: 0.5em;

			li {
				display: flex;
				align-items: center;
				color: var(--colorDarkBlue-3);
				font-size: var(--fontSize17);
				line-height: 1.7;
				letter-spacing: 0.05em;
				white-space: nowrap;
				

				a {
					display: flex;
					align-items: center;
					padding-inline: 0.47rem;
					color: inherit;
					text-decoration: none;
				}

				&.home {

					a {
						width: 100%;
						justify-content: center;
						padding: 0;
						
						> svg {
							width: 1.4em;
							height: auto;
						}
					}

				}
				
				
				
				&:not(:last-child){
					&:after {
						content: '';
						display: block;
						background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='18' fill='none' viewBox='0 0 8 18'><path fill='%2315304e' d='M1.28.22A.75.75 0 1 0 .22 1.28L5.39 6.452a3.25 3.25 0 0 1 0 4.596L.22 16.22a.75.75 0 1 0 1.06 1.06l5.172-5.171a4.75 4.75 0 0 0 0-6.718z'/></svg>");	
						background-repeat: no-repeat;
						background-size: 98% auto;
						width: 0.5em;
						aspect-ratio: 8/18;
						height: auto;
						margin-inline: 0.9em;
						flex-shrink: 0;
					}
				}
				
				&:first-child {
					&:after {
						margin-left: 1.1em;
						margin-right: 0.7em;
					}
				}

				&.separator {
					width: var(--iconSize40);
					justify-content: center;

					svg {
						width: 0.5em;
						height: auto;
					}
				}

				&.current {
					padding-inline: 0.47rem;
					font-weight: 700;
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		overflow: hidden;

		.breadcrumb {
			overflow-x: auto;
			scrollbar-width: none;

			ul li {
				font-size: var(--fontSize14);
			}
		}
	}
}

.section__intro {
	.innerwrapper {

	}

	@media only screen and (max-width: 768px) {
		.inner__holder {
			> h1 {
				font-size: 1.65rem;
			}

			> h2 {
				font-size: 1.25rem;

				+ .column__wrapper,
				+ p {
					margin-top: 2rem;
				}
			}

			.column__wrapper {
				grid-template-columns: 1fr;
				gap: 1.5rem;
			}
		}
	}

	.inner__holder {
		
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.04em;
		
		> h1,
		> h2 {
			width: 100%;
			margin: 0;
			line-height: 1.4;
			text-transform: uppercase;
			text-align: center;
		}
		
		> h1 {
			font-size: var(--fontSize36);
			font-weight: 400;
			letter-spacing: 0.04em;
			
			+ h2 {
				margin-top: 0.4em;
			}
		}
		
		> h2 {
			font-size: var(--fontSize28);
			font-weight: 300;
			letter-spacing: 0.03em;
			
			+ .column__wrapper {
				margin-top: 3.5rem;
			}
			
			+ p {
				margin-top: 3.5rem;
			}
		}
		
		
		
		.column__wrapper {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 3rem;
		
			.column {
				
		
				p {
					&:first-child {
						margin-top: 0;
					}
		
					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.inner__holder {
			> h1 {
				font-size: 1.65rem;
			}

			> h2 {
				font-size: 1.25rem;

				+ .column__wrapper,
				+ p {
					margin-top: 2rem;
				}
			}

			.column__wrapper {
				grid-template-columns: 1fr;
				gap: 1.5rem;
			}
		}
	}


}

.section__media-centered {
	
	.heading {
		display: flex;
		align-items: center;
		justify-content: start;
		gap: 0.85rem;
		color: var(--colorDarkBlue-3);
		margin-bottom: 3.5rem;
		width: calc(50% + 1rem);
		margin-left: auto;
	
		svg {
			display: block;
			width: var(--iconSize40);
			height: auto;
			aspect-ratio: 1 / 1;
			flex-shrink: 0;
		}
	
		h2 {
			margin: 0;
			font-size: var(--fontSize20);
			font-weight: 300;
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-transform: uppercase;
		}
	}

	.clip {
		width: 100%;
		max-width: var(--maxWidthInner);
		margin-inline: auto;
		
		&:not(:has(summary)){
			.media {
				border-radius: 1.17rem;
			}
		}

		.media {
			position: relative;
			width: 100%;
			aspect-ratio: 16 / 9;
			overflow: hidden;
			border-radius: 1.17rem 1.17rem 0 0;
			
			

			> img,
			> video,
			> iframe {
				display: block;
				width: 100%;
				height: 100%;
				border: 0;
				object-fit: cover;
			}

			> video {
				cursor: pointer;
			}

			.play-pause {
				position: absolute;
				left: 50%;
				top: 50%;
				width: 2.75rem;
				aspect-ratio: 1 / 1;
				transform: translate(-50%, -50%);
				pointer-events: none;
				opacity: 1;
				transition: opacity 200ms ease-out;

				svg {
					display: block;
					width: 100%;
					height: 100%;
					overflow: visible;
					
					.pause {
						display: none;
					}
				}
			}

			&.is-playing {
				.play-pause {
					svg {
						.play {
							display: none;
						}

						.pause {
							display: block;
						}
					}
				}

				&:not(:hover) {
					.play-pause {
						opacity: 0;
					}
				}
			}
		}

		details {
			background-color: var(--colorAluminium-2);
			border-radius: 0 0 1.17rem 1.17rem;
			overflow: hidden;

			summary {
				display: flex;
				align-items: center;
				justify-content: space-between;
				gap: 0.58rem;
				padding: 0.58rem 1.4rem;
				background-color: var(--colorDarkBlue-2);
				color: var(--colorWhite);
				font-size: var(--fontSize20);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0.05em;
				cursor: pointer;
				list-style: none;

				&::-webkit-details-marker {
					display: none;
				}

				.caret {
					display: block;
					width: 1.75rem;
					aspect-ratio: 1 / 1;
					height: auto;
					flex-shrink: 0;
					transition: transform 200ms ease-out;
				}
			}

			.answer {
				.text {
					padding: 0.58rem 1.4rem 1.17rem;
					font-size: var(--fontSize17);
					line-height: 1.7;
					letter-spacing: 0.05em;

					p {
						&:first-child {
							margin-top: 0;
						}

						&:last-child {
							margin-bottom: 0;
						}
					}
				}
			}

			&[open] {
				summary {
					background-color: var(--colorDarkBlue-3);

					.caret {
						transform: rotate(180deg);
					}
				}
			}
		}
	}

	.claim {
		max-width: 42rem;
		margin: 3.5rem auto 0;
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.05em;
		text-align: center;

		p {
			&:first-child {
				margin-top: 0;
			}

			&:last-child {
				margin-bottom: 0;
			}
		}
	}
	
	.clips {
		display: flex;
		flex-direction: column;
		gap: 3.5rem;
	}

	@media only screen and (max-width: 768px) {
		.heading {
			width: 100%;
			margin-bottom: 2rem;
		}

		.clip details summary {
			padding: 0.7rem 1rem;
			font-size: 1rem;
		}

		.claim {
			margin-top: 2rem;
		}

		.clips {
			gap: 2rem;
		}
	}
}



.section__quicklinks {
	padding-bottom: 0 !important;
	
	@media only screen and (max-width: 768px) {
		padding-bottom: 3rem !important;
	}
	
	.innerwrapper {
		
		.links {
			display: flex;
			gap: 1.4rem;
			width: 100%;
			max-width: 77rem;
			margin-inline: auto;

			a {
				display: grid;
				grid-template-columns: 100%;
				grid-template-rows: 1fr auto;
				flex: 1;
				flex-direction: column;
				align-items: center;
				justidy-content: center;
				gap: 0.93rem;
				padding: 1.4rem 1.4rem 1.63rem;
				border-radius: 1.17rem 1.17rem 0 0;
				background-color: var(--colorDarkBlue-3);
				color: var(--colorWhite);
				font-size: var(--fontSize20);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0.05em;
				text-align: center;
				text-decoration: none;
				text-transform: uppercase;

				.caret {
					display: block;
					width: 1.75rem;
					height: auto;
					flex-shrink: 0;
					transition: transform 200ms ease-out;
					margin-inline: auto;
				}

				&:hover,
				&:focus-visible {
					.caret {
						transform: translateY(0.2rem);
					}
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper .links {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: 0.75rem;

			a {
				padding: 1rem 0.75rem;
				border-radius: 0.8rem;
				font-size: var(--fontSize14);
			}
		}
	}
}

.section__textblock {
	
	&:first-child {
		padding-top: calc(var(--headerHeight) + 3rem) !important;
	}
	
	.innerwrapper {
		&.left {
			text-align: left;
			
			
			.inner__holder {	
				> p,
				> h2,
				> h3 {
					max-width: none;
					text-align: left;
					
					+ p {
						margin-top: 1em;
					}
				}	
				
				> h1 {
					margin-bottom: 1em;
				}
			}
		}
	}


	.inner__holder {	
		font-size: var(--fontSize17);
		font-weight: 400;
		line-height: 1.7;
		letter-spacing: 0.04em;
		
		a {
			color: inherit;
		}
		
		> h2 {
			margin: 0;
			font-size: var(--fontSize28);
			font-weight: 300;
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-align: center;
			text-transform: uppercase;
		
			strong {
				font-weight: 400;
			}
			
			+ p {
				margin-top: 3.5rem;
			}
		}
		
		> h3 {
			margin: 0;
			font-size: var(--fontSize20);
			font-weight: 400;
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-align: center;
			text-transform: uppercase;

			
			+ p {
				margin-top: 3.5rem;
			}
		}
		
		> p {
			max-width: 36em;
			margin-inline: auto;
			text-align: center;
			
			+ h2 {
				margin-top: 1.5em;
			}
		}
		
		
		table {
		  width: 100%;
		  min-width: 760px;
		  border-collapse: collapse;
		  font-size: 1rem;
		  line-height: 1.5;
		  margin-top: 2rem;
		  border-radius: 1rem 1rem 0 0;
		  overflow: clip;
		}
		
		
		table th,
		table td {
		  padding: 0.5rem 1rem;
		  text-align: left;
		  vertical-align: top;
		}
		
		table thead th {
		  background-color: var(--colorDarkBlue-3);
		  color: var(--colorWhite);
		  font-weight: 600;
		}
		
		table tbody th,
		table tbody td {
		  background-color: #f8faf9;
		  font-weight: 400;
		  border-right: 1px solid #d9d9d9;
		  border-bottom: 1px solid #d9d9d9;
		}
		
		table tbody th {
			border-left: 1px solid #d9d9d9;
		}
		
		
		

		.column__wrapper {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 3rem;
			
			
			&:not(:first-child){
				margin-top: 3.5rem;
			}

			.column {
				

				&.light {
					font-weight: 300;
				}

				p {
					&:first-child {
						margin-top: 0;
					}
				
					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {

		.inner__holder {
			> h2 {
				font-size: 1.45rem;
			}

			> h2 + p,
			> h3 + p {
				margin-top: 2rem;
			}

			.column__wrapper {
				grid-template-columns: 1fr;
				gap: 1.5rem;
				margin-top: 2rem;
			}
		}
	}
}

.wpcf7 {
	width: 100%;
	margin-top: 3.3rem;

	.formular__wrapper {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.8rem 2.35rem;
		padding: 2rem;
		border-radius: 0.98rem;
		background-color: var(--colorWhite);
	}

	.form__column {
		display: flex;
		flex-direction: column;
		gap: 1.3rem;
	}

	.row__split {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.17rem;
	}

	.single__row {
		min-width: 0;

		p {
			margin-block: 0;
		}
	}

	.formular__wrapper > .single__row {
		grid-column: 1 / -1;
	}

	label {
		display: block;
		font-size: var(--fontSize17);
		font-weight: 700;
		line-height: 1.4;
		letter-spacing: 0.04em;
	}

	.wpcf7-form-control-wrap {
		display: block;
		margin-top: 0.45rem;
	}

	input:not([type="checkbox"]):not([type="submit"]),
	select,
	textarea {
		display: block;
		width: 100%;
		min-width: 0;
		padding: 0.75rem 0.9rem;
		border: 0.06rem solid var(--colorAluminium-6);
		border-radius: 0.4rem;
		outline: none;
		background-color: var(--colorWhite);
		color: var(--colorAluminium-7);
		font: inherit;
		font-size: var(--fontSize17);
		line-height: 1.4;
		transition: border-color 200ms ease-out, box-shadow 200ms ease-out;

		&:hover {
			border-color: var(--colorAluminium-5);
		}

		&:focus {
			border-color: var(--colorDarkBlue-3);
			box-shadow: 0 0 0 0.18rem rgba(21, 48, 78, 0.12);
		}

		&[aria-invalid="true"] {
			border-color: #b42318;
		}
	}

	select {
		cursor: pointer;
	}

	textarea {
		min-height: 14rem;
		resize: vertical;
	}

	.wpcf7-checkbox {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0.65rem;
	}

	.wpcf7-list-item {
		margin: 0;

		label {
			display: flex;
			align-items: flex-start;
			gap: 0.65rem;
			font-weight: 400;
			cursor: pointer;
		}

		input[type="checkbox"] {
			flex: 0 0 auto;
			width: 1.1rem;
			aspect-ratio: 1 / 1;
			margin: 0.15rem 0 0;
			accent-color: var(--colorDarkBlue-3);
			cursor: pointer;
		}
	}

	.wpcf7-acceptance {
		.wpcf7-list-item-label {
			font-size: var(--fontSize14);
			font-weight: 400;
			line-height: 1.6;
			letter-spacing: 0.04em;
		}
	}

	.submit__row {
		text-align: right;

		p {
			position: relative;
			display: block;
			width: fit-content;
			margin-left: auto;
		}

		.wpcf7-spinner {
			position: absolute;
			right: 1rem;
			top: 50%;
			margin: 0;
			transform: translateY(-50%);
		}
	}

	.wpcf7-submit {
		min-width: 12rem;
		padding: 0.8rem 1.8rem;
		border: 0;
		border-radius: 2rem;
		background-color: var(--colorDarkBlue-3);
		color: var(--colorWhite);
		font: inherit;
		font-size: var(--fontSize17);
		font-weight: 700;
		line-height: 1.4;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		cursor: pointer;
		transition: background-color 200ms ease-out, opacity 200ms ease-out;

		&:hover,
		&:focus-visible {
			background-color: var(--colorDarkBlue-2);
		}

		&:disabled {
			opacity: 0.45;
			cursor: not-allowed;
		}
	}

	.wpcf7-not-valid-tip {
		display: block;
		margin-top: 0.35rem;
		color: #b42318;
		font-size: var(--fontSize14);
		line-height: 1.4;
	}

	.wpcf7-response-output {
		margin: 1.3rem 0 0 !important;
		padding: 0.8rem 1rem !important;
		border-radius: 0.4rem;
		font-size: var(--fontSize17);
	}

	@media only screen and (max-width: 768px) {
		margin-top: 2rem;

		.formular__wrapper {
			grid-template-columns: 1fr;
			gap: 1.3rem;
			padding: 2rem;
		}

		.row__split {
			grid-template-columns: 1fr;
			gap: 1.3rem;
		}

		.formular__wrapper > .single__row {
			grid-column: auto;
		}

		textarea {
			min-height: 11rem;
		}

		.wpcf7-submit {
			width: 100%;
		}

		.submit__row p {
			width: 100%;
		}
	}
}

.section__list-with-image {
	.innerwrapper {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: auto 1fr;
		gap: 2.9rem 3rem;
	}

	h2 {
		grid-column: 2;
		margin: 0;
		font-size: var(--fontSize20);
		font-weight: 400;
		line-height: 1.4;
		letter-spacing: 0.04em;
		text-transform: uppercase;
	}

	.media {
		grid-column: 1;
		grid-row: 2;
		width: calc(100% + 0.8rem + var(--sideSpacing) + var(--outerSpacing));
		margin-left: calc(calc(var(--sideSpacing) + var(--outerSpacing)) * -1);
		overflow: hidden;
		border-radius: 0 1rem 1rem 0;
		position: relative;
		min-height: 26rem;

		img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
			position: absolute;
			inset: 0;
		}
	}

	.signs {
		grid-column: 2;
		grid-row: 2;
		margin-left: -0.9rem;
		width: calc(100% + 0.9rem);

		ul {
			display: flex;
			flex-direction: column;
			gap: 0.7rem;
			height: auto;
			margin: 0;
			padding: 0;
			list-style: none;

			li {
				display: flex;
				align-items: center;
				gap: 0.9rem;
				padding: 0.68rem 1.4rem 0.68rem 0;
				border-radius: 2rem 0 0 2rem;
				background-color: var(--colorDarkBlue-3);
				color: var(--colorWhite);
				font-size: var(--fontSize17);
				line-height: 1.4;
				letter-spacing: 0.05em;
				position: relative;
				
				&:after {
					content: '';
					display: block;
					position: absolute;
					left: 100%;
					height: 100%;
					background-color: var(--colorDarkBlue-3);
					top: 0;
					width: calc(var(--sideSpacing) + var(--outerSpacing));
				}

				&:before {
					content: '';
					display: block;
					width: 1.8em;
					flex-shrink: 0;
					margin-left: 0.75em;
					aspect-ratio: 1 / 1;
					background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none' viewBox='0 0 30 30'%3E%3Crect width='28.5' height='28.5' x='.75' y='.75' stroke='%23fcfeff' stroke-width='1.5' rx='14.25'/%3E%3Cpath fill='%23fcfeff' fill-rule='evenodd' d='M19.5 15a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0M18 15a3 3 0 1 1-6 0 3 3 0 0 1 6 0' clip-rule='evenodd'/%3E%3Cpath fill='%23fcfeff' fill-rule='evenodd' d='M25 15c0 5.523-4.477 10-10 10S5 20.523 5 15 9.477 5 15 5s10 4.477 10 10m-1.5 0a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0' clip-rule='evenodd'/%3E%3C/svg%3E");
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			display: flex;
			flex-direction: column;
			gap: 1.5rem;
		}

		h2 {
			order: 1;
		}

		.media {
			order: 2;
			width: 100%;
			margin-left: 0;
			aspect-ratio: 16 / 10;
			border-radius: 0.8rem;
			min-height: unset;
		}

		.signs {
			order: 3;
			width: 100%;
			margin-left: 0;

			ul li {
				padding-right: 0.8rem;
				border-radius: 2rem;

				&:after {
					display: none;
				}
			}
		}
	}
}

.section__list {
	.innerwrapper {
		display: flex;
		flex-direction: column;
		gap: 2.9rem 3rem;
	}

	h2 {
		margin: 0;
		font-size: var(--fontSize20);
		font-weight: 400;
		line-height: 1.4;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		
		@media only screen and (max-width: 768px) {
			margin-bottom: 1em;	
		}
	}


	.signs {
		margin-left: 0;
		width: 100%;
		margin-top: 2.9rem;

		ul {
			display: flex;
			flex-direction: column;
			gap: 0.7rem;
			height: auto;
			margin: 0;
			padding: 0;
			list-style: none;

			li {
				display: flex;
				align-items: center;
				gap: 0.9rem;
				padding: 0.68rem 1.4rem 0.68rem 0;
				border-radius: 2rem 0 0 2rem;
				background-color: var(--colorAluminium-3);
				color: var(--colorAluminium-7);
				font-size: var(--fontSize17);
				line-height: 1.4;
				letter-spacing: 0.05em;
				position: relative;
				
				&:after {
					content: '';
					display: block;
					position: absolute;
					left: 100%;
					height: 100%;
					background-color: var(--colorAluminium-3);
					top: 0;
					width: calc(var(--sideSpacing) + var(--outerSpacing) + 6.6rem);
				}

				&:before {
					content: '';
					display: block;
					width: 1.8em;
					flex-shrink: 0;
					margin-left: 0.75em;
					aspect-ratio: 1 / 1;
					background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none' viewBox='0 0 30 30'%3E%3Crect width='28.5' height='28.5' x='.75' y='.75' stroke='%23252525' stroke-width='1.5' rx='14.25'/%3E%3Cpath fill='%23252525' fill-rule='evenodd' d='M19.5 15a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0M18 15a3 3 0 1 1-6 0 3 3 0 0 1 6 0' clip-rule='evenodd'/%3E%3Cpath fill='%23252525' fill-rule='evenodd' d='M25 15c0 5.523-4.477 10-10 10S5 20.523 5 15 9.477 5 15 5s10 4.477 10 10m-1.5 0a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0' clip-rule='evenodd'/%3E%3C/svg%3E");
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			gap: 1.5rem;
		}

		.signs {
			margin-top: 0;

			ul li {
				padding-right: 0.8rem;
				border-radius: 2rem;

				&:after {
					display: none;
				}
			}
		}
	}
}

.section__info-box {

	.inner__holder {
		position: relative;
	}

	.info-card {
		position: relative;
		border-radius: 1.17rem 1.17rem 0 0;
		background-color: var(--boxBackgroundColor, var(--colorAluminium-2));
		border-bottom: 0.2rem solid var(--colorDarkBlue-3);
		
		&:has(.image.no-offset){
			display: flex;
		}

		&:not(:has(.image)) {
			.content {
				width: 100%;
				padding-right: 1.55rem;
			}

			.text {
				max-width: none;
			}
		}
	}

	.content {
		position: relative;
		z-index: 2;
		width: 57%;
		padding: 1.2rem 0 2.2rem 1.55rem;
	}

	.info-notice {
		display: block;
		width: 1.4rem;
		height: auto;
		aspect-ratio: 1 / 1;
	}

	.text {
		margin-top: 1.6rem;
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.05em;
		max-width: 29em;

		p {
			&:first-child {
				margin-top: 0;
			}

			&:last-child {
				margin-bottom: 0;
			}
		}
	}

	.appointment {
		position: relative;
		width: fit-content;
		margin-top: 2rem;
		margin-left: 0.5rem;
		font-size: var(--fontSize20);

		button {
			display: flex;
			align-items: center;
			gap: 0.85rem;
			padding: 0;
			border: 0;
			background: transparent;
			color: inherit;
			font: inherit;
			font-weight: 300;
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-align: left;
			text-transform: uppercase;
			cursor: pointer;
		}

		svg,
		img {
			display: block;
			width: var(--iconSize40);
			height: auto;
			aspect-ratio: 1 / 1;
			flex-shrink: 0;
		}

		ul {
			position: absolute;
			left: 50%;
			bottom: calc(100% + 0.7rem);
			z-index: 5;
			min-width: 15rem;
			margin: 0;
			padding: 0.35rem 0;
			border-radius: 0.35rem;
			background-color: var(--colorWhite);
			box-shadow: 0 0.35rem 1rem rgba(21, 48, 78, 0.2);
			list-style: none;
			opacity: 0;
			visibility: hidden;
			transform: translate(-50%, 0.35rem);
			transition: opacity 200ms ease-out, transform 200ms ease-out, visibility 200ms ease-out;

			&::before {
				content: '';
				position: absolute;
				left: 0;
				top: 100%;
				width: 100%;
				height: 0.7rem;
			}

			&::after {
				content: '';
				position: absolute;
				left: 50%;
				top: 100%;
				width: 0;
				height: 0;
				border: 0.45rem solid transparent;
				border-top-color: var(--colorWhite);
				transform: translateX(-50%);
			}

			li {
				margin: 0;
				padding: 0;
				list-style: none;
			}

			a {
				display: block;
				padding: 0.55rem 0.85rem;
				color: var(--colorAluminium-7);
				font-size: var(--fontSize17);
				line-height: 1.3;
				letter-spacing: 0.04em;
				text-decoration: none;
				white-space: nowrap;

				&:hover,
				&:focus-visible {
					background-color: var(--colorDarkBlue-1);
				}
			}
		}

		&:hover,
		&:has(:focus-visible),
		&.is-open {
			ul {
				opacity: 1;
				visibility: visible;
				transform: translate(-50%, 0);
			}
		}
	}

	.image {
		position: absolute;
		z-index: 1;
		right: -2rem;
		bottom: 0;
		width: 32rem;
		pointer-events: none;

		img {
			display: block;
			width: 100%;
			height: auto;
		}
		
		&.no-offset {
			right: 0;
			width: auto;
			flex: 1;
			left: 0;
			top: 0;
			bottom: 0;
			position: relative;
			margin-left: -7rem;
			
			img {
				position: absolute;
				height: 100%;
				object-fit: contain;
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.info-card,
		.info-card:has(.image.no-offset) {
			display: flex;
			flex-direction: column;
			border-radius: 0.9rem 0.9rem 0 0;
		}

		.content {
			width: 100%;
			padding: 1.25rem;
		}

		.text {
			margin-top: 1rem;
		}

		.appointment {
			margin: 1.5rem 0 0;
			font-size: 1rem;
		}

		.image,
		.image.no-offset {
			position: relative;
			right: auto;
			left: auto;
			top: auto;
			bottom: auto;
			order: 2;
			width: 100%;
			min-height: 13rem;
			margin-left: 0;

			img {
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				object-fit: contain;
				object-position: center bottom;
			}
		}
	}
}

.section__image-with-text-box {
	.inner__holder {
		max-width: var(--maxWidthInner);
	}

	.steps-card {
		display: grid;
		grid-template-columns: 51.1fr 48.9fr;
		min-height: 21.4rem;
		overflow: hidden;
		border-radius: 1.17rem;
	}

	.media {
		position: relative;
		background-color: var(--colorAluminium-3);

		.image {
			position: absolute;
			inset: 0;
			opacity: 0;
			transition: opacity 800ms ease-in-out;

			&.is-active {
				opacity: 1;
			}
		}

		img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}

	.content {
		padding: 2rem 2rem;
		background-color: var(--colorDarkBlue-3);
		color: var(--colorWhite);

		h3 {
			margin: 0;
			font-size: var(--fontSize20);
			font-weight: 400;
			line-height: 1.4;
			letter-spacing: 0.04em;
			text-transform: uppercase;
		}

		ol {
			margin: 1em 0 0;
			padding-left: 1.1em;
			font-size: var(--fontSize17);
			line-height: 1.7;
			letter-spacing: 0.04em;
			
			&:last-child {
				margin-bottom: 0;
			}
		}
	}

	> .innerwrapper .inner__holder > .text {
		max-width: 46rem;
		margin: 3.1rem auto 0;
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.04em;
		text-align: center;

		p {
			&:first-child {
				margin-top: 0;
			}

			&:last-child {
				margin-bottom: 0;
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.steps-card {
			grid-template-columns: 1fr;
		}

		.media {
			aspect-ratio: 16 / 10;
		}

		.content {
			padding: 1.5rem 1.25rem;
		}

		> .innerwrapper .inner__holder > .text {
			margin-top: 2rem;
		}
	}
}

.section__image-text-slider {

	.innerwrapper {
		max-width: var(--maxWidthInner);
		padding-block: 0 0.2rem;
	}

	h2 {
		font-size: var(--fontSize20);
		font-weight: 400;
		line-height: 1.4;
		letter-spacing: 0.04em;
		text-align: center;
	}

	.lens-nav {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.7rem;
		margin-top: 2.9rem;

		button {
			display: flex;
			align-items: center;
			gap: 0.9rem;
			min-width: 0;
			padding: 0.68rem 1.4rem 0.68rem 0.75rem;
			border: 0;
			border-radius: 2rem;
			background-color: var(--colorAluminium-3);
			color: var(--colorDarkBlue-3);
			font: inherit;
			font-size: var(--fontSize17);
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-align: left;
			cursor: pointer;
			transition: background-color 200ms ease-out, color 200ms ease-out;

			&:before {
				content: '';
				display: block;
				width: 1.8em;
				aspect-ratio: 1 / 1;
				flex-shrink: 0;
				background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none' viewBox='0 0 30 30'%3E%3Crect width='28.5' height='28.5' x='.75' y='.75' stroke='%2315304e' stroke-width='1.5' rx='14.25'/%3E%3Cpath fill='%2315304e' fill-rule='evenodd' d='M19.5 15a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0M18 15a3 3 0 1 1-6 0 3 3 0 0 1 6 0' clip-rule='evenodd'/%3E%3Cpath fill='%2315304e' fill-rule='evenodd' d='M25 15c0 5.523-4.477 10-10 10S5 20.523 5 15 9.477 5 15 5s10 4.477 10 10m-1.5 0a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0' clip-rule='evenodd'/%3E%3C/svg%3E");
			}

			&.is-active {
				background-color: var(--colorDarkBlue-3);
				color: var(--colorWhite);

				&:before {
					background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none' viewBox='0 0 30 30'%3E%3Crect width='28.5' height='28.5' x='.75' y='.75' stroke='%23fff' stroke-width='1.5' rx='14.25'/%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M19.5 15a4.5 4.5 0 1 1-9 0 4.5 4.5 0 0 1 9 0M18 15a3 3 0 1 1-6 0 3 3 0 0 1 6 0' clip-rule='evenodd'/%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M25 15c0 5.523-4.477 10-10 10S5 20.523 5 15 9.477 5 15 5s10 4.477 10 10m-1.5 0a8.5 8.5 0 1 1-17 0 8.5 8.5 0 0 1 17 0' clip-rule='evenodd'/%3E%3C/svg%3E");
				}
			}
		}
	}

	.slider {
		position: relative;
		margin-top: 2.6rem;
	}

	.viewport {
		overflow: hidden;
		border-radius: 1.17rem;
	}

	.slides {
		display: flex;
		touch-action: pan-y pinch-zoom;
	}

	.slide {
		display: grid;
		grid-template-columns: 51.1fr 48.9fr;
		min-width: 0;
		flex: 0 0 100%;
		height: auto;
		background-color: var(--colorAluminium-1);

		&:not(:has(.image img)) {
			grid-template-columns: minmax(0, 1fr);
		}

		&:has(.image img) {
			.image {
				aspect-ratio: 560 / 395;
			}

			.content {
				min-height: 0;
				margin-right: 0.6rem;
				overflow-y: scroll;
				overscroll-behavior: contain;
				scrollbar-color: var(--colorDarkBlue-3) var(--colorAluminium-3);
				scrollbar-gutter: stable;
				scrollbar-width: thin;
				contain: size;

				&::-webkit-scrollbar {
					width: 0.35rem;
				}

				&::-webkit-scrollbar-track {
					border-radius: 1rem;
					background-color: var(--colorAluminium-3);
				}

				&::-webkit-scrollbar-thumb {
					border-radius: 1rem;
					background-color: var(--colorDarkBlue-3);
				}
			}
		}

		.image {
			position: relative;
			overflow: hidden;

			img {
				display: block;
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}

		.content {
			padding: 2rem;
			font-size: var(--fontSize17);
			font-weight: 400;
			line-height: 1.7;
			letter-spacing: 0.05em;

			h3 {
				margin: 0;
				font-size: var(--fontSize20);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0.025em;
				text-transform: uppercase;
				margin-bottom: 1em;
			}
		}

	}

	.arrow {
		position: absolute;
		top: 50%;
		z-index: 2;
		width: 1.9rem;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--colorDarkBlue-3);
		cursor: pointer;
		transform: translateY(-50%);

		&.previous {
			left: calc(var(--sideSpacing) * -1);
			color: var(--colorAluminium-5);
		}

		&.next {
			right: calc(var(--sideSpacing) * -1);
		}

		svg {
			display: block;
			width: 100%;
			height: auto;
		}
		
		@media (hover: hover) {
			&:hover {
				svg {
					rect {
						fill: var(--colorDarkBlue-3);
					}
				}
			}	
		}
	}

	@media only screen and (max-width: 768px) {
		.lens-nav {
			display: flex;
			gap: 0.6rem;
			margin-top: 2rem;
			padding-bottom: 0.4rem;
			overflow-x: auto;
			scrollbar-width: none;
			width: calc(100% + var(--sideSpacing) + var(--sideSpacing));
			margin-inline: calc(var(--sideSpacing) * -1);
			padding-inline: var(--sideSpacing);

			button {
				flex: 0 0 auto;
				max-width: 17rem;
				padding: 0.6rem 1rem 0.6rem 0.65rem;
				scroll-snap-align: start;
			}
		}

		.slider {
			margin-top: 1.5rem;
		}

		.slide {
			grid-template-columns: 1fr;

			.image img {
				aspect-ratio: 16 / 10;
			}

			.content {
				padding: 1.5rem 1.25rem 4rem;
			}
		}

		.arrow {
			top: auto;
			bottom: 1rem;
			transform: none;

			&.previous {
				left: 1rem;
			}

			&.next {
				right: 1rem;
			}
		}
	}
}

body.frontend .section__image-text-slider .innerwrapper {
	max-width: var(--maxWidthInner);
}


.section__experts {

	.innerwrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		/*padding-top: 2.8rem;
		padding-bottom: 3.5rem;*/
		
		.headline {
			p {
				max-width: 41em;
			}
		}
		
		.column__wrapper {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 2.5rem;
			justify-content: center;
			max-width: 49.5rem;
			width: 100%;
			margin-inline: auto;
			
			
			.column {
				p {
					
					text-align: center;
					
					&:first-child {
						margin-top: 0;
					}
					
					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		
			@media only screen and (max-width: 768px) {
				grid-template-columns: 1fr;
				gap: 1.25rem;
			}
		
			
		}
	}






}

.headline {
	text-align: center;
	
	p {
		max-width: 24em;
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.05em;
		margin-inline: auto;
	}
	
	h2 {
		margin: 0;
		width: 100%;
		font-size: var(--fontSize28);
		font-weight: 300;
		line-height: 1.4;
		letter-spacing: 0.05em;
		text-align: center;
		text-transform: uppercase;
	
		strong {
			font-weight: 400;
			letter-spacing: inherit;
		}
	
		span {
			display: block;
		}
		
		+ p,
		+ .columns,
		+ .column__wrapper {
			margin-top: 3.5rem;
		}
	}

	@media only screen and (max-width: 768px) {
		h2 {
			font-size: 1.45rem;

			span {
				display: inline;
			}

			+ p,
			+ .columns,
			+ .column__wrapper {
				margin-top: 2rem;
			}
		}
	}
	

}



.section__services {
	
	.innerwrapper {
		/*padding-top: 2.9rem;
		padding-bottom: 3.6rem;*/
		
		
		
		.service-grid {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 1.4rem;
			margin-inline: auto;
		}
		
		.service-card {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 0.78rem;
			min-height: 18.88rem;
			margin: 0;
			padding: 1.17rem 1.17rem 3.5rem 1.37rem;
			border-radius: 0.98rem;
			background-color: var(--colorDarkBlue-3);
			color: var(--colorWhite);
			text-align: center;
			text-decoration: none;

			&:where(:not(:has(> svg, > img.icon, > p))) {
				min-height: 10rem;
				padding: 1.17rem;
				justify-content: center;
			}
		
			> svg,
			> img.icon {
				width: 5rem;
				height: auto;
				aspect-ratio: 1/1;
			}
		
			h3 {
				margin: 0;
				font-size: var(--fontSize20);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0.05em;
				text-transform: uppercase;
			}
		
			p {
				margin: 0;
				font-size: var(--fontSize17);
				line-height: 1.7;
				letter-spacing: 0.05em;
			}
		
			.more {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 2rem;
				height: auto;
				aspect-ratio: 1/1;
				margin-top: auto;
				border-radius: 50%;
				background-color: var(--colorWhite);
				color: var(--colorDarkBlue-3);
		
				svg {
					width: 100%;
					height: 100%;
				}
			}
		}
		

	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			.service-grid {
				grid-template-columns: 1fr;
				gap: 1rem;
			}

			.service-card {
				min-height: 16rem;
				padding: 1.25rem;
			}
		}
	}
}

.section__doctors {
	.doctor-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1.4rem;
		margin-top: 3.5rem;
	}

	.doctor-card {
		overflow: hidden;
		border-radius: 0.98rem;
		background-color: var(--colorDarkBlue-3);
		color: var(--colorWhite);

		.image {
			width: 100%;
			aspect-ratio: 16 / 10;
			background-color: var(--colorAluminium-3);

			img {
				display: block;
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}

		.content {
			display: flex;
			flex-direction: column;
			align-items: center;
			min-height: 12rem;
			padding: 1.5rem;
			text-align: center;
		}

		h3 {
			margin: 0;
			font-size: var(--fontSize20);
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-transform: uppercase;
		}

		.specialty {
			margin: 0.5rem 0 0;
			font-size: var(--fontSize17);
			line-height: 1.5;
			letter-spacing: 0.04em;
		}

		.vita-open {
			display: flex;
			align-items: center;
			gap: 0.7rem;
			margin-top: auto;
			padding: 0;
			border: 0;
			background: transparent;
			color: inherit;
			font: inherit;
			font-size: var(--fontSize15);
			letter-spacing: 0.05em;
			text-transform: uppercase;
			cursor: pointer;

			> svg {
				width: var(--iconSize40);
				height: auto;
				aspect-ratio: 1;
				flex-shrink: 0;
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.doctor-grid {
			grid-template-columns: 1fr;
			gap: 1rem;
			margin-top: 2rem;
		}

		.doctor-card {
			.image {
				aspect-ratio: 16 / 9;
			}

			.content {
				min-height: 10rem;
				padding: 1.25rem;
			}

			h3 {
				font-size: 1.25rem;
			}

			.specialty {
				font-size: 1rem;
			}

			.vita-open {
				margin-top: 1.5rem;
				font-size: 0.9rem;
			}
		}
	}
}

.doctor-dialog {
	width: min(42rem, calc(100% - 6rem));
	max-height: calc(100% - 6rem);
	padding: 0;
	border: 0;
	border-radius: 0.98rem;
	background-color: var(--colorWhite);
	color: var(--colorAluminium-7);

	&::backdrop {
		background-color: rgb(21 48 78 / 75%);
	}

	.dialog-inner {
		position: relative;
		overflow: auto;
		padding: 2.5rem;
	}

	.vita-close {
		position: absolute;
		top: 1.17rem;
		right: 1.17rem;
		width: var(--iconSize40);
		aspect-ratio: 1;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;

		svg {
			display: block;
			width: 100%;
			height: 100%;
			transform: rotate(45deg);
		}
	}

	h2 {
		padding-right: 3.5rem;
		font-size: var(--fontSize28);
		text-align: left;
	}

	.specialty {
		margin: 0.5rem 0 0;
		color: var(--colorDarkBlue-2);
		font-size: var(--fontSize17);
		letter-spacing: 0.04em;
	}

	.vita {
		margin-top: 2rem;
		line-height: 1.7;
		letter-spacing: 0.04em;

		p:first-child {
			margin-top: 0;
		}

		p:last-child {
			margin-bottom: 0;
		}
	}

	@media only screen and (max-width: 768px) {
		width: calc(100% - 2.5rem);
		max-height: calc(100% - 2.5rem);

		.dialog-inner {
			padding: 3.5rem 1.25rem 1.5rem;
		}

		.vita-close {
			top: 0.75rem;
			right: 0.75rem;
		}

		h2 {
			padding-right: 0;
			font-size: 1.45rem;
			line-height: 1.3;
		}

		.specialty {
			font-size: 1rem;
		}

		.vita {
			margin-top: 1.5rem;
			font-size: 1rem;
			line-height: 1.5;
		}
	}
}

.section-bottom-link {
	display: grid;
	align-items: center;
	grid-template-columns: auto 1fr;
	gap: 0.59rem;
	padding: 0;
	color: var(--colorAluminium-7);
	font-size: var(--fontSize20);
	font-weight: 300;
	line-height: 1.4;
	letter-spacing: 0.05em;
	text-decoration: none;
	width: 50%;
	margin-left: auto;
	margin-top: 2.2rem;
	letter-spacing: 0.045em;
	text-transform: uppercase;

	svg {
		width: 2.3rem;
		height: auto;
		aspect-ratio: 1/1;
		overflow: visible;
		margin-left: -1.3rem;
	}

	@media only screen and (max-width: 768px) {
		width: 100%;
		margin-top: 1.5rem;
		font-size: 1rem;

		svg {
			margin-left: 0;
		}
	}
}

.section-heading {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 2.35rem;
	text-align: center;
	padding-top: 2.8rem;

	h2 {
		margin: 0;
		font-size: var(--fontSize28);
		font-weight: 300;
		line-height: 1.4;
		letter-spacing: 0.05em;

		strong {
			font-weight: 400;
			letter-spacing: inherit;
		}
	}

	> p {
		
		margin: 0;
		font-size: var(--fontSize17);
		line-height: 1.7;
		letter-spacing: 0.05em;
		
		&:first-child {
			margin-top: 0;
		}
		
		&:last-child {
			margin-bottom: 0;
		}
	}

	@media only screen and (max-width: 768px) {
		padding-block: 1.5rem;

		h2 {
			font-size: 1.45rem;
		}
	}
}

.section__locations {
	position: relative;
	overflow: hidden;
	background-color: var(--colorWhite);
	padding-bottom: 0 !important;

	.map {
		position: absolute;
		left: -4.3rem;
		bottom: -103.8rem;
		width: 106.5rem;
		height: auto;
		opacity: 0.55;
		pointer-events: none;
		font-size: 0;
		line-height: 0;
		
		img {
			width: 100%;
			height: auto;
		}
	}

	.innerwrapper {
		position: relative;
		z-index: 1;
		padding-bottom: 11.5rem;
		
		.inner__holder {
			position: relative;
			z-index: 5;
		}
		
		.headline {
			position: relative;
			z-index: 5;
			
			p {
				max-width: 47em;
			}
		}
	}

	.location-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 1.3rem;
		width: 100%;
		margin-inline: auto;
		margin-top: 4.9rem;
		position: relative;
		z-index: 5;
	}

	.location-card {
		height: auto;
		overflow: clip;
		border-radius: 1rem;
		background-color: var(--colorDarkBlue-3);
		color: var(--colorWhite);
		display: flex;
		flex-direction: column;
		text-decoration: none;
		
		
		
		.image {
			font-size: 0;
			line-height: 0;
			width: 100%;
			
			img {
				display: block;
				width: 100%;
				height: auto;
				aspect-ratio: 552/283;
				object-fit: cover;
			}
		}

		

		.content {
			display: flex;
			flex-direction: column;
			gap: 1.5rem;
			padding:1.3rem 1.2rem 1.8rem 1.2rem;
			font-size: var(--fontSize17);
			line-height: 1.7;
			letter-spacing: 0.05em;
			flex: 1;

			.title {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 1.95rem;

				h3 {
					margin: 0;
					font-size: var(--fontSize20);
					line-height: 1.4;
					letter-spacing: 0.05em;
				}

				img {
					width: 1.17rem;
					height: auto;
					aspect-ratio: 1 / 1;
				}
			}

			address {
				font-style: normal;
			}

			a {
				color: inherit;
				font-weight: 700;
				text-decoration: none;
			}

			p {
				margin: 0;
			}
		}
	}

	.section-link {

	}

	@media only screen and (max-width: 768px) {
		.map {
			display: none;
		}

		.innerwrapper {
			padding-bottom: 3rem;
		}

		.location-grid {
			grid-template-columns: 1fr;
			gap: 1rem;
			margin-top: 2rem;
		}
	}
}

.section__why-us {

	.innerwrapper {
		display: flex;
		flex-direction: column;
		
		.column__wrapper {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 2.5rem;
			justify-content: center;
			max-width: 49.5rem;
			width: 100%;
			margin-inline: auto;
			
			
			.column {
				p {
					
					text-align: center;
					
					&:first-child {
						margin-top: 0;
					}
					
					&:last-child {
						margin-bottom: 0;
					}
				}
			}
		
			@media only screen and (max-width: 768px) {
				grid-template-columns: 1fr;
				gap: 1.25rem;
			}
		
			
		}
		
		.content {
			display: grid;
			grid-template-columns: 1.42fr 1fr;
			gap: 1.5rem;
			margin-top: 3.4rem;
			
			@media only screen and (max-width: 768px) {
				border-radius: 0.98rem;
				overflow: clip;
			}
		
			.image {
				width: 100%;
				min-height: 32rem;
				
		
				img {
					display: block;
					width: calc(100% + var(--outerSpacing) + var(--sideSpacing));
					margin-left: calc(calc(var(--outerSpacing) + var(--sideSpacing)) * -1);
					height: 100%;
					object-fit: cover;
				}
			}
		
			.panel {
				display: flex;
				flex-direction: column;
				padding: 2.5rem 0 2.5rem 2rem;

				background-color: var(--colorDarkBlue-3);
				color: var(--colorWhite);
				position: relative;
				font-size: var(--fontSize17);
				line-height: 1.7;
				letter-spacing: 0.045em;
				
				&:before {
					content: '';
					display: block;
					position: absolute;
					left: 0;
					top: 0;
					height: 100%;
					width: calc(100% + var(--outerSpacing) + var(--sideSpacing));
					background-color: var(--colorDarkBlue-3);
					z-index: 0;
				}
				
				h3 {
					position: relative;
					z-index: 5;
					margin: 0;
					font-size: var(--fontSize28);
					font-weight: 700;
					line-height: 1.4;
					letter-spacing: 0.05em;
				}
				
				p {
					position: relative;
					z-index: 5;
					margin-bottom: 0;
				}
				
		
				ul {
					margin: 0;
					padding: 0;
					list-style: none;
					display: flex;
					flex-direction: column;
					gap: 1.5em 0;
					position: relative;
					z-index: 5;
		
					li {
						/*display: flex;
						align-items: center;*/
					
						position: relative;
						padding-left: 2.5em;
						text-transform: uppercase;
						
						&:before {
							content: '';
							display: block;
							background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='none' viewBox='0 0 30 30'><rect width='28.5' height='28.5' x='.75' y='.75' stroke='%23fcfeff' stroke-width='1.5' rx='14.25'/><path fill='%23fcfeff' fill-rule='evenodd' d='M14.03 7.023a1.162 1.162 0 0 1 1.94 0l2.327 3.573c.156.24.398.414.678.486l4.163 1.079c.813.21 1.132 1.18.6 1.821l-2.725 3.287c-.183.221-.276.502-.26.786l.248 4.24c.048.828-.788 1.427-1.571 1.126l-4.011-1.542a1.17 1.17 0 0 0-.838 0l-4.01 1.542c-.784.301-1.62-.298-1.572-1.126l.247-4.24a1.13 1.13 0 0 0-.259-.786l-2.725-3.287a1.133 1.133 0 0 1 .6-1.821l4.163-1.079c.28-.072.522-.246.678-.486zm-1.07 4.392L15 8.28l2.04 3.134c.363.557.92.954 1.559 1.12l3.615.936-2.356 2.84a2.63 2.63 0 0 0-.602 1.832l.215 3.687-3.514-1.35a2.67 2.67 0 0 0-1.914 0l-3.514 1.35.215-3.687a2.63 2.63 0 0 0-.602-1.831L7.786 13.47l3.615-.937a2.65 2.65 0 0 0 1.559-1.12' clip-rule='evenodd'/></svg>");	
							background-repeat: no-repeat;
							background-size: 98% auto;
							width: 1.8em;
							height: auto;
							aspect-ratio: 1/1;
							position: absolute;
							left: 0;
							top: 0;
							
						}
		
						/*
						
						span {
							display: flex;
							align-items: center;
							justify-content: center;
							width: 1.47rem;
							height: 1.47rem;
							border: 1.5px solid currentColor;
							border-radius: 50%;
		
							img {
								width: 1.17rem;
								height: auto;
								aspect-ratio: 1 / 1;
							}
						}
						
						*/
					}
				}
		
				.section-bottom-link {
					position: relative;
					z-index: 5;
					width: 100%;
					color: var(--colorWhite);
					margin-top: auto;
					
					@media only screen and (max-width: 768px) {
						margin-top: 2rem;	
					}
					
					svg {
						margin-left: 0;
						
						rect {
							fill: var(--colorWhite);
						}
						
						path {
							fill: var(--colorDarkBlue-3);
						}
					}
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper .content {
			grid-template-columns: 1fr;
			gap: 0;
			margin-top: 2rem;

			.image {
				min-height: 18rem;

				img {
					width: 100%;
					margin-left: 0;
				}
			}

			.panel {
				padding: 2rem 1.25rem;

				&:before {
					width: 100%;
				}
			}
		}
	}
	
}

	
.section__reviews {
	.innerwrapper {
		display: flex;
		flex-direction: column;
		
		gap: 3rem 0;
	}
}

.section__career {

	.innerwrapper {

		.jobs {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 1.17rem;
			width: 100%;
			margin-inline: auto;
			margin-top: 3.3rem;
		}

		.job-card {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 0.78rem;
			padding: 1.3rem 1.4rem;
			border-radius: 0.98rem;
			background-color: var(--colorAluminium-1);
			color: var(--colorAluminium-7);
			text-align: center;
			text-decoration: none;
			width: 25rem;

			h3 {
				margin: 0;
				font-size: var(--fontSize20);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0.05em;
			}
			
			.description {
				p {
					font-size: var(--fontSize17);
					line-height: 1.7;
					letter-spacing: 0.05em;
					
					&:first-child {
						margin-top: 0;
					}
					
					&:last-child {
						margin-bottom: 0;
					}
				}
			}

			

			.more {
				display: block;
				width: 2rem;
				aspect-ratio: 1 / 1;
				margin-top: 0.2rem;

				svg {
					display: block;
					width: 100%;
					height: 100%;
				}
			}
		}

		.claim {
			margin: 3.3rem 0 0 0;
			padding-block: 0;
			font-size: var(--fontSize17);
			font-weight: 400;
			line-height: 1.4;
			letter-spacing: 0.05em;
			text-align: center;
			
			p {
				max-width: 46em;
				margin-inline: auto;
			}

			strong {
				font-weight: 400;
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			.jobs {
				margin-top: 2rem;
			}

			.job-card {
				width: 100%;
			}

			.claim {
				margin-top: 2rem;
			}
		}
	}
}

.section__career-detail {
	.innerwrapper {
		.jobs {
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: center;
		}

		.job-card {
			align-items: flex-start;
			width: calc(50% - 0.585rem);
			text-align: left;
			padding: 2rem;
			scroll-margin-top: calc(var(--headerHeightSmall) + 3rem);
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			.job-card {
				width: 100%;
				padding: 1.3rem 1.4rem;
			}
		}
	}
}

.section__faq {
	--shapeRadiusX: max(68.92rem, 82vw);
	--shapeRadiusY: 68.89rem;

	position: relative;
	-webkit-clip-path: ellipse(var(--shapeRadiusX) var(--shapeRadiusY) at 50% var(--shapeRadiusY));
	clip-path: ellipse(var(--shapeRadiusX) var(--shapeRadiusY) at 50% var(--shapeRadiusY));
	
	.innerwrapper {
		position: relative;
		padding-top: 1rem;
		
		.top {
			position: relative;
			overflow: hidden;
			background-color: transparent;
		
			.headline {
				position: relative;
				z-index: 2;
			}
		}
		
		.questions {
			width: 100%;
			margin-inline: auto;
			margin-top: 4rem;
		
			details {
				border-bottom: 1.5px solid var(--colorAluminium-4);
		
				summary {
					display: flex;
					align-items: center;
					justify-content: space-between;
					gap: 1rem;
					padding-block: 1.36rem;
					font-size: var(--fontSize17);
					font-weight: 700;
					line-height: 1.7;
					letter-spacing: 0.05em;
					cursor: pointer;
					list-style: none;
		
					&::-webkit-details-marker {
						display: none;
					}
					
					&:after {
						content: '';
						display: block;
						background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='8' fill='none' viewBox='0 0 18 8'><path fill='%23424445' d='M17.256 1.424a.874.874 0 0 0 .047-1.158.706.706 0 0 0-1.06-.051l-5.17 5.172a3.297 3.297 0 0 1-4.645 0L1.256.215a.706.706 0 0 0-1.06.051.874.874 0 0 0 .048 1.158l5.171 5.172a4.704 4.704 0 0 0 6.67 0z'/></svg>");	
						background-repeat: no-repeat;
						background-size: 98% auto;
						width: 1.3em;
						height: auto;
						aspect-ratio: 1/1;
						transition: transform 200ms ease-out;
						background-position: center center;
					}

				}
		
				.answer {
					
					padding: 0 0 1.17rem;
					font-size: var(--fontSize17);
					line-height: 1.7;
					letter-spacing: 0.05em;

					p {
						&:first-child {
							margin-top: 0;
						}

						&:last-child {
							margin-bottom: 0;
						}
					}
				}
		
				&[open] summary::after {
					transform: rotate(180deg);
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		--shapeRadiusX: 50rem;
		--shapeRadiusY: 50rem;

		.innerwrapper .questions {
			margin-top: 2.5rem;

			details summary {
				padding-block: 1rem;
			}
		}
	}

}

body.frontend footer {
	background-color: var(--colorDarkBlue-3);
	color: var(--colorWhite);

	.innerwrapper {
		display: flex;
		flex-direction: column;
		gap: 2.8rem;
		padding-block: 2.5rem 1.1rem;
		padding-inline: 1.5rem;

		.locations {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 1.4rem;

			.location {
				display: flex;
				flex-direction: column;
				min-height: 11.44rem;
				border: 1px solid var(--colorWhite);
				color: inherit;
				text-decoration: none;
				
				

				.title {
					display: flex;
					align-items: center;
					justify-content: space-between;
					min-height: 3.5rem;
					padding: 0.58rem 1.5rem 0.58rem 1.17rem;
					border-bottom: 1px solid var(--colorWhite);

					h3 {
						margin: 0;
						font-size: var(--fontSize20);
						font-weight: 700;
						line-height: 1.4;
						letter-spacing: 0.05em;
						text-transform: none;
					}

					svg {
						width: 1rem;
						height: auto;
						aspect-ratio: 1 / 1;
						transition: transform 200ms ease-out;
					}
				}

				.description {
					flex: 1;
					padding: 0.58rem 1.17rem;
					font-size: var(--fontSize17);
					line-height: 1.7;
					letter-spacing: 0.05em;
					
					a {
						color: inherit;
						text-decoration: none;
					}


					p {
						margin: 1.5em 0;
						
						&:first-child {
							margin-top: 0;
						}

						&:last-child {
							margin-bottom: 0;
						}
					}
				}
				
				@media (hover: hover) {
					&:hover {
						.title {
							svg {
								transform: rotate(45deg);
							}	
						}
					}
				}	
			}
		}

		.links {
			display: flex;
			align-items: center;
			justify-content: space-between;

			a {
				color: inherit;
				font-size: var(--fontSize17);
				font-weight: 700;
				line-height: 1.7;
				letter-spacing: 0.05em;
				text-decoration: none;
			}

			.menu,
			.legal,
			.right,
			.socials {
				display: flex;
				align-items: center;
			}

			.menu {
				gap: 1.1rem;
			}

			.right {
				gap: 2.2rem;
				
			}

			.legal {
				gap: 1.1rem;
				padding-right: 1rem;
			}

			.socials {
				gap: 0.49rem;

				a {
					width: 2.33rem;
					aspect-ratio: 1 / 1;
					display: flex;
					align-items: center;
					justify-content: center;

					svg {
						display: block;
						width: 1.17rem;
						height: auto;
						aspect-ratio: 1 / 1;
					}
				}
			}
		}
	}

	@media only screen and (max-width: 768px) {
		.innerwrapper {
			gap: 2rem;
			padding: 2rem 0 6rem;

			.locations {
				grid-template-columns: 1fr;
				gap: 1rem;

				.location {
					min-height: 0;
				}
			}

			.links {
				align-items: center;
				gap: 1.5rem;
				padding-inline: 0;
				flex-direction: column;

				.menu {
					flex-direction: column;
					align-items: flex-start;
					gap: 0.5rem;
				}

				.right {
					flex-direction: column;
					align-items: flex-end;
					gap: 1rem;
				}

				.legal {
					flex-direction: row;
					justify-content: center;
					gap: 1.5rem;
					
				}
			}
		}
	}
}