/* Move each complete rounded video surface, using the same axes as pointer tilt. */
.featured [data-tilt] .media-stage { perspective: 1100px; }
.featured [data-tilt] .media-surface {
  transform-origin: center;
  backface-visibility: hidden;
  transform: translate3d(var(--idle-shift-x, 0px), var(--idle-shift-y, 0px), 0)
    rotateZ(var(--idle-roll, 0deg))
    rotateX(calc(var(--tilt-x, 0deg) + var(--idle-tilt-x, 0deg)))
    rotateY(calc(var(--tilt-y, 0deg) + var(--idle-tilt-y, 0deg)))
    scale(calc(var(--tilt-scale, 1) + var(--idle-scale, 0)));
}

@media (prefers-reduced-motion: reduce), (any-hover: none), (any-pointer: none) {
  .featured [data-tilt] .media-surface { transform: none !important; }
}