.site-menu > nav {
    width: min(340px, calc(100vw - 36px));
    max-height: min(620px, calc(100vh - 100px));
    overflow-y: auto;
}

.site-menu__primary {
    padding-bottom: 7px;
}

.site-menu__heading {
    display: block;
    padding: 8px 14px 5px;
    color: #718096;
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.site-menu__section {
    margin-top: 7px;
    padding-top: 7px;
    border-top: 1px solid #e6ebf0;
}

.site-menu .site-menu__section > summary {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    min-height: 42px;
    padding: 10px 36px 10px 14px;
    color: #092646;
    background: transparent;
    border: 0;
    border-radius: 11px;
    font-size: .82rem;
    font-weight: 850;
    cursor: pointer;
}

.site-menu .site-menu__section > summary::after {
    position: absolute;
    top: 50%;
    right: 15px;
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-65%) rotate(45deg);
    transition: transform .18s ease;
    content: "";
}

.site-menu .site-menu__section[open] > summary::after {
    transform: translateY(-35%) rotate(225deg);
}

.site-menu .site-menu__section > summary:hover,
.site-menu .site-menu__section > summary:focus-visible {
    color: #ff5a55;
    background: #fff6f2;
}

.site-menu__section > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3px;
    padding: 2px 6px 7px 14px;
}

.site-menu nav .site-menu__section a {
    padding: 9px 10px;
    color: #52657a;
    font-size: .8rem;
    font-weight: 700;
}

@media (max-width: 420px) {
    .site-menu__section > div {
        grid-template-columns: 1fr;
    }
}