/* ==========================================================================
   NINO SEPO — GLOBAL HEADER
   ========================================================================== */


/* --------------------------------------------------------------------------
   Header shell
   -------------------------------------------------------------------------- */

.ninosepo-header{
    position:relative;

    z-index:999999;

    display:grid !important;

    grid-template-columns:
        minmax(0,1fr)
        auto
        minmax(0,1fr);

    align-items:center;

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

    margin:0 !important;

    padding:
        0
        30px !important;

    border:0 !important;

    border-bottom:
        1px
        solid
        rgba(17,17,17,.11) !important;

    background-color:
        #fff !important;

    box-shadow:none !important;

    transition:
        background-color 220ms ease,
        border-color 220ms ease;
}


.ninosepo-header.elementor-sticky--effects{
    background-color:
        #fff !important;

    border-bottom-color:
        rgba(17,17,17,.14) !important;

    box-shadow:none !important;
}


/*
 * Do not add transform, filter, backdrop-filter,
 * isolation or overflow:hidden to this header.
 *
 * Elementor's fixed Menu Cart is nested inside it.
 */


/* --------------------------------------------------------------------------
   Header regions
   -------------------------------------------------------------------------- */

.ninosepo-header__navigation,
.ninosepo-header__brand,
.ninosepo-header__actions{
    width:100% !important;
    min-width:0;

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


.ninosepo-header__navigation{
    justify-self:start;
}


.ninosepo-header__brand{
    justify-self:center;
}


.ninosepo-header__actions{
    justify-self:end;
}


/* Elementor boxed-container inner wrappers */

.ninosepo-header__navigation > .e-con-inner,
.ninosepo-header__brand > .e-con-inner,
.ninosepo-header__actions > .e-con-inner{
    width:100% !important;
    max-width:none !important;

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


.ninosepo-header__navigation > .e-con-inner{
    justify-content:flex-start !important;
}


.ninosepo-header__brand > .e-con-inner{
    justify-content:center !important;
}


.ninosepo-header__actions > .e-con-inner{
    justify-content:flex-end !important;
}


/* ==========================================================================
   DESKTOP NAVIGATION
   ========================================================================== */

.ninosepo-header__menu{
    width:auto !important;

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


.ninosepo-header__menu
.elementor-nav-menu--main{
    margin:0 !important;
    padding:0 !important;
}


.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-nav-menu{
    display:flex;

    align-items:center;

    gap:32px;

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


.ninosepo-header__menu
.elementor-nav-menu--main
.menu-item{
    margin:0 !important;
    padding:0 !important;
}


.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item{
    position:relative;

    display:flex;

    align-items:center;

    min-height:78px;

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

    color:#111 !important;

    font-family:inherit !important;
    font-size:12px !important;
    font-weight:500 !important;
    line-height:1 !important;

    letter-spacing:.07em;
    text-transform:uppercase;

    text-decoration:none !important;

    transition:
        opacity 180ms ease !important;
}


.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item:hover{
    opacity:.58;
}


/* --------------------------------------------------------------------------
   Navigation underline
   -------------------------------------------------------------------------- */

.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item::after{
    content:"" !important;

    position:absolute !important;

    right:0 !important;
    bottom:21px !important;
    left:0 !important;

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

    border:0 !important;

    background:#111 !important;

    opacity:0 !important;

    transform:
        scaleX(0) !important;

    transform-origin:
        left center !important;

    transition:
        transform 220ms ease,
        opacity 220ms ease !important;
}


.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item:hover::after,
.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item:focus-visible::after,
.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item.elementor-item-active::after,
.ninosepo-header__menu
.elementor-nav-menu--main
.current-menu-item
.elementor-item::after{
    opacity:1 !important;

    transform:
        scaleX(1) !important;
}


.ninosepo-header__menu
.elementor-nav-menu--main
.elementor-item:focus-visible{
    opacity:1;

    outline:
        1px
        solid
        rgba(17,17,17,.5);

    outline-offset:7px;
}


/* ==========================================================================
   CENTER LOGO
   ========================================================================== */

.ninosepo-header__logo{
    width:230px !important;
    max-width:230px !important;

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


.ninosepo-header__logo
.elementor-widget-container{
    width:100%;

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


.ninosepo-header__logo a{
    display:block;

    width:100%;
}


.ninosepo-header__logo img{
    display:block;

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

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

    border:0 !important;

    box-shadow:none !important;
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width:1024px){

    .ninosepo-header{
        min-height:68px;

        padding:
            0
            22px !important;
    }


    .ninosepo-header__logo{
        width:190px !important;
        max-width:190px !important;
    }


    /* Text-based menu trigger */

    .ninosepo-header__menu
    .elementor-menu-toggle{
        display:inline-flex !important;

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

        width:auto !important;
        height:44px;

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

        border:0 !important;
        border-radius:0 !important;

        background:
            transparent !important;

        color:#111 !important;

        font-family:inherit !important;
        font-size:11px !important;
        font-weight:500 !important;
        line-height:1 !important;

        letter-spacing:.07em;
        text-transform:uppercase;
    }


    .ninosepo-header__menu
    .elementor-menu-toggle::before{
        content:"MENU";
    }


    .ninosepo-header__menu
    .elementor-menu-toggle[aria-expanded="true"]::before{
        content:"CLOSE";
    }


    .ninosepo-header__menu
    .elementor-menu-toggle svg{
        display:none !important;
    }


    /* Full-width dropdown */

    .ninosepo-header__menu
    .elementor-nav-menu--dropdown{
        position:fixed !important;

        top:68px !important;
        right:0 !important;
        left:0 !important;

        width:100vw !important;

        margin:0 !important;

        padding:
            22px
            22px
            28px !important;

        border:0 !important;

        border-bottom:
            1px
            solid
            rgba(17,17,17,.11) !important;

        background-color:
            #fff !important;

        box-shadow:none !important;
    }


    body.admin-bar
    .ninosepo-header__menu
    .elementor-nav-menu--dropdown{
        top:100px !important;
    }


    .ninosepo-header__menu
    .elementor-nav-menu--dropdown
    .elementor-nav-menu{
        margin:0 !important;
        padding:0 !important;
    }


    .ninosepo-header__menu
    .elementor-nav-menu--dropdown
    .elementor-item{
        display:block;

        margin:0 !important;

        padding:
            14px
            0 !important;

        border:0 !important;

        background:
            transparent !important;

        color:#111 !important;

        font-family:inherit !important;
        font-size:13px !important;
        font-weight:400 !important;
        line-height:1.2 !important;

        letter-spacing:.07em;
        text-transform:uppercase;
    }

}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width:767px){

    .ninosepo-header{
        min-height:64px;

        padding:
            0
            16px !important;
    }


    .ninosepo-header__logo{
        width:150px !important;
        max-width:150px !important;
    }


    .ninosepo-header__menu
    .elementor-nav-menu--dropdown{
        top:64px !important;

        padding:
            20px
            16px
            26px !important;
    }


    body.admin-bar
    .ninosepo-header__menu
    .elementor-nav-menu--dropdown{
        top:110px !important;
    }

}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width:420px){

    .ninosepo-header{
        grid-template-columns:
            minmax(54px,1fr)
            auto
            minmax(54px,1fr);

        padding:
            0
            14px !important;
    }


    .ninosepo-header__logo{
        width:132px !important;
        max-width:132px !important;
    }

}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

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

    .ninosepo-header,
    .ninosepo-header__menu
    .elementor-nav-menu--main
    .elementor-item,
    .ninosepo-header__menu
    .elementor-nav-menu--main
    .elementor-item::after{
        transition:none !important;
    }

}