/* =====================================================
   Vivaan Holidays - Skeuomorphic 3D Effects & Tactile Parallax
   Electric Blue & Sky Blue Glows, Physical Depth
   ===================================================== */

/* Perspective Container for 3D Cards */
.tilt-card-wrapper {
  perspective: 1200px;
  transform-style: preserve-3d;
}

.tilt-card {
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease;
  transform-style: preserve-3d;
  will-change: transform;
}

.tilt-inner {
  transform: translateZ(30px);
  transform-style: preserve-3d;
}

.tilt-badge {
  transform: translateZ(45px);
}

.tilt-btn {
  transform: translateZ(55px);
}

/* Floating 3D Elements with Parallax */
.floating-3d-scene {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 2;
}

.float-item {
  position: absolute;
  filter: drop-shadow(0 15px 25px rgba(11, 25, 44, 0.28));
  will-change: transform;
  transition: transform 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  pointer-events: none;
  user-select: none;
}

/* Floating animation keyframes */
@keyframes floatBobbing {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-16px) rotate(2deg);
  }
}

@keyframes floatPaperPlane {
  0% {
    transform: translate(0px, 0px) rotate(-4deg);
  }
  50% {
    transform: translate(20px, -18px) rotate(6deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(-4deg);
  }
}

@keyframes pulseSun {
  0%, 100% {
    transform: scale(1) rotate(0deg);
    filter: drop-shadow(0 0 25px rgba(56, 189, 248, 0.5));
  }
  50% {
    transform: scale(1.06) rotate(12deg);
    filter: drop-shadow(0 0 45px rgba(0, 102, 255, 0.65));
  }
}

.anim-float {
  animation: floatBobbing 6s ease-in-out infinite;
}

.anim-plane {
  animation: floatPaperPlane 7s ease-in-out infinite;
}

.anim-sun {
  animation: pulseSun 8s ease-in-out infinite;
}

/* Animated Electric Gradient Text */
.text-gradient {
  background: linear-gradient(135deg, #0066FF 0%, #00D2FF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.text-gradient-ocean {
  background: linear-gradient(135deg, #0B192C 0%, #0066FF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

/* Wave Section Dividers */
.wave-divider {
  position: absolute;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  pointer-events: none;
  z-index: 1;
}

.wave-top {
  top: 0;
  transform: translateY(-99%);
}

.wave-bottom {
  bottom: 0;
  transform: translateY(99%);
}

.wave-divider svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 48px;
}

@media (min-width: 768px) {
  .wave-divider svg {
    height: 80px;
  }
}

/* Skeuomorphic Glassmorphism Card */
.glass-card {
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.9) 0%, rgba(240, 244, 250, 0.8) 100%);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 10px 10px 24px rgba(166, 182, 204, 0.35), -10px -10px 24px rgba(255, 255, 255, 0.95);
  border-radius: var(--radius);
}

.glass-card-dark {
  background: linear-gradient(155deg, rgba(11, 25, 44, 0.92) 0%, rgba(15, 35, 65, 0.85) 100%);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  box-shadow: 12px 12px 35px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  color: #FFFFFF;
}

/* Button Shine Effect */
.btn-shine::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    60deg,
    transparent,
    rgba(255, 255, 255, 0.38),
    transparent
  );
  transform: rotate(25deg) translateY(-100%);
  transition: transform 0.6s ease;
}

.btn-shine:hover::after {
  transform: rotate(25deg) translateY(100%);
}

/* Scroll Animation Classes (Triggered by IntersectionObserver) */
.reveal {
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

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

.reveal-fade-in {
  transform: scale(0.96);
}

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

.reveal.is-revealed {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* Respect Prefers Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .tilt-card {
    transform: none !important;
  }
  .float-item {
    animation: none !important;
    transform: none !important;
  }
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}
