/*------------------------INFO-BOXEN------------------------*/

.acf-lehr-boxen-wrapper {
display: flex;
  gap: 4%;
  margin: 2rem 0;
  align-items: stretch;
  padding: 20px 6%
}

.acf-lehr-box {
  flex: 1;
  padding: 1rem;
  background-color: #f0f0f0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
	padding: 2%;
	 transition: transform 0.2s ease;
}

.acf-lehr-box h4 {

  font-family: 'Misrow', sans-serif;
  letter-spacing: 0.056em;
  font-weight: normal;
  font-size: 1.2vw;
  line-height: 143%;
  padding: 5% 5% 7% 6%;
	color: var(--wws-dunkelgruen);
	 transition: transform 0.2s ease;
}

.acf-lehr-boxen-wrapper a {
  text-decoration: none;
  color: white;
  margin-right: 2px;
}

.acf-lehr-box p {

  font-size: 1.3vw;
  font-weight:600 ;
  color: var(--wws-dunkelgruen);
  padding: 0px 8%;

  line-height: 121%;
  margin: 11px 0;
}

.acf-lehr-boxen-wrapper strong {
  font-family: Misrow;
  font-weight: normal;
  font-size: 1.6vw;
  letter-spacing: 1.7px;
	color:white;
}


.box1 {	background-image:url('/wp-content/uploads/images/lehr-box1.png');background-size:100% 100%;transition: 0.3s ease;}
.box2 {	background-image:url('/wp-content/uploads/images/lehr-box2.png');background-size:100% 100%;transition: 0.3s ease;}
.box3 {	background-image:url('/wp-content/uploads/images/lehr-box3.png');background-size:100% 100%;transition: 0.3s ease;}
.box1 h4 {background-image: url('/wp-content/uploads/images/box-h4-1.png'); background-size: 100% 100%;}
.box2 h4 {background-image: url('/wp-content/uploads/images/box-h4-2.png'); background-size: 100% 100%;}
.box3 h4 {background-image: url('/wp-content/uploads/images/box-h4-3.png'); background-size: 100% 100%;}



.acf-lehr-boxen-wrapper strong:hover {transform:scale(1.2);}


.acf-lehr-box:hover {transform:scale(1.01);}
.acf-lehr-box:hover  h4{transform:scale(1.06);}






@media (max-width: 700px) {
  .acf-lehr-boxen-wrapper {
    flex-direction: column;
  }
}


/*------------------------PAGE HEADER------------------------*/
#page-header {

  background-size: 100% 100%;
  background-color: var(--wws-hellgruen);
height: 200px;
margin-top: 240px;
position:relative;
 	
}

.page-header-text {
background-image: url('/wp-content/uploads/images/lehr-bg1.png');
  position: relative;
  background-size: 100% 100%;
  width: 497px;
  padding: 24px 2px 11px 31px;
  z-index: 15;
  margin-left: 46.9%;
  top: -44px;
  height: 264px;
}

.page-header-text h1 {
  font-size: 96px;
  line-height: 100%;
  color: white;
  margin: 0;
}

.page-header-text h2 {
font-size: 64px;
  letter-spacing: 1px;
  color: white;
  margin: 1px;
  line-height: 100%;
}
/*-----------------------------BILD-GALLERIE----------------------*/

.acf-lehr-bild {
position: relative;
  width: 75%;
  padding: 0% 3% 3% 3%;

  text-align: left;
  margin-top: 0;
  margin-left: 3%;
  margin-bottom: 3%;
  max-width: 1300px;
}




/*-----------------------------COLLAGE----------------------*/
.collage-wrapper2 {
  position: absolute;
  width: 32%;
  overflow: hidden;
top: 963px;
  right: -130px;
  aspect-ratio: 432/514;
}

.collage-wrapper {
position: absolute;
  width: 672px;
  overflow: hidden;
  top: -106%;
  left: 16%;
  aspect-ratio: 771 / 708;
}

.collage-wrapper2 img.layer,
.collage-wrapper img.layer {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  transition: transform 0.2s ease;
  pointer-events: none;
	padding: 20px;
}


/*------------------------CTA Fortbildung------------------------*/

.termine-wrapper {
position: absolute;
  width: 22%;
  right: 1%;
  height: auto;
	top: 18%;
}

.cta.cta-fortbildung {
width: 100%;
  position: relative;

}

.cta-fortbildung img {
width: 50%;  
  margin-left: 44%;
  margin-bottom: -8%;
  z-index: 9;
position: relative;
}

.cta-fortbildung .termine {
color: var(--wws-dunkelrot);
  font-size: 27px;
  background-color: var(--wws-gelb);
padding: 5% 4% 5% 4%;
  line-height: 111%;
  margin: 0;
  font-weight: normal;
  z-index: 8;
  font-family: misrow;
  text-align: right;
  clip-path:polygon(-0.22% 22.29%, 21.46% 22.98%, 20.54% 0.15%, 100% 0%, 100% 100%, 22.51% 100.31%, 20.4% 66.61%, 0.86% 64.34%);
  letter-spacing: 0.04em;
  position: relative;
  display: block;
}

.cta-fortbildung .termine strong {
font-size: 1.9vw;
  display: inline-block;
  margin: 15px 0;
  line-height: 100%;
}

.cta-fortbildung .termine p {
  margin-bottom: 10px;
	line-height: 105%;
	font-size: 1.4vw;


}

.cta-fortbildung h4.mehrinfos {
color: white;
  font-size: 1.5vw;
  background-color: var(--wws-dunkelrot);
  padding: 9px 13px 8px 20px;
  line-height: 106%;
  font-weight: normal;
  z-index: 19;
  text-align: right;
  display: inline-block;
  position: relative;
  margin-left: 52%;
  margin-top: -10%;
}


/*------------------------CTA------------------------*/
a.cta {text-decoration: none;}

.cta.cta-mail-m {
	display:none;
position: relative;
  width: fit-content;
  flex-direction: column;
  align-items: flex-end;
  margin: 0 auto;
margin-top: 81px;
  margin-bottom: 110px;
}

.cta.cta-mail {
  position:absolute;
  top: 0px;
width: 28%;
  right: 1%;
display: flex;
  flex-direction: column;
  align-items: flex-end; /* rechtsbündig */
}

.cta-mail-m img, .cta-mail img {
  width: 1em;
  z-index: 20;
  margin-right: 7px;
}


.cta h4.highlight1 {
  color: var(--wws-dunkelrot);
  font-size: 1.46vw;
  background-color: var(--wws-gelb);
  line-height: 100%;
  margin: 0;
  font-weight: normal;
  z-index: 19;
  text-align: right;
	display:inline;
	padding: 16px 17px;
	margin-bottom: -11px;
}

.cta h4.highlight2 {
  color: white;
  font-size: 1.46vw;
  line-height: 108%;
  background-color: var(--wws-dunkelrot);
  display:inline;
  margin: 0;
  font-weight: normal;
  z-index: 19;
  letter-spacing: 2px;
  text-align: right;
	padding: 4px 13px;
  border: solid 1px var(--wws-dunkelrot)aliceblue;
  margin-right: 24px;
	margin-bottom: -1px;
}

@keyframes wobble-cta {
  0% {
    transform: translateX(0);
  }
  15% {
    transform: translateX(-4px) rotate(-1deg);
  }
  30% {
    transform: translateX(3px) rotate(1deg);
  }
  45% {
    transform: translateX(-2px) rotate(-0.5deg);
  }
  60% {
    transform: translateX(1px) rotate(0.5deg);
  }
  75% {
    transform: translateX(-1px);
  }
  100% {
    transform: translateX(0) rotate(0);
  }
}

.cta {
  display: inline-block; /* wichtig für transform */
  transition: transform 0.3s ease;
}

.cta:hover {
  animation: wobble-cta 0.6s ease;
}


/*-----------------------------TEXT-BLÖCKE---------------------*/
.text-block1 {
  position:relative;
 width: 75%;
padding: 3% 5%;
  max-width: 1363px;
  margin-top: 0px;
  text-align: left;
  margin-top: 80px;
  margin-left: 3%;

}

.text-block2 {
  width: 100%;
  padding: 3% 3% 1.5% 3%;
  max-width: 1410px;
  margin: 0 auto;
  text-align: center;
}




.text-block p, .text-block a{
  font-size: 28px;
  font-family: Source Sans Pro;
  font-weight: 600;
  letter-spacing: 0.020em;
  line-height: 143%;
 text-decoration: none;
  color: var(--wws-dunkelgruen);
	transition:0.1s;
}

.text-block a:hover{
color: var(--wws-dunkelrot);
}


.text-block strong {
  margin-left: -2%;	
  font-family: Misrow;
  font-weight: normal;
  font-size: 36px;
  letter-spacing: 1.7px;
}

/*-----------------------------TEXT-BLÖCKE2---------------------*/
.text-block h4 {
font-size: 36px;
  margin-top: 19px;
margin-left: -4%;
  letter-spacing: 3px;
  font-weight: normal;
  margin-bottom: 16px;
  display: inline-block;
  background-color: var(--wws-dunkelgruen);
 padding: 17px 19px;

  color: white;
clip-path: polygon( 0.6% 13%, 4.7% 13%, 4.7% 0%, 58.8% 0%, 58.8% 13%, 98.8% 13%, 98.8% 95%, 59% 95%, 59% 102%, 5.5% 102%, 5.5% 90%,0.6% 90%);
}

.text-block h4 + p {
margin-top: 13px;
  margin-bottom: 0px
}




/*----------Responsiv----------*/


@media (max-width: 575.98px) {
		#primary {  margin-top: 100px;}
	#page-header { height: 125px;margin-top: 58vh;}
	.page-header-text {width: 231px;    height: 110px;    padding: 12px 2px 9px 15px;    top: -10%;   margin-left: auto;    margin-right: 6%;}
	.page-header-text h2 { font-size: 24px;}
	.page-header-text h1 { font-size: 36px;}
	.collage-wrapper {  width: 342px;    margin-left: -110px;   top: -118%;}
	
	.text-block p, .text-block a, .text-block strong { font-size: 24px;}
		.text-block h4 {font-size: 30px;}
		.text-block2 {margin-top: 125px;}
	.text-block {width:100%;margin: 10% 0;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
		
	.termine-wrapper {  width: 62%;  top: 6vh;}
	.cta-fortbildung .termine strong {  font-size: 5.4vw;margin: 7px 0;}
	.cta-fortbildung .termine p {  font-size: 4vw;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 4vw;margin-left: 45%;}
	.cta-fortbildung .termine {  padding: 3% 4% 3% 4%;}
	
	.acf-lehr-bild {  width: 96%;    margin-left: 2%;    margin-right: 2%; }
	
		
	.acf-lehr-box {  flex: 1 0 100%;  margin-bottom: 8%;}
	.acf-lehr-boxen-wrapper{flex-wrap: wrap;    width: 100%;    padding: 0 8%;    margin-left: 0%;}
	.acf-lehr-box h4 { font-size: 4.5vw;    padding: 5% 4% 6% 6%;}
	.acf-lehr-box p {  font-size: 4.5vw;	}
	.acf-lehr-box strong {  font-size: 5vw;	}
		.cta.cta-mail-m h4{font-size:3.5vw;}
}


@media (min-width: 576px) and (max-width: 767.98px) {
		#primary {  margin-top: 100px;}
	#page-header { height: 130px; margin-top: 54%;}
	.page-header-text { width: 291px;    height: 154px;   padding: 18px 2px 11px 25px; top: -15%;}
	.page-header-text h2 { font-size: 34px;}
	.page-header-text h1 { font-size: 52px;}
	.collage-wrapper {  width: 442px;    left: 0%;    top: -118%;}
	
	
	.text-block p, .text-block a, .text-block strong { font-size: 24px;}
	.text-block h4 {font-size: 30px;}
	.text-block {width: 93%;margin: 10% 3%;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
	
	.termine-wrapper {  width: 42%;  top: 1%;}
	.cta-fortbildung .termine strong {  font-size: 3.4vw;margin: 7px 0;}
	.cta-fortbildung .termine p {  font-size: 3vw;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 3vw;margin-left: 45%;}
	.cta-fortbildung .termine {  padding: 3% 4% 3% 4%;}
	
	.acf-lehr-bild {  width: 90%;   margin-left: 5%;   margin-right: 5%; }
	
	.acf-lehr-box {  flex: 1 0 100%;  margin-bottom: 3%;}
	.acf-lehr-boxen-wrapper{flex-wrap: wrap;    width: 100%;    padding: 0 8%;    margin-left: 0%;}
	.acf-lehr-box h4 { font-size: 4.5vw;    padding: 5% 4% 6% 6%;}
	.acf-lehr-box p {  font-size: 3.4vw;	}
	.acf-lehr-box strong {  font-size: 4vw;	}
	.cta.cta-mail-m h4{font-size:3.5vw;}
		 
}

@media (min-width: 768px) and (max-width: 991.98px) {
	#primary {  margin-top: 100px;}
	#page-header{margin-top:47%}
	.page-header-text { width: 361px;    height: 194px;    padding: 18px 2px 11px 25px;}
	.page-header-text h2 { font-size: 45px;}
	.page-header-text h1 { font-size: 66px;}
	.collage-wrapper {  width: 542px;  left: 3%;}
	
	  .text-block p, .text-block a, .text-block strong { font-size: 28px;}
	  .text-block h4 {font-size: 36px;}
	.text-block {width: 93%;margin: 10% 3%;}
	
	.cta.cta-mail-m{display:flex;}
	.cta.cta-mail{display:none}
	.collage-wrapper2 {display:none;}
	
	.termine-wrapper {  width: 32%;  top: 1%;}
	.cta-fortbildung .termine strong {  font-size: 2.6vw;}
	.cta-fortbildung .termine p {  font-size: 2.3vw;}
	.cta-fortbildung h4.mehrinfos  {  font-size: 2.3vw;margin-left: 45%;}
	
	.acf-lehr-bild {  width: 90%;   margin-left: 5%;   margin-right: 5%; }
	
	.acf-lehr-box {  flex: 1 0 44%;  margin-bottom: 3%;}
	.acf-lehr-boxen-wrapper{flex-wrap: wrap;    width: 100%;    padding: 0 5%;    margin-left: 0%;}
	.acf-lehr-box h4 {  font-size: 2vw;	}
	.acf-lehr-box p {  font-size: 1.8vw;	}
	.acf-lehr-box strong {  font-size: 2.2vw;	}
	.acf-lehr-box:nth-child(3) { flex: 0 0 50%; margin: 2% auto 0 auto;}
	
	.cta.cta-mail-m h4{font-size:2.5vw;}
}


@media (min-width: 992px) and (max-width: 1199.98px) {
	.page-header-text {  width: 417px;  height: 224px; padding: 24px 2px 11px 25px;}
	.page-header-text h2 { font-size: 54px;}
	.page-header-text h1 { font-size: 76px;}
	.collage-wrapper {   left: 6%;}
  .text-block p, .text-block a, .text-block strong { font-size: 28px;}
	  .text-block h4 {font-size: 30px;}
	
		.collage-wrapper2 {  width: 40%;}

.acf-lehr-box {  flex: 1 0 44%;  margin-bottom: 3%;}
	.acf-lehr-boxen-wrapper{flex-wrap: wrap;    width: 91%;    padding: 0 3%;    margin-left: 3%;}
	.acf-lehr-box h4 {  font-size: 2vw;	}
	.acf-lehr-box p {  font-size: 1.8vw;	}
	.acf-lehr-box strong {  font-size: 2.2vw;	}
	.acf-lehr-box:nth-child(3) { flex: 0 0 50%; margin: 2% auto 0 auto;}
}


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

	.collage-wrapper {   left: 6%;}
	.collage-wrapper2 {  width: 35%;}
	
	
	}

@media (min-width: 1400px)  {
	
}


@media  (pointer: coarse) and (max-width: 991px) {
	.box1,.box2,.text-block-alternativ * { transform: none !important;}
	.box2:hover,.box1:hover {  background-size: 100% 100%;}

}

/* Korrekturen */
.startseite-content {  overflow: hidden;position: relative;}
