/* 1. LOGO FIX (Your existing code) */
/* Ensures the logo image remains fully visible and correctly blended */
.custom-logo {
    filter: none !important;
    mix-blend-mode: normal !important;
    opacity: 1 !important;
}

/* 2. MAIN HEADER STYLING (Your existing code) */
/* Applies the fixed position, transparency (0.3 opacity), and blur (8px) to the main navigation bar */
.site-primary-header-wrap {
    background-color: rgba(255, 255, 255, 0.3);  /* Semi-transparent background */
    backdrop-filter: blur(8px);                 /* Apply a blur of 8 pixels */
    -webkit-backdrop-filter: blur(8px);         /* Safari Compatibility */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

/* 3. SUB-MENU STYLING FIX (Increased Specificity to override theme defaults) */
/* Targets the dropdown sub-menu container and forces the background and blur */
.ast-desktop .site-primary-header-wrap .main-header-menu .sub-menu {
    /* Match the main header's effects and use !important for enforcement */
    background-color: rgba(255, 255, 255, 0.3) !important; 
    backdrop-filter: blur(8px) !important; 
    -webkit-backdrop-filter: blur(8px) !important;
    
    /* Ensure the sub-menu is above other content */
    z-index: 999 !important; 
    
    /* Optional: Subtle box shadow for definition */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); 
}

/* 4. SUB-MENU ITEM FIX */
/* Ensures individual list item backgrounds don't block the transparency */
.ast-desktop .site-primary-header-wrap .main-header-menu .sub-menu li {
    background: transparent !important;
}

/* 5. SUB-MENU LINK READABILITY & HOVER STATE */
/* Styles links inside the sub-menu for clear visibility */
.ast-desktop .site-primary-header-wrap .main-header-menu .sub-menu a {
    color: #000000 !important; /* Default text color in the sub-menu */
}

/* Provides a clean visual cue when hovering over a sub-menu item */
.ast-desktop .site-primary-header-wrap .main-header-menu .sub-menu a:hover {
    background-color: rgba(0, 0, 0, 0.1) !important; /* Subtle dark background on hover */
    color: #000000 !important;
}
/* 6. MAIN MENU LINK HOVER STYLE */
/* Applies the subtle hover effect to the top-level menu items */
.ast-desktop .site-primary-header-wrap .main-header-menu > .menu-item > a:hover {
    /* Subtle dark background on hover, matching the sub-menu */
    background-color: rgba(0, 0, 0, 0.1) !important; 
    /* Ensure text color is consistent */
    color: #000000 !important;
}