@layer components{[name=Header]{align-items:center;display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--header-size);margin-inline:auto;padding-block:1rem;padding-inline:var(--space-gutter);width:100%}@media screen and (min-width:1024px){[name=Header]{padding-block:1.5rem;padding-inline:unset}}[name=Header] .logo-wrapper{grid-column:1 / 5;grid-row:1}@media screen and not (min-width:1024px){[name=Header] .logo-wrapper{text-align:left}}@media screen and (min-width:1024px){[name=Header] .logo-wrapper{grid-column:span 2}}[name=Header] .logo{display:inline-block;width:7rem}@media screen and (min-width:1024px){[name=Header] .logo{width:8.3125rem}}[data-header-position=scrolled] [name=Header] .navbar>.menubar>li>a:not([class*=button]):hover{color:var(--color-grey)}[name=Header] [name=MainNavigation]{grid-column:1 / 5;grid-row:1;justify-self:end}@media screen and (min-width:1024px){[name=Header] [name=MainNavigation]{grid-column:span 2}}@media screen and (min-width:1024px){[name=Header]{grid-template-columns:repeat(12,1fr);gap:var(--space-gutter)}[name=Header] .logo-wrapper{grid-column:span 2}[name=Header] [name=MainNavigation]{grid-column:3 / -1}[name=Header] [name=AppMenu]{grid-column:span 4;width:100%}}}
