html[data-reveal-motion="true"] {
  --motion-ease-body: cubic-bezier(.22, .62, .18, 1);
  --motion-ease-soft: cubic-bezier(.24, .56, .16, 1);
  --motion-ease-light: cubic-bezier(.25, .58, .24, 1);
  --motion-ease-material: cubic-bezier(.18, .78, .18, 1);
  --motion-opacity-fast: 620ms;
  --motion-opacity-medium: 1040ms;
  --motion-opacity-slow: 1900ms;
  --motion-move-fast: 1040ms;
  --motion-move-medium: 1740ms;
  --motion-move-slow: 2680ms;
}

html[data-reveal-motion="true"] [data-scroll-reveal] {
  opacity: 0;
  translate: var(--reveal-x, 0) var(--reveal-y, 9px);
  scale: var(--reveal-scale, .992);
  rotate: var(--reveal-rotate, 0deg);
  transform-origin: center center;
  transition:
    opacity var(--reveal-opacity-duration, var(--motion-opacity-medium)) var(--reveal-opacity-ease, var(--motion-ease-light)),
    translate var(--reveal-motion-duration, var(--motion-move-medium)) var(--reveal-ease, var(--motion-ease-body)),
    scale var(--reveal-motion-duration, var(--motion-move-medium)) var(--reveal-ease, var(--motion-ease-body)),
    rotate var(--reveal-motion-duration, var(--motion-move-medium)) var(--reveal-ease, var(--motion-ease-body));
  transition-delay: var(--reveal-delay, 0ms);
  backface-visibility: hidden;
}

html[data-reveal-motion="true"] [data-scroll-reveal].is-revealing {
  will-change: opacity, translate, scale, rotate;
}

html[data-reveal-motion="true"] [data-scroll-reveal].is-revealed {
  opacity: 1;
  translate: 0 0;
  scale: 1;
  rotate: 0deg;
}

html[data-reveal-motion="true"] [data-scroll-reveal].is-done {
  animation: none;
  transition: none;
  will-change: auto;
}

html[data-reveal-motion="true"] [data-scroll-reveal="image"] {
  --reveal-y: 7px;
  --reveal-scale: .992;
  --reveal-opacity-duration: 1080ms;
  --reveal-motion-duration: 1740ms;
}

html[data-reveal-motion="true"] [data-scroll-reveal="image-group"] {
  --reveal-y: 8px;
  --reveal-scale: .994;
  --reveal-opacity-duration: 1160ms;
  --reveal-motion-duration: 1840ms;
}

html[data-reveal-motion="true"] [data-scroll-reveal="hero-image"] {
  --reveal-y: 9px;
  --reveal-scale: .998;
  --reveal-opacity-duration: var(--motion-opacity-slow);
  --reveal-motion-duration: var(--motion-move-slow);
  --reveal-ease: var(--motion-ease-soft);
  --reveal-opacity-ease: cubic-bezier(.32, .48, .2, 1);
}

html[data-reveal-motion="true"] [data-scroll-reveal="hero-image"]:not(.is-revealed) {
  opacity: 0 !important;
  translate: 0 var(--reveal-y, 9px) !important;
}

html[data-reveal-motion="true"] [data-scroll-reveal="text"] {
  --reveal-y: 6px;
  --reveal-scale: 1;
  --reveal-opacity-duration: 860ms;
  --reveal-motion-duration: 1320ms;
  --reveal-ease: var(--motion-ease-light);
}

html[data-reveal-motion="true"] [data-scroll-reveal="photo-wall"] {
  --reveal-x: 0px;
  --reveal-y: 7px;
  --reveal-scale: .994;
  --reveal-opacity-duration: 1160ms;
  --reveal-motion-duration: 1840ms;
  --reveal-ease: var(--motion-ease-body);
}

html[data-reveal-motion="true"] [data-scroll-reveal="ornament"] {
  --reveal-x: 0px;
  --reveal-y: 0px;
  --reveal-scale: 1;
  --reveal-rotate: -64deg;
  --reveal-opacity-duration: 900ms;
  --reveal-motion-duration: 1720ms;
  --reveal-ease: var(--motion-ease-material);
  transform-origin: 50% 50% !important;
  transform-box: border-box;
}

html[data-reveal-motion="true"] [data-scroll-reveal="arrow"] {
  --reveal-y: -8px;
  --reveal-scale: .982;
  --reveal-opacity-duration: 760ms;
  --reveal-motion-duration: 1380ms;
  --reveal-ease: var(--motion-ease-material);
}

html[data-reveal-motion="true"] [data-scroll-reveal="page-link"] {
  --reveal-x: 0px;
  --reveal-y: 2px;
  --reveal-scale: .998;
  --reveal-opacity-duration: 560ms;
  --reveal-motion-duration: 920ms;
  --reveal-ease: var(--motion-ease-light);
}

@media (prefers-reduced-motion: reduce) {
  html[data-reveal-motion="true"] [data-scroll-reveal] {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    rotate: 0deg;
    transition: none;
  }
}