/* Added to ensure header stays above other content */
header {
  z-index: 50;
}

.animate-marquee {
  display: inline-block;
  white-space: nowrap;
  animation: marquee 30s linear infinite;
}

.hover\:pause-marquee:hover {
  animation-play-state: paused;
}

@keyframes marquee {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.neumorphic-step {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 1.25rem; /* mr-5 */
  border-radius: 0.5rem; /* rounded-lg */
  background-color: white;
  font-weight: bold;
  color: #3b82f6; /* text-blue-500 */
  border: 1px solid transparent; /* border border-transparent */
  transition: all 0.5s ease; /* transition-all duration-500 */
  box-shadow: 6px 6px 10px -1px rgba(0, 0, 0, 0.15),
    -6px -6px 10px -1px rgba(255, 255, 255, 0.7);
}

.neumorphic-step:hover {
  border-color: #e5e7eb; /* hover:border-gray-200 */
  transform: translateY(4px); /* hover:translate-y-1 */
  box-shadow: inset 4px 4px 6px -1px rgba(0, 0, 0, 0.2),
    inset -4px -4px 6px -1px rgba(255, 255, 255, 0.7),
    -0.5px -0.5px 0px rgba(255, 255, 255, 1),
    0.5px 0.5px 0px rgba(0, 0, 0, 0.15), 0px 12px 10px -10px rgba(0, 0, 0, 0.05);
}


.hamberger-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-right: 1.25rem; /* mr-5 */
  border-radius: 0.5rem; /* rounded-lg */
  background-color: white;
  font-weight: bold;
  color: #3b82f6; /* text-blue-500 */
  border: 1px solid transparent; /* border border-transparent */
  transition: all 0.5s ease; /* transition-all duration-500 */
}

.hamberger-button:hover {
  border-color: #e5e7eb; /* hover:border-gray-200 */
  transform: translateY(4px); /* hover:translate-y-1 */
  box-shadow: inset 4px 4px 6px -1px rgba(0, 0, 0, 0.2),
    inset -4px -4px 6px -1px rgba(255, 255, 255, 0.7),
    -0.5px -0.5px 0px rgba(255, 255, 255, 1),
    0.5px 0.5px 0px rgba(0, 0, 0, 0.15), 0px 12px 10px -10px rgba(0, 0, 0, 0.05);
}


html,
body {
  overflow-x: hidden;
}

/* Style for the chevron icon */
.fa-chevron-down {
  transition: transform 0.3s ease-in-out;
}

input[type="checkbox"]:checked + label .fa-chevron-down {
  transform: rotate(180deg);
}