.archive-global-nav {
  position: relative;
  z-index: 2147483000;
  height: 44px;
  background: #1d1d1f;
  color: #f5f5f7;
  font: 12px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  letter-spacing: .01em;
}
@media (min-width:737px) {
  html[data-archive-t2-scroll],html[data-archive-t2-scroll] body {height:100%}
  html[data-archive-t2-scroll] body {display:flex;flex-direction:column}
  html[data-archive-t2-scroll] .archive-global-nav {flex-shrink:0}
  html[data-archive-t2-scroll] .archive-frame {flex:1 1 0;min-height:0}
  html[data-archive-product-scroll]:not([data-archive-product-scroll="upro2s"]) my-app > .wrapper > header-sub {
    display: block;
    position: sticky;
    top: 0;
    z-index: 100;
  }
  html[data-archive-product-scroll]:not([data-archive-product-scroll="upro2s"]) my-app > .wrapper > header-sub .header-desktop .nav-product,
  html[data-archive-product-scroll]:not([data-archive-product-scroll="upro2s"]) my-app > .wrapper > header-sub .header-desktop.onepage-wrapper .nav-product.active {
    position: relative;
    top: 0;
    transform: none;
  }
}
.archive-global-nav * { box-sizing: border-box; }
.archive-global-nav a { color: inherit; text-decoration: none; }
.archive-nav-bar {
  position: relative;
  z-index: 3;
  height: 44px;
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 18px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 11px;
}
.archive-nav-brand {
  flex: 0 0 25px;
  width: 25px;
  display: flex;
  align-items: center;
  margin-right: 7px;
}
.archive-nav-logo {
  display: block;
  width: 20px;
  height: 20px;
  background: url("static.smartisanos.cn/common/img/header/global-logo_ff1ac8c7e4@2x.png") center top / 20px 104px no-repeat;
}
.archive-nav-list { display: flex; align-items: stretch; height: 44px; gap: 21px; }
.archive-nav-item { position: relative; display: flex; align-items: stretch; }
.archive-nav-trigger, .archive-nav-link {
  appearance: none;
  border: 0;
  background: transparent;
  color: #f5f5f7;
  font: inherit;
  font-weight: 400;
  font-synthesis: none;
  cursor: pointer;
  padding: 0 12px;
  display: flex;
  align-items: center;
  white-space: nowrap;
  transition: color .32s cubic-bezier(.4, 0, .6, 1);
}
.archive-nav-trigger:hover, .archive-nav-trigger:focus-visible,
.archive-nav-link:hover, .archive-nav-link:focus-visible { color: #fff; outline: none; }
.archive-nav-mega {
  position: absolute;
  z-index: 2;
  top: 44px;
  left: 50%;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  padding: 0;
  transform: translateX(-50%);
  background: rgba(29, 29, 31, .98);
  color: #f5f5f7;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: max-height .36s cubic-bezier(.4, 0, .6, 1), padding .36s cubic-bezier(.4, 0, .6, 1), opacity .24s cubic-bezier(.4, 0, .6, 1), visibility .24s;
}
.archive-nav-mega-inner { width: min(100%, 1380px); margin: 0 auto; padding: 0 40px; }
.archive-nav-mega-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); column-gap: 28px; }
.archive-nav-mega-column { min-width: 0; }
.archive-nav-mega-column.is-continuation { padding-top: 28px; }
.archive-nav-mega-column h2 {
  margin: 0 0 12px;
  color: #86868b;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.333333;
  letter-spacing: 0;
}
.archive-nav-mega-list { display: flex; flex-direction: column; align-items: flex-start; }
.archive-nav-mega-link {
  display: block;
  max-width: 100%;
  padding: 9px 11px 4px;
  margin-bottom: -6px;
  color: #f5f5f7;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.1666667;
  letter-spacing: .009em;
  overflow-wrap: anywhere;
  transition: color .32s cubic-bezier(.4, 0, .6, 1);
}
.archive-nav-mega-link:hover, .archive-nav-mega-link:focus-visible { color: #a1a1a6; outline: none; }
.archive-nav-curtain {
  position: fixed;
  z-index: 1;
  top: 44px;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .32);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s cubic-bezier(.4, 0, .6, 1), visibility .24s;
}
.archive-nav-toggle { display: none; }
.archive-nav-icon { display: none !important; }
.archive-nav-enabled .nav-global, .archive-nav-enabled .head { display: none !important; }
.archive-global-nav.is-menu-open .archive-nav-mega {
  max-height: 430px;
  padding: 40px 0 46px;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.archive-global-nav.is-menu-open .archive-nav-curtain { opacity: 1; visibility: visible; pointer-events: none; }

@media (max-width: 833px) {
  .archive-global-nav { width: 100%; height: auto; min-height: 48px; }
  .archive-nav-bar { position: relative; z-index: auto; min-height: 48px; height: auto; padding: 0 16px; justify-content: flex-start; flex-wrap: wrap; gap: 0; }
  .archive-nav-brand { height: 48px; margin-right: 0; }
  .archive-nav-toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 48px;
    margin-left: auto;
    padding: 0 10px;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .archive-nav-toggle span { display: block; width: 18px; height: 1px; background: #f5f5f7; transition: transform .28s cubic-bezier(.4, 0, .6, 1); }
  .archive-global-nav.is-menu-open .archive-nav-toggle { position: fixed; top: 0; right: 6px; z-index: 5; margin: 0; }
  .archive-global-nav.is-menu-open .archive-nav-toggle span:first-child { transform: translateY(3px) rotate(45deg); }
  .archive-global-nav.is-menu-open .archive-nav-toggle span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .archive-nav-list { display: none; width: 100%; height: auto; flex-direction: column; gap: 0; padding: 8px 0 20px; }
  .archive-global-nav.is-mobile-open .archive-nav-list { display: flex; }
  .archive-nav-item { display: block; }
  .archive-nav-trigger, .archive-nav-link {
    width: 100%;
    min-height: 46px;
    padding: 0 4px;
    justify-content: space-between;
    color: #f5f5f7;
    font-size: 17px;
    line-height: 1.25;
  }
  .archive-nav-menu-entry .archive-nav-trigger::after {
    content: "";
    width: 8px;
    height: 8px;
    border-right: 1.5px solid #86868b;
    border-bottom: 1.5px solid #86868b;
    transform: rotate(45deg) translateY(-2px);
    transition: transform .24s cubic-bezier(.4, 0, .6, 1);
  }
  .archive-global-nav.is-menu-open .archive-nav-menu-entry .archive-nav-trigger::after { transform: rotate(225deg) translate(-2px, -1px); }
  .archive-nav-mega {
    position: fixed;
    z-index: 4;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: 100vh;
    height: 100dvh;
    max-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    transform: none;
    background: rgba(29, 29, 31, .98);
    transition: max-height .42s cubic-bezier(.4, 0, .6, 1), opacity .24s cubic-bezier(.4, 0, .6, 1), visibility .24s;
  }
  .archive-nav-mega-inner { width: 100%; padding: 0 4px; }
  .archive-nav-mega-columns { grid-template-columns: 1fr; gap: 22px; }
  .archive-nav-mega-column.is-continuation { padding-top: 0; }
  .archive-nav-mega-column h2 { margin-bottom: 8px; font-size: 12px; }
  .archive-nav-mega-link { padding: 11px; margin-bottom: -7px; font-size: 28px; line-height: 1.142857; letter-spacing: .007em; }
  .archive-global-nav.is-menu-open .archive-nav-mega { max-height: 100vh; max-height: 100dvh; padding: 56px 0 14px; }
  .archive-nav-curtain { display: none; }
  body:has(.archive-global-nav.is-menu-open) { overflow: hidden; }
}

@media (min-width: 834px) and (max-width: 1199px) {
  .archive-nav-list { gap: 10px; }
  .archive-nav-trigger, .archive-nav-link { padding-left: 8px; padding-right: 8px; }
  .archive-nav-mega-inner { padding-right: 28px; padding-left: 28px; }
  .archive-nav-mega-columns { column-gap: 20px; }
  .archive-nav-mega-link { font-size: 20px; }
}


/* Smaller secondary menu items for TNT and SmartisanOS. */
.archive-nav-mega-column.is-secondary-menu .archive-nav-mega-link { font-size: 16px; }

/* Keep the longest phone name on one line only in the Chinese shared menu. */
html[lang="zh-CN"] .archive-nav-mega-link[href$="/products/upro2s/index.html"] { white-space: nowrap; }
/* Chinese mobile navigation is a viewport layer, never document content. */
@media (max-width:833px) {
  .archive-global-nav[data-archive-cn-nav].is-mobile-open {
    position:fixed!important;top:0;left:0;right:var(--archive-menu-gutter,0px);width:auto;height:48px;min-height:48px;margin-top:0!important;transform:none!important;
  }
  .archive-global-nav[data-archive-cn-nav].is-mobile-open .archive-nav-bar {height:48px;min-height:48px;flex-wrap:nowrap}
  .archive-global-nav[data-archive-cn-nav].is-mobile-open .archive-nav-toggle {position:static;margin-left:auto}
  .archive-global-nav[data-archive-cn-nav].is-mobile-open .archive-nav-toggle span:first-child {transform:translateY(3px) rotate(45deg)}
  .archive-global-nav[data-archive-cn-nav].is-mobile-open .archive-nav-toggle span:last-child {transform:translateY(-3px) rotate(-45deg)}
  .archive-global-nav[data-archive-cn-nav].is-mobile-open .archive-nav-list {
    position:fixed;z-index:2;top:var(--archive-menu-header,48px);left:0;right:var(--archive-menu-gutter,0px);width:auto;
    height:var(--archive-menu-available,calc(100dvh - 48px));padding:8px 20px max(20px,env(safe-area-inset-bottom));
    overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#1d1d1f;
  }
  .archive-global-nav[data-archive-cn-nav].is-menu-open .archive-nav-list {visibility:hidden;pointer-events:none}
  .archive-global-nav[data-archive-cn-nav].is-menu-open .archive-nav-mega {
    top:calc(var(--archive-menu-header,48px) + 46px);right:var(--archive-menu-gutter,0px);bottom:auto;
    height:calc(var(--archive-menu-available,calc(100dvh - 48px)) - 46px);max-height:none;padding:18px 0 calc(max(14px,env(safe-area-inset-bottom)) + var(--archive-menu-tail,0px));
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#1d1d1f;
    transition:opacity .24s cubic-bezier(.4,0,.6,1),visibility .24s;
  }
  .archive-nav-mobile-sections {
    position:fixed;z-index:5;top:var(--archive-menu-header,48px);left:0;right:var(--archive-menu-gutter,0px);
    display:flex;height:46px;padding:0 20px;background:#1d1d1f;
  }
  .archive-nav-mobile-sections .archive-nav-trigger {width:50%;min-width:0;min-height:46px}
}