/* Smartphone stability patch for the two-row artist wall. */
@media (max-width: 900px) and (pointer: coarse) {
  .hero-photo-wall {
    overflow: hidden !important;
    isolation: isolate;
  }

  .hero-photo-row {
    overflow: hidden !important;
    touch-action: pan-y;
    contain: paint;
  }

  .hero-photo-wall-track {
    display: flex !important;
    width: max-content !important;
    min-width: max-content;
    gap: 8px !important;
    animation: cmw-mobile-wall-left 38s linear infinite both !important;
    -webkit-animation: cmw-mobile-wall-left 38s linear infinite both !important;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    will-change: transform;
  }

  .hero-photo-row.is-bottom .hero-photo-wall-track {
    animation-name: cmw-mobile-wall-right !important;
    -webkit-animation-name: cmw-mobile-wall-right !important;
    animation-duration: 34s !important;
    -webkit-animation-duration: 34s !important;
  }

  .hero-photo-wall-card {
    flex: 0 0 54vw !important;
    width: 54vw;
    min-width: 54vw;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }

  .hero-photo-wall-card img {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }
}

@keyframes cmw-mobile-wall-left {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(calc(-50% - 4px), 0, 0); }
}

@keyframes cmw-mobile-wall-right {
  from { transform: translate3d(calc(-50% - 4px), 0, 0); }
  to { transform: translate3d(0, 0, 0); }
}

@-webkit-keyframes cmw-mobile-wall-left {
  from { -webkit-transform: translate3d(0, 0, 0); }
  to { -webkit-transform: translate3d(calc(-50% - 4px), 0, 0); }
}

@-webkit-keyframes cmw-mobile-wall-right {
  from { -webkit-transform: translate3d(calc(-50% - 4px), 0, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-photo-row {
    overflow-x: auto !important;
  }

  .hero-photo-wall-track {
    animation: none !important;
    -webkit-animation: none !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  .hero-photo-wall-card.is-duplicate {
    display: none;
  }
}