/* =========================================================
   SWISS AQUA CUSTOM STYLE.CSS - CLEANED
   Header: 64px
   Mobile menu: opens downward
   Mobile menu icon: exactly 3 lines
   Water-drop header background retained
   ========================================================= */


/* =========================================================
   MOBILE HEADER + MENU
   ========================================================= */

@media (max-width: 991px) {

    .sam-topbar {
        display: none !important;
    }

    #site-header.sam-header {
        position: relative !important;
        z-index: 999999 !important;
        width: 100% !important;
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #ffffff !important;
    }

    #site-header .sam-header__inner {
        position: relative !important;
        z-index: 10 !important;
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background: transparent !important;
    }

    #site-header .sam-header__actions {
        display: none !important;
    }

    /* Mobile hamburger button - exactly 3 original spans */
    #site-header .sam-menu-toggle {
        position: relative !important;
        z-index: 1000001 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        margin-left: auto !important;
        flex-shrink: 0 !important;
    }

    #site-header .sam-menu-toggle::before,
    #site-header .sam-menu-toggle::after {
        display: none !important;
        content: none !important;
    }

    #site-header .sam-menu-toggle span:not(.screen-reader-text) {
        display: block !important;
        width: 30px !important;
        height: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 2px !important;
        background: #10253f !important;
        opacity: 1 !important;
        transform: none !important;
    }

    /* Closed menu */
    #site-header .sam-nav {
        display: none !important;
    }

    /* Open menu - starts directly below the 64px header */
    #site-header .sam-nav.is-open {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        z-index: 9999999 !important;

        display: block !important;
        visibility: visible !important;

        width: 100% !important;
        height: calc(100vh - 64px) !important;
        max-height: calc(100vh - 64px) !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;

        background: #ffffff !important;
        opacity: 1 !important;
        transform: none !important;

        -webkit-overflow-scrolling: touch !important;
    }

    #site-header .sam-nav.is-open .sam-menu {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 8px 20px 40px !important;

        overflow: visible !important;
        background: #ffffff !important;
        list-style: none !important;
    }

    #site-header .sam-nav.is-open .sam-menu > li {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    #site-header .sam-nav.is-open .sam-menu > li > a {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 50px !important;

        padding: 12px 5px !important;

        color: #10253f !important;
        background: #ffffff !important;

        font-size: 17px !important;
        font-weight: 700 !important;

        border-bottom: 1px solid #e1e1e1 !important;

        opacity: 1 !important;
        visibility: visible !important;
    }

    /* Parent dropdown arrow */
    #site-header .sam-nav.is-open
    .sam-menu > .menu-item-has-children > a::after {
        content: "▼" !important;
        margin-left: auto !important;
        color: #0868bd !important;
        font-size: 10px !important;
    }

    /* Child menus hidden until opened */
    #site-header .sam-nav.is-open .sub-menu {
        position: static !important;
        display: none !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 5px 0 10px 15px !important;

        background: #f5f9fc !important;
        box-shadow: none !important;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    #site-header .sam-nav.is-open
    .menu-item-has-children.submenu-open > .sub-menu {
        display: block !important;
    }

    #site-header .sam-nav.is-open .sub-menu li {
        display: block !important;
        width: 100% !important;
    }

    #site-header .sam-nav.is-open .sub-menu li a {
        display: block !important;
        width: 100% !important;

        padding: 11px 10px !important;

        color: #29445f !important;

        font-size: 15px !important;
        font-weight: 600 !important;

        border-bottom: 1px solid #e5e5e5 !important;
    }

    #site-header .sam-nav__mobile-contact {
        display: block !important;
        padding: 10px 22px 35px !important;
    }

    body.sam-menu-open {
        overflow: hidden !important;
    }
}


/* =========================================================
   HEADER - WATER DROP BACKGROUND
   ========================================================= */

#site-header.sam-header {
    position: relative !important;
    isolation: isolate !important;

    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: #ffffff !important;
    background-image: none !important;
}

#site-header.sam-header::before,
#site-header.sam-header::after {
    display: none !important;
    content: none !important;
    background: none !important;
    background-image: none !important;
}

#site-header .sam-header__inner {
    position: relative !important;
    z-index: 10 !important;

    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;

    display: flex !important;
    align-items: center !important;

    background: transparent !important;
}

#site-header .sam-water-drop-layer {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    overflow: hidden !important;
    pointer-events: none !important;
}

#site-header .sam-water-drop-layer .sam-drop {
    position: absolute !important;
    top: 50% !important;

    display: block !important;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: contain !important;

    opacity: 0;
    pointer-events: none !important;

    animation: sam-water-drop-fade 10s ease-in-out infinite !important;
    will-change: opacity, transform;
}

/* Desktop drop sizes */
#site-header .sam-drop-1 {
    width: 293px !important;
    height: 293px !important;
    left: 2% !important;
    animation-delay: 0s !important;
}

#site-header .sam-drop-2 {
    width: 195px !important;
    height: 195px !important;
    left: 14% !important;
    animation-delay: .5s !important;
}

#site-header .sam-drop-3 {
    width: 264px !important;
    height: 264px !important;
    left: 26% !important;
    animation-delay: 1s !important;
}

#site-header .sam-drop-4 {
    width: 176px !important;
    height: 176px !important;
    left: 38% !important;
    animation-delay: 1.5s !important;
}

#site-header .sam-drop-5 {
    width: 284px !important;
    height: 284px !important;
    left: 50% !important;
    animation-delay: 2s !important;
}

#site-header .sam-drop-6 {
    width: 206px !important;
    height: 206px !important;
    left: 63% !important;
    animation-delay: 2.5s !important;
}

#site-header .sam-drop-7 {
    width: 254px !important;
    height: 254px !important;
    left: 75% !important;
    animation-delay: 3s !important;
}

#site-header .sam-drop-8 {
    width: 186px !important;
    height: 186px !important;
    left: 87% !important;
    animation-delay: 3.5s !important;
}

@keyframes sam-water-drop-fade {
    0% {
        opacity: 0;
        transform: translateY(-46%) scale(.85);
    }

    20% {
        opacity: .10;
        transform: translateY(-48%) scale(.92);
    }

    40% {
        opacity: .25;
        transform: translateY(-50%) scale(1);
    }

    55% {
        opacity: .32;
        transform: translateY(-51%) scale(1.04);
    }

    70% {
        opacity: .25;
        transform: translateY(-52%) scale(1.02);
    }

    85% {
        opacity: .10;
        transform: translateY(-54%) scale(.96);
    }

    100% {
        opacity: 0;
        transform: translateY(-55%) scale(.90);
    }
}

/* Keep header content above droplets */
#site-header .sam-brand,
#site-header .sam-nav,
#site-header .sam-menu-toggle,
#site-header .sam-header__actions,
#site-header .sam-menu {
    position: relative !important;
    z-index: 20 !important;
}

#site-header .sam-menu .sub-menu {
    z-index: 9999 !important;
}

#site-header .sam-brand,
#site-header .custom-logo-link {
    background: transparent !important;
}


/* =========================================================
   COMPACT HEADER CONTENT
   ========================================================= */

#site-header .sam-brand img,
#site-header .sam-brand .custom-logo {
    width: auto !important;
    max-height: 42px !important;
}

#site-header .sam-menu > li > a {
    min-height: 40px !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

#site-header .sam-header__actions .sam-btn {
    min-height: 38px !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}


/* =========================================================
   DESKTOP - HEADER STAYS 64PX
   ========================================================= */

@media (min-width: 992px) {

    #site-header.sam-header {
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;

        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;

        border-bottom: 0 !important;
    }

    #site-header .sam-header__inner {
        height: 64px !important;
        min-height: 64px !important;
        max-height: 64px !important;
    }

    #site-header .sam-brand,
    #site-header .sam-nav,
    #site-header .sam-header__actions {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
}


/* =========================================================
   TABLET / MOBILE WATER DROPS
   ========================================================= */

@media (max-width: 991px) {

    /* Mobile menu must be allowed to extend below header */
    #site-header.sam-header {
        overflow: visible !important;
    }

    #site-header .sam-water-drop-layer {
        overflow: hidden !important;
    }

    #site-header .sam-water-drop-layer .sam-drop {
        animation-duration: 9s !important;
    }
}

@media (max-width: 768px) {

    #site-header .sam-drop-1 {
        width: 176px !important;
        height: 176px !important;
        left: -10% !important;
    }

    #site-header .sam-drop-2 {
        width: 128px !important;
        height: 128px !important;
        left: 9% !important;
    }

    #site-header .sam-drop-3 {
        width: 167px !important;
        height: 167px !important;
        left: 24% !important;
    }

    #site-header .sam-drop-4 {
        width: 117px !important;
        height: 117px !important;
        left: 39% !important;
    }

    #site-header .sam-drop-5 {
        width: 176px !important;
        height: 176px !important;
        left: 53% !important;
    }

    #site-header .sam-drop-6 {
        width: 128px !important;
        height: 128px !important;
        left: 68% !important;
    }

    #site-header .sam-drop-7 {
        width: 167px !important;
        height: 167px !important;
        left: 82% !important;
    }

    #site-header .sam-drop-8 {
        display: none !important;
    }
}

@media (max-width: 420px) {

    #site-header .sam-drop-2,
    #site-header .sam-drop-4,
    #site-header .sam-drop-6 {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {

    #site-header .sam-water-drop-layer .sam-drop {
        animation: none !important;
        opacity: .12 !important;
        transform: translateY(-50%) !important;
    }
}