/****************************
 * Common
****************************/
.px-menu-row {padding:0 var(--px-gap-side);}
.px-menu-row.main {min-height:var(--px-header-height); box-shadow:0 1px 5px rgba(0, 0, 0, .1);}


/****************************
 * Logo
****************************/
.px-menu-logo {aspect-ratio:198/32; height:var(--px-logo-height);}
.px-menu-logo img {height:100%; width:auto;}


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

/* Lines */
.px-hamburger-button__inner i {width:100%; height:2px; background:#000;}
.px-hamburger-button__inner i:nth-child(1) {top:0;}
.px-hamburger-button__inner i:nth-child(2) {top:7px;}
.px-hamburger-button__inner i:nth-child(3) {bottom:0; width:15px; left:auto; right:0;}

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

/****************************
 * Menu Sticky
****************************/
body.menu-sticky {padding-top:var(--px-header-height);}
[data-menu*="sticky"] {position:fixed; top:0; left:0; right:0;}

/* wrapper */
.px-menu-row.main .px-menu-row-inner {min-height:var(--px-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: change header background */
/*body.menu-sticky.scroll-up:not(.scroll-top) [data-menu*="sticky"] {background:var(--px-color-primary);}*/