@media (max-width: 768px) {

  /* 1. Center the header area */
  #xg_head, .header-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background: transparent !important;
  }

  /* 2. Fix the logo size so it's not "screaming" */
  .header-logo img, .header-logoImage img {
    max-width: 70% !important; /* Shrunk a bit more for better framing */
    height: auto !important;
    margin-top: 28px !important;
  }

  /* 3. Make the navigation links big and easy to tap */
  #xg_navigation {
    display: block !important;
    width: 100% !important;
    margin-top: 10px !important;
  }

  #xg_navigation ul {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    padding: 0 !important;
    list-style: none !important;
  }

  #xg_navigation ul li a {
    color: #00E5FF !important; /* That Galactic Glow Cyan we liked! */
    font-family: 'Montserrat', sans-serif; /* Clean and modern */
    font-size: 16px !important;
    padding: 10px 15px !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-decoration: none !important;
  }

  /* 4. Hide that tiny little 'list' icon if it's annoying you */
  .navigation-menu-toggle {
    display: none !important;
  }
}
