/* ═══════════════════════════════════════════════════════════════
   ROE ROE'S CATERING — Animations
   ═══════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════════
   HERO ENTRANCE KEYFRAMES
   ══════════════════════════════════════════════════════════════ */
@keyframes fadeSlideUp {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeSlideDown {
  from {
    opacity: 0;
    transform: translateY(-16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ══════════════════════════════════════════════════════════════
   SCROLL REVEAL CLASSES — initial state (hidden)
   ══════════════════════════════════════════════════════════════ */

/* Fade */
.reveal-fade {
  opacity: 0;
  transition:
    opacity var(--duration-reveal) var(--ease-out),
    transform var(--duration-reveal) var(--ease-out);
  transition-delay: var(--delay, 0ms);
}

.reveal-fade.is-visible {
  opacity: 1;
}

/* Up */
.reveal-up {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity var(--duration-reveal) var(--ease-out),
    transform var(--duration-reveal) var(--ease-out);
  transition-delay: var(--delay, 0ms);
}

.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Left */
.reveal-left {
  opacity: 0;
  transform: translateX(-48px);
  transition:
    opacity var(--duration-reveal) var(--ease-out),
    transform var(--duration-reveal) var(--ease-out);
  transition-delay: var(--delay, 0ms);
}

.reveal-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Right */
.reveal-right {
  opacity: 0;
  transform: translateX(48px);
  transition:
    opacity var(--duration-reveal) var(--ease-out),
    transform var(--duration-reveal) var(--ease-out);
  transition-delay: var(--delay, 0ms);
}

.reveal-right.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* ══════════════════════════════════════════════════════════════
   TAB PANEL TRANSITIONS
   ══════════════════════════════════════════════════════════════ */
@keyframes tabFadeIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ══════════════════════════════════════════════════════════════
   COUNTER ANIMATION (JS-driven)
   ══════════════════════════════════════════════════════════════ */
.stat-number {
  display: inline-block;
  transition: color var(--duration-base) var(--ease-out);
}

/* ══════════════════════════════════════════════════════════════
   GALLERY TRACK TRANSITION
   ══════════════════════════════════════════════════════════════ */
.gallery-track {
  transition: transform 0.55s var(--ease-out);
}

/* ══════════════════════════════════════════════════════════════
   GLOW PULSE (on accented elements)
   ══════════════════════════════════════════════════════════════ */
@keyframes glowPulse {
  0%, 100% { box-shadow: var(--glow-accent-sm); }
  50%       { box-shadow: var(--glow-accent); }
}

.btn-primary {
  animation: glowPulse 3s ease-in-out infinite;
}

.btn-primary:hover {
  animation: none;
}

/* ══════════════════════════════════════════════════════════════
   ACCENT SHIMMER (decorative elements)
   ══════════════════════════════════════════════════════════════ */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* ══════════════════════════════════════════════════════════════
   NAV logo hover float
   ══════════════════════════════════════════════════════════════ */
.nav-logo-img {
  transition: transform var(--duration-base) var(--ease-out),
              filter var(--duration-base) var(--ease-out);
}

.nav-logo:hover .nav-logo-img {
  transform: translateY(-2px);
  filter: drop-shadow(0 4px 12px rgba(255, 195, 108, 0.4));
}

/* ══════════════════════════════════════════════════════════════
   TESTIMONIAL CARD — hover lift (extra reinforcement)
   ══════════════════════════════════════════════════════════════ */
.testimonial-card {
  transition:
    transform var(--duration-slow) var(--ease-out),
    box-shadow var(--duration-slow) var(--ease-out),
    border-color var(--duration-slow) var(--ease-out);
}

/* ══════════════════════════════════════════════════════════════
   SCROLL HINT FADE IN
   ══════════════════════════════════════════════════════════════ */
.hero-scroll-hint {
  animation: fadeSlideUp 1s var(--ease-out) 1.2s both;
}
