/*
 * AA Landing Page 9.10.5 — direct GPU scroll motion.
 *
 * Scroll position is mapped directly to CSS custom properties in one rAF.
 * There is no CSS transform transition and no spring that chases a delayed
 * target. A short velocity tail may continue after input and then stops.
 */

.aail-site .aail-parallax-item,
.aail-fragment .aail-parallax-item {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Do not reserve compositor layers for the whole page forever. Promote only
   while the runtime is actually receiving scroll input / settling a tail. */
.aail-site .aail-about-parallax,
.aail-fragment .aail-about-parallax,
.aail-site .aail-two-columns > .aail-panel-parallax-item,
.aail-fragment .aail-two-columns > .aail-panel-parallax-item {
  will-change: auto !important;
}

.aail-site .aail-about-parallax.aail-parallax-active,
.aail-fragment .aail-about-parallax.aail-parallax-active,
.aail-site .aail-two-columns > .aail-panel-parallax-item.aail-parallax-active,
.aail-fragment .aail-two-columns > .aail-panel-parallax-item.aail-parallax-active {
  will-change: transform !important;
}

@media (min-width: 1021px) {
  .aail-site .aail-two-columns > .aail-panel-parallax-item,
  .aail-fragment .aail-two-columns > .aail-panel-parallax-item {
    --aail-parallax-x: 0px;
    --aail-parallax-y: 0px;
    transform: translate3d(0, var(--aail-parallax-y), 0) !important;
    transform-origin: 50% 50%;
  }
}

/* Mobile stays static by default. It can be enabled explicitly in the plugin. */
@media (max-width: 1020px) {
  .aail-site:not([data-panel-motion-mobile="1"]) .aail-two-columns > .aail-panel-parallax-item,
  .aail-fragment:not([data-panel-motion-mobile="1"]) .aail-two-columns > .aail-panel-parallax-item {
    --aail-parallax-y: 0px !important;
    transform: none !important;
    will-change: auto !important;
  }

  .aail-site[data-panel-motion-mobile="1"] .aail-two-columns > .aail-panel-parallax-item,
  .aail-fragment[data-panel-motion-mobile="1"] .aail-two-columns > .aail-panel-parallax-item {
    transform: translate3d(0, var(--aail-parallax-y, 0px), 0) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .aail-site .aail-two-columns > .aail-panel-parallax-item,
  .aail-fragment .aail-two-columns > .aail-panel-parallax-item,
  .aail-site .aail-about-parallax,
  .aail-fragment .aail-about-parallax {
    --aail-parallax-x: 0px !important;
    --aail-parallax-y: 0px !important;
    transform: none !important;
    will-change: auto !important;
  }
}
