:root {
            --bg: #f6f9fc;
            --surface: #ffffff;
            --surface-alt: #f0f5f9;
            --text: #1a2e3f;
            --text2: #4b6a88;
            --text3: #6a8296;
            --accent: #1a7f8c;
            --accent2: #0f5560;
            --accent-light: #e6f2f5;
            --border: #e1e8f0;
            --border-light: #eef3f8;
            --green: #2ecc71;
            --amber: #f0a030;
            --purple: #6b3fa0;
            --shadow-sm: 0 2px 8px rgba(0,0,0,0.03);
            --shadow: 0 8px 28px rgba(0,0,0,0.06);
            --shadow-lg: 0 16px 40px rgba(0,0,0,0.08);
            --radius-sm: 12px;
            --radius: 18px;
            --radius-lg: 24px;
            --radius-xl: 32px;
            --font: 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
            --font-mono: 'SF Mono', 'JetBrains Mono', 'Consolas', monospace;
            --transition: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
        }
        * { margin:0; padding:0; box-sizing:border-box; }
        body {
            font-family: var(--font);
            background: var(--bg);
            color: var(--text);
            line-height: 1.55;
            -webkit-font-smoothing: antialiased;
            letter-spacing: -0.01em;
        }
        .container { max-width:1260px; margin:0 auto; padding:0 20px; }

        /* 导航栏 - 与首页一致 */
        .navbar {
            background: rgba(255,255,255,0.94);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            border-bottom:1px solid var(--border);
            position:sticky; top:0; z-index:100;
        }
        .nav-inner {
            display:flex; align-items:center; justify-content:space-between;
            flex-wrap:wrap; gap:15px; padding:14px 0;
        }
        .logo {
            font-size:1.6rem; font-weight:750; letter-spacing:-0.5px;
            background:linear-gradient(135deg, #1a7f8c, #0f5560);
            -webkit-background-clip:text; background-clip:text;
            color:transparent;
            display:flex; align-items:center; gap:6px;
        }
        .logo::before { content:'⚡'; font-size:1.3rem; color:#1a7f8c; background:none; -webkit-background-clip:unset; background-clip:unset; }
        .nav-links { display:flex; gap:4px; flex-wrap:wrap; align-items:center; }
        .nav-links a {
            text-decoration:none; font-weight:550; color:var(--text2);
            padding:8px 15px; border-radius:22px; font-size:0.9rem;
            transition:var(--transition); white-space:nowrap;
        }
        .nav-links a:hover, .nav-links a.active { background:var(--accent-light); color:var(--accent); }
        .nav-cta {
            background:var(--accent)!important; color:#fff!important;
            font-weight:620!important; padding:9px 20px!important;
            box-shadow:0 4px 14px rgba(26,127,140,0.28);
        }
        .nav-cta:hover { background:var(--accent2)!important; transform:translateY(-1px); }

        /* 页面头部 */
        .page-hero {
            background: linear-gradient(150deg, #eef5fc 0%, #ffffff 60%, #f8fafc 100%);
            padding: 52px 0 36px;
            text-align: center;
            border-bottom:1px solid var(--border-light);
        }
        .page-hero .eyebrow {
            display:inline-flex; align-items:center; gap:7px;
            background:var(--accent-light); color:var(--accent);
            padding:5px 14px; border-radius:20px; font-size:0.78rem;
            font-weight:600; letter-spacing:0.03em; margin-bottom:16px;
        }
        .page-hero h1 { font-size:2.6rem; font-weight:800; letter-spacing:-0.8px; color:#0c1f2b; margin-bottom:10px; }
        .page-hero p { font-size:1.05rem; color:var(--text2); max-width:680px; margin:0 auto; }

        /* 通用区块 */
        .section { padding: 40px 0; }
        .section-title { font-size:1.8rem; font-weight:750; margin-bottom:12px; letter-spacing:-0.5px; }
        .section-sub { color:var(--text2); margin-bottom:28px; font-size:0.95rem; }

        .tip-box {
            background:var(--accent-light); border-left:4px solid var(--accent);
            padding:12px 18px; border-radius:12px; font-size:0.9rem;
            color:var(--text2); margin:16px 0;
        }
        .info-card {
            background:var(--surface); border-radius:var(--radius);
            padding:24px; border:1px solid var(--border);
            box-shadow:var(--shadow-sm); margin:20px 0;
        }

        /* 流量路径模拟器 */
        .flow-simulator {
            background: var(--surface);
            border-radius: var(--radius-lg);
            padding: 28px;
            border:1px solid var(--border);
            box-shadow: var(--shadow-sm);
            margin: 30px 0;
            text-align: center;
        }
        .flow-steps {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 10px;
            margin: 20px 0;
        }
        .flow-step {
            background: var(--surface-alt);
            border-radius: 30px;
            padding: 12px 20px;
            font-weight: 600;
            font-size: 0.9rem;
            border: 1px solid var(--border);
            transition: var(--transition);
            cursor: pointer;
            text-decoration: none;
            color: var(--text);
        }
        .flow-step:hover {
            border-color: var(--accent);
            color: var(--accent);
            background: #fff;
        }
        .flow-arrow {
            font-size: 1.2rem;
            color: var(--accent);
            font-weight: 700;
        }
        .flow-desc {
            font-size: 0.85rem;
            color: var(--text3);
            margin-top: 12px;
        }

        /* 对比卡片 */
        .compare-grid {
            display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr));
            gap:18px; margin: 20px 0 30px;
        }
        .mode-card {
            background:var(--surface); border-radius:var(--radius);
            padding:24px 18px; border:1px solid var(--border);
            box-shadow:var(--shadow-sm); transition:var(--transition);
            text-align:center;
        }
        .mode-card:hover { transform:translateY(-3px); box-shadow:var(--shadow); }
        .mode-icon { font-size:2.2rem; margin-bottom:10px; }
        .mode-card h3 { font-weight:700; margin-bottom:8px; }
        .mode-card p { color:var(--text2); font-size:0.9rem; }

        /* 步骤卡片 */
        .step-list {
            display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
            gap:16px; margin:20px 0;
        }
        .step-item {
            background:var(--surface); border-radius:var(--radius);
            padding:20px; border:1px solid var(--border);
            box-shadow:var(--shadow-sm); text-align:center;
        }
        .step-num {
            width:40px; height:40px; border-radius:50%;
            background:var(--accent); color:#fff; font-weight:750;
            display:flex; align-items:center; justify-content:center;
            margin:0 auto 10px; font-size:1.1rem;
        }

        /* 场景卡片 */
        .scene-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px,1fr)); gap:18px; margin:20px 0; }
        .scene-card {
            background:var(--surface); border-radius:var(--radius);
            padding:22px 18px; border:1px solid var(--border);
            box-shadow:var(--shadow-sm); transition:var(--transition);
        }
        .scene-card:hover { border-color:var(--accent); box-shadow:var(--shadow); }
        .scene-card h4 { font-weight:700; margin-bottom:6px; }
        .scene-card p { color:var(--text2); font-size:0.88rem; margin-bottom:10px; }
        .scene-link { color:var(--accent); font-weight:600; text-decoration:none; font-size:0.85rem; }

        /* 底部推荐矩阵 */
        .bottom-matrix {
            display:grid; grid-template-columns:repeat(auto-fit, minmax(170px,1fr));
            gap:14px; margin:30px 0;
        }
        .matrix-item {
            background:var(--surface); border-radius:var(--radius);
            padding:20px 16px; text-align:center; border:1px solid var(--border);
            box-shadow:var(--shadow-sm); text-decoration:none; color:var(--text);
            transition:var(--transition);
        }
        .matrix-item:hover { border-color:var(--accent); box-shadow:var(--shadow); transform:translateY(-2px); }
        .matrix-icon { font-size:1.8rem; margin-bottom:8px; }
        .matrix-item h4 { font-weight:650; }

        /* CTA */
        .cta-download {
            text-align:center; padding:38px 20px;
            background:linear-gradient(135deg, #0c2530, #0f2f3b);
            border-radius:var(--radius-xl); color:#fff; margin:40px 0 30px;
        }
        .cta-download h2 { font-size:1.7rem; font-weight:750; margin-bottom:10px; }
        .cta-download p { color:#bcd0df; margin-bottom:20px; }
        .btn-download-cta {
            display:inline-flex; align-items:center; gap:8px;
            background:#fff; color:#0c2530; padding:14px 30px;
            border-radius:28px; font-weight:650; text-decoration:none;
            transition:var(--transition); box-shadow:0 8px 20px rgba(0,0,0,0.3);
        }
        .btn-download-cta:hover { background:#e6f0f4; transform:translateY(-2px); }

        /* 页脚 - 与首页一致 */
        .footer {
            background:#0c1a22; color:#8aa0b4; padding:30px 0 20px;
            text-align:center; border-radius:28px 28px 0 0; margin-top:20px;
        }
        .footer-links { display:flex; justify-content:center; gap:24px; flex-wrap:wrap; margin-bottom:14px; }
        .footer-links a { color:#bcd0df; text-decoration:none; font-size:0.85rem; transition:var(--transition); }
        .footer-links a:hover { color:#fff; }
        .copyright { font-size:0.72rem; color:#6a8296; }

        @media(max-width:768px) {
            .page-hero h1 { font-size:2rem; }
            .nav-inner { flex-direction:column; }
            .flow-steps { flex-direction:column; }
            .flow-arrow { transform:rotate(90deg); }
        }