/* ==================================================================
   nav.css · 顶栏（2026-10-26）
   ------------------------------------------------------------------
   来由：视觉升版 v2 整体撤回后，用户只点名保留**导航栏**这一处
   （2026-10-26：「退回去，只保留导航栏的修改吧」）。

   因此本文件只含 `.site-nav` 一个作用域，**不覆盖任何全局令牌**
   （--green-pale / --sub / --line 等保持原值），新色一律走 `--nh-*` 前缀。

   改了什么（相对 d21f55e 的顶栏）：
     · 高度：常态 15px、滚动态压到 9px；字标 31→27px
     · 悬停：一条 1px 线从左展开（原来是纯变色，无位移反馈）
     · 当前页：1.5px 指示线（原 2px，贴得太远）
     · CTA：改「表扣」质感（内高光 + 底暗边，去掉外发光），圆角 10→8
     · 滚动态：实底 + 发丝线（原来只有一层淡阴影，顶栏与内容糊在一起）
     · 769–1100 一档收紧间距与字号 —— 顺手修掉 820 宽下 CTA 溢出视口的真缺陷

   回滚：删 BaseLayout 里那一个 <link> 即回到 d21f55e 的顶栏。
   ================================================================== */

:root {
  --nh-acc:  #1F665C;                  /* 顶栏强调色（比 --green 深半档，压在浅底上更稳） */
  --nh-ink:  #102B27;
  --nh-hair: rgba(13, 46, 41, .09);
  --nh-ease: cubic-bezier(.22, 1, .36, 1);
}

.site-nav {
  background: rgba(237, 244, 242, .84);                 /* 老浏览器兜底 */
  background: color-mix(in srgb, var(--green-pale) 78%, transparent);
  border-bottom: 1px solid transparent;
  backdrop-filter: saturate(1.6) blur(14px);
  -webkit-backdrop-filter: saturate(1.6) blur(14px);
  transition: background-color .3s var(--nh-ease), border-color .3s var(--nh-ease), box-shadow .3s var(--nh-ease);
}
.nav-inner {
  padding: 15px 24px;
  transition: padding .32s var(--nh-ease);
}
.nav-brand .logo-full { height: 31px; transition: height .32s var(--nh-ease); }
.nav-links { gap: 30px; }
.nav-links a {
  font-size: 13.5px; font-weight: 500; color: var(--nh-ink);
  letter-spacing: .01em; padding: 4px 0;
}
/* 悬停：一条 1px 线从左展开 */
.nav-links a::after {
  content: ""; position: absolute; left: 0; bottom: -2px; height: 1px; width: 100%;
  background: currentColor; transform: scaleX(0); transform-origin: left;
  transition: transform .34s var(--nh-ease);
}
.nav-links a:hover { color: var(--nh-acc); text-decoration: none; }
.nav-links a:hover::after { transform: scaleX(1); }
.nav-links a.active { color: var(--nh-acc); font-weight: 600; }
.nav-links a.active::after {
  height: 1.5px; bottom: -6px; transform: scaleX(1);
  background: var(--nh-acc); border-radius: 0;
}

/* CTA：只做「表扣」——内高光 + 底部暗边，不用外发光 */
.nav-cta {
  border-radius: 8px !important;
  padding: 9px 18px !important;
  background: linear-gradient(180deg, #2A7469 0%, #1B5A51 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22),
              inset 0 -1px 0 rgba(0, 0, 0, .18),
              0 1px 2px rgba(12, 42, 38, .12);
  font-size: 13.5px; font-weight: 550; letter-spacing: .01em;
  transition: transform .2s var(--nh-ease), box-shadow .24s var(--nh-ease), filter .2s;
}
.nav-cta:hover {
  background: linear-gradient(180deg, #2F8074 0%, #1E6359 100%) !important;
  transform: translateY(-1px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .26),
              inset 0 -1px 0 rgba(0, 0, 0, .16),
              0 4px 12px -4px rgba(12, 42, 38, .35);
}

/* 滚动态：实底 + 发丝线（高度由 global.css @3733 的 min-height:76px 钉住，
   所以下面这两条 padding 只改内部留白、不改变整条的高度 —— 保持用户验收时的观感） */
.site-nav.scrolled {
  background: rgba(237, 244, 242, .95);
  background: color-mix(in srgb, var(--green-pale) 94%, transparent);
  border-bottom-color: var(--nh-hair);
  box-shadow: 0 1px 0 rgba(12, 42, 38, .04), 0 12px 28px -24px rgba(12, 42, 38, .4);
}
.site-nav.scrolled .nav-inner { padding-top: 9px; padding-bottom: 9px; }
.site-nav.scrolled .nav-brand .logo-full { height: 27px; }

/* 769–1100 这一档 6 个栏目 + CTA 一行放不下（820 实测 CTA 溢出视口）。
   折叠断点（768）不动 —— 开合样式写死在 global.css 的 768 媒体查询里。 */
@media (max-width: 1100px) {
  .nav-inner { padding: 13px 20px; }
  .nav-links { gap: 12px; }
  .nav-links a { font-size: 12.6px; padding: 4px 8px; }
  .nav-cta { padding: 8px 13px !important; font-size: 12.5px !important; }
  .nav-brand .logo-full { height: 27px; }
}

@media (max-width: 760px) {
  .nav-inner { padding: 12px 20px; }
  .nav-brand .logo-full { height: 26px; }
}
