/* ── Initial hidden states ───────────────────── */
.reveal-fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity var(--duration-reveal) var(--ease-luxury),
    transform var(--duration-reveal) var(--ease-luxury);
}

.reveal-fade-left {
  opacity: 0;
  transform: translateX(-35px);
  transition:
    opacity var(--duration-reveal) var(--ease-luxury),
    transform var(--duration-reveal) var(--ease-luxury);
}

.reveal-fade-right {
  opacity: 0;
  transform: translateX(35px);
  transition:
    opacity var(--duration-reveal) var(--ease-luxury),
    transform var(--duration-reveal) var(--ease-luxury);
}

/* ── Activated state ─────────────────────────── */
.reveal-fade-up.is-visible,
.reveal-fade-left.is-visible,
.reveal-fade-right.is-visible {
  opacity: 1;
  transform: none;
}

/* ── Stagger delays ──────────────────────────── */
[data-delay="50"].is-visible  { transition-delay: 50ms; }
[data-delay="100"].is-visible { transition-delay: 100ms; }
[data-delay="150"].is-visible { transition-delay: 150ms; }
[data-delay="200"].is-visible { transition-delay: 200ms; }
[data-delay="250"].is-visible { transition-delay: 250ms; }
[data-delay="300"].is-visible { transition-delay: 300ms; }
[data-delay="350"].is-visible { transition-delay: 350ms; }
[data-delay="400"].is-visible { transition-delay: 400ms; }
[data-delay="450"].is-visible { transition-delay: 450ms; }
[data-delay="500"].is-visible { transition-delay: 500ms; }
[data-delay="600"].is-visible { transition-delay: 600ms; }
[data-delay="700"].is-visible { transition-delay: 700ms; }
[data-delay="800"].is-visible { transition-delay: 800ms; }

/* ── Scroll-cue animation ────────────────────── */
@keyframes scroll-grow {
  0%   { transform: scaleY(0); opacity: 0; }
  40%  { opacity: 1; }
  100% { transform: scaleY(1); opacity: 0.4; }
}

/* ── Gold shimmer on logo ────────────────────── */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* ── Subtle pulse for CTA ────────────────────── */
@keyframes pulse-gold {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,168,76,0); }
  50%       { box-shadow: 0 0 0 8px rgba(201,168,76,0.15); }
}