.mobile-menu-head,
.mobile-menu-backdrop {
  display: none;
}

.mobile-menu-toggle {
  align-items: center;
  flex-direction: column;
  gap: 5px;
  height: 42px;
  justify-content: center;
  width: 44px;
}

.mobile-menu-toggle span {
  background: currentColor;
  border-radius: 4px;
  display: block;
  height: 2px;
  transition: transform .22s ease, opacity .22s ease;
  width: 21px;
}

@media (max-width: 991.98px) {
  body.mobile-menu-open {
    overflow: hidden;
  }

  .top-nav {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    overflow: visible !important;
    transform: none !important;
    z-index: 1091;
  }

  .top-nav .container {
    flex-wrap: nowrap;
  }

  .top-nav .navbar-brand {
    min-width: 0;
  }

  .top-nav .brand-block {
    min-width: 0;
  }

  .top-nav .brand-copy {
    min-width: 0;
  }

  .top-nav .brand-copy strong,
  .top-nav .brand-copy span {
    max-width: 62vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-menu-toggle {
    color: #2f7d32;
    display: inline-flex;
    flex: 0 0 auto;
    position: relative;
    z-index: 2;
  }

  .top-nav.top-nav-home:not(.nav-home-scrolled) .mobile-menu-toggle {
    color: #fff7d2 !important;
  }

  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

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

  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .top-nav .mobile-side-menu {
    background:
      radial-gradient(circle at 100% 0, rgba(212, 168, 11, .17), transparent 28%),
      linear-gradient(180deg, #fff 0%, #f7faef 100%);
    box-shadow: -18px 0 55px rgba(18, 46, 17, .24);
    display: flex !important;
    flex-direction: column;
    bottom: auto;
    box-sizing: border-box;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh;
    left: auto;
    max-height: none;
    max-width: 88vw;
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    padding: 0 18px calc(28px + env(safe-area-inset-bottom));
    position: fixed;
    right: 0;
    top: 0;
    transform: translateX(105%);
    transition: transform .28s cubic-bezier(.22, .8, .3, 1);
    visibility: visible;
    width: 340px;
    z-index: 1093;
    -webkit-overflow-scrolling: touch;
  }

  .top-nav .mobile-side-menu.is-open {
    transform: translateX(0);
  }

  .mobile-menu-head {
    align-items: center;
    border-bottom: 1px solid rgba(47, 125, 50, .12);
    display: flex;
    flex: 0 0 auto;
    justify-content: space-between;
    margin: 0 -18px 16px;
    min-height: 82px;
    padding: 15px 18px;
    position: sticky;
    top: 0;
    z-index: 3;
  }

  .mobile-menu-head:before {
    background: rgba(255, 255, 255, .94);
    content: "";
    inset: 0;
    position: absolute;
    z-index: -1;
  }

  .mobile-menu-identity {
    align-items: center;
    display: flex;
    gap: 11px;
    min-width: 0;
  }

  .mobile-menu-identity img {
    background: linear-gradient(145deg, #edf5e8, #f5e8ae);
    border-radius: 12px;
    height: 42px;
    object-fit: contain;
    padding: 6px;
    width: 42px;
  }

  .mobile-menu-identity strong,
  .mobile-menu-identity span {
    display: block;
  }

  .mobile-menu-identity strong {
    color: #234d20;
    font-size: .86rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-menu-identity span {
    color: #718263;
    font-size: .65rem;
    letter-spacing: .08em;
    margin-top: 3px;
    text-transform: uppercase;
  }

  .mobile-menu-close {
    align-items: center;
    background: #edf5e8;
    border: 0;
    border-radius: 50%;
    color: #2f7d32;
    cursor: pointer;
    display: flex;
    flex: 0 0 auto;
    font-size: 23px;
    height: 38px;
    justify-content: center;
    line-height: 1;
    padding: 0 0 3px;
    width: 38px;
  }

  .top-nav .mobile-side-menu > .navbar-nav:first-of-type:empty {
    display: none;
  }

  .top-nav .mobile-side-menu > .navbar-nav {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0 !important;
    width: 100%;
  }

  .top-nav .mobile-side-menu .nav-item {
    border: 1px solid transparent;
    border-radius: 13px;
    margin: 0;
    overflow: hidden;
    width: 100%;
  }

  .top-nav .mobile-side-menu .nav-link {
    align-items: center;
    border-radius: 12px;
    color: #35572f !important;
    display: flex;
    font-size: .82rem !important;
    font-weight: 700;
    justify-content: flex-start;
    min-height: 47px;
    padding: .75rem .9rem !important;
    text-shadow: none !important;
    width: 100%;
  }

  .top-nav .mobile-side-menu .nav-link:before {
    background: linear-gradient(135deg, #2f7d32, #5a9b38);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(47, 125, 50, .09);
    content: "";
    flex: 0 0 auto;
    height: 7px;
    margin-right: 12px;
    width: 7px;
  }

  body .top-nav.top-nav-home:not(.nav-home-scrolled) .mobile-side-menu.navbar-collapse .navbar-nav .nav-item .nav-link,
  body .top-nav .mobile-side-menu.navbar-collapse .navbar-nav .nav-item .nav-link {
    color: #111 !important;
    text-shadow: none !important;
  }

  body .top-nav.top-nav-home:not(.nav-home-scrolled) .mobile-side-menu.navbar-collapse .dropdown-menu .dropdown-item,
  body .top-nav .mobile-side-menu.navbar-collapse .dropdown-menu .dropdown-item {
    color: #111 !important;
    text-shadow: none !important;
  }

  .top-nav .mobile-side-menu .nav-link:hover,
  .top-nav .mobile-side-menu .nav-link:focus,
  .top-nav .mobile-side-menu .nav-item.show > .nav-link {
    background: #edf5e8;
    color: #2f7d32 !important;
  }

  .top-nav .mobile-side-menu .dropdown-toggle:after {
    border: 0;
    color: #78906b;
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-size: .68rem;
    font-weight: 900;
    margin-left: auto !important;
    position: static;
    transition: transform .2s;
  }

  .top-nav .mobile-side-menu .show > .dropdown-toggle:after {
    transform: rotate(180deg);
  }

  .top-nav .mobile-side-menu .dropdown-menu {
    background: rgba(237, 245, 232, .75);
    border: 0;
    border-radius: 11px;
    box-shadow: none;
    float: none;
    box-sizing: border-box;
    margin: 0 0 8px 20px;
    padding: 6px;
    position: static !important;
    transform: none !important;
    width: calc(100% - 20px);
  }

  .top-nav .mobile-side-menu .dropdown-item {
    border-radius: 9px;
    color: #53664a;
    font-size: .78rem;
    line-height: 1.4;
    padding: .7rem .8rem;
    white-space: normal;
  }

  .mobile-menu-backdrop {
    background: rgba(10, 28, 11, .52);
    display: block;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity .25s;
    visibility: hidden;
    z-index: 1089;
  }

  .mobile-menu-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
  }
}

@media (max-width: 380px) {
  .top-nav .mobile-side-menu {
    max-width: 92vw;
  }

  .top-nav .brand-copy strong,
  .top-nav .brand-copy span {
    max-width: 55vw;
  }
}
