/* Shared navigation and demo-button treatment across all languages. */
:root {
  /* 白字对比度 4.64:1（原 #4c6fff 为 4.18:1）；悬停 #3355e6 为 5.86:1 */
  --shulex-brand-blue: #4466fa;
  --shulex-brand-blue-hover: #3355e6;
}

/* Layered important rules take precedence over legacy unlayered CTA overrides. */
@layer shulex-brand {
  /* Signing in opens a product menu; booking a demo owns the only filled button
     in the bar, so these controls carry no fill or outline of their own and
     opening a menu must not add one. Ink is left to each page's navigation
     skin: the homepage bar turns white over its dark hero and dark once it
     sticks, and pinning a colour here would freeze the controls mid-switch. */
  .nav-wrap .account-cta,
  .nav-wrap .account-cta:active,
  .nav-wrap .account-menu.open .account-cta,
  .nav-wrap .home-lang-trigger,
  .nav-wrap .home-lang-switch.open .home-lang-trigger {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* Hover tint follows the ink, so it reads on the dark hero and the white bar. */
  .nav-wrap .account-cta:hover,
  .nav-wrap .home-lang-trigger:hover {
    background: rgb(127 133 148 / 14%) !important;
    background: color-mix(in srgb, currentColor 14%, transparent) !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  .nav-wrap .home-lang-panel a small {
    display: none !important;
  }

  .shulex-demo-cta {
    background: var(--shulex-brand-blue) !important;
    border-color: var(--shulex-brand-blue) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px rgb(76 111 255 / 20%) !important;
  }

  .shulex-demo-cta:hover,
  .shulex-demo-cta:active {
    background: var(--shulex-brand-blue-hover, #3355e6) !important;
    border-color: var(--shulex-brand-blue-hover, #3355e6) !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgb(76 111 255 / 30%) !important;
  }

  .shulex-demo-cta:focus-visible {
    outline: 2px solid var(--shulex-brand-blue) !important;
    outline-offset: 4px !important;
  }

  /* Also guard against descriptions injected by legacy article templates. */
  .nav-wrap .mega-menu p,
  .nav-wrap .solution-list > a > span,
  .nav-wrap #industry-menu header h3,
  .nav-wrap #resource-menu > header h3 {
    display: none !important;
  }

  .nav-wrap .mega-menu .nav-supporting-copy {
    display: block !important;
  }
}

.subpage .nav-wrap .nav-features {
  white-space: nowrap;
}

#platform,
#agent-capabilities {
  scroll-margin-top: 92px;
}

/* Keep the shared icon/title treatment, with more breathing room for capabilities. */
.subpage .nav-wrap :is(#features-menu, #customers-menu) {
  padding: 18px;
  border-radius: 12px;
  max-height: calc(100dvh - 100px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, max-content));
  padding: 0;
  gap: 10px 28px;
  background: transparent;
}
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 12px;
  min-height: 0;
  height: auto;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #17191f;
}
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a:hover,
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a:focus-visible { background: #f5f6f7; }
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a::after { display: none; content: none; }
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin: 0;
  border-radius: 8px;
  background: #edf3ff;
}
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid img { width: 16px; height: 16px; filter: brightness(0); }
.subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid h4 { margin: 0; font-size: 13px; line-height: 1.5; font-weight: 650; overflow-wrap: anywhere; }
/* Distinct category symbols use the same outline treatment as product capabilities. */
.subpage .nav-wrap #customers-menu .mega-grid {
  grid-template-columns: repeat(4, minmax(0, max-content));
  gap: 10px 28px;
}
.subpage .nav-wrap #customers-menu .mega-grid > a {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  min-height: 48px;
  padding: 10px 14px;
  gap: 12px;
}
@media (max-width: 900px) {
  .subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
}
@media (max-width: 700px) {
  .subpage .nav-wrap :is(#features-menu, #customers-menu) { padding: 12px; }
  .subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid > a { padding: 10px; }
}
@media (max-width: 420px) {
  .subpage .nav-wrap :is(#features-menu, #customers-menu) .mega-grid { grid-template-columns: minmax(0, 1fr); }
  .subpage .nav-wrap #customers-menu .mega-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Size each desktop dropdown to its content instead of a shared 560px card. */
@media (min-width: 701px) {
  .subpage .nav-wrap :is(#features-menu, #customers-menu) {
    width: max-content;
    max-width: calc(100vw - 48px);
  }

  .subpage .nav-wrap > :is(#product-menu, #features-menu, #customers-menu, #industry-menu, #support-menu, #resource-menu) {
    left: var(--mega-left, 12px);
    right: auto;
    transform: translateY(-8px);
  }

  .subpage .nav-wrap > :is(#product-menu, #features-menu, #customers-menu, #industry-menu, #support-menu, #resource-menu).open {
    transform: translateY(0);
  }

  .subpage .nav-wrap #product-menu,
  .subpage .nav-wrap #support-menu,
  .subpage .nav-wrap #resource-menu {
    width: max-content;
    max-width: calc(100vw - 48px);
    padding: 6px;
    border-radius: 12px;
  }

  .subpage .nav-wrap #product-menu .mega-grid {
    grid-template-columns: repeat(2, max-content);
    padding: 2px;
    gap: 2px 8px;
  }

  .subpage .nav-wrap #support-menu .support-mega-grid,
  .subpage .nav-wrap #resource-menu .resource-mega-grid {
    grid-template-columns: max-content;
    padding: 2px;
    gap: 2px;
  }

  .subpage .nav-wrap #product-menu .mega-grid > a,
  .subpage .nav-wrap #support-menu .support-mega-grid > a,
  .subpage .nav-wrap #resource-menu .resource-mega-grid > a {
    min-height: 0;
    height: auto;
    padding: 10px;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
    border-radius: 8px;
  }

  .subpage .nav-wrap #product-menu .mega-grid > a > span,
  .subpage .nav-wrap #support-menu .support-mega-grid > a > small,
  .subpage .nav-wrap #resource-menu .resource-mega-grid > a > small {
    width: 28px;
    height: 28px;
    border-radius: 8px;
  }

  .subpage .nav-wrap #product-menu .mega-grid > a > span img,
  .subpage .nav-wrap #support-menu .support-mega-grid > a > small img,
  .subpage .nav-wrap #resource-menu .resource-mega-grid > a > small img {
    width: 16px;
    height: 16px;
  }

  .subpage .nav-wrap #product-menu .mega-grid h4,
  .subpage .nav-wrap #support-menu .support-mega-grid h4,
  .subpage .nav-wrap #resource-menu .resource-mega-grid h4 {
    font-size: 13px;
    line-height: 1.35;
  }

  .subpage .nav-wrap #support-menu > header,
  .subpage .nav-wrap #resource-menu > header {
    padding: 8px 12px 4px;
  }
}

/* Official SVG image: no inline geometry or border-generated arrow. */
.subpage .nav-wrap img.nav-chevron {
  display: block;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  align-self: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  object-fit: contain;
  opacity: .8;
  filter: none;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform .2s ease;
}
.subpage .nav-wrap [aria-expanded="true"] > img.nav-chevron { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) {
  .subpage .nav-wrap img.nav-chevron { transition: none; }
}

/* The language switcher closes the menu row, so it needs its own breathing room
   rather than sitting one menu gap away from the last link. */
.subpage .nav-wrap nav .home-lang-switch { margin-left: clamp(6px, 0.7vw, 14px); }

/* Small print on phones: 8-11px is below the 12px floor for comfortable Chinese
   reading, and several of these labels sit on conversion paths (the WeCom and
   official-account captions under the footer QR codes). Raised together so the
   scale stays consistent; measured on a 375px viewport with no wrapping or
   overflow introduced, and the product-demo widgets keep their layout.

   Deliberately NOT covered: the micro-labels inside the simulated product UI
   (hero carousel overlays, showcase card mockups -- "通话摘要", "已解决 · 会话已归档"
   and friends, 8-11px). Those read as a screenshot of software rather than as
   prose; enlarging them would throw the mock interface out of proportion. An
   audit that flags them is not finding a regression. */
@media (max-width: 700px) {
  body .mega-menu > header small,
  body .resource-mega-menu > header small,
  body .solution-columns > section > header small,
  body .testimonial-identity span,
  body .home-industry-card__metrics > small,
  body .wechat-qr span,
  body .qr-pair .wechat-qr span,
  body .site-footer-current .qr-pair .wechat-qr span,
  body .global-advisor-card small,
  body.home-product-hub .advisor-qr-option p,
  body.home-product-hub .hub-text-question small,
  body.home-product-hub .hub-product-pick strong,
  body.home-product-hub .hub-product-pick small,
  body.home-product-hub .hub-voice-context-row > span,
  body.home-product-hub .hub-voice-context-row > strong,
  body.home-product-hub .hub-status,
  body.home-product-hub .hub-ticket-detail .hub-status,
  body.home-product-hub .hub-message small,
  body.home-product-hub .hub-ticket-detail .hub-message small,
  body.home-product-hub .hub-sent-label,
  body.home-product-hub .hub-management,
  body.home-product-hub .hub-management-copy .hub-management,
  body .testimonial-count b,
  body .voice-caption small,
  body .desk-inbox-heading span,
  body .desk-inbox-row strong,
  body .desk-inbox-row small,
  body .desk-email-sender span,
  body .desk-history-event strong,
  body .desk-history-event small {
    font-size: 12px;
  }
}

/* The Chinese desktop menu needs about 1000px to itself: six dropdowns plus FAQ
   measure 607px at a 760px viewport, where only ~370px is free. Between the old
   700px breakpoint and ~1200px it therefore overlapped both the logo and the
   action buttons (-110px of clearance at 760px, -41px still at 1100px). Collapse
   to the hamburger until there is genuinely room.
   scripts/runtime/script.js gates hover behaviour on the same 1199px threshold. */
@media (min-width: 701px) and (max-width: 1199px) {
  .subpage .nav-wrap { height: 62px; padding: 0 18px; grid-template-columns: 1fr auto; }
  .subpage .nav-wrap .logo img { width: 124px; }
  body.subpage .nav-wrap > .nav-actions { display: none !important; }

  .subpage .nav-wrap .menu {
    position: absolute !important;
    top: 12px !important;
    right: 18px !important;
    z-index: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 38px;
    border: 1px solid #e2e4e8;
    border-radius: 9px;
    color: #17191f;
    background: #fff;
    font-size: 12px;
    font-weight: 650;
  }

  .subpage .nav-wrap nav {
    position: absolute;
    top: 62px;
    left: 0;
    right: 0;
    transform: none;
    display: none;
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 14px 14px;
    border: 0;
    border-bottom: 1px solid #e4e6ea;
    border-radius: 0;
    background: #fff;
  }
  .subpage .nav-wrap nav.open { display: flex; }
  .subpage .nav-wrap nav > a,
  .subpage .nav-wrap nav .nav-dropdown { width: 100%; justify-content: space-between; padding: 0 12px; }

  .subpage .mega-menu {
    position: fixed;
    top: 120px;
    left: 12px;
    right: 12px;
    width: auto;
    max-width: none;
    max-height: calc(100vh - 140px);
    overflow: auto;
    border-radius: 13px;
    box-shadow: 0 18px 46px rgb(17 24 39 / 16%);
  }
}

/* ---- 无障碍：跳到主要内容（仅聚焦时显示） ---- */
.skip-link {
  position: fixed;
  top: 12px;
  left: 16px;
  z-index: 10001;
  padding: 10px 16px;
  border-radius: 8px;
  background: #fff;
  color: #101828 !important;
  font: 600 14px/1.4 var(--site-font-sans, sans-serif);
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 8px 24px rgb(16 24 40 / 18%);
  transform: translateY(-160%);
}
.skip-link:focus,
.skip-link:focus-visible {
  transform: none;
  outline: 2px solid #3355e6;
  outline-offset: 2px;
}

/* ---- 无障碍：旧规则去掉了 outline 的控件，键盘聚焦时补可见焦点 ---- */
.wechat-follow:focus-visible,
.demo-form :is(input, select, textarea):focus-visible,
.resource-search input:focus-visible,
.roi-form :is(input, select):focus-visible,
.customers-page .customer-search input:focus-visible,
.rh-search input:focus-visible,
.rh-feature h2 a:focus-visible,
.rh-card-title a:focus-visible {
  outline: 2px solid #3355e6 !important;
  outline-offset: 2px !important;
}

/* ---- 页脚「Cookie 设置」入口：外观与相邻法律链接一致 ---- */
.site-footer-current .footer-legal .footer-cookie-settings {
  appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #9aa3b4;
  font: inherit;
  cursor: pointer;
}
.site-footer-current .footer-legal .footer-cookie-settings:hover { color: #fff; }
.site-footer-current .footer-legal .footer-cookie-settings:focus-visible { outline: 2px solid #99a6fa; outline-offset: 4px; }
@media (max-width: 700px) {
  .site-footer-current .footer-legal .footer-cookie-settings { padding-block: 6px; margin-block: -6px; }
}

/* ---- 移动端导航（≤1199px，与 script.js 的 hover 门槛一致） ----
   scripts/runtime/nav-mobile.js 把各二级面板移到对应一级项之后并给 header 加 .nav-accordion：
   面板在一级项下方原地展开（手风琴），不再浮层盖住其他项；一级菜单底部放「预约演示」与「登录」。 */
.nav-wrap .nav-mobile-actions { display: none !important; }
@media (max-width: 1199px) {
  body .nav-wrap.nav-accordion nav.open {
    max-height: calc(100vh - 62px);
    max-height: calc(100dvh - 62px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    box-shadow: 0 18px 40px rgb(17 24 39 / 12%);
  }
  body .nav-wrap.nav-accordion nav > .mega-menu {
    position: static !important;
    inset: auto !important;
    display: none !important;
    flex: 0 0 auto;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 2px 0 8px !important;
    padding: 2px 0 2px 10px !important;
    overflow: visible !important;
    border: 0 !important;
    border-left: 2px solid #e6eaf5 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
  }
  body .nav-wrap.nav-accordion nav > .mega-menu.open {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  body .nav-wrap.nav-accordion nav > .mega-menu :is(.mega-grid, .resource-mega-grid, .support-mega-grid, .solution-columns, .solution-list) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  body .nav-wrap.nav-accordion nav > .mega-menu :is(.mega-feature, #resource-menu > header) { display: none !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns > section { margin: 0 0 6px; padding: 0; border: 0 !important; background: none !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns header { margin: 6px 0 2px; padding: 0 10px; border: 0 !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns header::before { display: none !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns header small { color: #667085; font-size: 12px; font-weight: 600; letter-spacing: .02em; }
  body .nav-wrap.nav-accordion nav > .mega-menu a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-radius: 8px !important;
    color: #17191f !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    white-space: normal !important;
    text-align: left !important;
  }
  body .nav-wrap.nav-accordion nav > .mega-menu a:hover,
  body .nav-wrap.nav-accordion nav > .mega-menu a:focus-visible { background: #f3f4f6 !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu a > span { display: grid !important; place-items: center; flex: 0 0 28px; width: 28px !important; height: 28px !important; margin: 0 !important; border-radius: 7px; }
  body .nav-wrap.nav-accordion nav > .mega-menu a > span img { width: 18px !important; height: 18px !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu a::before { flex: 0 0 28px; width: 28px !important; height: 28px !important; margin: 0 !important; background-size: 17px 17px !important; border-radius: 7px; }
  body .nav-wrap.nav-accordion nav > .mega-menu a::after { display: none !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu a > small { display: grid !important; place-items: center; flex: 0 0 28px; width: 28px !important; height: 28px !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border-radius: 7px; color: #667085; font-size: 12px; }
  body .nav-wrap.nav-accordion nav > .mega-menu a > small img { width: 18px !important; height: 18px !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns header,
  body .nav-wrap.nav-accordion nav > .mega-menu .solution-columns header > * { background: none !important; box-shadow: none !important; }
  /* 菜单展开时收起右下角的顾问头像与在线客服气泡，避免压住菜单底部按钮 */
  body:has(.nav-wrap nav.open) :is(.global-advisor-qr, shulex-chatbot-lancher) { display: none !important; }
  body .nav-wrap.nav-accordion nav > .mega-menu :is(h4, b) { margin: 0 !important; color: inherit !important; font-size: 15px !important; font-weight: 500 !important; line-height: 1.4 !important; }

  body .nav-wrap nav .nav-mobile-actions {
    display: flex !important;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    margin: 10px 0 0;
    padding: 14px 0 4px;
    border-top: 1px solid #eef0f3;
  }
  body .nav-wrap nav .nav-mobile-actions a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 46px;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 1px solid #d0d5dd;
    border-radius: 10px !important;
    color: #17191f;
    background: #fff;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
  }
  body .nav-wrap nav .nav-mobile-actions .nav-mobile-cta { color: #fff !important; }
}

/* ---- 免费试用入口（PLG 固定入口，2026-09-20） ----
   导航右侧「预约演示」左边的次级按钮，尺寸对齐 .subpage .account-cta（subpage.css 末段）。
   描边而非实心，保证主 CTA 仍然是「预约演示」；SLG 与 PLG 各一个入口，不互相抢焦点。
   目标是 desk.solvea.cx 的注册页，utm 参数沿用 solvea 官网的约定，仅 campaign 区分落点。 */
.nav-wrap .nav-actions .nav-trial {
  height: 40px;
  min-width: 84px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  color: #17191f;
  background: #fff;
  box-shadow: 0 1px 2px rgb(16 24 40 / 4%);
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.nav-wrap .nav-actions .nav-trial:hover {
  transform: translateY(-1px);
  color: #4466fa;
  border-color: #b9c4fb;
  background: #f4f6ff;
}
.nav-wrap .nav-actions .nav-trial:focus-visible { outline: 2px solid #4466fa; outline-offset: 2px; }
@media (max-width: 700px) {
  .nav-wrap .nav-actions .nav-trial { display: none; }
}

/* 移动端抽屉：第三个按钮，与「登录」同为描边，用品牌色区分于纯中性的登录。 */
@media (max-width: 1199px) {
  body .nav-wrap nav .nav-mobile-actions .nav-mobile-trial {
    color: #4466fa;
    border-color: #c7d0f7;
    background: #f4f6ff;
  }
}

/* ---- 中等宽度下的导航压缩（2026-09-20） ----
   导航右侧多了「免费试用」之后，中等宽度下一级菜单会和按钮区撞上。
   这一段在 1200–1700px 之间收紧 logo 列、菜单间距、内边距与按钮宽度；
   1701px 以上恢复原来的疏朗排版。日文标签最长，以它为准调参。
   实测「不再重叠的最窄宽度」见 README 的改造记录。 */
@media (min-width: 1200px) and (max-width: 2400px) {
  body.subpage .nav-wrap { grid-template-columns: 130px 1fr auto; }
  body .nav-wrap .logo img { width: 130px; }
  body .nav-wrap > nav { gap: 1px; }
  body.subpage .nav-wrap nav .nav-dropdown { padding: 0 4px; }
  /* 「价格」是唯一没有下拉箭头的一级项，两侧多留一点，不然会贴着相邻项。 */
  body.subpage .nav-wrap nav > a { padding: 0 9px; }
  body.subpage .nav-wrap nav .nav-dropdown > span,
  body.subpage .nav-wrap nav > a { font-size: 13px; }
  body.subpage .nav-wrap nav .nav-chevron { width: 12px; height: 12px; }
  body .nav-wrap > .nav-actions { gap: 6px; }
  body.subpage .nav-wrap .nav-actions .nav-trial { min-width: 0; padding: 0 9px; }
  body.subpage .nav-wrap .nav-actions .nav-cta { min-width: 78px; padding: 0 10px; }
  body.subpage .nav-wrap .nav-actions .account-cta { min-width: 0; padding: 0 7px; }
}

/* The current Chinese navigation layout is shared by every locale. */
@media (min-width: 1340px) {
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap { grid-template-columns: 170px 1fr auto; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body .nav-wrap .logo img { width: 144px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body .nav-wrap > nav { gap: 10.8px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap nav .nav-dropdown,
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap nav > a { padding: 0 16px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap nav .nav-dropdown > span,
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap nav > a { font-size: 14px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap nav .nav-chevron { width: 14px; height: 14px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body .nav-wrap > .nav-actions { gap: 12px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap .nav-actions .nav-cta { min-width: 104px; padding: 0 18px; }
  html:is([lang="zh-CN"],[lang="en"],[lang="ja"]) body.subpage .nav-wrap .nav-actions .account-cta { min-width: 66px; padding: 0 16px; }
}

/* Keep the legacy layout from squeezing the trial link at narrow desktop widths. */
@media (min-width: 1200px) and (max-width: 1319px) {
  body .nav-wrap .nav-actions .nav-trial { display: none; }
}

/* Compact the shared header at narrow desktop widths. */
@media (min-width: 1200px) and (max-width: 1379px) {
  body.subpage .nav-wrap { grid-template-columns: 116px 1fr auto; }
  body .nav-wrap .logo img { width: 116px; }
  body.subpage .nav-wrap nav .nav-dropdown,
  body.subpage .nav-wrap nav > a { padding: 0 4px; }
  body.subpage .nav-wrap nav .nav-dropdown > span,
  body.subpage .nav-wrap nav > a { font-size: 12.5px; }
}

/* The current Chinese header is the template for all locales. */
.nav-wrap .nav-actions .nav-trial,
.nav-wrap nav .nav-mobile-actions .nav-mobile-trial { display: none !important; }