.main-swiper .swiper-slide {
display: flex;
justify-content: center;
align-items: center;
}

/* PHONE WRAPPER */
.phone {
  position: relative;
  width: 100%;
  max-width: 360px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .phone {
    width: 82vw;
    max-width: none;
  }
}

/* VIDEO IM SCREEN (pixelgenau berechnet) */
.phone-video {
position: absolute;
top: 4.3%;
left: 13.3%;
width: 75.4%;
height: 89.3%;
object-fit: contain;
object-position: top;
background: black;
}

/* IPHONE FRAME */
.phone-frame {
position: relative;
width: 100%;
display: block;
pointer-events: none;
}

/* THUMBS bleiben unverändert */
.thumbs-swiper .swiper-slide {
opacity: 0.5;
cursor: pointer;
}

.thumbs-swiper .swiper-slide-thumb-active {
opacity: 1;
}

.main-swiper,
.thumbs-swiper {
  width: 100%;
  max-width: 1140px;
  margin-left: auto;
  margin-right: auto;
}

.thumbs-swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}

.main-swiper {
margin-bottom: 20px;
}

.phone-video {
  transform: scale(1.01);
}

/* PLAY OVERLAY exakt im Screen-Bereich */
.play-overlay {
  position: absolute;
  top: 4.3%;
  left: 13.3%;
  width: 75.4%;
  height: 89.3%;

  display: flex;
  justify-content: center;
  align-items: center;

  z-index: 2;
  
  pointer-events: none;

  transition: opacity 0.2s ease;
}

/* ▶ Button-Kreis */
.play-button {
  width: 70px;
  height: 70px;
  background: rgba(0,0,0,0.6);
  border-radius: 50%;
  position: relative;
}

/* ▶ Dreieck */
.play-button::before {
  content: '';
  position: absolute;
  left: 26px;
  top: 20px;

  border-style: solid;
  border-width: 15px 0 15px 22px;
  border-color: transparent transparent transparent white;
}

/* Hover-Effekt */
.play-overlay:hover .play-button {
  background: rgba(0,0,0,0.8);
}

/* Ausblenden */
.play-overlay.hidden {
  opacity: 0;
}

@media (max-width: 768px) {

  .container {
    max-width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

}