/*
==================================================
LASP HEADER
header.css
==================================================
*/

.lasp-header{
    position:relative;
    width:100%;
    background:#ffffff;
    z-index:1000;
}

.lasp-header__container{
    max-width:1536px;
    margin:0 auto;
    padding:0 42px;
    height:86px;
    display:grid;
    grid-template-columns:220px 1fr 70px;
    align-items:center;
    column-gap:30px;
}






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

.lasp-header__logo{

    display:flex;

    align-items:center;

    justify-content:flex-start;

}

.lasp-header__logo a{

    display:flex;

    align-items:center;

    text-decoration:none;

}

.lasp-header__logo img{

    display:block;

    max-height:58px;

    width:auto;

}

.lasp-text-logo{

    font-size:64px;

    font-weight:300;

    letter-spacing:2px;

    color:#222;

}





/*
==========================
MENU
==========================
*/

.lasp-header__nav{

    display:flex;

    justify-content:center;

    align-items:center;

    height:100%;

}

.lasp-menu{

    margin:0;

    padding:0;

    list-style:none;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:44px;

}

.lasp-menu>li{

    position:relative;

    margin:0;

    padding:0;

}

.lasp-menu>li>a{
    position:relative;
    display:flex;
    align-items:center;
    height:45px;
    text-decoration:none;
    color:#111;
    font-size:14px;
    font-weight:500;
    letter-spacing:.3px;
    text-transform:uppercase;
    transition:.28s;
	text-align: center;
}

.lasp-menu>li>a:hover{
    color:#6b5c4b;
}



.lasp-menu>li>a:hover::after{
    width:100%;
}





/*
==========================
CURRENT
==========================
*/

.current-menu-item>a::after, .current_page_item>a::after{
    width:100%;
}

/*
==========================
SEARCH
==========================
*/

.lasp-header__search{
    display:flex;
    justify-content:flex-end;
    align-items:center;
}

.lasp-search-btn{
    width:36px;
    height:36px;
    border:none;
    background:transparent;
    cursor:pointer;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:0;
    color:#111;
}
.lasp-search-btn:hover{
	background:none;
}
.lasp-search-btn svg{
    display:block;
    width:22px;
    height:22px;
    transition:.25s ease;
}

.lasp-search-btn:hover svg{
    transform:scale(1.08);
    opacity:.7;
}

.lasp-header .lasp-menu-toggle{
    display:none;
    width:38px;
    height:38px;
    padding:8px 4px;
    border:1px solid transparent !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#111 !important;
    cursor:pointer;
    box-shadow:none !important;
    outline:0;
    appearance:none;
    -webkit-appearance:none;
    transition:opacity .2s ease, border-color .2s ease, transform .15s ease;
}

.lasp-header .lasp-menu-toggle:hover,
.lasp-header .lasp-menu-toggle:focus{
    border-color:#111 !important;
    background:transparent !important;
    color:#111 !important;
    box-shadow:none !important;
}

.lasp-header .lasp-menu-toggle:focus-visible{
    border-color:#111 !important;
    outline:1px solid #111;
    outline-offset:3px;
}

.lasp-header .lasp-menu-toggle:active{
    border-color:#979797 !important;
    background:#e8e3dd !important;
    color:#111 !important;
    box-shadow:none !important;
    transform:scale(.94);
}

.lasp-header .lasp-menu-toggle span{
    display:block;
    width:28px;
    height:1px;
    margin:6px auto;
    background:#111 !important;
    transition:transform .3s ease, opacity .3s ease;
}

.lasp-mobile-menu{
    position:fixed;
    inset:0;
    z-index:1100;
    visibility:hidden;
    pointer-events:none;
}

.lasp-mobile-menu.is-open{
    visibility:visible;
    pointer-events:auto;
}

.lasp-mobile-menu__backdrop{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    padding:0;
    border:0;
    background:rgba(17, 17, 17, .32);
    opacity:0;
    transition:opacity .35s ease;
}

.lasp-mobile-menu.is-open .lasp-mobile-menu__backdrop{
    opacity:1;
}

.lasp-mobile-menu__panel{
    position:absolute;
    top:0;
    right:0;
    width:min(88vw, 440px);
    height:100%;
    padding:0 30px 40px;
    overflow-y:auto;
    background:#f5f2ee;
    transform:translateX(100%);
    transition:transform .4s cubic-bezier(.22, 1, .36, 1);
}

.lasp-mobile-menu.is-open .lasp-mobile-menu__panel{
    transform:translateX(0);
}

.lasp-mobile-menu__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:76px;
    border-bottom:1px solid #dcd6cf;
}

.lasp-mobile-menu__title{
    color:#111;
    font-size:13px;
    font-weight:500;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.lasp-mobile-menu .lasp-mobile-menu__close{
    position:relative;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid transparent !important;
    border-radius:0 !important;
    background:transparent !important;
    color:#111 !important;
    cursor:pointer;
    box-shadow:none !important;
    outline:0;
    appearance:none;
    -webkit-appearance:none;
    transition:opacity .2s ease, border-color .2s ease, transform .15s ease;
}

.lasp-mobile-menu .lasp-mobile-menu__close:hover,
.lasp-mobile-menu .lasp-mobile-menu__close:focus{
    border-color:#111 !important;
    background:transparent !important;
    color:#111 !important;
    box-shadow:none !important;
}

.lasp-mobile-menu .lasp-mobile-menu__close:focus-visible{
    border-color:#111 !important;
    outline:1px solid #111;
    outline-offset:3px;
}

.lasp-mobile-menu .lasp-mobile-menu__close:active{
    border-color:#111 !important;
    background:#e8e3dd !important;
    color:#111 !important;
    box-shadow:none !important;
    transform:scale(.94);
}

.lasp-mobile-menu .lasp-mobile-menu__close span{
    position:absolute;
    top:18px;
    left:5px;
    width:28px;
    height:1px;
    background:#111 !important;
}

.lasp-mobile-menu__close span:first-child{
    transform:rotate(45deg);
}

.lasp-mobile-menu__close span:last-child{
    transform:rotate(-45deg);
}

.lasp-mobile-menu__nav{
    padding-top:20px;
}

.lasp-mobile-menu__list,
.lasp-mobile-menu__list .sub-menu{
    margin:0;
    padding:0;
    list-style:none;
}

.lasp-mobile-menu__list>li{
    border-bottom:1px solid #dcd6cf;
}

.lasp-mobile-menu__list>li>a{
    display:block;
    padding:18px 0;
    color:#111;
    font-size:18px;
    font-weight:400;
    line-height:1.3;
    letter-spacing:.04em;
    text-decoration:none;
    text-transform:uppercase;
}

.lasp-mobile-menu__list .sub-menu{
    padding:0 0 16px 18px;
}

.lasp-mobile-menu__list .sub-menu li+li{
    margin-top:2px;
}

.lasp-mobile-menu__list .sub-menu a{
    position:relative;
    display:block;
    padding:7px 0 7px 16px;
    color:#5f5a55;
    font-size:14px;
    font-weight:300;
    line-height:1.4;
    letter-spacing:.02em;
    text-decoration:none;
}

.lasp-mobile-menu__list .sub-menu a::before{
    content:"";
    position:absolute;
    top:16px;
    left:0;
    width:7px;
    height:1px;
    background:#8b837b;
}

.lasp-mobile-menu__list .current-menu-item>a,
.lasp-mobile-menu__list .current-menu-ancestor>a{
    font-weight:500;
}

body.lasp-menu-open{
    overflow:hidden;
}
/*
==========================
SUBMENU
==========================
*/

.lasp-menu .sub-menu{

    position:absolute;

    top:100%;

    left:0;

    min-width:320px;

    background:#fff;

    list-style:none;

    padding:0px 0;

    margin:0;

    opacity:0;

    visibility:hidden;

    transform:translateY(15px);

    transition:.3s;

    box-shadow:

        0 20px 50px rgba(0,0,0,.08);

    z-index:999;

}

.lasp-menu li:hover>.sub-menu{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.lasp-menu .sub-menu li{

    margin:0;

    padding:0;

}

.lasp-menu .sub-menu a{

    display:block;

    padding:10px 24px;

    color:#222;

    text-decoration:none;

    font-size:14px;

    transition:.25s;

}

.lasp-menu .sub-menu a:hover{

    background:#f7f7f7;

    padding-left:30px;

}





/*
==========================
STICKY
==========================
*/

.lasp-header.is-sticky{

    position:fixed;

    top:0;

    left:0;

    right:0;

    animation:headerShow .35s ease;

}

@keyframes headerShow{

    from{

        transform:translateY(-100%);

    }

    to{

        transform:translateY(0);

    }

}





/*
==========================
RESPONSIVE
==========================
*/

@media(max-width:1300px){

    .lasp-header__container{

        grid-template-columns:180px 1fr 60px;

        padding:0 30px;

    }

    .lasp-menu{

        gap:28px;

    }
	.lasp-menu>li>a{
        font-size:12px;
        white-space:nowrap;
    }

}

@media(max-width:1100px){

    .lasp-menu{

        gap:18px;

    }

    .lasp-menu>li>a{

        font-size:13px;

    }
	.lasp-text-logo{
		font-size: 50px;
	}

}

@media(max-width:992px){

    .lasp-header__container{

        grid-template-columns:1fr auto;

        height:76px;

    }

    .lasp-header__nav{

        display:none;

    }

    .lasp-header__search{
        gap:14px;
    }

    .lasp-header .lasp-menu-toggle{
        display:block;
    }

}

@media(max-width:520px){

    .lasp-header__container{
        height:70px;
        padding:0 18px;
    }

    .lasp-header__logo img{
        max-height:48px;
    }

    .lasp-text-logo{
        font-size:42px;
    }

    .lasp-header__search{
        gap:8px;
    }

    .lasp-mobile-menu__panel{
        width:100%;
        padding:0 22px 32px;
    }

    .lasp-mobile-menu__top{
        min-height:70px;
    }

    .lasp-mobile-menu__list>li>a{
        padding:16px 0;
        font-size:17px;
    }

}