@media (max-width: 767px) {
  html {
    scroll-behavior: auto !important;
  }

  body {
    -webkit-overflow-scrolling: touch;
  }

  header,
  nav {
    transform: translateZ(0);
  }

  main img,
  main video,
  main iframe {
    backface-visibility: hidden;
  }

  main a,
  main button {
    touch-action: manipulation;
  }

  main [class*="blur"],
  main [class*="backdrop"] {
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  main [data-live-campaign-card] {
    transform: translateZ(0);
    will-change: transform;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.09), 0 8px 18px rgba(6, 107, 68, 0.06) !important;
  }

  main [data-live-campaign-card] * {
    will-change: auto;
  }

  main [data-live-campaign-image] img {
    transition-duration: 0.25s !important;
  }

  main [data-live-category-badge="1"]::after {
    animation-duration: 5.4s !important;
    animation-timing-function: cubic-bezier(.4, 0, .2, 1) !important;
  }

  main [data-live-progress-fill="1"]::after {
    animation-duration: 2.8s !important;
    animation-timing-function: ease-in-out !important;
  }
}

@media (max-width: 767px) and (hover: none) and (pointer: coarse) {
  main [data-live-campaign-card]:hover {
    transform: translateZ(0) !important;
  }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  main *,
  main *::before,
  main *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}