/* Ziel website unified navigation R21: same six links; old premium design retained. */
header.ziel-nav-r21 {
  position:sticky!important;
  top:0!important;
  z-index:100!important;
  height:94px!important;
  background:rgba(246,248,251,.95)!important;
  border-bottom:1px solid rgba(230,234,240,.9)!important;
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
}
/* Home is nested inside #zp-home-v5 and keeps its own visual tokens. */
header.ziel-nav-r21 .nav-inner,
#zp-home-v5 header.ziel-nav-r21 .nav {
  width:min(1580px,calc(100% - 56px))!important;
  max-width:none!important;
  height:94px!important;
  margin:0 auto!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:230px minmax(0,1fr) max-content!important;
  align-items:center!important;
  column-gap:18px!important;
  justify-content:normal!important;
}
header.ziel-nav-r21 .brand,
#zp-home-v5 header.ziel-nav-r21 .brand{
  display:inline-flex!important;
  justify-self:start!important;
  align-items:center!important;
  gap:11px!important;
  white-space:nowrap!important;
  color:#061826!important;
  font-size:18px!important;
  font-weight:800!important;
  line-height:1.1!important;
  letter-spacing:-.025em!important;
}
header.ziel-nav-r21 .brand img,
#zp-home-v5 header.ziel-nav-r21 .brand img{
  display:block!important;
  width:44px!important;
  height:44px!important;
  max-width:none!important;
  object-fit:contain!important;
  border-radius:11px!important;
}
header.ziel-nav-r21 .brand-word {font-size:18px!important;}
header.ziel-nav-r21 nav.nav-links,
#zp-home-v5 header.ziel-nav-r21 nav.links{
  display:flex!important;
  justify-self:center!important;
  justify-content:center!important;
  align-items:center!important;
  gap:clamp(15px,1.48vw,27px)!important;
  min-width:0!important;
  white-space:nowrap!important;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:15px!important;
  font-weight:675!important;
  line-height:1.3!important;
}
header.ziel-nav-r21 nav.nav-links a,
#zp-home-v5 header.ziel-nav-r21 nav.links a{
  display:inline-block!important;
  color:#334155!important;
  font-size:15px!important;
  font-weight:675!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
/* The Product page has a higher-specificity 14px !important header rule.
   Match the other six links exactly without editing its product stylesheet. */
body.product-r10 header.ziel-nav-r21 nav.nav-links,
body.product-r10 header.ziel-nav-r21 nav.nav-links a {
  font-size:15px!important;
  font-weight:675!important;
  line-height:1.3!important;
}
header.ziel-nav-r21 nav.nav-links a:hover,
header.ziel-nav-r21 nav.nav-links a.active,
#zp-home-v5 header.ziel-nav-r21 nav.links a:hover,
#zp-home-v5 header.ziel-nav-r21 nav.links a.active{color:#00856f!important}
header.ziel-nav-r21 .nav-actions,
#zp-home-v5 header.ziel-nav-r21 .nav-actions{
  display:flex!important;
  align-items:center!important;
  justify-self:end!important;
  justify-content:flex-end!important;
  gap:11px!important;
  min-width:0!important;
  white-space:nowrap!important;
}
header.ziel-nav-r21 .nav-actions > a:not(.nav-login):not(.nav-get),
#zp-home-v5 header.ziel-nav-r21 .nav-actions > a{
  min-height:50px!important;
  font-size:15px!important;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  border-radius:999px!important;
}
/* Account page has its own custom nav login/get buttons; preserve destinations. */
header.ziel-nav-r21 .nav-login,
header.ziel-nav-r21 .nav-get{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  height:48px!important;min-height:48px!important;padding:0 19px!important;
  border-radius:999px!important;font-size:15px!important;font-weight:760!important;
}
header.ziel-nav-r21 .nav-login{background:transparent!important;color:#061826!important}
header.ziel-nav-r21 .nav-get{background:#00856f!important;color:#fff!important;border:1px solid #00856f!important}
header.ziel-nav-r21 .nav-actions .ziel-user-menu{max-width:min(310px,24vw)}
header.ziel-nav-r21 .nav-actions .ziel-user-email{max-width:190px}
header.ziel-nav-r21 .nav-menu,
#zp-home-v5 header.ziel-nav-r21 .nav-menu{display:none!important;}
header.ziel-nav-r21 .mobile-menu,
#zp-home-v5 header.ziel-nav-r21 .mobile-menu{display:none!important}
header.ziel-nav-r21 a:focus-visible,
header.ziel-nav-r21 button:focus-visible{outline:3px solid #40baa9;outline-offset:3px}
@media(max-width:1139px){
  header.ziel-nav-r21, #zp-home-v5 header.ziel-nav-r21{height:76px!important}
  header.ziel-nav-r21 .nav-inner,
  #zp-home-v5 header.ziel-nav-r21 .nav{
    height:76px!important;width:calc(100% - 32px)!important;
    grid-template-columns:minmax(0,1fr) max-content!important;
    column-gap:10px!important;
    position:relative!important;
  }
  header.ziel-nav-r21 nav.nav-links,
  #zp-home-v5 header.ziel-nav-r21 nav.links{display:none!important}
  header.ziel-nav-r21 .nav-menu,
  #zp-home-v5 header.ziel-nav-r21 .nav-menu{
    display:inline-flex!important;align-items:center;justify-content:center;
    width:43px;height:43px;flex:0 0 43px;padding:0!important;
    border:1px solid #d9e4e9!important;border-radius:13px!important;
    font-size:23px!important;color:#061826!important;background:#fff!important;
    line-height:1!important;cursor:pointer;
  }
  header.ziel-nav-r21 .nav-actions .btn-ghost,
  #zp-home-v5 header.ziel-nav-r21 .nav-actions .btn-ghost,
  header.ziel-nav-r21 .nav-actions .nav-login{display:none!important}
  header.ziel-nav-r21 .nav-get{display:inline-flex!important}
  header.ziel-nav-r21 .mobile-menu.open,
  #zp-home-v5 header.ziel-nav-r21 .mobile-menu.open{
    position:absolute!important;display:grid!important;top:calc(100% + 6px)!important;
    left:0!important;right:0!important;
    width:100%!important;max-width:none!important;
    padding:10px!important;gap:2px!important;z-index:120!important;
    background:#fff!important;border:1px solid #e0e8eb!important;border-radius:18px!important;
    box-shadow:0 18px 52px rgba(6,24,38,.16)!important;
  }
  header.ziel-nav-r21 .mobile-menu.open a,
  #zp-home-v5 header.ziel-nav-r21 .mobile-menu.open a{
    display:block!important;font-size:15px!important;color:#334155!important;
    font-weight:700!important;padding:12px 14px!important;border-radius:9px!important;text-decoration:none!important;
  }
  header.ziel-nav-r21 .mobile-menu.open a[aria-current="page"]{color:#007a67!important;background:#e9f6f2!important}
}
@media(max-width:610px){
  header.ziel-nav-r21 .brand, #zp-home-v5 header.ziel-nav-r21 .brand{font-size:15px!important;gap:8px!important}
  header.ziel-nav-r21 .brand-word{font-size:15px!important}
  header.ziel-nav-r21 .brand img,#zp-home-v5 header.ziel-nav-r21 .brand img{width:38px!important;height:38px!important}
  header.ziel-nav-r21 .nav-actions > a.btn-primary,
  #zp-home-v5 header.ziel-nav-r21 .nav-actions > a.btn-primary,
  header.ziel-nav-r21 .nav-actions .nav-get{display:none!important}
  header.ziel-nav-r21 .nav-actions .ziel-user-email{display:none!important}
  header.ziel-nav-r21 .nav-actions .ziel-user-menu{max-width:none!important}
}


/* R22 compact geometry. Retains R21's six desktop links, menu and auth hooks.
   Additive CSS only: do not change header markup or shared app behavior. */
@media (min-width:1140px) {
  header.ziel-nav-r21,
  #zp-home-v5 header.ziel-nav-r21 { height:76px!important; }
  header.ziel-nav-r21 .nav-inner,
  #zp-home-v5 header.ziel-nav-r21 .nav {
    height:76px!important;
    grid-template-columns:205px minmax(0,1fr) max-content!important;
    column-gap:13px!important;
  }
  header.ziel-nav-r21 nav.nav-links,
  #zp-home-v5 header.ziel-nav-r21 nav.links {
    gap:clamp(21px,1.95vw,34px)!important;
  }
  header.ziel-nav-r21 .brand img,
  #zp-home-v5 header.ziel-nav-r21 .brand img {width:40px!important;height:40px!important;}
  header.ziel-nav-r21 .nav-actions > a:not(.nav-login):not(.nav-get),
  #zp-home-v5 header.ziel-nav-r21 .nav-actions > a { min-height:44px!important; }
  header.ziel-nav-r21 .nav-actions .ziel-user-menu {max-width:min(295px,23vw)!important;}
  header.ziel-nav-r21 .nav-actions .ziel-user-email {max-width:175px!important;}
}
@media (max-width:1139px) {
  header.ziel-nav-r21, #zp-home-v5 header.ziel-nav-r21 {height:70px!important;}
  header.ziel-nav-r21 .nav-inner,
  #zp-home-v5 header.ziel-nav-r21 .nav {height:70px!important;}
}
@media (max-width:610px) {
  header.ziel-nav-r21, #zp-home-v5 header.ziel-nav-r21 {height:64px!important;}
  header.ziel-nav-r21 .nav-inner,
  #zp-home-v5 header.ziel-nav-r21 .nav {height:64px!important;}
}