.video-montage-assembly .video-mosaic .video-tile {
  opacity: 0;
  transition:
    clip-path 820ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 260ms ease;
  will-change: clip-path, opacity;
}

.video-montage-assembly .video-mosaic .video-tile--master {
  clip-path: inset(0 100% 0 0);
}

.video-montage-assembly .video-mosaic .video-tile--crowd {
  clip-path: inset(100% 0 0 0);
  transition-delay: 190ms;
}

.video-montage-assembly .video-mosaic .video-tile--detail {
  clip-path: inset(0 0 100% 0);
  transition-delay: 380ms;
}

.video-montage-assembly .video-mosaic .video-tile--scale {
  clip-path: inset(0 100% 0 0);
  transition-delay: 570ms;
}

.video-montage-assembly .video-mosaic.is-assembly-active .video-tile {
  clip-path: inset(0);
  opacity: 1;
}

.video-montage-assembly .video-mosaic.is-assembly-complete .video-tile {
  will-change: auto;
}

@media (max-width: 760px) {
  .video-montage-assembly .video-mosaic .video-tile {
    transition-duration: 720ms, 240ms;
  }

  .video-montage-assembly .video-mosaic .video-tile--crowd {
    transition-delay: 150ms;
  }

  .video-montage-assembly .video-mosaic .video-tile--detail {
    transition-delay: 300ms;
  }

  .video-montage-assembly .video-mosaic .video-tile--scale {
    transition-delay: 450ms;
  }
}

@media (prefers-reduced-motion: reduce) {
  .video-montage-assembly .video-mosaic .video-tile {
    clip-path: inset(0);
    opacity: 1;
    transition: none;
  }
}