/* Motion is only added when the browser says it is comfortable for the visitor. */
@media (prefers-reduced-motion: no-preference) {
  [data-reveal] {
    opacity: 0;
    transform: translateY(34px);
    transition: opacity .75s ease, transform .75s cubic-bezier(.2, .7, .2, 1);
  }

  [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

  [data-stagger] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1);
  }

  .is-visible [data-stagger] { opacity: 1; transform: translateY(0); }
  .is-visible [data-stagger]:nth-child(2) { transition-delay: .12s; }
  .is-visible [data-stagger]:nth-child(3) { transition-delay: .24s; }

  .process-image:after { transition: transform 1.1s cubic-bezier(.2, .7, .2, 1); }
  .process.is-visible .process-image:after { transform: skewY(-16deg) translateY(-14px); }
  .project-art { transition: transform .55s ease, filter .55s ease; }
  .project:hover .project-art { transform: scale(.975); filter: saturate(1.18); }
  .button, .nav-cta, .round-link { transition: transform .25s ease, background-color .25s ease; }
  .button:hover, .nav-cta:hover { transform: translateY(-3px); }
  .round-link:hover { transform: rotate(-10deg) translateY(-4px); }
}