/* ═══════════════════════════════════════════════════════════════
   HOTEL 1812 — ANIMATIONS.CSS  v6
   Scroll reveals · Hero entries · Keyframes · Parallax states
═══════════════════════════════════════════════════════════════ */

/* ═══════════════════
   KEYFRAME ANIMATIONS
═══════════════════ */
@keyframes scrollMarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes heroScrollPulse {
  0%,100% { transform: scaleY(1); opacity: .45; }
  50%     { transform: scaleY(1.4); opacity: 1; }
}

@keyframes logoFloat {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-6px); }
}

@keyframes logoGlow {
  0%,100% { filter: drop-shadow(0 0 20px rgba(183,155,104,0.15)); }
  50%     { filter: drop-shadow(0 0 45px rgba(183,155,104,0.35)); }
}

@keyframes spinSlow {
  to { transform: rotate(360deg); }
}

@keyframes floatY {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-7px); }
}

@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* ═══════════════════
   HERO ENTRIES — staggered cascade
═══════════════════ */
.h-enter {
  opacity: 0; transform: translateY(26px);
  animation: hRise 1.4s var(--ease-out) forwards;
}
.h-enter-fade {
  opacity: 0;
  animation: hFade 1.6s var(--ease-out) forwards;
}
@keyframes hRise { to { opacity: 1; transform: translateY(0); } }
@keyframes hFade { to { opacity: 1; } }

.hd-0 { animation-delay: .1s; }
.hd-1 { animation-delay: .3s; }
.hd-2 { animation-delay: .5s; }
.hd-3 { animation-delay: .7s; }
.hd-4 { animation-delay: .9s; }
.hd-5 { animation-delay: 1.1s; }
.hd-6 { animation-delay: 1.3s; }
.hd-7 { animation-delay: 1.55s; }
.hd-8 { animation-delay: 1.85s; }

/* Hero logo continuous animation */
.hero-logo-svg {
  width: 100%; height: auto; display: block;
  animation: logoFloat 6s ease-in-out infinite, logoGlow 4s ease-in-out infinite;
}

/* Scroll indicator */
.hero-scroll-bar {
  animation: heroScrollPulse 2.5s ease-in-out infinite;
}

/* ═══════════════════
   SCROLL REVEAL — IntersectionObserver-driven
═══════════════════ */
.reveal {
  opacity: 0; transform: translateY(34px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out);
}
.reveal.visible {
  opacity: 1; transform: translateY(0);
}

.reveal-left {
  opacity: 0; transform: translateX(-34px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out);
}
.reveal-left.visible {
  opacity: 1; transform: translateX(0);
}

.reveal-right {
  opacity: 0; transform: translateX(34px);
  transition: opacity 1s var(--ease-out), transform 1s var(--ease-out);
}
.reveal-right.visible {
  opacity: 1; transform: translateX(0);
}

/* Stagger delays */
.reveal-d1 { transition-delay: .1s; }
.reveal-d2 { transition-delay: .22s; }
.reveal-d3 { transition-delay: .36s; }
.reveal-d4 { transition-delay: .52s; }
.reveal-d5 { transition-delay: .7s; }

/* Reduced motion: instant reveal, no animation */
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-left, .reveal-right,
  .h-enter, .h-enter-fade {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
  .hero-logo-svg {
    animation: none !important;
  }
}