/* Shared motion language — Night Atelier.
   Use .u-reveal on sections/cards; prefer CSS. No animation libraries. */

:root {
  --motion-fast: 0.18s;
  --motion-base: 0.55s;
  --motion-slow: 0.85s;
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --motion-rise: 1.1rem;
}

/* Scroll / mount reveal — JS adds .is-in when visible */
.u-reveal {
  opacity: 0;
  transform: translateY(var(--motion-rise));
  transition:
    opacity var(--motion-base) var(--motion-ease),
    transform var(--motion-base) var(--motion-ease);
  will-change: opacity, transform;
}

.u-reveal.is-in {
  opacity: 1;
  transform: none;
  will-change: auto;
}

.u-reveal-stagger > .u-reveal:nth-child(1) { transition-delay: 0.04s; }
.u-reveal-stagger > .u-reveal:nth-child(2) { transition-delay: 0.1s; }
.u-reveal-stagger > .u-reveal:nth-child(3) { transition-delay: 0.16s; }
.u-reveal-stagger > .u-reveal:nth-child(4) { transition-delay: 0.22s; }
.u-reveal-stagger > .u-reveal:nth-child(5) { transition-delay: 0.28s; }
.u-reveal-stagger > .u-reveal:nth-child(6) { transition-delay: 0.34s; }

/* Soft lift for interactive surfaces (buttons already have their own) */
.u-lift {
  transition:
    transform var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease;
}

.u-lift:hover {
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
  .u-reveal,
  .u-reveal.is-in,
  .u-lift,
  .u-lift:hover {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }

  .u-reveal-stagger > .u-reveal {
    transition-delay: 0s;
  }
}
