html {
  scroll-behavior: smooth;
}

.reveal,
.reveal-left,
.reveal-right,
.reveal-scale {
  opacity: 0;
  filter: blur(6px);
  transition:
    opacity 0.72s cubic-bezier(.22,.68,0,1),
    transform 0.72s cubic-bezier(.22,.68,0,1),
    filter 0.72s ease;
  transition-delay: var(--reveal-delay, 0s);
  will-change: opacity, transform, filter;
}

.reveal {
  transform: translate3d(0, 34px, 0);
}

.reveal-left {
  transform: translate3d(-44px, 0, 0);
}

.reveal-right {
  transform: translate3d(44px, 0, 0);
}

.reveal-scale {
  transform: translate3d(0, 28px, 0) scale(0.92);
}

.reveal.visible,
.reveal-left.visible,
.reveal-right.visible,
.reveal-scale.visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
}

.delay-100 { --reveal-delay: 0.10s; }
.delay-200 { --reveal-delay: 0.20s; }
.delay-300 { --reveal-delay: 0.30s; }
.delay-400 { --reveal-delay: 0.40s; }
.delay-500 { --reveal-delay: 0.50s; }
.delay-600 { --reveal-delay: 0.60s; }

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .reveal,
  .reveal-left,
  .reveal-right,
  .reveal-scale {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
}