.main-menu {
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 38px;
  padding: 0;

  .main-menu-item {
    > .main-menu-link {
      display: block;
      font-weight: 500;
      font-family: var(--wp--preset--font-family--poppins);
      text-decoration: none;
      letter-spacing: 0.4px;
      color: rgba(0, 0, 0, 0.85);
      padding: 20px 0;
      line-height: 1;
      padding: 34px 12px;
      font-size: var(--wp--preset--font-size--medium);
      position: relative;

      &::after {
        content: "";
        display: block;
        width: 100%;
        height: 4px;
        background: var(--wp--preset--color--navy);
        position: absolute;
        bottom: -2px;
        z-index: 101;
        left: 0;
        transition: all 0.3s ease-in-out;
        max-width: 0;
      }

      &:hover::after {
        max-width: 100%;
      }
    }
  }

  .main-menu-item.is-active .main-menu-link::after,
  .main-menu-item.current-menu-item .main-menu-link::after,
  .main-menu-item.current-page-ancestor .main-menu-link::after {
    max-width: 100%;
  }

  .submenu-container {
    position: absolute;
    left: 0;
    z-index: 100;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    opacity: 0;

    .quick-access {
      .wp-block-column:last-child .btn-qa::before {
        display: none;
      }
    }

    .quick-access:not(:first-child) .btn-qa::after {
      display: none;
    }
  }

  .submenu-container.is-active {
    max-height: 100vh;
    opacity: 1;
  }

  .wp-block-page-list {
    padding: 0;
    list-style-type: none;
  }

  .wp-block-pages-list__item__link,
  .wp-block-navigation-item__content {
    display: block;
    padding: 10px;
    min-width: 100%;
  }

  .wp-block-navigation-submenu {
    width: 100%;
  }

  .wp-block-navigation__submenu-container {
    position: absolute;
    width: calc(100% - 300px);
    left: 360px !important;
    height: calc(100% + 120px) !important;
    background: #003b73 !important;
    padding: 60px;
    top: -60px;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease-in-out 0.3s;
    list-style-type: none;
    overflow: hidden;

    .wp-block-pages-list__item__link,
    .wp-block-navigation-item__content {
      letter-spacing: 0.4px;
      font-weight: 400 !important;
      color: #fff !important;

      &:hover {
        color: #dbb841 !important;
        font-weight: 500 !important;
      }
    }
  }

  .wp-block-pages-list__item {
    &.current-menu-item,
    &.is-active,
    &.current-menu-ancestor {
      .wp-block-pages-list__item__link {
        color: #dbb841;
        font-weight: 500;
      }

      .wp-block-navigation__submenu-container {
        visibility: visible;
        opacity: 1;
        transition: opacity 0.3s ease-in-out 0s;
      }
    }
  }

  .wp-block-navigation-item.has-child {
    overflow: hidden;
  }

  .wp-block-navigation-item.is-active,
  .wp-block-navigation-item.has-child.current-menu-item,
  .wp-block-navigation-item.has-child.current-menu-ancestor {
    .wp-block-navigation-item__content {
      color: #dbb841;
      font-weight: 500;
    }
    .wp-block-navigation__submenu-container {
      visibility: visible;
      opacity: 1;
      max-height: inherit !important;
      transition: opacity 0.3s ease-in-out 0s;
    }
  }

  .wp-block-navigation-submenu {
    &.current-menu-ancestor {
      > a {
        color: #dbb841 !important;
        font-weight: 500 !important;
      }
    }

    .current-menu-item {
      .wp-block-navigation-item__content {
        color: #dbb841;
        font-weight: 500;
      }
    }
  }

  .wp-block-navigation__submenu-container {
    li.current-menu-item {
      a.wp-block-pages-list__item__link {
        color: #dbb841 !important;
        font-weight: 500 !important;
      }
    }
  }

  .wp-block-navigation {
    position: static !important;

    .wp-block-navigation-item {
      position: static !important;
      width: 100%;
    }

    .wp-block-navigation__submenu-container {
      top: -60px;
      height: calc(100% + 120px) !important;
      width: 100% !important;
    }

    .wp-block-navigation__container {
      gap: 0;
      min-height: 260px;
    }

    .current-menu-item,
    .current-menu-ancestor {
      > .wp-block-navigation-item__content {
        color: #dbb841 !important;
        font-weight: 500 !important;
      }
    }
  }

  .wp-block-navigation__responsive-dialog {
    position: static;
  }

  .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
    color: #dbb841 !important;
    font-weight: 500 !important;
  }

  .is-style-bordered {
    align-content: center;

    .main-menu-link {
      > span {
        border: 1px solid #87732c;
        padding: 6px 10px;
        color: #87732c;
        font-weight: 500;
        max-height: 37px;
        transition: all 0.3s ease-in-out;
        width: fit-content;
      }
      &::after {
        display: none;
      }
      &:hover span {
        background: #87732c;
        color: #fff;
      }
    }

    &:hover .main-menu-link > span {
      background: #87732c;
      color: #fff;
    }
  }
}

.main-menu-wrapper {
  position: static;
}

@media screen and (min-width: 1141px) {
  .wp-block-pages-list__item {
    &:hover {
      .wp-block-pages-list__item__link {
        color: #dbb841;
        font-weight: 500;
      }

      .wp-block-navigation__submenu-container {
        visibility: visible;
        opacity: 1;
        z-index: 2;
      }
    }
  }
}

@media screen and (max-width: 1140px) {
  .main-menu {
    column-gap: 15px;
    flex-direction: column;
    row-gap: 20px;
  }

  .wp-block-navigation-item {
    flex-direction: column;
  }

  .main-menu-item:not(.is-style-bordered) .main-menu-link {
    padding: 20px 12px !important;
    border: 2px solid var(--wp--preset--color--navy);
    background: #fff;
    color: var(--wp--preset--color--navy);
  }

  .main-menu-item.is-active .main-menu-link {
    background: var(--wp--preset--color--navy);
    color: #fff;
  }

  .main-menu-link {
    display: flex !important;
    justify-content: center;
    width: 50%;
    max-width: 50%;
    margin: auto;
  }

  .buttons-container {
    justify-content: center !important;
  }

  .main-menu .submenu-container {
    position: relative;
  }

  .main-menu .submenu-item .wp-block-columns .wp-block-column:first-child {
    display: none;
  }
}

@media screen and (max-width: 1200px) {
  .main-menu .wp-block-navigation__submenu-container {
    padding: 30px !important;
    left: 50% !important;
    width: 100% !important;
    top: -20px !important;
  }

  .main-menu .submenu-item > .wp-block-columns {
    flex-direction: column;
    gap: 0;
  }

  .main-menu .submenu-item .wp-block-page-list {
    max-width: 100%;
    width: 100%;
  }

  .main-menu
    .submenu-item
    .wp-block-columns
    .wp-block-column
    + .wp-block-column {
    padding: 20px !important;
  }

  .main-menu .submenu-item .wp-block-pages-list__item.has-child {
    position: relative;
  }

  .main-menu .submenu-item .wp-block-navigation__submenu-container {
    left: 0 !important;
    width: 100% !important;
    top: 0 !important;
    padding: 0 20px !important;
    max-height: 0 !important;
    height: auto !important;
    position: relative !important;
  }

  .main-menu
    .submenu-item
    .wp-block-pages-list__item.is-active
    .wp-block-navigation__submenu-container {
    max-height: inherit !important;
  }
}

@media screen and (max-width: 600px) {
  .main-menu .submenu-item .wp-block-page-list {
    width: 100%;
    max-width: 100%;
  }

  .main-menu-link {
    width: 90%;
    max-width: 90%;
  }
}