/* ==========================================================================
   钦管家 qgj999.cn —— overseas 板块「全站导航栏」样式（板块专用镜像）
   --------------------------------------------------------------------------
   背景（2026-09-16 钦总要求：为「跨境财富与信托」板块补充导航栏与页脚）：
     overseas/ 下的 17 个页面是「独立设计的系列长文页」，自带 overseas.css
     （深蓝 #1a3a5c + 金 #c8a45c 主题），刻意不加载 css/style.css ——
     style.css 含全局 body / h1 / h2 / ul / a 重置与 section{padding:80px 0}，
     一旦引入会把这些页的既有版式整体冲掉。
     但这类页面此前只有一行简化导航（.ov-sitenav）与一行文字页脚，
     缺少与全站一致的导航栏、认证入口与备案信息。
     故新增本文件：把 css/style.css 中的「.top-bar + .navbar + .nav-*」段
     抽成板块专用样式。规则一律收窄到同名类作用域内，
     不写全局选择器、不覆盖页面 :root 变量、不改动 overseas.css 任何一行。

   ⚠️ 同步约定：改全站导航栏样式时，本文件需与 css/style.css 一起改。
      取值以 style.css 中「后段覆盖层」修正后的实际生效值为准：
        · 基础段              约 84-165 行 / 278-400 行
        · 覆盖层 A            约 2623-2635 行
        · 覆盖层 B（最终生效） 约 3067-3230 行  ← 字号/容器宽度/断点以此为准
      页脚不在此复制：直接引用既有镜像 ../css/qgj-footer.css（本板块已 <link>）。

   本文件末尾另有两条 overseas 专有补丁，见文末注释：
     ① footer.footer 兼容规则（抵消 overseas.css 元素级 footer{} 的干扰）
     ② 双 sticky 叠放（页内目录让位于导航栏）与锚点偏移
   ========================================================================== */

/* ===== 顶部公告条 ===== */
.top-bar {
    background: #0f2540;                        /* = --primary-dark */
    color: rgba(255, 255, 255, 0.75);
    font-size: 1.4rem;                          /* 覆盖层 B 最终值 */
    line-height: 1.4;
    padding: 8px 0;
    text-align: center;
    font-weight: 500;
}

/* ===== 导航栏 ===== */
.navbar {
    background: #1a3a5c;                        /* = --primary */
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 16px rgba(26, 58, 92, 0.15);
}

.navbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    box-sizing: border-box;
    max-width: 1440px;                          /* 覆盖层 B 最终值 */
    min-height: 56px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ---- 品牌区 ---- */
.nav-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    color: #fff;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 1px;
    text-decoration: none;
}
.nav-logo-img {
    height: 36px;                               /* 覆盖层 B 最终值 */
    width: auto;
    object-fit: contain;
    border-radius: 50%;
    transition: transform 0.3s ease;
}
.nav-logo:hover .nav-logo-img { transform: scale(1.05); }

.logo-brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
    margin-left: 4px;
}
.logo-brand-main { font-size: 1.4rem; font-weight: 700; color: #fff; letter-spacing: 1px; }
.logo-brand-sub  { font-size: 0.75rem; color: #dbb976; letter-spacing: 2px; font-weight: 400; }

/* ===== 一级菜单 ===== */
.nav-menu {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 3px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.nav-menu a {
    display: inline-block;
    font-size: 0.95rem;
    line-height: 1.2;
    color: rgba(255, 255, 255, 0.82);
    padding: 8px 9px;
    border-radius: 6px;                         /* = --radius-sm */
    font-weight: 500;
    white-space: nowrap;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
}
.nav-menu a:hover,
.nav-menu a.active {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

/* ===== 二级菜单（个人财税 / 家庭财税 下拉）===== */
.nav-menu > li.has-sub { position: relative; }
.nav-menu > li.has-sub > a::after {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 5px;
    border-left: 3.5px solid transparent;
    border-right: 3.5px solid transparent;
    border-top: 4px solid currentColor;
    opacity: .8;
    vertical-align: middle;
    transform: translateY(-1px);
}
.nav-sub {
    position: absolute;
    top: calc(100% - 2px);
    left: 50%;
    transform: translateX(-50%);
    min-width: 156px;
    margin: 0;
    padding: 6px;
    list-style: none;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
    display: none;
    z-index: 1200;
}
.nav-menu > li.has-sub:hover > .nav-sub,
.nav-menu > li.has-sub:focus-within > .nav-sub { display: block; }
.nav-sub > li { display: block; }
.nav-menu .nav-sub > li > a {
    display: block;
    width: 100%;
    padding: 9px 16px;
    font-size: .82rem;
    font-weight: 500;
    color: #1a2332;                             /* = --text-dark */
    background: transparent;
    border-radius: 6px;
    white-space: nowrap;
    text-align: left;
}
.nav-menu .nav-sub > li > a:hover,
.nav-menu .nav-sub > li > a.active { background: #f7f9fc; color: #1a3a5c; }
.nav-menu .nav-sub > li > a.active { font-weight: 700; }

/* ===== 导航栏右侧（联系我们 / 登录 / 用户 / 会员徽标 / 汉堡）===== */
.nav-auth {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    flex-shrink: 0;
}
.nav-contact-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 6px;                         /* = --radius-sm */
    padding: 6px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: none;
    transition: all .2s;
}
.nav-contact-btn::before { content: "\260E"; font-size: 0.9em; opacity: .9; }
.nav-contact-btn:hover { background: #c8a45c; border-color: #c8a45c; color: #fff; }

.nav-login-btn {
    color: #c8a45c;                             /* = --accent */
    border: 1px solid #c8a45c;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: none;
    transition: all 0.3s ease;
}
.nav-login-btn:hover { background: #c8a45c; color: #fff; }

.nav-user-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: none;
    transition: all 0.3s ease;
}
.nav-user-btn:hover { background: rgba(255, 255, 255, 0.25); }

.nav-member-badge {
    background: linear-gradient(135deg, #c8a45c, #e6c05c);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
    white-space: nowrap;
    line-height: 1.4;
}

.nav-user-label { display: inline-block; }
.nav-user-caret { margin-left: 6px; font-size: 0.9rem; opacity: 0.85; line-height: 1; }

.nav-toggle {
    display: none;
    background: none;
    border: none;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 4px;
}

/* ===== 导航栏响应式（断点与 css/style.css 覆盖层 B 一致）===== */
@media (max-width: 1280px) {
    .nav-menu a { font-size: 0.88rem; padding: 8px 7px; }
    .nav-contact-btn,
    .nav-login-btn,
    .nav-user-btn { font-size: 0.86rem; padding: 6px 10px; }
    .logo-brand-sub { display: none; }
}

@media (max-width: 1180px) {
    .nav-menu {
        display: none;
        position: absolute;
        top: 100%;                              /* 贴住导航栏下沿（主站写死 70px，此处改为自适应） */
        left: 0;
        width: 100%;
        background: #1a3a5c;
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
        gap: 2px;
        max-height: 70vh;
        overflow-y: auto;
    }
    .nav-menu.show { display: flex; }
    .nav-menu a { font-size: 0.95rem; width: 100%; padding: 12px 16px; text-align: left; }
    .nav-toggle { display: block; }
    .nav-auth { margin-left: auto; gap: 4px; }
    .nav-contact-btn,
    .nav-login-btn,
    .nav-user-btn { font-size: 0.8rem; padding: 5px 9px; }
    .nav-member-badge { display: none; }
    .nav-menu > li.has-sub { width: 100%; }
    .nav-menu > li.has-sub > a::after { display: none; }
    .nav-menu > li.has-sub > .nav-sub {
        display: block;
        position: static;
        transform: none;
        min-width: 0;
        padding: 2px 0 2px 10px;
        margin: 2px 0 6px;
        background: rgba(255, 255, 255, .06);
        box-shadow: none;
        border-radius: 8px;
    }
    .nav-menu .nav-sub > li > a { color: rgba(255, 255, 255, .72); padding: 10px 16px; }
    .nav-menu .nav-sub > li > a:hover,
    .nav-menu .nav-sub > li > a.active { background: rgba(255, 255, 255, .12); color: #fff; }
}

/* ==========================================================================
   系列条 —— 保留原 .ov-header 的「专题系列」标识，去掉与导航栏重复的品牌行
   与原 .ov-sitenav 简化导航（已由上面的 .navbar 取代）
   ========================================================================== */
.ov-subhead {
    background: linear-gradient(135deg, var(--navy-deep), var(--navy));
    color: var(--gold-soft);
    border-bottom: 3px solid var(--gold);
    font-size: 13px;
}
.ov-subhead-inner {
    max-width: var(--maxw);
    margin: 0 auto;
    padding: 11px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.ov-sh-series { flex: 1; letter-spacing: .3px; }
.ov-sh-back {
    color: var(--gold-soft);
    border: 1px solid rgba(200, 164, 92, .55);
    border-radius: 20px;
    padding: 5px 12px;
    font-size: 12.5px;
    line-height: 1;
    white-space: nowrap;
    transition: all .18s ease;
}
.ov-sh-back:hover {
    background: var(--gold);
    color: var(--navy-deep);
    border-color: var(--gold);
    text-decoration: none;
}
@media (max-width: 640px) {
    .ov-subhead-inner { padding: 10px 16px; gap: 8px; }
    .ov-sh-series { font-size: 12.5px; }
}

/* ==========================================================================
   overseas 专有补丁 ①：全站页脚
   --------------------------------------------------------------------------
   页脚样式由 ../css/qgj-footer.css 提供（既有镜像，本板块直接引用未复制）。
   此处只补一条兼容规则：overseas.css 里有一条【元素级】footer{} 规则
     footer{background:var(--navy-deep);color:#cdd7e2;text-align:center;
            font-size:13px;padding:22px 20px}
   它比 .footer（0,1,0）特异性低，background/color/padding 会被覆盖，
   但 text-align 与 font-size 在 .footer 上未定义、会按级联生效，
   足以让页脚文字居中、字号偏小。用 footer.footer（0,1,1）钉死为全站口径。
   ========================================================================== */
footer.footer {
    background: #0f2540;
    color: rgba(255, 255, 255, 0.7);
    text-align: left;
    font-size: 1rem;
    line-height: 1.7;
    padding: 38px 0 18px;
}
@media (max-width: 768px) {
    footer.footer { padding: 30px 0 16px; }
}

/* ==========================================================================
   overseas 专有补丁 ②：双 sticky 叠放与锚点偏移
   --------------------------------------------------------------------------
   本板块现在有两条 sticky 条：全站导航栏（.navbar，top:0，高 56px）
   与系列页内目录（.ov-toc）。原 .ov-toc 也是 top:0，与导航栏重叠后
   会被导航栏（z-index 1000 > 20）盖住而不可见，故顺延到导航栏之下。
   同时补上锚点偏移，避免带 #hash 的跳转被两条粘性条遮住标题
   （对应 css/style.css 尾部的 [id]{scroll-margin-top:80px}）。
   ========================================================================== */
:root { --qgj-navbar-h: 56px; --qgj-toc-h: 50px; }
.ov-toc { top: var(--qgj-navbar-h); }
[id] { scroll-margin-top: calc(var(--qgj-navbar-h) + var(--qgj-toc-h) + 12px); }

@media (max-width: 640px) {
    /* 窄屏下 15 条目录链会折行到 300px 以上（实测 310px）。若继续吸顶，
       导航栏 56px + 目录 310px 会吃掉近半个手机屏幕（实测 844px 视口的 43%），
       且锚点跳转的标题会被目录完全盖住。故窄屏取消目录吸顶：
       目录仍在正文顶部完整可见、可点，只是随页面滚走，只留导航栏吸顶。
       --qgj-toc-h 归零后，上面 [id] 的 scroll-margin-top 自动收敛为 56+12=68px。 */
    .ov-toc { position: static; }
    :root { --qgj-toc-h: 0px; }
}

/* ==========================================================================
   overseas 专有补丁 ③：联系我们入口的去重与定位
   --------------------------------------------------------------------------
   js/qgj-contact.js 自带左下角常驻悬浮标（.qgj-contact-fab）。
   桌面端隐藏它、只保留导航栏右上角那个按钮 —— 这条规则在站内由
   css/style.css 末尾的 @media (min-width:1181px) 提供；本板块不加载
   style.css，故在此补齐，保持「桌面端只有一个联系我们入口」与全站一致。
   （实测：不补这条，桌面端会同时出现右上角按钮与左下角悬浮标。）

   卡片从导航栏按钮打开时的定位（.is-nav）本由 qgj-contact.js 自带，
   这里按 style.css 的口径补一条同值的 !important 覆盖；top 由 76px 调到
   112px —— 本板块在导航栏（56px）之下还多一条系列条（50px），
   76px 会让卡片压在系列条上。
   ========================================================================== */
@media (min-width: 1181px) {
    .qgj-contact-fab { display: none !important; }
}
.qgj-contact-card.is-nav {
    left: auto !important;
    right: 20px !important;
    bottom: auto !important;
    top: 112px !important;
}