/* Quiet first-screen access, independent of the opening's logo geometry. */
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0}
.sahne-layers .intro-nav{position:fixed;z-index:24;top:max(26px,env(safe-area-inset-top,0px));left:7vw;right:7vw;display:flex;justify-content:space-between;align-items:center;gap:20px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s,visibility .3s}
.sahne-layers.landing-intro:not(.menu-open) .intro-nav{opacity:1;visibility:visible;pointer-events:auto}
.intro-nav a,.intro-nav button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 0;border:0;background:none;font:inherit;font-size:13px;line-height:1.4;color:var(--ink)}
.intro-nav a:hover,.intro-nav button:hover{color:var(--amber)}
.intro-nav .ui-icon{width:16px;height:16px}
.sahne-layers .side-contact{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
.sahne-layers .rail-controls .ui-icon{width:20px;height:20px}
/* Fit the complete navigation and email in normal desktop and phone heights. */
.sahne-layers .menu{padding:clamp(20px,5svh,48px) clamp(28px,5vw,70px);gap:clamp(6px,1.8svh,18px)}
.sahne-layers .menu>a{display:flex;align-items:center;min-height:44px;font-size:clamp(28px,3.2vw,44px);line-height:1.3}
.sahne-layers .menu .menu-email{font-size:14px;line-height:1.5;margin-top:clamp(12px,3svh,26px);min-height:44px}
@media(max-width:700px){
 .sahne-layers .intro-nav{top:max(15px,env(safe-area-inset-top,0px));left:6vw;right:6vw;gap:16px}
 .intro-nav a,.intro-nav button{font-size:13px;gap:8px}
 .sahne-layers .menu{padding:20px 8vw max(20px,env(safe-area-inset-bottom,0px));gap:clamp(6px,1.5svh,14px)}
 .sahne-layers .menu>a{font-size:clamp(26px,7vw,36px)}
 .sahne-layers .menu .menu-email{font-size:14px;margin-top:12px}
}
@media(max-height:500px) and (min-width:701px){
 .sahne-layers .menu{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:12px 24px;width:min(740px,calc(100% - var(--rail)));padding:24px 36px}
 .sahne-layers .menu>a{font-size:26px;margin:0}
 .sahne-layers .menu .menu-email{grid-column:1/-1;margin-top:8px}
}
@media(prefers-reduced-motion:reduce){.sahne-layers .intro-nav{transition:none}}
/* Make newly revealed controls focusable immediately while opacity still fades. */
.sahne-layers.menu-open .menu{transition:opacity .45s,transform .6s cubic-bezier(.2,.7,.2,1),visibility 0s}
.sahne-layers.landing-intro:not(.menu-open) .intro-nav{transition:opacity .3s,visibility 0s}
@media(prefers-reduced-motion:reduce){.sahne-layers.menu-open .menu,.sahne-layers.landing-intro:not(.menu-open) .intro-nav{transition:none}}

/* Keep a phone menu on the visible viewport, with the page stationary beneath it. */
@media(max-width:700px){
 html:has(> body.sahne-layers.menu-open),body.sahne-layers.menu-open{overflow:hidden;overscroll-behavior:none}
 .sahne-layers .menu{max-height:calc(100dvh - 66px - env(safe-area-inset-top,0px));touch-action:pan-y pinch-zoom}
 .sahne-layers .contact-bottom>a,.sahne-layers .contact footer>a{display:inline-flex;align-items:center;min-height:44px}
 .case-header nav a,.case-footer a{display:inline-flex;align-items:center;min-height:44px}
}