@media (max-width: 768px) {
  /* Force navbar to be visible and row-oriented */
  .nav-links {
    display: flex !important;
    flex-direction: row !important;
    position: static !important;
    width: auto !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
    animation: none !important;
    gap: 0.8rem !important; /* Reduce gap for mobile */
  }

  /* Adjust navbar container to fit elements */
  .navbar {
    padding: 0 0.5rem !important; /* Reduce horizontal padding */
    justify-content: flex-start !important; /* Align left to start, but allow space */
    gap: 0.5rem;
    overflow-x: auto; /* Allow scrolling if it doesn't fit */
    flex-wrap: nowrap !important;
  }

  /* Ensure logo sizing is appropriate */
  .logo img {
    height: 40px !important; /* Smaller logo for mobile */
  }

  /* Adjust link font size */
  .nav-links a {
    font-size: 0.75rem !important; /* Smaller text */
    white-space: nowrap;
  }

  /* Mobile toggle hide (hamburger menu) */
  .mobile-toggle {
    display: none !important;
  }

  /* Ensure icons and buttons are visible and sized correctly */
  .lang-switcher {
    display: block !important;
    margin-left: auto; /* Push to right if space permits */
  }

  .lang-btn {
    padding: 0.2rem 0.5rem !important;
    font-size: 0.75rem !important;
  }

  .search-trigger {
    font-size: 0.9rem !important;
  }

  /* Improve hero spacing since header might overlay or crowd */
  .hero {
    padding-top: calc(var(--header-height) + 1rem) !important;
  }
}

/* Global footer fix to reduce spacing */
.seo-footer .container {
    padding: 1rem 1rem !important; /* Override 4rem padding */
}


/* Region-Specific Emblems Logic */

/* 1. Ensure indicator is visible globally (replaces previous hide) */
.footer-lang-indicator {
    display: flex !important;
}

/* 2. English: Hide default (Morocco), Show US */
html[lang="en"] .footer-lang-indicator {
    font-size: 0 !important; /* Hides text */
}
html[lang="en"] .footer-lang-indicator img {
    display: none !important; /* Hides image */
}
html[lang="en"] .footer-lang-indicator::before {
    content: url('https://flagcdn.com/24x18/us.png');
    display: inline-block;
    margin-right: 12px;
}
html[lang="en"] .footer-lang-indicator::after {
    content: "United States";
    font-size: 0.95rem;
    display: inline-block;
}

/* 3. French: Hide default (Maroc), Show France */
html[lang="fr"] .footer-lang-indicator {
    font-size: 0 !important;
}
html[lang="fr"] .footer-lang-indicator img {
    display: none !important;
}
html[lang="fr"] .footer-lang-indicator::before {
    content: url('https://flagcdn.com/24x18/fr.png');
    display: inline-block;
    margin-right: 12px;
}
html[lang="fr"] .footer-lang-indicator::after {
    content: "France";
    font-size: 0.95rem;
    display: inline-block;
}

/* 4. Arabic: Default is already Morocco in HTML, so no override needed. 
   But if strict enforcement is needed, we rely on the HTML content. */


/* Smart Link Style */
.smart-link {
    color: #0066ff !important;
    text-decoration: underline;
    font-weight: 500;
}