/* ---- Swiper Galerie ---- */
.swiper-container {
  width: 100%;
  max-width: 800px;  /* Passe die maximale Breite nach Wunsch an */
  margin: 0 auto;
  padding: 0.5rem 0 0 0;   /* Wichtig für den Coverflow-Effekt */
  overflow: hidden; /* Erlaubt es den seitlichen Bildern, den Container zu überragen */
}

.swiper-slide {
  /* Die Breite eines einzelnen Slides wird automatisch anhand des Bildes bestimmt */
  width: auto;
  /* Zentriert das Bild innerhalb des Slides */
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  /* Das Bild wird nicht verzerrt und füllt den verfügbaren Platz aus */
  display: block;
  width: 100%;
  height: auto;  /* Feste Höhe für alle Bilder, sorge für einheitliche Größe */
  object-fit: contain; /* Bilder werden zugeschnitten, um die Box auszufüllen */
  border-radius: 30px; /* Abgerundete Ecken für einen modernen Look */
  border: 5px solid #e6bfc1; /* 2px dick, durchgezogen, Farbe deines Heroes */
}

/* ---- Swiper Slide Schatten (Coverflow) ---- */
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.6) !important; /* Farbe und Transparenz */
  border-radius: 30px; /* Gleiche Rundung wie die Bilder */
  transform: scale(0.98); /* Schatten etwas kleiner als das Bild */
}

/* Styling für die Navigationspfeile */
.swiper-button-next,
.swiper-button-prev {
  color: #e6bfc1 !important; /* Deine Farbe */
  width: 20px;
  height: 80px;
}
