.mega-menu { background: #2a395a;
border-bottom: 0; width: 100%;
position: relative; }
.mega-menu .container {
width: 100%;
max-width: 1200px;
margin: 0 auto; padding: 0 8px;
}
.menu-items {
display: flex;
list-style: none;
margin: 0;
padding: 0;
width: 100%;
justify-content: flex-start; flex-wrap: nowrap;  gap: 8px;
}
.menu-items > li {
position: static; flex: 0 0 auto; }
.menu-items > li > a {
display: block; padding: 10px 10px;
color: #fff; font-weight: 600;
text-decoration: none;
transition: background 0.2s, color 0.2s;
font-size: 14px;
white-space: nowrap;
}
.menu-items > li > a:hover {
background: #1e2a3d; }
.has-dropdown:hover .mega-dropdown {
display: block;
}
.mega-dropdown {
display: none;
position: absolute; left: 50%;
right: auto;
top: calc(100% - 1px); transform: translateX(-50%);
width: min(1200px, calc(100vw - 24px));
background: #fff;
border-top: 0; box-shadow: 0 8px 16px rgba(0,0,0,0.1);
z-index: 1000;
padding: 0 0 12px; max-height: 80vh;
overflow-y: auto;
}
.dropdown-content {
width: 100%;
max-width: none; margin: 0 auto;
padding: 0 8px; display: flex;
flex-wrap: wrap;
justify-content: center; } .row-menu {
display: flex;
flex-wrap: wrap;
margin: 0;
justify-content: flex-start;
width: 100%;
}
.menu-column {
flex: 0 0 16.666%;
max-width: 16.666%;
padding: 0 12px; margin-bottom: 10px;
box-sizing: border-box;
}
.menu-column h4 {
font-size: 13px;
font-weight: 600;
margin: 0 0 5px 0;
color: #2a395a;
line-height: 1.2;
} .menu-column h4.no-border {
border-bottom: none;
padding-bottom: 0;
}
.menu-column h4 a {
color: #2a395a;
text-decoration: none;
transition: color 0.3s;
display: block;
padding: 3px 0;
white-space: nowrap; overflow: hidden;
text-overflow: ellipsis;
}
.menu-column h4 a:hover {
color: #ff5722;
}
.menu-links {
list-style: none;
margin: 0;
padding: 0;
}
.menu-links {
padding: 0;
margin: 0;
list-style: none;
}
.menu-links li {
margin-bottom: 3px;
line-height: 1.2;
}
.menu-links li a {
color: #666;
font-size: 12px;
text-decoration: none;
transition: color 0.3s;
display: block;
padding: 2px 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap; }
.menu-links li a:hover {
color: #ff5722;
} .mega-dropdown {
max-height: 80vh; overflow-y: auto; } @keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
.has-dropdown:hover .mega-dropdown {
animation: fadeIn 0.2s forwards;
} @media (min-width: 1400px) {
.menu-column {
flex: 0 0 14.285%;
max-width: 14.285%;
}
}
@media (max-width: 1200px) {
.menu-column {
flex: 0 0 20%;
max-width: 20%;
} .menu-items { gap: 6px; }
.menu-items > li > a { padding: 8px 8px; font-size: 13px; }
}  .mega-menu .menu-items > li { position: static !important; overflow: visible; }
.mega-menu .menu-items > li .mega-dropdown {
left: 50% !important;
right: auto !important;
transform: translateX(-50%) !important;
width: min(1200px, calc(100vw - 24px)) !important;
}
@media (max-width: 991px) {
.menu-column {
flex: 0 0 25%;
max-width: 25%;
}
}
@media (max-width: 767px) {
.menu-column {
flex: 0 0 33.333%;
max-width: 33.333%;
}
}
@media (max-width: 575px) {
.menu-column {
flex: 0 0 50%;
max-width: 50%;
}
} .mobile-main-menu {
list-style: none;
margin: 0;
padding: 0;
}
.mobile-main-menu li {
position: relative;
}
.mobile-main-menu li > a {
display: block;
padding-right: 36px; }
.mobile-main-menu .sub-menu {
display: none; list-style: none;
margin: 0;
padding: 6px 0 6px 14px; border-left: 2px solid #e9ecef;
}
.mobile-main-menu li.open > .sub-menu {
display: block; }
.submenu-toggle {
background: none;
border: 0;
color: #2a395a;
font-size: 16px;
line-height: 1;
padding: 6px;
cursor: pointer;
position: absolute;
right: 10px;
top: 14px; transform: none;
width: 28px; text-align: center;
} .submenu-toggle:focus { outline: none; }