/****************************
 * Common
****************************/
.vii-menu-row {
    min-height:var(--vii-header-height);
    background-color:var(--vii-color-primary);
    padding:0 var(--vii-gap-container);
}


/****************************
 * Logo
****************************/
.vii-menu-logo {
    height:var(--vii-logo-height);
    img {
        width:auto;
    }
}
.vii-menu-col.right {
    gap:20px;
}


/****************************
 * Hamburger button
****************************/
.vii-hamburger-button {background:none;}
.vii-hamburger-button__inner {width:20px; height:16px;}

/* Lines */
.vii-hamburger-button__inner i {height:2px;}
.vii-hamburger-button__inner i:nth-child(2) {top:7px;}
.vii-hamburger-button__inner i:nth-child(3) {width:15px;}

/* Open */
html.menu-open .vii-hamburger-button__inner i:nth-child(1) {transform:rotate(45deg); top:9px;}
html.menu-open .vii-hamburger-button__inner i:nth-child(3) {transform:rotate(-45deg); bottom:5px; width:100%;}
html.menu-open .vii-hamburger-button__inner i:nth-child(2) {width:0; left:50%;}

/****************************
 * Menu Sticky
****************************/
body.menu-sticky {padding-top:var(--vii-header-height);}

/* wrapper */
.vii-menu-row.main .vii-menu-row-inner {min-height:var(--vii-header-height);}

/* Scroll middle down: hide menu */
html:not(.accordion-moving) body.menu-sticky.scroll-middle.scroll-down:not(.scroll-bottom) [data-menu*="sticky"] {
    opacity:0; transform:translateY(-100%);
}
/* Scroll middle up: show menu */
body.scroll-middle .vii-menu {
    transform:translateY(calc(var(--vii-header-height) * -1));
}
html.menu-open .menu-open,
body.scroll-bottom .vii-menu,
body.scroll-up .vii-menu {
    transform:translateY(0);
}