/* ===================================================================
   大成汇官网 · components.css
   导航 / Hero / 按钮 / 卡片 / 数据 / 页脚 / 加载 / 悬浮工具
   =================================================================== */

/* ---------- 加载序列 ---------- */
.boot-loader {
    position: fixed; inset: 0; z-index: 9999;
    background: var(--bg-cosmos);
    display: flex; align-items: center; justify-content: center;
    transition: opacity .6s ease, visibility .6s ease;
}
.boot-loader.done { opacity: 0; visibility: hidden; pointer-events: none; }
.boot-inner { text-align: center; }
.boot-ring {
    width: 90px; height: 90px; margin: 0 auto var(--sp-3);
    border: 2px solid color-mix(in srgb, var(--c-cyan) 15%, transparent);
    border-top-color: var(--c-cyan);
    border-right-color: var(--c-purple);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
.boot-logo {
    font-family: var(--font-en); font-size: 30px; font-weight: 900;
    letter-spacing: 2px; color: var(--text-primary);
}
.boot-logo span { color: var(--c-cyan); }
.boot-text {
    font-family: var(--font-en); font-size: 12px; letter-spacing: 3px;
    color: var(--c-cyan-soft); margin: var(--sp-2) 0 var(--sp-1);
}
.boot-sub {
    font-family: var(--font-en); font-size: 10px; letter-spacing: 2px;
    color: color-mix(in srgb, var(--c-cyan) 30%, transparent); height: 14px; margin-bottom: var(--sp-1);
    transition: opacity .3s;
}
.boot-bar { width: 200px; height: 3px; background: var(--glass-bg); border-radius: 2px; overflow: hidden; margin: 0 auto; }
.boot-bar span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--c-cyan), var(--c-purple)); transition: width .2s linear; }
.boot-percent {
    font-family: var(--font-en); font-size: 11px; letter-spacing: 2px;
    color: var(--c-cyan-soft); margin-top: 8px; opacity: 0;
    transition: opacity .3s;
}

/* ---------- 顶部导航 ---------- */
.nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
    transition: background .4s var(--ease-smooth), backdrop-filter .4s, border-color .4s;
    border-bottom: 1px solid transparent;
}
.nav.scrolled {
    background: var(--bg-drawer);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border-bottom: 1px solid var(--border-glass);
}
.nav-inner {
    position: relative;
    max-width: var(--maxw); margin: 0 auto; padding: 0 var(--sp-3);
    height: var(--nav-h); display: flex; align-items: center; gap: var(--sp-3);
}
.nav-logo { display: flex; align-items: center; gap: 12px; font-weight: 700; text-decoration: none; }
.logo-img {
    width: 44px; height: 44px; object-fit: contain;
    /* 海蓝发光：深底增强存在感（#40B8F0 · opacity 0.6） */
    filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c-cyan) 55%, transparent)) drop-shadow(0 0 20px color-mix(in srgb, var(--c-cyan) 25%, transparent));
    transition: transform .35s var(--ease-premium), filter .35s;
}
.nav-logo:hover .logo-img {
    transform: scale(1.08) rotate(-3deg);
    /* Hover 增强：更亮 + 更广的弥散光 */
    filter: drop-shadow(0 0 12px color-mix(in srgb, var(--c-cyan) 70%, transparent)) drop-shadow(0 0 28px color-mix(in srgb, var(--c-cyan) 35%, transparent));
}
.logo-wordmark { display: flex; flex-direction: column; gap: 2px; line-height: 1.1; }
.logo-name { font-size: 20px; font-weight: 700; color: var(--text-primary); letter-spacing: 0.5px; }
.logo-accent { color: var(--c-cyan); text-shadow: 0 0 12px color-mix(in srgb, var(--c-cyan) 50%, transparent); transition: text-shadow .35s; }
.logo-tag { font-family: var(--font-en); font-size: 10.5px; color: var(--text-dim); letter-spacing: 0.6px; }
.nav-logo:hover .logo-accent { text-shadow: 0 0 18px color-mix(in srgb, var(--c-cyan) 80%, transparent); }
.nav-links { display: flex; gap: var(--sp-3); margin-left: var(--sp-3); }
.nav-link { font-size: 15px; color: var(--text-secondary); position: relative; transition: color .3s; }
.nav-link::after {
    content: ""; position: absolute; left: 0; bottom: -6px; height: 2px; width: 0;
    background: linear-gradient(90deg, var(--c-cyan), var(--c-purple));
    transition: width .3s var(--ease-premium);
}
.nav-link:hover { color: var(--text-primary); }
.nav-link:hover::after { width: 100%; }
.nav-cta {
    padding: 10px 22px; border-radius: 30px; font-size: 14px; font-weight: 600;
    color: #04121a; background: linear-gradient(100deg, var(--c-cyan), var(--c-blue));
    box-shadow: 0 0 20px color-mix(in srgb, var(--c-cyan) 35%, transparent);
}
.nav-toggle { display: none; flex-direction: column; gap: 5px; padding: 8px; }
.nav-toggle span { width: 24px; height: 2px; background: var(--text-primary); border-radius: 2px; transition: .3s; }

/* ---------- 沉浸式 Hero 导航（通屏改造 v2） ---------- */
/* 默认透明悬浮在 Hero 上；hover 顶部 / 滚动后 出现深色毛玻璃背景条 */
body.has-hero .nav { border-bottom-color: transparent; }
/* 沉浸式 Hero 导航文字：随全局主题变化（暗色主题=浅色文字，亮色主题=深色文字），
   不再硬编码 #fff，避免亮色主题下文字被亮色遮罩/Hero 吞没而不可辨认 */
body.has-hero .logo-name { color: var(--text-primary); }
body.has-hero .logo-tag  { color: var(--text-dim); }
body.has-hero .nav-link  { color: var(--text-secondary); }
body.has-hero .nav-link:hover { color: var(--text-primary); }

body.has-hero .nav:hover,
body.has-hero .nav.nav-open,
body.has-hero .nav.scrolled {
    /* 遮罩随全局主题动态变化：暗色主题=深空玻璃，亮色主题=近白表面（与 --bg-drawer 一致），
       配合下方文字改用主题令牌，确保任何主题下滑时标题文字与遮罩保持高对比、不被吞没 */
    background: var(--bg-drawer);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border-bottom-color: var(--border-glass);
}

/* 右侧操作区：搜索图标 + 获取方案 + 汉堡 */
.nav-actions { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.nav-search-toggle {
    width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; color: var(--text-primary); border: 1px solid transparent;
    transition: background .25s, border-color .25s, color .25s;
}
body.has-hero .nav-search-toggle { color: var(--text-primary); }
.nav-search-toggle:hover { background: var(--surface-hover); border-color: var(--border-glass); }

/* mega-menu 导航大菜单（左列表 + 右图文预览） */
.nav-item { position: relative; }
.nav-item.has-mega > .nav-link::after { bottom: -10px; }
.nav-item.has-mega.mega-open > .nav-link::after { width: 100%; }
.nav-item.has-mega.mega-open > .nav-link { color: var(--c-cyan); }
/* 桌面端：隐藏每个导航项自带的本地 mega-menu（移动端使用） */
.nav-mega--local { display: none; }

/* 全局 mega-menu：外框固定在导航下方，hover 导航项只切换内容；左 30% 右 70% */
.nav-mega--global {
    position: absolute; top: calc(100% + 14px); left: 0; right: 0;
    width: 100%; padding: 18px 20px;
    display: grid; grid-template-columns: 24% 38% 38%; gap: 0;
    background: var(--bg-drawer);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border: 1px solid var(--border-glass); border-radius: var(--radius-lg);
    box-shadow: 0 24px 56px var(--drawer-shadow);
    opacity: 0; visibility: hidden; pointer-events: none; z-index: 1100;
    transform: translateY(-8px);
    transition: opacity .25s var(--ease-premium), transform .25s var(--ease-premium), visibility .25s;
}
/* 悬停桥接：填补 nav-link 与面板之间的 14px 缝隙，避免鼠标下移到面板途中触发隐藏 */
.nav-mega--global::before {
    content: ""; position: absolute; left: 0; right: 0; top: -18px; height: 18px;
}
.nav-mega--global.is-active {
    opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
}
.nm-list { display: flex; flex-direction: column; gap: 4px; grid-column: 1; grid-row: 1; }
.nm-item { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; text-decoration: none; border: 1px solid transparent; transition: background .2s, border-color .2s; }
.nm-item:hover, .nm-item.active { background: color-mix(in srgb, var(--c-cyan) 12%, transparent); border-color: color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.nmi-label { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.nmi-desc { font-size: 12px; color: var(--text-secondary); line-height: 1.45; }

/* 右侧图文预览面板 */
.nm-preview { position: relative; grid-column: 2 / 4; }  /* 非分组态：跨右两栏填满 */
.nav-mega--global.is-grouped .nm-preview { grid-column: 3; }
.nav-mega--global.is-grouped .nm-children { grid-column: 2; display: flex; }
.nm-preview-inner {
    position: sticky; top: 0; display: flex; flex-direction: column; height: 100%;
    background: linear-gradient(160deg, color-mix(in srgb, var(--c-cyan) 10%, transparent), color-mix(in srgb, var(--c-purple) 8%, transparent));
    border: 1px solid var(--border-glass); border-radius: var(--radius-md); overflow: hidden;
}
.nm-preview-media { position: relative; aspect-ratio: 16 / 9; background: var(--glass-bg); overflow: hidden; }
.nm-preview-img { width: 100%; height: 100%; object-fit: cover; display: none; }
.nm-preview-img.show { display: block; }
.nm-preview-ph {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    background:
      radial-gradient(120px 80px at 30% 30%, color-mix(in srgb, var(--c-cyan) 25%, transparent), transparent 70%),
      radial-gradient(140px 100px at 75% 70%, color-mix(in srgb, var(--c-purple) 22%, transparent), transparent 70%),
      var(--bg-drawer);
}
.nm-preview-ph.hide { display: none; }
.nm-preview-ph svg { width: 54px; height: 54px; opacity: .5; color: var(--c-cyan); }
.nm-preview-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.nm-preview-title { margin: 0; font-size: 18px; font-weight: 700; color: var(--text-primary); }
.nm-preview-desc { margin: 0; font-size: 13px; line-height: 1.6; color: var(--text-secondary); flex: 1; }
.nm-preview-link {
    align-self: flex-start; font-size: 13px; font-weight: 600; color: var(--c-cyan); text-decoration: none;
    display: inline-flex; align-items: center; gap: 6px; transition: gap .2s;
}
.nm-preview-link:hover { gap: 10px; }

/* mega 分组态：右侧 L3 业务矩阵网格（与单图预览同处第 2 列） */
.nm-children { display: none; grid-row: 1; flex-direction: column; gap: 4px; align-content: start; max-height: 480px; overflow: auto; padding-right: 4px; }
.nm-child {
    display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 10px;
    text-decoration: none; border: 1px solid transparent; transition: background .2s, border-color .2s;
}
.nm-child:hover { background: color-mix(in srgb, var(--c-cyan) 12%, transparent); border-color: color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.nm-child__icon { font-size: 18px; line-height: 1.3; color: var(--c-cyan); flex: none; }
.nm-child__body { display: flex; flex-direction: column; gap: 2px; }
.nm-child__title { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.nm-child__desc { font-size: 12px; color: var(--text-secondary); line-height: 1.45; }

/* 解决方案频道：面包屑（Hero 内） */
.hero-breadcrumb {
    position: relative; z-index: 2; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 14px 0 0; font-size: 13px; color: color-mix(in srgb, var(--text-primary) 80%, transparent);
}
.hero-breadcrumb a { color: color-mix(in srgb, var(--text-primary) 80%, transparent); text-decoration: none; }
.hero-breadcrumb a:hover { color: var(--c-cyan); }
.hero-breadcrumb .sep { opacity: .5; }
.hero-breadcrumb .cur { color: var(--c-cyan); font-weight: 600; }

/* L3 详情页：现代商务风正文 960px 居中（覆盖 .container 的 1440 宽度） */
.container.solution-article { max-width: 960px; }
.solution-article .about-text { font-size: 16px; line-height: 1.8; color: var(--text-primary); }
.solution-article blockquote { border-left: 4px solid var(--c-cyan); background: #F5F7FA; padding: 12px 16px; border-radius: 0 8px 8px 0; margin: 16px 0; color: var(--text-secondary); }

/* L2 结构页：动态文章网格 */
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.article-card { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radius-md); text-decoration: none; color: inherit; }
.article-thumb { position: relative; aspect-ratio: 16 / 9; background: var(--glass-bg); overflow: hidden; }
.article-thumb img { width: 100%; height: 100%; object-fit: cover; }
.article-thumb-ph { position: absolute; inset: 0; background: linear-gradient(135deg, color-mix(in srgb, var(--c-cyan) 18%, transparent), color-mix(in srgb, var(--c-purple) 16%, transparent)); }
.article-type { position: absolute; left: 10px; top: 10px; font-size: 12px; font-weight: 600; color: #fff; background: color-mix(in srgb, var(--c-cyan) 75%, #000); padding: 2px 8px; border-radius: 999px; }
.article-body { padding: 12px 14px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.article-title { margin: 0; font-size: 16px; font-weight: 600; color: var(--text-primary); line-height: 1.5; }
.article-meta { font-size: 12px; color: var(--text-secondary); }
.section-more { margin-top: 24px; text-align: center; }

/* L3 详情页：相关案例 / 资讯 */
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.similar-card-cover { aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--radius-sm); margin-bottom: 10px; }
.similar-card-cover img { width: 100%; height: 100%; object-fit: cover; }
.news-list { display: flex; flex-direction: column; border-top: 1px solid var(--border-glass); }
.news-list-item { display: flex; align-items: center; gap: 14px; padding: 14px 4px; border-bottom: 1px solid var(--border-glass); text-decoration: none; color: var(--text-primary); transition: color .2s; }
.news-list-item:hover { color: var(--c-cyan); }
.news-list-date { font-size: 13px; color: var(--text-secondary); flex: none; width: 96px; }
.news-list-title { flex: 1; font-size: 15px; }
.news-list-arrow { color: var(--c-cyan); }

/* 解决方案总览（L1）：按 L2 分组 */
.matrix-group { margin-bottom: 48px; }
.matrix-group__head { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.matrix-group__title { margin: 0; font-size: 22px; font-weight: 700; }
.matrix-group__title a { color: var(--text-primary); text-decoration: none; }
.matrix-group__title a:hover { color: var(--c-cyan); }
.matrix-group__title .arrow { font-size: 16px; color: var(--c-cyan); }
.matrix-group__desc { margin: 0; font-size: 14px; color: var(--text-secondary); }

@media (max-width: 900px) {
    .article-grid, .related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .article-grid, .related-grid { grid-template-columns: 1fr; }
    .nm-children { grid-template-columns: 1fr; }
}

/* 搜索滑出面板 */
.search-panel {
    position: fixed; top: 0; left: 0; width: 100%; z-index: 1200;
    background: var(--bg-drawer);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-bottom: 1px solid var(--border-glass);
    transform: translateY(-100%);
    transition: transform .4s var(--ease-premium);
}
.search-panel.open { transform: translateY(0); }
.search-form { position: relative; max-width: var(--maxw); margin: 0 auto; padding: 22px var(--sp-3); display: flex; gap: 12px; align-items: center; }
.search-form input[type="search"] {
    flex: 1; height: 52px; padding: 0 20px; font-size: 16px; color: var(--text-primary);
    background: var(--glass-bg); border: 1px solid var(--border-glass); border-radius: 12px; outline: none;
    transition: border-color .25s;
}
.search-form input[type="search"]::placeholder { color: var(--text-dim); }
.search-form input[type="search"]:focus { border-color: var(--c-cyan); }
.search-submit {
    height: 52px; padding: 0 28px; border-radius: 12px; font-size: 15px; font-weight: 600; color: #04121a;
    background: linear-gradient(100deg, var(--c-cyan), var(--c-blue)); cursor: pointer; white-space: nowrap;
}
.search-close {
    position: absolute; right: var(--sp-3); top: 50%; transform: translateY(-50%);
    width: 40px; height: 40px; font-size: 24px; color: var(--text-secondary); border-radius: 50%;
}
.search-close:hover { color: var(--text-primary); background: var(--surface-hover); }

/* ---------- Hero 首屏 ---------- */
.hero {
    --hero-accent: var(--c-cyan);
    --hero-accent-2: var(--c-purple);
    position: relative; min-height: 100vh; display: flex; align-items: center;
    overflow: hidden; padding: 120px 0 80px;
}
.hero-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.hero-grid {
    position: absolute; left: 0; right: 0; bottom: 0; height: 45%; z-index: 1;
    background-image:
        linear-gradient(color-mix(in srgb, var(--c-cyan) 12%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--c-cyan) 12%, transparent) 1px, transparent 1px);
    background-size: 60px 60px;
    transform: perspective(420px) rotateX(62deg);
    transform-origin: bottom center;
    mask-image: linear-gradient(to top, #000 0%, transparent 90%);
    -webkit-mask-image: linear-gradient(to top, #000 0%, transparent 90%);
    opacity: .5;
}
.hero-scan {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, color-mix(in srgb, var(--c-cyan) 2.5%, transparent) 4px);
}
.hero-content { position: relative; z-index: 2; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--sp-3); width: 100%; }
.hero-badge {
    display: inline-block; font-family: var(--font-en); font-size: 13px; letter-spacing: 2px;
    color: var(--c-contrast); padding: 8px 18px; border-radius: 30px;
    border: 1px solid hsl(22 90% 62% / .5); background: hsl(22 90% 62% / .08);
    margin-bottom: var(--sp-3);
}
.hero-title { font-family: var(--font-en); font-size: clamp(48px, 9vw, 104px); font-weight: 900; line-height: 1.05; letter-spacing: 2px; }
.hero-title .line { display: block; }
.hero .gradient-text {
    background: linear-gradient(100deg, var(--hero-accent) 0%, var(--hero-accent-2) 100%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}
.hero-sub { margin: var(--sp-3) 0 var(--sp-4); color: var(--text-secondary); font-size: clamp(15px, 2vw, 19px); font-family: var(--font-en); letter-spacing: 1px; }
.hero-sub br { display: block; margin: 4px 0; }
.hero-actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.hero-scroll {
    position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); z-index: 2;
    text-align: center; color: var(--text-secondary); font-size: 12px; letter-spacing: 2px;
}
.scroll-arrow { display: block; width: 2px; height: 28px; margin: 10px auto 0; background: linear-gradient(var(--hero-accent), transparent); animation: scrollPulse 1.8s infinite; }

/* Hero 全屏轮播（carousel 模式：后台切换粒子 → 实景轮播图） */
.hero-carousel { position: absolute; inset: 0; z-index: 0; }
.hc-slide {
    position: absolute; inset: 0; background-size: cover; background-position: center;
    opacity: 0; transition: opacity 1.2s var(--ease-smooth);
}
.hc-slide.active { opacity: 1; }
.hc-slide::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, color-mix(in srgb, var(--bg-cosmos) 80%, transparent) 0%, color-mix(in srgb, var(--bg-cosmos) 42%, transparent) 48%, color-mix(in srgb, var(--bg-cosmos) 12%, transparent) 100%);
}
.hc-dots { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); z-index: 3; display: flex; gap: 10px; }
.hc-dots .dot { width: 10px; height: 10px; border-radius: 50%; background: var(--glass-bg); cursor: pointer; transition: background .3s, width .3s; }
.hc-dots .dot.active { background: var(--c-cyan); width: 26px; border-radius: 6px; }
.hero[data-hero-mode="carousel"] .hero-canvas { display: none; }

/* ---------- 按钮 ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 14px 32px; border-radius: 30px; font-size: 15px; font-weight: 600;
    transition: transform .3s var(--ease-premium), box-shadow .3s, background .3s;
    will-change: transform;
}
.btn-primary {
    color: #04121a; background: linear-gradient(100deg, var(--c-cyan), var(--c-blue));
    box-shadow: 0 0 24px color-mix(in srgb, var(--c-cyan) 40%, transparent);
}
.btn-primary:hover { box-shadow: 0 0 36px color-mix(in srgb, var(--c-cyan) 65%, transparent); }
.btn-primary:active { transform: translateY(2px) scale(0.98); box-shadow: 0 0 14px color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.btn:disabled { opacity: .65; cursor: not-allowed; }
.btn-ghost {
    color: var(--text-primary); border: 1px solid var(--border-glow);
    background: color-mix(in srgb, var(--c-cyan) 5%, transparent);
}
.btn-ghost:hover { background: color-mix(in srgb, var(--c-cyan) 12%, transparent); border-color: var(--c-cyan); }

/* ---------- 数据速览 ---------- */
.stats { padding: var(--sp-5) 0; position: relative; z-index: 3; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-3); }
.stat-card { padding: var(--sp-4) var(--sp-3); text-align: center; }
.stat-num {
    font-family: var(--font-en); font-size: clamp(34px, 5vw, 54px); font-weight: 900;
    background: linear-gradient(100deg, var(--c-cyan), var(--c-purple));
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
    line-height: 1;
}
.stat-label { color: var(--text-secondary); margin-top: var(--sp-1); font-size: 14px; }

/* ---------- 每日一言 ---------- */
.daily-quote { padding: var(--sp-4) 0; }
.quote-bar {
    display: flex; align-items: center; gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-lg);
    border-left: 3px solid var(--c-cyan);
    max-width: 860px; margin: 0 auto;
}
.quote-icon {
    font-size: 28px; color: var(--c-cyan);
    text-shadow: 0 0 16px color-mix(in srgb, var(--c-cyan) 40%, transparent);
    line-height: 1; animation: float 3s ease-in-out infinite;
}
.quote-text {
    font-size: 15px; color: var(--text-primary);
    letter-spacing: 0.5px; line-height: 1.6;
    font-style: italic;
}

/* ---------- 关于大成汇（首页简介） ---------- */
.about-intro { padding: var(--sp-7) 0; }
.about-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: var(--sp-5);
    align-items: start;
}
.about-text .section-tag { margin-bottom: var(--sp-2); }
.about-text .section-title { margin-bottom: var(--sp-3); }
.about-lead {
    font-size: 17px; color: var(--text-primary); line-height: 1.8;
    margin-bottom: var(--sp-3);
}
.about-text p {
    color: var(--text-secondary); line-height: 1.9;
    margin-bottom: var(--sp-3); font-size: 15px;
}
.about-text strong { color: var(--c-cyan); }
.about-vision {
    padding: var(--sp-4); border-radius: var(--radius-lg);
    position: sticky; top: 92px;
}
.about-vision h3 {
    font-size: 18px; margin-bottom: var(--sp-3);
    background: linear-gradient(90deg, var(--c-cyan), var(--c-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.culture-items { display: flex; flex-direction: column; gap: var(--sp-3); }
.culture-item {
    display: flex; gap: var(--sp-2); align-items: flex-start;
}
.culture-icon {
    font-size: 24px; line-height: 1;
    filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c-cyan) 40%, transparent));
    flex-shrink: 0; margin-top: 2px;
}
.culture-item strong {
    display: block; font-size: 15px; color: var(--text-primary); margin-bottom: 4px;
}
.culture-item p {
    font-size: 13px; color: var(--text-secondary); line-height: 1.7;
    margin: 0;
}

/* ---------- 业务矩阵 ---------- */
.biz-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-3); }
.biz-card {
    padding: var(--sp-3); border-radius: var(--radius-md);
    transition: transform .4s var(--ease-premium), border-color .4s, box-shadow .4s;
    position: relative; overflow: hidden;
}
.biz-card::before {
    content: ""; position: absolute; inset: 0; border-radius: inherit;
    background: radial-gradient(400px circle at var(--mx,50%) var(--my,0%), color-mix(in srgb, var(--c-cyan) 12%, transparent), transparent 45%);
    opacity: 0; transition: opacity .4s;
}
.biz-card:hover { transform: translateY(-6px); border-color: var(--border-glow); box-shadow: 0 12px 40px color-mix(in srgb, var(--c-cyan) 18%, transparent); }
.biz-card:hover::before { opacity: 1; }
.biz-icon {
    display: inline-flex; width: 52px; height: 52px; align-items: center; justify-content: center;
    font-size: 24px; border-radius: 14px; margin-bottom: var(--sp-2);
    background: color-mix(in srgb, var(--c-cyan) 10%, transparent); color: var(--c-cyan);
    box-shadow: inset 0 0 16px color-mix(in srgb, var(--c-cyan) 15%, transparent);
}
.biz-icon svg { width: 26px; height: 26px; display: block; }
.biz-card h3 { font-size: 18px; margin-bottom: 6px; }
.biz-card p { color: var(--text-secondary); font-size: 13.5px; line-height: 1.6; }

/* ---------- 解决方案 ---------- */
.sol-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
.sol-card { overflow: hidden; border-radius: var(--radius-lg); transition: transform .4s var(--ease-premium), box-shadow .4s; }
.sol-card:hover { transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0,0,0,0.45); }
.sol-img { height: 190px; position: relative; overflow: hidden; }
.sol-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--bg-cosmos) 62%, transparent)); }
.sol-img-1 { background: linear-gradient(135deg, #0e7490, #155e75), radial-gradient(circle at 70% 30%, color-mix(in srgb, var(--c-cyan) 50%, transparent), transparent 50%); background-blend-mode: screen; }
.sol-img-2 { background: linear-gradient(135deg, #4338ca, #1e3a8a), radial-gradient(circle at 30% 70%, color-mix(in srgb, var(--c-purple) 50%, transparent), transparent 50%); background-blend-mode: screen; }
.sol-img-3 { background: linear-gradient(135deg, #047857, #065f46), radial-gradient(circle at 60% 40%, rgba(16,185,129,0.5), transparent 50%); background-blend-mode: screen; }
.sol-body { padding: var(--sp-3); }
.sol-cat { font-family: var(--font-en); font-size: 12px; letter-spacing: 2px; color: var(--c-cyan); }
.sol-body h3 { font-size: 20px; margin: 8px 0; }
.sol-body p { color: var(--text-secondary); font-size: 14px; margin-bottom: var(--sp-2); }
.sol-more { color: var(--c-cyan-soft); font-size: 14px; font-weight: 600; }

/* ---------- 案例 ---------- */
.case-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-3); }
.case-card { overflow: hidden; border-radius: var(--radius-lg); transition: transform .4s var(--ease-premium), box-shadow .4s; }
.case-card:hover { transform: translateY(-8px); box-shadow: 0 20px 50px color-mix(in srgb, var(--c-cyan) 15%, transparent); }
.case-img { height: 200px; }
.case-img-1 { background: linear-gradient(135deg, #0e7490, #1e3a8a); }
.case-img-2 { background: linear-gradient(135deg, #4338ca, #155e75); }
.case-img-3 { background: linear-gradient(135deg, #047857, #0e7490); }
.case-meta { padding: var(--sp-3); }
.case-tag { display: inline-block; font-size: 12px; color: var(--c-cyan-soft); border: 1px solid var(--border-glow); padding: 3px 12px; border-radius: 20px; margin-bottom: 10px; }
.case-meta h3 { font-size: 18px; margin-bottom: 6px; }
.case-meta p { color: var(--text-secondary); font-size: 13.5px; }

/* ---------- 相似内容推荐（SS-04） ---------- */
.similar-section { padding: var(--sp-6) 0 var(--sp-4); }
.similar-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--sp-4); }
.similar-card {
    background: var(--glass-bg, rgba(255,255,255,0.04)); border: 1px solid var(--glass-border, rgba(255,255,255,0.08));
    border-radius: var(--radius-lg, 12px); padding: var(--sp-4); transition: transform .25s, border-color .25s;
    text-decoration: none; color: inherit; display: block;
}
.similar-card:hover { transform: translateY(-4px); border-color: var(--accent, #40b8f0); }
.similar-card-title { font-size: 1rem; font-weight: 600; margin-bottom: var(--sp-1); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.similar-card-desc { font-size: .85rem; opacity: .7; margin-bottom: var(--sp-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.similar-card-meta { font-size: .78rem; opacity: .5; display: flex; gap: var(--sp-2); flex-wrap: wrap; align-items: center; }
.similar-card-tags { display: flex; gap: var(--sp-1); flex-wrap: wrap; margin-top: var(--sp-2); }
.similar-card-tag { font-size: .72rem; padding: 1px 8px; border-radius: 99px; background: color-mix(in srgb, var(--c-cyan) 12%, transparent); color: var(--accent, #40b8f0); }

/* 精选导读 · 图文混排（mixed）布局 */
.featured-mixed { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--sp-4); align-items: stretch; }
.fm-hero { display: flex; flex-direction: column; overflow: hidden; }
.fm-hero-cover { aspect-ratio: 16 / 9; overflow: hidden; }
.fm-hero-cover img { width: 100%; height: 100%; object-fit: cover; }
.fm-hero-body { padding: var(--sp-4); }
.fm-hero-kind { font-size: .72rem; color: var(--accent, #40b8f0); text-transform: uppercase; letter-spacing: 1px; }
.fm-hero-body h3 { font-size: 1.3rem; margin: 6px 0; line-height: 1.4; }
.fm-hero-body p { opacity: .7; font-size: .9rem; margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fm-hero-date { font-size: .78rem; opacity: .5; }
.fm-side { display: flex; flex-direction: column; }
.fm-side-item { display: flex; align-items: center; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--border-glass); text-decoration: none; color: var(--text-primary); transition: color .2s; }
.fm-side-item:hover { color: var(--c-cyan); }
.fm-side-date { font-size: 13px; color: var(--text-secondary); flex: none; width: 84px; }
.fm-side-title { flex: 1; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fm-side-arrow { color: var(--c-cyan); }
@media (max-width: 768px) { .featured-mixed { grid-template-columns: 1fr; } }

/* 后台 · 文章布局人工精选勾选器 */
.art-manual-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; max-height: 420px; overflow: auto; padding: 2px; }
.art-manual-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--glass-border); border-radius: 8px; background: rgba(255,255,255,.03); cursor: pointer; font-size: 13px; }
.art-manual-item input { flex: none; }
.art-manual-cover { width: 40px; height: 30px; object-fit: cover; border-radius: 4px; flex: none; }
.art-manual-kind { font-size: 11px; color: var(--accent, #40b8f0); flex: none; }
.art-manual-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- CTA ---------- */
.cta { padding: var(--sp-7) 0; position: relative; overflow: hidden; }
.cta-glow {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
    width: 700px; height: 700px; border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--c-cyan) 18%, transparent), transparent 60%);
    filter: blur(40px); pointer-events: none;
}
.cta-inner { position: relative; z-index: 2; text-align: center; }
.cta-inner h2 { font-size: clamp(26px, 4vw, 40px); margin-bottom: var(--sp-4); }
.cta-actions { display: flex; gap: var(--sp-2); justify-content: center; flex-wrap: wrap; }

/* ---------- 页脚 ---------- */
.footer { border-top: 1px solid var(--border-glass); padding: var(--sp-6) 0 12px; background: var(--bg-drawer); }
.footer-inner { display: grid; grid-template-columns: 1.3fr 0.9fr 1fr 1.4fr; gap: var(--sp-4); }
.footer-logo { font-size: 22px; font-weight: 700; margin-bottom: var(--sp-2); display: flex; align-items: center; gap: 10px; }
.footer-logo-img { width: 40px; height: 40px; object-fit: contain; filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c-cyan) 45%, transparent)); }
.footer-desc { color: var(--text-secondary); font-size: 14px; line-height: 1.7; }
.footer-col h4 { font-size: 15px; margin-bottom: var(--sp-2); color: var(--text-primary); }
.footer-col a, .footer-col p { display: block; color: var(--text-secondary); font-size: 14px; margin-bottom: 10px; transition: color .3s; }
.footer-col a:hover { color: var(--c-cyan); }
.footer-col a.active { color: var(--c-cyan); font-weight: 600; }
/* 联系方式增强 */
.footer-contact p { display: flex; align-items: flex-start; gap: 8px; line-height: 1.6; }
.footer-contact span { flex-shrink: 0; width: 18px; text-align: center; }
.footer-bottom {
    max-width: var(--maxw); margin: 8px auto 0; padding: 14px var(--sp-3) 16px;
    border-top: 1px solid var(--border-glass);
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    color: var(--text-dim); font-size: 13px;
}
.fb-copyright {
    font-weight: 600; color: var(--text-secondary); letter-spacing: .3px;
}
.fb-links {
    display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: center;
    color: var(--text-dim);
}
.fb-links a { color: var(--text-dim); transition: color .25s; }
.fb-links a:hover { color: var(--c-cyan); }
.fb-link-btn {
    appearance: none;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    color: var(--text-dim);
    cursor: pointer;
    transition: color .25s;
}
.fb-link-btn:hover { color: var(--c-cyan); }
.fb-sep { opacity: .4; user-select: none; }
.footer-bottom .icp-link { color: var(--text-dim); transition: color .3s; }
.footer-bottom .icp-link:hover { color: var(--c-cyan); }

/* 服务器时间（公历 + 农历） */
.footer-server-time {
    max-width: var(--maxw); margin: 8px auto 0; padding: 8px var(--sp-3);
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 24px;
    color: var(--text-secondary); font-size: 13px; text-align: center;
    font-family: var(--font-en); letter-spacing: .5px;
}
.server-time-line { display: inline-flex; align-items: center; gap: 8px; }
.server-time-line b { color: var(--c-cyan); font-weight: 600; }
.server-time-line .st-clock { color: var(--c-cyan); font-variant-numeric: tabular-nums; min-width: 64px; }
.server-time-sep { color: var(--border-glass); opacity: .6; }

/* 底部滚动文言（行业格言轮播） */
.footer-marquee {
    position: relative; overflow: hidden;
    max-width: var(--maxw); margin: 16px auto 8px; padding: 14px 0;
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.marquee-track {
    display: flex; gap: 56px; width: max-content;
    animation: marqueeScroll 50s linear infinite;
}
.marquee-track span {
    white-space: nowrap; color: var(--text-secondary); font-size: 13px; opacity: .85;
    position: relative;
}
.marquee-track span::before {
    content: "◆"; margin-right: 14px; color: var(--c-cyan); opacity: .5; font-size: 10px;
}
.footer-marquee:hover .marquee-track { animation-play-state: paused; }
@keyframes marqueeScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ICP 备案官方查询链接 */
.icp-link { color: var(--text-dim); transition: color .25s; }
.icp-link:hover { color: var(--c-cyan); }

/* ---------- 侧边悬浮工具 ---------- */
/* 统一悬浮图标栈：右下角五个图标（AI 助手/联系/电话/主题/回到顶部）共用的容器，
   垂直 flex 排列 + 12px 等间距；主题图标通过 JS 增删 DOM 实现显隐，
   其余图标由 flex 自动等距重排（4 或 5 个均对齐）。 */
.float-stack {
    position: fixed; right: 20px;
    bottom: calc(var(--consent-bar-height, 0px) + 24px);
    z-index: 9000;
    display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
    transition: bottom .35s ease;
}
/* 兼容旧标记：若仍用 .side-tools 包裹，则将其子项提升为栈的直接 flex 子项 */
.side-tools { display: contents; }

/* ---------- 前台 Cookie 合规同意吸底横幅 ---------- */
.consent-banner {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 9400;
    display: flex; justify-content: center;
    padding: 0;
    background: var(--bg-drawer); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid var(--border-glass);
    box-shadow: 0 -8px 34px rgba(0, 0, 0, .38);
    transform: translateY(100%);
    opacity: 0; visibility: hidden;
    transition: transform .4s var(--ease-premium), opacity .4s, visibility .4s;
}
.consent-banner[hidden] { display: none; }
.consent-banner.is-visible { transform: translateY(0); opacity: 1; visibility: visible; }
.consent-banner .cb-inner {
    width: 100%; max-width: var(--maxw);
    display: flex; align-items: center; gap: var(--sp-4);
    margin: 0 auto; padding: var(--sp-3);
}
.consent-banner .cb-text { flex: 1 1 auto; min-width: 0; }
.consent-banner .cb-desc {
    margin: 0; font-size: 13px; line-height: 1.7; color: var(--text-secondary);
}
.consent-banner .cb-desc a { color: var(--c-cyan); text-decoration: underline; text-underline-offset: 2px; }
.consent-banner .cb-desc a:hover { color: var(--c-cyan-soft); }
.consent-banner .cb-actions {
    flex: 0 0 auto; display: flex; align-items: center; gap: 10px;
}
.consent-banner .cb-btn { white-space: nowrap; }

/* ---------- Cookie 设置面板（吸底条「Cookie 设置」展开，复刻老版选项卡） ---------- */
.cookie-settings-panel {
    position: fixed; inset: 0; z-index: 9600;
    display: flex; align-items: center; justify-content: center;
    padding: var(--sp-3);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .35s var(--ease-smooth), visibility .35s;
}
/* 不使用 display:none 切换显隐：display:none↔flex 与子元素 backdrop-filter 配合会触发
   合成层重绘 bug（典型症状：弹窗内容显示不全，需切到其它窗口再切回才完整出现）。
   改为始终保留在渲染树中，仅用 visibility/opacity/pointer-events 控制显隐即可规避。 */
.cookie-settings-panel.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.cookie-settings-panel .csp-backdrop {
    position: absolute; inset: 0;
    background: color-mix(in srgb, var(--bg-drawer) 65%, transparent);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.cookie-settings-panel .csp-card {
    position: relative;
    width: 100%;
    max-width: 1080px;            /* 宽屏 16:9 */
    aspect-ratio: 16 / 9;
    max-height: 86vh; min-height: 540px;
    display: flex; flex-direction: column;
    padding: var(--sp-4) var(--sp-5) var(--sp-4);
    background: var(--bg-drawer); /* 与全局模态一致的不透明底 */
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-lg);
    box-shadow:
        0 40px 90px -20px rgba(0,0,0,.55),
        0 14px 32px -10px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    transform: translateY(16px) scale(.96);
    transition: transform .4s var(--ease-premium), opacity .4s;
}
.cookie-settings-panel.is-open .csp-card { transform: translateY(0) scale(1); }
/* 标题区：标题 + 副标题一行 */
.cookie-settings-panel .csp-header {
    display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3);
    margin-bottom: var(--sp-2); padding-bottom: var(--sp-2);
    border-bottom: 1px solid var(--border-glass);
    flex: 0 0 auto;
}
.cookie-settings-panel .csp-title {
    margin: 0;
    font-size: 18px; font-weight: 700;
    color: var(--text-primary);
    letter-spacing: .02em;
}
.cookie-settings-panel .csp-subtitle {
    margin: 0;
    font-size: 12px; color: var(--text-dim);
    white-space: nowrap;
}
/* 上下布局：tabs 顶部横排 + 内容在下方 */
.cookie-settings-panel .csp-body {
    flex: 1 1 auto; min-height: 0;
    display: flex; flex-direction: column; gap: var(--sp-2);
}
/* 顶部横排 tabs */
.cookie-settings-panel .csp-tabs {
    flex: 0 0 auto;
    display: flex; flex-direction: row; gap: 4px; flex-wrap: wrap;
    border-bottom: 1px solid var(--border-glass);
    border-right: none;
    padding: 0 0 var(--sp-1) 0;
    margin-bottom: 0;
    overflow-y: visible;
}
.cookie-settings-panel .csp-tab {
    appearance: none; background: transparent; border: none;
    padding: 7px 12px; cursor: pointer;
    font-size: 13px; font-weight: 600; color: var(--text-tertiary);
    border-left: none;
    border-bottom: 2px solid transparent; margin-bottom: -1px;
    border-radius: 0;
    text-align: left;
    white-space: nowrap;
    transition: color .2s, border-color .2s;
}
.cookie-settings-panel .csp-tab:hover { color: var(--text-secondary); background: transparent; }
.cookie-settings-panel .csp-tab.is-active {
    color: var(--c-cyan);
    border-bottom-color: var(--c-cyan);
    border-left-color: transparent;
    background: transparent;
}
/* 下方内容区 */
.cookie-settings-panel .csp-panels {
    flex: 1 1 auto; min-height: 0; overflow-y: auto;
    padding: var(--sp-1) var(--sp-1);
}
.cookie-settings-panel .csp-panel { display: none; }
.cookie-settings-panel .csp-panel.is-active { display: block; }
.cookie-settings-panel .csp-cat-desc {
    font-size: 13.5px; line-height: 1.75; color: var(--text-secondary); margin: 0 0 14px;
}
.cookie-settings-panel .csp-cat-desc strong { color: var(--text-primary); }
.cookie-settings-panel .csp-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border-glass); border-radius: var(--radius-md);
    background: var(--bg-elevated);
}
.cookie-settings-panel .csp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.cookie-settings-panel .csp-table thead th {
    background: rgba(255,255,255,.03); color: var(--text-dim);
    font-weight: 600; font-size: 12px; letter-spacing: .04em; text-align: left;
    padding: 10px 14px; border-bottom: 1px solid var(--border-glass); white-space: nowrap;
}
.cookie-settings-panel .csp-table tbody td {
    padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,.04);
    color: var(--text-secondary); vertical-align: top; line-height: 1.6;
}
.cookie-settings-panel .csp-table tbody tr:last-child td { border-bottom: none; }
.cookie-settings-panel .csp-table tbody tr:hover td { background: rgba(64,184,240,.03); }
.cookie-settings-panel .csp-name {
    font-family: var(--font-en), 'SF Mono', Consolas, monospace;
    font-size: 12.5px; color: var(--c-cyan); white-space: nowrap;
}
.cookie-settings-panel .csp-life { white-space: nowrap; font-size: 12.5px; color: var(--text-dim); }
.cookie-settings-panel .csp-footer {
    display: flex; gap: 12px; justify-content: flex-end;
    margin-top: var(--sp-4); padding-top: var(--sp-3);
    border-top: 1px solid var(--border-glass);
    flex: 0 0 auto;
}
@media (max-width: 900px) {
    /* 弹窗：放弃 16:9，卡片铺满 */
    .cookie-settings-panel .csp-card {
        aspect-ratio: auto;
        min-height: 0;
        max-width: 100%;
        max-height: 90vh;
        padding: var(--sp-4);
    }
    /* 标题与副标题堆叠，给关闭按钮让位 */
    .cookie-settings-panel .csp-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 22px 36px 0 0;
    }
    .cookie-settings-panel .csp-subtitle { white-space: normal; }
    .cookie-settings-panel .csp-close { top: 10px; right: 10px; }
    .cookie-settings-panel .csp-panels { padding: var(--sp-1) var(--sp-1); }
    .cookie-settings-panel .csp-footer { flex-direction: column-reverse; }
    .cookie-settings-panel .csp-footer .btn { width: 100%; justify-content: center; }
}
@media (max-width: 720px) {
    .consent-banner { padding: 0; }
    .consent-banner .cb-inner { flex-direction: column; align-items: stretch; gap: var(--sp-3); }
    .consent-banner .cb-actions { justify-content: stretch; }
    .consent-banner .cb-actions .cb-btn { flex: 1 1 auto; justify-content: center; }
}
.side-tool {
    width: 46px; height: 46px; border-radius: 50%; font-size: 18px;
    display: flex; align-items: center; justify-content: center;
    background: var(--bg-drawer); backdrop-filter: blur(10px);
    border: 1px solid var(--border-glass); color: var(--text-primary);
    transition: transform .3s var(--ease-premium), border-color .3s, box-shadow .3s;
}
.side-tool svg { width: 20px; height: 20px; display: block; }
.side-tool:hover { transform: scale(1.1); border-color: var(--c-cyan); box-shadow: 0 0 18px color-mix(in srgb, var(--c-cyan) 40%, transparent); }

/* ===================================================================
   企业介绍页专属样式（about.html）
   =================================================================== */

/* ---- 页面 Hero（子页面版）：占满一屏，下方内容滚动才出现 ---- */
.hero-page {
    min-height: 100vh; min-height: 100dvh;
    /* 收缩后高度：默认响应式 clamp(76,11vh,132)；hero-collapse.js 会按后台配置 hca_hero_collapsed_height 覆盖为固定 px */
    --hero-collapsed-h: clamp(76px, 11vh, 132px);
    transition: min-height .85s var(--ease-smooth), padding .85s var(--ease-smooth);
}
.hero-page .hero-content,
.hero-page .hero-scroll,
.hero-page .hero-canvas,
.hero-page .hero-grid,
.hero-page .hero-scan,
.hero-page .hero-carousel {
    transition: opacity .55s var(--ease-smooth), transform .7s var(--ease-smooth), max-height .6s var(--ease-smooth);
}
/* 展开态给 .hero-content 一个具体 max-height，作为 max-height 折叠过渡的起点
   （仅作用于子页面 .hero-page，不影响首页 hero）；收缩时平滑折回 0 高度 */
.hero-page:not(.is-collapsed) .hero-content { max-height: 120vh; }
/* 自动收缩态：平滑收为顶部精简横幅，凸显下方内容区 */
.hero-page.is-collapsed {
    min-height: var(--hero-collapsed-h);
    padding-top: 0; padding-bottom: 0;
    overflow: hidden; /* 锁定为横幅条高度：大内容已由 max-height 折为 0，此处兜底裁剪 */
}
/* 收缩态：用 max-height 把大内容平滑折回 0 高度（不搬动其位置，避免“跳到顶部”的乱），
   配合 opacity 淡出；横幅高度完全由 --hero-collapsed-h 决定，全站各页统一、文字居中落在 hero-mini 上。 */
.hero-page.is-collapsed .hero-content {
    max-height: 0;
    margin: 0;
    opacity: 0;
    transform: translateY(-12px) scale(.985);
    pointer-events: none;
    overflow: hidden;
}
.hero-page.is-collapsed .hero-scroll,
.hero-page.is-collapsed .hero-canvas,
.hero-page.is-collapsed .hero-grid,
.hero-page.is-collapsed .hero-scan,
.hero-page.is-collapsed .hero-carousel {
    opacity: 0;
    transform: translateY(-14px) scale(.985);
    pointer-events: none;
}
/* 收缩后浮出的精简横幅条（点击可展开） */
.hero-mini {
    position: absolute; inset: 0; z-index: 3;
    display: flex; align-items: center; justify-content: center; gap: 14px;
    padding: 0 var(--sp-3); cursor: pointer; border: 0;
    opacity: 0; pointer-events: none;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--bg-cosmos) 88%, transparent),
        color-mix(in srgb, var(--bg-cosmos) 72%, transparent));
    border-bottom: 1px solid var(--hairline);
    transition: opacity .5s var(--ease-smooth);
}
.hero-page.is-collapsed .hero-mini { opacity: 1; pointer-events: auto; }
.hero-mini:hover {
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--bg-cosmos) 92%, transparent),
        color-mix(in srgb, var(--bg-cosmos) 80%, transparent));
}
.hero-mini-badge {
    font-family: var(--font-en); font-size: 11px; letter-spacing: 2px;
    color: var(--c-contrast); opacity: .85; white-space: nowrap;
}
.hero-mini-title {
    font-family: var(--font-en); font-weight: 800;
    font-size: clamp(15px, 2.2vw, 20px); color: var(--text-primary);
    letter-spacing: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.hero-mini-caret {
    color: var(--hero-accent); font-size: 16px; line-height: 1;
    animation: heroMiniPulse 2.4s ease-in-out infinite;
}
@keyframes heroMiniPulse { 0%,100% { transform: translateY(0); opacity: .55 } 50% { transform: translateY(-3px); opacity: 1 } }
@media (prefers-reduced-motion: reduce) {
    .hero-page,
    .hero-page .hero-content, .hero-page .hero-scroll, .hero-page .hero-canvas,
    .hero-page .hero-grid, .hero-page .hero-scan, .hero-page .hero-carousel,
    .hero-mini { transition-duration: .01ms !important; }
    .hero-mini-caret { animation: none; }
}

/* ===================================================================
   文章阅读固定条（reading-bar.js）：滚动离开大标题后，标题收缩为顶部固定细条；回顶还原
   仅页面含 .reading-bar 时激活（资讯 / 知识库详情页）。主题令牌与 .hero-mini 一致。
   =================================================================== */
.reading-bar {
    /* 固定条定位在全局导航正下方（top: var(--nav-h)），滚动阅读时导航常驻、细条置于其下，层级清晰无违和感 */
    position: fixed; top: var(--nav-h); left: 0; right: 0; z-index: 990;
    height: var(--reading-bar-h, 60px);
    display: flex; align-items: center;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--bg-cosmos) 92%, transparent),
        color-mix(in srgb, var(--bg-cosmos) 78%, transparent));
    -webkit-backdrop-filter: blur(16px) saturate(150%);
    backdrop-filter: blur(16px) saturate(150%);
    border-bottom: 1px solid var(--hairline);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .28);
    /* 隐藏态：连同导航高度一起上移，确保彻底滑出视口上方（不会在导航区残留幽灵条） */
    transform: translateY(calc(-100% - var(--nav-h)));
    transition: transform .5s var(--ease-smooth);
    will-change: transform;
}
.reading-bar.is-visible { transform: translateY(0); }
/* 底部阅读进度细线 */
.reading-bar-progress {
    position: absolute; left: 0; bottom: -1px; height: 2px; width: 0%;
    background: linear-gradient(90deg, var(--c-cyan), var(--c-purple));
    box-shadow: 0 0 10px color-mix(in srgb, var(--c-cyan) 60%, transparent);
}
.reading-bar-inner {
    width: 100%; max-width: var(--maxw); margin: 0 auto;
    padding: 0 var(--sp-3); display: flex; align-items: center; gap: 14px;
}
.reading-bar-back {
    flex: none; display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; color: var(--text-secondary); text-decoration: none;
    padding: 6px 12px; border-radius: 30px; border: 1px solid transparent;
    transition: color .25s, border-color .25s, background .25s;
}
.reading-bar-back:hover { color: var(--text-primary); border-color: var(--border-glass); background: var(--surface-hover); }
.reading-bar-title {
    flex: 1 1 auto; min-width: 0;
    font-family: var(--font-en); font-weight: 700; letter-spacing: .5px; line-height: 1.2;
    font-size: clamp(14px, 2vw, 17px); color: var(--text-primary);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.reading-bar-top {
    flex: none; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%; border: 1px solid var(--border-glass); background: transparent;
    color: var(--text-secondary); cursor: pointer;
    transition: color .25s, border-color .25s, background .25s, transform .25s;
}
.reading-bar-top:hover { color: var(--c-cyan); border-color: var(--c-cyan); background: var(--surface-hover); transform: translateY(-1px); }
.reading-bar-top svg { width: 18px; height: 18px; }
/* 阅读模式：全局导航常驻顶部，固定细条定位在其正下方（top: var(--nav-h)），二者分层不争位；
   回顶后细条收起、导航始终可见。（旧实现曾用 body.reading #nav 隐藏导航，已移除） */
@media (prefers-reduced-motion: reduce) {
    .reading-bar { transition-duration: .01ms !important; }
}
@media (max-width: 600px) {
    .reading-bar-back { padding: 6px 10px; }
    .reading-bar-title { font-size: 14px; }
}

/* 各页强调色（差异化视觉身份，区别于首页海蓝） */
body.page-about     { --hero-accent: #7F77DD; --hero-accent-2: #534AB7; }
body.page-solutions { --hero-accent: #40B8F0; --hero-accent-2: #185FA5; }
body.page-cases     { --hero-accent: #1D9E75; --hero-accent-2: #0F6E56; }
body.page-news      { --hero-accent: #D85A30; --hero-accent-2: #993C1D; }
body.page-service   { --hero-accent: #639922; --hero-accent-2: #3B6D11; }
body.page-contact   { --hero-accent: #378ADD; --hero-accent-2: #185FA5; }

/* Hero 差异化内容块（每页独有，区别于首页纯大屏） */
.hero-aside { margin-top: var(--sp-4); display: flex; gap: var(--sp-2); flex-wrap: wrap; justify-content: center; }
.hero-aside .aside-card {
    background: var(--glass-bg); border: 1px solid var(--border-glass);
    border-radius: var(--radius-lg); padding: var(--sp-3) var(--sp-4);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); min-width: 138px; text-align: center;
}
.hero-aside .aside-num {
    font-family: var(--font-en); font-size: 30px; font-weight: 900; line-height: 1;
    color: var(--hero-accent); text-shadow: 0 0 18px color-mix(in srgb, var(--hero-accent) 45%, transparent);
}
.hero-aside .aside-label { font-size: 12px; color: var(--text-secondary); margin-top: 6px; }
.hero-aside .aside-tags { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.hero-aside .aside-tag {
    font-size: 13px; padding: 9px 18px; border-radius: 30px;
    border: 1px solid color-mix(in srgb, var(--hero-accent) 42%, transparent);
    color: var(--hero-accent); background: color-mix(in srgb, var(--hero-accent) 9%, transparent);
}
.hero-aside .aside-pill {
    display: inline-flex; align-items: center; gap: 8px; font-size: 13px;
    padding: 9px 18px; border-radius: 30px; color: var(--text-secondary);
    background: var(--glass-bg); border: 1px solid var(--border-glass);
}
.hero-aside .aside-pill b { color: var(--hero-accent); font-family: var(--font-en); font-weight: 700; }

/* 联系页 Hero 底部联系卡：三列玻璃卡片，图标+标签+值 */
.hero-aside--contact { justify-content: center; gap: var(--sp-3); margin-top: var(--sp-5); }
.hero-aside--contact .aside-card {
    display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 4px 14px;
    min-width: 220px; text-align: left; padding: var(--sp-3) var(--sp-4);
}
.hero-aside--contact .aside-ico {
    grid-row: 1 / 3; align-self: center; font-size: 26px; line-height: 1;
    filter: drop-shadow(0 0 8px color-mix(in srgb, var(--hero-accent) 40%, transparent));
}
.hero-aside--contact .aside-label { font-size: 12px; color: var(--text-secondary); margin-top: 0; }
.hero-aside--contact .aside-value {
    font-size: 14px; font-weight: 600; color: var(--text-primary);
    /* 允许长地址换行完整显示（旧版 white-space:nowrap + ellipsis 会截断地址） */
    white-space: normal; overflow-wrap: anywhere; word-break: break-word;
    line-height: 1.5; max-width: 320px;
}
.hero-aside--contact .aside-value:hover { color: var(--hero-accent); }
@media (max-width: 640px) {
    .hero-aside--contact { flex-direction: column; align-items: stretch; }
    .hero-aside--contact .aside-card { min-width: 0; }
    .hero-aside--contact .aside-value { max-width: 100%; }
}

/* 双栏 hero（关于 / 服务页：左文 + 右特色卡） */
@media (min-width: 860px) {
    .hero-split .hero-content { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: var(--sp-5); align-items: center; }
    .hero-split .hero-aside { margin-top: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); justify-items: center; }
}

/* ---- 核心数据列表（about-vision 内）---- */
.data-list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
.data-item { text-align: center; padding: var(--sp-2); }
.data-num {
    font-family: var(--font-en); font-size: 36px; font-weight: 900;
    background: linear-gradient(135deg, var(--c-cyan), var(--c-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.data-unit { font-size: 20px; }
.data-label {
    display: block; font-size: 13px; color: var(--text-secondary);
    margin-top: 4px;
}

/* ---- 文化卡片 ---- */
.culture-section { padding: var(--sp-7) 0; }
.culture-card {
    padding: var(--sp-5); border-radius: var(--radius-lg);
    margin-bottom: var(--sp-4);
}
.culture-header {
    display: flex; align-items: center; gap: var(--sp-3);
    margin-bottom: var(--sp-3);
}
.culture-big-icon {
    font-size: 42px;
    filter: drop-shadow(0 0 16px color-mix(in srgb, var(--c-cyan) 50%, transparent));
    line-height: 1;
}
.culture-header h3 {
    font-size: 26px; color: var(--text-primary);
    background: linear-gradient(90deg, var(--c-cyan), var(--c-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.culture-en {
    font-family: var(--font-en); font-size: 13px;
    color: var(--c-cyan-soft); letter-spacing: 2px;
}
.culture-body p {
    color: var(--text-secondary); line-height: 1.9;
    font-size: 15px; margin-bottom: var(--sp-2);
}
.culture-body strong { color: var(--c-cyan); }
.culture-tags {
    display: flex; gap: 10px; flex-wrap: wrap;
    margin-top: var(--sp-3);
}
.tag {
    padding: 5px 14px; border-radius: 20px; font-size: 12px;
    background: color-mix(in srgb, var(--c-cyan) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 20%, transparent);
    color: var(--c-cyan-soft);
}

/* ---- 文化总结 ---- */
.culture-summary {
    padding: var(--sp-5) var(--sp-4); border-radius: var(--radius-lg);
    border-left: 3px solid var(--c-purple);
}
.culture-summary p {
    color: var(--text-secondary); line-height: 1.95;
    font-size: 15px; margin-bottom: var(--sp-2);
}
.culture-motto {
    text-align: center; font-size: 17px !important;
    color: var(--text-primary) !important;
    margin-top: var(--sp-3) !important;
    padding-top: var(--sp-3);
    border-top: 1px solid var(--hairline);
}

/* ---- 核心价值观 ---- */
.values-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: var(--sp-3);
}
.value-card {
    padding: var(--sp-4) var(--sp-3); border-radius: var(--radius-md);
    text-align: center; transition: transform .4s var(--ease-premium), border-color .4s;
}
.value-card:hover { transform: translateY(-6px); border-color: var(--border-glow); }
.value-icon { font-size: 36px; display: block; margin-bottom: var(--sp-2); }
.value-card h3 { font-size: 17px; margin-bottom: var(--sp-1); }
.value-card p { font-size: 13px; color: var(--text-secondary); line-height: 1.7; }

/* ---- 服务优势 ---- */
.advantage-list { max-width: 800px; margin: 0 auto; }
.adv-item {
    display: flex; gap: var(--sp-3); align-items: flex-start;
    padding: var(--sp-3) 0;
    border-bottom: 1px solid var(--hairline);
}
.adv-num {
    font-family: var(--font-en); font-size: 36px; font-weight: 900;
    color: var(--c-cyan); opacity: .25;
    line-height: 1; min-width: 60px;
}
.adv-content h3 {
    font-size: 17px; margin-bottom: 6px; color: var(--text-primary);
}
.adv-content p {
    font-size: 14px; color: var(--text-secondary); line-height: 1.8;
}

/* ===================================================================
   案例页专属样式（cases/）
   =================================================================== */

/* ---- 客户端筛选通用（filter.js） ---- */
.is-hidden { display: none !important; }
[data-subrow] { } /* 显隐由 JS 按激活的联动值控制 */
.filter-noresults { margin: var(--sp-6) 0; text-align: center; }

/* ---- 行业筛选标签 ---- */
.case-filter-section { padding: var(--sp-5) 0 var(--sp-2); }
.case-filters {
    display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.case-filter {
    padding: 8px 20px; border-radius: 30px; font-size: 14px; cursor: pointer;
    background: var(--glass-bg); color: var(--text-secondary);
    border: 1px solid var(--border-glass);
    transition: all .3s var(--ease-premium);
    font-family: inherit;
}
.case-filter:hover { color: var(--text-primary); border-color: var(--border-glow); }
.case-filter.active {
    color: #04121a; background: linear-gradient(100deg, var(--c-cyan), var(--c-blue));
    border-color: transparent; box-shadow: 0 0 18px color-mix(in srgb, var(--c-cyan) 35%, transparent);
}

/* 新闻分类标签：每类文章数角标 */
.case-filter { display: inline-flex; align-items: center; gap: 7px; }
.cat-count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 20px; height: 20px; padding: 0 6px;
    font-size: 12px; line-height: 1; font-weight: 600;
    border-radius: 10px;
    background: var(--glass-bg); color: var(--text-secondary);
    border: 1px solid var(--border-glass);
}
.case-filter.active .cat-count {
    background: rgba(4, 18, 26, 0.18); color: #04121a; border-color: transparent;
}

/* ---- 案例网格 ---- */
.case-grid-section { padding: var(--sp-3) 0 var(--sp-7); }
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.case-card {
    border-radius: var(--radius-lg); overflow: hidden;
    transition: transform .4s var(--ease-premium), border-color .4s, box-shadow .4s;
    display: block; text-decoration: none; color: inherit;
}
.case-card:hover { transform: translateY(-8px); border-color: var(--border-glow); box-shadow: 0 18px 50px color-mix(in srgb, var(--c-cyan) 16%, transparent); }
.case-thumb {
    height: 180px; position: relative; overflow: hidden;
    background: linear-gradient(135deg, color-mix(in srgb, var(--c-cyan) 18%, transparent), color-mix(in srgb, var(--c-purple) 18%, transparent));
}
.case-thumb::after {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(var(--hairline) 1px, transparent 1px),
        linear-gradient(90deg, var(--hairline) 1px, transparent 1px);
    background-size: 22px 22px;
    mask-image: radial-gradient(circle at 50% 40%, #000, transparent 75%);
    -webkit-mask-image: radial-gradient(circle at 50% 40%, #000, transparent 75%);
}
.case-thumb-1 { background:
    radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--c-cyan) 35%, transparent), transparent 60%),
    radial-gradient(circle at 75% 70%, color-mix(in srgb, var(--c-purple) 30%, transparent), transparent 60%),
    var(--bg-elevated);
}
.case-thumb-ph { background:
    repeating-linear-gradient(45deg, var(--hairline) 0 1px, transparent 1px 24px),
    var(--bg-elevated);
}
.case-info { padding: var(--sp-3); }
.case-cat {
    display: inline-block; font-size: 12px; color: var(--c-cyan-soft);
    letter-spacing: 1px; margin-bottom: var(--sp-1);
}
.case-info h3 { font-size: 17px; line-height: 1.5; margin-bottom: var(--sp-1); color: var(--text-primary); }
.case-info p { font-size: 13.5px; color: var(--text-secondary); line-height: 1.7; margin-bottom: var(--sp-2); }
.case-more { font-size: 13px; color: var(--c-cyan); font-weight: 600; }
.case-placeholder { opacity: .85; }
.case-placeholder .case-thumb-ph { animation: float 4s ease-in-out infinite; }

/* ---- 案例详情 ---- */
.case-detail-hero { min-height: 56vh; }
.case-client { margin-bottom: var(--sp-2); }
.case-client-en {
    font-family: var(--font-en); font-size: 13px; letter-spacing: 3px;
    color: var(--c-cyan-soft);
}
.case-client-cn { font-size: clamp(30px, 6vw, 52px); margin: 6px 0; }
.case-layout { display: grid; grid-template-columns: 1fr 320px; gap: var(--sp-5); align-items: start; }
.case-main { min-width: 0; }
.case-block { margin-bottom: var(--sp-5); }
.case-h2 {
    font-size: 22px; margin-bottom: var(--sp-2);
    padding-left: 14px; border-left: 3px solid var(--c-cyan);
    color: var(--text-primary);
}
.case-block p { color: var(--text-secondary); line-height: 1.9; font-size: 15px; }
.case-block strong { color: var(--c-cyan); }
.case-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.case-list li {
    display: flex; gap: var(--sp-2); align-items: baseline;
    font-size: 15px; color: var(--text-secondary); line-height: 1.7;
    padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md);
    background: var(--glass-bg); border: 1px solid var(--border-glass);
}
.case-list li span {
    flex-shrink: 0; min-width: 96px; font-weight: 600; color: var(--c-cyan);
}
.case-result-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-2);
    margin-top: var(--sp-2);
}
.case-result { padding: var(--sp-3) var(--sp-2); text-align: center; }
.case-result-num {
    font-family: var(--font-en); font-size: 30px; font-weight: 900;
    background: linear-gradient(135deg, var(--c-cyan), var(--c-purple));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.case-result-num span { font-size: 14px; }
.case-result-label { font-size: 12px; color: var(--text-secondary); margin-top: 4px; }
.case-note {
    margin-top: var(--sp-3); padding: var(--sp-2) var(--sp-3);
    font-size: 13px; color: var(--text-dim); line-height: 1.7;
    border-radius: var(--radius-md); background: color-mix(in srgb, var(--c-cyan) 5%, transparent);
    border: 1px dashed color-mix(in srgb, var(--c-cyan) 20%, transparent);
}
.case-side {
    padding: var(--sp-4); border-radius: var(--radius-lg);
    position: sticky; top: 92px;
}
.case-side h3 {
    font-size: 16px; margin-bottom: var(--sp-3); color: var(--text-primary);
    padding-bottom: var(--sp-2); border-bottom: 1px solid var(--border-glass);
}
.case-meta-row {
    display: flex; justify-content: space-between; gap: var(--sp-2);
    padding: var(--sp-2) 0; border-bottom: 1px solid var(--hairline);
    font-size: 13.5px;
}
.case-meta-row span { color: var(--text-dim); }
.case-meta-row b { color: var(--text-primary); font-weight: 600; text-align: right; }

/* ===================================================================
   联系页 / 新闻页 专属样式
   =================================================================== */

/* ---- 联系页 ---- */
.contact-section { padding: var(--sp-7) 0; }
.contact-grid {
    display: grid; grid-template-columns: 360px 1fr; gap: var(--sp-5); align-items: start;
}
.contact-info {
    padding: var(--sp-4); border-radius: var(--radius-lg);
    position: sticky; top: 92px;
}
.contact-info h3 { font-size: 18px; margin-bottom: var(--sp-3); color: var(--text-primary); }
.contact-row { display: flex; gap: var(--sp-2); align-items: flex-start; margin-bottom: var(--sp-3); }
.contact-ico { font-size: 22px; line-height: 1.3; flex-shrink: 0; }
.contact-row strong { display: block; font-size: 14px; color: var(--text-primary); margin-bottom: 3px; }
.contact-row p { font-size: 13.5px; color: var(--text-secondary); line-height: 1.6; margin: 0; }
.contact-row a { color: var(--c-cyan); }
.contact-tip {
    margin-top: var(--sp-3); padding: var(--sp-2) var(--sp-3);
    font-size: 12.5px; color: var(--text-dim); line-height: 1.7;
    border-radius: var(--radius-md); background: color-mix(in srgb, var(--c-cyan) 5%, transparent);
    border: 1px dashed color-mix(in srgb, var(--c-cyan) 20%, transparent);
}
.contact-form-wrap h3 { font-size: 22px; margin-bottom: var(--sp-1); color: var(--text-primary); }
.form-sub { color: var(--text-secondary); font-size: 14px; margin-bottom: var(--sp-3); }
.contact-form { display: flex; flex-direction: column; gap: var(--sp-3); }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 13px; color: var(--text-secondary); }
.field input, .field select, .field textarea {
    font-family: inherit; font-size: 14px; color: var(--text-primary);
    background: var(--glass-bg); border: 1px solid var(--border-glass);
    border-radius: var(--radius-md); padding: 12px 14px;
    transition: border-color .3s, box-shadow .3s;
    width: 100%; resize: vertical;
}
.field input:focus, .field select:focus, .field textarea:focus {
    outline: none; border-color: var(--c-cyan);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-cyan) 12%, transparent);
}
.field input::placeholder, .field textarea::placeholder { color: var(--text-dim); }

/* ================================================================
   自定义深色 Dropdown（替代原生 select，彻底解决白底/黑底白字刺眼）
   ================================================================ */
.custom-select { position: relative; width: 100%; }
.cs-trigger {
    display: flex; align-items: center; justify-content: space-between;
    font-family: inherit; font-size: 14px; color: var(--text-primary);
    background: var(--glass-bg);
    border: 1px solid var(--border-glass);
    border-radius: var(--radius-md);
    padding: 12px 14px; cursor: pointer;
    transition: border-color .25s, box-shadow .25s, background .25s;
    user-select: none;
}
.cs-trigger:hover { background: var(--surface-hover); border-color: color-mix(in srgb, var(--c-cyan) 30%, transparent); }
.cs-trigger:focus { outline: none; border-color: var(--c-cyan); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-cyan) 12%, transparent); }
.cs-trigger.cs-open { border-color: var(--c-cyan); border-radius: var(--radius-md) var(--radius-md) 0 0; }
.cs-value { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: inherit; }
.cs-value.cs-placeholder { color: var(--text-dim); }
.cs-arrow { width: 16px; height: 16px; color: var(--text-dim); transition: transform .25s; flex-shrink: 0; margin-left: 8px; }
.cs-trigger.cs-open .cs-arrow { transform: rotate(180deg); color: var(--c-cyan); }

/* 下拉面板 */
.cs-dropdown {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--bg-drawer);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 20%, transparent);
    border-top: none;
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    box-shadow: 0 12px 36px var(--drawer-shadow), 0 0 1px color-mix(in srgb, var(--c-cyan) 15%, transparent);
    z-index: 100;
    opacity: 0; visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .2s, transform .2s, visibility .2s;
    max-height: 280px; overflow-y: auto;
    overscroll-behavior: contain;
}
.custom-select.cs-open .cs-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }

/* 向上弹出变体（空间不够时自动翻转） */
.custom-select.cs-up .cs-dropdown {
    top: auto; bottom: 100%;
    border-top: 1px solid color-mix(in srgb, var(--c-cyan) 20%, transparent);
    border-bottom: none;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    box-shadow: 0 -12px 36px var(--drawer-shadow), 0 0 1px color-mix(in srgb, var(--c-cyan) 15%, transparent);
    transform: translateY(8px);           /* 从下方滑入 */
}
.custom-select.cs-up.cs-open .cs-dropdown { transform: translateY(0); }
.custom-select.cs-up .cs-trigger.cs-open {
    border-radius: 0 0 var(--radius-md) var(--radius-md);   /* 底部圆角 */
}

/* 选项行 */
.cs-option {
    display: flex; align-items: center; gap: 10px;
    padding: 11px 14px;
    font-size: 14px; color: var(--text-secondary);
    cursor: pointer; transition: all .15s;
    border-bottom: 1px solid var(--hairline);
}
.cs-option:last-child { border-bottom: none; }
.cs-option:hover { background: color-mix(in srgb, var(--c-cyan) 10%, transparent); color: var(--text-primary); }
.cs-option.cs-selected { background: color-mix(in srgb, var(--c-cyan) 15%, transparent); color: var(--c-cyan); }
.cs-option.cs-selected::before {
    content: '✓'; font-size: 13px; font-weight: 700; margin-right: -4px;
}

/* 小标签 */
.cs-rec, .cs-new {
    display: inline-block; font-size: 10px; font-weight: 700;
    padding: 1px 6px; border-radius: 4px; line-height: 1.6;
    letter-spacing: 0.5px;
}
.cs-rec { background: color-mix(in srgb, var(--c-cyan) 18%, transparent); color: var(--c-cyan); }
.cs-new { background: rgba(217,119,86,0.18); color: #D97756; }
.form-note {
    font-size: 13px; color: var(--c-cyan); line-height: 1.6;
    padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--c-cyan) 8%, transparent); border: 1px solid color-mix(in srgb, var(--c-cyan) 20%, transparent);
}

.form-note.form-note-error {
    color: #ff9a9a;
    background: rgba(248,113,113,0.08);
    border-color: rgba(248,113,113,0.25);
}

/* ---------- 留言提交弹窗 ---------- */
.contact-popup {
    position: fixed; inset: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    padding: var(--sp-3);
    opacity: 0; visibility: hidden;
    transition: opacity .35s var(--ease-smooth), visibility .35s;
}
.contact-popup.active { opacity: 1; visibility: visible; }
.contact-popup.out { opacity: 0; visibility: hidden; }

.contact-popup .cp-backdrop {
    position: absolute; inset: 0;
    background: color-mix(in srgb, var(--bg-drawer) 65%, transparent);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.contact-popup .cp-card {
    position: relative;
    width: 100%; max-width: 420px;
    padding: var(--sp-5) var(--sp-4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-glass);
    background: var(--bg-drawer);
    box-shadow: 0 24px 64px var(--drawer-shadow), 0 0 0 1px color-mix(in srgb, var(--c-cyan) 8%, transparent) inset;
    text-align: center;
    transform: translateY(16px) scale(0.96);
    transition: transform .4s var(--ease-premium), opacity .4s;
}
.contact-popup.active .cp-card { transform: translateY(0) scale(1); }
.contact-popup.out .cp-card { transform: translateY(-12px) scale(0.98); opacity: 0; }

.contact-popup .cp-close {
    position: absolute; top: 12px; right: 16px;
    width: 32px; height: 32px; line-height: 32px;
    background: transparent; border: none; color: var(--text-tertiary);
    font-size: 26px; cursor: pointer; border-radius: 50%;
    transition: color .2s, background .2s;
}
.contact-popup .cp-close:hover { color: var(--text-primary); background: var(--surface-hover); }

.contact-popup .cp-icon {
    width: 64px; height: 64px; margin: 0 auto var(--sp-3);
    border-radius: 50%;
    background: color-mix(in srgb, var(--c-cyan) 12%, transparent); border: 1px solid color-mix(in srgb, var(--c-cyan) 30%, transparent);
    color: var(--c-cyan); font-size: 30px; line-height: 64px;
    box-shadow: 0 0 24px color-mix(in srgb, var(--c-cyan) 18%, transparent);
}

.contact-popup .cp-title {
    font-size: 17px; font-weight: 500; color: var(--text-primary);
    line-height: 1.7; margin-bottom: var(--sp-1);
}
.contact-popup .cp-sub {
    font-size: 13px; color: var(--text-secondary); margin: 0;
}

.contact-popup .cp-bar {
    position: absolute; bottom: 0; left: 0; right: 0;
    height: 3px; background: color-mix(in srgb, var(--c-cyan) 12%, transparent);
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    overflow: hidden;
}
.contact-popup .cp-bar span {
    display: block; height: 100%; width: 0%;
    background: linear-gradient(90deg, var(--c-cyan), var(--c-purple));
    transition: width .1s linear;
}

/* ---------- 隐私政策弹窗（联系表单「我同意」触发） ---------- */
.privacy-modal {
    position: fixed; inset: 0; z-index: 1200;
    display: flex; align-items: center; justify-content: center;
    padding: var(--sp-3);
    opacity: 0; visibility: hidden;
    transition: opacity .35s var(--ease-smooth), visibility .35s;
}
.privacy-modal.is-open { opacity: 1; visibility: visible; }
.privacy-modal .pm-backdrop {
    position: absolute; inset: 0;
    background: color-mix(in srgb, var(--bg-drawer) 65%, transparent);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.privacy-modal .pm-card {
    position: relative;
    width: 100%; max-width: 640px;
    max-height: 82vh;
    display: flex; flex-direction: column;
    padding: var(--sp-5) var(--sp-4);
    transform: translateY(16px) scale(.96);
    transition: transform .4s var(--ease-premium), opacity .4s;
}
.privacy-modal.is-open .pm-card { transform: translateY(0) scale(1); }
.privacy-modal .pm-close {
    position: absolute; top: 12px; right: 16px;
    width: 32px; height: 32px; line-height: 32px;
    background: transparent; border: none; color: var(--text-tertiary);
    font-size: 26px; cursor: pointer; border-radius: 50%;
    transition: color .2s, background .2s;
}
.privacy-modal .pm-close:hover { color: var(--text-primary); background: var(--surface-hover); }
.privacy-modal .pm-title {
    margin: 0 0 var(--sp-3);
    font-size: 20px; font-weight: 700; color: var(--text-primary);
}
.privacy-modal .pm-body {
    flex: 1 1 auto; min-height: 0; overflow-y: auto;
    padding-right: 6px;
    font-size: 14px; line-height: 1.8; color: var(--text-secondary);
}
.privacy-modal .pm-body h2 { font-size: 17px; margin: 18px 0 10px; color: var(--text-primary); }
.privacy-modal .pm-body h2:first-child { margin-top: 0; }
.privacy-modal .pm-body h3 { font-size: 15px; margin: 14px 0 8px; color: var(--c-cyan-soft); }
.privacy-modal .pm-body p, .privacy-modal .pm-body li { margin: 8px 0; }
.privacy-modal .pm-body ul { padding-left: 20px; }
.privacy-modal .pm-body a { color: var(--c-cyan); }
.privacy-modal .pm-body strong { color: var(--text-primary); }
.privacy-modal .pm-footer {
    display: flex; gap: 12px; justify-content: flex-end;
    margin-top: var(--sp-4); padding-top: var(--sp-3);
    border-top: 1px solid var(--hairline);
}
@media (max-width: 560px) {
    .privacy-modal .pm-card { max-width: 100%; max-height: 88vh; }
    .privacy-modal .pm-footer { flex-direction: column-reverse; }
    .privacy-modal .pm-footer .btn { width: 100%; justify-content: center; }
}

/* ---- 新闻页 ---- */
.news-section { padding: var(--sp-7) 0; }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.news-card {
    border-radius: var(--radius-lg); overflow: hidden;
    transition: transform .4s var(--ease-premium), border-color .4s, box-shadow .4s;
}
.news-card:hover { transform: translateY(-6px); border-color: var(--border-glow); box-shadow: 0 16px 44px color-mix(in srgb, var(--c-cyan) 14%, transparent); }
.news-thumb { height: 170px; position: relative; overflow: hidden; }
.news-thumb::after {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(var(--hairline) 1px, transparent 1px),
        linear-gradient(90deg, var(--hairline) 1px, transparent 1px);
    background-size: 24px 24px;
    mask-image: radial-gradient(circle at 50% 50%, #000, transparent 78%);
    -webkit-mask-image: radial-gradient(circle at 50% 50%, #000, transparent 78%);
}
.news-thumb-1 {
    background:
        radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--c-cyan) 35%, transparent), transparent 60%),
        var(--bg-elevated);
}
.news-thumb-2 {
    background:
        radial-gradient(circle at 70% 40%, color-mix(in srgb, var(--c-purple) 32%, transparent), transparent 60%),
        var(--bg-elevated);
}
.news-thumb-ph {
    background:
        repeating-linear-gradient(45deg, var(--hairline) 0 1px, transparent 1px 24px),
        var(--bg-elevated);
}
.news-body { padding: var(--sp-3); }
.news-meta { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-1); }
.news-date { font-family: var(--font-en); font-size: 12px; color: var(--c-cyan-soft); letter-spacing: 1px; }
.news-tag {
    font-size: 11px; padding: 2px 10px; border-radius: 12px;
    background: color-mix(in srgb, var(--c-cyan) 10%, transparent); color: var(--c-cyan-soft);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 20%, transparent);
}
.news-body h3 { font-size: 16px; line-height: 1.5; margin-bottom: var(--sp-1); color: var(--text-primary); }
.news-body p { font-size: 13px; color: var(--text-secondary); line-height: 1.7; margin-bottom: var(--sp-2); }
.news-more { font-size: 13px; color: var(--c-cyan); font-weight: 600; }
.news-placeholder { opacity: .82; }

/* 真实封面图：覆盖缩略区，无图时回退 CSS 渐变 */
.news-thumb-img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .55s var(--ease-premium);
}
.news-card:hover .news-thumb-img { transform: scale(1.06); }

/* ---------- 面包屑导航 ---------- */
.breadcrumb {
    position: relative; z-index: 1;
    padding: var(--sp-2) 0 0;
    font-size: 13px; color: var(--text-dim);
}
.breadcrumb .container { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.breadcrumb a { color: var(--text-secondary); transition: color .25s; }
.breadcrumb a:hover { color: var(--c-cyan); }
.breadcrumb .sep { color: var(--text-dim); opacity: .45; }
.breadcrumb .current { color: var(--text-primary); }
@media (max-width: 767px) {
    .breadcrumb { font-size: 12px; padding-top: var(--sp-1); }
}

/* ---------- 服务闭环（五大支柱） ---------- */
.service-loop { padding: var(--sp-6) 0; }
.loop-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--sp-3); }
.loop-step {
    padding: var(--sp-4) var(--sp-3); border-radius: var(--radius-lg);
    text-align: center; position: relative; overflow: hidden;
    transition: transform .4s var(--ease-premium), border-color .4s, box-shadow .4s;
}
.loop-step:hover { transform: translateY(-6px); border-color: var(--border-glow); box-shadow: 0 14px 44px color-mix(in srgb, var(--c-cyan) 18%, transparent); }
.loop-no { font-family: var(--font-en); font-size: 13px; letter-spacing: 2px; color: var(--c-cyan); opacity: .55; margin-bottom: var(--sp-1); }
.loop-icon {
    display: inline-flex; width: 60px; height: 60px; align-items: center; justify-content: center;
    font-size: 28px; border-radius: 16px; margin-bottom: var(--sp-2);
    background: color-mix(in srgb, var(--c-cyan) 10%, transparent); color: var(--c-cyan);
    box-shadow: inset 0 0 18px color-mix(in srgb, var(--c-cyan) 15%, transparent);
}
.loop-step h3 { font-size: 19px; margin-bottom: 8px; }
.loop-step p { color: var(--text-secondary); font-size: 13.5px; line-height: 1.65; }
.loop-foot { text-align: center; color: var(--text-secondary); font-size: 14.5px; max-width: 620px; margin: var(--sp-4) auto 0; line-height: 1.8; }

/* ---- 服务流程（时间轴） ---- */
.process-flow { max-width: 760px; margin: 0 auto; position: relative; }
.process-flow::before {
    content: ""; position: absolute; left: 27px; top: 8px; bottom: 8px; width: 2px;
    background: linear-gradient(var(--c-cyan), var(--c-purple)); opacity: .3;
}
.process-step { display: flex; gap: var(--sp-3); align-items: flex-start; position: relative; padding-bottom: var(--sp-4); }
.process-step:last-child { padding-bottom: 0; }
.process-dot {
    flex-shrink: 0; width: 56px; height: 56px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--font-en); font-size: 17px; font-weight: 700; color: var(--c-cyan);
    background: var(--bg-secondary); border: 2px solid var(--border-glow);
    box-shadow: 0 0 16px color-mix(in srgb, var(--c-cyan) 20%, transparent); z-index: 1;
}
.process-body { padding-top: 8px; }
.process-body h3 { font-size: 18px; margin-bottom: 6px; color: var(--text-primary); }
.process-body p { font-size: 14px; color: var(--text-secondary); line-height: 1.8; }

/* ===================================================================
   新闻标签与 Markdown 正文
   =================================================================== */
.news-tag-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.news-tag-filters .filter-label { color: var(--text-dim); font-size: 13px; }
.news-tag-filter {
    padding: 5px 13px; border-radius: 20px; font-size: 12.5px;
    border: 1px solid var(--border); color: var(--text-secondary);
    background: var(--glass-bg); transition: all .25s;
}
.news-tag-filter:hover, .news-tag-filter.active {
    border-color: var(--c-cyan); color: var(--c-cyan);
    background: color-mix(in srgb, var(--c-cyan) 8%, transparent);
}
.news-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.news-card-tag {
    padding: 3px 10px; border-radius: 20px; font-size: 11.5px;
    background: color-mix(in srgb, var(--c-cyan) 8%, transparent); color: var(--c-cyan-soft);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 15%, transparent);
}
.news-card-tag:hover { color: var(--c-cyan); border-color: var(--c-cyan); }
.news-detail-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.news-detail-tags .label { color: var(--text-dim); font-size: 13px; }
.news-detail-tag {
    padding: 4px 12px; border-radius: 20px; font-size: 12px;
    background: color-mix(in srgb, var(--c-cyan) 8%, transparent); color: var(--c-cyan-soft);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 18%, transparent);
}
.news-detail-tag:hover { color: var(--c-cyan); border-color: var(--c-cyan); }

/* Markdown 渲染正文 */
.news-content { font-size: 15.5px; line-height: 1.85; color: var(--text-secondary); }
.news-content h1, .news-content h2, .news-content h3, .news-content h4 { color: var(--text-primary); margin: 1.4em 0 .6em; line-height: 1.4; }
.news-content h1 { font-size: 26px; }
.news-content h2 { font-size: 22px; border-bottom: 1px solid var(--hairline); padding-bottom: 10px; }
.news-content h3 { font-size: 18px; }
.news-content p { margin-bottom: 1em; }
.news-content ul, .news-content ol { margin: 0 0 1em 1.5em; }
.news-content li { margin-bottom: .35em; }
.news-content a { color: var(--c-cyan); text-decoration: underline; }
.news-content img { max-width: 100%; border-radius: var(--radius-md); margin: 1em 0; }
.news-content blockquote { margin: 1em 0; padding: 12px 18px; border-left: 3px solid var(--c-cyan); background: color-mix(in srgb, var(--c-cyan) 5%, transparent); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.news-content code { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; background: var(--glass-bg); padding: 2px 6px; border-radius: 4px; font-size: .9em; }
.news-content pre { background: rgba(0,0,0,0.25); padding: 16px; border-radius: var(--radius-sm); overflow-x: auto; margin: 1em 0; }
.news-content pre code { background: transparent; padding: 0; }
.news-content table { width: 100%; border-collapse: collapse; margin: 1em 0; }
.news-content th, .news-content td { border: 1px solid var(--border); padding: 10px 14px; text-align: left; }
.news-content th { background: color-mix(in srgb, var(--c-cyan) 8%, transparent); color: var(--text-primary); }


/* ============================================================
   新闻文章布局变体（standard / immersive / magazine）
   + 封面尺寸（large / medium / small）· 2026-07-31
   ============================================================ */
.news-cover--large  { width: 100%; max-height: 560px; object-fit: cover; border-radius: var(--radius-lg); }
.news-cover--medium { width: 100%; max-height: 380px; object-fit: cover; border-radius: var(--radius-lg); }
.news-cover--small  { width: 100%; max-height: 240px; object-fit: cover; border-radius: var(--radius-lg); }

/* 沉浸单栏 / 杂志大图：单栏居中、隐藏侧栏 */
.article-layout-immersive .case-layout,
.article-layout-magazine .case-layout { grid-template-columns: 1fr; }
.article-layout-immersive .case-main,
.article-layout-magazine .case-main { max-width: 780px; margin: 0 auto; }
.article-layout-immersive .case-side,
.article-layout-magazine .case-side { display: none; }

/* 杂志大图：更大的封面 + 首段首字下沉，强化视觉冲击 */
.article-layout-magazine .news-cover { max-height: 520px; }
.article-layout-magazine .news-content > p:first-of-type::first-letter {
    float: left; font-size: 3.4em; line-height: .82; padding: 6px 10px 0 0;
    font-weight: 800; color: var(--c-cyan);
}

/* 后台预览弹窗内的布局约束（复用同样的布局类） */
.article-preview.article-layout-immersive,
.article-preview.article-layout-magazine { max-width: 780px; margin: 0 auto; }

/* ============================================================
   全站搜索结果页（/search/）
   ============================================================ */
.search-page { padding-top: 140px; padding-bottom: 80px; min-height: 70vh; }
.search-head { max-width: 760px; margin: 0 auto 48px; text-align: center; }
.search-title { font-size: clamp(28px, 4vw, 44px); font-weight: 800; margin: 12px 0 28px; letter-spacing: .04em; }
.search-bar {
    display: flex; align-items: center; gap: 10px;
    background: var(--glass-bg);
    border: 1px solid var(--border-glass, rgba(255,255,255,0.12));
    border-radius: 999px; padding: 8px 8px 8px 18px;
    backdrop-filter: blur(12px);
    transition: border-color .3s, box-shadow .3s;
}
.search-bar:focus-within { border-color: var(--c-cyan); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-cyan) 15%, transparent); }
.sb-icon { color: var(--text-secondary); flex: 0 0 auto; }
.search-bar input {
    flex: 1 1 auto; background: transparent; border: 0; outline: 0;
    color: var(--text-primary); font-size: 16px; padding: 8px 4px;
}
.search-bar input::placeholder { color: var(--text-secondary); opacity: .7; }
.sb-submit {
    flex: 0 0 auto; border: 0; cursor: pointer;
    background: linear-gradient(135deg, var(--c-cyan), #1A6DB5);
    color: #04121f; font-weight: 700; font-size: 15px;
    padding: 10px 26px; border-radius: 999px;
    transition: transform .2s, box-shadow .2s;
}
.sb-submit:hover { transform: translateY(-1px); box-shadow: 0 8px 22px color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.search-meta { margin-top: 18px; color: var(--text-secondary); font-size: 14px; }
.search-meta b { color: var(--c-cyan); }
.search-back { display: inline-block; margin-left: 14px; color: var(--text-secondary); text-decoration: none; }
.search-back:hover { color: var(--c-cyan); }

.result-group { max-width: 880px; margin: 0 auto 36px; }
.result-group-title {
    display: flex; align-items: center; gap: 10px;
    font-size: 18px; font-weight: 700; color: var(--text-primary);
    margin-bottom: 16px; padding-bottom: 10px;
    border-bottom: 1px solid var(--hairline);
}
.rg-icon { color: var(--c-cyan); }
.rg-count {
    margin-left: auto; font-size: 13px; font-weight: 600; color: var(--text-secondary);
    background: color-mix(in srgb, var(--c-cyan) 12%, transparent); padding: 2px 10px; border-radius: 999px;
}
.result-list { display: flex; flex-direction: column; gap: 12px; }
.result-item {
    display: flex; align-items: center; gap: 16px;
    padding: 16px 18px; border-radius: var(--radius-lg, 16px);
    text-decoration: none; color: inherit;
    transition: transform .2s, border-color .2s, background .2s;
}
.result-item:hover { transform: translateX(4px); border-color: color-mix(in srgb, var(--c-cyan) 50%, transparent); background: color-mix(in srgb, var(--c-cyan) 6%, transparent); }
.result-thumb {
    flex: 0 0 auto; width: 64px; height: 64px; border-radius: 12px;
    background-size: cover; background-position: center;
    background-color: var(--glass-bg);
}
.result-body { flex: 1 1 auto; min-width: 0; }
.result-top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.result-tag {
    flex: 0 0 auto; font-size: 12px; font-weight: 700; color: var(--c-cyan);
    border: 1px solid color-mix(in srgb, var(--c-cyan) 40%, transparent); border-radius: 6px; padding: 1px 8px;
}
.result-title { font-size: 16px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.result-excerpt { font-size: 13.5px; color: var(--text-secondary); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.result-arrow { flex: 0 0 auto; color: var(--text-secondary); font-size: 18px; transition: transform .2s, color .2s; }
.result-item:hover .result-arrow { color: var(--c-cyan); transform: translateX(3px); }
.search-empty { color: var(--text-secondary); font-size: 14px; padding: 6px 2px; opacity: .8; }

.search-tips { max-width: 760px; margin: 0 auto; text-align: center; color: var(--text-secondary); }
.tip-tags { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 14px; }
.tip-tags a {
    text-decoration: none; color: var(--text-primary);
    background: var(--glass-bg); border: 1px solid var(--hairline);
    padding: 8px 18px; border-radius: 999px; font-size: 14px; transition: .2s;
}
.tip-tags a:hover { border-color: var(--c-cyan); color: var(--c-cyan); }

/* ===================================================================
   文章排版模板主题（cpt-tpl）· 前台发布页通用
   仅消费 CSS 变量（由编辑器写入 article 行内 style），不改变 HTML 结构；响应式。
   =================================================================== */
.news-content .cpt-tpl,
.case-content .cpt-tpl,
.solution-content .cpt-tpl {
    --cpt-accent: #64748b;
    --cpt-accent-soft: rgba(100,116,139,.08);
    --cpt-font: 'PingFang SC', system-ui, sans-serif;
    --cpt-heading-font: 'PingFang SC', system-ui, sans-serif;
    --cpt-radius: 6px;
    --cpt-spacing: 1.6em;
    --cpt-heading-color: var(--text-primary);
    --cpt-quote-bg: color-mix(in srgb, var(--c-cyan) 6%, transparent);
}
.news-content .cpt-tpl :where(h1,h2,h3,h4),
.case-content .cpt-tpl :where(h1,h2,h3,h4),
.solution-content .cpt-tpl :where(h1,h2,h3,h4) {
    color: var(--cpt-heading-color);
    font-family: var(--cpt-heading-font);
    line-height: 1.4;
}
.news-content .cpt-tpl p,
.news-content .cpt-tpl li,
.case-content .cpt-tpl p,
.case-content .cpt-tpl li,
.solution-content .cpt-tpl p,
.solution-content .cpt-tpl li { line-height: var(--cpt-spacing); }
.news-content .cpt-tpl a,
.case-content .cpt-tpl a,
.solution-content .cpt-tpl a { color: var(--cpt-accent); border-bottom: 1px solid var(--cpt-accent-soft); text-decoration: none; }
.news-content .cpt-tpl blockquote,
.case-content .cpt-tpl blockquote,
.solution-content .cpt-tpl blockquote {
    background: var(--cpt-accent-soft);
    border-left: 3px solid var(--cpt-accent);
    border-radius: var(--cpt-radius);
    color: var(--cpt-heading-color);
    font-style: italic;
}
.news-content .cpt-tpl img,
.case-content .cpt-tpl img,
.solution-content .cpt-tpl img { border-radius: var(--cpt-radius); }
.news-content .cpt-tpl :where(h2,h3)::before,
.case-content .cpt-tpl :where(h2,h3)::before,
.solution-content .cpt-tpl :where(h2,h3)::before {
    content: ''; display: inline-block; width: 4px; height: 1em;
    background: var(--cpt-accent); border-radius: 2px; margin-right: .5em; vertical-align: -.12em;
}
@media (max-width: 640px) {
    .news-content .cpt-tpl, .case-content .cpt-tpl, .solution-content .cpt-tpl { --cpt-spacing: 1.4em; }
    .news-content .cpt-tpl :where(h2,h3)::before,
    .case-content .cpt-tpl :where(h2,h3)::before,
    .solution-content .cpt-tpl :where(h2,h3)::before { display: none; }
}

/* ===================================================================
   知识库（/knowledge/）专属样式
   =================================================================== */
.kb-section { padding: var(--sp-6) 0 var(--sp-7); }
.kb-toolbar { margin-bottom: var(--sp-4); }
.kb-search {
    display: flex; align-items: center; gap: 10px;
    background: var(--glass-bg); border: 1px solid var(--border-glass);
    border-radius: 999px; padding: 6px 6px 6px 16px; margin-bottom: var(--sp-3);
    transition: border-color .3s, box-shadow .3s;
}
.kb-search:focus-within { border-color: var(--c-cyan); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-cyan) 15%, transparent); }
.kb-search svg { color: var(--text-secondary); flex: 0 0 auto; }
.kb-search input {
    flex: 1 1 auto; background: transparent; border: 0; outline: 0;
    color: var(--text-primary); font-size: 15px; padding: 10px 4px; font-family: inherit;
}
.kb-search input::placeholder { color: var(--text-secondary); opacity: .7; }
.kb-search button {
    flex: 0 0 auto; border: 0; cursor: pointer; color: #04121f; font-weight: 700; font-size: 14px;
    padding: 10px 24px; border-radius: 999px;
    background: linear-gradient(135deg, var(--c-cyan), #1A6DB5);
    transition: transform .2s, box-shadow .2s;
}
.kb-search button:hover { transform: translateY(-1px); box-shadow: 0 8px 22px color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.kb-cats { display: flex; flex-wrap: wrap; gap: 10px; }
.kb-cat {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 16px; border-radius: 999px; font-size: 13.5px; text-decoration: none;
    color: var(--text-secondary); background: var(--glass-bg);
    border: 1px solid var(--border-glass); transition: all .25s;
}
.kb-cat em { font-style: normal; font-size: 11px; opacity: .7; }
.kb-cat:hover { color: var(--text-primary); border-color: var(--border-glow); }
.kb-cat.active { color: #04121f; background: linear-gradient(100deg, var(--c-cyan), var(--c-blue)); border-color: transparent; box-shadow: 0 0 16px color-mix(in srgb, var(--c-cyan) 30%, transparent); }
.kb-result-tip { color: var(--text-secondary); font-size: 14px; margin-bottom: var(--sp-3); }
.kb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-4); }
.kb-card {
    display: block; text-decoration: none; color: inherit; border-radius: var(--radius-lg);
    padding: var(--sp-4); transition: transform .4s var(--ease-premium), border-color .4s, box-shadow .4s;
}
.kb-card:hover { transform: translateY(-6px); border-color: var(--border-glow); box-shadow: 0 16px 44px color-mix(in srgb, var(--c-cyan) 14%, transparent); }
.kb-card-cat { display: inline-block; font-size: 12px; color: var(--c-cyan-soft); letter-spacing: 1px; margin-bottom: var(--sp-1); }
.kb-card h3 { font-size: 17px; line-height: 1.5; margin-bottom: var(--sp-1); color: var(--text-primary); }
.kb-card p { font-size: 13.5px; color: var(--text-secondary); line-height: 1.7; margin-bottom: var(--sp-2); }
.kb-card-meta { display: flex; gap: var(--sp-2); font-size: 12px; color: var(--text-dim); }
.kb-card-meta span:not(:last-child)::after { content: '·'; margin-left: var(--sp-2); opacity: .5; }

/* 详情页 */
.kb-detail { padding: var(--sp-6) 0 var(--sp-7); }
.kb-detail-inner { max-width: 1440px; padding: 0 32px; }
/* 文章 Hero（对齐使用条款页 .legal-hero） */
.kb-hero {
    position: relative; padding: 132px 0 56px; text-align: center; overflow: hidden;
    background: radial-gradient(1200px 420px at 50% -12%, rgba(64,184,240,.14), transparent 60%), var(--bg-cosmos);
    border-bottom: 1px solid var(--border-glass);
}
.kb-hero .badge {
    display: inline-block; font-size: 12px; letter-spacing: .2em; color: var(--c-cyan);
    border: 1px solid var(--border-glow); border-radius: 999px; padding: 6px 16px; margin-bottom: 18px;
}
.kb-hero h1 {
    font-size: clamp(28px, 5vw, 44px); font-weight: 800; margin: 0 0 12px;
    background: linear-gradient(100deg, var(--c-cyan), var(--c-cyan-soft));
    -webkit-background-clip: text; background-clip: text; color: transparent;
    line-height: 1.3;
}
.kb-hero .meta { color: var(--text-secondary); font-size: 14px; line-height: 1.85; }
.kb-hero .meta span { white-space: nowrap; }
@media (max-width: 640px) {
    .kb-hero { padding: 96px 0 36px; }
    .kb-hero .meta { font-size: 13px; }
    .kb-detail-inner { padding: 0 18px; }
}
.kb-crumb { font-size: 13px; color: var(--text-dim); margin-bottom: var(--sp-3); }
.kb-crumb a { color: var(--text-secondary); text-decoration: none; }
.kb-crumb a:hover { color: var(--c-cyan); }
.kb-crumb .cur { color: var(--text-primary); }
.kb-article { padding: var(--sp-5); border-radius: var(--radius-lg); }
.kb-article-lead { font-size: 15.5px; color: var(--text-secondary); line-height: 1.8; background: color-mix(in srgb, var(--c-cyan) 5%, transparent); border-left: 3px solid var(--c-cyan); padding: 12px 18px; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: var(--sp-4); }
.kb-article-body { font-size: 15.5px; line-height: 1.85; color: var(--text-secondary); }
.kb-article-body h1, .kb-article-body h2, .kb-article-body h3, .kb-article-body h4 { color: var(--text-primary); margin: 1.4em 0 .6em; line-height: 1.4; }
.kb-article-body h2 { font-size: 22px; border-bottom: 1px solid var(--hairline); padding-bottom: 10px; }
.kb-article-body h3 { font-size: 18px; }
.kb-article-body p { margin-bottom: 1em; }
.kb-article-body ul, .kb-article-body ol { margin: 0 0 1em 1.5em; }
.kb-article-body li { margin-bottom: .35em; }
.kb-article-body a { color: var(--c-cyan); text-decoration: underline; }
.kb-article-body img { max-width: 100%; border-radius: var(--radius-md); margin: 1em 0; }
.kb-article-body blockquote { margin: 1em 0; padding: 12px 18px; border-left: 3px solid var(--c-cyan); background: color-mix(in srgb, var(--c-cyan) 5%, transparent); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.kb-article-body code { font-family: ui-monospace, monospace; background: var(--glass-bg); padding: 2px 6px; border-radius: 4px; font-size: .9em; }
.kb-article-body pre { background: rgba(0,0,0,0.25); padding: 16px; border-radius: var(--radius-sm); overflow-x: auto; margin: 1em 0; }
.kb-article-body pre code { background: transparent; padding: 0; }
.kb-article-body table { width: 100%; border-collapse: collapse; margin: 1em 0; }
.kb-article-body th, .kb-article-body td { border: 1px solid var(--border); padding: 10px 14px; text-align: left; }
.kb-article-body th { background: color-mix(in srgb, var(--c-cyan) 8%, transparent); color: var(--text-primary); }
.kb-ask-hint {
    display: flex; align-items: center; gap: 8px; margin-top: var(--sp-4);
    font-size: 13.5px; color: var(--c-cyan-soft);
    background: color-mix(in srgb, var(--c-cyan) 6%, transparent); border: 1px dashed color-mix(in srgb, var(--c-cyan) 25%, transparent);
    padding: 12px 16px; border-radius: var(--radius-md);
}

@media (max-width: 900px) {
    .kb-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .kb-grid { grid-template-columns: 1fr; }
    .kb-article { padding: var(--sp-3); }
}

/* ===== 文章阅读页多布局（知识库内容页） ===== */
.kb-layout { display: grid; gap: 40px; align-items: start; }
.kb-layout-wide      { grid-template-columns: minmax(0, 820px); justify-content: center; }
.kb-layout-inline    { grid-template-columns: minmax(0, 820px); justify-content: center; }
.kb-layout-left-wide { grid-template-columns: minmax(0, 1fr) 260px; }
.kb-layout-left-narrow { grid-template-columns: 260px minmax(0, 1fr); }
.kb-layout-left-narrow .kb-toc { order: -1; }
.kb-toc { min-width: 0; }
.kb-layout-wide .kb-toc,
.kb-layout-no-toc .kb-toc { display: none; }
.kb-layout-inline .kb-toc { order: -1; }
.kb-toc-inner {
    position: sticky; top: 96px;
    border: 1px solid var(--border-glass); border-radius: var(--radius-md);
    background: var(--bg-elevated); padding: 18px 16px;
    max-height: calc(100vh - 130px); overflow: auto;
}
.kb-toc-title { font-size: 13px; color: var(--text-dim); letter-spacing: .1em; margin-bottom: 12px; }
.kb-toc-list { list-style: none; margin: 0; padding: 0; }
.kb-toc-li a {
    display: block; padding: 7px 10px; border-radius: 8px;
    color: var(--text-secondary); font-size: 13.5px; text-decoration: none; line-height: 1.5;
    transition: background .15s, color .15s;
}
.kb-toc-li a:hover, .kb-toc-li a.active { background: rgba(64,184,240,.12); color: var(--c-cyan); }
.kb-toc-li.level-3 a { padding-left: 24px; font-size: 13px; }
/* 内联目录：顶部紧凑盒，不黏滞，两列排布 */
.kb-layout-inline .kb-toc-inner { position: static; max-height: none; margin-bottom: 4px; }
.kb-layout-inline .kb-toc-list { columns: 2; column-gap: 28px; }
.kb-layout-inline .kb-toc-li { break-inside: avoid; }
@media (max-width: 900px) {
    .kb-layout, .kb-layout-left-wide, .kb-layout-left-narrow, .kb-layout-wide, .kb-layout-inline {
        grid-template-columns: 1fr !important; gap: 22px;
    }
    .kb-toc { order: -1; }
    .kb-toc-inner { position: static; max-height: none; }
    .kb-layout-inline .kb-toc-list { columns: 1; }
}

/* ========== UI-05 响应式图片：懒加载 + 防抖动(CLS) + 淡入 ========== */
.dch-img {
    display: block;
    width: 100%;
    height: auto;
    /* 占位底色：图片未加载前先铺底，避免白闪与布局跳动 */
    background-color: var(--dch-ph, #0b1020);
    object-fit: cover;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity .45s ease, transform .45s ease;
}
.dch-img.loaded {
    opacity: 1;
    transform: none;
}
/* 尊重「减少动态效果」偏好（无障碍） */
@media (prefers-reduced-motion: reduce) {
    .dch-img { transition: none; transform: none; }
}
/* 全局内容图：兜底懒加载（首屏之外一律延迟，降低主线程阻塞） */
.case-gallery-item img,
.article-body img,
.rich-content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md, 10px);
}

/* ============================================================
   前台多主题切换器（访客端浮窗 · front-theme.js）
   采用中性深色玻璃，浮于任意主题之上，不依赖主题变量
   ============================================================ */
/* 主题切换器现为 #floatStack 内的一个 flex 子项（位于电话与回到顶部之间），
   不再独立 fixed 定位；后台关闭开关时该 DOM 不挂载，由 flex 自动等距重排其余图标。 */
.ft-switcher { position: relative; font-family: var(--font-cn, sans-serif); }
.ft-switcher-btn {
    width: 46px; height: 46px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--text-primary);
    background: var(--bg-drawer);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(12px) saturate(150%);
    -webkit-backdrop-filter: blur(12px) saturate(150%);
    box-shadow: 0 6px 22px var(--drawer-shadow);
    cursor: pointer; transition: transform .2s ease, box-shadow .2s ease;
}
.ft-switcher-btn:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 10px 30px var(--drawer-shadow); }
.ft-switcher-pop {
    position: absolute; right: 0; bottom: 56px;
    width: 268px; padding: 14px;
    background: var(--bg-drawer);
    border: 1px solid var(--glass-border);
    border-radius: 16px;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    box-shadow: 0 18px 50px var(--drawer-shadow);
    opacity: 0; visibility: hidden; transform: translateY(8px) scale(.98);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
    z-index: 9999;
}
.ft-switcher-pop.open { opacity: 1; visibility: visible; transform: none; }
.ft-switcher-head {
    font-size: 13px; font-weight: 600; color: var(--text-secondary);
    margin-bottom: 10px; letter-spacing: 1px;
}
.ft-switcher-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.ft-theme-card {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 9px; border-radius: 10px; cursor: pointer;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    color: var(--text-secondary); font-size: 12px; text-align: left;
    transition: background .18s ease, border-color .18s ease;
}
.ft-theme-card:hover { background: var(--surface-hover); }
.ft-theme-card.is-active { border-color: var(--c-cyan); background: color-mix(in srgb, var(--c-cyan) 14%, transparent); }
.ft-theme-swatch { display: inline-flex; gap: 2px; flex: 0 0 auto; }
.ft-theme-swatch i { width: 12px; height: 12px; border-radius: 3px; display: block; border: 1px solid var(--glass-border); }
.ft-theme-name { line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) {
    .ft-switcher-pop { width: 232px; }
    .ft-switcher-grid { grid-template-columns: 1fr; }
}

/* ===== 文章阅读页布局切换器（复用主题切换器视觉） ===== */
.al-switcher { position: relative; font-family: var(--font-cn, sans-serif); }
.al-switcher-btn {
    width: 46px; height: 46px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--text-primary);
    background: var(--bg-drawer);
    border: 1px solid var(--glass-border);
    backdrop-filter: blur(12px) saturate(150%);
    -webkit-backdrop-filter: blur(12px) saturate(150%);
    box-shadow: 0 6px 22px var(--drawer-shadow);
    cursor: pointer; transition: transform .2s ease, box-shadow .2s ease;
}
.al-switcher-btn:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 10px 30px var(--drawer-shadow); }
.al-switcher-pop {
    position: absolute; right: 0; bottom: 56px;
    width: 250px; padding: 14px;
    background: var(--bg-drawer);
    border: 1px solid var(--glass-border);
    border-radius: 16px;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    box-shadow: 0 18px 50px var(--drawer-shadow);
    opacity: 0; visibility: hidden; transform: translateY(8px) scale(.98);
    transition: opacity .22s ease, transform .22s ease, visibility .22s;
    z-index: 9999;
}
.al-switcher-pop.open { opacity: 1; visibility: visible; transform: none; }
.al-switcher-head {
    font-size: 13px; font-weight: 600; color: var(--text-secondary);
    margin-bottom: 10px; letter-spacing: 1px;
}
.al-switcher-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
.al-layout-card {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 10px; border-radius: 10px; cursor: pointer;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    color: var(--text-secondary); font-size: 13px; text-align: left;
    transition: background .18s ease, border-color .18s ease;
}
.al-layout-card:hover { background: var(--surface-hover); }
.al-layout-card.is-active { border-color: var(--c-cyan); background: color-mix(in srgb, var(--c-cyan) 14%, transparent); color: var(--text-primary); }
/* 布局示意 mini 图标 */
.al-layout-ico { display: inline-flex; gap: 2px; flex: 0 0 auto; align-items: stretch; width: 22px; height: 16px; }
.al-layout-ico i { display: block; border-radius: 2px; background: currentColor; opacity: .55; }
.al-layout-ico.wide i { width: 22px; height: 16px; }
.al-layout-ico.left-wide i:first-child { width: 13px; }
.al-layout-ico.left-wide i:last-child { width: 5px; }
.al-layout-ico.left-narrow i:first-child { width: 5px; }
.al-layout-ico.left-narrow i:last-child { width: 13px; }
.al-layout-ico.inline i { width: 22px; height: 4px; }
.al-layout-ico.inline i + i { display: none; }
.al-layout-name { line-height: 1.2; }
@media (max-width: 640px) {
    .al-switcher-pop { width: 220px; }
}

/* ===================================================================
   前台语言切换器（顶栏右侧 + 页脚）
   位置：顶部导航栏右侧（行业最佳实践），与主题切换器、回到顶部同为全局入口；
   配色全部走前台主题令牌，亮/暗主题下均保持高对比。
   =================================================================== */
.lang-switch { position: relative; display: inline-flex; }
.lang-btn {
    display: inline-flex; align-items: center; gap: 6px;
    height: 38px; padding: 0 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg-drawer) 82%, transparent);
    border: 1px solid var(--border-glass);
    color: var(--text-primary);
    font-size: 13px; font-weight: 600; letter-spacing: .3px; cursor: pointer;
    backdrop-filter: blur(8px);
    transition: border-color .25s, box-shadow .25s, transform .2s;
}
.lang-btn:hover { border-color: var(--c-cyan); transform: translateY(-1px); box-shadow: 0 0 16px color-mix(in srgb, var(--c-cyan) 35%, transparent); }
.lang-btn:focus-visible { outline: 2px solid var(--c-cyan); outline-offset: 2px; }
.lang-btn-icon { width: 18px; height: 18px; flex: 0 0 auto; }
.lang-btn-code { white-space: nowrap; }

.lang-popover {
    position: absolute; top: calc(100% + 10px); right: 0;
    width: 222px; padding: 10px;
    background: var(--bg-drawer);
    border: 1px solid var(--border-glass);
    border-radius: 14px;
    box-shadow: 0 18px 50px var(--drawer-shadow);
    backdrop-filter: blur(16px);
    z-index: 1200;
}
.lang-popover-header {
    font-size: 12px; font-weight: 600; color: var(--text-dim);
    padding: 4px 8px 8px; letter-spacing: .5px;
    border-bottom: 1px solid var(--hairline);
    margin-bottom: 8px;
}
.lang-popover-list { display: flex; flex-direction: column; gap: 4px; }
.lang-opt {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px; border-radius: 10px;
    color: var(--text-secondary); text-decoration: none;
    transition: background .2s, color .2s;
}
.lang-opt:hover { background: var(--surface-hover); color: var(--text-primary); }
.lang-opt.active { background: color-mix(in srgb, var(--c-cyan) 14%, transparent); color: var(--text-primary); }
.lang-opt.active::after { content: '✓'; margin-left: auto; color: var(--c-cyan); font-weight: 700; }
.lang-flag { font-size: 18px; line-height: 1; flex: 0 0 auto; }
.lang-name { font-weight: 600; }
.lang-code { margin-left: auto; font-size: 12px; color: var(--text-dim); white-space: nowrap; }

/* 页脚内联语言切换 */
.footer-lang { display: inline-flex; align-items: center; gap: 2px; }
.footer-lang-opt {
    padding: 2px 9px; border-radius: 999px;
    color: var(--text-dim); text-decoration: none; font-size: 13px;
    transition: color .2s, background .2s;
}
.footer-lang-opt:hover { color: var(--text-primary); background: var(--surface-hover); }
.footer-lang-opt.active { color: var(--c-cyan); font-weight: 600; }

@media (max-width: 640px) {
    .lang-btn-code { display: none; }
    .lang-popover { width: 200px; }
}

/* ===== Hero 横幅遮罩 · 随主题深浅适配（2026-07-27）=====
   默认（深色主题）：深遮罩，保证浅色文字可读；
   浅色主题（blue/gov-red/medical/snow/sand/mint/lavender/ocean，--text-primary 为深色）：
   改用浅遮罩，让淡色 Hero 图透出、深色文字可读。 */
.hero-banner-mask {
  position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(180deg, rgba(8,12,24,.72), rgba(8,12,24,.55));
  pointer-events: none;
}
:root[data-theme="blue"]     .hero-banner-mask,
:root[data-theme="gov-red"]  .hero-banner-mask,
:root[data-theme="medical"]  .hero-banner-mask,
:root[data-theme="snow"]     .hero-banner-mask,
:root[data-theme="sand"]     .hero-banner-mask,
:root[data-theme="mint"]     .hero-banner-mask,
:root[data-theme="lavender"] .hero-banner-mask,
:root[data-theme="ocean"]    .hero-banner-mask {
  background: linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,.20));
}