/* ==========================================================
   MINJET TRAVELS - LUXURY ANIMATIONS & INTERACTIVE STYLING
   ========================================================== */

/* 1. Stardust Canvas in Hero */
#stardustCanvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
  opacity: 0.75;
}

/* 2. Scroll Reveal Keyframes & Classes */
.reveal-init {
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-up {
  transform: translateY(35px);
}

.reveal-down {
  transform: translateY(-35px);
}

.reveal-left {
  transform: translateX(-40px);
}

.reveal-right {
  transform: translateX(40px);
}

.reveal-scale {
  transform: scale(0.92);
}

.reveal-visible {
  opacity: 1 !important;
  transform: translate(0, 0) scale(1) !important;
}

/* Stagger delays */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }

/* 3. 3D Tilt Card Effects */
.tilt-card {
  transform-style: preserve-3d;
  perspective: 1000px;
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.3s ease;
}

.tilt-inner {
  transform: translateZ(20px);
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.card-glare {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at 50% 0%, rgba(200, 162, 114, 0.25), transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 10;
}

.tour-card:hover .card-glare {
  opacity: 1;
}

/* 4. Continuous Floating Animations */
@keyframes floatSubtle {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-8px) rotate(0.5deg);
  }
}

.animate-float {
  animation: floatSubtle 5s ease-in-out infinite;
}

@keyframes floatGentleOpposite {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(8px);
  }
}

.animate-float-reverse {
  animation: floatGentleOpposite 6s ease-in-out infinite;
}

/* 5. Gold Sweep / Shimmer Button Effect */
@keyframes goldSweep {
  0% {
    transform: translateX(-150%) skewX(-20deg);
  }
  50%, 100% {
    transform: translateX(250%) skewX(-20deg);
  }
}

.gold-sweep-btn {
  position: relative;
  overflow: hidden;
}

.gold-sweep-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 40%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(231, 212, 184, 0.4), transparent);
  transform: translateX(-150%) skewX(-20deg);
  pointer-events: none;
}

.gold-sweep-btn:hover::after {
  animation: goldSweep 1.6s ease infinite;
}

/* 6. Radar Pulse Rings (for Hotline & Status) */
@keyframes pulseRadar {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(200, 162, 114, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 12px rgba(200, 162, 114, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(200, 162, 114, 0);
  }
}

.pulse-radar {
  animation: pulseRadar 2.4s infinite cubic-bezier(0.4, 0, 0.6, 1);
}

@keyframes pulseRadarGreen {
  0% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  }
  70% {
    box-shadow: 0 0 0 14px rgba(16, 185, 129, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}

.pulse-radar-green {
  animation: pulseRadarGreen 2.2s infinite cubic-bezier(0.4, 0, 0.6, 1);
}

/* 7. Flight Path SVG Trajectory Animation */
.flight-dash-path {
  stroke-dasharray: 8, 8;
  animation: flightDash 25s linear infinite;
}

@keyframes flightDash {
  to {
    stroke-dashoffset: -1000;
  }
}

@keyframes planeGlide {
  0% {
    transform: translate(0, 0) rotate(15deg);
  }
  50% {
    transform: translate(120px, -20px) rotate(22deg);
  }
  100% {
    transform: translate(0, 0) rotate(15deg);
  }
}

.animate-plane-glide {
  animation: planeGlide 8s ease-in-out infinite;
}

/* 8. Interactive Filter Animation */
.tour-card-wrapper {
  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.tour-card-wrapper.is-hidden {
  opacity: 0;
  transform: scale(0.85);
  pointer-events: none;
  display: none !important;
}

/* 9. Counter Number Transition */
.stat-counter {
  display: inline-block;
  font-variant-numeric: tabular-nums;
  transition: color 0.3s ease;
}

/* 10. Ambient Glow on Airplane Window */
.airplane-glow {
  box-shadow: 0 0 60px rgba(200, 162, 114, 0.22), inset 0 0 35px rgba(0, 0, 0, 0.8);
  transition: box-shadow 0.5s ease;
}

.airplane-glow:hover {
  box-shadow: 0 0 90px rgba(200, 162, 114, 0.4), inset 0 0 25px rgba(0, 0, 0, 0.7);
}

/* 11. Modal Backdrop & Entrance Animation */
.modal-enter {
  opacity: 0;
  transform: scale(0.95) translateY(15px);
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.modal-enter-active {
  opacity: 1;
  transform: scale(1) translateY(0);
}
