/* V16b — calm content views below one persistent area header. */

@view-transition{navigation:auto}

.langbar{view-transition-name:bartosek-utility}
nav.top{view-transition-name:bartosek-header}

::view-transition-old(root){
  animation:v16b-view-out .14s cubic-bezier(.4,0,1,1) both;
}
::view-transition-new(root){
  animation:v16b-view-in .32s cubic-bezier(.18,.72,.24,1) both;
}
::view-transition-old(bartosek-header),
::view-transition-new(bartosek-header),
::view-transition-old(bartosek-utility),
::view-transition-new(bartosek-utility){animation:none}

@keyframes v16b-view-out{
  to{opacity:0;transform:translateY(-5px)}
}
@keyframes v16b-view-in{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* The selected area is its overview. Other topic links open a focused view
   at the top instead of sending the visitor over several screen heights. */
body[data-world][data-content-view="services"] :is(.hero,.whyb,.manifest,.model,.cases,.home-contact,.company-home),
body[data-world][data-content-view="model"] :is(.hero,.world-home-shell,.whyb,.manifest,.cases,.home-contact,.company-home),
body[data-world][data-content-view="company"] :is(.hero,.world-home-shell,.whyb,.manifest,.model,.cases,.home-contact){
  display:none!important;
}

body[data-world][data-content-view="services"] .world-home-shell,
body[data-world][data-content-view="model"] .model,
body[data-world][data-content-view="company"] .company-home{
  display:block!important;
}

body[data-world][data-content-view="services"] .world-home-shell,
body[data-world][data-content-view="model"] .model,
body[data-world][data-content-view="company"] .company-home{
  min-height:calc(100vh - 128px);
}

body[data-world][data-content-view="model"] .model{
  padding-top:clamp(72px,7vw,118px);
}

/* Context and content navigation are intentionally different: the selected
   context is filled, the selected content topic has a quiet underline. */
.nav-compact-links>a[data-nav-topic="services"],
.nav-compact-links>a[data-nav-topic="model"],
.nav-compact-links>a[data-nav-topic="projects"]{
  --v16b-topic-accent:var(--compact-accent,var(--ink));
}
.nav-compact-links>a[data-nav-topic="company"],
.nav-compact-links>a[href^="Investoren"]{
  --v16b-topic-accent:var(--ink);
}
.nav-compact-links>a[aria-current="location"]{
  color:var(--v16b-topic-accent,var(--ink))!important;
}
.nav-compact-links>a[aria-current="location"]::after{
  background:var(--v16b-topic-accent,var(--ink))!important;
}

@media (min-width:1381px){
  /* Match the full-size content-page header used by Investors & Partners.
     The selected-area header must not shrink its logo lockup or navigation. */
  .nav-compact-inner{grid-template-columns:minmax(214px,226px) minmax(0,1fr)!important}
  .nav-compact-brand .brand-logo{height:22px!important}
  .nav-compact-brand .brand-sub{display:inline-block!important;font-size:9px!important}
  .nav-compact-links{gap:clamp(8px,.85vw,16px)!important}
  .nav-compact-links>a:not(.compact-contact){font-size:clamp(12px,.95vw,15px)!important}
  .nav-compact-links .v15-context-option{font-size:clamp(11px,.78vw,13px)!important}
  .nav-compact-links .compact-contact{padding:12px 18px!important}
  .nav-compact-links>.v15-context-switch{margin-right:clamp(1px,.3vw,5px)!important}
}

@media (min-width:1381px) and (max-width:1520px){
  .nav-compact-inner{grid-template-columns:226px minmax(0,1fr)!important}
  .nav-compact-links .v15-context-name{max-width:92px;white-space:normal;line-height:1.05}
  .nav-compact-links .v15-context-option{gap:5px;padding-inline:7px!important}
  .nav-compact-links>a:not(.compact-contact){font-size:12px!important}
  .nav-compact-links .v15-context-option{font-size:10.5px!important}
  .nav-compact-links .compact-contact{padding:10px 13px!important}
}

@media (max-width:1380px){
  /* The responsive header keeps the same approved logo scale as subpages. */
  nav.top .nav-m{width:100%!important;margin:0!important;padding:0!important}
  .nav-m-brand .brand-logo{height:22px!important}
  .nav-m-brand .brand-sub{display:inline-block!important;font-size:9px!important}
  body[data-world][data-content-view="model"] .model{
    padding-top:54px;
  }
  body[data-world][data-content-view="services"] .world-home-shell,
  body[data-world][data-content-view="model"] .model,
  body[data-world][data-content-view="company"] .company-home{
    min-height:calc(100vh - 166px);
  }
}

@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}