/* The navigation stays on its paper strip while the page moves underneath. */
:root{--navigation-height:92px}
html{scroll-padding-top:calc(var(--navigation-height) + 24px)}
.site-header{position:sticky;top:0;z-index:40;height:var(--navigation-height);background:var(--paper);isolation:isolate;overflow:visible}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--paper);box-shadow:0 0 0 100vmax var(--paper);clip-path:inset(0 -100vmax)}
.site-header nav>.nav-login{display:flex;align-items:center;justify-content:center;min-height:40px;padding:9px 16px;border:1px solid var(--line-strong);border-radius:3px;line-height:1.5;transition:color .2s,background-color .2s,border-color .2s}
.site-header nav>.nav-login::after{display:none}
.site-header nav>.nav-login:hover,.site-header nav>.nav-login[aria-current]{color:var(--red);border-color:var(--red);background:var(--red-soft)}
@media(max-width:900px){
 :root{--navigation-height:80px}
 .site-header nav{top:calc(100% - 1px);max-height:calc(100vh - var(--navigation-height) - 16px);max-height:calc(100dvh - var(--navigation-height) - 16px);overflow-y:auto;overscroll-behavior:contain}
 .site-header nav>.nav-login{align-self:flex-start;min-height:44px;margin-top:8px}
}
@media(max-width:640px){:root{--navigation-height:76px}}
@media print{html{scroll-padding-top:0}.site-header{position:relative;top:auto}.site-header::before{display:none}}
