/* Content is visible by default. Only JS-registered, offscreen items wait. */
.scroll-reveal-pending {
  opacity: 0;
}

.scroll-reveal-active {
  animation: sayama-scroll-reveal 640ms cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: var(--reveal-delay, 0ms);
}

@keyframes sayama-scroll-reveal {
  from { opacity: 0; translate: 0 24px; }
  to { opacity: 1; translate: 0 0; }
}

@media (max-width: 768px) {
  .scroll-reveal-active { animation-duration: 520ms; }

  @keyframes sayama-scroll-reveal {
    from { opacity: 0; translate: 0 14px; }
    to { opacity: 1; translate: 0 0; }
  }
}

/* Keyboard focus, printing and reduced motion must never hide content. */
.scroll-reveal-pending:focus-within,
.scroll-reveal-active:focus-within {
  animation: none;
  opacity: 1;
  translate: none;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scroll-reveal-pending,
  .scroll-reveal-active {
    animation: none;
    opacity: 1;
    translate: none;
  }
}

@media print {
  .scroll-reveal-pending,
  .scroll-reveal-active {
    animation: none;
    opacity: 1;
    translate: none;
  }
}