@media (max-width: 768px) {
    /* Hide desktop nav entirely */
    nav {
      display: none !important;
    }
  
    /* Show mobile nav bar */
    .mobile-nav {
      display: flex !important;
      align-items: center;
      padding: 15px 20px;
      background-color: #000;
      justify-content: space-between;
      width: 100%;
      z-index: 999;
      position: fixed;
      top: 0;
      left: 0;
    }
  
    .hamburger {
      font-size: 28px;
      cursor: pointer;
      color: white;
      user-select: none;
    }
  
    /* Hidden by default, shown with JS toggle */
    .mobile-menu {
      display: none;
      flex-direction: column;
      background: #111;
      width: 100%;
      padding: 10px 20px;
      position: fixed;
      top: 60px;
      left: 0;
      z-index: 998;
    }
  
    .mobile-menu.show {
      display: flex;
    }
  
    .mobile-menu a {
      color: white;
      text-decoration: none;
      padding: 10px 0;
      font-size: 18px;
      border-bottom: 1px solid #333;
    }
  
    /* Push page content down on mobile */
    .about-wrapper {
      padding-top: 120px;
    }
  }
  @media (min-width: 769px) {
    .mobile-nav,
    .mobile-menu {
      display: none !important;
    }
  
    nav {
      display: flex !important;
    }
  }