html *{box-sizing:border-box}header{width:100vw;transition:0.4s ease all}.scroll-up .header{transform:translateY(0);transition:0.3s ease all}.scroll-up .main-nav{padding-top:.5em;padding-bottom:.5em}@media (max-width:768px){.scroll-down header .header{transform:translateY(-100%)}}#main-nav,#main-nav ul{padding:0;list-style:none;margin:0}#main-nav>li.menu-item{cursor:pointer;font-size:var(--text-s);font-family:'Arvo'}#main-nav>li.menu-item a{color:var(--light)}#mobile-nav>li.menu-item:not(.main) a{color:var(--light)}#mobile-nav>li.menu-item a{font-size:var(--text-l)}#action-nav>li.menu-item,#action-nav>li.menu-item a{color:var(--brand-1)}#action-nav>li.menu-item i{color:var(--light)}#action-nav>li.menu-item.btn i{color:var(--brand-1)}#action-nav>li.menu-item.main i{color:var(--dark)}#action-nav>li.menu-item.main,#action-nav>li.menu-item.main a{color:var(--dark)}header li.menu-item a{cursor:pointer;font-size:var(--text-s);font-family:'Arvo'}.hamburger{padding:1rem;z-index:9999}.hamburger>*{pointer-events:none}.hamburger-icon{display:flex;position:relative;vertical-align:middle;align-items:center;width:1.5rem;height:1.5rem;cursor:pointer}.hamburger-icon .line{display:block;position:absolute;width:100%;height:2px;background:var(--light);transform-origin:center}.hamburger-icon .line:first-of-type{--delay:.1s;margin-top:-16px;transition:0.2s 0.2s ease margin-top,0.2s ease transform}.hamburger-icon .line:nth-child(2){--delay:.2s;transition:0.1s ease transform}.hamburger-icon .line:last-of-type{--delay:.3s;margin-bottom:-16px;transition:0.2s 0.2s ease margin-bottom,0.2s ease transform}.offcanvas-open .hamburger-icon .line:first-of-type{transform:rotate(45deg);margin-top:0;transition:0.2s ease margin-top,0.4s 0.2s ease transform}.offcanvas-open .hamburger-icon .line:nth-child(2){transition-delay:0.2s;transform:scaleX(0)}.offcanvas-open .hamburger-icon .line:last-of-type{transform:rotate(-45deg);margin-bottom:0;transition:0.2s ease margin-bottom,0.4s 0.2s ease transform}#cta{transition:0.3s ease all}.scroll-down #cta{transform:translateY(100%)}.scroll-up #cta{transform:translateY(0)}.logo{width:100px;transition:0.4s ease all}body:is(.scroll-down,.scroll-up) .logo{width:100px}@media (min-width:1366px){.logo{width:180px}body.scrolled-top .logo{width:180px}}// @media (max-width:1365px){// body.scrolled-top .logo{// width:100px;//}//}@media (max-width:768px){header{padding:0!important}body #main-header{border-radius:0}}