/* Quiet scroll reveal. home-reveal.js tags targets with .rv / .rv-media and walks them through
   .is-in (transitioning) to .is-done (released). The !important rules only exist before .is-done,
   so each element's own transforms, transitions and hover states take over once it has settled. */

:root {
  --rv-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --rv-shift: 18px;
  --rv-duration: 0.9s;
  --rv-media-duration: 1.2s;
}

@media (prefers-reduced-motion: no-preference) {
  html.rv-ready .rv:not(.is-in) {
    opacity: 0 !important;
    transform: translate3d(0, var(--rv-shift), 0) !important;
  }

  html.rv-ready .rv:not(.is-done) {
    will-change: transform, opacity;
  }

  /* Settles on `none` (not translateY(0)) so revealed wrappers never become a containing block. */
  html.rv-ready .rv.is-in:not(.is-done) {
    transition:
      opacity var(--rv-duration) var(--rv-ease) var(--rv-delay, 0ms),
      transform var(--rv-duration) var(--rv-ease) var(--rv-delay, 0ms) !important;
  }

  html.rv-ready .rv-media:not(.is-in) img {
    opacity: 0.85 !important;
    transform: scale(1.03) !important;
  }

  html.rv-ready .rv-media:not(.is-done) img {
    will-change: transform, opacity;
  }

  html.rv-ready .rv-media.is-in:not(.is-done) img {
    transition:
      opacity var(--rv-media-duration) var(--rv-ease) var(--rv-delay, 0ms),
      transform var(--rv-media-duration) var(--rv-ease) var(--rv-delay, 0ms) !important;
  }
}