
 
 @font-face {
  font-family: 'ESRebondGrotesque-Medium';
  src: url('/assets/fonts/ESRebondGrotesque-Medium.woff2') format('woff2'),
       url('/assets/fonts/ESRebondGrotesque-Medium.woff') format('woff');

  font-style: normal;
}


*{
	box-sizing: border-box;
	 -webkit-tap-highlight-color: transparent;
}

:root {
	--lila: #DCDCFA;
	--weiss: #FFFFFF;
	--schwarz: #000000;
	
	--fontsize-small: 16px;
	--fontsize-base: 25px;
	--fontsize-large:36px;
	
	--abstand-gross: 75px;
	--abstand: 45px;
	--abstand-mittel: 30px;
	--abstand-klein: 15px;
	--padding:14px 17px;

	--block-abstand:30px;
	--block-padding:150px;

	--header-height: 100px;
	--page-margin: 30px;
	--page-margin-top:100px;

	--page-padding:187px;
	
	--grid: 12;
	--grid-gap: 16px;
	
	--border-radius:10px;
	

	--text-maxwidth: 1024px;

	--box-shadow: 0px 6px 10px rgba(16, 2, 31, 0.06);

	interpolate-size: allow-keywords;
	
	--bezier: cubic-bezier(0.83, 0, 0.17, 1);
}
html, body { 
	margin: 0;
	padding: 0;
	background-color:white;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	
	color:var(--schwarz);
	font-family:'ESRebondGrotesque-Medium','Arial',sans-serif;
	
	font-size:var(--fontsize-base);
	line-height:1.1;
	
	/* FOOTER ALWAYS ON BOTTOM */
	min-height:100vh;
	min-height:100dvh;
	display:flex;
	flex-direction: column;
	justify-content: space-between;
}




/* HIDE SCROLLBAR */
body,html{
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox, Safari 18.2+, Chromium 121+ */

}
body::-webkit-scrollbar,
html::-webkit-scrollbar { 
    display: none;  /* Older Safari and Chromium */
}


.safe-top,
.safe-bottom{
	display:none;
}


/* ---------------------------------
	
	GRID SETUP
	
-----------------------------------*/

.grid-container{
	display:grid;
	grid-template-columns: repeat(var(--grid), 1fr);
	column-gap: var(--grid-gap);
	row-gap: var(--grid-gap);
}
.grid-1{ grid-column: span 1; }
.grid-2{ grid-column: span 2; }
.grid-3{ grid-column: span 3; }
.grid-4{ grid-column: span 4; }
.grid-5{ grid-column: span 5; }
.grid-6{ grid-column: span 6; }
.grid-7{ grid-column: span 7; }
.grid-8{ grid-column: span 8; }
.grid-9{ grid-column: span 9; }
.grid-10{ grid-column: span 10; }
.grid-11{ grid-column: span 11; }
.grid-12{ grid-column: span 12; }
.grid-13{ grid-column: span 13; }
.grid-14{ grid-column: span 14; }
.grid-15{ grid-column: span 15; }
.grid-16{ grid-column: span 16; }
.grid-17{ grid-column: span 16; }
.grid-18{ grid-column: span 16; }
.grid-19{ grid-column: span 16; }
.grid-20{ grid-column: span 16; }
.grid-21{ grid-column: span 16; }
.grid-22{ grid-column: span 16; }
.grid-23{ grid-column: span 16; }
.grid-all{ grid-column: 1/-1; }



/* ---------------------------------
	
	UTILITY CLASSES
	
-----------------------------------*/

body.no-scroll{
	overflow-y:hidden;
}


.mobile-only{
	display:none;
}


/* ---------------------------------
	
	GENERAL LAYOUT STUFF
	
-----------------------------------*/

h1{
	font-size:var(--fontsize-large);
	padding-bottom:var(--abstand-block);
}
h2{
	font-size:var(--fontsize-large);
}
h3{
	font-size:var(--fontsize-base);
}

h4{
	font-size:var(--fontsize-small);
}

a{
	text-decoration: none;
	text-decoration-thickness: from-font;
	/*transition:all .2s ease;*/
	color:inherit;
}


.btn{
	display:inline-block;
	border-radius: 999px;
	background-color:var(--lila);
	padding:6px 17px;
	transition: all .2s ease;
	font-size:var(--fontsize-base);
}
.is-desktop .btn:hover{
	box-shadow: var(--box-shadow);
	transform: translateY(-3%);
}


.text-small{
	font-size: var(--fontsize-small)
}
.ratio-1-1{
	aspect-ratio: 1/1;
}
.ratio-2-1{
	aspect-ratio: 2/1;
	object-fit: cover;
}
.ratio-3-2{
	aspect-ratio: 3/2;
}
.ratio-1-1{
	aspect-ratio: 1/1;
}




.container{
	max-width:1440px;
	margin:0 auto;
}


main{
	padding-top:var(--header-height);
	/*padding-bottom:var(--abstand-gross);*/
}



/* ICONS */

.has-icon{	
	background-repeat:no-repeat;
	background-position:calc(100% - 0.8rem) center;
	background-size:18px;
}

.icon-arrow-down{
	background-image:url('/assets/bilder/icons/arrow_down.svg');
}
.icon-arrow-right{
	background-image:url('/assets/bilder/icons/arrow_right.svg');
}
.icon-phone{
	background-image:url('/assets/bilder/icons/phone.svg');
}
.icon-mail{
	background-image:url('/assets/bilder/icons/mail.svg');
	background-position:center;
}


/* LINK STYLES */

.footer__block--bottom a:hover,
.nav__bottom a:hover,
.b-impressum .block-text a:hover,
.b-impressum h3{
	text-decoration: underline;
	text-decoration-thickness:1px;

}
.b-impressum .block-text a:hover,
.b-impressum h3{
	text-underline-offset: 4px;
}

/* ---------------------------------
	
	LOGO
	
-----------------------------------*/

.logo{
	position:absolute;
	left:var(--page-margin);
	top:var(--page-margin);
	font-size:var(--fontsize-large);
	text-transform: uppercase;
}


/* LOGO START */
.logo span.logo-letters{
	transition:all 0s var(--bezier);
	transform: translateY(-200%);
	display:inline-block;
}


/* LOGO END */
.nav-is-active.is-desktop .logo-nav span.logo-letters{
	opacity:1;
	transform:translateY(0%);
	transition:transform .8s var(--bezier);
}

/* LOGO NAV */
.is-desktop .logo-nav span{
	transition:transform .7s var(--bezier);
}
.is-desktop .logo-nav span:nth-child(2),
.is-desktop .logo-nav span:nth-child(4),
.is-desktop .logo-nav span:nth-child(6){
	transition-delay:0s;
}
.nav-is-active.is-desktop .logo-nav span:nth-child(2){
	transition-delay:0.7s;
}
.nav-is-active.is-desktop .logo-nav span:nth-child(4){
	transition-delay:0.8s;
}
.nav-is-active.is-desktop .logo-nav span:nth-child(6){
	transition-delay:0.9s;
}
.is-desktop .logo-nav .logo-symbol{
	opacity:0;
	pointer-events: none;
}


.logo-symbol{
	position:absolute;
	top:0;
	left:0;
	width:203px;
	height:203px;
}

.logo-nav{
	position:fixed;
	opacity:0;
	pointer-events: none;
	transition:opacity .2s ease;
	transition-delay:0s;

	background: var(--lila);
}

.nav-is-active .logo-nav{
	opacity:1;
	pointer-events: all;
	transition-delay:0.8s;
}




/* ---------------------------------
	
	NAVIGATION
	
-----------------------------------*/

nav{
	position:fixed;
	inset:0;	
	opacity:0;
	pointer-events: none;
	padding:var(--page-margin);
	flex-direction: column;
	justify-content: space-between;
	display:flex;
	transition:opacity .2s ease;
	transition-delay:0s;
}
nav.is-active{
	opacity:1;
	pointer-events: all;
	transition-delay:0.6s;
}
.nav-bg{
	position:fixed;
	right:var(--page-margin);
	top:var(--page-margin);
	background:var(--lila);
	width: 40px;
	height: 40px;
	border-radius:999px;
	transform:scale(1);
	transition:all 0.5s ease;
}
body.nav-is-active .nav-bg{
	transform:scale(190);
	transition:all 1s var(--bezier);
}

.nav__main{
	padding-top:125px;
	padding-left:var(--page-padding);
	line-height:1.3;
	position:relative;
	padding-bottom:20px;

	/*overflow:auto;*/
}

.nav__main a{
	display:table;
	font-size:var(--fontsize-large);
	position:relative;
	text-decoration: none;	
	text-indent:-30px;
	transition:text-indent .4s ease, opacity .4s ease;
	opacity:0;
	transition-delay:0s;
}
nav.is-active .nav__main a:nth-child(1){ transition-delay:0.5s; }
nav.is-active .nav__main a:nth-child(2){ transition-delay:0.55s; }
nav.is-active .nav__main a:nth-child(3){ transition-delay:0.6s; }
nav.is-active .nav__main a:nth-child(4){ transition-delay:0.65s; }
nav.is-active .nav__main a:nth-child(5){ transition-delay:0.7s; }
nav.is-active .nav__main a:nth-child(6){ transition-delay:0.75s; }
nav.is-active .nav__main a:nth-child(7){ transition-delay:0.8s; }
nav.is-active .nav__main a:nth-child(8){ transition-delay:0.85s; }
nav.is-active .nav__main a:nth-child(9){ transition-delay:0.9s; }
nav.is-active .nav__main a:nth-child(10){ transition-delay:0.95s; }

nav.is-active .nav__main a{
	text-indent:0px;
	opacity:1;
}

.nav-item--arbeitsintegration{
	margin-bottom:55px;
}

.nav__main a::after{
	content: '';
	position: absolute;
	z-index:2;
	width: 100%;
	height: 1px;
	background-color: var(--schwarz);
	top: 100%;
	left: 0;
	pointer-events: none;
	transform-origin: 100% 50%;
	transform: scale3d(0, 1, 1);
	transition: transform 0.3s ease-in-out;
}
.nav__main a:hover::after,
.nav__main a.act::after{
	transform-origin: 0% 50%;
	transform: scale3d(1, 1, 1);
}


.nav__bottom{
	display:flex;
	flex-direction: row;
	font-size: var(--fontsize-small);
	position:relative;
}
.nav__bottom div:first-child{
	width:var(--page-padding);
}
.nav__logoanim{
	position:fixed;
	top:var(--page-margin);
	right:var(--page-margin);
	height:calc( 100vh - 2 * var(--page-margin) );
	height:calc( 100dvh - 2 * var(--page-margin) );
	aspect-ratio: 1/1;
	max-width:50%;
}
.nav__logoanim svg{
	width:100%;
	height:100%;
}




.nav-button{
	position:fixed;
	cursor:pointer;
	right:var(--page-margin);
	top:var(--page-margin);
	background:var(--lila);
	width: 40px;
	height: 40px;
	border-radius:999px;
	outline: none;
	border:0px;
	transform:scale3d(1,1,1);
	transition:all .2s ease;
}

.nav-button:hover{
	box-shadow: var(--box-shadow);
	transform:scale3d(1.1,1.1,1);
}

.nav-button::before,
.nav-button::after{
	content:'';
	display:block;
	position:absolute;
	height:1px;
	width:20px;
	left:50%;
	top:50%;
	transform-origin: center;
	transform:translate(-50%,-50%);
	background-color: var(--schwarz);
	transition:transform .2s ease;
}


.nav-button::after{
	transform:translate(-50%,-50%) rotate(90deg);
}



/* ACTIVE */

.nav-button.is-active{
	background-color:var(--weiss);
	transform:rotate(-45deg);
}
.nav-button.is-active:hover{
	background-color:var(--weiss);
	transform:rotate(-45deg) scale3d(1.1,1.1,1);
}


/* ---------------------------------
	
	SEITEN TITEL
	
-----------------------------------*/

.site-title{
	position:absolute;
	left:50%;
	transform: translateX(-50%);
	top:var(--page-margin);
	font-size: var(--fontsize-large);
	opacity:1;
	/*transition:opacity .2s ease;*/
}
body.nav-is-active .site-title{
	/*opacity:0;*/
}
body.b-home .site-title,
body.b-kontakt .site-title{
	display:none;
}

/* ---------------------------------
	
	FOOTER
	
-----------------------------------*/


footer{
	display:flex;
	flex-direction: column;
	background-color: var(--lila);
	padding:var(--page-margin);
	font-size:var(--fontsize-small);
	gap:120px;
}

footer .logo{
	position:static;
}
footer .logo span{
	opacity:0;
}

.footer__block--bottom{
	display:flex;
	flex-direction: row;
	justify-content: flex-start;
}
.footer__block--bottom div:not(:last-child){
	width:var(--page-padding);
}

.footer__block--bottom div:nth-child(2){
	width:calc( var(--page-padding) + 40px)
}
.footer__block--bottom div:last-child{
	width:100%;
	flex:1;
	display:flex;
	justify-content: flex-end;
}

.b-kontakt footer{
	display:none;
}

/* ---------------------------------
	
	BLOCK: GENERELL
	
-----------------------------------*/

.block{
	margin-bottom:var(--abstand-block);
	margin:0 auto;
	padding-left:calc( var(--page-padding) + var(--page-margin) );
	padding-right:calc( var(--page-padding) + var(--page-margin) );
}
.block.full-width{
	max-width: 100%;
	margin:0;
	padding-left:0;
	padding-right:0;
}
.block:first-child{
	padding-top: var(--block-padding);
}
.block:last-child{
	padding-bottom: var(--block-padding);
}
.block__inner{
	max-width:1200px;
	margin: 0 auto;
}
.block.full-width .block__inner{
	max-width:100%;
}



.will-animate{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1s var(--bezier), transform 0.8s var(--bezier), filter 0.8s var(--bezier);
  filter: blur(10px);
}


.will-animate.inview {
  opacity: 1;
  transform: translateY(0);
   filter: blur(0px);
}

/* ---------------------------------
	
	BLOCK: INTROTEXT
	
-----------------------------------*/

.block-introtext{
	font-size:var(--fontsize-large);
	text-align: center;
	padding-top:var(--block-padding);
	padding-bottom:var(--block-padding);
	padding-left:150px;
	padding-right:150px;
}
.block-introtext__tags{
	padding-top:var(--abstand);
}
.block-introtext .block__inner{
	max-width: 1000px;
}

.block-introtext:has(+ .block-text),
.block-introtext:has(+ .block-introtext){
	border-bottom:1px solid var(--schwarz);
}
.block-introtext .text{
	display:flex;
	flex-direction: column;
	gap:var(--abstand);
}


/* ---------------------------------
	
	BLOCK: TEXT 
	
-----------------------------------*/

.block-text{
	padding-top:var(--block-padding);
	padding-bottom:var(--block-padding);
	hyphens: auto;
	hyphenate-limit-chars: auto 5;
	hyphenate-limit-lines: 2;
	overflow-wrap: break-word;
}
.block-text .block__inner{
	display:flex;
	flex-direction: row;
	gap:60px;
	justify-content: space-between;
}
.block-text:has(+ .block-text){
    border-bottom:1px solid var(--schwarz);
}

.block-text__text{
	flex:1;
}

.block-text__links{
	width:260px;
	margin-top:8px;
}
.block-text__links a{
	display:block;
	margin-bottom:var(--abstand-klein);
}

.block-text p{
	padding-bottom:var(--abstand-klein);
}
.block-text p:last-child{
	padding-bottom:0px;
}


/* ---------------------------------
	
	BLOCK: IMAGE GALLERY
	
-----------------------------------*/

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: auto;
}

.swiper-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.8s ease;
}

.swiper-slide.active {
  opacity: 1;
  position: relative;
}




/* ---------------------------------
	
	BLOCK: TEAM
	
-----------------------------------*/

.block-team{
	padding-left:0;
	padding-right:0;
}
.block-team article{
	padding-top:var(--abstand);
	padding-bottom:var(--abstand);
	border-top:1px solid var(--schwarz);

	padding-left: calc(var(--page-padding) + var(--page-margin));
    padding-right: calc(var(--page-padding) + var(--page-margin));
}
.block-team h2{
	text-align: center;
	padding-bottom:var(--abstand);
}
.block-team__content{
	display:grid;
	grid-template-columns: repeat(var(--grid), 1fr);
	column-gap: var(--grid-gap);
	column-gap: var(--abstand);
	row-gap: var(--abstand);
}
.block-team__item:nth-child(even) {
  /*justify-content: flex-end;*/

  /* TODO */

}
.block-team__item{
	grid-column: span 6;
	display:flex;
	flex-direction: row;
	align-items: center;
	font-size:var(--fontsize-small);
	
}
.block-team__bild{
	display:block;
	margin-right:25px;
	max-width:220px;
	width:45%;
	position:relative;
}
.block-team__bild img{
	position:relative;
	z-index:1;
	width:100%;
	aspect-ratio: 1/1;
	border-radius: 9999px;
	object-fit: cover;
}
/* MAIL ICON */
.block-team__bild i{
	display:block;
	position:absolute;
	z-index:2;
	background-color: var(--lila);
	width:46px;
	height:46px;
	border-radius:999px;
	bottom:8px;
	left:8px;
	background-size: 22px;
	transform: scale3d(1,1,1);
	transition:all .2s ease;
}
.block-team__bild:hover i{
	transform:scale3d(1.1,1.1,1);
	box-shadow: var(--box-shadow);
}

.block-team__text{
	/*width:100%;*/
}
.block-team__text h3{
	padding-bottom:var(--abstand-klein);
}

.b-team .block-introtext:not(:first-child){
	border-top: 1px solid var(--schwarz);
}

/* ---------------------------------
	
	BLOCK: AKKORDEON 
	
-----------------------------------*/

.block-accordion__box{
	background-color:var(--lila);
	margin-bottom:var(--abstand-klein);
	border-radius: var(--border-radius);
}
.block-accordion__box:last-child{
	margin-bottom:0;
}

.block-accordion__header{
	padding:var(--padding);
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	border-bottom:1px solid transparent;
	cursor:pointer;
	position:relative;
	padding-right:55px;
	transition:border-bottom .2s ease;
}
.block-accordion__header i{
	display:block;
	width:22px;
	height:11px;
	position:absolute;
	right:17px;
	top:50%;
	transform:rotate(0deg) translateY(-50%);
	background-image:url(/assets/bilder/icons/arrow_down_accordion.svg);
	background-size:contain;
	background-repeat:no-repeat;
	transition:transform .2s ease;
}

.block-accordion__content{
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	transition: grid-template-rows 0.3s ease-out, opacity 0.3s ease 0.1s;
	overflow:hidden;
}
.block-accordion__content div{
	overflow:hidden;
	transition: all .2s ease;
	padding:var(--padding);
	padding-top:0px;
	padding-bottom:0px;
	
}

/* ACTIVE */
.is-active .block-accordion__content{
	opacity: 1;
	grid-template-rows: 1fr;
}
.is-active .block-accordion__content div{
	padding:var(--padding);
}
.is-active .block-accordion__header{
	border-bottom:1px solid var(--schwarz);
}
.is-active .block-accordion__header i{
	transform:rotate(180deg) translateY(50%);
}

/* ---------------------------------
	
	BLOCK: KONTAKT 
	
-----------------------------------*/


.block-kontakt{
	padding-top:var(--block-padding);
	padding-bottom:var(--block-padding);
	font-size:var(--fontsize-large);
}
.block-kontakt article{
	border-bottom:1px solid var(--schwarz);
	padding:var(--abstand-klein) 0;
}
.block-kontakt article:first-child{
	padding-top:0px;
}
.block-kontakt--2cols{
	display:flex;
	flex-direction: row;
	gap:60px;
	justify-content: space-between;
}

/* ---------------------------------
	
	BLOCK: DOWNLOADS 
	
-----------------------------------*/

.block-downloads{
	margin-bottom:var(--abstand-klein);
}
.block-downloads .block-accordion__content div{
	padding:0;

}
.block-downloads .block-accordion__content a{
	display:block;
	padding:var(--padding);
	border-bottom:1px solid black;
	background-position: calc(100% - 1.1rem) center;
	transition:padding .2s ease;
}
.block-downloads .block-accordion__content a:hover{
	padding-left:20px;
}
.block-downloads .block-accordion__content a:last-child{
	border-bottom:0px;
}

/* ---------------------------------
	
	BLOCK: DOWNLOADS SINGLE
	
-----------------------------------*/

.block-downloads__single .block-accordion__content{
	overflow: auto;
	opacity:1;
	display:block;
}
.block-downloads__single .block-accordion__content a{
	padding-right:50px;
}



/* ---------------------------------
	
	BACKGROUND LILA
	
-----------------------------------*/

.bg-lila{
	background-color:var(--lila);
	height:auto;
}

.bg-lila .nav-button,
.bg-lila .btn,
.bg-lila .block-team__bild a,
.bg-lila footer,
.bg-lila .block-accordion__box,
.bg-lila .nav-bg{
	background-color:white;
}

.bg-lila .nav-bg{
	background:white;

}
.bg-lila.nav-is-active .nav-bg{
	background:var(--lila);
}

/* ---------------------------------
	
	ANIMATIONS
	
-----------------------------------*/

/* INTRO ANIMATION */

body.intro{
	overflow-y:hidden;
}

main,footer{
	opacity:1;
	transition:opacity 1s ease;
}
body.intro main,
body.intro footer,
body.intro .nav-button,
body.intro .nav-bg{
	opacity:0 !important;
}
body.intro .logo span.logo-letters{
	transform:translateY(0%);
}
/* LOGO WÖRTER ANFANG */
body.intro.is-desktop .logo-head span{
	opacity:1;
	transform: translateY(0);
	transition: all 0.8s var(--bezier);
	transition-delay:1s;
}
/* LOGO WÖRTER ENDE */
body.intro.is-desktop .logo-head.is-animating span{
	transform: translateY(-200%);
}
body.intro.is-desktop .logo-head.is-animating span:nth-child(4){
	transition-delay:1.2s;
}
body.intro.is-desktop .logo-head.is-animating span:nth-child(6){
	transition-delay:1.4s;
}


/* STRICHE LOGO HEAD ANFANG */
body.intro .logo-head .logo-symbol line{
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  /*transition: stroke-dashoffset 1s var(--bezier);*/
  transition: stroke-dashoffset 1.2s cubic-bezier(0.62,0.00,0.02,0.99);
  
  transition-delay:1.1s;
}

/* STRICHE LOGO HEAD ENDE */
body.intro .logo-head.is-animating .logo-symbol line{
	stroke-dashoffset: 909;
	transition-delay:1.1s;
}

body.intro .logo-head .logo-symbol line.group-b{
	transition-delay:1.2s;
}
body.intro .logo-head .logo-symbol line.group-c{
	transition-delay:1.3s;
}



/* STERN NAV START */
nav .nav__logoanim .logo-symbol{
	transform:scale(10);
	transform-origin: center;
	transition: transform 0s var(--bezier);
	transition-delay:0.2s;
	
}
/* STERN NAV END */
nav.is-active .nav__logoanim .logo-symbol{
	transform:scale(1);
	transition-duration:1.5s;
	transition-delay:0s;
}


/* STERN LINIE NAV START */
nav .nav__logoanim .logo-symbol line{
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
	transition: stroke-dashoffset 0s linear, stroke-width 0s linear;
	transition-delay:0s;
	stroke-width:0.2;

}
/* STERN LINIE NAV END */
nav.is-active .nav__logoanim .logo-symbol line{
	stroke-dashoffset: 500;
	transition-delay:0.2s;
	transition-duration:1.7s;
	stroke-width:1;
}
nav.is-active .nav__logoanim .logo-symbol line.group-b{
	transition-delay:0.3s;
}
nav.is-active .nav__logoanim .logo-symbol line.group-c{
	transition-delay:0.4s;
}



/* ---------------------------------
	
	IMPRESSUM
	
-----------------------------------*/


.b-impressum h3{
	text-decoration: underline;
	padding-top:var(--abstand);
	padding-bottom:var(--abstand-klein);
}

.b-impressum .impressum-text-top{
	hyphens:none;
}
.b-impressum .impressum-text-top .block__inner{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.b-impressum .block-text:last-child{
	padding-top:var(--abstand);
}

/* LISTE */
.b-impressum ul{
	display: block;
	list-style-type: none;
	padding-bottom:var(--abstand-klein);
}
.b-impressum li{
	position:relative;
	padding-left:1rem;
}
.b-impressum li::before{
	content:'';
	display:block;
	position:absolute;
	background:var(--schwarz);
	left:0;
	width:6px;
	height:6px;
	border-radius: 999px;
	top:0.7rem;
}

.impressum-logo img{
	max-height:72px;
	width:auto;
	aspect-ratio: 1/1;
}
.b-impressum .block-text:first-child .block__inner{
	gap:30px;
}


/* ---------------------------------
	
	!Z-INDEXES
	
-----------------------------------*/

.site-title{
	z-index:2;
}

.logo-head{
	z-index:2;
	transition-delay:1s;
	transition-property: z-index;
}

.nav-bg{
	z-index:3;
}
nav{
	z-index:4;
}
.nav-button{
	z-index:5;
}
/* INTRO ABDECKER */
body.b-home .intro-abdecker{
	z-index:6;
}
.intro .logo-head{
	z-index:7;
}



.logo-nav{
	z-index:8;
}

.nav__logoanim{
	z-index:9;
}
.nav__main{
	z-index:10;
}
.nav__bottom{
	z-index:10;
}


/* ---------------------------------
	
	RESPONSIVE
	
-----------------------------------*/

@media screen and (max-width: 1350px){
	.block:first-child{
		padding-top: calc(var(--block-padding) +  var(--abstand-klein));
	}
}


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

	:root{
		--page-padding:30px;
	}
		

	.footer__block--bottom div:not(:last-child){
		width:187px;
	}
	.footer__block--bottom div:nth-child(2){
		width:calc( 187px + 40px)
	}
	.block-introtext{
		padding-left: calc(var(--page-padding) + var(--page-margin));
		padding-right: calc(var(--page-padding) + var(--page-margin));
	}
	.nav__bottom div:first-child{
		width:187px;
	}
	
	.nav__main{
		padding-left:0px;
	}
	
}

@media screen and (max-width:1140px){
	.site-title{
		display:none;
	}
}

@media screen and (max-width:940px){
	/* IMPRESSUM */
	.b-impressum .block-text:first-child .block__inner{
		grid-template-columns: 1fr 1fr;
	}
	.b-impressum .block-text:first-child .block__inner div{
		grid-column: span 1; 
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(1){
		order:1;
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(2){
		order:3;
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(3){
		order:4;
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(4){
		order:2;
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(5){
		order:5;
	}
	.b-impressum .block-text:first-child .block__inner div:nth-child(6){
		order:6;
	}
}

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

	:root{
		--page-padding:0px;
		--page-margin:16px;
		--block-padding:30px;
		--abstand: 30px;
	}

	body.is-mobile main,
	body.is-mobile footer{
		transition:opacity .5s ease;
		opacity:1;
		transition-delay:0s;
	}
	body.nav-is-active.is-mobile main,
	body.nav-is-active.is-mobile footer{
		opacity:0;
		transition-delay:0.7s;
	}

	

	/* NAV */
	.nav-button{
		box-shadow: var(--box-shadow);
		top:14px;
	}
	.nav-bg{
		top:14px;
	}



	
	body.nav-is-active .nav-bg{
		transform:scale(70);
	}

	.nav__logoanim{
		display:none;
	}
	.nav-is-active .logo-head .logo-symbol{
		opacity:1;
	}
	.nav__main{
		padding-top:210px;
	}
	.nav__main br{
		display:none;
	}
	.nav__main a{
		display:block;
	}
	.nav__main a::after{
		display:none;
	}
	.nav-item--arbeitsintegration{
		margin-bottom: 0;
		border-bottom:1px solid var(--schwarz);
		padding-bottom: 8px;
		margin-bottom: 8px;
	}
	.nav__main a:last-child{
		/*padding-bottom: 8px;*/
	}

	.nav__bottom{
		flex-direction: column-reverse;
	}
	.nav__bottom div{
		padding-top:var(--page-margin);
		padding-bottom:var(--page-margin);
	}
	.nav__bottom div:first-child{
		width:100%;
		padding-bottom:0px;
	}
	.nav__bottom div:last-child{
		display:flex;
		flex-direction: row;
		border-top:1px solid var(--schwarz);
		border-bottom:1px solid var(--schwarz);
	}
	.nav__bottom div:last-child a:first-child{
		width:187px;
	}
	.nav__bottom div br{
		display: none;
	}

	
	/* LOGO */	
	.logo span.logo-letters{
		opacity:0;
	}
	.logo span:last-of-type{
		display:none;
	}
	.logo-nav span.logo-mainletter{
		opacity:1;
		transform: none;
	}
	


	.block:first-child{
		padding-top:var(--block-padding);
	}

	/* TEAM */
	.block-team__content{
		display:flex;
		flex-direction: column;
		text-align: center;
		gap: 45px;
	}
	.block-team__item{
		flex-direction: column;
	}
	.block-team__bild{
		margin-right:0px;
		margin-bottom:35px;
	}
	.block-team__bild i{
		bottom:0px;
		left:50%;
		transform: translateX(-50%) translateY(50%);
	}
	.block-team__bild:hover{
		pointer-events: none;
		transform: none;
	}
	

	/* ANIMATIONS */

	/* STRICHE LOGO HEAD ANFANG */
	.logo-nav .logo-symbol line{
		stroke-dasharray: 1000;
		stroke-dashoffset: 1000;
		transition: stroke-dashoffset 0s cubic-bezier(0.62,0.00,0.02,0.99);
		transition-delay:0s;
		transition-duration:0s;
	}
	/* STRICHE LOGO HEAD ENDE */
	body.nav-is-active .logo-nav .logo-symbol line{
		stroke-dashoffset: 900;
		transition-delay:0.5s;
		transition-duration: 1.2s;
		transition-timing-function: var(--bezier);
	}

	body.nav-is-active .logo-nav .logo-symbol line.group-b{
		transition-delay:0.6s;
	}
	body.nav-is-active .logo-nav .logo-symbol line.group-c{
		transition-delay:0.7s;
	}
	



	.btn{
		display:block;
		text-align: left;
		margin-bottom:10px;
	}

	main{
		padding-top:230px;
	}
	.block-introtext,
	h2{
		font-size:var(--fontsize-base);
	}

	.block:last-child{
		padding-bottom:40px;
	}



	.block-image img{
		aspect-ratio:1/1;
		object-fit: cover;
	}


	/* BLOCK: INTROTEXT */

	.block-introtext{
		text-align: left;
	}
	
	.block-introtext .btn:last-child{
		margin-bottom:0px;
	}

	.block-introtext .btn{	
		background-repeat:no-repeat;
		background-position:calc(100% - 0.8rem) center;
		background-size:18px;
		background-image:url('/assets/bilder/icons/arrow_right.svg');
	}

	/* BLOCK: TEXT */

	.block-text .block__inner{
		display:flex;
		flex-direction:column;
		gap:var(--abstand);
	}
	.block-text__links{
		width:100%;
	}
	.block-text__links .btn:last-child{
		margin-bottom:0px;
	}


	

	/* KONTAKT */

	.block-kontakt{
		font-size: var(--fontsize-base);
	}
	.block-kontakt--2cols{
		flex-direction: column;
		gap:var(--abstand-klein);
	}
	.block-text__links{
		margin-top:0px;
	}


	.footer__block--bottom div:not(:last-child){
		width:187px;
	}


	/* FOOTER */
	footer{
		padding-left:0;
		padding-right:0;

		/*padding-bottom:var(--abstand);*/
	}
	.footer__block--top{
		padding-left:var(--page-margin);
		padding-right:var(--page-margin);
	}
	.footer__block--bottom{
		display:grid;
		grid-template-columns: calc(187px + var(--page-margin)) 1fr;
	}
	.footer__block--bottom div{
		width:100% !important;
		padding-top:var(--abstand-klein);
		padding-bottom:var(--abstand-klein);
		padding-left:var(--page-margin);
		padding-right:var(--page-margin);
	}
	.footer__block--bottom div:nth-child(1){ 
		grid-column: span 1; 
		border-bottom:1px solid var(--schwarz);
	}
	.footer__block--bottom div:nth-child(2){ 
		grid-column: span 1; 
		border-bottom:1px solid var(--schwarz);
		padding-left:0;
		padding-right:0;
	}
	.footer__block--bottom div:nth-child(3){ 
		grid-column: span 2; 
		display:grid;
		grid-template-columns: 187px 1fr;
		border-bottom:1px solid var(--schwarz);
	}
	.footer__block--bottom div:nth-child(3) a{
		grid-column: span 1;
	}
	.footer__block--bottom div:nth-child(4){ 
		grid-column: span 2; 
		display:block;
		padding-bottom:0px;
	}
	.footer__block--bottom div:nth-child(3) br,
	.footer__block--bottom div:nth-child(4) br{ 
		display:none;
	}	
	
	
		


	

	/* SAFARI BUG FIXES */
	@supports (-webkit-touch-callout: none) {
		@media screen and (max-device-width: 1024px) {
			html{
				background: white;
			}
			body {
				background: white;
				padding-top: env(safe-area-inset-top);
				padding-bottom: env(safe-area-inset-bottom);
			}

			/* WHITE TOP AND BOTTOM ON IPHONE SAFARI */
			.safe-top {
				display:block;
				height:5px;
				background: white;
				position: fixed;
				top: 0;
				left:0;
				z-index:10;
				width:100%;
			}
			.safe-bottom {
				display:block;
				height:5px;
				background: white;
				position: fixed;
				bottom: 0;
				left:0;
				z-index:10;
				width:100%;
			}
			.footer__block--bottom div:nth-child(4){ 
				padding-bottom:5px;
			}
			nav{
				padding-bottom:21px;
			}


		}
	}


}

@media screen and (max-width:700px){
	.b-impressum .block-text:first-child .block__inner{
		display:flex;
		flex-direction: column;
	}
}

@media screen and (max-width: 385px) {
	:root{
		--fontsize-large: 29px;
	}
	.logo{
		font-size:36px;
		transform-origin: top left;
		transform: scale(0.8);
	}
	  main {
		padding-top: 180px;
	}
	footer p{
		hyphens:auto;
	}
}


/* NAV OPTIMIERUNGEN */
@media screen and (min-width: 851px) and (max-height: 750px) {
	
	.nav__main{
		padding-top:15vh;
	}
	.nav__main a{
		font-size:33px;
	}
	
	.nav__main a:last-child {
		padding-bottom: 0px;
	}
}
@media screen and (min-width: 850px) and (max-height:635px){
	.nav__main a{
		font-size:30px;
	}
}

@media screen and (max-width: 850px) and (max-height:765px){
	.nav__main a{
		font-size:30px;
	}
}


@media screen and (min-width: 385px) and (max-height: 765px) {
	/*.nav__main{
		padding-top: 180px;
	}
	.nav__main a {
		font-size: 27px;
	}
		*/
}




@media screen and (max-width: 385px) and (max-height: 765px) {
	.nav__main{
		padding-top: 180px;
	}
	.nav__main a {
		font-size: 30px;
	}
}



@media screen and (max-width: 385px) and (max-height: 650px) {
	.nav__main{
		padding-top: 180px;
	}
	.nav__main a {
		font-size: 27px;
	}
	.nav__bottom div{
		padding-top: 10px;
   		 padding-bottom: 10px;
	}
}


@media screen and (max-width: 385px) and (min-height: 765px) {
	
	.nav__main a {
		font-size: 30px;
	}
}