.elementor-kit-9{--e-global-color-primary:#C8593B;--e-global-color-secondary:#000;--e-global-color-text:#584F4D;--e-global-color-accent:#779985;--e-global-color-lighter:#978F8D;--e-global-color-dark:#000000;--e-global-color-border:#E3DEDD;--e-global-typography-primary-font-family:"Vast Shadow";--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Vast Shadow";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Golos Text";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Golos Text";--e-global-typography-accent-font-weight:500;background-color:#fff;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1410px;}.e-con{--container-max-width:1410px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS for page-settings *//* ==== ВАРІАНТ 1 (стара сторінка з відео) ==== */

.video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: 1;
}

.video-bg iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh !important;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

/* Кнопка "Подробнее" у варіанті 1 */
.video-btn {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

@media (max-width: 768px) {
    .video-btn {
        bottom: 30px;
        padding: 12px 24px;
        font-size: 16px;
    }
}

/* Контейнер для повноекранного відео в Elementor */
.elementor-container.video-fullscreen {
    height: 100vh;
    overflow: hidden;
    position: relative;
}



/* ==== ВАРІАНТ 2 (з кнопкою звуку) ==== */

/* Обгортка на весь екран */
.video2-wrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

/* Шар під плеєр */
.video2-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* iframe від YouTube API — розтягнути на весь блок */
.video2-bg iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

/* Блок керування (звук + ПОДРОБНЕЕ) — по центру знизу */
.video2-controls {
    position: absolute;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 16px; /* відстань між кнопками */
}

/* Кнопка ПОДРОБНЕЕ */
.video2-btn {
    padding: 12px 26px;
    background: rgba(0,0,0,0.8);
    color: #fff;
    border-radius: 999px;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(4px);
}

/* Кнопка ЗВУК — кругла */
.video2-sound-btn {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: rgba(0,0,0,0.6);
    border: none;
    cursor: pointer;
    position: relative;
    padding: 0;
}

/* Іконка звуку через ::before */
.video2-sound-btn::before {
    content: '🔈';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #fff;
}

/* Стан "звук увімкнено" */
.video2-sound-btn.sound-on::before {
    content: '🔊';
}

/* Ховер */
.video2-btn:hover,
.video2-sound-btn:hover {
    background: rgba(0,0,0,0.95);
}

/* ==== Адаптив для мобіли (варіант 2) ==== */
@media (max-width: 768px) {
    /* Підіймаємо блок кнопок вище, щоб не ховатись за панелями браузера/WP */
    .video2-controls {
        bottom: 80px;
        gap: 12px;
    }

    .video2-btn {
        font-size: 14px;
        padding: 10px 20px;
    }

    .video2-sound-btn {
        width: 42px;
        height: 42px;
    }
}


/* Обгортка під повноекранне відео */
.video2-wrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: #000;
}

/* Контейнер для плеєра */
.video2-bg {
    position: absolute;
    inset: 0;
}

/* iframe від YouTube */
.video2-bg iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 0;
}



/* ---------- Liquid Glass Mute Button (SVG icon) ---------- */

.video3-sound {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    width: 96px;
    height: 96px;
    padding: 0;
    border-radius: 50%;

    border: 1px solid rgba(255,255,255,0.40);
    background: rgba(255,255,255,0.18);

    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    -webkit-tap-highlight-color: transparent;

    box-shadow:
        0 12px 32px rgba(0,0,0,0.6),
        0 0 0 1px rgba(255,255,255,0.14) inset;

    transition:
        opacity .25s ease,
        transform .25s ease,
        box-shadow .2s ease;
}

/* повне зникнення після натискання */
.video3-sound.hide {
    opacity: 0 !important;
    transform: translate(-50%, -50%) scale(0.8);
    pointer-events: none !important;
    box-shadow: none !important;
}

/* велика SVG іконка */
.video3-icon {
    width: 70px !important;
    height: 70px !important;
    display: block;
}

/* hover ефект */
.video3-sound:hover {
    transform: translate(-50%, -50%) scale(1.06);
    box-shadow:
        0 16px 40px rgba(0,0,0,0.7),
        0 0 0 1px rgba(255,255,255,0.16) inset;
}

.video3-sound:active .video3-icon {
    transform: scale(0.94);
}


/* ---------- Liquid Glass pill “Подробнее” ---------- */

.video3-btn {
    position: absolute;
    left: 50%;
    bottom: 70px; /* ↑ піднято */
    transform: translateX(-50%);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 26px;
    border-radius: 999px;

    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text",
                 system-ui, sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;

    text-decoration: none;
    color: #f9fafb;

    background: rgba(15,23,42,0.58);
    border: 1px solid rgba(255,255,255,0.30);
    box-shadow: 0 10px 28px rgba(0,0,0,0.55);

    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);

    cursor: pointer;
    -webkit-tap-highlight-color: transparent;

    transition:
        transform .2s cubic-bezier(0.23, 0.98, 0.52, 0.99),
        box-shadow .2s ease-out,
        background-color .18s ease-out,
        border-color .18s ease-out;
}

.video3-btn:hover {
    transform: translateX(-50%) translateY(-1px) scale(1.03);
    background: rgba(24,32,55,0.72);
    border-color: rgba(191,219,254,0.95);
}

.video3-btn:active {
    transform: translateX(-50%) scale(0.97);
    box-shadow: 0 8px 22px rgba(0,0,0,0.65);
}


/* ---------- Mobile adjustments ---------- */
@media (max-width: 768px) {
    .video3-sound {
        width: 96px;
        height: 96px;
    }

    .video3-icon {
        width: 72px !important;
        height: 72px !important;
    }

    .video3-btn {
        bottom: 64px;
        padding: 9px 22px;
        font-size: 12px;
    }
}

/* ---- Chrome-only fix: підняти ПОДРОБНЕЕ ще вище ---- */
@supports (-webkit-appearance:none) and (not (-webkit-touch-callout:none)) {
    .video3-btn {
        bottom: 100px !important;
    }
}/* End custom CSS */