/* ============================================================
   科临数据 · 全站统一深色 Navbar (2026-05-01)
   原 home-redesign-v3.css 的 nav 段落（FINAL-3 + NAV-RESET v9）
   迁移到独立文件，由 default.hbs 在所有页面加载，
   避免内页（about / insights / contact）保留旧的白色导航与首页深色冲突。
   ============================================================ */

/* ============================================================
   FINAL-3 — 跨页面统一 nav + 修顶部白线
   ============================================================ */

/* 1) 隐藏顶部那条白色滚动进度条容器（保留进度条本身但默认看不见） */
.site-scroll-progress {
    background: transparent !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
}
.site-header-shell.is-scrolled ~ .site-scroll-progress,
body.is-scrolled .site-scroll-progress {
    opacity: 1 !important;
}
.site-scroll-progress-bar {
    box-shadow: 0 0 8px rgba(37, 99, 235, 0.45) !important;
}

/* 2) 全站统一深色 navbar（不限定 .home-template） */
html body header.site-header-shell,
html body header.professional-glass {
    background: linear-gradient(180deg, rgba(10, 14, 21, 0.92) 0%, rgba(10, 14, 21, 0.72) 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
            backdrop-filter: blur(20px) saturate(140%) !important;
}
html body header.site-header-shell.is-scrolled,
html body header.professional-glass.is-scrolled,
html body .site-header-shell.is-scrolled,
html body .professional-glass.is-scrolled {
    background: linear-gradient(180deg, rgba(10, 14, 21, 0.96) 0%, rgba(10, 14, 21, 0.84) 100%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.5) !important;
}

/* 隐藏 site-header-shell::after 的蓝色装饰条（避免与底色冲突） */
html body header.site-header-shell::after,
html body .site-header-shell::after {
    display: none !important;
}

/* 3) Logo 反相（全站） */
html body .site-brand-link {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    opacity: 1 !important;
}
html body .site-brand-link img,
html body .site-brand-icon,
html body .site-brand-name {
    filter: brightness(0) invert(1) !important;
}

/* 4) 桌面 nav 链接（全站，白色） */
html body header .site-nav-desktop {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
html body header .site-nav-link {
    color: rgba(255, 255, 255, 0.86) !important;
    background: transparent !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em !important;
    padding: 0.5rem 0.85rem !important;
}
html body header .site-nav-link::before,
html body header .site-nav-link::after {
    display: none !important;
}
html body header .site-nav-link:hover,
html body header .site-nav-link.is-current {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border-radius: 8px !important;
}
/* 防止 Tailwind text-gray-700 / hover:bg-gray-100 在非首页生效 */
html body header .text-gray-700 { color: rgba(255, 255, 255, 0.86) !important; }
html body header .hover\:bg-gray-100:hover { background: rgba(255, 255, 255, 0.08) !important; }
html body header .hover\:text-blue-600:hover { color: #fff !important; }

/* 5) Hamburger 按钮（全站） */
html body header #mobileMenuButton,
html body header .site-nav-mobile-toggle,
html body .site-nav-mobile-toggle {
    color: #fff !important;
    background: var(--brand-500) !important;
    border: 1px solid var(--brand-400) !important;
    border-radius: 10px !important;
    padding: 0 0.75rem !important;
    height: 44px !important;
    min-width: 44px !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(20, 128, 225, 0.32) !important;
}
html body header #mobileMenuButton:hover,
html body header #mobileMenuButton:active,
html body header #mobileMenuButton.is-active,
html body header .site-nav-mobile-toggle:hover,
html body header .site-nav-mobile-toggle:active,
html body header .site-nav-mobile-toggle.is-active {
    background: var(--brand-600) !important;
    border-color: var(--brand-300) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(20, 128, 225, 0.45) !important;
}
html body header #mobileMenuButton svg,
html body header .site-nav-mobile-toggle svg {
    color: #fff !important;
    stroke: #fff !important;
    width: 22px !important;
    height: 22px !important;
}

/* 6) 非首页 site-main 顶部不要被 navbar 遮挡 */
html body:not(.home-template) main.site-main {
    margin-top: 72px !important;
}


/* ============================================================
   NAV-RESET v9 — 完整重构 (2026-05-01)
   - 用 ID 选择器 + 最强 class 链盖过所有冲突
   - Dropdown 改深色配合 navbar，不再白色突兀
   - Logo 完整显示，无 pill 无 inset 阴影
   - 全站统一
   ============================================================ */

/* —— 0. 隐藏顶部白色滚动进度条容器 + 蓝色装饰线 —— */
html body .site-scroll-progress {
    background: transparent !important;
    opacity: 0 !important;
}
html body .site-header-shell::after,
html body header.site-header-shell::after,
html body header.site-header-shell.is-scrolled::after {
    display: none !important;
    background: none !important;
    content: none !important;
}

/* —— 1. Navbar 底色 —— solid dark, 全站 —— */
html body header.site-header-shell,
html body.home-template header.site-header-shell,
html body header.professional-glass,
html body.home-template header.professional-glass {
    background: rgba(10, 14, 21, 0.94) !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
            backdrop-filter: blur(20px) saturate(140%) !important;
}
html body header.site-header-shell.is-scrolled,
html body.home-template header.site-header-shell.is-scrolled,
html body header.professional-glass.is-scrolled,
html body.home-template header.professional-glass.is-scrolled {
    background: rgba(10, 14, 21, 0.97) !important;
    border-bottom-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.5) !important;
}

/* —— 2. 移除 navbar 内所有 inset shadow + 不必要的 border —— */
html body header.site-header-shell *,
html body.home-template header.site-header-shell * {
    box-shadow: none;
}

/* —— 3. Logo —— 完整显示，无 pill 无内嵌阴影 —— */
html body header.site-header-shell .site-brand-link,
html body.home-template header.site-header-shell .site-brand-link,
html body.home-template .site-brand-link {
    position: relative !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    opacity: 1 !important;
    overflow: visible !important;
    height: 60px !important;
    display: inline-flex !important;
    align-items: center !important;
}
html body header.site-header-shell .site-brand-link::before,
html body header.site-header-shell .site-brand-link::after,
html body.home-template .site-brand-link::before,
html body.home-template .site-brand-link::after {
    display: none !important;
    content: none !important;
}
html body header.site-header-shell .site-brand-stack {
    height: 100% !important;
    gap: 0.65rem !important;
}
html body header.site-header-shell .site-brand-icon,
html body header.site-header-shell .site-brand-name,
html body.home-template .site-brand-icon,
html body.home-template .site-brand-name {
    filter: brightness(0) invert(1) !important;
    opacity: 0.96 !important;
    object-fit: contain !important;
    display: block !important;
}
html body header.site-header-shell .site-brand-icon {
    height: 100% !important;
    max-height: 56px !important;
    width: auto !important;
}
html body header.site-header-shell .site-brand-name {
    height: 100% !important;
    max-height: 44px !important;
    width: auto !important;
}

/* —— 4. 桌面端 nav 链接 —— 白色简洁，无装饰 —— */
html body header.site-header-shell .site-nav-desktop,
html body.home-template .site-nav-desktop {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}
html body header.site-header-shell .site-nav-link,
html body.home-template .site-nav-link {
    color: rgba(255, 255, 255, 0.82) !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em !important;
    padding: 0.55rem 0.85rem !important;
    border-radius: 8px !important;
    position: relative !important;
}
html body header.site-header-shell .site-nav-link::before,
html body header.site-header-shell .site-nav-link::after,
html body.home-template .site-nav-link::before,
html body.home-template .site-nav-link::after {
    display: none !important;
    background: none !important;
    box-shadow: none !important;
    content: none !important;
}
html body header.site-header-shell .site-nav-link:hover,
html body header.site-header-shell .site-nav-link.is-current,
html body.home-template .site-nav-link:hover,
html body.home-template .site-nav-link.is-current {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

/* 防止 Tailwind 类污染 */
html body header.site-header-shell .text-gray-700 {
    color: rgba(255, 255, 255, 0.82) !important;
}
html body header.site-header-shell .hover\:bg-gray-100:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}
html body header.site-header-shell .hover\:text-blue-600:hover {
    color: #fff !important;
}

/* —— 5. Hamburger 按钮 —— 用 ID 最高 specificity 兜底 —— */
html body header #mobileMenuButton,
html body header.site-header-shell #mobileMenuButton,
html body header.site-header-shell .site-nav-mobile-toggle,
html body.home-template .site-nav-mobile-toggle {
    color: #fff !important;
    background: var(--brand-500) !important;
    background-image: none !important;
    border: 1px solid var(--brand-400) !important;
    border-radius: 10px !important;
    padding: 0 0.75rem !important;
    height: 44px !important;
    min-width: 44px !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 12px rgba(20, 128, 225, 0.32) !important;
}
html body header #mobileMenuButton:hover,
html body header #mobileMenuButton.is-active,
html body header.site-header-shell #mobileMenuButton:hover,
html body header.site-header-shell #mobileMenuButton.is-active {
    background: var(--brand-600) !important;
    border-color: var(--brand-300) !important;
    box-shadow: 0 6px 18px rgba(20, 128, 225, 0.45) !important;
    transform: translateY(-1px);
}
html body header #mobileMenuButton svg,
html body header.site-header-shell #mobileMenuButton svg,
html body header.site-header-shell .site-nav-mobile-toggle svg {
    color: #fff !important;
    stroke: #fff !important;
    width: 22px !important;
    height: 22px !important;
}

/* —— 6. Mobile Dropdown —— 深色匹配 navbar (不再是白色) —— */
html body header #mobileMenu,
html body header .site-mobile-menu,
html body header .mobile-menu,
html body.home-template .site-mobile-menu {
    padding: 0.5rem 0.75rem max(1rem, env(safe-area-inset-bottom)) !important;
    background: transparent !important;
}
html body header #mobileMenu .professional-card,
html body header .site-mobile-menu .professional-card,
html body header .mobile-menu .professional-card,
html body.home-template .site-mobile-menu .professional-card {
    background: rgba(10, 14, 21, 0.98) !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 12px !important;
    padding: 0.4rem 0 !important;
    box-shadow:
        0 24px 48px rgba(0, 0, 0, 0.55),
        0 8px 20px rgba(0, 0, 0, 0.35) !important;
    -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
            backdrop-filter: blur(28px) saturate(140%) !important;
}
html body header #mobileMenu .professional-card a,
html body header .site-mobile-menu .site-nav-link,
html body header .mobile-menu a,
html body.home-template .site-mobile-menu .site-nav-link {
    color: rgba(255, 255, 255, 0.92) !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-weight: 500 !important;
    font-size: 0.98rem !important;
    letter-spacing: 0.01em !important;
    padding: 1rem 1.25rem !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    text-decoration: none !important;
    min-height: 48px !important;
    position: relative !important;
    transition: color 0.2s ease, padding-left 0.2s ease, background 0.2s ease !important;
}
html body header #mobileMenu .professional-card a::before,
html body header .site-mobile-menu .site-nav-link::before,
html body header .mobile-menu a::before,
html body.home-template .site-mobile-menu .site-nav-link::before {
    content: "" !important;
    position: absolute !important;
    left: 0.65rem !important;
    width: 4px !important;
    height: 4px !important;
    border-radius: 50% !important;
    background: var(--brand-400) !important;
    box-shadow: 0 0 8px var(--brand-400) !important;
    opacity: 0 !important;
    transform: scale(0.6) !important;
    transition: opacity 0.2s ease, transform 0.2s ease !important;
    margin: 0 !important;
}
html body header #mobileMenu .professional-card a:last-child,
html body header .site-mobile-menu .site-nav-link:last-child,
html body header .mobile-menu a:last-child {
    border-bottom: none !important;
}
html body header #mobileMenu .professional-card a:hover,
html body header #mobileMenu .professional-card a:focus,
html body header .site-mobile-menu .site-nav-link:hover,
html body header .site-mobile-menu .site-nav-link:focus,
html body header .mobile-menu a:hover,
html body header .mobile-menu a:focus,
html body.home-template .site-mobile-menu .site-nav-link:hover,
html body.home-template .site-mobile-menu .site-nav-link:focus {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.04) !important;
    padding-left: 1.85rem !important;
    outline: none !important;
}
html body header #mobileMenu .professional-card a:hover::before,
html body header #mobileMenu .professional-card a:focus::before,
html body header .site-mobile-menu .site-nav-link:hover::before,
html body header .site-mobile-menu .site-nav-link:focus::before,
html body header .mobile-menu a:hover::before,
html body header .mobile-menu a:focus::before {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* —— 7. 非首页 site-main margin (避免被 navbar 遮挡) —— */
html body:not(.home-template) main.site-main {
    margin-top: 72px !important;
}

/* —— 8. Desktop logo clarity —— */
@media (min-width: 900px) {
    html body header.site-header-shell .site-header-row {
        min-height: 86px !important;
    }
    html body header.site-header-shell .site-brand-link {
        height: 82px !important;
    }
    html body header.site-header-shell .site-brand-stack {
        gap: 0.62rem !important;
        align-items: center !important;
    }
    html body header.site-header-shell .site-brand-icon {
        width: 78px !important;
        height: 78px !important;
        max-width: 78px !important;
        max-height: 78px !important;
        opacity: 1 !important;
        filter: brightness(0) invert(1) contrast(1.12) !important;
        image-rendering: auto;
        transform: translate(6px, -3px) translateZ(0);
    }
    html body header.site-header-shell .site-brand-name {
        height: 48px !important;
        max-height: 48px !important;
        opacity: 1 !important;
        filter: brightness(0) invert(1) contrast(1.08) !important;
        image-rendering: auto;
        transform: translateZ(0);
    }
    html body:not(.home-template) main.site-main {
        margin-top: 86px !important;
    }
}