:root {
  --ease-out:cubic-bezier(.23,1,.32,1);
}

.scroll-reveal-ready [data-reveal] {
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity 600ms var(--ease-out),
    transform 600ms var(--ease-out);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}

.scroll-reveal-ready [data-reveal="title"] {
  opacity:0;
  transform:translateY(16px);
  transition:
    opacity 600ms var(--ease-out),
    transform 600ms var(--ease-out);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}

.scroll-reveal-ready [data-reveal="info"] {
  transform:translateY(18px);
}

.scroll-reveal-ready [data-reveal="card"] {
  transform:translateY(28px);
}

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

.scroll-reveal-ready [data-reveal="title"].is-revealed {
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion:reduce) {
  .scroll-reveal-ready [data-reveal],
  .scroll-reveal-ready [data-reveal="title"] {
    transform:none;
    transition:opacity 200ms ease;
    transition-delay:0ms;
  }
}
