
#gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1rem;
}

/* Ab Tablet runter auf 2 Spalten */
@media (max-width: 1199.98px) {
  #gallery {
    grid-template-columns: repeat(2, 1fr);
  }
}


    .gallery-item {
      position: relative;
      overflow: hidden;
      border-radius: 12px;
      opacity: 1;
      transform: scale(1);
      transition: opacity 0.4s ease, transform 0.4s ease;
    }
    .fade-out {
      opacity: 0 !important;
      transform: scale(0.9);
    }
    .fade-in {
      opacity: 1 !important;
      transform: scale(1);
    }
    .gallery-item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .gallery-item:hover img {
      transform: scale(1.05);
      transition: transform 0.4s ease;
    }