/* Scroll storytelling: motion is disabled automatically for visitors who prefer less movement. */
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: perspective(950px) rotateX(7deg) translateY(28px);
    transform-origin: 50% 0;
    transition: opacity .68s ease, transform .78s cubic-bezier(.16, 1, .3, 1);
    transition-delay: var(--reveal-delay, 0ms);
    will-change: opacity, transform;
  }

  .reveal.is-visible {
    opacity: 1;
    transform: perspective(950px) rotateX(0) translateY(0);
  }

  .project-card.reveal.is-visible:hover {
    transform: perspective(950px) rotateY(-1.5deg) translateY(-5px);
    box-shadow: 0 18px 32px rgba(18, 38, 44, .18);
  }
}