/* Individual transforms keep the source transforms and anchored sections intact. */
#sweeple .s-motion-target {
  translate: 0 calc(var(--s-motion-enter-y, 0px) + var(--s-motion-parallax-y, 0px) + var(--s-motion-float-y, 0px));
  opacity: var(--s-motion-opacity, 1);
}
#sweeple .s-motion-art { scale: var(--s-motion-scale, 1); }
#sweeple .s-motion-running,
#sweeple .s-motion-active { will-change: translate, opacity; }
#sweeple .s-motion-art.s-motion-running { will-change: translate, opacity, scale; }
#sweeple.s-motion-enabled .s-btn > .s-mark {
  transition: rotate .32s ease, scale .32s ease;
}
#sweeple.s-motion-enabled .s-btn .s-arrow > img { transition: translate .28s ease; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #sweeple.s-motion-enabled .s-btn:hover > .s-mark { rotate: -7deg; scale: 1.06; }
  #sweeple.s-motion-enabled .s-btn:hover .s-arrow > img { translate: 2px 0; }
}
@media (prefers-reduced-motion: reduce) {
  #sweeple .s-motion-target { translate: none !important; opacity: 1 !important; }
  #sweeple .s-motion-art { scale: none !important; }
  #sweeple .s-motion-running,
  #sweeple .s-motion-active { will-change: auto; }
  #sweeple.s-motion-enabled .s-btn > .s-mark,
  #sweeple.s-motion-enabled .s-btn .s-arrow > img { transition: none; rotate: none; scale: none; translate: none; }
}
