.navigation {
    position: relative;
    z-index: 2000;
}

.navigation li {
    position: relative;
    display: inline-block;
}

.menu-icon {
    width: 16px;
    height: 16px;
    margin-left: 8px;
    transition: transform 0.3s ease, filter 0.3s ease, opacity 0.3s;
    vertical-align: middle;
    filter: none;
    opacity: 1;
}

.navigation li.has-submenu:hover > a > .menu-icon,
.navigation li.has-submenu:focus-within > a > .menu-icon {
    transform: rotate(180deg);
    filter: invert(35%) sepia(95%) saturate(600%) hue-rotate(200deg) brightness(90%) contrast(90%);
}

.submenu {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 36px;
    list-style: none;
    padding: 6px 0;
    background: #fff;
    border: 1px solid #ddd;
    min-width: 180px;
    z-index: 2100;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.has-submenu::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 36px;
}

.navigation li.has-submenu:hover > a,
.navigation li.has-submenu:focus-within > a {
    color: #2464ea;
}

.navigation li.has-submenu:hover > .submenu,
.navigation li.has-submenu:focus-within > .submenu {
    display: block !important;
}

.submenu li a {
    display: block;
    padding: 8px 16px;
    white-space: nowrap;
    color: #333;
    text-decoration: none;
}

.navigation {
    position: relative;
    z-index: 3000;
}

/*.navigation::before {*/
/*	content: '';*/
/*	position: fixed;*/
/*	inset: 0;*/
/*	background: rgba(51, 51, 51, 0.5);*/
/*	opacity: 0;*/
/*	pointer-events: none;*/
/*	transition: opacity .25s ease;*/
/*	z-index: -1; !* ВАЖНО: под меню *!*/
/*}*/

/*.navigation:has(.has-submenu:hover)::before {*/
/*	opacity: 1;*/
/*}*/

.submenu {
    position: absolute;
    z-index: 3100;
    border-radius: 28px;
    padding: 24px;
}

.has-submenu .submenu li a {
    font-weight: 600 !important;
    font-size: 16px !important;
    line-height: 140% !important;
    color: #333 !important;
}