.elementor-1236 .elementor-element.elementor-element-bd2655f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;--z-index:999;}.elementor-1236 .elementor-element.elementor-element-bd2655f:not(.elementor-motion-effects-element-type-background), .elementor-1236 .elementor-element.elementor-element-bd2655f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF00;}.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--border-radius:10px 10px 10px 10px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-1236 .elementor-element.elementor-element-cfdc2c1:not(.elementor-motion-effects-element-type-background), .elementor-1236 .elementor-element.elementor-element-cfdc2c1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#B9B9B929;}.elementor-1236 .elementor-element.elementor-element-9c8e06e{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1236 .elementor-element.elementor-element-a6d550f img{width:100%;max-width:100%;height:46px;object-fit:cover;object-position:center center;border-radius:6px 6px 6px 6px;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-menu-toggle{margin-left:auto;background-color:#3D3D3D;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu .elementor-item{font-family:"Syne", Sans-serif;font-size:16px;font-weight:300;text-transform:uppercase;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--main .elementor-item{color:#DBDBDB;fill:#DBDBDB;padding-left:0px;padding-right:0px;padding-top:0px;padding-bottom:0px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5{--e-nav-menu-horizontal-menu-item-margin:calc( 0px / 2 );}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:0px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a, .elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-menu-toggle{color:#FFFFFF;fill:#FFFFFF;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown{background-color:#1A1A1A;border-style:solid;border-color:#414141;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a:hover,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a:focus,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a.highlighted,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-menu-toggle:hover,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-menu-toggle:focus{color:#D6D6D6;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a:hover,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a:focus,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a.highlighted{background-color:#02010100;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a.elementor-item-active{color:#D6D6D6;background-color:#02010100;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown .elementor-item, .elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:"Syne", Sans-serif;font-weight:400;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown li:not(:last-child){border-style:none;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 div.elementor-menu-toggle{color:#C5C5C5;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 div.elementor-menu-toggle svg{fill:#C5C5C5;}.elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button{background-color:transparent;font-family:"Inter", Sans-serif;font-size:14px;font-weight:600;text-transform:uppercase;fill:#FFFFFF;color:#FFFFFF;background-image:linear-gradient(180deg, #0055FE 0%, #1B62EE 100%);box-shadow:0px 0px 16px 0px rgba(26.999999999999982, 97.99999999999993, 237.99999999999997, 0.41);transition-duration:0.6s;border-style:solid;border-width:2px 2px 2px 2px;border-color:#3F5FA0;padding:10px 20px 10px 20px;}.elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button:hover, .elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button:focus{background-color:transparent;color:#F0F0F0;background-image:radial-gradient(at center center, #0055FE 0%, #1B62EE 100%);border-color:#83A0DA;}.elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button:hover svg, .elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button:focus svg{fill:#F0F0F0;}.elementor-1236:not(.elementor-motion-effects-element-type-background), .elementor-1236 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0F0F0F;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--justify-content:space-between;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu .elementor-item{font-size:16px;}}@media(min-width:768px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--width:50%;}.elementor-1236 .elementor-element.elementor-element-9c8e06e{--width:8%;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--width:92%;}}@media(max-width:1200px) and (min-width:768px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--width:54%;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--width:100%;}}@media(max-width:1024px) and (min-width:768px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--width:63%;}.elementor-1236 .elementor-element.elementor-element-9c8e06e{--width:8%;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--width:100%;}}@media(max-width:880px) and (min-width:768px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--width:76%;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--width:100%;}}@media(max-width:1200px){.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--justify-content:space-between;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5{padding:0px 0px 0px 0px;--e-nav-menu-horizontal-menu-item-margin:calc( 0px / 2 );}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu .elementor-item{font-size:16px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--main .elementor-item{padding-left:0px;padding-right:0px;padding-top:0px;padding-bottom:0px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:0px;}}@media(max-width:767px){.elementor-1236 .elementor-element.elementor-element-bd2655f{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-1236 .elementor-element.elementor-element-cfdc2c1{--width:86%;}.elementor-1236 .elementor-element.elementor-element-9c8e06e{--width:20%;}.elementor-1236 .elementor-element.elementor-element-a6d550f img{height:36px;}.elementor-1236 .elementor-element.elementor-element-61eb6d9{--width:80%;--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--justify-content:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--nav-menu-icon-size:20px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown .elementor-item, .elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown  .elementor-sub-item{font-size:14px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown{border-width:1px 1px 1px 1px;border-radius:10px 10px 10px 10px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown li:first-child a{border-top-left-radius:10px;border-top-right-radius:10px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown li:last-child a{border-bottom-right-radius:10px;border-bottom-left-radius:10px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-nav-menu--dropdown a{padding-left:20px;padding-right:20px;padding-top:10px;padding-bottom:10px;}.elementor-1236 .elementor-element.elementor-element-8e58bf5 .elementor-menu-toggle{border-width:1px;border-radius:4px;}.elementor-1236 .elementor-element.elementor-element-1bf42da .elementor-button{font-size:14px;padding:6px 10px 6px 10px;}}/* Start custom CSS for nav-menu, class: .elementor-element-8e58bf5 */@media (max-width: 1024px) {
    /* 1. Стиль "Плаваючого острова" */
    .yaro-portal-menu {
        display: none !important;
        position: fixed !important;
        left: 40px !important; /* Збільшили відступи на 10px як ти просив */
        right: 40px !important;
        width: calc(100vw - 80px) !important;
        
        /* Статична позиція */
        top: 85px !important; 
        
        background: rgba(18, 18, 18, 0.98) !important;
        backdrop-filter: blur(25px) saturate(180%) !important;
        -webkit-backdrop-filter: blur(25px) saturate(180%) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        border-radius: 10px !important;
        
        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.8) !important;
        z-index: 99999999 !important;
        padding: 10px 0 !important;
        transform: none !important;
        
        /* Плавна корекція при скролі */
        transition: top 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* ФІКС ВІДСТАНІ ПРИ СКРОЛІ */
    /* Коли хедер "липне", ми примусово підтягуємо меню вгору */
    body.elementor-sticky--active .yaro-portal-menu {
        top: 85px !important; /* Це число прибере ту саму "дірку" при скролі */
    }

    .yaro-portal-menu.is-visible {
        display: block !important;
        animation: yaroSlideIn 0.4s cubic-bezier(0.2, 1, 0.3, 1) forwards;
    }

    /* 2. ПУНКТИ МЕНЮ ТА СТИЛЬНИЙ ХОВЕР */
    .yaro-portal-menu ul {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .yaro-portal-menu a {
        display: block !important;
        padding: 18px 25px !important;
        color: rgba(255, 255, 255, 0.6) !important; /* Трохи приглушений колір у спокої */
        font-size: 18px !important;
        text-decoration: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
        position: relative;
        transition: all 0.4s ease !important;
        overflow: hidden;
    }

    /* ПРЕМІАЛЬНА АНІМАЦІЯ ХОВЕРУ */
    .yaro-portal-menu a:hover {
        color: #ffffff !important;
        padding-left: 35px !important; /* М'який зсув тексту вправо */
        background: rgba(255, 255, 255, 0.03) !important;
    }

    .yaro-portal-menu a:hover::before {
        height: 50%;
    }

    .yaro-portal-menu li:last-child a {
        border-bottom: none !important;
    }
}

/* 1. ГЛОБАЛЬНЕ ПРИХОВУВАННЯ (Додай це ПОЗА @media) */
.yaro-portal-menu {
    display: none !important;
}

/* 2. Твій робочий блок для мобільних (залишається без змін) */
@media (max-width: 1024px) {
    .yaro-portal-menu {
        /* Твій код: position: fixed, top: 120px і так далі... */
        display: none !important; /* Це дублюється для безпеки */
        
        /* ... всі інші твої стилі ... */
    }

    /* Це правило спрацює тільки на мобілці при кліку */
    .yaro-portal-menu.is-visible {
        display: block !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-cfdc2c1 */.elementor-1236 .elementor-element.elementor-element-cfdc2c1 {
    /* Колір фону з низькою прозорістю */
    background: rgba(255, 255, 255, 0.03); 
    
    /* Ефект розмиття фону */
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px); /* Для Safari */
    
    /* Тонка рамка для ефекту скла */
    border: 1px solid rgba(255, 255, 255, 0.1);
    
    /* Заокруглення кутів */
    border-radius: 20px;
    
    /* Тінь для об'єму */
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}

/* 1. Базові налаштування для всіх пунктів */
.elementor-nav-menu--main .elementor-item {
    /* Додаємо відступ між пунктами, щоб вони не торкалися один одного */
    margin: 0 5px !important; 
    
    /* Зменшуємо внутрішні відступи (зробив їх компактнішими) */
    padding: 6px 10px !important; 
    
    /* Твій новий радіус */
    border-radius: 10px !important; 
    
    /* Плавність переходу */
    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1) !important;
    border: 1px solid transparent !important;
}

/* 2. Стан активного елемента (скляна плашка) */
.elementor-nav-menu--main .elementor-item.active-glass {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(12px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(160%) !important;
    
    /* Тонка, ледь помітна рамка */
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    
    /* Мінімалістична тінь */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    color: #ffffff !important;
}

/* 3. Легкий ефект при наведенні, щоб не перебивав активний */
.elementor-nav-menu--main .elementor-item:hover:not(.active-glass) {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

/* 1. Базові пункти меню (прозорі) */
.elementor-nav-menu--main .elementor-item {
    position: relative;
    z-index: 2; /* Текст має бути над краплею */
    background: transparent !important;
    border: none !important;
    margin: 0 8px !important;
    padding: 8px 10px !important;
    transition: color 0.4s ease;
}

/* 2. Сама "Скляна крапля" (Floating Background) */
.menu-glass-drop {
    position: absolute;
    z-index: 1;
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(15px) saturate(160%);
    -webkit-backdrop-filter: blur(15px) saturate(160%);
    border-radius: 10px; /* Твій радіус */
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    
    /* Ключ до ефекту краплі: дуже плавний і "гумовий" перехід */
    transition: all 0.6s cubic-bezier(0.5, 0, 0.1, 1);
    pointer-events: none; /* Щоб крапля не заважала клікати */
    opacity: 0; /* Спочатку прихована */
}

/* Активний стан тексту */
.elementor-nav-menu--main .elementor-item.active-glass {
    color: #ffffff !important;
}/* End custom CSS */