/* PARENT */
.brand-grid-fix {
    position: relative !important;
}
/* DROPDOWN - hidden by default */
.brand-grid-fix .sub-menu {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-top: 0 !important;
    /* 3 COLUMN GRID */
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px 30px !important;
    /* STYLE */
    background: rgba(17, 17, 17, 0.85) !important;
    backdrop-filter: blur(12px) !important;
    min-width: 750px !important;
    padding: 30px !important;
    border-radius: 0 0 15px 15px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5) !important;
    z-index: 999999 !important;
    list-style: none !important;
}
/* SHOW when JS adds .is-open */
.brand-grid-fix .sub-menu.is-open {
    display: grid !important;
}
/* EACH ITEM */
.brand-grid-fix .sub-menu li {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    list-style: none !important;
}
/* LINKS */
.brand-grid-fix .sub-menu li a {
    color: #ffffff !important;
    display: block !important;
    padding: 12px 15px !important;
    font-size: 16px !important;
    text-decoration: none !important;
    text-align: left !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}
/* HOVER STATE */
.brand-grid-fix .sub-menu li a:hover {
    color: #e2b013 !important;
    background: rgba(255, 255, 255, 0.07) !important;
}
/* ARROW - default state with transition ready */
.brand-grid-fix > a::after,
.brand-grid-fix > a .elementor-item-toggle,
.brand-grid-fix > a i,
.brand-grid-fix > a svg {
    transition: transform 0.3s ease !important;
}
/* ARROW - rotated when open */
.brand-grid-fix > a.menu-open::after,
.brand-grid-fix > a.menu-open .elementor-item-toggle,
.brand-grid-fix > a.menu-open i,
.brand-grid-fix > a.menu-open svg {
    transform: rotate(180deg) !important;
}
/* Force arrow visible on all pages */
.brand-grid-fix > a .elementor-item-toggle,
.brand-grid-fix > a i,
.brand-grid-fix > a svg {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: #ffffff !important;
}

/* Elementor sometimes does this */
.elementor-item-toggle {
    display: none;
}