@font-face {
	font-family: "celeste-regular";
	src: url("../fonts/celeste-pro-regular.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "avenir-heavy";
	src: url("../fonts/AvenirNextLTPro-Demi.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "avenir-regular";
	src: url("../fonts/avenir-pro-roman.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "amatiksymbols";
	src: url("../fonts/amatiksymbols.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
}

::view-transition-old(root),
::view-transition-new(root) {
    animation-duration: .55s;
    animation-timing-function: ease;
    mix-blend-mode: normal;
}

/* Alter Zustand bleibt einfach liegen */
::view-transition-old(root) {
    animation: none;
}

/* Neuer Zustand wird kreisförmig aufgedeckt */
::view-transition-new(root) {
    animation: theme-circle-reveal .55s ease both;
}

@keyframes theme-circle-reveal {
    from {
        clip-path: circle(0% at var(--vt-x, 50%) var(--vt-y, 50%));
    }

    to {
        clip-path: circle(150% at var(--vt-x, 50%) var(--vt-y, 50%));
    }
}

:root {
	--font-h1: clamp(1.75rem, 1.1071rem + 3.2143vw, 6.25rem); /* 28 - 100px */
	--font-h1-hero: clamp(3rem, 2.1261rem + 4.3694vw, 9.0625rem); /* 48 - 145px */
	--font-h1-hero: clamp(3.75rem, 2.759rem + 4.955vw, 10.625rem); /* 60 - 170px */
    --font-h1-big: clamp(4.375rem, 2.7679rem + 8.0357vw, 15.625rem); /* 70 - 250px */
	--font-h1-big: clamp(2.5rem, 1.0586rem + 7.2072vw, 12.5rem); /* 40 - 200px */
	
    --font-h2: clamp(1.625rem, 1.3187rem + 1.5315vw, 3.75rem); /* 26 - 60 */
	--font-h2-hero: clamp(1.125rem, 0.8547rem + 1.3514vw, 3rem); /* 18 - 48 */
	--font-h2-timeline: clamp(5.25rem, 3.7409rem + 7.5455vw, 15.625rem); /* 84 - 250px */
	--font-h2-textblock: clamp(1.5rem, 1.4091rem + 0.4545vw, 2.125rem); /* 22 - 35px */
	--font-h2-smallcard: clamp(1.25rem, 0.5969rem + 3.2653vw, 2.25rem); /* 20 - 36px ab 810 */
	--font-h2-smallcard: clamp(1rem, 0.1837rem + 4.0816vw, 2.25rem); /* 16 - 36px ab 810 */

	--font-h3: clamp(1.25rem, 0.9955rem + 1.2727vw, 3rem); /*20 - 48px */
	--font-h4: clamp(0.8125rem, 0.8rem + 0.0625vw, 0.875rem); /*14px*/
	--font-menu: clamp(1rem, 0.9636rem + 0.1818vw, 1.25rem);  /*16 - 20px*/
	--font-menu-mobile: clamp(0.75rem, 0.6447rem + 0.5263vw, 1rem);  /*12 - 16px*/
	--font-menu-mobile-small: clamp(0.625rem, 0.5724rem + 0.2632vw, 0.75rem); /* 10 - 12 */

	--font-btn: clamp(1rem, 0.9636rem + 0.1818vw, 1.25rem);	/* 16 - 20px */
	--font-p-small: clamp(1rem, 0.9636rem + 0.1818vw, 1.25rem);	/* 16 - 20px */
	--font-p-mobile-small: clamp(0.875rem, 0.7934rem + 0.4082vw, 1rem);	/* 14 - 16px ab 810*/
	--font-p: clamp(1.25rem, 1.2136rem + 0.1818vw, 1.5rem); /* 20 - 24px*/
	--font-p-cite: clamp(1.5rem, 1.1727rem + 1.6364vw, 3.75rem); /* 25 - 60px */
    --font-p-big: clamp(1.125rem, 1.0357rem + 0.4464vw, 1.75rem); /* 18 - 28px */
	--font-p-hero: clamp(1.375rem, 1.2321rem + 0.7143vw, 2.375rem); /* 22 - 38px */
	--font-p-hero: clamp(1.125rem, 0.9809rem + 0.7207vw, 2.125rem); /* 18 - 34px */
	
	--font-card-h3: clamp(1.25rem, 0.4787rem + 4.2553cqw, 2.5rem); /* 20 - 40px CQW */
	--font-card-p: clamp(1rem, 0.8457rem + 0.8511cqw, 1.25rem); /* 16 - 20px CQW */
	--font-card-dach: clamp(0.875rem, 0.7207rem + 0.8511cqw, 1.125rem); /* 14 - 18px CQW */
	--font-card-date: clamp(0.75rem, 0.5957rem + 0.8511cqw, 1rem); /* 12 - 16 CQW */

	--font-testi-head: clamp(1.625rem, 1rem + 2.6667cqw, 2rem); /* 26 - 32 CQW */

	--clr-schwarz: light-dark(#1D1D1B, #ffffff);
	--clr-weiss: light-dark(#ffffff, #1D1D1B);
	--clr-immerweiss: #ffffff;
	--clr-immerschwarz: #1D1D1B;
	--clr-blau-hell: #3A78B8;
	--clr-blau-dunkel: #001E4B;
	--clr-gelb: #E5FF72;
	--clr-graublau: #D8E4F1;
	--clr-beige-hell:#BBB3AB33;
	--clr-beige-dunkel: #BBB3AB;
	--clr-antrazit: light-dark(#201E1C, #ffffff);
	--clr-antra-schwarz: light-dark(#201E1C, #0c0c0c);

	--gradient-blau-dunkel: linear-gradient(180deg, var(--clr-blau-hell) 0%, rgba(58, 120, 184, 0.07) 100%);
	--gradient-blau-hell: linear-gradient(180deg, rgba(58, 120, 184, 0.25) 0%, rgba(58, 120, 184, 0.03) 100%);
	--gradient-gelb: linear-gradient(180deg, rgba(229, 255, 114, 0.05) 0%, var(--clr-gelb) 100%);
	--gradient-gelb-weiss: linear-gradient(180deg, var(--clr-gelb) 0%, rgba(229, 255, 114, 0.05) 100%);
	--gradient-grau: linear-gradient(0deg, rgba(58, 120, 184, 0.10) 0%, rgba(58, 120, 184, 0.10) 100%), #FFF;

	--swiper-pagination-color: var(--clr-gelb);

	--padder: clamp(1.5rem, 1.2rem + 1.5vw, 3rem);
	--padder: clamp(1rem, 0.6036rem + 1.982vw, 3.75rem);
	--smallpad: clamp(0.5rem, -0.1316rem + 3.1579vw, 2rem); /* 8 - 32px */
    --gapper: 6px;
	--smallgap: clamp(0.0625rem, -0.0691rem + 0.6579vw, 0.375rem); /*1 - 6px */
	--letter-spacer: 0.05em;
    --letter-spacer-neg: -.125em;
    --bs-gutter-x: 3rem;
	--delay: .1s;

	--bar-width: 30px;
	--bar-height: 2px;
	--hamburger-gap: 6px;
	--burger-timing: .3s ease-in-out;
	--hamburger-height: calc(var(--bar-height) * 3 + var(--hamburger-gap) * 2);

	--tile: clamp(5rem, 1.3014rem + 5.4795vw, 10rem);
	--tile-mobile: 80px;   /* halb so groß */
	--gap: 0px;
	--radius-small: 16px;	
	--radius-big: 30px;

	--input-item-dummy-checkbox-radius: 0;

	transition-behavior: allow-discrete;
	interpolate-size: allow-keywords;

	--fontface-regular: avenir-regular;
	--fontface-bold: avenir-heavy;
	--fontface-headline: celeste-regular;

	color-scheme: light dark;
}

/* User erzwingt Light */
:root[data-theme="light"] {
    color-scheme: light;
}

/* User erzwingt Dark */
:root[data-theme="dark"] {
    color-scheme: dark;
}

:root {
    --logo-filter: none;
	--logo-filter-inverted: invert(0%);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --logo-filter: invert(100%);
		--logo-filter-inverted: invert(0%);
		--filter-clr-grey: grayscale(1) brightness(2);
    }
}

:root[data-theme="light"] {
    --logo-filter: none;
	--logo-filter-inverted: invert(100%);
	--filter-clr-grey: grayscale(0) brightness(1);
}

:root[data-theme="dark"] {
    --logo-filter: invert(100%);
	--logo-filter-inverted: invert(0%);
	--filter-clr-grey: grayscale(1) brightness(2);
}

@media (max-width: 810px){
  :root{
    --tile: var(--tile-mobile);   /* ✅ Autopilot/Mobile nutzt kleinere Tiles */
	--radius-small: 8px;	
	--radius-big: 16px;	
  }
}

/* #region Reset */

* {
	margin:0;
	box-sizing: border-box;
	font-weight: normal;
}
  :before,:after {
	box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
	scrollbar-gutter: stable;
	color: var(--clr-schwarz);
  }	

video {
    width: 100%;
}

img, picture, video, canvas, svg, .youtube-frame {
    display: block;
    max-width: 100%;
	border-radius: var(--radius-big);
}

.inhaltselement-bild img {
	width: 100%;
}

.youtube-frame, video, .kish-youtube-consent iframe {
	width: 100%;
	aspect-ratio: 16/9;
	height: auto;
	border-radius: var(--radius-big);
}

.kish-youtube-consent {
	position: relative;
}

.kish-youtube-consent-content {
	position: absolute;
	inset: 0;
	isolation: isolate;
	width: 100%;
	margin: auto;
	background-color: rgba(255 255 255 / .65 );
	padding: .75rem;
	border-radius: var(--radius-small);
	height: 100%;
	backdrop-filter: blur(5px);
	align-content: center;
	text-align: center;
}

.kish-youtube-consent-content p {
	font-size: var(--font-p-small);
	padding-bottom: 1rem;
	margin: auto;
	max-width: 50ch;
}

.kish-youtube-consent-content .btn {
	margin: auto;
	translate: -44px;
}

.desktopvideo {
	object-fit: cover;
	width: 100%;
	height: 100%;
	aspect-ratio: unset;
	border-radius: 0;
}

input, button, textarea, select {
    font: inherit;
	background-color: transparent;
}  

.mobile {
	display: none!important;
	@media (max-width: 1080px) {
		display: initial!important;
	}
}

.desktop {
	display: initial!important;
	@media (max-width: 1080px) {
		display: none!important;
	}
}



/* #endregion Reset */

/* Body */

body {
	font-family: var(--fontface-regular);
	font-weight: normal;
	line-height: 1.3;
	scroll-behavior: smooth;
	/* transition: .6s; */
	background-color: var(--clr-weiss);
}

body:has(.container.navbar.active) {
	overflow: hidden;
}

.skip {
	text-indent: -9999999px;
	position: absolute;
}

/* #region Standards */

h1, h2, h3, h4 {
	font-family: var(--fontface-headline);
	line-height: 1.1;
}

h1, .newsheader, .intro h2, .inhaltselement-modul-header h2 {
	font-size: var(--font-h1);
	max-width: 31ch;
	line-height: 1.05;
	margin-bottom: .5em;
}

.landing h1, .category-desc h1  {
	font-size: var(--font-h1-big);
	text-align: center;
	line-height: 1;
}

.category-desc h1  {
	margin-bottom: .25em;
}

h2 {
	font-size: var(--font-h2);
}

.subintro h2 {
	max-width: 44ch;
	text-wrap: balance;
	text-align: center;
	margin: auto;
	font-family: var(--fontface-bold);
}

h3 {
	font-size: var(--font-h3);
}

.subintro h3 {
	max-width: 48ch;
	text-wrap: balance;
	text-align: center;
	margin: auto;
	margin-bottom: 2em;
	font-family: var(--fontface-regular);
}

h4 {
	font-size: var(--font-p-big);
}

p {
	padding-bottom: .5em;
	max-width: 75ch;
	font-size: var(--font-p-small);
}

.landing .introtext p {
	font-family: var(--fontface-bold);
	font-size: var(--font-p-big);
}

.category-desc p {
	margin: auto;
	font-size: var(--font-p-big);
	font-family: var(--fontface-bold);
	max-width: 54ch;
	text-align: center;
}

main ul, main ol {
	font-size: var(--font-p);
	padding-left: 0;
	margin-bottom: var(--padder);
	margin-left: 1em;
}

main ul {
	list-style-type: square;
	margin-left: .5em;
}

main ul li, main ol li {
	margin-bottom: .5em;
	max-width: 75ch;
	font-size: var(--font-p-small);
}

main ul li::marker {
	content: '–';
}

main ul li {
	padding-left: .5em;
}

.awesomplete > ul li::marker {
	content: "";
}

.awesomplete mark {
	background: var(--clr-gelb);
	color: var(--clr-immerschwarz);
}

.textblock p {
	max-width: 62ch;
}

.introwrapper p {
	font-size: var(--font-menu);
}

a {
	color: var(--clr-schwarz);
	overflow-wrap: break-word;
}

a.text-hidden, a.text-hidden img {
    width: 44px;
    height: 44px;
    display: block;
    padding-bottom: 10px;
}

mark {
	background: inherit;
	color: inherit;
}

strong {
	font-family: var(--fontface-bold);
	font-weight: normal;
}

.bg-weiss {
	background-color: var(--clr-weiss);
}

.bg-gelb {
	background: var(--gradient-gelb);
}

.bg-beige, .bg-dark {
	background-color: var(--clr-beige-hell);
}

.bg-antrazit {
	background-color: var(--clr-antrazit);
	color: var(--clr-weiss);
}

/* .com-content-article__body {
	padding-bottom: calc(2*var(--padder));
} */

.com-content-article__body:has(.bg-beige:last-child) {
	padding-bottom: 0;
}

.category-desc {
	padding-bottom: calc(1*var(--padder));
	padding-inline: calc(1*var(--padder));
	max-width: 2520px;
	margin: auto;
	margin-bottom: calc(1.25*var(--padder));
	@media (max-width: 810px) {
		padding-inline: calc(1*var(--padder));
	}
}

.page-header {
	padding-inline: calc(2*var(--padder));
	max-width: 2520px;
	margin: auto;	
	@media (max-width: 810px) {
		padding-inline: calc(1*var(--padder));
	}
}

/* #endregion Standards */

/* #region Links und Buttons */

.btn, .btn.inv, .cf-btn {
	position: relative;
	width: fit-content;
	display: block;
	cursor: pointer;
	font-family: var(--fontface-regular);
	font-size: var(--font-p-mobile-small);
	text-decoration: none;
	padding: 0.75em 0.25em 0.75em 0.75em;
	margin-right: 44px;
	border: 1px solid var(--clr-schwarz);
	border-right: 0;
	background-color: var(--clr-antrazit);
	color: var(--clr-weiss);
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	transition: .3s;
}

.btn::after, .btn.inv::after, .cf-btn:after {
	content: '';
	font-family: amatiksymbols;
	position: absolute;
	right: -44px;
	background-color: var(--clr-antrazit);
	height: calc(100% + 2px);
	border: 1px solid var(--clr-antrazit);
	border-left: 0;
	top: -1px;
	align-content: center;
	width: 44px;
	text-align: center;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	transition: .3s;
}

.btn::before, .btn.inv::before, .cf-btn:before {
	content: '>';
	font-family: amatiksymbols;
	font-size: var(--font-p-small);
	position: absolute;
	right: -44px;
	background-color: transparent;
	height: calc(100% + 2px);
	border: 0;
	border-left: 0;
	top: -1px;
	align-content: center;
	width: 44px;
	text-align: center;
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	transition: .15s, font-size .3s .3s;
	z-index: 1;
	transform-origin: center;
}

/* .btn:hover::before, .btn.inv:hover::before, .cf-btn:hover:before {
	font-size: calc(.25rem + var(--font-p-small));
} */

.btn[target="_blank"]::before {
	content: 'F';
	padding-top: .3rem;
}

.btn.download::before, .btn.download[target="_blank"]::before {
	content: '<';
	rotate: -90deg;
}

.btn:hover, .btn.inv, .btn.inv:after, .cf-btn:hover, .btn:hover::after, .cf-btn:hover:after {
	background-color: var(--clr-weiss);
	color: var(--clr-antrazit);	
}

.btn.inv:hover, .btn.inv:hover:after {
	background-color: var(--clr-antrazit);
	color: var(--clr-weiss);	
}

.btn:hover, .btn:hover::after, .btn.inv:hover, .btn.inv:hover::after {
	border-radius: 8px;
}

.bg-antrazit .btn.inv:hover, .bg-antrazit .btn.inv:hover::after {
	border-color: var(--clr-weiss);
}


.btn.inv.filter {
	display: none;
}

.heroclaim .btn {
	background-color: var(--clr-gelb);
	border-color: var(--clr-gelb);
	color: var(--clr-schwarz);
}

.heroclaim .btn:hover {
	background-color: var(--clr-gelb);
	color: var(--clr-gelb);
	border-color: var(--clr-gelb);
}

.mod-breadcrumbs__wrapper {
	position: absolute;
	top: calc(3*var(--padder));
	left: calc(1*var(--padder));
	z-index: 10000;
}

body:has(.up) .mod-breadcrumbs__wrapper {
	z-index: 0;
}

.mod-breadcrumbs.breadcrumb {
	display: flex;
	padding: 0;
	padding-block: 0;
	padding-right: .5rem;
	font-size: var(--font-h4);
	list-style-type: none;
	gap: .5em;
	margin: 0;
	background-color: var(--clr-weiss);
}

.breadcrumb .pathway {
	text-decoration: none;
}

.breadcrumb .pathway[href="/netzwerk/netzwerkpartner.html"] {
	display: none;
}

.breadcrumb .pathway::before {
	content: '>';
	font-family: amatiksymbols;
	text-decoration: none;
	display: inline-block;
	font-size: 10px;
	translate: -4px -2px;
	align-content: end;
}

.breadcrumb .pathway span {
	text-decoration: underline;
}

.pfeilbutton {
	text-decoration: none;
	position: relative;
	display: flex;
	gap: calc(.25*var(--padder));
	align-items: center;
}

.pfeilbutton::after {
	content: '';
	background-image: url(../images/pfeil.svg);
	width: calc(1.5*var(--padder));
	height: var(--padder);
	background-repeat: no-repeat;
	background-size: cover;
}

.nopad {
	padding: 0;
}

.align-right {
	display: flex;
}

.btn.right, .btn.right:hover {
	margin-right: 0;
}

.mod-menu__separator.separator {
	color: transparent;
}

/* #endregion Links und Buttons */

/* #region Header */

header {
	position: fixed;
	width: 100%;
	z-index: 9999;
	display: grid;
	/* align-content: center; */
	transition: .3s;
	height: calc(6*var(--padder));
	align-content: start;
	@media (max-width: 1080px) {
		height: 110px;
	}	

}

header.up, header.down {
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	mask: linear-gradient(to bottom, transparent 0%, black 0%, black 50%, transparent 100%);
	-webkit-mask: linear-gradient(to bottom, transparent 0%, black 0%, black 50%, transparent 100%);
	mask-size: 100% 100%;
	-webkit-mask-size: 100% 100%;
	mask-position: center;
	-webkit-mask-position: center;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	background-image: linear-gradient(to bottom, transparent 0%, rgba(255,255,255,.2)0%, rgba(255,255,255,.2) 75%, transparent 100%);
	height: fit-content;
	@media (max-width: 1080px) {
		height: 110px;
	}	

}

header.light {
	background-color: transparent;
	backdrop-filter: none;
	background-image: none;
	-webkit-mask: none;
	mask: none;
	height: auto;
}

header:has(input:checked) {
	height: 100svh;
	background-image: none;
	-webkit-mask: none;
	mask: none;
}

.down {
	translate: 0 calc(-5*var(--padder));
}

.burgerwrapper {
	display: grid;
	grid-template-columns: 1fr auto;
}

.logowrapper {
	position: relative;
	/* max-width: 50vw;
	padding-right: var(--padder); */
}

.logowrapper {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	transition: .3s;
	transition-delay: .3s;
}

.up .logowrapper a:nth-child(2), .down .logowrapper a:nth-child(2),
.light.up .logowrapper a:nth-child(2), .light.down .logowrapper a:nth-child(2) {
	translate: 0 calc(-6*var(--padder));
	transition: .3s;
	@media (max-width: 1080px) {
		translate: 0 0;
	}
}

.logowrapper a {
	display: grid;
	grid-template-columns: 1fr auto;
}

.logowrapper a:nth-child(1) {
	translate: 0 -40px;
	width: fit-content;
	@media (max-width: 1080px) {
		translate: 0 0;
		align-content: center;
	}	
}

.logowrapper a:nth-child(2) {
	translate: 0 calc(2*var(--padder));
	transition: .3s;
	@media (max-width: 1080px) {
		translate: 0 calc(4*var(--padder));
	}	
}

.light .logowrapper a:nth-child(2) {
	translate: 0 calc(2*var(--padder));
	display: none;
	@media (max-width: 1080px) {
		display: block;
		translate: 0 calc(6*var(--padder));
	}
}

.light.up .logowrapper a:nth-child(2) {
	translate: 0 calc(-6*var(--padder));
	@media (max-width: 1080px) {
		translate: 0 0;
	}
}

.light.down .logowrapper a:nth-child(2) {
	translate: 0 calc(-2*var(--padder));
	@media (max-width: 1080px) {
		translate: 0 calc(-2*var(--padder));
	}
}

.logowrapper img {
	height: calc(1.5*var(--padder));
	display: block;
	border-radius: 0;
	transition: .3s;
	inset: 0;
	margin: auto 0;
	filter: var(--logo-filter)
}

.logowrapper a:nth-child(1) img {
	height: 30px;
	margin: 0;
	@media (max-width: 1080px) {
		height: calc(1*var(--padder));
	}	
}

.logowrapper a:nth-child(2) img {
	margin: auto;
	height: calc(2.75*var(--padder));
	max-height: 100px;
	@media (max-width: 1080px) {
		height: calc(3*var(--padder));
	}	
}

.light .logowrapper img {
	filter: invert(100%);
}

/* #endregion Header */

/* #region Menu */

/* Map Menu */

.mapmenu {
	margin-right: 20px;
	margin-top: -3px;
}

.mapmenu .image-title.visually-hidden {
	display: none;
}

.mapmenu ul {
	list-style: none;
	padding: 0;
}

@media (max-width: 810px) {
.mapmenu {
	margin-right: 50px;
	margin-top: 0px;
	z-index: 11;
}
}

.container.navbar {
	position: relative;
	width: 100%;
	display: grid;
	padding-block: 0;
	padding-inline: var(--padder);
	padding-top: calc(.5*var(--padder));
	transition: .3s;
	@media (max-width: 1080px) {
		padding-top: calc(.5*var(--padder));
	}
}

.up .container.navbar, .down .container.navbar  {
	padding-top: calc(.5*var(--padder));
}

.visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: auto;
  margin: 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

.burgermenu {
	width: fit-content;
	background: hsl(0 0% 0% / 0);
	display: flex;
  	gap: 1rem;

	> ul {
		padding: 0;
		margin: 0;
		list-style: none;
		display: flex;
		border-radius: 16px;
	}

	> ul li {
		position: relative;
		background: hsl(30 11 70 / .5);
		backdrop-filter: blur(2px);
		transition: .6s;
	}

	> ul li:hover, > ul li.active {
		border-radius: 16px;
	}

	> ul li:hover {
		background: transparent;
	}

	> ul li:first-child,
	> ul li:first-child:hover + li,
	> ul li:nth-child(2):hover + li,
	> ul li:nth-child(3):hover + li,
	> ul li:nth-child(4):hover + li,
	> ul li.active + li
	 {
		border-top-left-radius: 16px;
		border-bottom-left-radius: 16px;
	}	

	> ul li:last-child,
	> ul li:first-child:has(+ li:hover),
	> ul li:first-child:has(+ li.active),
	> ul li:nth-child(2):has(+ li:hover),
	> ul li:nth-child(3):has(+ li:hover),
	> ul li:nth-child(4):has(+ li:hover),
	> ul li:nth-child(2):has(+ li.active),
	> ul li:nth-child(3):has(+ li.active),
	> ul li:nth-child(4):has(+ li.active) {
		border-top-right-radius: 16px;
		border-bottom-right-radius: 16px;
	}

	a {
		display: block;
		padding: 0.875rem 1.5rem;
		font-size: 14px;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		text-decoration: none;
		color: var(--clr-schwarz);
		background: hsl(100 100 100 / 0);
		border-radius: 16px;
		background-image: radial-gradient(circle at center, var(--clr-schwarz) 50%, transparent 0%);
		background-position: 50% 50%;
		background-repeat: no-repeat;
		background-size: 0 0;	
		transition: background-size 0.3s, color 0.2s;	
	}	

	a:hover {
      background-size: 40em 40em;
      color: var(--clr-weiss);
	  transition: background-size 1.2s, color 0.4s;
	}

	.active a {
		/* background-color: var(--clr-schwarz); */
		color: var(--clr-schwarz);
		text-decoration: underline;
    	text-underline-offset: 5px;
	}

	.active a:hover {
		color: var(--clr-weiss);
	}	

	.search-menu .active a {
		text-decoration: none;
		background-color: var(--clr-beige-hell);
	}

}  

.light .burgermenu {
	a {
		background-image: radial-gradient(circle at center, var(--clr-weiss) 50%, transparent 0%);	
		color: var(--clr-weiss);
	}

	a:hover {
      color: var(--clr-schwarz);
	}	
}

.p-2.pt-0.search::before {
	content: 'L';
	font-family: amatiksymbols;
}

@media (max-width: 1080px) {

.container.navbar.active {
	padding-inline: var(--smallpad);
}	

.burgermenu > * {
	background: hsl(30 11 70 / .5);
	border-radius: 16px;
}	

.burgermenu ul {
	display: grid;
	list-style: none;
	gap: calc(1*var(--padder));
	/* height: 100svh; */
	grid-template-columns: subgrid;
	min-height: calc(50svh - 2.75*var(--padder));
	align-content: center;
}

	.burgermenu ul li:first-child {
		margin-right: 0;
	}

	.burgermenu ul li {
		margin-inline: 0;
		text-align: left;
		backdrop-filter: none;
	}

	.burgermenu ul li a {
		font-size: var(--font-menu-mobile);
		color: var(--clr-weiss);
		hyphens: auto;
		hyphenate-limit-chars: auto 3 4;
		padding-block: .5rem;
		padding-inline: var(--smallpad);
		background-image: none;
	}

	.burgermenu .active a {
			color: var(--clr-weiss);
		 }

	.burgermenu .footer-menu li a {
		font-size: var(--font-menu-mobile-small);
	}	

	.burgermenu > ul {
		gap: 0px;
	}	


	.burgermenu > .search-menu li {
	display: flex;
	min-height: fit-content;
	border: 0;
	background-color: transparent;
	}

.logowrapper {
	transition-delay: 0s;
}	

	.active .logowrapper {
	z-index: 1;
	filter: var(--logo-filter-inverted);
	}

	.light .active .logowrapper {
	filter: var(--logo-filter-inverted);
	}	

 .light .active .logowrapper a:nth-child(2), .active .logowrapper a:nth-child(2) {
	translate: 0 0;
}


}

/* Submenü */

.burgermenu .mod-menu__sub {
	display: none;
	border: clamp(0.3125rem, 0.275rem + 0.1875vw, 0.5rem) solid var(--clr-blau-hell);
	padding: calc(.75*var(--padder)) calc(.5*var(--padder));
	background-color: var(--clr-weiss);
	gap: calc(.25*var(--padder));
	margin-left: calc(-1.75*var(--padder));
	max-width: min-content;
	position: absolute;
	right: 0;
	top: 35px;
}

.mod-menu__toggle-sub {
	display: none;
}

body:has(.container.full.bg-gruen) .burgermenu .mod-menu__sub {
	border-color: var(--clr-gelb);
}

.burgermenu .parent:hover .mod-menu__sub {
	display: grid;
	list-style: none;
	a {
		color: var(--clr-schwarz);
	}
}

.burgermenu ul li:first-child .mod-menu__sub {
	margin-left: 2rem;
}

.burgermenu .mod-menu__sub li:first-child {
	margin-right: 0;
}

@media (max-width: 1080px) {

.burgermenu .parent:hover .mod-menu__sub {
	display: block;
}

	.burgermenu .mod-menu__sub {
		display: block;
		border: 0px solid var(--clr-gelb);
		position: relative;
		padding: calc(.25*var(--padder)) 0;
		background-color: transparent;
		gap: 0;
		margin-left: 0;
		max-width: 100%;
		width: 100%;
		padding-top: 0;
		margin-bottom: 0;
		top: 5px;
	}

	.burgermenu ul li:first-child .mod-menu__sub {
		margin-left: 0;
	}

	.burgermenu .mod-menu__sub li a {
		font-size: var(--font-menu);
	}
}

/* Burger */

.hamburger-menu {
	--x-width: calc(var(--hamburger-height) * 1.41421356237);

	display: none;
	flex-direction: column;
	gap: var(--hamburger-gap);
	width: max-content;
	position: fixed;
	right: var(--padder);
	top: calc(1.15*var(--padder));
	z-index: 2;
	cursor: pointer;
	transition: padding .3s;
}

.hamburger-menu {
	background: hsl(30 11 70 / .2);
	padding: 0.875rem 1.5rem;
	position: absolute;
	top: calc(.85*var(--padder));
	place-content: center;
	border-radius: 16px;
	line-height: 1;
	backdrop-filter: blur(10px);
}

.hamburger-menu:has(input:checked) {
	background: transparent;
	backdrop-filter: none;
	padding-right: 0;
}

.active .hamburger-menu {
	background: transparent;
	top: calc(.75*var(--padder));
	right: var(--smallpad);
}

.active .hamburger-menu::before,
.active .hamburger-menu::after,
.active .hamburger-menu input {
	background-color: var(--clr-weiss);
}

.hamburger-menu input {
	appearance: none;
	padding: 0;
	margin: 0;
	outline: none;
	pointer-events: none;
	display: none;
}

.hamburger-menu:has(input:checked)::before,
.hamburger-menu:has(input:checked)::after,
.hamburger-menu:has(input:checked) input {
	content: '';
	width: var(--bar-width);
	height: var(--bar-height);
	background-color: #fff;
	transform-origin: left center;
}



.hamburger-menu:has(input:checked) input {
	display: block;
}

.hamburger-menu:has(input:checked)::before {
	rotate: 45deg;
	width: var(--x-width);
	translate: 0 calc(var(--bar-height) / -2);
}

.hamburger-menu:has(input:checked)::after {
	rotate: -45deg;
	width: var(--x-width);
	translate: 0 calc(var(--bar-height) / 2);
}

.hamburger-menu input:checked {
	opacity: 0;
	width: 0;

}

.burger-name {
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: var(--letter-spacer);
}

.light .burger-name {
	color: var(--clr-weiss);
}

.hamburger-menu:has(input:checked) .burger-name {
	display: none;
}

@media (max-width: 1080px) {
	.hamburger-menu {
		display: flex;
	}

	.burgermenu {
		display: none;
	}

.active .burgermenu {
	display: grid;
	position: fixed;
	width: 100svw;
	height: calc(100svh + 3* var(--padder));
	z-index: 1;
	left: 0;
	top: 0;
	background: hsl(30 0 0 / .65);
	backdrop-filter: blur(10px);
	align-content: start;
	overflow: scroll;
	margin-top: 0;
	border-radius: 0;
	grid-template-columns: 1fr 1fr;
	padding: var(--padder);
	gap: var(--smallgap);
	padding-top: calc(4.5*var(--padder));
	padding-inline: var(--smallpad);
}

.burgermenu {
& > ul li {
	background: transparent;
}
}

}

/* #endregion Menu */

/* #region Main */

main {
	padding-top: calc(8*var(--padder));
	@media (max-width: 1080px) {
		padding-top: calc(9*var(--padder));
	}	
}

main:has(.container.full.hero.landingpage) {
	padding-top: 0;
}

/* #endregion Main */

/* #region Container */

.container.full {
	max-width: 100%;
	padding: 0;
}

.container, .blog-items {
	max-width: 2520px;
	padding-inline: calc(1*var(--padder));
	margin: auto;
	@media (max-width: 1080px) {
		padding-inline: calc(1*var(--padder));
	}
}

.container.full.vert-news {
	@media (max-width: 810px) {
	display: grid;		
	row-gap: calc(2*var(--padder));
	}
}

.container.medium {
	max-width: 1920px;;
}

.container.content {
	max-width: 1080px;
}

.container.small {
	max-width: 810px;
}

.container.full.bg-beige {
	padding-block: calc(2*var(--padder));
}

.container.newsflash, .container.personenswiper {
	padding-right: 0;
}

.container.full.newsslider, .container.full.vert-news {
	margin-bottom: var(--padder);
}

.container.full:has(+ .container.full), 
.container.full.contactbox {
	margin-bottom: calc(3*var(--padder));
}

.container.full:has(+ .container.full.subintro) {
	margin-bottom: var(--padder);
}

.container.full.subintro:has(+ .container.full) {
	margin-bottom: 0;
}

.stickybox .container.full:has(+ .container.full) {
	margin-bottom: calc(2*var(--padder));
}

.inhaltselement-text * {
	margin-bottom: 0;
}

.inhaltselement-text > * + * {
	margin-block-start: var(--text-flow, .75em);
}

/* #endregion Container */

/* #region Panorama Slider */

.panorama-slider {
	padding: 0 0;
	width: 100%;
	position: relative;
	overflow: hidden;
	/* max-width: 1150px; */
	margin: auto;
	padding-bottom: var(--padder);
	padding-block: var(--padder);
}

.panorama-slider .swiper {
  width: 100%;
  /* height: 280px; */
}
.panorama-slider .slide-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  border-radius: 8px;
  position: relative;
}

.panorama-slider .overlay {
	position: absolute;
	container-type: inline-size;
	top: 0;
	height: 100%;
	display: grid;
	padding: calc(.5*var(--padder));
	color: #000;
	width: 100%;
}

.panorama-slider .swiper-slide:has(img) .overlay {
	color: #fff;
	background-color: rgba(0 0 0 /.25);
	border-radius: var(--radius-big);
}

.panorama-slider .overlay .dachzeile {
	text-align: left;
	position: absolute;
	top: 3cqw;
  	left: 6cqw;
	font-size: 3.25cqw;
	text-transform: uppercase;
	letter-spacing: var(--letter-spacer);
	@media (max-width: 1480px) {
		font-size: 4.25cqw;
	}
}

.panorama-slider .overlay h3 {
	align-self: end;
	margin-bottom: 0;
	text-wrap: balance;
	font-size: 11cqw;
	line-height: 1;
	padding-bottom: 8cqw;
	font-family: var(--fontface-regular);
}

.panorama-slider .overlay .fusszeile {
	text-align: right;
	position: absolute;
	bottom: 3cqw;
	right: 6cqw;
	font-size: 7cqw;
}

.panorama-slider .overlay span {
	font-size: 60cqw;
	font-family: var(--fontface-regular);
	text-align: left;
	width: 100%;
	display: block;
	position: absolute;
	bottom: 8cqw;
}

.panorama-slider .swiper-pagination {
  bottom: -10px;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-color: #000;
  position: relative;
}

.panorama-slider .swiper-slide {
	aspect-ratio: 3/2.25;
	background-color: var(--clr-graublau);
	border-radius: var(--radius-big);
	user-select: none;
	will-change: transform;
	backface-visibility: hidden;
	outline: 1px solid transparent;
}

.swiper-pagination-bullet {
	width: 25px;
	height: 12px;
	display: inline-block;
	border-radius: 8px;
	background: var(--clr-beige-dunkel);
	opacity: var(--swiper-pagination-bullet-inactive-opacity, .5);
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
	transition: .3s !important;
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	margin: 0;
}

.swiper.swiper-panorama.swiper-3d {
	margin-block: calc(2*var(--padder));
}

.swiper-button-next::after, .swiper-button-prev::after {
	content: '>';
	font-family: amatiksymbols;
	color: var(--clr-antrazit);
	background-color: var(--clr-weiss);
	padding: 1rem;
	border-radius: 100px;
	margin-right: var(--padder);
	box-shadow: 5px 5px 15px var(--clr-beige-hell);
	aspect-ratio: 1/1;
	align-content: center;
	font-size: var(--font-p-big);
	transition: scale .1s;
}

.swiper-button-prev::after {
	content: '<';
	margin-left: calc(2*var(--padder));
}

.swiper-button-next:hover::after, .swiper-button-prev:hover::after {
	scale:1.05;
}

/* #region Panorama Slider */

/* #regio Lottie Animation */

.stage {
	display: grid;
	grid-template-areas: "stack";
	width: 100%;
	margin: 0;
	/* aspect-ratio: 16/9; */
	overflow: hidden;
	position: relative;
	height: 100%;
}

@media (max-width: 810px) {
	.stage {
		aspect-ratio: 4/3;
	}
}

.hero .stage {
	min-height: 100svh;
}

    .stage img{
      grid-area: stack;
      width: 100%;
      height: 100%;
      object-fit: cover;
      display:block;
    }

    .stage .grid{
      grid-area: stack;
      z-index: 1;
      position: absolute;
      inset: 0;
      display: grid;
      gap: var(--gap);
      user-select: none;
      pointer-events: auto;
	  justify-content: start;
  	  align-content: start;
    }

    .stage .tile{
		width: 100%;
		height: 100%;
		display:flex;
		align-items:center;
		justify-content:center;
		border-radius: var(--radius);
		background: transparent;
		overflow:hidden;
    }

.stage .lottie {
	width: 100%;
	height: 100%;
	opacity: .6;
}

    .stage .lottie svg{ pointer-events: none; }
    canvas{ display:block; }

/* #endregion Lottie Animation */

/* #region Grid-Systeme */

.grid {
	display: grid;
	gap: calc(1*var(--padder));
}

.grid.smallgap, .blog-items {
	gap: calc(1*var(--gapper));
}

.grid.g-1 {
	grid-template-columns: 1fr;
	padding-inline: 0;
	row-gap: calc(2*var(--padder));
}

.g-1 > div > .inhaltselement-bild, 
.g-1 > div > .caption, 
.g-1 > div > .zitat-element {
	padding-inline: calc(2*var(--padder));
	@media (max-width: 1080px) {
		padding-inline: calc(1*var(--padder));
	}
}

.g-1 > div > .inhaltselement-text {
	padding-inline: calc(2*var(--padder));
	max-width: 120ch;
	margin-inline: auto;
	@media (max-width: 1080px) {
		padding-inline: calc(1*var(--padder));
	}
}

.button-element {
	display: grid;
	padding-top: calc(.5*var(--padder));
}

.button-element.align-right {
	justify-content: right;
}

.inhaltselement-text:has(+ .inhaltselement-bild), .inhaltselement-bild:has(+ .inhaltselement-text), .inhaltselement-text:has(+ .inhaltselement-video)  {
	padding-bottom: var(--padder);
}

.inhaltselement-text:has(+ .zitat-element), 
.inhaltselement-bild:has(+ .zitat-element),
.inhaltselement-video:has(+ .zitat-element),
.caption:has(+ .zitat-element) {
	padding-bottom: calc(2*var(--padder));
}

.stickybox .g-1 > div > .inhaltselement-text,
.stickybox .g-1 > div > .inhaltselement-bild, 
.stickybox .g-1 > div > .zitat-element {
	padding-inline: 0;
}

.g-1 .inhaltselement-bild img {
	width: 100%;
}

.grid.g-2, .container.grid.g-2.angebot, .container.leistungsgrid .grid.g-2 {
	grid-template-columns: repeat(2, 1fr);
}

.container.leistungsgrid .grid.g-2 .cardimage {
    overflow: hidden;
}

.container.grid.g-2.angebot { 
	gap: var(--smallgap);
	max-width: 1920px;
}

.grid.g-2.reverse div:first-child {
	order: 2;
}

.grid.g-21 {
	grid-template-columns: 1fr minmax(400px, .5fr);
	position: relative;
}

.grid.g-21.stickybox {
	align-items: normal;
	grid-template-columns: 2fr minmax(350px, .25fr);
	padding-bottom: calc(2*var(--padder));
}

.grid.g-21.stickybox .grid.g-2  {
	/* grid-template-columns: minmax(420px, .5fr) 2fr; */
	padding-inline: 0;
}

.grid.g-21.stickybox .grid.g-2:first-child {
	padding-top: 0;
}

.grid.g-21.stickybox .grid.g-21, .grid.g-21.stickybox .grid.g-12 {
	align-items: normal;
	padding: 0;
}

@media (max-width: 1380px) {
	.grid.g-21.stickybox {
		grid-template-columns: 1fr;
	}

	.grid.g-21.stickybox .grid.g-2  {
		/* grid-template-columns: minmax(420px, .5fr) 2fr; */
		grid-template-columns: repeat(2, 1fr);
	}	
}

@media (max-width: 1080px) {
	.grid.g-21.stickybox .grid.g-2, .grid.g-21.stickybox .grid.g-21, .grid.g-21.stickybox .grid.g-12  {
		grid-template-columns: 1fr;
	}	
}

.grid.g-12 {
	grid-template-columns: minmax(400px, .5fr) 1fr;
}

.grid.g-3 {
	grid-template-columns: repeat( auto-fill, minmax(min(340px, 100%), 1fr));
}

.grid.g-3.angebot {
	grid-template-columns: repeat( auto-fit, minmax(min(340px, 100%), 1fr));
}

.grid.g-4, .blog-items {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax(min(480px, 100%), 1fr));
	row-gap: 2em;
	margin-block-end: var(--padder);
	@media (max-width: 2040px) {
		grid-template-columns: repeat( auto-fill, minmax(min(390px, 100%), 1fr));
	}
	@media (max-width: 840px) {
		grid-template-columns: repeat( auto-fill, minmax(min(260px, 100%), 1fr));
	}	
}

.blog-items.columns-3 {
	max-width: 1380px;
}

.container.personen.grid.g-4 {
	gap: var(--smallgap);
	grid-template-columns: repeat( auto-fill, minmax(min(340px, 100%), 1fr));
	@media (max-width: 2180px) {
	grid-template-columns: repeat( auto-fill, minmax(min(280px, 100%), 1fr));
	}
	@media (max-width: 630px) {
		grid-template-columns: repeat( auto-fill, minmax(min(190px, 100%), 1fr));
	}	
	@media (max-width: 440px) {
		grid-template-columns: repeat( auto-fill, minmax(min(130px, 100%), 1fr));
	}	
}

.container.testimonials.grid.g-4 {
	gap: 8px;
}

.grid.g-14 {
	grid-template-columns: 270px 1fr;
	padding-top: 0;
}

footer .grid.g-4 {
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}

@media (max-width: 1080px) {
	.grid.g-14 {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 810px) {
	.grid.g-2, .grid.g-3, .grid.g-4, .grid.g-3.angebot, .grid.g-12 {
		grid-template-columns: 1fr;
	}

	.grid.g-21, .card.contact.grid.g-21 {
		grid-template-columns: 1fr;
		align-items: center;
	}

	.grid.g-2.reverse div:first-child {
		order: -1;
	}

}

/* #endregion Grid-Systeme */

/* #region Filter */

/* Filtermodul auf der Finder-Seite erst zeigen, wenn Search-Results gerendert wurden */
.moduletable.filtermod {
  display: none;
  min-width: 210px;
}

body:has(.com-finder.finder #search-results) .moduletable.filtermod {
  display: block;
}

.container.grid.g-14 .btn.inv.filter { display: none; }

@media (max-width: 1080px) {
	body:has(.com-finder.finder #search-results) .container.grid.g-14:has(.jfilters-filter-list__item) .btn.inv.filter { 
		display: inline-flex; 
	}
}

.btn.inv.filter.active {
	margin-bottom: var(--padder);
}

.filterswrapper {
	display: grid;
	position: sticky;
	top: var(--padder);
	row-gap: calc(.5*var(--padder));
		@media (max-width: 1080px) {
		display: none;
	}
}

.filterswrapper.active {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax(min(300px, 100%), 1fr));
}


.jfilters-filter-container {
	padding-top: 0;
}

.jfilters-filter-header__toggle:focus, .jfilters-filter-header__toggle:hover {
	background-color: transparent;
}

.jfilters-filter-list {
	font-size: var(--font-p-small);
	margin-left: 0;
}

.jfilters-filter-list__item {
	content: '';
	padding-left: 0;
	align-items: center;
	display: grid;
	grid-template-columns: auto auto 1fr;
	gap: .25rem;
}

.jfilters-filter-list__item::marker {
	content: '';
}

.jfilters-item-link--checkbox::before {
	border-radius: 0;
}

.jfilters-item-link--dummy-input::before {
	scale: 1;
	border-radius: 6px;
}

.jfilters-item-link--selected.jfilters-item-link--checkbox .jfilters-item__label-text::before {
	scale: .6;
	border: solid #000;
	border-width: 0 8px 5px 0;
}

.jfilters-item-link--checkbox:hover .jfilters-item__label-text::before, .jfilters-item-link--checkbox:focus .jfilters-item__label-text::before {
	scale: .6;
}

.jfilters-item-link--selected.jfilters-item-link--dummy-input::before {
	border-color: var(--clr-schwarz);
}

.jfilters-filter-header__toggle {
	display: grid;
	grid-template-columns: auto 1fr;
	font-weight: normal;
}

.moduletable.filtermod .headline {
	display: none;
}

.moduletable.filtermod:has(.jfilters-filter-container) .headline {
	display: block;
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item::before {
	content: '';
	background-image: url(../images/marker-foerderprojekte.svg);
	width: 20px;
	height: 20px;
	display: inline-block;
	background-size: cover;
	margin-right: .25rem;
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(1)::before {
	background-image: url(../images/marker-foerderprojekte.svg);
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(2)::before {
	background-image: url(../images/marker-ki-dienstleister.svg);
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(3)::before {
	background-image: url(../images/marker-partner.svg);
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(4)::before {
	background-image: url(../images/marker-rechenzentrum.svg);
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(5)::before {
	background-image: url(../images/marker-wirtschaft.svg);
}

#jfilters-filter-list-110-22 .jfilters-filter-list__item:nth-child(6)::before {
	background-image: url(../images/marker-wissenschaft.svg);
}

/* #endregion Filter */

.com-finder.finder {
	min-height: 50svh;
}

.finder-map-toolbar {
	margin-bottom: calc(.5*var(--padder));
}

body:has(.finder-map-wrapper.is-auto-hidden) #finder-map-toggle {
  display: none;
}

body:not(:has(.finder-map-wrapper)) #finder-map-toggle {
  display: none;
}

#finder-map-toggle[aria-expanded="<?php echo $mapBtnExpanded; ?>"] {
	display: none;
}

.com-finder > * + *, .com-finder__results > * + * {
	margin-top: 0;
}

/* Suche Modul */

/* .moduletable + .moduletable {
	margin-top: var(--padder);
} */

.moduletable .headline {
	margin-bottom: 0;
	font-size: var(--font-p-big);
}

.mod-finder__search .btn.btn-primary {
	width: 44px;
	text-indent: -999999px;
	padding: 0;
	height: 100%;
	display: inline-block;
	border-radius: 8px;
	border: 1px solid;
	background-color: var(--clr-antrazit);
	margin-left: .5rem;
	margin-right: 0 !important;
	background-image: none;
}

.mod-finder__search .btn.btn-primary:hover {
	background-color: var(--clr-weiss);
}

.mod-finder__search .icon-search.icon-white::before {
	font-family: amatiksymbols;
	content: 'L';
	color: var(--clr-weiss);
	position: absolute;
	width: 44px;
	height: 44px;
	display: block;
	text-indent: 0;
	top: 0;
	align-content: center;
}

.mod-finder__search .btn.btn-primary:hover .icon-search.icon-white::before {
	color: var(--clr-antrazit);
}

.mod-finder__search .btn.btn-primary:has(.icon-search)::after {
	display: none;
}

/* Suche */

.js-finder-searchform {
	display: none;
}

/* Pagination */

.pagination {
	display: flex;
	gap: 1.5rem;
	padding: var(--padder);
	list-style: none;
	justify-content: center;
	font-size: var(--font-p);
}

.active.page-item a {
	text-decoration: none;
}

.search-pages-counter {
	text-align: center;
	padding: var(--padder);
}

/* Eingabefelder Kontaktformular */

.cf-heading {
	font-size: var(--font-p-hero);
}

.mod-finder.js-finder-searchform.form-search {
	display: block;
	position: relative;
}

.mod-finder__search.input-group {
	height: 48px;
}

.cf-control-group {
	position: relative;
	margin-bottom: 2rem;
	width: 100%;
	max-width: 320px;
}

.cf-control-group input, .cf-control-group textarea, .js-finder-search-query.form-control {
	width: 100%;
	padding: .75em .5em;
	border: 1px solid var(--clr-antrazit);
	border-radius: var(--radius-small);
	font-size: 16px;
	outline: none;
	transition: 0.2s;
}

.cf-control-group label {
	position: absolute;
	top: 50%;
	left: 1em;
	color: var(--clr-antrazit);
	background: transparent;
	transform: translateY(-50%);
	cursor: text;
	transition: all 0.1s ease-out;
}

.mod-finder.js-finder-searchform.form-search label {
	position: absolute;
	/* top: 50%; */
	left: 1.25em;
	color: var(--clr-antrazit);
	background: var(--clr-weiss);
	transform: translateY(-50%);
	cursor: text;
	transition: all 0.1s ease-out;
	font-size: .8em;
	z-index: 1;
	padding-inline: .8em;
}

.cf-control-group:has(textarea) label {
	top: 1.5rem;
}

.cf-control-group:has(input:focus) .cf-control-label label, 
.cf-control-group:has(input:not(:placeholder-shown)) label,
.cf-control-group:has(textarea:focus) .cf-control-label label, 
.cf-control-group:has(textarea:not(:placeholder-shown)) label {
	padding: 0 0.5em;
	top: 0;
	left: 1em;
	font-size: 0.8em;
	font-weight: 500;
	background-color: var(--clr-weiss);
}

input::placeholder, textarea::placeholder {
	color: transparent;
}

input:not(:placeholder-shown),
textarea:not(:placeholder-shown) {
	color: var(--clr-antrazit);
}

/* Übersichten Cards */

.blog-item {
	transition: .3s;
}

.blog-item:hover {
	scale: 1.01;
}

.blog-item:hover + .blog-item, .blog-item:has(+ .blog-item:hover) {
	scale: .99;
}

.card {
	text-decoration: none;
	display: grid;
	height: 100%;
	border: none;
	border-radius: var(--radius-big);
	align-content: baseline;
  	grid-template-rows: auto 1fr;
	position: relative;
}

.cardimage {
	position: relative;
}

.mapbadge {
	position: absolute;
	bottom: 1rem;
	left: 1rem;
	padding: .5rem;
	background-color: var(--clr-weiss);
	border-radius: 50%;
}

.blog-items .cardimage .mapbadge img {
	border-radius: 0;
	width: 20px;
	height: 20px;
	display: block;
	object-fit: cover;
}

.grid.g-21.card.full, .card.contact.grid.g-21 {
	grid-template-rows: auto;
}

.grid.card.person {
	aspect-ratio: 29/43;
	background-size: cover;
	background-position: center;
	display: grid;
	grid-template-rows: 2fr 1fr;
}

.card.testimonial {
	background-color: var(--clr-beige-hell);
	padding: 1.5rem 1.5rem;
	align-content: start;
	height: fit-content;
	grid-template-rows: 1fr;
	container-type: inline-size;
	max-width: 600px;
	margin: auto;
}

.card.testimonial blockquote p {
	font-size: var(--font-testi-head);
	text-align: left;
	font-family: var(--fontface-headline);
}

.card.testimonial blockquote footer {
	text-align: left;
	padding-top: var(--padder);
}

.card.testimonial cite {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1rem;
}

.card.testimonial .citeimg {
	width: clamp(5rem, 2.9167rem + 8.8889cqw, 6.25rem);
	border-radius: var(--radius-small);
}

.card.testimonial .citeimg img {
	border-radius: var(--radius-small);
}

.card.testimonial .citetext {
	text-align: left;
	align-content: end;
}

.container.vert-news .card {
	@media (max-width: 810px) {
	background-color: var(--clr-weiss);
	}
}

.container.leistungsgrid .card {
	@media (max-width: 810px) {
		gap: var(--smallgap);
	}
}

.card.offer, .leistungsgrid .cardtext {
	background-color: var(--clr-beige-hell);
	position: relative;
}

.leistungsgrid .cardtext {
	@media (max-width: 810px) {
	}
}

.leistungsgrid.sonderleistung .cardtext {
	background-color: var(--clr-beige-dunkel);
}

.grid.card.person .cardtext {
	background-color: hsl(30 11 70 / .2);
	backdrop-filter: blur(10px);
	color: var(--clr-immerweiss);
	height: max-content;
	min-height: 100%;
	align-self: end;
	padding-inline: 1rem;
	padding-bottom: calc(1*var(--padder));
	@media (max-width: 580px) {
	padding-inline: .5rem;
	}
	@media (prefers-color-scheme: dark) {
		color: var(--clr-schwarz);
	}
}

.grid.card.person .cardtext h3 {
	font-size: var(--font-p);
	font-family: var(--fontface-headline);
	hyphens: none;
	@media (max-width: 580px) {
	font-size: var(--font-p-small);
	}
}

.grid.card.person .cardtext p {
	font-size: var(--font-p-small);
	@media (max-width: 580px) {
		font-size: 12px;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		overflow: hidden;
		-webkit-box-orient: vertical;
		padding-bottom: 0;		
	}
}

.date {
	margin-bottom: .5rem;
	display: block;
	font-size: var(--font-p-mobile-small);
}

.card.offer .dachzeile {
	font-family: var(--fontface-regular);
	position: initial;
	background: transparent;
	text-transform: none;
	letter-spacing: 0;
	padding: 0;
	margin-bottom: calc(.25*var(--font-h2));
}

.card.contact .dachzeile {
	position: relative;
	background: transparent;
	left: auto;
	top: auto;
	padding: 0;
	margin-bottom: 1rem;
}

.card.offer p, .leistungsgrid .cardtext p, .single-news .cardtext p {
	font-size: var(--font-p-big);
}

@media (max-width: 810px) {
	.card.offer p, .leistungsgrid .cardtext p {
		font-size: var(--font-p-mobile-small);
	}
}

.single-news .cardtext p {
	padding-bottom: calc(.75*var(--padder));
}

.angebot .card.offer:first-child {
	background-color: transparent;
}

.angebot .card.offer:first-child .cardtext h3 {
	font-size: var(--font-h1);
	line-height: .75;
}

.cardimage img {
	width: 100%;
	aspect-ratio: 16/9;
}

.grid.g-4 .cardimage img, .grid.g-3 .cardimage img, .blog-items .cardimage img, .swiper .cardimage img {
	width: 100%;
	object-fit: cover;
	height: 100%;
	aspect-ratio: 4/3;
}

.contact .cardimage img {
	aspect-ratio: auto;
	border-radius: 0;
	object-fit: contain;
	object-position: center;
	margin: auto;
	max-width: 400px;
}

.cardtext {
	padding: calc(.55*var(--padder));
	border-radius: var(--radius-big);
	padding-top: calc(.5*var(--padder));
	padding-left: 0;
}

.cardtext.stack {
	display: flex;
	flex-direction: column;
	gap: var(--stack-gap, 0em);
	padding-top: 1em;
	container-type: inline-size;
}

.cardtext.stack > * + * {
	margin-block-start: .5em;
}

.cardtext.stack .dachzeile {
	font-size: var(--font-card-dach);
}

.cardtext.stack .date {
	margin-bottom: 0;
	font-size: var(--font-card-date);
}

.cardtext.stack p {
	font-size: var(--font-card-p);
}

.cardtext.stack h3 {
	margin-top: .5em;
	font-size: var(--font-card-h3);
	line-height: 1.2;
}

.cardtext.stack .date + h3 {
	margin-block-start: .25em;
}

.cardtext.stack .btn {
	margin-block-start: auto;
}

.contact .cardtext {
	padding: var(--padder);
}

.cardtext h3 {
	hyphens: auto;
	font-family: var(--fontface-bold);
	font-size: var(--font-p-big);
}

.cardtext p {
	font-size: var(--font-p-small);
	display: -webkit-box;
	-webkit-line-clamp: 6;
	overflow: hidden;
	-webkit-box-orient: vertical;
	padding-bottom: 0;
}

.cardtext p:has(+ .btn) {
	margin-bottom: 1em;
}

.contact .cardtext p {
	display: block;
	font-size: var(--font-p-big);
	padding-bottom: calc(.5*var(--padder));
}

.card.offer .cardtext, .leistungsgrid .cardtext {
	transition: background-image .3s;
	padding: var(--padder);
	/* aspect-ratio: 16/9; */
	display: grid;
}

/* .card.offer .cardtext:has(.dachzeile) {
	translate: 0 calc(-1.5*var(--padder));
} */

.offer .cardtext h3, .leistungsgrid .cardtext h3 {
	hyphens: auto;
	/* background-image: url(../images/pfeil.svg); */
	position: relative;
	background-repeat: no-repeat;
	background-position: center right;
	background-size: calc(1.5*var(--padder));
	padding-right: calc(2*var(--padder));
	font-size: var(--font-h2);
	font-family: var(--fontface-headline);
	transition: .3s;
	margin-bottom: 5cqw;
}

.offer .cardtext h3::after, .leistungsgrid .cardtext h3::after {
	content: '>';
	position: absolute;
	right: 0;
	top: 0;
	font-family: amatiksymbols;
	transition: .3s;
}

.offer .cardtext:hover h3::after, .leistungsgrid .cardtext:hover h3::after {
	scale: 1.25;
}

@media (max-width: 810px) {
	.offer .cardtext h3, .leistungsgrid .cardtext h3 {
		background-image: none;
		padding-right: 0;
		font-size: var(--font-h2-smallcard);
	}
}

@media (max-width: 810px) {
	.angebot .card.offer .cardtext, .leistungsgrid .cardtext {
		aspect-ratio: auto;
	}
}

@media (max-width: 480px) {
	.angebot .card.offer .cardtext, .leistungsgrid .cardtext {
		padding-inline: .75rem;
	}
}

.offer .cardtext:hover h3, .leistungsgrid .cardtext:hover h3 {
	background-size: calc(1.75*var(--padder));
}

.leistungsgrid.sonderleistung .cardtext h3 {
	font-family: var(--fontface-bold);
}

.full .cardtext h2 {
	hyphens: auto;
	font-size: var(--font-h2);
	font-family: var(--fontface-headline);
	line-height: 1.1;
}

.offer:first-child .cardtext h3 {
	background-image: none;
}

.offer:first-child .cardtext h3:after {
	content: '';
}

.angebot .cardtext p {
	align-self: end;
	text-wrap: balance;
}

.contact .cardimage {
	align-content: center;
}

.vert-news .cardimage {
	margin-bottom: 0;
}

.vert-news .dachzeile {
	position: relative;
	background-color: var(--clr-schwarz);
	width: max-content;
	margin: auto;
	margin-bottom: calc(.75*var(--padder));
	color: var(--clr-weiss);
}

.vert-news .cardtext {
	background: var(--clr-weiss);
	text-align: center;
	align-content: center;
	position: relative;
	padding: var(--padder);
	padding-top: 0;
}

@media (max-width: 810px) {
	.vert-news .cardtext {
		background: rgba(255 255 255 /.5);
		margin-top: calc(-2*var(--padder));
		padding-top: calc(.5*var(--padder));
		backdrop-filter: blur(10px);
		padding-bottom: calc(1.5*var(--padder));
	}
}

.vert-news .cardtext p {
	margin: auto;
}

.white .cardtext {
	background: var(--clr-weiss);
}

.hero.subpage .cardtext {
	background: transparent;
	height: 100%;
	border: 1px solid var(--clr-schwarz);
	align-content: center;
}

@media (max-width: 810px) {
	.single-news .cardtext {
		padding-inline: 0;
	}
}

/* #region Module */

/* #region Hero-Modul */

.container.full.hero {
	margin-bottom: calc(2*var(--padder));
}

.hero .grid.g-2 {
	min-height: 100svh;
	gap: 0;
}

.hero .grid.g-stack > * {
	grid-area: 1/1;
}

.hero .heroimage {
	background-size: cover;
}

.hero .claimwrapper {
	position: relative;
}

.hero .heroclaim {
	padding: calc(2*var(--padder));
	background-color: transparent;
	color: #fff;
	padding-bottom: calc(2*var(--padder));
	padding-top: calc(2*var(--padder));
	position: absolute;
	bottom: 0;
	width: 100%;
	max-width: 100%;
}

.hero .heroclaim .herologo {
	margin: auto;
	margin-bottom: var(--padder);
	width: calc(2.5*var(--padder));
	filter: invert(100%);
	@media (max-width: 1080px) {
		display: none;
	}
}

.heroclaim h1, .heroclaim h2 {
	font-size: var(--font-h1-hero);
	max-width: 15ch;
	text-align: center;
	margin-inline: auto;
	margin-bottom: 0;
	line-height: 1;
}

.hero .heroclaim .dachzeile {
	font-size: var(--font-p-small);
	text-transform: uppercase;
	font-family: var(--fontface-regular);
	background: transparent;
	position: relative;
	text-align: center;
	letter-spacing: 0.1em;
	padding-inline: calc(2*var(--padder));
	display: block;
	margin-bottom: 1rem;
}

.container.full.hero.landingpage {
	height: 100svh;	
	max-height: 100svh;
	overflow: hidden;
	margin-bottom: var(--padder);
}

.container.full.hero.subpage.landing {
	min-height: 0;
}

.container.full.hero:has(.moduletable.searchbar.center) h1 {
	margin-bottom: 0;
}

.moduletable.searchbar.center {
	max-width: fit-content;
	margin: auto;
}

.fullstage {
	height: calc(100% - 3 * var(--padder));
	overflow: hidden;
	position: relative;
}

.herocall {
	display: grid;
}

.herocall .btn {
	justify-self: center;
}

@media (max-width: 1080px) {
	.fullstage {
		height: calc(100% - 5 * var(--padder));

	}
}

.sponsorlogo {
	padding: calc(1*var(--padder));
	padding-top: calc(.5*var(--padder));
	background-color: var(--clr-immerweiss);
}

.sponsorlogo img {
	width: clamp(15rem, 15.75rem + 8.25vw, 30.75rem);
	border-radius: 0;
	margin: auto;
	/* filter: var(--filter-clr-grey); */
}

.herocall h2 {
	max-width: 48ch;
	text-align: center;
	margin: auto;
	margin-bottom: calc(1.5*var(--padder));
	font-family: var(--fontface-regular);
	font-size: var(--font-h2-hero);
}

.herocall .btn.arrow {
	margin: auto;
	margin-top: var(--padder);
}

.grid.g-3.angebot {
	padding-top: calc(2*var(--padder));
}

.hero .grid.g-21 {
	align-items: start;
	padding-top: 0;
}

.hero .grid.g-21 h1 {
	font-size: var(--font-h2);
}

.hero.subpage .stage {
	min-height: 0;
}

.hero.subpage.landing .stage {
	margin-bottom: calc(2*var(--padder));
}


.hero.subpage .stage img {
	aspect-ratio: 16/9;
}

.container.subhero {
	text-align: center;
	padding-block: 0;
}

.subhero .dachzeile {
	position: relative;
	display: block;
	font-size: var(--font-p-small);
	background-color: transparent;
	margin-bottom: calc(.5*var(--padder));
}

.subhero h1 {
	line-height: 1.01;
	letter-spacing: -.02em;
	margin: auto;
}

.subhero p {
	margin: auto;
	font-size: var(--font-p-hero);
	max-width: 50ch;
	margin-block: var(--padder);
}

@media (max-width: 1080px) {
	.hero .heroclaim {
		padding: calc(1*var(--padder));
		padding-bottom: calc(3*var(--padder));
	}
}

@media (max-width: 810px) {
	.container.full.hero {
		min-height: 75svh;
	}

	.hero .grid.g-2 {
		min-height: 75svh;
	}

	.hero .heroimage {
		width: 100vw;
		aspect-ratio: 1/1;
	}

	.hero .heroclaim .btn {
		margin-bottom: var(--padder);
	}
}

/* #endregion Hero-Modul */

/* #region Hero Slider */

.swiper.start {
	width: 100%;
	z-index: 0;
	aspect-ratio: 16/9;
}

.swiper-slide img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

/* #endregion Hero Slider */

/* #region Introtext Modul */

.intro .introtext {
	margin: auto;
	text-align: center;
}

.intro .introtext .date {
	padding-bottom: calc(.75*var(--padder));
	display: block;
}

.intro .introtext h2, .intro .introtext h1, .moduleintro {
	font-size: var(--font-h1);
	line-height: 1;
	max-width: 18ch;
	margin-inline: auto;
	text-align: center;
	hyphens: auto;
	hyphenate-limit-chars: auto 8;
}

.intro .introtext p {
	font-size: var(--font-p-big);
	padding-bottom: 0;
	margin: auto;
	max-width: 60ch;
}

.intro .introtext:has(.btn) p {
	padding-bottom: var(--padder);
}

.intro .introtext .zusatzinfo {
	padding-bottom: var(--padder);
	padding-top: calc(.5*var(--padder));
}

/* #endregion Introtext Modul */

/* #region Infobox Modul */

.infobox {
	width: 100%;
	height: min-content;
	position: sticky;
	top: calc(2*var(--padder));
	background-color: var(--clr-beige-dunkel);
	padding: var(--padder);
	border-radius: var(--radius-big);
}

.infobox h3 {
	font-size: var(--font-p-big);
	font-family: var(--fontface-bold);
	margin-bottom: .5em;
}

.infobox p {
	font-size: var(--font-p-small);
}

@media (max-width: 1080px) {
.jpb-row > .jpb-row-column:has(+ .jpb-row-column > .jpb-column.infobox) {
	max-width: 100% !important;
	flex-basis: 100% !important;
}

.jpb-row-column:is( + .jpb-row-column:has(.infobox)) {
	background-color: red;
}

.jpb-row-column:has(.infobox) {
	margin-bottom: calc(2*var(--padder));
	max-width: 100% !important;
	flex-basis: 100% !important;
	order: -1;
}




	.infobox {
		margin-inline: auto;
		max-width: 100%;
		margin-top: 0;
		order: -1;
		position: relative;
		top: 0;
	}
}

/* #endregion Infobox Modul */

/* #region Image und Video Modul */

.bigimage {
	position: relative;
}

.bigimage img {
	width: 100%;
	height: auto;
}

.bigimage .product_of_month {
	top: auto;
	margin-top: calc(.5*var(--padder));
	right: calc(.5*var(--padder));
}

.caption {
	margin-top: 1em;
	max-width: 85ch;
}

.caption:has(p:empty) {
	display: none;
}

.source {
	font-family: var(--fontface-headline);
}

.bigimage .caption {
	margin-top: 1.5em;
}

.caption p {
	font-size: var(--font-p-small);
}

.caption p strong {
	font-family: var(--fontface-bold);
}

/* #region Image und Video Modul */

/* #region Akkordeon */

.container.accordionwrapper {
	margin: auto;
	max-width: 2540px;
}

.detailswrapper.grid.g-2 {
	display: grid-lanes;
}

details {
	position: relative;
	display: block;
	clear: both;
	border-radius: var(--radius-small);
	transition: .3s;
}

summary {
	position: relative;
	cursor: pointer;
	font-size: var(--font-p);
	padding-block: calc(.5*var(--padder));
}

[open] summary {
	font-family: var(--fontface-bold);
}

.details__summary {
	background-color: var(--clr-beige-hell);
	padding: 2rem 1rem;
	border-radius: var(--radius-small);
}

.details__content {
	margin-top: .5rem;
	padding: 0 1rem;
	padding-bottom: calc(.5*var(--padder));
}

details::details-content {
	display: block;
	margin-inline: 0;
	block-size: 0;
	overflow: hidden;
	transition-property: block-size, content-visibility;
	transition-duration: 0.5s;
	transition-behavior: allow-discrete;
}

details[open] {
	background-color: var(--clr-beige-dunkel);
}

details[open]::details-content {
	/* Fallback for browsers that don't support calc-size() function */
	block-size: auto;
	
	/* calc-size() function allows transition to height: auto; */
	block-size: calc-size(auto, size);
}

.details__content .grid.g-2 {
	gap: calc(.75*var(--gapper));
	padding-bottom: var(--padder);
}

.detailswrapper p {
	font-size: var(--font-p-small);
}

/* List Item ::marker supports only some CSS properties, so we're using ::before pseudo-element instead */
summary::marker {
	content: '';
	content: none;
}

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

details > summary:first-of-type {
	list-style-type: none;
}

details summary::before {
	/* content: ''; */
	position: absolute;
	font-size: var(--font-p-big);
	top: 0;
	right: 0;
	left: auto;
	place-content: center;
	display: grid;
	width: 50px;
	height: 100%;
	font-family: var(--fontface-regular);
	/* background-image: url(../images/pfeil.svg); */
	background-size: 30px;
	background-repeat: no-repeat;
	background-position: center;
	transition: .3s;
	content: '>';
  	font-family: amatiksymbols;

}

details[open] summary::before {
	content: '>';
	rotate: 90deg;
}

/* #endregion Akkordeon */

/* #region Headline Artikel Modul */

.intro.headline h1 {
	font-family: var(--fontface-bold);
	font-size: var(--font-h1-big);
	line-height: 1;
	margin-bottom: .25em;
}

/* #endregion Headline Artikel Modul */


/* #region Zitat Modul */

blockquote {
	margin: auto;
	max-width: 130ch;
}

blockquote p {
	font-size: var(--font-p-cite);
	text-align: center;
}

blockquote p::before {
	content: '„';
}

blockquote p::after {
	content: '“';
}

blockquote footer {
	text-align: center;
}

blockquote cite {
	font-size: var(--font-menu);
	font-style: normal;
}

/* #endregion Zitat Modul */


/* #region Übersicht */

.blog .introwrapper {
	color: var(--clr-schwarz);
	text-decoration: none;
}

.blog .introimg, .grid.g-3 .introimg, .grid.g-4 .introimg, .swiper .introimg  {
	margin-bottom: .5em;
	position: relative;
}

.blog .introwrapper h2 {
	font-size: var(--font-p);
	margin-bottom: .25em;
}

/* #endregion Übersicht */


/* #region Slideshow Content */

.swiper.contentpages .swiper-slide img, .swiper.contentpages iframe, .swiper.contentpages video {
	aspect-ratio: 16/9;
	width: 100%;
	height: auto;
	object-fit: cover;
}

/* #endregion Slideshow Content */

/* #endregion Module */

/* #region Content */

.card .dachzeile {
	display: block;
	font-family: var(--fontface-regular);
	letter-spacing: 0;
	position: absolute;
	top: 1rem;
	left: 1rem;
	background-color: var(--clr-weiss);
	padding: 0.45em 1em;
	border-radius: var(--radius-big);
	font-size: var(--font-h4);
}

.leistungsgrid .card .dachzeile {
	position: relative;
	top: 0;
	left: 0;
	padding: 0;
	background: transparent;
	align-self: end;
}

.vert-news .card .dachzeile {
	background-color: var(--clr-schwarz);
	position: relative;
	left: auto;
	top: auto;
	margin-top: calc(.5*var(--padder));
}

.dachzeile.header {
	position: relative;
	padding: 0;
	top: 0;
	left: 0;
	background-color: transparent;
	margin-bottom: calc(.25*var(--font-h2));
	display: block;
}

.content-text h2, .content-text p strong, .content-text h3 {
	font-family: var(--fontface-bold);
}

.content-text h2 {
	font-size: var(--font-h2-textblock);
	hyphens: auto;
	hyphenate-limit-chars: auto 9;
}

.content-text h3 {
	font-size: var(--font-p);
}

.content-text p + h2, .content-text p + h3 {
	margin-top: var(--padder);
}

/* #endregion Content */

/* Newsletter Modal */

dialog {
	align-self: center;
	margin: auto;
	position: fixed;
	padding: var(--padder);
	border-radius: var(--radius-big);
	border: 0;	
}

Element {
	position: absolute;
	top: calc(.25*var(--padder));
	right: calc(.25*var(--padder));
	border: none;
	background: transparent;
	font-size: 30px;
	line-height: 1;
}

html:has(:popover-open) {
	overflow: hidden;
}

::backdrop {
	background-color: rgba(0,0,0,.75);
	backdrop-filter: blur(2px);
}

.modal {
	visibility: hidden;
	opacity: 0;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, .7);
	transition: all .4s;
	z-index: 1;
	backdrop-filter: blur(2px);
}

.modal:target {
  visibility: visible;
  opacity: 1;
}

.modal__content {
  border-radius: 4px;
  position: relative;
  width: 500px;
  max-width: 90%;
  background: #fff;
  padding: 1em 2em;
  z-index: 1;
}

.modal__footer {
  text-align: right;
  a {
    color: #585858;
  }
  i {
    color: #d02d2c;
  }
}
.modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #585858;
  text-decoration: none;
}

/* #region  footer */

/* footer > * {
	min-height: 50dvh;
} */

footer.container.full .close {
	border: none;
	position: absolute;
	top: 0;
	right: 0;
	font-size: 33px;
	cursor: pointer;
	z-index: 1;
	width: 44px;
}

footer .bg-antrazit {
	background: var(--clr-antra-schwarz);
	border-color: var(--clr-immerweiss) !important;
	color: var(--clr-immerweiss);
}

footer.container.full {
	gap: 0px;
	grid-template-columns: 1fr 1fr;
	background-color: var(--clr-immerweiss);
}

footer .grid.g-4 {
	padding-block: 0;
}

footer .newsletter {
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-bottom-right-radius: var(--radius-big);
	padding: var(--padder);
}

@media (max-width: 540px) {
footer .newsletter p {
	display: none;
}
}

footer .footerlogo {
	border-left: 1px solid;
	border-bottom: 1px solid;
	border-bottom-left-radius: var(--radius-big);
	translate: -1px -1px;
	width: calc(100% + 1px);
	padding: var(--padder);
}

.container.footernav {
	border-right: 1px solid;
	border-top: 1px solid;
	border-top-right-radius: var(--radius-big);
	padding: var(--padder);
	margin: 0;
	translate: 0px -1px;
	height: calc(100% + 1px);
}

.footerlogo img, .newsletter img {
	border-radius: 0;
	float: left;
	max-width: calc(5*var(--padder));
	width: 100%;
}

footer .kontakt {
	display: grid;
	grid-template-columns: 1fr;
	border-left: 1px solid;
	border-top: 1px solid;
	border-top-left-radius: var(--radius-big);
	translate: -1px -1px;
	padding-left: var(--padder);
	padding-top: var(--padder);
	width: calc(100% + 1px);
	height: calc(100% + 1px);
}

footer .mod-menu.mod-list.nav {
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--padder);
	row-gap: 0;
	height: fit-content;
	align-self: end;
}

footer .mod-menu.mod-list.nav .divider {
	display: none;
}

footer .mod-menu.mod-list.nav a {
    color: var(--clr-immerweiss);
    text-decoration: none;
    min-height: 44px;
    display: block;
	font-size: 14px;
}

.container.copyright {
	min-height: 25vh;
	padding-bottom: 0;
	display: grid;
	align-content: end;
}

.container.copyright p {
	padding: 0;
}

.sociallink {
    color: var(--clr-weiss);
    text-decoration: none;
    min-height: 44px;
    display: block;
    line-height: 1.5;
}

.sociallink::before {
	content: 'f';
	font-family: amatiksymbols;
	text-decoration: none;
	margin-right: .5rem;
	font-size: 25px;
}

.sociallink.instagram::before {
	content: 'a';
}

@media(max-width: 810px) {
	footer .grid.g-4 {
		grid-template-columns: 1fr;
	}
}

/* #endregion  footer */

#redim-cookiehint {
	background-color: var(--clr-gelb);
	color: var(--clr-weiss);
	text-align: center;
	padding: var(--padder);
}

.cookiehead {
	display: none;
}

.cookiebuttons {
	display: flex;
	width: max-content;
	margin: auto;
	gap: var(--padder);
}

.cookiecontent p {
	margin: auto;
}

/* Theme Switcher Dark Light */

.theme-switcher {
	position: fixed;
	bottom: var(--padder);
	right: var(--padder);
	z-index: 1000;
}

.theme-switcher button {
	border: 1px solid black;
	border-radius: 8px;
	font-size: var(--font-menu-mobile);
	transition: .3s;
	background: white;
	color: black;
	cursor: pointer;
}

.theme-switcher button.is-active {
	border: 1px solid white;
	background: black;
	color: white;
	font-size: var(--font-menu);
}

/* Frontend Bearbeitung */

.icons {
	z-index: 10000000;
	background: red;
	display: block;
	position: absolute;
}