

.main-navigation .main-nav,
.main-navigation .main-nav > ul,
.main-navigation .main-nav ul,
ul#menu-top-navigation {
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
}

#site-navigation::before,
.main-navigation::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.06),
        rgba(255, 255, 255, 0.28),
        rgba(255, 255, 255, 0.06)
    ) !important;
    display: block !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

#site-navigation::after,
.main-navigation::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.12),
        rgba(255, 255, 255, 0.64),
        rgba(255, 255, 255, 0.12)
    ) !important;
    display: block !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

.main-navigation .inside-navigation::before,
.main-navigation .inside-navigation::after,
.main-navigation .main-nav::before,
.main-navigation .main-nav::after {
    display: none !important;
    content: none !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.site-header,
header.site-header,
.main-header-bar,
.ast-primary-header-bar,
.ast-above-header-wrap,
.ast-below-header-wrap,
.ast-main-header-wrap,
.ast-builder-grid-row,
.inside-header {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
}

.main-navigation .main-nav,
.main-navigation .main-nav > ul,
.main-navigation .main-nav ul,
ul#menu-top-navigation {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

ul#menu-top-navigation {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
}

ul#menu-top-navigation > li {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    position: relative !important;
}

ul#menu-top-navigation > li > a {
    color: rgba(255, 255, 255, 0.92) !important;
    background: transparent !important;
    font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.15px !important;
    text-transform: none !important;
    line-height: 1 !important;
    padding: 20px 13px !important;
    border: none !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    min-height: auto !important;
    height: auto !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: color 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease !important;
    position: relative !important;
    box-sizing: border-box !important;
}

ul#menu-top-navigation > li:hover > a,
ul#menu-top-navigation > li:focus-within > a,
ul#menu-top-navigation > li.sfHover > a,
ul#menu-top-navigation > li > a:hover,
ul#menu-top-navigation > li > a:focus {
    color: #ffffff !important;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.13),
        rgba(118, 132, 154, 0.1)
    ) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        inset 0 -1px 0 rgba(255, 255, 255, 0.1) !important;
}

ul#menu-top-navigation > li > a::after {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    right: 13px !important;
    bottom: 11px !important;
    height: 2px !important;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0),
        rgba(230, 235, 242, 0.95),
        rgba(255, 255, 255, 0)
    ) !important;
    border-radius: 10px !important;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    transition: transform 0.25s ease !important;
}

ul#menu-top-navigation > li:hover > a::after,
ul#menu-top-navigation > li.sfHover > a::after,
ul#menu-top-navigation > li > a:hover::after,
ul#menu-top-navigation > li:focus-within > a::after {
    transform: scaleX(1) !important;
}

ul#menu-top-navigation > li.current-menu-item > a,
ul#menu-top-navigation > li.current_page_item > a,
ul#menu-top-navigation > li.current-menu-parent > a,
ul#menu-top-navigation > li.current-menu-ancestor > a,
ul#menu-top-navigation > li.current_page_parent > a,
ul#menu-top-navigation > li.current_page_ancestor > a {
    color: #ffffff !important;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.15),
        rgba(118, 132, 154, 0.14)
    ) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        inset 0 -3px 0 rgba(230, 235, 242, 0.95) !important;
}

ul#menu-top-navigation > li.current-menu-item > a::after,
ul#menu-top-navigation > li.current_page_item > a::after,
ul#menu-top-navigation > li.current-menu-parent > a::after,
ul#menu-top-navigation > li.current-menu-ancestor > a::after,
ul#menu-top-navigation > li.current_page_parent > a::after,
ul#menu-top-navigation > li.current_page_ancestor > a::after {
    display: none !important;
}

ul#menu-top-navigation .dropdown-menu-toggle {
    padding-left: 6px !important;
    color: inherit !important;
    opacity: 0.85 !important;
    background: transparent !important;
}

ul#menu-top-navigation .dropdown-menu-toggle,
ul#menu-top-navigation .dropdown-menu-toggle:hover,
ul#menu-top-navigation .dropdown-menu-toggle:focus {
    background: transparent !important;
    background-color: transparent !important;
}

ul#menu-top-navigation li.wc-menu-item > a,
ul#menu-top-navigation li.search-item > a {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    margin-left: 5px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.14),
        rgba(255, 255, 255, 0.055)
    ) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.17),
        inset 0 0 0 1px rgba(255, 255, 255, 0.1),
        0 4px 12px rgba(0, 0, 0, 0.28) !important;
}

ul#menu-top-navigation li.wc-menu-item > a:hover,
ul#menu-top-navigation li.search-item > a:hover,
ul#menu-top-navigation li.wc-menu-item > a:focus,
ul#menu-top-navigation li.search-item > a:focus {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.2),
        rgba(118, 132, 154, 0.16)
    ) !important;
    color: #ffffff !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        0 8px 20px rgba(0, 0, 0, 0.38) !important;
}

ul#menu-top-navigation li.wc-menu-item > a::after,
ul#menu-top-navigation li.search-item > a::after {
    display: none !important;
}

ul#menu-top-navigation .number-of-items {
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

@media screen and (min-width: 981px) {
    ul#menu-top-navigation li {
        position: relative !important;
    }

    ul#menu-top-navigation > li > ul.sub-menu {
        display: block !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: auto !important;
        width: auto !important;
        min-width: 260px !important;
        max-width: 340px !important;
        margin: 0 !important;
        padding: 10px !important;
        list-style: none !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.11) 0%,
                rgba(255, 255, 255, 0.045) 30%,
                rgba(0, 0, 0, 0.26) 100%
            ),
            radial-gradient(
                circle at 12% 0%,
                rgba(105, 118, 138, 0.14),
                rgba(105, 118, 138, 0) 55%
            ) !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        border-top: 1px solid rgba(255, 255, 255, 0.3) !important;
        border-radius: 0 0 14px 14px !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.1),
            0 24px 48px rgba(0, 0, 0, 0.56) !important;
        backdrop-filter: blur(14px) saturate(135%) !important;
        -webkit-backdrop-filter: blur(14px) saturate(135%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(4px) !important;
        transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease !important;
        z-index: 10050 !important;
        overflow: visible !important;
    }

    ul#menu-top-navigation > li.menu-item-has-children::after,
    ul#menu-top-navigation > li.page_item_has_children::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        bottom: -8px !important;
        height: 8px !important;
        background: transparent !important;
        z-index: 10049 !important;
    }

    ul#menu-top-navigation > li:hover > ul.sub-menu,
    ul#menu-top-navigation > li:focus-within > ul.sub-menu,
    ul#menu-top-navigation > li.sfHover > ul.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }

    ul#menu-top-navigation ul.sub-menu li {
        display: block !important;
        width: 100% !important;
        background: transparent !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        float: none !important;
    }

    ul#menu-top-navigation ul.sub-menu li a {
        display: block !important;
        width: 100% !important;
        color: rgba(255, 255, 255, 0.9) !important;
        background: transparent !important;
        font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 0.1px !important;
        line-height: 1.35 !important;
        padding: 11px 14px !important;
        border: none !important;
        border-radius: 9px !important;
        text-decoration: none !important;
        white-space: normal !important;
        box-sizing: border-box !important;
        transition: color 0.18s ease, background-color 0.18s ease, padding-left 0.18s ease !important;
    }

    ul#menu-top-navigation ul.sub-menu li a::after {
        display: none !important;
    }

    ul#menu-top-navigation ul.sub-menu li:hover > a,
    ul#menu-top-navigation ul.sub-menu li.sfHover > a,
    ul#menu-top-navigation ul.sub-menu li a:hover,
    ul#menu-top-navigation ul.sub-menu li a:focus {
        color: #ffffff !important;
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13),
            rgba(118, 132, 154, 0.09)
        ) !important;
        padding-left: 18px !important;
    }

    ul#menu-top-navigation ul.sub-menu li.current-menu-item > a,
    ul#menu-top-navigation ul.sub-menu li.current_page_item > a,
    ul#menu-top-navigation ul.sub-menu li.current-menu-parent > a,
    ul#menu-top-navigation ul.sub-menu li.current-menu-ancestor > a {
        color: #ffffff !important;
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.18),
            rgba(118, 132, 154, 0.14)
        ) !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu {
        display: block !important;
        position: absolute !important;
        top: 0 !important;
        left: 100% !important;
        right: auto !important;
        min-width: 260px !important;
        max-width: 340px !important;
        margin: 0 !important;
        margin-left: 8px !important;
        padding: 10px !important;
        border-radius: 14px !important;
        border: 1px solid rgba(255, 255, 255, 0.16) !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.11) 0%,
                rgba(255, 255, 255, 0.045) 30%,
                rgba(0, 0, 0, 0.26) 100%
            ),
            radial-gradient(
                circle at 12% 0%,
                rgba(105, 118, 138, 0.14),
                rgba(105, 118, 138, 0) 55%
            ) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.1),
            0 24px 48px rgba(0, 0, 0, 0.56) !important;
        backdrop-filter: blur(14px) saturate(135%) !important;
        -webkit-backdrop-filter: blur(14px) saturate(135%) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateX(4px) !important;
        transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease !important;
        z-index: 10060 !important;
        overflow: visible !important;
    }

    ul#menu-top-navigation ul.sub-menu li.menu-item-has-children::after,
    ul#menu-top-navigation ul.sub-menu li.page_item_has_children::after {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        right: -10px !important;
        width: 10px !important;
        height: 100% !important;
        background: transparent !important;
        z-index: 10059 !important;
    }

    ul#menu-top-navigation ul.sub-menu li:hover > ul.sub-menu,
    ul#menu-top-navigation ul.sub-menu li:focus-within > ul.sub-menu,
    ul#menu-top-navigation ul.sub-menu li.sfHover > ul.sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(0) !important;
    }

    .main-navigation ul ul,
    .main-navigation .main-nav ul ul,
    ul#menu-top-navigation ul.sub-menu {
        z-index: 10050 !important;
    }
}

body #site-navigation,
body .main-navigation {
    background-color: rgba(8, 11, 16, 0.98) !important;
    background-image:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.12) 0%,
            rgba(255, 255, 255, 0.055) 24%,
            rgba(255, 255, 255, 0.018) 48%,
            rgba(0, 0, 0, 0.28) 100%
        ),
        radial-gradient(
            circle at 22% 0%,
            rgba(105, 118, 138, 0.16) 0%,
            rgba(105, 118, 138, 0.055) 28%,
            rgba(105, 118, 138, 0) 58%
        ),
        linear-gradient(
            90deg,
            rgba(5, 7, 11, 0.99) 0%,
            rgba(10, 14, 21, 0.98) 34%,
            rgba(13, 17, 25, 0.98) 66%,
            rgba(6, 8, 13, 0.99) 100%
        ) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.42) !important;
}

body .main-navigation .inside-navigation,
body .main-navigation .main-nav,
body .main-navigation .main-nav > ul {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
}

.main-navigation .main-nav ul li[class*="current-menu-"] > a,
.main-navigation .main-nav ul li[class*="current_page"] > a {
    color: #ffffff !important;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li.sfHover > a {
    color: #ffffff !important;
}

.main-navigation .main-nav ul li a,
.main-navigation .main-nav ul li.menu-item-has-children > a {
    border: none !important;
}

.main-navigation .main-nav ul li a {
    line-height: 1 !important;
}

@media screen and (max-width: 1200px) {
    .main-navigation .inside-navigation {
        max-width: 100% !important;
        padding: 0 14px !important;
    }

    ul#menu-top-navigation {
        gap: 2px !important;
    }

    ul#menu-top-navigation > li > a {
        font-size: 12px !important;
        padding: 19px 9px !important;
    }

    ul#menu-top-navigation li.wc-menu-item > a,
    ul#menu-top-navigation li.search-item > a {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        margin-left: 3px !important;
    }
}

@media screen and (max-width: 1024px) {
    .main-navigation .inside-navigation {
        padding: 0 10px !important;
    }

    ul#menu-top-navigation > li > a {
        font-size: 11.5px !important;
        padding: 18px 7px !important;
    }

    ul#menu-top-navigation .dropdown-menu-toggle {
        padding-left: 4px !important;
    }
}

@media screen and (max-width: 980px) {
    #site-navigation,
    .main-navigation {
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.11) 0%,
                rgba(255, 255, 255, 0.045) 38%,
                rgba(0, 0, 0, 0.24) 100%
            ),
            radial-gradient(
                circle at 18% 0%,
                rgba(105, 118, 138, 0.14),
                rgba(105, 118, 138, 0) 60%
            ) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.14),
            inset 0 -1px 0 rgba(255, 255, 255, 0.18),
            0 12px 28px rgba(0, 0, 0, 0.5) !important;
        backdrop-filter: blur(12px) saturate(135%) !important;
        -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
        position: relative !important;
        z-index: 10000 !important;
        width: 100% !important;
        border: none !important;
        border-top: 1px solid rgba(255, 255, 255, 0.16) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.42) !important;
    }

    .main-navigation .inside-navigation {
        min-height: 54px !important;
        display: block !important;
        max-width: 100% !important;
        padding: 0 !important;
        background: rgba(8, 11, 16, 0.99) !important;
        border: none !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    .main-navigation .menu-toggle,
    #site-navigation .menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        min-height: 54px !important;
        padding: 0 22px !important;
        color: #ffffff !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.105) 0%,
                rgba(255, 255, 255, 0.035) 100%
            ) !important;
        border: none !important;
        border-top: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-radius: 0 !important;
        font-family: "Inter", "Montserrat", "Segoe UI", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 800 !important;
        letter-spacing: 0.2px !important;
        line-height: 1 !important;
        text-transform: none !important;
        box-shadow: none !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
    }

    .main-navigation .menu-toggle:hover,
    .main-navigation .menu-toggle:focus,
    #site-navigation .menu-toggle:hover,
    #site-navigation .menu-toggle:focus {
        color: #ffffff !important;
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.14),
            rgba(118, 132, 154, 0.1)
        ) !important;
        outline: none !important;
    }

    .main-navigation .main-nav,
    .main-navigation .main-nav > ul,
    .main-navigation .main-nav ul,
    ul#menu-top-navigation {
        width: 100% !important;
        background: rgba(8, 11, 16, 0.99) !important;
        background-color: rgba(8, 11, 16, 0.99) !important;
        background-image: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        border: none !important;
    }

    .main-navigation:not(.toggled) .main-nav,
    .main-navigation:not(.toggled) .main-nav > ul,
    .main-navigation:not(.toggled) ul#menu-top-navigation,
    #site-navigation:not(.toggled) .main-nav,
    #site-navigation:not(.toggled) .main-nav > ul,
    #site-navigation:not(.toggled) ul#menu-top-navigation {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }

    .main-navigation.toggled .main-nav,
    .main-navigation.toggled .main-nav > ul,
    .main-navigation.toggled ul#menu-top-navigation,
    #site-navigation.toggled .main-nav,
    #site-navigation.toggled .main-nav > ul,
    #site-navigation.toggled ul#menu-top-navigation {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        overflow: visible !important;
    }

    .main-navigation.toggled ul#menu-top-navigation,
    #site-navigation.toggled ul#menu-top-navigation {
        display: block !important;
        padding: 8px 0 !important;
        margin: 0 !important;
        gap: 0 !important;
        list-style: none !important;
    }

    ul#menu-top-navigation > li {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        position: relative !important;
        border: none !important;
    }

    ul#menu-top-navigation > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        color: #ffffff !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        padding: 15px 22px !important;
        border-radius: 0 !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.09) !important;
        background: transparent !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    ul#menu-top-navigation > li > a::after {
        display: none !important;
    }

    ul#menu-top-navigation > li:hover > a,
    ul#menu-top-navigation > li > a:hover,
    ul#menu-top-navigation > li > a:focus,
    ul#menu-top-navigation > li:focus-within > a {
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13),
            rgba(118, 132, 154, 0.08)
        ) !important;
        color: #ffffff !important;
    }

    ul#menu-top-navigation > li.current-menu-item > a,
    ul#menu-top-navigation > li.current_page_item > a,
    ul#menu-top-navigation > li.current-menu-parent > a,
    ul#menu-top-navigation > li.current-menu-ancestor > a,
    ul#menu-top-navigation > li.current_page_parent > a,
    ul#menu-top-navigation > li.current_page_ancestor > a {
        background: linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.16),
            rgba(118, 132, 154, 0.12)
        ) !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    ul#menu-top-navigation .dropdown-menu-toggle {
        margin-left: auto !important;
        padding-left: 10px !important;
        color: inherit !important;
        background: transparent !important;
    }

    ul#menu-top-navigation ul.sub-menu {
        display: none !important;
        position: static !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        border: none !important;
        background: rgba(11, 15, 22, 0.99) !important;
        background-color: rgba(11, 15, 22, 0.99) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }

    .main-navigation.toggled ul#menu-top-navigation ul.sub-menu.toggled-on,
    .main-navigation.toggled ul#menu-top-navigation li.sfHover > ul.sub-menu,
    .main-navigation.toggled ul#menu-top-navigation li:focus-within > ul.sub-menu,
    #site-navigation.toggled ul#menu-top-navigation ul.sub-menu.toggled-on,
    #site-navigation.toggled ul#menu-top-navigation li.sfHover > ul.sub-menu,
    #site-navigation.toggled ul#menu-top-navigation li:focus-within > ul.sub-menu {
        display: block !important;
    }

    ul#menu-top-navigation ul.sub-menu li a {
        display: block !important;
        width: 100% !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        color: rgba(255, 255, 255, 0.9) !important;
        padding: 13px 22px 13px 38px !important;
        border-radius: 0 !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.075) !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu {
        margin-left: 0 !important;
        border-radius: 0 !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu li a {
        padding-left: 54px !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu ul.sub-menu li a {
        padding-left: 70px !important;
    }

    ul#menu-top-navigation ul.sub-menu li:hover > a,
    ul#menu-top-navigation ul.sub-menu li a:hover,
    ul#menu-top-navigation ul.sub-menu li a:focus {
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13),
            rgba(118, 132, 154, 0.08)
        ) !important;
        color: #ffffff !important;
        padding-left: 42px !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu li:hover > a,
    ul#menu-top-navigation ul.sub-menu ul.sub-menu li a:hover,
    ul#menu-top-navigation ul.sub-menu ul.sub-menu li a:focus {
        padding-left: 58px !important;
    }

    ul#menu-top-navigation li.wc-menu-item > a,
    ul#menu-top-navigation li.search-item > a {
        width: 100% !important;
        height: auto !important;
        min-width: 100% !important;
        border-radius: 0 !important;
        justify-content: flex-start !important;
        padding: 15px 22px !important;
        margin-left: 0 !important;
        background: transparent !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.09) !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    ul#menu-top-navigation li.wc-menu-item > a:hover,
    ul#menu-top-navigation li.search-item > a:hover,
    ul#menu-top-navigation li.wc-menu-item > a:focus,
    ul#menu-top-navigation li.search-item > a:focus {
        background: linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13),
            rgba(118, 132, 154, 0.08)
        ) !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }
}

@media screen and (max-width: 480px) {
    .main-navigation .menu-toggle,
    #site-navigation .menu-toggle {
        min-height: 52px !important;
        padding: 0 18px !important;
        font-size: 13.5px !important;
    }

    ul#menu-top-navigation > li > a {
        font-size: 13.5px !important;
        padding: 14px 18px !important;
    }

    ul#menu-top-navigation ul.sub-menu li a {
        font-size: 13px !important;
        padding: 12px 18px 12px 34px !important;
    }

    ul#menu-top-navigation ul.sub-menu ul.sub-menu li a {
        padding-left: 48px !important;
    }
}

@media screen and (max-width: 360px) {
    .main-navigation .menu-toggle,
    #site-navigation .menu-toggle {
        min-height: 50px !important;
        padding: 0 16px !important;
        font-size: 13px !important;
    }

    ul#menu-top-navigation > li > a {
        font-size: 13px !important;
        padding: 13px 16px !important;
    }

    ul#menu-top-navigation ul.sub-menu li a {
        font-size: 12.5px !important;
        padding: 12px 16px 12px 30px !important;
    }
}

/* ASC pages: show reveal elements immediately on load */
.asc-premium-page .asc-reveal,
.asc-premium-page .asc-reveal.visible,
.asc-premium-page .asc-tab-panel,
.asc-elite-page .asc-reveal,
.asc-elite-page .asc-reveal.visible,
.asc-elite-page .asc-tab-panel {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	transition: none !important;
	animation: none !important;
}

/* If sections start hidden with common animation-related classes */
.asc-premium-page [class*="reveal"],
.asc-premium-page [class*="fade-in"],
.asc-premium-page [class*="fade-up"],
.asc-premium-page [class*="animate"],
.asc-elite-page [class*="reveal"],
.asc-elite-page [class*="fade-in"],
.asc-elite-page [class*="fade-up"],
.asc-elite-page [class*="animate"] {
	opacity: 1;
	visibility: visible;
	transform: none;
}

/* Make sure images are not hidden by animation states */
.asc-premium-page img,
.asc-elite-page img {
	opacity: 1;
	visibility: visible;
}


/* Immediate load fallback */
.ascfs-reveal,
.ascfs-reveal:not(.visible) {
	opacity: 1 !important;
	transform: none !important;
	visibility: visible !important;
}

.ascfs-mobile-sections-overlay[hidden],
.ascfs-mobile-sections-panel[hidden],
.ascfs-sticky-cta[aria-hidden="true"] {
	pointer-events: none !important;
}

html,
body,
.ascfs-premium-page,
.ascbasket-page,
.asc-premium-page {
	visibility: visible !important;
	opacity: 1 !important;
}
/* ===== Global ASC immediate-load fix ===== */
[class*="asc"] .ascfs-reveal,
[class*="asc"] .ascfs-reveal:not(.visible),
[class*="asc"] .ascbrc-reveal,
[class*="asc"] .ascbrc-reveal:not(.visible) {
	opacity: 1 !important;
	transform: none !important;
	visibility: visible !important;
	will-change: auto !important;
}

/* Hidden overlays / sticky UI must not block interaction */
[class*="asc"] [hidden] {
	pointer-events: none !important;
}

[class*="asc"] .ascfs-sticky-cta[aria-hidden="true"],
[class*="asc"] .ascbrc-sticky-cta[aria-hidden="true"] {
	pointer-events: none !important;
}

/* Main wrappers visible on load */
.ascfs-premium-page,
.ascbrc-premium-page,
.ascbasket-page,
.asc-premium-page {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
}


/* =========================================================
   ASC shortcode pages: force reveal sections to show on load
   Fixes pages that only appear after hover / scroll / interaction
   ========================================================= */

/* BRCGS Food Safety page */
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page) .ascbrc-reveal.visible,

/* BRCGS Packaging Materials page */
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page) .ascbrcp-reveal.visible,

/* Other ASC reveal systems */
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page) .ascfs-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page) .asc-reveal.visible,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal,
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal:not(.visible),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) .asc-reveal.visible {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	transition: none !important;
	animation: none !important;
	will-change: auto !important;
}

/* Force main ASC page wrappers visible */
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrc-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbrcp-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascfs-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .ascbasket-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-premium-page),
:is(#ascForceLoad#ascForceLoad#ascForceLoad, .asc-elite-page) {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
}

/* Prevent hidden ASC sticky elements from blocking clicks */
.ascbrc-sticky-cta[aria-hidden="true"],
.ascbrcp-sticky-cta[aria-hidden="true"],
.ascfs-sticky-cta[aria-hidden="true"],
.asc-sticky-cta[aria-hidden="true"] {
	pointer-events: none !important;
}

/* Keep hidden panels/overlays from blocking interaction */
.ascbrc-premium-page [hidden],
.ascbrcp-premium-page [hidden],
.ascfs-premium-page [hidden],
.asc-premium-page [hidden],
.asc-elite-page [hidden] {
	pointer-events: none !important;
}



/* ASC FIX 2026-09-17: nested submenu arrows centred on their own row, and section-jump links not shown as the active page */
@media (min-width:769px){
nav:not(.toggled) ul#menu-top-navigation ul.sub-menu li.menu-item-has-children > a{position:relative !important;padding-right:38px !important}
nav:not(.toggled) ul#menu-top-navigation ul.sub-menu li.menu-item-has-children > a .dropdown-menu-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);float:none;margin:0;padding:0 8px;height:auto;line-height:1;display:flex;align-items:center}
}
ul#menu-top-navigation ul.sub-menu li.menu-item-type-custom.current-menu-item > a[href*="#"]:not(:hover):not(:focus-visible){background:transparent !important}


/* ASC FIX 2026-09-17b: Shop sub-menus open to the left so the third level stays on screen */
@media (min-width:769px){
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation ul.sub-menu li.menu-item-has-children > a{padding-right:38px !important}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 > ul.sub-menu{min-width:290px !important}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul li:hover > ul,
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul li.sfHover > ul,
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul li:focus-within > ul{left:auto !important;right:100% !important}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul ul{box-shadow:-8px 10px 24px rgba(0,0,0,.35)}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul.sub-menu li.menu-item-has-children > a{padding-right:16px !important;padding-left:38px !important}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul.sub-menu li.menu-item-has-children > a .dropdown-menu-toggle{right:auto !important;left:6px !important}
#site-navigation.main-navigation:not(.toggled) ul#menu-top-navigation > li.menu-item-40971 ul.sub-menu li.menu-item-has-children > a .dropdown-menu-toggle::before{transform:rotate(180deg)}
}


/* ASC 9 October 2026 (asc-nav-line-fix): the menu's two hairlines (::before at its top, ::after at its bottom) are
   absolutely positioned, but the menu itself was not, so they were drawn one screen-height down the page - across the
   home page hero. The menu anchors them now. */
#site-navigation, .main-navigation { position: relative; }

