/* Service photos and motion share their existing frame; the hero is untouched. */
.service-mobile-media { display: none; }
.service-motion-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  pointer-events: none;
  transition: none;
}
.service-visual[data-motion-state="playing"] > .service-motion-video,
.service-mobile-media[data-motion-state="playing"] > .service-motion-video {
  opacity: 1;
  transition: opacity .45s ease;
}
[data-motion-service="laser"] > .service-motion-video { object-position: center; }
.service-visual::after { z-index: 1; pointer-events: none; }
.service-visual .image-corner { z-index: 2; pointer-events: none; }

@media (max-width: 720px) {
  .service-visual { display: none; }
  .service-mobile-media {
    display: block;
    position: relative;
    width: 100%;
    margin: 0 0 22px;
    overflow: hidden;
    background: var(--ink);
  }
  .service-mobile-media > .service-mobile-image {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
   
    object-fit: contain;
    margin: 0;
  }
  .service-mobile-media > .service-motion-video { object-fit: contain; }
}

@media (prefers-reduced-motion: reduce), print {
  .service-motion-video { display: none; }
}