/* K2 */
/******/
:root {
	--fontWeight: 400;
	--focusColor: oklch(0.8756 0.0498 33.63);
	--gray: oklch(0.6103 0.0049 105);
	--lightgray: oklch(0.9521 0 0);
	--white: oklch(1 0 0);
	--black: oklch(0 0 0);
	--marginPaddingBase: .72rem;
	--headerHeight: 0;
}

/* 'wght' (range from 100.0 to 900.0)*/
@font-face {
  font-family: 'Outfit-Variable';
  src: url('../fonts/outfit/Outfit-Variable.woff2') format('woff2'),
       url('../fonts/outfit/Outfit-Variable.woff') format('woff'),
       url('../fonts/outfit/Outfit-Variable.ttf') format('truetype');
       font-weight: 100 900;
       font-display: swap;
       font-style: normal;
}

/* global layout */
/*.body {
	position: fixed!important;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}*/
html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--headerHeight,1rem) + 3rem);
}

@media (min-width: 1600px) {
	#main :not(.fullwidth) > .container:not(:has(.fullwidth-image)), #header .inside, .boxed-content .contentwrap {
		max-width: 84vw; 
	}
	.mod_article.fullwidth .mod_newsreader {
		.autogrid_row:not(.fullwidth) {
			max-width: 84vw; 
			margin-left: auto;
			margin-right: auto;
		}
	}
}
@media (min-width: 900px) {
	.mod_article.fullwidth .mod_newsreader {
		.autogrid_row:not(.fullwidth) {
			max-width: 90vw; 
			margin-left: auto!important;
			margin-right: auto!important;
		}
	}
}
@media (min-width: 569px) {
	.mod_article.fullwidth .mod_newsreader {
		.autogrid_row:not(.fullwidth) {
			max-width: 85vw; 
			margin-left: auto!important;
			margin-right: auto!important;
		}
	}
}
@media (max-width: 568px) {
	.mod_article.fullwidth .mod_newsreader {
		.autogrid_row:not(.fullwidth) {
			max-width: 92vw; 
			margin-left: auto!important;
			margin-right: auto!important;
		}
	}
}

.container:has(.fullwidth-image) {
	max-width: 100%!important;
}

/*Header*/
#contentwrapper {
	margin-top: calc(-1 * var(--headerHeight,0));
	
}

#fix-wrapper { 
	position: sticky;
	top: 0;
}

/*Footer*/
#footer {
	position: relative;
	overflow: visible;
	margin-top: 6rem;
	z-index: 100;

	.totop {
		display: none;
	}
}

/*Typography*/
body {
	font-family: "Outfit-Variable";
	font-variation-settings: 'wght' var(--fontWeight,400);
	letter-spacing: .042rem;
}

* {
	font-variation-settings: 'wght' var(--fontWeight);
}

strong,b {
	--fontWeight: 700;
}

.font-size-sm { font-size: .6rem;}
.font-size-reg { font-size: 1rem;}
.font-size-md { font-size: 1.2rem;}
.font-size-l { font-size: 1.44rem;}
.font-size-xl { font-size: 1.68rem;}
.font-size-xxl { font-size: 2.16rem;}
.font-size-xxxl { --fontSizeHeadline: 3rem; font-size: 3.3rem; }

.font-weight-thin { --fontWeight: 100; }
.font-weight-extralight { --fontWeight: 200; }
.font-weight-light { --fontWeight: 300; }
.font-weight-regular { --fontWeight: 400; }
.font-weight-medium { --fontWeight: 500; }
.font-weight-semibold { --fontWeight: 600; }
.font-weight-bold { --fontWeight: 700 }
.font-weight-extrabold { --fontWeight: 800; }
.font-weight-black { --fontWeight: 900; }

.text-uppercase,.uppercase { text-transform: uppercase; letter-spacing: .06rem;}
.text-lowercase { text-transform: lowercase;}

:is(h1,h2,h3,h4,h5,h6) {
	--fontWeight: 700;
	font-size: var(--fontSizeHeadline,1rem)!important;
	line-height: var(--lineHeight,normal)!important;
	margin-bottom: .5rem;
}

:is(h1,.h1,.headline_style_h1) {
	--fontSizeHeadline: 2.16rem;
	/*--fontWeight:;*/
	/*--lineHeight:;*/
}
:is(h2,.h2,.headline_style_h2) {
	--fontSizeHeadline: 1.92rem;
	/*--fontWeight:;*/
	/*--lineHeight:;*/
}
:is(h3,.h3,.headline_style_h3) {
	--fontSizeHeadline: 1.68rem;
	/*--fontWeight:;*/
	/*--lineHeight:;*/
}
:is(h4,.h4,.headline_style_h4) {
	--fontSizeHeadline: 1.44rem;
	/*--fontWeight:;*/
	/*--lineHeight:;*/
}
:is(h5,.h5,.headline_style_h5) {
	--fontSizeHeadline: 1.2rem;
	/*--fontWeight:;*/
	/*--lineHeight:;*/
}
:is(h6,.h6,.headline_style_h6) {
	--fontSizeHeadline: 1rem;
	/*--fontWeight: */;
/*	--lineHeight:*/;
}
:is(h1,h2,h3,h4,h5,h6).font-size-xxxl {
	--fontSizeHeadline: 3.3rem;
	--lineHeight: 1.2;
}

.ce_text {
	p:is(:only-child, :last-child) { margin-bottom: 0;}
}

/* Menues */
#header {
	.mod_navigation.mainmenu {
		li {
			margin-left: 2rem;
    		margin-right: 2rem;
		}
		a {
			--fontWeight: 510; 
			text-transform: lowercase;
		}
	}
}


/* hero */
#hero {
	.ce_bgimage-inside {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 100%;
	}
}

/*mod_article*/
:is(.article-border-top, .article-border-bottom) {
	--borderWidth: 1px;
	--borderStyle: solid;
	--borderColor: currentColor;
	--lineSpace: 19px;
}
.article-border-top {
	border-top: var(--borderWidth) var(--borderStyle) var(--borderColor);
	&.lines-double::before {
		content: "";
		visibility: visible;
		display: block;
		position: relative;
		width: 100%;
		height: var(--lineSpace,0);
		border-bottom: var(--borderWidth) var(--borderStyle) var(--borderColor);
	}
}
.article-border-bottom {
	border-bottom: var(--borderWidth) var(--borderStyle) var(--borderColor);
	margin-bottom: var(--lineSpace);
	&.lines-double::after {
		content: "";
		visibility: visible;
		display: block;
		position: relative;
		width: 100%;
		height: var(--lineSpace,0);
		border-top: var(--borderWidth) var(--borderStyle) var(--borderColor);
	}
}
.line-color-accent { border-color: var(--accentColor); }
.line-color-second { border-color: var(--secondColor); }
.line-color-white { border-color: var(--white); }
.line-color-black { border-color: var(--black); }
.line-color-gray { border-color: var(--gray); }

/* Trennlinie */
.ce_divider_extended {
	&.version1_k2 {
		background: oklch(from var(--black) l c h / 1);
    	width: 40%;
		height: 1px;
	}
	&.version2_k2 {
		background: oklch(from var(--black) l c h / 1);
    	width: 84%;
		height: 1px;
	}
	&.version5 {
		background: var(--accentColor);
    	width: 40%;
		height: 1px;
	}
	&.version5_k2 {
		background: var(--accentColor);
    	width: 84%;
		height: 1px;
	}
}

/* buttons */
span {
	[class*="btn-"] & {
		padding: .7rem .9rem;
	}
	[class*="btn-"]:hover & {
		background-color: var(--black);
	}
	.btn-accent & {
		background-color: var(--accentColor);
		color: var(--white);
	}

	.btn-second & {
		background-color: var(--secondColor);
		color: var(--white);
	}
}
/*:is(form input, form select, form textarea, button, a):focus-visible::after,
:is(form input, form select, form textarea, button, a):focus-within::after*/
:is(form input, form select, form textarea, button, a):focus-visible::before {
	display: block!important;
	content: ""!important;
	position: absolute!important;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--focusColor)!important;
	opacity: .48;
	mix-blend-mode: multiply;
	pointer-events: none;
/*	outline-offset: 2px;
	outline: 2px solid var(--focusColor); */
}
:has(>input,>select,>button,a) { position:relative; }

/*ce_list*/
.ce_list {
	&.style3 {
		ul { 
			display: flex;
			gap: 2.4ch;
			align-items: center;
			justify-content: space-around;
			list-style-type: none;
		}
		li { 
			border: none;
			padding: 0!important; 
			margin: 0!important;
		}
		li::before, li::after { display: none!important; }
	}
}

/* forms */
form {
	 :is(input, button) { position: relative; }
}
.footer-form {
	.handorgel__header__button {
		background-color: var(--accentColor);
		font-family: inherit;
		color: var(--white);
		text-transform: uppercase;
		text-align: center;
		border: 0;
		&:hover, :focus-visible { background-color: var(--black);}
		&.handorgel__header__button--opened {
			border-bottom: 2px aolid var(--white);
		}
	}
}

/*images */
.img-logo { max-width: 200px; }

/* Iconbox */
.ce_iconbox {
	a.link {
		margin: calc(2 * var(--marginPaddingBase)) 0 !important;

	}
}

/* swiper */
.ce_swiperStart {
	&:has(.swiper-container-cube) {
		overflow: visible;
		.swiper-container { overflow: visible; }
	}
}

/* Portfolio */
.mod_portfoliolist_v7 {
	.item { 
		border-width: 2.7rem;
		.image { opacity: .6; } 
		&:hover { 
			box-shadow: 0px 20px 15px rgba(0,0,0,.2);
			.image { opacity: 1; }
		}
	}
	
}

/* margin */
.mx-auto { margin: 0 auto; }
.mt-neg-xxs { margin-top: calc(-1 * var(--marginPaddingBase) / 2) !important;}
.mt-neg-xs { margin-top: calc(-1 * var(--marginPaddingBase)) !important;}
.mt-neg-sm { margin-top: calc(-1 * 2 * var(--marginPaddingBase)) !important;}
.mt-neg-md { margin-top: calc(-1 * 3 * var(--marginPaddingBase)) !important;}
.mt-neg-lg { margin-top: calc(-1 * 6 * var(--marginPaddingBase)) !important;}
.mt-neg-xl { margin-top: calc(-1 * 10 * var(--marginPaddingBase)) !important;}
.mt-neg-xxl { margin-top: calc(-1 * 14 * var(--marginPaddingBase)) !important;}

.headline-margin-md { margin-top: calc(2 * var(--marginPaddingBase)) !important }
.headline-margin-lg { margin-top: calc(4 * var(--marginPaddingBase)) !important }
.headline-margin-xl { margin-top: calc(6 * var(--marginPaddingBase)) !important }

/* padding */
.pt-xxs { padding-top: calc(var(--marginPaddingBase) / 2) !important;}
.pt-xs { padding-top: calc(var(--marginPaddingBase)) !important;}
.pt-sm { padding-top: calc(2 * var(--marginPaddingBase)) !important;}
.pt-md { padding-top: calc(3 * var(--marginPaddingBase)) !important;}
.pt-lg { padding-top: calc(6 * var(--marginPaddingBase)) !important;}
.pt-xl { padding-top: calc(10 * var(--marginPaddingBase)) !important;}
.pt-xxl { padding-top: calc(14 * var(--marginPaddingBase)) !important;}
.pb-xxs { padding-bottom: calc(var(--marginPaddingBase) / 2) !important;}
.pb-xs { padding-bottom: calc(var(--marginPaddingBase)) !important;}
.pb-sm { padding-bottom: calc(2 * var(--marginPaddingBase)) !important;}
.pb-md { padding-bottom: calc(3 * var(--marginPaddingBase)) !important;}
.pb-lg { padding-bottom: calc(6 * var(--marginPaddingBase)) !important;}
.pb-xl { padding-bottom: calc(10 * var(--marginPaddingBase)) !important;}
.pb-xxl { padding-bottom: calc(14 * var(--marginPaddingBase)) !important;}
.px-xxs { padding-right: calc(var(--marginPaddingBase) / 2) !important; padding-left: calc(var(--marginPaddingBase) / 2) !important; }
.px-xs { padding-right: var(--marginPaddingBase) !important; padding-left: var(--marginPaddingBase) !important; }
.px-sm { padding-right: calc(2 * var(--marginPaddingBase)) !important; padding-left: calc(2 * var(--marginPaddingBase)) !important; }
.px-md { padding-right: calc(3 * var(--marginPaddingBase)) !important; padding-left: calc(3 * var(--marginPaddingBase)) !important; }
.px-lg { padding-right: calc(6 * var(--marginPaddingBase)) !important; padding-left: calc(6 * var(--marginPaddingBase)) !important; }
.px-xl { padding-right: calc(10 * var(--marginPaddingBase)) !important; padding-left: calc(10 * var(--marginPaddingBase)) !important; }
.px-xxl { padding-right: calc(14 * var(--marginPaddingBase)) !important; padding-left: calc(14 * var(--marginPaddingBase)) !important; }

/*flexbox*/
.justify-start { justify-content: flex-start; }
.justify-end { justify-content: flex-end; }
.justify-center { justify-content: center; }
.justify-around { justify-content: space-around; }
.justify-between { justify-content: space-between; }
.justify-evenly { justify-content: space-evenly; }

/*Shadow */
[class*="box-shadow"] {
	--shadowColor: rgba(0,0,0,.3);
	box-shadow: var(--shadowPosY,0) var(--shadowPosX,0) var(--shadowWidth,6px) var(--shadowOffset,0)  var(--shadowColor, #000);
}
.box-shadow-wide {
	--shadowWidth: 39px;
}

.textred {
	color:forestgreen;
	font-size: .85rem;
	margin: 3rem 0;
}