.service-grid__inner {
 display: flex;
 gap: 5rem;
}

.service-grid__list {
 flex: 1; /* nimmt automatisch die Höhe */
 display: flex;
 flex-direction: column;
}

.service-grid__item {
 display: flex;
 align-items: center;
 gap: 1rem;
 cursor: pointer;
 padding: 20px 0;
 border-bottom: 1px solid rgba(255, 255, 255, 0.3);
 transition: 0.3s;
}

.service-grid__item:hover {
 background-color: rgba(17, 160, 147, 0.2);
}

.service-grid__icon img {
 height: 120px;
 width: 120px;
 object-fit: contain;
}

.service-grid__content h2 {
 margin: 0;
}

.service-grid__images {
 flex: 1; /* gleiche Höhe wie linke Spalte */
 display: grid;
 grid-template-rows: repeat(2, 1fr); /* 3 Bilder aufteilen */
 gap: 1rem;
}

.service-grid__image--objekt_und_ladenbau {
 grid-area: 1 / 1 / 2 / 2;
}

.service-grid__image--wohnen {
 grid-area: 1 / 2 / 3 / 3;
}

.service-grid__image--handel {
 grid-area: 2 / 1 / 3 / 2;
}

.service-grid__image img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 border-radius: 10px;
 box-shadow: rgba(255, 255, 255, 0.3) 0px 0px 10px;
}

.service-grid__image {
 opacity: 0.5;
 transition: 0.3s;
}

.service-grid__image.active {
 opacity: 1;
 z-index: 2;
}

@media (max-width: 920px) {
 .service-grid__icon img {
  height: 100px;
  width: 100px;
  object-fit: contain;
 }
}

@media (max-width: 768px) {
 .service-grid__inner {
  display: flex;
  gap: 5rem;
  flex-direction: column;
 }

 .service-grid__image {
  opacity: 1;
  transition: 0.3s;
 }
}
