/* BAZAR Glass Header + Hero Autoplay — homepage only */

/* Put the homepage header over the hero image and give it a restrained glass treatment. */
.bzh .bh.b4-header-home {
    position: absolute !important;
    inset: 0 0 auto 0;
    z-index: 1002;
    width: 100%;
    background: linear-gradient(90deg, rgba(8, 27, 43, .58), rgba(8, 27, 43, .34));
    border-bottom: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 9px 30px rgba(5, 18, 30, .13);
    -webkit-backdrop-filter: blur(17px) saturate(145%);
    backdrop-filter: blur(17px) saturate(145%);
}

/* Header content stays transparent so the complete bar reads as one glass layer. */
.bzh .bh.b4-header-home > .container {
    background: transparent;
}

.bzh .bh.b4-header-home nav a {
    color: rgba(255, 255, 255, .94) !important;
    text-shadow: 0 1px 5px rgba(0, 0, 0, .16);
}

.bzh .bh.b4-header-home nav a:hover,
.bzh .bh.b4-header-home nav .current-menu-item > a {
    color: #efc2b1 !important;
}

/* Keep dropdown menus readable on their existing light surface. */
.bzh .bh.b4-header-home nav .sub-menu a {
    color: var(--bz-navy, #102b42) !important;
    text-shadow: none;
}

.bzh .bh.b4-header-home nav .sub-menu a:hover {
    color: var(--bz-copper, #a1543b) !important;
}

.bzh .bh.b4-header-home .b4-search summary,
.bzh .bh.b4-header-home .menu-toggle {
    color: #fff;
}

.bzh .bh.b4-header-home .menu-toggle {
    border-color: rgba(255, 255, 255, .40);
    background: rgba(255, 255, 255, .07);
}

.bzh .bh.b4-header-home .header-contact {
    color: #fff;
    box-shadow: 0 5px 18px rgba(0, 0, 0, .13);
}

/* The hero now begins behind the absolute header and fills the first viewport. */
.bzh .b9-hero.b11-cinematic {
    height: 100vh;
    height: 100svh !important;
    min-height: 680px;
    max-height: 1100px;
    margin-top: 0;
}

/* Keep the headline and controls clear of the overlaid navigation. */
.bzh .b9-hero.b11-cinematic .b9-slide-inner {
    padding-block-start: clamp(128px, 15vh, 176px);
}

@media (max-width: 760px) {
    .bzh .bh.b4-header-home .container {
        height: 72px;
    }

    .bzh .b9-hero.b11-cinematic {
        height: 100vh;
        height: 100svh !important;
        min-height: 660px;
        max-height: none;
    }

    .bzh .b9-hero.b11-cinematic .b9-slide-inner {
        padding-block: clamp(112px, 16vh, 145px) 122px;
    }
}

@media (max-width: 480px) {
    .bzh .b9-hero.b11-cinematic .b9-slide-inner {
        padding-block: clamp(112px, 16vh, 140px) 127px;
    }
}

/* On browsers without backdrop-filter, the translucent background remains legible. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .bzh .bh.b4-header-home {
        background: rgba(8, 27, 43, .78);
    }
}