<!-- Меню второго уровня из Zero-блока по клику или наведению | https://necodim.ru/tilda/zero-menu-sub -->
<style>
.uc-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
    width: 100%;
    transition: background-color 0.3s ease, backdrop-filter 0.3s ease;
}


.uc-menu.scrolled {
    background-color: rgba(255, 255, 255, 0.7); /* Белый с прозрачностью 70% */
    backdrop-filter: blur(15px); /* Эффект блюра */
    -webkit-backdrop-filter: blur(15px); /* Для Safari */
}


.uc-mobile-menu {
    z-index: 999998;
}

.uc-menu-sub .t396__artboard {
    position: fixed;
    top: 70px;
    left: 0;
    z-index: 999998;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-2000px);
    transition: opacity .2s ease-in;
}
.uc-menu-sub .t396__artboard.active {
    pointer-events: all !important;
    transform: translateY(0px) !important;
    opacity: 1;
}
.menu-btn.active .tn-atom {
    color:  !important;
    background-color:  !important;
    border-color:  !important;
}
</style>

<script>
$(window).on('scroll', function() {
    const scrollTop = $(this).scrollTop();
    const menu = $('.uc-menu');

    if (scrollTop > 10) {
        menu.addClass('scrolled');
    } else {
        menu.removeClass('scrolled');
    }
});
</script>


<script>
$(function() {
    let menu = $('.uc-menu'),
        menuBtn = menu.find('.menu-btn'),
        menuBtnLink = '#menu',
        menuSub = $('.uc-menu-sub'),
        menuSubArtboard = menuSub.find('.t396__artboard'),
        menuSubWrapper;

    // Оборачиваем элементы подменю
    for (let i = 0; i < menuSub.length; i++) {
        $(menuSub[i]).find('.t396__elem').wrapAll('<div class="menu-sub">');
    }
    menuSubWrapper = $('.menu-sub');

    // Получаем href из <a> внутри menu-btn
    function getHrefFromBtn(elem) {
        return $(elem).find('a[href^="#menu"]').attr('href');
    }

    function menuSubOpen(e) {
        e.preventDefault();
        let target = $(e.currentTarget);
        let href = getHrefFromBtn(target);
        if (!href) return;

        menuBtn.removeClass('active');
        menuSubArtboard.removeClass('active');

        let n = parseInt(href.replace(menuBtnLink, ''), 10) - 1;
        $(menuBtn[n]).addClass('active');
        $(menuSub[n]).find('.t396__artboard').addClass('active');

        if (typeof t_lazyload_update === 'function') {
            t_lazyload_update();
        }
    }

    function menuSubClose(e) {
        e.preventDefault();
        menuBtn.removeClass('active');
        menuSubArtboard.removeClass('active');
    }

    // Наведение на блок
    menuBtn.hover(menuSubOpen);
    menuSubWrapper.mouseleave(menuSubClose);
    menuSubArtboard.mouseleave(menuSubClose);
});
</script>