/* iPhone frame container styles - optimized for 886x1920 video */
.phone-container {
  position: relative;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  aspect-ratio: 886/1920; /* Using exact video dimensions */
  transform: translate3d(0,0,0);
  will-change: transform;
  filter: drop-shadow(0 20px 30px rgba(0, 22, 40, 0.3));
}
.phone-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
}
.phone-content {
  position: absolute;
  top: 1.9%;
  left: 4%;
  width: 92%;
  height: 96.2%;
  border-radius: 12px;
  overflow: hidden;
  z-index: 1;
  background-color: #000;
}
.phone-content video {
  width: 100%;
  height: 100%;
  object-fit: fill; /* Changed to fill to ensure video takes up entire space */
  display: block; /* Eliminates any potential inline spacing issues */
}
/* Bootstrap responsive breakpoints */
@media (max-width: 991.98px) {
  .phone-container {
    max-width: 350px;
  }
}
@media (max-width: 767.98px) {
  .phone-container {
    max-width: 320px;
  }
}
@media (max-width: 575.98px) {
  .phone-container {
    max-width: 280px;
  }
}