/* =========================================================================
   NVC 顶部导航修正（R11，2026-10-25）
   ---------------------------------------------------------------------------
   问题：导航按钮里的中文被挤成竖排（"课\n程"），"免费订阅"CTA 竖着折成 4 行，
         Logo 的"学习中心"也被折行。
   原因：.nav-in 最大宽 1100px，导航 7 项 + Logo + 语言切换 + 订阅按钮的自然宽度
         超过可用宽度；flex 默认允许收缩，而中文没有 nowrap，于是每个链接被压到
         一格宽，逐字换行。
   做法：全部 nowrap + 收紧间距/字号/内边距，让 961–1440px 都单行放得下；
         960px 以下仍是汉堡菜单（不动）。
   只叠加覆盖，不改 style.css / glass.css。
   ========================================================================= */

/* ---------- 修掉移动端汉堡菜单被裁切的老问题 ----------
   style.css 里通用规则 nav{overflow-x:hidden}（line 83）会让绝对定位的
   .mobile-menu 被裁在导航条内。菜单打开时放开裁剪即可（关闭态无变化）。 */
nav#siteNav.menu-open { overflow: visible; }
@media (max-width: 960px) {
  nav#siteNav { overflow: visible; }
}

/* ---------- 基础：所有导航元素一律不折行 ---------- */
nav#siteNav .nav-in {
  max-width: 1100px;
  gap: 16px;
  padding: 12px 20px;
  flex-wrap: nowrap;
  align-items: center;
}
nav#siteNav .logo {
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: 1rem;
  line-height: 1.15;
}
nav#siteNav .logo-text {
  white-space: nowrap;
  line-height: 1.15;
}
nav#siteNav .logo .dot {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
}
nav#siteNav .nav-links {
  gap: 14px;
  margin-left: auto;
  font-size: 0.84rem;
  flex-wrap: nowrap;
  min-width: 0;
}
nav#siteNav .nav-links a {
  white-space: nowrap;
  flex: 0 0 auto;
  padding: 7px 9px;
  font-size: 0.84rem;
  line-height: 1.5;
  border-radius: 999px;
}
nav#siteNav .nav-actions {
  flex: 0 0 auto;
  gap: 10px;
  white-space: nowrap;
}
nav#siteNav .lang-switch {
  flex: 0 0 auto;
  gap: 2px;
  padding: 3px;
}
nav#siteNav .lang-switch .ls-opt {
  white-space: nowrap;
  min-width: 0;
  padding: 3px 8px;
  font-size: 0.72rem;
  line-height: 1.5;
}
nav#siteNav .nav-cta {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 9px 16px;
  font-size: 0.82rem;
  line-height: 1.3;
  min-height: 0;
  height: auto;
}

/* ---------- 961–1180px：再压一档，保证中文/英文都单行 ---------- */
@media (max-width: 1180px) {
  nav#siteNav .nav-in {
    gap: 10px;
    padding: 10px 14px;
  }
  nav#siteNav .nav-links {
    gap: 8px;
    font-size: 0.8rem;
  }
  nav#siteNav .nav-links a {
    padding: 6px 7px;
    font-size: 0.8rem;
  }
  nav#siteNav .logo {
    font-size: 0.92rem;
  }
  nav#siteNav .logo .dot {
    width: 30px;
    height: 30px;
    font-size: 0.6rem;
  }
  nav#siteNav .nav-cta {
    padding: 8px 12px;
    font-size: 0.76rem;
  }
  nav#siteNav .lang-switch .ls-opt {
    padding: 3px 6px;
    font-size: 0.68rem;
  }
}

/* 英文标签更长，窄桌面单独压一档 */
@media (max-width: 1180px) {
  html[data-lang="en"] nav#siteNav .nav-links {
    gap: 6px;
    font-size: 0.75rem;
  }
  html[data-lang="en"] nav#siteNav .nav-links a {
    padding: 6px 6px;
    font-size: 0.75rem;
  }
  html[data-lang="en"] nav#siteNav .logo {
    font-size: 0.86rem;
  }
  html[data-lang="en"] nav#siteNav .nav-cta {
    padding: 8px 10px;
    font-size: 0.72rem;
  }
}

/* ---------- ≤960px：汉堡菜单模式（导航项本来就隐藏，这里只防 Logo/语言切换折行） ---------- */
@media (max-width: 960px) {
  nav#siteNav .nav-in {
    gap: 10px;
    padding: 10px 14px;
  }
  nav#siteNav .logo {
    font-size: 0.92rem;
  }
  nav#siteNav .logo .dot {
    width: 30px;
    height: 30px;
    font-size: 0.6rem;
  }
  nav#siteNav .lang-switch .ls-opt {
    padding: 3px 7px;
    font-size: 0.7rem;
  }
  nav#siteNav .mobile-menu {
    /* 半透明玻璃在手机上会透出下面的 Hero 文字，菜单读起来脏；这里提到近乎不透明 */
    background: #fffdf8;
  }
  nav#siteNav .mobile-menu a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media (max-width: 400px) {
  nav#siteNav .logo {
    font-size: 0.86rem;
  }
  nav#siteNav .logo .dot {
    width: 28px;
    height: 28px;
    font-size: 0.56rem;
  }
  nav#siteNav .lang-switch .ls-opt {
    padding: 3px 5px;
    font-size: 0.62rem;
  }
}
