/* ===== MOBILE NAVIGATION FIXES ===== */

@media (max-width: 992px) {
  /* Fix mobile menu z-index to appear above hero */
  .nav__list {
    z-index: 10000 !important;
    background: rgba(26, 29, 35, 0.98) !important;
    backdrop-filter: blur(20px) !important;
  }
  
  .nav__toggle {
    z-index: 10001 !important;
    position: relative;
  }
  
  .header {
    z-index: 9999 !important;
  }
  
  /* Ensure hero doesn't overlap menu */
  .hero {
    z-index: 1 !important;
    position: relative;
  }
  
  /* Fix mobile menu visibility */
  .nav__list.active {
    right: 0 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* Improve mobile menu button visibility */
  .nav__toggle {
    display: block !important;
  }
  
  .nav__toggle span {
    background: #fff !important;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
    display: block !important;
  }
  
  /* Reduce hero top padding on mobile */
  .hero {
    padding-top: 90px !important;
    margin-top: 0 !important;
  }
  
  /* Reduce gap between hero title and header */
  .hero-content {
    padding-top: 10px !important;
    margin-top: 0 !important;
  }
  
  .hero__title {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

@media (max-width: 768px) {
  /* Further reduce hero padding on smaller screens */
  .hero {
    padding-top: 80px !important;
  }
  
  .hero-content {
    padding-top: 5px !important;
  }
  
  /* Ensure menu items are visible and touchable */
  .nav__list a {
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
  }
  
  /* Fix about page mobile menu */
  .about-hero + .header .nav__toggle,
  .page-header + .header .nav__toggle {
    display: block !important;
  }
  
  /* Center footer social icons */
  .footer-social {
    justify-content: center !important;
    display: flex !important;
    gap: 1rem !important;
  }
  
  .footer-brand {
    text-align: center !important;
  }
  
  .footer-description {
    text-align: center !important;
  }
}

/* ===== HAMBURGER MENU ANIMATION ===== */
.nav__toggle span:nth-child(1) {
  top: 0;
}

.nav__toggle span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}

.nav__toggle span:nth-child(3) {
  bottom: 0;
}

.nav__toggle[aria-expanded="true"] span:nth-child(1) {
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.nav__toggle[aria-expanded="true"] span:nth-child(2) {
  opacity: 0;
}

.nav__toggle[aria-expanded="true"] span:nth-child(3) {
  bottom: 50%;
  transform: translateY(50%) rotate(-45deg);
}

/* ===== MOBILE MENU OVERLAY ===== */
@media (max-width: 992px) {
  /* Add overlay when menu is open */
  body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 9998;
    pointer-events: none;
  }
  
  body.menu-open::before {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  
  body.menu-open {
    overflow: hidden;
  }
}