/* Custom styles can go here */ 

body {
  background-color: #030712; /* bg-gray-950 */
  color: #e5e7eb; /* default text color */
}
.glass-card {
  background: rgba(17, 24, 39, 0.6); /* bg-gray-900 with 60% opacity */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.glass-card-soft {
  background: rgba(31, 41, 55, 0.2); /* bg-gray-800/20 */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.nav-link.active {
  background: rgba(59, 130, 246, 0.2); /* bg-blue-500/20 */
  color: #eff6ff; /* text-blue-100 */
  font-weight: 600;
}

/* --- Animation Keyframes --- */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* --- Animation Utility Classes --- */
.fade-in {
  animation: fadeIn 0.5s ease-in-out forwards;
}

.fade-in-up {
  animation: fadeInUp 0.5s ease-in-out forwards;
}

/* --- Staggered Animation --- */
.stagger-children > * {
  animation: fadeInUp 0.5s ease-in-out forwards;
  opacity: 0;
}

.stagger-children > *:nth-child(1) { animation-delay: 0.1s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.2s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.3s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.4s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.5s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.6s; }

/* --- Hover animation --- */
.hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
} 
.bg-gray-900{
  background-color: unset !important;
}

/* Price Timeline Styles */
#price-timeline .relative {
  position: relative;
}
#timeline-container{
  height: 6rem;
}
#gradient-line {
  transition: all 0.5s ease-in-out;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

#direction-arrow {
  transition: all 0.3s ease-in-out;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5));
}

#direction-arrow:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

/* Price point animations */
#price-timeline .w-3.h-3 {
  transition: all 0.3s ease-in-out;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
}

#price-timeline .w-3.h-3:hover {
  transform: scale(1.2);
}

/* Gradient line pulse animation */
@keyframes pulse-gradient {
  0% {
    opacity: 0.8;
    transform: scaleY(1);
  }
  50% {
    opacity: 1;
    transform: scaleY(1.1);
  }
  100% {
    opacity: 0.8;
    transform: scaleY(1);
  }
}

/* Price timeline container styling */
#price-timeline {
  transition: all 0.3s ease-in-out;
  border-radius: 12px;
}