.nav-home{display:grid;grid-template-columns:1fr 250px 1fr;align-items:center;height:96px;padding:0 5vw}
.nav-home .nav-right{justify-content:flex-end}
#dock{height:88px}
@media(max-width:800px){}
.intro{position:relative;height:100vh;min-height:640px}
#lockup{position:fixed;left:50%;top:50%;width:900px;height:340px;margin:-170px 0 0 -450px;z-index:60;pointer-events:none;transform-origin:50% 50%}
#lockup>*{position:absolute;left:50%;top:50%}
#vio{width:300px;height:510px;margin:-255px 0 0 -150px}
#vio>*{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible}
#body{filter:drop-shadow(0 18px 30px rgba(60,20,10,.35))}
#name{width:900px;height:340px;margin:-170px 0 0 -450px;text-align:center;color:var(--ink)}
#name .k,#name .l{position:absolute;left:0;right:0;font-family:var(--font-head);font-size:135px;line-height:1;letter-spacing:.16em;padding-left:.16em;font-weight:400}
#name .k{top:6px}#name .l{bottom:6px}
#name .s{position:absolute;left:0;right:0;top:50%;margin-top:-52px;font-family:var(--font-script);font-size:96px;line-height:1.1;color:var(--ocean);transform:rotate(-5deg);text-shadow:0 0 10px var(--bg),0 0 4px var(--bg),0 0 2px var(--bg)}
.intro-copy{position:absolute;left:0;right:0;bottom:7vh;text-align:center;padding:0 5vw}
.intro-copy h1{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:12px}
.intro-copy h1 em{color:var(--ocean)}
.intro-copy p{max-width:560px;margin:0 auto 22px}
.intro-copy .btn{margin:6px}
.scrollhint{display:block;margin-top:18px;font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.js .intro-copy{opacity:0}
.js #name,.js #vio{opacity:0}
/* Schatten/Prägung nur bei KOSTA LOUKAS */
#name .k,#name .l{color:#4a160c;text-shadow:0 -1px 0 rgba(0,0,0,.55),1px 2px 0 rgba(255,255,255,.95),3px 5px 7px rgba(110,40,20,.38)}

#vio>.fp{position:absolute;left:50%;top:50%;max-width:none;overflow:visible}