/* Motion is an enhancement only: content is visible before this stylesheet/JS. */
html.gap-motion-ready [data-gap-motion][data-gap-reveal='pending'],
html.gap-motion-ready [data-gap-motion] [data-gap-reveal='pending'] {
  opacity: 0;
  transform: translate3d(0, var(--gap-reveal-distance, 1.25rem), 0);
  transition:
    opacity var(--gap-reveal-duration, 600ms) var(--gap-reveal-ease, cubic-bezier(.22, 1, .36, 1)),
    transform var(--gap-reveal-duration, 600ms) var(--gap-reveal-ease, cubic-bezier(.22, 1, .36, 1));
  transition-delay: calc(var(--gap-reveal-index, 0) * var(--gap-reveal-stagger, 85ms));
}

html.gap-motion-ready [data-gap-motion][data-gap-reveal='visible'],
html.gap-motion-ready [data-gap-motion] [data-gap-reveal='visible'] {
  opacity: 1;
  transform: none;
}

.gap-gif-field__item {
  animation: gap-gif-field-enter var(--gap-gif-life, 3500ms) linear both;
  pointer-events: none;
  position: absolute;
  transform: translate(-50%, -50%);
  will-change: opacity, transform;
}

[data-gap-slider] [data-gap-slider-prev]:disabled,
[data-gap-slider] [data-gap-slider-next]:disabled { cursor: default; opacity: .38; }

@keyframes gap-gif-field-enter {
  0% { opacity: 0; transform: translate(-50%, -44%) scale(.88); }
  12%, 80% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -56%) scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
  html.gap-motion-ready [data-gap-motion][data-gap-reveal],
  html.gap-motion-ready [data-gap-motion] [data-gap-reveal] { opacity: 1; transform: none; transition: none; }
  .gap-gif-field__item { animation: none; }
  [data-gap-slider] .gap-media-slider__viewport { scroll-behavior: auto; }
}
