.sfw-service-hover::before {
  content: "";
  position: absolute;
  inset: 0;
	/* @FELIX -> hier drunter kannst du statt "#000" jede Farbe wie gewohnt wählen, z.B. #434343 */
  background: linear-gradient(to top, #769dad 50%, transparent 50%);
  z-index: 1;
  transition: background-position 0.5s ease;
  background-size: 100% 201%;
  background-position: bottom;
  pointer-events: none;
	border-radius: 0 16px 160px 0 / 0 64px 130px 0;
}

.sfw-service-hover{
	border-radius: 0 16px 160px 0 / 0 64px 130px 0;
}

.sfw-service-hover h2{
	z-index: 3;
	position: relative;
	color: #fff;
	background: unset;
	font-style: oblique;
	color: #fff;
	-webkit-text-fill-color: #fff;
	/*
	background-size: 400% 400% !important;
	background: linear-gradient(-45deg, #1E7F9C, #83C1CD, #A6D8E2, #D3F3F8);
	animation: gradientAnimation 5s ease infinite;
	font-style: normal !important;
	 -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
	transition: background 0.3s ease;
	*/
}

.sfw-service-hover .image-grow img{
	width: 30% !important;
	transition: width 0.5s ease, opacity 0.5s ease;
	opacity: 0 !important;
}

.sfw-service-hover p{
	opacity: 0 !important;
	transition: 0.5s ease;
}

.sfw-service-hover:hover p{
	opacity: 1 !important;
}

.sfw-service-hover .image-grow{
	z-index: 5 !important;
}

.sfw-service-hover:hover .image-grow img{
	width: 62% !important;
	opacity: 1 !important;
	z-index: 3;
}

.sfw-service-hover:hover h2{
	/*
	background: unset !important;
	font-style: oblique !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff;
	*/
	background-size: 400% 400% !important;
	background: linear-gradient(-45deg, #1E7F9C, #83C1CD, #A6D8E2, #D3F3F8);
	animation: gradientAnimation 5s ease infinite;
	 -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
	transition: background 0.3s ease;
}

.sfw-service-hover{
	background-size: 400% 400% !important;
	/*background: linear-gradient(-45deg, #1E7F9C, #83C1CD, #A6D8E2, #D3F3F8);
	animation: gradientAnimation 5s ease infinite;*/
	background: #fff;
}


.sfw-service-hover::after{
	content: '';
	height: 12px;
	/*
	background: linear-gradient(-45deg, #1E7F9C, #83C1CD, #A6D8E2, #D3F3F8);
	animation: gradientAnimation 5s ease infinite;
	background-size: 400% 400% !important;
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 4;
	*/
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 4;
	background: #2f809c;
	
}


@keyframes gradientAnimation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}



.sfw-service-hover:hover::before {
  background-position: top; 
}