/* Custom Styles for smooth scrolling and specific effects */
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Jost", sans-serif;
}

.nav-transparent {
  background-color: transparent;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  color: white;
}

.nav-scrolled {
  background-color: rgba(13, 1, 64, 0.95);
  backdrop-filter: blur(10px);
  /* box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); */
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  color: white;
}

.fade-in-up {
  animation: fadeInUp 0.8s ease-out forwards;
  opacity: 0;
  transform: translateY(20px);
}

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

.delay-100 {
  animation-delay: 100ms;
}

.delay-200 {
  animation-delay: 200ms;
}

.delay-300 {
  animation-delay: 300ms;
}

/* Checkbox Custom Style */
input[type="checkbox"]:checked ~ .check-icon {
  opacity: 1;
}