/* User-directed division grouping. Original logo, type scale, padding and hero remain. */
nav.knov-nav .sp{width:auto;flex:1;min-width:24px}
nav.knov-nav .nav-studio{display:flex;align-items:center;gap:clamp(24px,3.5vw,72px);flex:none}
nav.knov-nav .nav-studio>a,nav.knov-nav .nav-studio>.navdrop{width:auto;white-space:nowrap}
nav.knov-nav a.nav-commercial{width:auto;flex:none;white-space:nowrap;margin-left:clamp(36px,5.5vw,112px);padding-left:clamp(24px,3vw,64px);border-left:1px solid #c9c9c9;color:#111}
nav.knov-nav .langsw{position:relative;right:auto;top:auto;transform:none;margin-left:clamp(20px,2.5vw,48px);flex:none}
@media(max-width:860px){
 nav.knov-nav .logo{flex:none}
 nav.knov-nav .nav-studio{gap:clamp(6px,2vw,16px)}
 nav.knov-nav a.nav-commercial{margin-left:8px;padding-left:12px}
 nav.knov-nav .langsw{margin-left:0}
}
@media(max-width:380px){
 nav.knov-nav{padding-left:12px;padding-right:12px;gap:4px;font-size:11.5px}
 nav.knov-nav .nav-studio{gap:6px}
 nav.knov-nav a.nav-commercial{margin-left:2px;padding-left:8px}
 nav.knov-nav .language{font-size:10px}
 nav.knov-nav .language svg{width:13px;height:13px;margin-right:2px;vertical-align:-2px}
}

nav.knov-nav a.nav-commercial{background:#111;color:#fff;border-left:0;border-radius:3px;padding:4px 14px;line-height:1.5;text-decoration:none}
nav.knov-nav a.nav-commercial:hover{background:#303030;color:#fff;text-decoration:none}
nav.knov-nav a.nav-commercial:focus-visible{outline:2px solid #111;outline-offset:4px}
@media(max-width:860px){nav.knov-nav a.nav-commercial{padding:3px 7px;margin-left:8px}}
@media(max-width:380px){nav.knov-nav a.nav-commercial{padding-inline:5px;margin-left:2px}}
nav.knov-nav a.nav-commercial{position:relative}
nav.knov-nav a.nav-commercial::before{content:"";position:absolute;left:calc(clamp(36px,5.5vw,112px)/-2);top:50%;transform:translateY(-50%);height:1.7em;width:1px;background:#c9c9c9;pointer-events:none}
@media(max-width:860px){nav.knov-nav a.nav-commercial::before{left:-8px;height:1.5em}}
@media(max-width:380px){nav.knov-nav a.nav-commercial::before{left:-6px}}
nav.knov-nav .logo{flex-shrink:0}
nav.knov-nav .nav-studio .navdrop{position:relative}
nav.knov-nav .langsw{width:auto}
nav.knov-nav .nav-commercial{box-shadow:0 0 0 1px rgba(255,255,255,.22)}
@media(max-width:860px){nav.knov-nav .nav-studio{width:auto}nav.knov-nav .nav-studio>.navdrop{width:auto!important}nav.knov-nav .langsw{width:auto!important}nav.knov-nav .nav-commercial{width:auto!important}}

/* The inactive division tab contrasts with the studio's dark navigation. */
nav.knov-nav a.nav-commercial:not(.on){background:#fff;color:#111;box-shadow:none}
nav.knov-nav a.nav-commercial:not(.on):hover{background:#eee;color:#111}
nav.knov-nav a.nav-commercial:not(.on):focus-visible{outline-color:#fff}