.tech-ref-section {
  position: relative;
  height: 20vh;
  overflow: hidden;
  background: linear-gradient(
    to bottom	,
    rgba(255, 255, 255, 0.85),
    rgba(27, 156, 216, 0.473),
    rgba(255, 255, 255, 0.1)
  );
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeInSection 1.2s ease forwards;
  opacity: 0;
}

/* Animation für das sanfte Einblenden */
@keyframes fadeInSection {
  from {
    opacity: 0;
    transform: translateY(25px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Laufband */
.image-track {
  display: flex;
  align-items: center; /* <-- sorgt für exakte vertikale Zentrierung */
  gap: 15vw;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%; /* <-- nimmt volle Höhe der Section ein */
  transform: translateX(0);
  will-change: transform;
  backface-visibility: hidden;
  -webkit-transform: translateZ(0);
}

/* Logos */
.image-track img {
  height: 60%; /* nimmt ca. 60% der Section-Höhe ein → schön mittig */
  width: auto;
  opacity: 0.85;
  transform: scale(0.95);
  transition: opacity 0.4s ease, transform 0.4s ease;
  filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.25));
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  flex-shrink: 0;
}

/* Hover-Effekt (optional) */
.tech-ref-section:hover .image-track img {
  opacity: 1;
  transform: scale(1);
}

/* Responsiv */
@media (max-width: 1024px) {
  .tech-ref-section {
    height: 20vh;
  }

  .image-track img {
    height: 65%;
  }
}

@media (max-width: 768px) {
  .tech-ref-section {
    height: 20vh;
  }

  .image-track img {
    height: 70%;
  }
}

@media (max-width: 480px) {
  .tech-ref-section {
    height: 15vh;
  }

  .image-track img {
    height: 75%;
  }
}
