/* Custom 2-column dropdown style */
@media (min-width: 992px) {

    /* Container Styling */
    .main-menu .navigation>li.dropdown>ul.two-column-dropdown {
        width: 480px !important;
        /* Reduced width to compact the two columns */
        display: block !important;
        /* Changed from flex to block for column-count */
        column-count: 2 !important;
        column-gap: 0 !important;
        padding: 15px 0px !important;
        /* Adjusted padding */
        /* Reduced top/bottom padding */
        left: -150px !important;

        /* Modern Look: Glass-like feel or clean card */
        background: #ffffff !important;
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1) !important;
        border-radius: 8px !important;
        border-top: 3px solid #365ada !important;
        /* Brand Blue Top Border */

        /* Entrance Animation */
        animation: dropdownSlideUp 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
        transform-origin: top center;
        opacity: 0;
        /* Starr hidden for animation */
    }

    /* Positioning for right-side items to prevent overflow */
    .main-menu .navigation>li.dropdown:nth-last-child(1)>ul.two-column-dropdown,
    .main-menu .navigation>li.dropdown:nth-last-child(2)>ul.two-column-dropdown {
        right: 0 !important;
        left: auto !important;
    }

    /* Column Sizing */
    .main-menu .navigation>li.dropdown>ul.two-column-dropdown>li {
        width: 100% !important;
        /* Full width of the column */
        display: block !important;
        /* Changed to block to allow explicit breaks */
        break-inside: avoid !important;
        border-bottom: none !important;
    }

    /* Item Styling */
    .main-menu .navigation>li.dropdown>ul.two-column-dropdown>li>a {
        padding: 8px 15px !important;
        /* Reduced vertical padding */
        white-space: normal !important;
        font-weight: 500 !important;
        /* Medium weight */
        font-size: 15px !important;
        color: #555 !important;
        transition: all 0.3s ease !important;
        border-radius: 6px;
        display: block !important;
        position: relative;
    }

    /* Item Hover Effect - UX Animation */
    .main-menu .navigation>li.dropdown>ul.two-column-dropdown>li>a:hover {
        background: rgba(54, 90, 218, 0.04) !important;
        color: #365ada !important;
        transform: translateX(5px);
        padding-left: 20px !important;
    }

    /* SPLIT COLUMN DROPDOWN (Fixed Vertical Spacing) */
    .main-menu .navigation>li.dropdown>.split-column-dropdown {
        width: 550px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        padding: 15px 0 !important;
        left: -180px !important;

        background: #ffffff !important;
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1) !important;
        border-radius: 8px !important;
        border-top: 3px solid #365ada !important;

        animation: dropdownSlideUp 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
        transform-origin: top center;
        opacity: 0;
    }

    .main-menu .navigation>li.dropdown>.split-column-dropdown .dropdown-column {
        width: 50% !important;
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .main-menu .navigation>li.dropdown>.split-column-dropdown .dropdown-column li {
        width: 100% !important;
        padding: 0 15px !important;
        margin-bottom: 0 !important;
        border: none !important;
    }

    .main-menu .navigation>li.dropdown>.split-column-dropdown .dropdown-column li a {
        padding: 8px 15px !important;
        white-space: normal !important;
        font-weight: 500 !important;
        font-size: 15px !important;
        color: #555 !important;
        transition: all 0.3s ease !important;
        border-radius: 6px;
        display: block !important;
    }

    .main-menu .navigation>li.dropdown>.split-column-dropdown .dropdown-column li a:hover {
        background: rgba(54, 90, 218, 0.04) !important;
        color: #365ada !important;
        transform: translateX(5px);
        padding-left: 20px !important;
    }
}

/* Keyframes */
@keyframes dropdownSlideUp {
    0% {
        opacity: 0;
        transform: translateY(10px) scale(0.98);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}