/* Mobile Menu Styles */
.mobile-menu {
  transition: transform 0.3s ease-in-out;
}

.mobile-menu.active {
  transform: translateX(0) !important;
}

.mobile-menu a {
  opacity: 0;
  transform: translateY(10px);
  animation: fadeInUp 0.3s forwards;
  animation-delay: calc(0.1s * var(--index, 0));
}

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

.mobile-menu-button {
  cursor: pointer;
  transition: transform 0.3s ease;
}

.mobile-menu-button:hover {
  transform: scale(1.1);
}

.mobile-menu-close {
  cursor: pointer;
  transition: transform 0.3s ease;
}

.mobile-menu-close:hover {
  transform: rotate(90deg);
}

body.menu-open {
  overflow: hidden;
}