/* Mobile-only navbar polish — desktop untouched */
@media (max-width: 767px) {
  .site-nav.nav-shell {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    margin: 0 !important;
    top: 0;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.8125rem;
    padding-bottom: 0.8125rem;
    border-radius: 0 0 1.75rem 1.75rem !important;
    border: none !important;
    border-bottom: 1px solid rgba(133, 246, 229, 0.55) !important;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.98) 0%,
      rgba(244, 251, 249, 0.94) 55%,
      rgba(240, 248, 246, 0.9) 100%
    ) !important;
    box-shadow:
      0 14px 44px -18px rgba(0, 104, 94, 0.22),
      0 6px 20px -10px rgba(0, 131, 119, 0.1),
      inset 0 1px 0 rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(22px) saturate(1.15);
    -webkit-backdrop-filter: blur(22px) saturate(1.15);
  }

  .site-nav.nav-shell > * {
    position: relative;
    z-index: 1;
  }

  .site-nav.nav-shell::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: 12%;
    right: 12%;
    bottom: 0;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(
      90deg,
      transparent,
      rgba(0, 104, 94, 0.18) 20%,
      rgba(0, 131, 119, 0.28) 50%,
      rgba(0, 104, 94, 0.18) 80%,
      transparent
    );
    pointer-events: none;
  }

  .nav-menu-trigger {
    position: relative;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(165deg, #ffffff 0%, rgba(200, 245, 236, 0.5) 55%, rgba(133, 246, 229, 0.35) 100%);
    border: 1px solid rgba(0, 104, 94, 0.11);
    color: #00685e;
    box-shadow:
      0 4px 18px rgba(0, 104, 94, 0.15),
      inset 0 1px 0 rgba(255, 255, 255, 0.98),
      inset 0 -1px 0 rgba(0, 104, 94, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }

  .nav-menu-trigger:active {
    transform: scale(0.94);
    box-shadow:
      0 2px 10px rgba(0, 104, 94, 0.12),
      inset 0 1px 0 rgba(255, 255, 255, 0.95);
  }

  .nav-brand-logo {
    border-radius: 0.65rem;
    box-shadow:
      0 2px 12px rgba(0, 104, 94, 0.12),
      0 0 0 1px rgba(255, 255, 255, 0.85) inset;
  }

  .site-nav.nav-shell .nav-brand-wordmark {
    background: linear-gradient(125deg, #191c1e 0%, #1a4a44 45%, #00685e 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}