:root {
            --bg-body: #f8fafc;
            --bg-card: #ffffff;
            --text-main: #334155;
            --text-title: #0f172a;
            --text-light: #64748b;
            --border-color: #e2e8f0;
            --primary: #2563eb;
            --primary-light: #eff6ff;

            --notice-blue-bg: #eff6ff;   --notice-blue-text: #1d4ed8;
            --notice-purple-bg: #faf5ff; --notice-purple-text: #6b21a8;
            --notice-orange-bg: #fff7ed; --notice-orange-text: #c2410c;
            --notice-green-bg: #f0fdf4;  --notice-green-text: #15803d;

            --radius-card: 16px;
            --radius-box: 8px;
            --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
            --shadow-hover: 0 10px 25px -5px rgba(37, 99, 235, 0.1);
        }

        html {
            scroll-behavior: smooth;
            scroll-padding-top: 2rem;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            line-height: 1.75;
            color: var(--text-main);
            background-color: var(--bg-body);
        }

        /* =========================================
           顶部阅读进度条
           ========================================= */
        #progress-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: transparent;
            z-index: 9999;
        }

        #progress-bar {
            height: 100%;
            background: linear-gradient(90deg, #3b82f6 0%, #1d4ed8 100%);
            width: 0%;
            transition: width 0.1s ease;
            border-radius: 0 2px 2px 0;
        }

        /* =========================================
           核心布局：侧边栏 + 主内容区
           ========================================= */
        .layout-wrapper {
            display: flex;
            /* 1508px - 左右padding(64px) = 中间内容区域 1444px */
            max-width: 1508px;
            margin: 0 auto;
            padding: 2rem;
            gap: 2.5rem;
            align-items: flex-start;
        }

        /* --- 左侧悬浮目录 --- */
        .sidebar {
            width: 280px;
            flex-shrink: 0;
            position: sticky;
            top: 2rem;
            height: calc(100vh - 4rem);
            overflow-y: auto;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: var(--radius-card);
            padding: 1.5rem;
            box-shadow: var(--shadow-card);
        }

        .sidebar::-webkit-scrollbar { width: 4px; }
        .sidebar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

        .sidebar-title {
            font-size: 1.1rem;
            font-weight: 800;
            color: var(--text-title);
            margin-bottom: 1.25rem;
            padding-bottom: 0.75rem;
            border-bottom: 2px solid var(--primary-light);
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .toc-menu { list-style: none; }
        .toc-menu > li { margin-bottom: 0.5rem; }
        .toc-menu a {
            text-decoration: none;
            color: var(--text-main);
            font-size: 0.95rem;
            display: block;
            padding: 0.4rem 0.6rem;
            border-radius: 6px;
            transition: all 0.3s ease;
            font-weight: 700;
        }
        .toc-menu a:hover { background: var(--primary-light); color: var(--primary); }

        .toc-sub { list-style: none; margin-top: 0.2rem; border-left: 2px solid var(--border-color); margin-left: 0.7rem; padding-left: 0.5rem; }
        .toc-sub li { margin-bottom: 0.2rem; }
        .toc-sub a { font-size: 0.85rem; font-weight: 500; color: var(--text-light); }
        .toc-sub a:hover { color: var(--primary); }

        /* --- 右侧主内容区 --- */
        .main-content {
            flex-grow: 1;
            min-width: 0;
        }

        .page-header {
            text-align: center;
            margin-bottom: 3rem;
            padding: 4rem 2rem;
            background: linear-gradient(135deg, #0f172a, #1e3a8a);
            border-radius: var(--radius-card);
            color: white;
            box-shadow: var(--shadow-card);
        }

        .page-header h1 { font-size: 2.2rem; margin-bottom: 1rem; font-weight: 800; letter-spacing: -0.5px; }
        .page-header p { font-size: 1.1rem; color: #cbd5e1; max-width: 800px; margin: 0 auto; }

        .section-title { font-size: 1.7rem; font-weight: 800; color: var(--text-title); margin: 4rem 0 1.5rem 0; display: flex; align-items: center; gap: 0.5rem; }
        .sub-title { font-size: 1.3rem; font-weight: 700; color: var(--text-title); margin: 2.5rem 0 1.5rem 0; border-left: 4px solid var(--primary); padding-left: 0.75rem; }
        .section-desc { margin-bottom: 2rem; color: var(--text-light); font-size: 1.05rem; background: var(--bg-card); padding: 1.5rem; border-radius: var(--radius-box); border-left: 4px solid var(--primary); }

        /* --- 卡片组件 --- */
        .card-grid { display: grid; gap: 1.5rem; margin-bottom: 2rem; }
        .cols-3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
        .cols-2 { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }

        .feature-card, .wide-card {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: var(--radius-card);
            padding: 2rem;
            display: flex;
            flex-direction: column;
            box-shadow: var(--shadow-card);
            transition: all 0.3s ease;
        }

        .feature-card:hover, .wide-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); border-color: #bfdbfe; }

        .card-header { font-size: 1.2rem; font-weight: 700; color: var(--text-title); margin-bottom: 1.2rem; }
        .feature-card p, .wide-card p { color: var(--text-light); margin-bottom: 1rem; font-size: 0.95rem; flex-grow: 1; }
        .feature-card strong, .wide-card strong { color: var(--text-title); font-weight: 600; }

        /* 提示框 */
        .notice-box { padding: 1rem 1.2rem; border-radius: var(--radius-box); font-size: 0.9rem; line-height: 1.6; margin-top: auto; }
        .notice-box strong { color: inherit; }
        .notice-blue { background: var(--notice-blue-bg); color: var(--notice-blue-text); }
        .notice-purple { background: var(--notice-purple-bg); color: var(--notice-purple-text); }
        .notice-orange { background: var(--notice-orange-bg); color: var(--notice-orange-text); }

        /* 列表优化 */
        .info-list { list-style: none; padding-left: 0; margin-bottom: 1rem;}
        .info-list > li { position: relative; padding-left: 1.5rem; margin-bottom: 0.75rem; color: var(--text-light); font-size: 0.95rem; }
        .info-list > li::before { content: '✦'; position: absolute; left: 0; color: var(--primary); font-size: 1rem; top: -1px;}

        .step-list { list-style: none; padding-left: 0; counter-reset: steps; margin-bottom: 1rem;}
        .step-list > li { position: relative; padding-left: 2.2rem; margin-bottom: 0.8rem; color: var(--text-light); font-size: 0.95rem; }
        .step-list > li::before { content: counter(steps); counter-increment: steps; position: absolute; left: 0; top: 0.1rem; background: var(--primary-light); color: var(--primary); width: 1.4rem; height: 1.4rem; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: bold; }

        @media (max-width: 1024px) {
            .layout-wrapper { flex-direction: column; padding: 1rem; gap: 1rem; }
            .sidebar { width: 100%; position: static; height: auto; max-height: 350px; }
            .page-header { padding: 3rem 1.5rem; }
            .cols-3, .cols-2 { grid-template-columns: 1fr; }
        }

        /* 头部开始 */
        .hamburger{position:fixed;right:0;top:0;background-color:#fff;z-index:11;display:none;width:100%}
        .hamburger a{color:inherit;text-decoration: none}
        .hamburger .h-icon{position:absolute;right:11%;top:33px;cursor:pointer}
        .hamburger .h-icon i{float:left;clear:left;width:20px;height:2px;margin-bottom:5px;background-color:#333;transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-o-transition:all .3s}
        .hamburger .h-icon .m{width:15px}
        .hamburger .h-icon .text{position:absolute;left:-80px;top:-4px;font-size:16px;color:#333;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
        .hamburger .box{position:relative;width:100%;height:calc(100% - 100px);height:-moz-calc(100% - 100px);height:-webkit-calc(100% - 100px);display:none;overflow:scroll;}
        .hamburger .box-inner{position:relative;width:100%;height:100%;min-height:430px;overflow:hidden;}
        .hamburger .box .list{position:absolute;list-style: none;left:0;top:50%;width:100%;line-height:50px;padding-bottom:3em;transform:translate(0,-50%);-ms-transform:translate(0,-50%);-webkit-transform:translate(0,-50%);-o-transform:translate(0,-50%);-moz-transform:translate(0,-50%)}
        .hamburger .box .list li{padding:0 1em;font-size:20px;font-weight:700;text-align:center;transition:all .6s;-moz-transition:all .6s;-webkit-transition:all .6s;-o-transition:all .6s;position:relative;left:100%;top:0}
        .hamburger .box .list li a:hover{color:#0168b5}
        .hamburger .box .bottom{position:absolute;left:0;bottom:-90px;width:100%;text-align:center;margin-bottom:20px;transition:all .6s ease .3s;-moz-transition:all .6s ease .3s;-webkit-transition:all .6s ease .3s;-o-transition:all .6s ease .3s}
        .hamburger .box .bottom *{display:inline-block;width:100%;line-height:30px}
        .hamburger .box .bottom b{font-size:16px}
        .hamburger.open{width:100%;height:100%;top:80px}
        .hamburger.open .h-icon{top:-47px}
        .hamburger.open .h-icon .t{-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);-webkit-transform-origin:3%;-ms-transform-origin:3%;-o-transform-origin:3%;transform-origin:3%}
        .hamburger.open .h-icon .b{-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:3%;-ms-transform-origin:3%;-o-transform-origin:3%;transform-origin:3%}
        .hamburger.open .h-icon .m{opacity:0}
        .hamburger.open .box{display:block;position:relative;border-top:1px solid #e4eaec;padding-top:10px}
        .page-top{float:left;width:100%;height:110px;border-top:5px solid #101519}
        .page-top a{color:inherit;text-decoration: none}
        .page-top .container{max-width: 1470px;padding:0 1rem;margin:0 auto;}
        .page-top .logo{float:left;position:relative;z-index:1;width:233px;margin-right:26px;margin-top:27px}
        .page-top .logo img{width:100%}
        .page-top .bod{float:left;width:calc(100% - 260px);width:-moz-calc(100% - 260px);width:-webkit-calc(100% - 260px);font-size:15px}
        .page-top .bod .desc{padding:20px 4px 8px 10px;border-bottom:1px solid #c5c6c7}
        .page-top .bod .desc .l{color:#555}
        .page-top .bod .desc .r{float:right; }
        .page-top .bod .desc .r img{vertical-align:middle;margin-right:5px}
        .page-top .bod .desc .r i{display:inline-block;width:19px;height:19px;background:url(page-top-tel.png);vertical-align:middle;margin-right:3px}
        .page-top .bod .menu-list{margin-top:8px;margin-left:10px;display:inline-block}
        .page-top .bod .menu-list li{position:relative;display:inline-block}
        .page-top .bod .menu-list li a{margin:0 28px}
        .page-top .bod .menu-list li a:hover{color:#0168b5}
        .page-top .bod .menu-list li:first-child a{margin-left:0}
        .page-top .bod .menu-list li:last-child a{margin-right:0}
        /*.page-top .bod .menu-list li:after{content:"•";float:right;font-size:12px;position:absolute;right:-6px;top:0;line-height:20px}*/
        .page-top .bod .menu-list li:last-child:after{content:""}
        .page-top .bod .contact-menu{float:right;margin-top:8px;margin-right:2px}
        .page-top .bod .contact-menu a:hover{color:#0168b5}
        .page-top .bod .contact-menu span{margin:0 27px}
        .top-box-shadow{box-shadow:0 3px 5px 0 rgba(51,51,51,.5);width:100%;position:fixed;left:0;top:0;background-color:#fff;z-index:10}
        .top-box-bag{width:100%;position:relative;height:110px}
        @media screen and (max-width:1460px){.page-top .bod .menu-list li a{margin:0 20px}}@media screen and (max-width:1400px){.page-top .bod .menu-list li a{margin:0 1em}}@media screen and (max-width:1300px){.page-top .bod .menu-list li a{margin:0 10px}.page-top .bod .menu-list li:after{content:"•";float:right;font-size:12px;position:absolute;right:-6px;top:0;line-height:20px}.page-top .bod .contact-menu span{margin:0 10px}}@media screen and (max-width:1200px){.page-top .bod .contact-menu a:first-child{display:none}.page-top .bod .contact-menu span{display:none}}@media screen and (max-width:1100px){.page-top .logo{width:150px;margin-top:35px}.page-top .bod{width:calc(100% - 176px);width:-moz-calc(100% - 176px);width:-webkit-calc(100% - 176px)}}@media screen and (max-width:950px){.hamburger{display:block}.page-top{border-top:0;height:80px}.page-top .logo{margin-top:22px}.page-top .bod .desc{display:none}.page-top .bod .menu-list{display:none}.top-box-bag{height:80px}.page-top .bod .contact-menu{display:none}}@media screen and (max-width:900px){.hamburger .h-icon{right:3%}}@media screen and (max-width:320px){.hamburger .box .bottom{display:none}}
        /* 头部结束 */

        /* 底部开始 */
        .site-footer {padding-bottom: 20px;}
        .site-footer a{text-decoration: none!important;color:inherit}
        .site-footer .container{max-width: 1530px;margin:0 auto;}
        .site-footer .footer-blue-box {
            background-color: #0168b7;
            color: #fff;
            margin: 60px 0 63px 0;
            padding: 100px 90px 100px 0;
            display: flex;
            align-items: center;
            position: relative;
            cursor: default;
        }

        .site-footer .hover-frame {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: 1px solid #fff;
            z-index: 1;
            opacity: 0;
            transition: all 0.3s;
        }

        .site-footer .footer-blue-box:hover .hover-frame {
            top: 7%;
            left: 3%;
            width: 94%;
            height: 86%;
            opacity: 1;
        }

        .site-footer .contact-box {
            background: #2a2a2a;
            color: #fff;
            font-size: 40px;
            font-family: 宋体;
            padding: 24px 40px 38px 48px;
            line-height: 1.8;
            letter-spacing: 2px;
            flex-shrink: 0;
            position: relative;
            z-index: 2;
            margin-right: 60px;
        }

        .site-footer .contact-info {
            flex-grow: 1;
            position: relative;
            z-index: 2;
        }
        .site-footer .contact-info h2 { font-size: 60px; font-weight: 700; margin-bottom: 20px; line-height: 1em}
        .site-footer .contact-info > p { font-size: 30px; margin-bottom: 30px; line-height: 1.5em}

        .site-footer .action-row { display: flex; align-items: center; gap: 50px; }
        .site-footer .phone-box { font-size: 18px; }
        .site-footer .phone-box strong { display: block; font-size: 30px; font-weight: normal;line-height: 1em;margin-top: 5px}

        .site-footer .btn-group { display: flex; gap: 32px; }
        .site-footer .btn-action {
            background-color: #e83f3f;
            color: #fff;
            padding: 10px 30px;
            font-size: 15px;
            border: 1px solid rgba(255,255,255,0.7);
            width: 132px;
            text-align: center;
        }
        .site-footer .btn-action:hover {
            background-color: #fff;
            color: #0168b7;
        }

        .site-footer .qr-section {
            text-align: center;
            font-size: 18px;
            flex-shrink: 0;
            position: relative;
            z-index: 2;
            padding: 8px;
        }

        .site-footer .qr-wrapper {
            background: #fff;
            width: 169px;
            height: 169px;
            margin-bottom: 20px;
            position: relative;
        }
        .site-footer .qr-wrapper img { display: block; width: 100%; height: 100%; }

        .site-footer .qr-target-corners {
            aspect-ratio: 1;
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background:
                    linear-gradient(#fff, #fff) top left / 1px 36px no-repeat,
                    linear-gradient(#fff, #fff) top left / 36px 1px no-repeat,
                    linear-gradient(#fff, #fff) top right / 1px 36px no-repeat,
                    linear-gradient(#fff, #fff) top right / 36px 1px no-repeat,
                    linear-gradient(#fff, #fff) bottom left / 1px 36px no-repeat,
                    linear-gradient(#fff, #fff) bottom left / 36px 1px no-repeat,
                    linear-gradient(#fff, #fff) bottom right / 1px 36px no-repeat,
                    linear-gradient(#fff, #fff) bottom right / 36px 1px no-repeat;
            transform-origin: center;
            animation: qr-corner-pulse 1.1s ease-in-out infinite;
        }
        @keyframes qr-corner-pulse {
            0%, 49% {
                transform: scale(1);
            }
            50%, 100% {
                transform: scale(0.97);
            }
        }

        .site-footer .footer-white-info {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 14px;
            line-height: 1.8;
            padding-bottom: 63px;
            border-bottom: 1px solid #f0f2f5;
            color:#363333;
        }

        .site-footer .slogan-bottom { font-size: 30px; font-weight: bold; font-style: italic; color: #363333; display: flex; align-items: center; gap: 30px; }
        .site-footer .slogan-bottom::before { content: ""; display: block; width: 66px; height: 2px; background-color: #363333; }

        .site-footer .footer-copyright { text-align: center; padding: 20px 0 0 0; font-size: 14px; color: #5e7387; line-height: 1.5em; }
        .site-footer .footer-copyright a:hover { color: #0168b7; text-decoration: underline; }
        @media (max-width: 1300px) {
            .site-footer .qr-section{display: none}
        }
        @media (max-width: 1024px) {
            .site-footer .footer-blue-box:hover .hover-frame, .footer-blue-box:hover .qr-target-corners { display: none; }
            .site-footer .footer-blue-box { flex-direction: column; padding: 0 40px 40px 40px; text-align: center; gap: 30px;margin-bottom: 50px }
            .site-footer .contact-box {top:0; margin: 0 0 50px 0; padding: 20px; }
            .site-footer .contact-info h2 { font-size: 25px; }
            .site-footer .contact-info > p{
                font-size: 17px;
                color:rgba(255,255,255,.3);
            }
            .site-footer .action-row { flex-direction: column; gap: 28px; justify-content: center; }

            .site-footer .footer-white-info { flex-wrap: wrap; gap: 20px; justify-content: center; text-align: center; padding-bottom: 30px}
            .site-footer .slogan-bottom { justify-content: center; width: 100%; margin-bottom: 10px; display: none}
            .site-footer .phone-box{font-size: 15px;}
            .site-footer .phone-box strong{font-size: inherit}
        }

        @media (max-width: 768px) {
        }