.header{background-color:var(--background-cut);isolation:isolate;box-shadow:var(--box-shadow-main);z-index:1;width:100vw;padding:1em 4em}.header .inner{max-width:var(--desktop-max-width);grid-template-columns:3fr 1fr;margin:0 auto;font-size:1.5em;display:grid}.header .inner .logo{white-space:nowrap;font-size:1.5em}.header .inner .logo span{font-size:.7em}.header .inner .logo img{margin-right:2px}.header header.floating{visibility:hidden;background:var(--background-cut);color:var(--text);isolation:isolate;width:100%;box-shadow:var(--box-shadow-main);background:linear-gradient(90deg,var(--background-cut)0%,rgb(from var(--background-cut)r g b/.8)25%,var(--background-cut)100%);will-change:transform;padding:.25em 4em;transition:transform .2s ease-out;position:fixed;top:0;left:0;transform:translateY(-100%)}.header header.floating.visible{visibility:visible;transform:translateY(0)}.header header.floating .inner{text-align:left;grid-template-columns:3fr 1fr;margin:0 auto;font-size:1em;display:grid}.header header.floating .inner .logo-wrapper{margin:auto 0}.header header.floating .inner .logo-wrapper .logo{font-size:1em}@media (max-width:768px) and (orientation:portrait){.header{padding:1em 0}.header .inner{text-align:center;display:block}.header header.floating{padding:.25em .5em}.header .logo-wrapper{margin-bottom:.5em}}
.nav-bar{flex-direction:row;margin:auto 0;display:inline-flex}.nav-bar .nav{text-align:center;vertical-align:middle;border-radius:1px;min-width:5em}.nav-bar .nav:hover{font-weight:700}.nav-bar .nav svg{vertical-align:middle;height:16px;margin-right:4px}@media (max-width:768px) and (orientation:portrait){.nav-bar{flex-direction:row;font-size:.9em;display:inline-flex}.nav-bar .nav{min-width:4em}.nav-bar .nav svg{height:.9em}}
svg{height:1em;fill:var(--text)}