.wp-block-columns {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 48px;
}

.wp-block-column {
    flex: 1 1 0;
}

dbox-widget {
    display: block;
    width: 100%;
}

@media (max-width: 1000px) {
    .wp-block-column {
        margin-bottom: 32px;
    }
}
@media (max-width: 900px) {
    .wp-block-columns {
        flex-wrap: wrap !important;
    }
}


/* 1. Main menu bar multi-color gradient background */
.site-header #site-navigation,
.main-navigation,
header nav {
    background-image: linear-gradient(to right, #fff450, #f7a9b8, #9160a9, #65cdf5) !important;
}

/* 1. Main menu bar multi-color gradient background */
.site-header #site-navigation,
.main-navigation,
header nav {
    background-image: linear-gradient(to right, #fff450, #f7a9b8, #9160a9, #65cdf5) !important;
}

/* 2. Base text styles for main navigation links */
.main-navigation ul li a,
header nav ul li a,
#site-navigation a {
    color: #ffffff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.35);
    font-size: 16px !important;
}

/* 3. Main menu text turns black on hover or active click */
.main-navigation ul li a:hover,
.main-navigation ul li:hover > a,
#site-navigation ul li[class*="current-"] > a {
    color: #000000 !important;
    background-color: transparent !important;
    text-shadow: none !important;
}

/* 4. Translucent light background with subtle 4px blur */
.main-navigation ul ul {
    background-color: rgba(245, 245, 245, 0.85) !important; 
    backdrop-filter: blur(4px) !important; 
    -webkit-backdrop-filter: blur(4px) !important; 
    border: 1px solid rgba(255, 255, 255, 0.5) !important; 
    box-shadow: 0px 6px 18px rgba(0, 0, 0, 0.1) !important;
}

/* Clear sub-item containers */
.main-navigation ul ul li {
    background: transparent !important;
}

/* 5. Submenu default text color forced to black */
.main-navigation ul ul li a,
#site-navigation ul ul li a {
    color: #000000 !important;
    text-shadow: none !important;
    font-size: 15px !important;
}

/* 6. FIX: Submenu individual text links strictly target hover states for pink change */
.main-navigation ul ul li a:hover,
.main-navigation ul ul li:hover > a:hover,
#site-navigation ul ul li a:hover {
    color: #f7a9b8 !important;
    background-color: transparent !important;
    text-shadow: none !important;
}

/* 7. Submenu text locks back to black when on the active page */
.main-navigation ul ul li[class*="current-"] > a,
#site-navigation ul ul li[class*="current-"] > a {
    color: #000000 !important;
    background-color: transparent !important;
    text-shadow: none !important;
}

/* Code to update the mobile view to work the same as pc display */

/* Change the mobile menu bar to the site gradient */
.main-navigation #toggle-menu {
    background: linear-gradient(
        90deg,
        #FDE047 0%,
        #F6A3B5 35%,
        #B57BC7 70%,
        #6EC6F5 100%
    ) !important;

    color: #ffffff !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,.35);
    border: none !important;
}