/* Target Elementor Nav Menu and standard WordPress nav menus */

/* Widen the overall header container if necessary to allow full spread */
header .elementor-container,
header .elementor-row {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 40px !important;
}

/* Center the menu and space items out evenly */
.elementor-nav-menu--main,
nav.main_menu ul,
.menu-main-menu-container ul {
    display: flex !important;
    justify-content: space-evenly !important; /* Spreads items out across the full width */
    align-items: center !important;
    width: 100% !important;
}

/* Adjust individual menu items */
.elementor-nav-menu--main .elementor-item,
nav.main_menu ul li a,
.menu-main-menu-container ul li a {
    font-family: inherit; /* Inherit theme font */
    font-size: 14px !important; /* Adjust as needed */
    letter-spacing: 3px !important; /* Wide letter spacing to match image */
    text-transform: uppercase !important;
    color: #ffffff !important; /* Assuming white text based on image */
    padding: 10px 20px !important;
    font-weight: 500 !important;
}

/* Handle the specific layout where the logo is on the left and menu items spread out */
/* If the logo is part of the same flex container, we push the rest of the items */
header .elementor-widget-nav-menu {
    flex-grow: 1;
}

/* Optional: Subtle hover effect */
.elementor-nav-menu--main .elementor-item:hover,
nav.main_menu ul li a:hover,
.menu-main-menu-container ul li a:hover {
    opacity: 0.8;
}