:root {
            --color-primary: #2563eb;
            --color-primary-deep: #1d4ed8;
            --color-primary-light: #60a5fa;
            --color-accent: #0d9488;
            --color-accent-warm: #f97316;
            --color-accent-soft: #fbbf24;
            --color-surface: #f8fafc;
            --color-surface-alt: #f1f5f9;
            --color-card: #ffffff;
            --color-text: #1e293b;
            --color-text-muted: #475569;
            --color-text-light: #64748b;
            --color-border: #e2e8f0;
            --color-border-hover: #cbd5e1;
            --color-shadow: rgba(30,64,175,0.06);
            --color-shadow-hover: rgba(37,99,235,0.14);
            --color-footer-bg: #0f172a;
            --color-footer-text: #cbd5e1;
            --color-tag-bg: #eff6ff;
            --color-tag-text: #1d4ed8;
            --color-success: #10b981;
            --gradient-hero: linear-gradient(135deg, #1e40af 0%, #2563eb 28%, #0d9488 62%, #0891b2 100%);
            --gradient-btn: linear-gradient(135deg, #2563eb, #0d9488);
            --gradient-btn-hover: linear-gradient(135deg, #1d4ed8, #0f766e);
            --radius-sm: 8px;
            --radius-md: 14px;
            --radius-lg: 20px;
            --radius-full: 50px;
            --transition: 0.2s ease;
        }
        * { margin:0; padding:0; box-sizing:border-box; }
        body {
            font-family: system-ui, -apple-system, 'Segoe UI', 'Roboto', 'Helvetica Neue', 'Noto Sans SC', sans-serif;
            background: var(--color-surface); color: var(--color-text); line-height:1.6;
            scroll-behavior: smooth; -webkit-font-smoothing: antialiased; font-display: swap;
        }
        .container { max-width:1240px; margin:0 auto; padding:0 20px; }
        /* 导航栏 */
        .header {
            background: rgba(255,255,255,0.95); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
            box-shadow: 0 1px 3px var(--color-shadow); position: sticky; top:0; z-index:50;
            border-bottom:1px solid var(--color-border);
        }
        .navbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:12px 0; gap:12px; }
        .logo {
            font-size:1.55rem; font-weight:750; background:var(--gradient-hero); background-clip:text;
            -webkit-background-clip:text; color:transparent; letter-spacing:-0.02em; text-decoration:none; white-space:nowrap;
        }
        .nav-links { display:flex; gap:18px; align-items:center; flex-wrap:wrap; list-style:none; }
        .nav-links a {
            text-decoration:none; font-weight:520; color:#334155; transition:color var(--transition);
            font-size:0.9rem; white-space:nowrap; position:relative; padding:4px 0;
        }
        .nav-links a::after {
            content:''; position:absolute; bottom:-2px; left:0; width:0; height:2px;
            background:var(--color-primary); border-radius:2px; transition:width var(--transition);
        }
        .nav-links a:hover::after, .nav-links a.active::after { width:100%; }
        .nav-links a:hover, .nav-links a.active { color:var(--color-primary); }
        .nav-links .btn-nav-cta {
            background:var(--gradient-btn); color:#fff !important; padding:7px 18px; border-radius:var(--radius-full);
            font-weight:600; transition:all var(--transition); font-size:0.85rem; letter-spacing:0.02em;
        }
        .nav-links .btn-nav-cta::after { display:none; }
        .nav-links .btn-nav-cta:hover { background:var(--gradient-btn-hover); transform:translateY(-1px); box-shadow:0 4px 14px -4px rgba(37,99,235,0.4); }
        .nav-toggle { display:none; background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--color-text); padding:4px 8px; }
        @media (max-width:860px) {
            .nav-links { display:none; flex-direction:column; width:100%; gap:6px; padding-top:8px; }
            .nav-links.open { display:flex; }
            .nav-toggle { display:block; }
            .nav-links a { padding:8px 4px; font-size:0.88rem; width:100%; }
            .nav-links .btn-nav-cta { text-align:center; margin-top:4px; }
        }
        /* Hero */
        .page-hero {
            padding:56px 0 32px; text-align:center;
            background: linear-gradient(170deg, #f8fafc 0%, #eff6ff 35%, #f0fdfa 70%, #fff 100%);
        }
        .page-hero h1 {
            font-size:clamp(1.8rem,4.5vw,2.4rem); font-weight:800; background:var(--gradient-hero);
            background-clip:text; -webkit-background-clip:text; color:transparent; margin-bottom:10px; letter-spacing:-0.02em;
        }
        .page-hero .sub { color:var(--color-text-muted); font-size:1rem; max-width:620px; margin:0 auto 16px; }
        .section-title { text-align:center; font-size:1.5rem; font-weight:720; margin-bottom:6px; }
        .section-desc { text-align:center; color:var(--color-text-muted); margin-bottom:26px; font-size:0.9rem; }
        /* 知识库模块布局 */
        .knowledge-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; margin:20px auto; max-width:1000px; }
        .knowledge-card {
            background:var(--color-card); border:1px solid var(--color-border); border-radius:var(--radius-md);
            padding:22px 18px; transition:all var(--transition); cursor:pointer;
            display:flex; flex-direction:column; gap:10px;
        }
        .knowledge-card:hover {
            border-color:var(--color-primary-light); box-shadow:0 8px 22px -10px var(--color-shadow-hover);
            transform:translateY(-3px);
        }
        .knowledge-card .card-icon { font-size:1.8rem; }
        .knowledge-card h3 { font-size:1.05rem; font-weight:700; }
        .knowledge-card p { font-size:0.82rem; color:var(--color-text-muted); line-height:1.5; }
        .knowledge-card .card-link {
            margin-top:auto; font-size:0.8rem; color:var(--color-primary); font-weight:600;
            text-decoration:none; display:flex; align-items:center; gap:4px;
        }
        .knowledge-card .card-link:hover { text-decoration:underline; }
        /* 详情模态样式（点击展开） */
        .modal-overlay {
            display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(15,23,42,0.7);
            z-index:100; justify-content:center; align-items:center; padding:20px;
        }
        .modal-overlay.active { display:flex; }
        .modal-content {
            background:var(--color-card); border-radius:var(--radius-lg); max-width:600px; width:100%;
            max-height:80vh; overflow-y:auto; padding:28px 24px; position:relative;
        }
        .modal-close {
            position:absolute; top:12px; right:16px; background:none; border:none; font-size:1.5rem;
            cursor:pointer; color:var(--color-text-muted);
        }
        .modal-content h3 { font-size:1.2rem; margin-bottom:12px; }
        .modal-content p, .modal-content li { font-size:0.88rem; color:var(--color-text-muted); line-height:1.6; }
        .modal-content ul { padding-left:1.2em; margin:8px 0; }
        /* 底部CTA */
        .cta-bottom {
            background:var(--color-footer-bg); color:#e2e8f0; padding:40px 0; text-align:center;
        }
        .cta-bottom h2 { color:#fff; font-size:1.6rem; margin-bottom:8px; }
        .cta-bottom p { color:#cbd5e1; margin-bottom:18px; font-size:0.9rem; }
        .btn-cta-big {
            display:inline-block; background:var(--gradient-btn); color:#fff; font-weight:700; padding:14px 34px;
            border-radius:var(--radius-full); text-decoration:none; font-size:1.05rem; transition:all 0.25s ease;
            box-shadow:0 8px 20px -6px rgba(37,99,235,0.5);
        }
        .btn-cta-big:hover { background:var(--gradient-btn-hover); transform:translateY(-2px); box-shadow:0 12px 26px -8px rgba(37,99,235,0.6); }
        /* 页脚 */
        .footer {
            background:#0a0f1a; color:#cbd5e1; padding:44px 0 24px; font-size:0.82rem; border-top:1px solid #1e293b;
        }
        .footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:30px; margin-bottom:30px; }
        .footer-col h4 { color:#fff; margin-bottom:12px; font-weight:620; font-size:0.85rem; }
        .footer-col a { display:block; color:#94a3b8; text-decoration:none; margin-bottom:7px; transition:color var(--transition); font-size:0.78rem; }
        .footer-col a:hover { color:#fff; }
        .copyright { text-align:center; padding-top:22px; border-top:1px solid #1e293b; color:#64748b; font-size:0.72rem; }
        @media (max-width:768px) {
            .knowledge-grid { grid-template-columns:1fr; }
        }