html {
  overflow-x: hidden;
  overflow-x: clip;
}

html.anim-ready [data-anim] {
  opacity: 0;
  transition-property: transform, opacity;
  transition-duration: 700ms;
  transition-timing-function: cubic-bezier(.2, .75, .25, 1);
  will-change: transform, opacity;
}

html.anim-ready [data-anim="pop"] {
  opacity: 0;
  transform: translate3d(0, 20px, 0) scale(.85);
  transition-duration: 600ms;
  transition-timing-function: cubic-bezier(.34, 1.56, .64, 1);
}

html.anim-ready [data-anim="drop"] {
  transform: translate3d(0, -30px, 0);
}

html.anim-ready [data-anim="scale"],
html.anim-ready [data-anim="cards"] {
  transform: scale(.92);
}

html.anim-ready [data-anim="cards"] {
  transform: scale(.8);
}

html.anim-ready [data-anim="zoom"] {
  opacity: 1;
  transform: scale(1.25);
  transition-duration: 1200ms;
}

html.anim-ready [data-anim="tilt"] {
  opacity: .4;
  transform: perspective(900px) rotateX(18deg) translate3d(0, 60px, 0);
  transform-origin: center top;
  transition-duration: 900ms;
}

html.anim-ready [data-anim="text"] {
  transform: translate3d(0, 14px, 0);
}

html.anim-ready [data-anim].anim-in {
  opacity: 1;
  transform: none;
  will-change: auto;
}

html.anim-ready .store-card[data-anim="cards"].anim-in:hover,
html.anim-ready .bundle-card[data-anim="cards"].anim-in:hover {
  transform: translateY(-3px);
}

html.anim-ready .pkg[data-anim="cards"].anim-in:hover {
  transform: translateY(-2px);
}

html.anim-ready [data-anim="drop"],
html.anim-ready [data-anim="cards"],
html.anim-ready [data-anim="scale"],
html.anim-ready [data-anim="pop"],
html.anim-ready [data-anim="tilt"],
html.anim-ready [data-anim="text"] {
  transition-delay: var(--anim-delay, 0ms);
}

@media (prefers-reduced-motion: reduce) {
  html {
    overflow-x: hidden;
    overflow-x: clip;
  }

  html.anim-ready [data-anim] {
    opacity: 1;
    transform: none;
    transition: none;
    animation: none;
    will-change: auto;
  }
}