/* ============================================================
   Marketing nav (white theme) — 共享样式
   用于：营销首页 / 所有"对外可见"的活动页 (activity-6/7/8/9)
   与 portal nav（.site-nav，黑底，仅内部门户页用）互不耦合。
   颜色硬编码，不依赖 :root 变量（避免和活动页 dark 主题冲突）。
   ============================================================ */

/* 顶部固定 + 磨砂白 */
#nav {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  background: rgba(255,255,255,0.72);
  border-bottom: 1px solid rgba(0,0,0,0.05);
  transition: box-shadow 0.3s;
}
#nav.scrolled { box-shadow: 0 6px 30px rgba(0,0,0,0.06); }

/* 容器 */
.nav-inner {
  max-width: 1200px; margin: 0 auto; padding: 0 40px; height: 72px;
  display: flex; align-items: center; justify-content: space-between;
}

/* 品牌 logo */
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand img { height: 56px; width: auto; }

/* 链接组 */
.nav-links { display: flex; gap: 38px; font-size: 14.5px; font-weight: 500; color: #4a4a4a; align-items: center; }
.nav-links > a {
  position: relative; padding: 6px 0; transition: color 0.25s;
  text-decoration: none; color: inherit;
}
.nav-links > a::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px;
  background: #ff6900; transition: width 0.3s cubic-bezier(.22,.61,.21,1);
}
.nav-links > a:hover { color: #212121; }
.nav-links > a:hover::after { width: 100%; }

/* 本月活动 / 内部使用 下拉 */
.nav-links .nav-dropdown { position: relative; padding-bottom: 6px; }
.nav-links .nav-trigger {
  display: inline-flex; align-items: center; cursor: pointer; user-select: none;
  position: relative; padding: 6px 0; transition: color 0.25s; color: inherit;
}
.nav-links .nav-trigger::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px;
  background: #ff6900; transition: width 0.3s cubic-bezier(.22,.61,.21,1);
}
.nav-links .nav-dropdown:hover .nav-trigger::after,
.nav-links .nav-dropdown.open .nav-trigger::after { width: 100%; }
.nav-links .nav-trigger:hover { color: #212121; }

.nav-links .caret {
  display: inline-block; margin-left: 6px; width: 0; height: 0;
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid currentColor; vertical-align: middle; transition: transform 0.2s;
}
.nav-links .nav-dropdown.open .caret { transform: rotate(180deg); }

.nav-links .dropdown-menu {
  display: none; position: absolute; top: 100%; left: -8px; margin-top: 0;
  min-width: 168px; padding: 6px; background: #fff;
  border: 1px solid rgba(0,0,0,0.08); border-radius: 12px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.12); z-index: 120;
}
.nav-links .dropdown-item {
  display: block; padding: 9px 14px; color: #4a4a4a;
  text-decoration: none; font-size: 14.5px; border-radius: 6px;
  white-space: nowrap; transition: background 0.2s, color 0.2s;
}
.nav-links .dropdown-item:hover { background: #f5f5f5; color: #212121; }
.nav-links .dropdown-item.current { color: #ff6900; font-weight: 600; }
@media (hover: hover) {
  .nav-links .nav-dropdown:hover .dropdown-menu { display: block; }
}
.nav-links .nav-dropdown.open .dropdown-menu { display: block; }

/* 内部使用 直链（不下拉） */
.nav-links > a[href="/dashboard"] {
  position: relative; padding: 6px 0; transition: color 0.25s;
  text-decoration: none; color: inherit;
}
.nav-links > a[href="/dashboard"]::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px;
  background: #ff6900; transition: width 0.3s cubic-bezier(.22,.61,.21,1);
}
.nav-links > a[href="/dashboard"]:hover { color: #212121; }
.nav-links > a[href="/dashboard"]:hover::after { width: 100%; }

/* 联系我们 CTA（黑底圆角胶囊） */
.nav-cta {
  font-size: 14px; font-weight: 600; color: #fff; background: #212121;
  padding: 10px 22px; border-radius: 100px;
  transition: background 0.25s, transform 0.25s; text-decoration: none; white-space: nowrap;
}
.nav-cta:hover { background: #ff6900; transform: translateY(-1px); }

/* 右上角登录 / 用户名 */
#navLoginArea { display: inline-flex; align-items: center; }
.nav-login {
  font-size: 14px; font-weight: 500; color: #4a4a4a;
  padding: 6px 0; margin-left: 24px;
  position: relative; transition: color 0.2s; text-decoration: none; white-space: nowrap;
}
.nav-login::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px;
  background: #ff6900; transition: width 0.3s cubic-bezier(.22,.61,.21,1);
}
.nav-login:hover { color: #212121; }
.nav-login:hover::after { width: 100%; }
.nav-user-area { display: inline-flex; align-items: center; gap: 14px; margin-left: 24px; font-size: 14px; color: #4a4a4a; white-space: nowrap; }
.nav-user-area .uname { color: #212121; font-weight: 500; }
.nav-user-area a.nav-logout { color: #8a8a8a; text-decoration: none; transition: color 0.2s; }
.nav-user-area a.nav-logout:hover { color: #ff6900; }

/* 移动端汉堡按钮 */
.menu-btn { display: none; background: none; border: none; cursor: pointer; padding: 8px; }
.menu-btn span { display: block; width: 22px; height: 2px; background: #212121; margin: 5px 0; transition: 0.3s; }

/* 响应式 */
@media (max-width: 960px) {
  .nav-inner { padding: 0 24px; }
  .nav-links { display: none; }
  .menu-btn { display: block; }
  .nav-cta { margin-left: 0; }
}