/* Custom Ansprechpartner Styling */


.grid.ansprechpartner .flex {
    display: flex; 
  	flex-wrap: wrap;
  	gap: 20px;
	justify-content: center; 
	}
.grid.ansprechpartner .flex .wrap {
    width: calc(33% - 18px); /* 3 pro Zeile */
	}

.grid.ansprechpartner .frame-2 .flex {
  display: flex;
  justify-content: center; 
  align-items: center;     
  gap: 40px;            
  flex-wrap: nowrap;       
}

.grid.ansprechpartner .frame-2 .wrap {
  width: 40%;
  max-width: 380px;  
}

.grid.ansprechpartner .flex .ce-gallery  {
	background:#d4d4d4;
}
.grid.ansprechpartner .flex .ce-gallery img {
    width:auto;
    opacity: .75;
    width: 100%;
    height: auto;
    border-radius: 50%;
	border:0;
	margin:0;

}

.grid.ansprechpartner .frame {
    box-sizing: border-box;
	margin-bottom:var(--abstand-m);
}

.grid.ansprechpartner .frame p {
    text-align:center;
    padding:3px;
    margin:6px;
}
.grid.ansprechpartner .frame h3 {
    font-family: 'Get Show';
    font-style: normal;
    font-weight: 400;
    font-size: var(--text-xl);
   	color: var(--maincolor-rot);
	margin:40px auto 30px auto;
	padding:0 18vw;
	text-align:center;
	line-height:90%;
	}
.grid.ansprechpartner .frame img {
    padding:0;
}

/* Wrapper für 3D */
.grid.ansprechpartner .wrap {
  perspective: 1000px;
}

/* Flip-Container */
.grid.ansprechpartner .wrap {
  position: relative;
}

.grid.ansprechpartner .wrap .ce-gallery,
.grid.ansprechpartner .wrap .ce-bodytext {
  width: 100%;
  aspect-ratio: 1 / 1;   /* immer quadratisch */
  border-radius: 50%;
  backface-visibility: hidden;
  transition: transform 0.8s ease;
  position: absolute;
  top: 0;
  left: 0;
}

/* Vorderseite (Bild) */
.grid.ansprechpartner .wrap .ce-gallery {
  transform: rotateY(0deg);
  z-index: 2;
}

/* Bild rund */
.grid.ansprechpartner .wrap .ce-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

/* Rückseite */
.grid.ansprechpartner .wrap .ce-bodytext {
  background: var(--maincolor-rot, #c40000); /* rot */
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transform: rotateY(180deg);
  padding: 20px;
  box-sizing: border-box;
}

/* Text Styling */
.grid.ansprechpartner .wrap .ce-bodytext p,
.grid.ansprechpartner .wrap .ce-bodytext strong {
  color: white;
}

/* Hover Effekt */
.grid.ansprechpartner .wrap:hover .ce-gallery {
  transform: rotateY(180deg);
}

.grid.ansprechpartner .wrap:hover .ce-bodytext {
  transform: rotateY(360deg);
}

/* Fix für Layout */
.grid.ansprechpartner .wrap {
  aspect-ratio: 1 / 1;
}



/**********************************************/

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

.grid.ansprechpartner .flex .wrap {
    width: calc(50% - 18px); /* 4 pro Zeile */
	}

}
/**********************************************/

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

.grid.ansprechpartner .flex .wrap {
    width: 100%; /* 4 pro Zeile */
padding:40px;
	}

}