*,
        *::before,
        *::after {
            margin: 0;
            padding: 0;
            box-sizing: border-box
        }
        
         :root {
            --charcoal: #0d0f12;
            --charcoal-2: #15181c;
            --charcoal-3: #1e2228;
            --copper: #003d82;
            --copper-light: #2563eb;
            --copper-dark: #001d3d;
            --amber: #60a5fa;
            --cream: #f1f5f9;
            --cream-2: #e2e8f0;
            --warm-gray: #64748b;
            --warm-gray-light: #94a3b8;
            --text-dark: #1e2228;
            --text-body: #475569;
            --white: #fff;
            --border: rgba(255, 255, 255, .06);
            --ease: cubic-bezier(.16, 1, .3, 1);
            --ease-out: cubic-bezier(.25, .46, .45, .94);
        }
        
        html {
            scroll-behavior: smooth;
            font-size: 16px;
            scrollbar-width: none
        }
        
        html::-webkit-scrollbar {
            display: none
        }
        
        html,
        body {
            height: 100%;
            margin: 0;
            padding: 0
        }
        
        body {
            font-family: "Helvetica Neue", "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
            color: var(--text-dark);
            background: var(--cream);
            line-height: 1.7;
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
            scrollbar-width: none;
        }
        
        body::-webkit-scrollbar {
            display: none
        }
        
        a {
            text-decoration: none;
            color: inherit
        }
        
        ul {
            list-style: none
        }
        
        img {
            max-width: 100%;
            display: block
        }
        
        body>div.site-footer>footer>div.footer-top>div.footer-logo>a>img {
            width: 200px;
        }
        
        .container {
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 40px
        }
        
        .container-wide {
            max-width: 1480px;
            margin: 0 auto;
            padding: 0 40px
        }
        
        header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1000;
            background: var(--charcoal);
            transition: all .5s var(--ease);
        }
        
        .lang-switch {
            display: inline-flex;
            align-items: center;
            gap: 2px;
            background: rgba(255, 255, 255, .08);
            border-radius: 20px;
            padding: 2px;
        }
        
        .lang-btn {
            background: none;
            border: none;
            color: rgba(255, 255, 255, .5);
            font-size: .7rem;
            font-weight: 600;
            padding: 5px 12px;
            border-radius: 18px;
            cursor: pointer;
            transition: all .3s;
        }
        
        .lang-btn.active {
            background: var(--copper);
            color: #fff
        }
        
        .lang-btn:hover:not(.active) {
            color: rgba(255, 255, 255, .7)
        }
        
        .header-inner {
            max-width: 1480px;
            margin: 0 auto;
            padding: 0 32px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 68px;
            gap: 24px;
        }
        
        .nav-main {
            display: flex;
            gap: 18px;
            align-items: center;
            flex: 1;
            justify-content: center;
            margin-left: 120px
        }
        
        .logo-left {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-shrink: 0;
            margin-left: 16px
        }
        
        .logo-img {
            height: 44px;
            width: auto;
            transition: all .3s
        }
        
        .logo-left .logo-text {
            color: #fff;
            font-size: .92rem;
            font-weight: 700;
            letter-spacing: .5px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            line-height: 1.2;
            white-space: nowrap;
        }
        
        .logo-left .logo-text .tagline {
            display: block;
            font-size: .6rem;
            font-weight: 500;
            color: rgba(255, 255, 255, .6);
            letter-spacing: .5px;
            text-transform: none;
            margin-top: 1px;
            white-space: nowrap;
        }
        
        .nav-right {
            display: flex;
            gap: 12px;
            align-items: center;
            flex-shrink: 0
        }
        
        .header-link {
            color: rgba(255, 255, 255, .6);
            font-size: .78rem;
            font-weight: 500;
            transition: color .3s var(--ease);
            position: relative;
            padding: 4px 0;
            letter-spacing: .2px;
            white-space: nowrap;
        }
        
        .header-link:hover {
            color: #fff
        }
        
        .header-link::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 50%;
            width: 0;
            height: 2px;
            background: var(--copper);
            transition: all .3s var(--ease);
        }
        
        .header-link:hover::after {
            width: 100%;
            left: 0
        }
        
        .logo-center {
            display: flex;
            align-items: center;
            gap: 10px;
            justify-self: center
        }
        
        .logo-circle {
            width: 36px;
            height: 36px;
            background: var(--copper);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-weight: 800;
            font-size: .85rem;
            letter-spacing: -1px;
        }
        
        .logo-text {
            color: #fff;
            font-size: 1.1rem;
            font-weight: 700;
            letter-spacing: 2px
        }
        
        .logo-text .tagline {
            display: block;
            font-size: .5rem;
            font-weight: 500;
            color: #fff;
            letter-spacing: 2.5px;
            text-transform: uppercase;
            margin-top: -2px
        }
        
        .header-cta {
            background: #d97b35;
            color: #fff;
            padding: 8px 18px;
            border-radius: 20px;
            font-size: .76rem;
            font-weight: 600;
            letter-spacing: .3px;
            transition: all .3s var(--ease);
            white-space: nowrap;
        }
        
        .header-cta:hover {
            background: #003d82;
            transform: scale(1.05)
        }
        
        .header-phone {
            display: flex;
            align-items: center;
            gap: 4px;
            font-size: .92rem;
            font-weight: 700;
            color: #fff;
            text-decoration: none;
            letter-spacing: .3px;
            transition: all .3s;
            white-space: nowrap;
        }
        
        .header-phone:hover {
            color: var(--amber);
            transform: scale(1.05)
        }
        
        .phone-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            margin-right: 2px;
        }
        
        .phone-icon svg {
            width: 16px;
            height: 16px
        }
        
        @media(max-width:1366px) {
            .nav-main {
                gap: 14px
            }
            .header-link {
                font-size: .74rem
            }
            .logo-left .logo-text {
                font-size: .82rem
            }
            .logo-left .logo-text .tagline {
                font-size: .55rem
            }
        }
        
        @media(max-width:1200px) {
            .header-phone {
                display: none
            }
        }
        
        .mobile-toggle {
            display: none;
            color: #fff;
            font-size: 1.4rem;
            cursor: pointer;
            background: none;
            border: none
        }
        /* ===== Footer Social ===== */
        
        .footer-social {
            text-align: center;
            padding: 32px 24px;
            border-top: 1px solid rgba(255, 255, 255, .06);
            border-bottom: 1px solid rgba(255, 255, 255, .06);
        }
        
        .footer-social-label {
            display: block;
            font-size: .75rem;
            color: rgba(255, 255, 255, .35);
            text-transform: uppercase;
            letter-spacing: 2px;
            margin-bottom: 16px;
        }
        
        .footer-social-links {
            display: flex;
            justify-content: center;
            gap: 16px;
            flex-wrap: wrap;
        }
        
        .social-link {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 10px 20px;
            border-radius: 8px;
            background: rgba(255, 255, 255, .06);
            border: 1px solid rgba(255, 255, 255, .15);
            color: rgba(255, 255, 255, .85);
            font-size: .82rem;
            font-weight: 600;
            text-decoration: none;
            transition: all .3s;
        }
        
        .social-link svg {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
            stroke: #fff;
            fill: none
        }
        
        .social-link:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82;
            transform: translateY(-2px);
        }
        
        .social-link:hover svg {
            stroke: #003d82
        }
        /* ===== Floating Action Buttons ===== */
        
        .fab-bar {
            position: fixed;
            right: 20px;
            bottom: 120px;
            z-index: 1000;
            display: flex;
            flex-direction: column;
            gap: 12px;
            align-items: flex-end;
        }
        
        .fab-btn {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 12px 14px;
            border-radius: 50px;
            background: #15181c;
            border: 1px solid rgba(0, 61, 130, .3);
            color: #d97b35;
            font-size: .82rem;
            font-weight: 600;
            cursor: pointer;
            text-decoration: none;
            transition: all .3s;
            box-shadow: 0 4px 20px rgba(0, 0, 0, .4);
            white-space: nowrap;
        }
        
        .fab-btn:hover {
            background: rgba(0, 61, 130, .12);
            border-color: rgba(0, 61, 130, .6);
            transform: translateX(-4px);
        }
        
        .fab-btn svg {
            width: 18px;
            height: 18px;
            flex-shrink: 0
        }
        
        .fab-label {
            max-width: 0;
            overflow: hidden;
            transition: max-width .3s;
            opacity: 0;
        }
        
        .fab-btn:hover .fab-label {
            max-width: 120px;
            opacity: 1;
        }
        
        .fab-douyin {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-douyin:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        .fab-store {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-store:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        .fab-wechat {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-wechat:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        .fab-taobao {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-taobao:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        .fab-tmall {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-tmall:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        .fab-jd {
            background: rgba(255, 255, 255, .08);
            color: rgba(255, 255, 255, .9);
            border-color: rgba(255, 255, 255, .15)
        }
        
        .fab-jd:hover {
            background: rgba(0, 61, 130, .12);
            border-color: #003d82;
            color: #003d82
        }
        
        @media(max-width:768px) {
            .fab-bar {
                right: 12px;
                bottom: 100px;
                gap: 10px
            }
            .fab-btn {
                padding: 10px 12px;
                font-size: .75rem
            }
            .fab-label {
                display: none
            }
        }
        /* ===== Hero - 对角分割全屏 ===== */
        
        .hero {
            position: relative;
            min-height: 100vh;
            width: 100%;
            display: flex;
            align-items: center;
            background: var(--charcoal);
            overflow: hidden;
        }
        
        .hero-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        }
        
        .hero-bg:not(.active) {
            display: none
        }
        
        .hero-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(125deg, rgba(13, 15, 18, .92) 0%, rgba(13, 15, 18, .7) 40%, rgba(13, 15, 18, .3) 60%, rgba(0, 61, 130, .15) 100%);
        }
        
        .hero-diagonal {
            position: absolute;
            top: 0;
            right: 0;
            width: 45%;
            height: 100%;
            background: linear-gradient(135deg, transparent 0%, rgba(0, 61, 130, .08) 50%, rgba(0, 61, 130, .04) 100%);
            clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
        }
        
        .hero-grain {
            position: absolute;
            inset: 0;
            opacity: .04;
            background-image: radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .1) 1px, transparent 1px), radial-gradient(circle at 70% 60%, rgba(255, 255, 255, .08) 1px, transparent 1px);
            background-size: 3px 3px, 5px 5px;
        }
        
        .hero-content {
            position: absolute;
            inset: 0;
            z-index: 2;
            max-width: 1480px;
            margin: 0 auto;
            padding: 0 40px;
            width: 100%;
            height: 100%;
            display: grid;
            grid-template-columns: 1.4fr .6fr;
            gap: 60px;
            align-items: center;
        }
        
        .hero-content:not(.active) {
            display: none
        }
        
        .hero-left {
            padding-top: 60px
        }
        
        .hero-tag {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            background: rgba(0, 61, 130, .15);
            border: 1px solid rgba(0, 61, 130, .3);
            color: #fff;
            font-size: .72rem;
            font-weight: 600;
            letter-spacing: 3px;
            text-transform: uppercase;
            padding: 8px 16px;
            border-radius: 2px;
            margin-bottom: 32px;
        }
        
        .hero-tag::before {
            content: '';
            width: 6px;
            height: 6px;
            background: var(--copper);
            border-radius: 50%
        }
        
        .hero-title {
            color: #fff;
            font-size: 4.2rem;
            font-weight: 800;
            line-height: 1.05;
            letter-spacing: -2.5px;
            margin-bottom: 28px;
        }
        
        .hero-title .accent {
            color: #d97b35;
            font-weight: 300;
            font-style: italic;
        }
        
        .hero-title .line2 {
            display: block
        }
        
        .hero-subtitle {
            color: rgba(255, 255, 255, .55);
            font-size: 1.1rem;
            line-height: 1.9;
            max-width: 540px;
            margin-bottom: 36px;
            font-weight: 300;
        }
        
        .hero-actions {
            display: flex;
            gap: 14px
        }
        
        .btn-primary {
            background: var(--copper);
            color: #fff;
            padding: 15px 32px;
            border-radius: 2px;
            font-weight: 600;
            font-size: .88rem;
            letter-spacing: .3px;
            transition: all .35s var(--ease);
            display: inline-flex;
            align-items: center;
            gap: 8px;
            position: relative;
            overflow: hidden;
        }
        
        .btn-primary::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .2), transparent);
            transition: left .5s var(--ease);
        }
        
        .btn-primary:hover::before {
            left: 100%
        }
        
        .btn-primary:hover {
            background: var(--copper-dark);
            transform: translateY(-2px);
            box-shadow: 0 10px 30px rgba(0, 61, 130, .3)
        }
        
        .btn-outline {
            background: transparent;
            color: #fff;
            padding: 15px 32px;
            border-radius: 2px;
            font-weight: 600;
            font-size: .88rem;
            letter-spacing: .3px;
            border: 1px solid rgba(255, 255, 255, .15);
            transition: all .35s var(--ease);
        }
        
        .btn-outline:hover {
            border-color: var(--copper);
            color: #fff;
            background: rgba(0, 61, 130, .05)
        }
        /* Hero 右侧数据卡 */
        
        .hero-stats {
            display: flex;
            flex-direction: column;
            gap: 20px;
            background: rgba(13, 15, 18, .5);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, .08);
            border-radius: 8px;
            padding: 36px 32px;
        }
        
        .hero-stat-item {
            display: flex;
            align-items: baseline;
            gap: 12px;
            padding-bottom: 16px;
            border-bottom: 1px solid rgba(255, 255, 255, .06);
        }
        
        .hero-stat-item:last-child {
            border-bottom: none;
            padding-bottom: 0
        }
        
        .hero-stat-num {
            font-size: 2.4rem;
            font-weight: 800;
            color: #fff;
            line-height: 1;
            letter-spacing: -1.5px;
        }
        
        .hero-stat-num .unit {
            font-size: 1.2rem;
            color: #fff;
            margin-left: 2px
        }
        
        .hero-stat-label {
            color: rgba(255, 255, 255, .4);
            font-size: .78rem;
            letter-spacing: 1.5px;
            text-transform: uppercase;
        }
        
        .hero-scroll {
            position: absolute;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
            color: rgba(255, 255, 255, .25);
            font-size: .65rem;
            letter-spacing: 3px;
            text-transform: uppercase;
            z-index: 3;
        }
        
        .hero-scroll-line {
            width: 1px;
            height: 36px;
            background: rgba(255, 255, 255, .1);
            position: relative;
            overflow: hidden;
        }
        
        .hero-scroll-line::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 50%;
            background: var(--copper);
            animation: scrollPulse 2.5s infinite var(--ease);
        }
        
        @keyframes scrollPulse {
            0% {
                top: -50%
            }
            100% {
                top: 100%
            }
        }
        /* Hero slide切换器 */
        
        .hero-switcher {
            position: absolute;
            bottom: 30px;
            right: 40px;
            z-index: 3;
            display: flex;
            gap: 8px;
        }
        
        .hero-switch {
            width: 28px;
            height: 3px;
            border-radius: 2px;
            background: rgba(255, 255, 255, .15);
            cursor: pointer;
            transition: all .4s var(--ease);
        }
        
        .hero-switch.active {
            background: var(--copper);
            width: 44px
        }
        
        .hero-switch:hover {
            background: rgba(255, 255, 255, .35)
        }
        /* ===== Section Common ===== */
        
        .section {
            padding: 100px 0
        }
        
        section[id] {
            scroll-margin-top: 70px
        }
        
        .section-head {
            margin-bottom: 64px
        }
        
        .section-tag {
            display: inline-block;
            color: #003d82;
            font-size: .72rem;
            font-weight: 700;
            letter-spacing: 4px;
            text-transform: uppercase;
            margin-bottom: 18px;
        }
        
        .section-tag::before {
            content: '— ';
            color: #003d82
        }
        
        .section-h2 {
            font-size: 2.6rem;
            font-weight: 800;
            color: var(--text-dark);
            line-height: 1.2;
            letter-spacing: -1px;
        }
        
        .section-sub {
            color: var(--text-body);
            font-size: 1.02rem;
            line-height: 1.8;
            max-width: 580px;
            margin-top: 14px;
            font-weight: 300;
        }
        
        .products {
            background: var(--cream);
            padding: 100px 0
        }
        
        .products-list {
            display: flex;
            flex-direction: column;
            gap: 80px;
            margin-top: 64px
        }
        
        .product-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0;
            background: var(--white);
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 4px 24px rgba(13, 15, 18, .06);
            transition: all .6s var(--ease);
            opacity: 0;
            transform: translateY(60px);
        }
        
        .product-row.visible {
            opacity: 1;
            transform: translateY(0);
        }
        
        .product-row:hover {
            box-shadow: 0 20px 60px rgba(13, 15, 18, .12);
        }
        
        .product-row:nth-child(even) {
            direction: rtl
        }
        
        .product-row:nth-child(even)>* {
            direction: ltr
        }
        
        .product-visual {
            position: relative;
            overflow: hidden;
            min-height: 420px;
            background: var(--charcoal);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .product-visual-bg {
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0d0f12 100%);
            transition: transform .8s var(--ease);
        }
        
        .product-row:hover .product-visual-bg {
            transform: scale(1.08);
        }
        
        .product-visual-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(0, 61, 130, .15) 0%, transparent 60%);
        }
        
        .product-visual-content {
            position: relative;
            z-index: 2;
            text-align: center;
            color: #fff;
            padding: 40px;
        }
        
        .product-num {
            font-size: 5rem;
            font-weight: 800;
            line-height: 1;
            color: rgba(255, 255, 255, .08);
            margin-bottom: 16px;
            font-family: system-ui, -apple-system, sans-serif;
        }
        
        .product-num-label {
            font-size: .75rem;
            font-weight: 700;
            letter-spacing: 3px;
            color: rgba(255, 255, 255, .6);
            text-transform: uppercase;
        }
        
        .product-visual-icon {
            width: 80px;
            height: 80px;
            margin: 24px auto;
            border: 2px solid rgba(255, 255, 255, .15);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .product-visual-icon svg {
            width: 36px;
            height: 36px;
            stroke: rgba(255, 255, 255, .7);
            fill: none;
            stroke-width: 1.5
        }
        
        .product-content {
            padding: 48px 40px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        
        .product-content-tag {
            display: none;
            font-size: .7rem;
            font-weight: 700;
            letter-spacing: 2px;
            color: #003d82;
            text-transform: uppercase;
            margin-bottom: 16px;
        }
        
        .product-content-tag::before {
            content: '';
            width: 24px;
            height: 2px;
            background: #003d82;
        }
        
        .product-content h3 {
            font-size: 1.6rem;
            color: var(--text-dark);
            margin-bottom: 16px;
            font-weight: 700;
            letter-spacing: -.5px;
            line-height: 1.3;
        }
        
        .product-content h3.product-primary-title {
            font-size: 2.2rem;
            font-weight: 800;
            letter-spacing: 0;
            color: #003d82;
            text-shadow: 0 1px 2px rgba(0, 61, 130, .08);
            padding-bottom: 8px;
            border-bottom: 3px solid #003d82;
        }
        
        .product-content>p {
            color: var(--text-body);
            font-size: .9rem;
            line-height: 1.9;
            margin-bottom: 28px;
        }
        
        .product-specs-table {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 12px;
        }
        
        .product-spec-item {
            display: flex;
            flex-direction: column;
            gap: 4px;
            padding: 12px 0;
            border-top: 1px solid var(--cream-2);
        }
        
        .product-spec-item dt {
            font-size: .72rem;
            color: var(--warm-gray);
            font-weight: 500;
            letter-spacing: .5px;
        }
        
        .product-spec-item dd {
            font-size: .82rem;
            color: var(--text-dark);
            font-weight: 600;
        }
        
        .product-cta {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 32px;
            font-size: .85rem;
            font-weight: 700;
            color: #003d82;
            text-decoration: none;
            transition: all .3s var(--ease);
        }
        
        .product-cta:hover {
            gap: 14px
        }
        
        .product-cta svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2
        }
        /* 移动端适配 */
        
        @media(max-width:900px) {
            .product-row {
                grid-template-columns: 1fr
            }
            .product-visual {
                min-height: 280px
            }
            .product-num {
                font-size: 4rem
            }
            .product-content {
                padding: 32px 24px
            }
            .product-content h3 {
                font-size: 1.3rem
            }
            .products-list {
                gap: 48px
            }
        }
        
        @media(max-width:640px) {
            .product-visual {
                min-height: 220px
            }
            .product-num {
                font-size: 3rem
            }
            .product-specs-table {
                grid-template-columns: 1fr
            }
            .products-list {
                gap: 36px
            }
        }
        /* 旗舰产品大卡（保留占位） */
        /* ===== Comparison - 左右对比卡 ===== */
        
        .compare {
            background: var(--cream);
            padding: 100px 0
        }
        
        .compare-cards {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 24px;
            margin-top: 48px;
        }
        
        .compare-card {
            border-radius: 12px;
            padding: 40px 36px;
            position: relative;
            overflow: hidden;
            transition: transform .4s var(--ease);
        }
        
        .compare-card:hover {
            transform: translateY(-4px)
        }
        
        .compare-card-import {
            background: var(--cream-2);
            border: 1px solid var(--warm-gray-light);
        }
        
        .compare-card-fhtcu {
            background: linear-gradient(135deg, var(--charcoal) 0%, var(--charcoal-3) 100%);
            color: #fff;
            position: relative;
        }

            .compare-card-fhtcu::before {
                content: 'Recommended';
                position: absolute;
                top: 20px;
                right: 20px;
                background: var(--copper);
                color: #fff;
                font-size: .68rem;
                font-weight: 700;
                padding: 5px 12px;
                border-radius: 3px;
                letter-spacing: 1px;
            }
        
        .compare-card-fhtcu::after {
            content: '';
            position: absolute;
            bottom: -40px;
            right: -40px;
            width: 200px;
            height: 200px;
            background: radial-gradient(circle, rgba(0, 61, 130, .12) 0%, transparent 65%);
        }
        
        .compare-card h3 {
            font-size: 1.3rem;
            font-weight: 700;
            margin-bottom: 28px;
        }
        
        .compare-card-import h3 {
            color: var(--warm-gray)
        }
        
        .compare-card-fhtcu h3 {
            color: #fff
        }
        
        .compare-list li {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding: 14px 0;
            border-bottom: 1px solid rgba(0, 0, 0, .06);
            font-size: .88rem;
        }
        
        .compare-card-import .compare-list li {
            border-bottom-color: rgba(0, 0, 0, .06)
        }
        
        .compare-card-fhtcu .compare-list li {
            border-bottom-color: rgba(255, 255, 255, .08)
        }
        
        .compare-list li:last-child {
            border-bottom: none
        }
        
        .compare-list .cl-label {
            font-weight: 600;
            min-width: 80px;
            flex-shrink: 0;
        }
        
        .compare-card-import .cl-label {
            color: var(--warm-gray)
        }
        
        .compare-card-fhtcu .cl-label {
            color: #003d82
        }
        
        .compare-list .cl-value {
            line-height: 1.6;
        }
        
        .compare-card-import .cl-value {
            color: var(--text-body)
        }
        
        .compare-card-fhtcu .cl-value {
            color: rgba(255, 255, 255, .85)
        }
        
        .compare-banner {
            margin-top: 32px;
            padding: 28px 36px;
            background: var(--charcoal);
            border-radius: 12px;
            color: #fff;
            display: flex;
            align-items: center;
            gap: 20px;
            position: relative;
            overflow: hidden;
        }
        
        .compare-banner::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 4px;
            height: 100%;
            background: var(--copper);
        }
        
        .compare-banner svg {
            width: 28px;
            height: 28px;
            flex-shrink: 0;
            color: #003d82
        }
        
        .compare-banner p {
            font-size: .98rem;
            line-height: 1.7;
            margin: 0
        }
        
        .compare-banner strong {
            color: #003d82
        }
        /* ===== Solutions - Bento异形网格 ===== */
        
        .solutions {
            background: var(--charcoal);
            color: #fff;
            position: relative;
            overflow: hidden;
            padding: 100px 0
        }
        
        .solutions::before {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 40%;
            height: 60%;
            background: radial-gradient(ellipse at bottom left, rgba(0, 61, 130, .06) 0%, transparent 50%);
        }
        
        .solutions .section-h2 {
            color: #fff
        }
        
        .solutions .section-sub {
            color: rgba(255, 255, 255, .45)
        }
        
        .solutions-bento {
            display: grid;
            grid-template-columns: 1.5fr 1fr 1fr;
            grid-template-rows: auto auto;
            grid-template-areas: "composite chem rubber" "composite energy wood";
            gap: 20px;
            margin-top: 48px;
            position: relative;
        }
        
        .sol-cell[data-industry="chem"] {
            grid-area: chem
        }
        
        .sol-cell[data-industry="composite"] {
            grid-area: composite
        }
        
        .sol-cell[data-industry="energy"] {
            grid-area: energy
        }
        
        .sol-cell[data-industry="rubber"] {
            grid-area: rubber
        }
        
        .sol-cell[data-industry="wood"] {
            grid-area: wood
        }
        
        .sol-cell {
            border-radius: 10px;
            overflow: hidden;
            position: relative;
            min-height: 300px;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            transition: all .4s var(--ease);
        }
        
        .sol-cell:hover {
            transform: translateY(-5px);
            box-shadow: 0 20px 50px rgba(0, 0, 0, .3)
        }
        
        .sol-cell-large {
            min-height: 620px
        }
        
        .sol-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            z-index: 0;
            opacity: .7;
            transition: opacity .4s var(--ease);
        }
        
        .sol-cell:hover .sol-bg {
            opacity: .95
        }
        
        .sol-cell::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(180deg, rgba(13, 15, 18, 0) 0%, rgba(13, 15, 18, .15) 40%, rgba(13, 15, 18, .55) 100%);
        }
        
        .sol-content {
            padding: 32px 28px 36px;
            position: relative;
            z-index: 2;
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
        }
        
        .sol-cell-large .sol-content {
            padding: 44px 36px 48px
        }
        
        .sol-num {
            font-size: .72rem;
            color: #003d82;
            font-weight: 700;
            letter-spacing: 3px;
            margin-bottom: 14px;
        }
        
        .sol-cell h3 {
            font-size: 1.3rem;
            color: #fff;
            margin-bottom: 14px;
            font-weight: 700;
        }
        
        .sol-cell-large h3 {
            font-size: 1.6rem
        }
        
        .sol-cell p {
            color: rgba(255, 255, 255, .8);
            font-size: .88rem;
            line-height: 1.9;
            margin-bottom: 18px;
        }
        
        .sol-cell-large p {
            font-size: .94rem
        }
        
        .sol-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px
        }
        
        .sol-tags span {
            border: 1px solid rgba(255, 255, 255, .25);
            color: rgba(255, 255, 255, .65);
            padding: 4px 12px;
            border-radius: 14px;
            font-size: .72rem;
            letter-spacing: .3px;
        }
        /* ===== Process - 垂直时间线 ===== */
        
        .process {
            background: var(--white);
            padding: 100px 0
        }
        
        .process-timeline {
            margin-top: 56px;
            position: relative;
            padding-left: 40px;
        }
        
        .process-timeline::before {
            content: '';
            position: absolute;
            left: 15px;
            top: 0;
            bottom: 0;
            width: 2px;
            background: linear-gradient(180deg, var(--copper) 0%, var(--cream-2) 100%);
        }
        
        .process-node {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 40px;
            padding: 32px 0;
            position: relative;
            transition: all .3s var(--ease);
        }
        
        .process-node::before {
            content: '';
            position: absolute;
            left: -33px;
            top: 40px;
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: var(--copper);
            border: 3px solid var(--white);
            box-shadow: 0 0 0 4px rgba(0, 61, 130, .15);
            transition: all .3s var(--ease);
        }
        
        .process-node:hover::before {
            transform: scale(1.3);
            box-shadow: 0 0 0 6px rgba(0, 61, 130, .2);
        }
        
        .process-node-left {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        
        .process-node-num {
            font-size: 3rem;
            font-weight: 800;
            color: var(--cream-2);
            line-height: 1;
            letter-spacing: -2px;
            margin-bottom: 8px;
        }
        
        .process-node-title {
            font-size: 1.3rem;
            font-weight: 700;
            color: var(--text-dark);
        }
        
        .process-node-duration {
            display: inline-block;
            margin-top: 10px;
            background: var(--copper);
            color: #fff;
            border-radius: 3px;
            padding: 4px 12px;
            font-size: .76rem;
            font-weight: 600;
        }
        
        .process-node-right {
            background: var(--cream);
            border-radius: 8px;
            padding: 28px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            border: 1px solid var(--cream-2);
        }
        
        .process-node-right p {
            color: var(--text-body);
            font-size: .9rem;
            line-height: 1.8;
        }
        /* ===== Advantages - Bento异形网格 ===== */
        
        .advantages {
            background: var(--cream);
            padding: 100px 0
        }
        
        .adv-bento {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            grid-template-rows: repeat(3, 1fr);
            gap: 20px;
            margin-top: 48px;
        }
        
        .adv-box-cta {
            background: linear-gradient(135deg, var(--charcoal) 0%, var(--charcoal-3) 100%);
            color: #fff;
            display: flex;
            flex-direction: column;
        }
        
        .adv-box-cta h3 {
            color: #fff
        }
        
        .adv-box-cta p {
            color: rgba(255, 255, 255, .5)
        }
        
        .adv-cta-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin-top: auto;
            padding: 12px 24px;
            background: var(--copper);
            color: #fff;
            border-radius: 6px;
            font-size: .85rem;
            font-weight: 600;
            text-decoration: none;
            transition: all .3s var(--ease);
        }
        
        .adv-cta-btn:hover {
            background: #b86a2e;
            transform: translateY(-2px)
        }
        
        .adv-box {
            border-radius: 10px;
            padding: 36px 32px;
            display: flex;
            flex-direction: column;
            transition: all .4s var(--ease);
            position: relative;
            overflow: hidden;
        }
        
        .adv-box-dark {
            background: var(--charcoal);
            color: #fff;
            grid-row: span 2;
        }
        
        .adv-box-dark::before {
            content: '';
            position: absolute;
            bottom: -30px;
            right: -30px;
            width: 160px;
            height: 160px;
            background: radial-gradient(circle, rgba(0, 61, 130, .1) 0%, transparent 65%);
        }
        
        .adv-box-light {
            background: var(--white);
            border: 1px solid var(--cream-2);
        }
        
        .adv-box-light:hover {
            border-color: var(--copper);
            box-shadow: 0 12px 36px rgba(0, 61, 130, .08);
            transform: translateY(-3px);
        }
        
        .adv-box-dark:hover {
            box-shadow: 0 16px 44px rgba(13, 15, 18, .3);
            transform: translateY(-3px)
        }
        
        .adv-icon {
            width: 40px;
            height: 40px;
            margin-bottom: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .adv-icon svg {
            width: 100%;
            height: 100%
        }
        
        .adv-icon img {
            width: 40px;
            height: 40px;
            object-fit: contain
        }
        
        .adv-box h3 {
            font-size: 1.1rem;
            font-weight: 700;
            margin-bottom: 10px;
        }
        
        .adv-box-dark h3 {
            color: #fff
        }
        
        .adv-box-light h3 {
            color: var(--text-dark)
        }
        
        .adv-box p {
            font-size: .84rem;
            line-height: 1.8;
            flex: 1;
        }
        
        .adv-box-dark p {
            color: rgba(255, 255, 255, .5)
        }
        
        .adv-box-light p {
            color: var(--text-body)
        }
        
        .adv-box-dark h3 {
            font-size: 1.4rem
        }
        
        .adv-box-dark p {
            font-size: .92rem
        }
        /* ===== Cases - 卡片堆叠 ===== */
        
        .cases {
            background: var(--charcoal);
            color: #fff;
            padding: 100px 0;
            position: relative;
            overflow: hidden
        }
        
        .cases::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 50%;
            height: 100%;
            background: radial-gradient(ellipse at top right, rgba(0, 61, 130, .05) 0%, transparent 50%);
        }
        
        .cases .section-h2 {
            color: #fff
        }
        
        .cases .section-sub {
            color: rgba(255, 255, 255, .45)
        }
        
        .cases-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 20px;
            margin-top: 48px;
        }
        
        .case-box {
            position: relative;
            overflow: hidden;
            border-radius: 10px;
            display: flex;
            flex-direction: column;
            min-height: 400px;
            transition: transform .4s var(--ease);
        }
        
        .case-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            opacity: .7;
            transition: opacity .4s var(--ease);
        }
        
        .case-box::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(180deg, rgba(13, 15, 18, 0) 0%, rgba(13, 15, 18, .2) 50%, rgba(13, 15, 18, .6) 100%);
        }
        
        .case-box::after {
            content: '';
            position: absolute;
            top: -20px;
            right: -20px;
            width: 100px;
            height: 100px;
            background: radial-gradient(circle, rgba(0, 61, 130, .1) 0%, transparent 70%);
            z-index: 1;
        }
        
        .case-box:hover {
            transform: translateY(-5px)
        }
        
        .case-box:hover .case-bg {
            opacity: .95
        }
        
        .case-inner {
            position: relative;
            z-index: 2;
            padding: 36px 28px 32px;
            display: flex;
            flex-direction: column;
            flex: 1;
        }
        
        .case-tag {
            display: inline-block;
            font-size: .68rem;
            font-weight: 700;
            color: #fff;
            letter-spacing: 2px;
            margin-bottom: 8px;
        }
        
        .case-inner h3 {
            font-size: 1.2rem;
            font-weight: 700;
            color: #fff;
            line-height: 1.4;
            margin-bottom: 14px
        }
        
        .case-text {
            font-size: .84rem;
            color: rgba(255, 255, 255, .8);
            line-height: 1.8;
            margin-bottom: 20px;
            flex: 1;
        }
        
        .case-metrics {
            display: flex;
            gap: 20px;
            padding-top: 16px;
            border-top: 1px solid rgba(255, 255, 255, .1)
        }
        
        .case-metric {
            text-align: left
        }
        
        .case-metric-num {
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1
        }
        
        .case-metric-label {
            font-size: .7rem;
            color: rgba(255, 255, 255, .45);
            margin-top: 3px;
            letter-spacing: .3px
        }
        /* ===== Customer Site Gallery ===== */
        
        .site-gallery {
            background: var(--charcoal);
            padding: 100px 0
        }
        
        .site-gallery .section-head {
            text-align: center;
            margin-bottom: 56px
        }
        
        .site-gallery .section-tag {
            color: var(--amber)
        }
        
        .site-gallery .section-h2 {
            color: #fff
        }
        
        .site-gallery .section-sub {
            color: rgba(255, 255, 255, .5)
        }
        
        .gallery-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 16px;
        }
        
        .gallery-item {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            cursor: pointer;
            aspect-ratio: 4/3;
            transition: transform .4s var(--ease);
        }
        
        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .6s var(--ease);
        }
        
        .gallery-item::after {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(180deg, transparent 50%, rgba(13, 15, 18, .75) 100%);
            transition: opacity .4s var(--ease);
        }
        
        .gallery-item:hover {
            transform: translateY(-4px)
        }
        
        .gallery-item:hover img {
            transform: scale(1.08)
        }
        
        .gallery-caption {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 2;
            padding: 16px 18px;
            color: rgba(255, 255, 255, .85);
            font-size: .78rem;
            letter-spacing: .5px;
            opacity: 0;
            transform: translateY(8px);
            transition: all .4s var(--ease);
            display: none;
        }
        
        .gallery-item:hover .gallery-caption {
            opacity: 1;
            transform: translateY(0)
        }
        /* Lightbox */
        
        .lightbox {
            position: fixed;
            inset: 0;
            z-index: 9999;
            background: rgba(10, 9, 8, .95);
            display: none;
            align-items: center;
            justify-content: center;
            padding: 40px;
            backdrop-filter: blur(8px);
        }
        
        .lightbox.active {
            display: flex;
            animation: lbFadeIn .3s var(--ease)
        }
        
        .lightbox img {
            max-width: 90%;
            max-height: 85vh;
            border-radius: 8px;
            box-shadow: 0 20px 80px rgba(0, 0, 0, .5);
            animation: lbZoomIn .35s var(--ease)
        }
        
        @keyframes lbFadeIn {
            from {
                opacity: 0
            }
            to {
                opacity: 1
            }
        }
        
        @keyframes lbZoomIn {
            from {
                opacity: 0;
                transform: scale(.92)
            }
            to {
                opacity: 1;
                transform: scale(1)
            }
        }
        /* 认证墙画廊（原生 JS 生成，不依赖 lightbox） */
        
        .cert-gallery {
            position: fixed;
            inset: 0;
            z-index: 9999;
            display: none;
            align-items: center;
            justify-content: center
        }
        
        .cert-gallery.active {
            display: flex;
            animation: lbFadeIn .3s var(--ease)
        }
        
        .cert-gallery .cg-mask {
            position: absolute;
            inset: 0;
            background: rgba(10, 9, 8, .95);
            backdrop-filter: blur(8px)
        }
        
        .cert-gallery .cg-img {
            position: relative;
            z-index: 1;
            max-width: 90vw;
            max-height: 78vh;
            border-radius: 8px;
            box-shadow: 0 20px 80px rgba(0, 0, 0, .5);
            animation: lbZoomIn .35s var(--ease)
        }
        
        .cert-gallery .cg-caption {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 34px;
            z-index: 2;
            text-align: center;
            color: #fff;
            font-size: .9rem;
            letter-spacing: .05em;
            padding: 0 70px
        }
        
        .cert-gallery .cg-counter {
            position: absolute;
            top: 24px;
            left: 30px;
            z-index: 2;
            color: rgba(255, 255, 255, .7);
            font-size: .8rem;
            letter-spacing: .1em
        }
        
        .cert-gallery .cg-close {
            position: absolute;
            top: 14px;
            right: 26px;
            z-index: 3;
            font-size: 2.2rem;
            color: #fff;
            cursor: pointer;
            line-height: 1;
            transition: opacity .25s
        }
        
        .cert-gallery .cg-close:hover {
            opacity: .7
        }
        
        .cert-gallery .cg-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            z-index: 3;
            font-size: 2rem;
            color: #fff;
            cursor: pointer;
            padding: 12px 18px;
            user-select: none;
            transition: opacity .25s
        }
        
        .cert-gallery .cg-nav:hover {
            opacity: .7
        }
        
        .cert-gallery .cg-prev {
            left: 10px
        }
        
        .cert-gallery .cg-next {
            right: 10px
        }
        
        @media (max-width: 768px) {
            .cert-gallery .cg-img {
                max-width: 95vw;
                max-height: 68vh
            }
            .cert-gallery .cg-nav {
                font-size: 1.5rem;
                padding: 8px 12px
            }
            .cert-gallery .cg-caption {
                bottom: 20px;
                font-size: .8rem;
                padding: 0 56px
            }
        }
        
        .lightbox-close {
            position: absolute;
            top: 20px;
            right: 30px;
            font-size: 2.2rem;
            color: #fff;
            cursor: pointer;
            line-height: 1;
            opacity: .7;
            transition: opacity .3s;
        }
        
        .lightbox-close:hover {
            opacity: 1
        }
        
        .lightbox-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            font-size: 2rem;
            color: rgba(255, 255, 255, .6);
            cursor: pointer;
            padding: 16px 20px;
            transition: color .3s;
            user-select: none;
        }
        
        .lightbox-nav:hover {
            color: #fff
        }
        
        .lightbox-prev {
            left: 20px
        }
        
        .lightbox-next {
            right: 20px
        }
        
        .safety {
            background: var(--white);
            padding: 100px 0
        }
        
        .safety-tabs {
            display: flex;
            gap: 4px;
            margin-top: 40px;
            margin-bottom: 32px;
            background: var(--cream);
            border-radius: 8px;
            padding: 6px;
        }
        
        .safety-tab {
            flex: 1;
            padding: 14px 20px;
            border: none;
            background: transparent;
            border-radius: 6px;
            cursor: pointer;
            font-size: .88rem;
            font-weight: 600;
            color: var(--warm-gray);
            transition: all .35s var(--ease);
            text-align: center;
            font-family: inherit;
        }
        
        .safety-tab:hover {
            color: #fff
        }
        
        .safety-tab.active {
            background: var(--charcoal);
            color: #fff;
            box-shadow: 0 4px 12px rgba(13, 15, 18, .15);
        }
        
        .safety-panels {
            position: relative;
            min-height: 280px
        }
        
        .safety-panel {
            display: none;
            animation: fadeUp .5s var(--ease);
        }
        
        .safety-panel.active {
            display: block
        }
        
        .safety-panel-head {
            display: flex;
            align-items: center;
            gap: 16px;
            margin-bottom: 24px;
        }
        
        .safety-panel-icon {
            width: 56px;
            height: 56px;
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-weight: 800;
            font-size: 1.3rem;
        }
        
        .safety-panel-icon[data-l="1"] {
            background: var(--charcoal)
        }
        
        .safety-panel-icon[data-l="2"] {
            background: var(--charcoal-3)
        }
        
        .safety-panel-icon[data-l="3"] {
            background: var(--copper-dark)
        }
        
        .safety-panel-icon[data-l="4"] {
            background: var(--copper)
        }
        
        .safety-panel-head h3 {
            font-size: 1.3rem;
            font-weight: 700;
            color: var(--text-dark)
        }
        
        .safety-panel-head .sub {
            font-size: .84rem;
            color: var(--warm-gray);
            margin-top: 2px
        }
        
        .safety-panel-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 14px;
        }
        
        .safety-item {
            display: flex;
            align-items: flex-start;
            gap: 12px;
            padding: 18px 20px;
            background: var(--cream);
            border-radius: 8px;
            font-size: .86rem;
            color: var(--text-dark);
            transition: all .3s var(--ease);
        }
        
        .safety-item:hover {
            background: var(--cream-2);
            transform: translateX(4px)
        }
        
        .safety-item svg {
            width: 18px;
            height: 18px;
            color: #fff;
            flex-shrink: 0;
            margin-top: 2px
        }
        
        .safety-item span {
            line-height: 1.6
        }
        
        .cert-wall {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            margin-top: 40px;
        }
        
        .cert-wall-item {
            position: relative;
            cursor: pointer;
            transition: all .45s var(--ease);
            perspective: 1200px;
        }
        
        .cert-frame {
            position: relative;
            border-radius: 6px;
            overflow: hidden;
            transition: all .45s var(--ease);
        }
        /* 金色画框效果 */
        
        .cert-frame::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 3;
            border: 4px solid rgba(192, 157, 96, .15);
            border-radius: 6px;
            pointer-events: none;
            box-shadow: inset 0 0 0 1px rgba(192, 157, 96, .1), inset 0 0 20px rgba(192, 157, 96, .03);
            transition: all .45s var(--ease);
        }
        
        .cert-wall-item:hover .cert-frame::before {
            border-color: rgba(192, 157, 96, .35);
            box-shadow: inset 0 0 0 1px rgba(192, 157, 96, .2), inset 0 0 30px rgba(192, 157, 96, .05);
        }
        /* 顶部证书挂饰 */
        
        .cert-hanger {
            position: absolute;
            top: -10px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 4;
            display: flex;
            flex-direction: column;
            align-items: center;
            pointer-events: none;
        }
        
        .cert-hanger-pin {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: rgba(192, 157, 96, .8);
            box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
        }
        
        .cert-hanger-line {
            width: 1px;
            height: 14px;
            background: rgba(192, 157, 96, .3);
            margin-top: -1px;
        }
        
        .cert-wall-thumb {
            position: relative;
            overflow: hidden;
            aspect-ratio: 3/4;
            flex-shrink: 0;
            background: #ffffff;
        }
        
        .cert-wall-thumb img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
            transition: transform .6s var(--ease), filter .4s var(--ease);
            filter: brightness(.93) saturate(.88);
        }
        
        .cert-wall-item:hover .cert-wall-thumb img {
            transform: scale(1.06);
            filter: brightness(1.02) saturate(.98);
        }
        /* 放大镜图标层 */
        
        .cert-zoom {
            position: absolute;
            inset: 0;
            z-index: 2;
            background: rgba(13, 15, 18, .42);
            opacity: 0;
            transition: all .35s var(--ease);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .cert-zoom svg {
            width: 42px;
            height: 42px;
            stroke: rgba(255, 255, 255, .9);
            fill: none;
            stroke-width: 1.6;
            transform: scale(.7);
            transition: transform .35s var(--ease);
        }
        
        .cert-wall-item:hover .cert-zoom {
            opacity: 1;
        }
        
        .cert-wall-item:hover .cert-zoom svg {
            transform: scale(1);
        }
        /* 证书信息区 - 画框底部铭牌风格 */
        
        .cert-wall-info {
            padding: 14px 12px 12px;
            text-align: center;
            background: var(--white);
            border-left: 1px solid var(--cream-2);
            border-right: 1px solid var(--cream-2);
            border-bottom: 1px solid var(--cream-2);
            border-radius: 0 0 6px 6px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 3px;
            position: relative;
        }
        
        .cert-wall-info::before {
            content: '';
            position: absolute;
            top: 0;
            left: 20%;
            right: 20%;
            height: 1px;
            background: rgba(192, 157, 96, .2);
        }
        
        .cert-wall-info h4 {
            font-size: .82rem;
            font-weight: 700;
            color: var(--text-dark);
            margin: 0;
            letter-spacing: .3px;
        }
        
        .cert-wall-info .cert-badge {
            display: inline-block;
            font-size: .55rem;
            font-weight: 700;
            color: rgba(192, 157, 96, .85);
            letter-spacing: 1px;
            text-transform: uppercase;
            margin-top: 3px;
        }
        
        .cert-wall-info p {
            font-size: .7rem;
            color: var(--warm-gray);
            margin: 0;
            line-height: 1.5;
        }
        /* 装饰性底座 */
        
        .cert-base {
            height: 4px;
            background: rgba(192, 157, 96, .15);
            border-radius: 0 0 6px 6px;
            margin-top: -1px;
        }
        
        .cert-wall-item:hover {
            transform: translateY(-6px) rotateX(3deg);
        }
        
        .cert-wall-item:hover .cert-frame {
            box-shadow: 0 24px 48px rgba(0, 61, 130, .14), 0 4px 12px rgba(0, 0, 0, .08);
        }
        
        .cert-wall-item:active {
            transform: translateY(-4px) rotateX(1deg);
        }
        /* 证书墙总标题区 */
        
        .cert-section-head {
            text-align: center;
            margin-bottom: 36px
        }
        
        .cert-section-head .section-tag {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            background: rgba(192, 157, 96, .1);
            color: rgba(192, 157, 96, .85);
            padding: 6px 16px;
            border-radius: 16px;
            font-size: .7rem;
            letter-spacing: 2px;
            text-transform: uppercase;
            font-weight: 700;
            margin-bottom: 14px;
        }
        
        .cert-section-head h3 {
            font-size: 1.55rem;
            color: var(--text-dark);
            margin: 0;
            font-weight: 700;
        }
        
        .cert-section-head .cert-sub {
            font-size: .86rem;
            color: var(--warm-gray);
            margin-top: 10px;
            max-width: 520px;
            margin-left: auto;
            margin-right: auto;
            line-height: 1.7;
        }
        /* 滚动提示 */
        
        .cert-scroll-hint {
            text-align: center;
            margin-top: 28px;
            font-size: .75rem;
            color: var(--warm-gray-light);
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
        }
        
        .faq {
            background: var(--white);
            padding: 100px 0
        }
        
        .faq-layout {
            display: grid;
            grid-template-columns: 280px 1fr;
            gap: 48px;
            margin-top: 48px;
        }
        
        .faq-sidebar {
            position: sticky;
            top: 100px;
            align-self: start
        }
        
        .faq-sidebar h3 {
            font-size: .76rem;
            color: var(--warm-gray);
            font-weight: 600;
            letter-spacing: 2px;
            text-transform: uppercase;
            margin-bottom: 16px;
        }
        
        .faq-nav-item {
            display: block;
            padding: 12px 16px;
            font-size: .88rem;
            color: var(--text-body);
            cursor: pointer;
            border-left: 2px solid transparent;
            transition: all .3s var(--ease);
            line-height: 1.5;
        }
        
        .faq-nav-item:hover {
            color: #003d82;
            background: var(--cream)
        }
        
        .faq-nav-item.active {
            color: #003d82;
            border-left-color: var(--copper);
            background: var(--cream);
            font-weight: 600;
        }
        
        .faq-content {
            min-height: 400px
        }
        
        .faq-block {
            display: none;
            animation: fadeUp .4s var(--ease);
        }
        
        .faq-block.active {
            display: block
        }
        
        .faq-block h4 {
            font-size: 1.15rem;
            font-weight: 700;
            color: var(--text-dark);
            margin-bottom: 14px;
            line-height: 1.5;
        }
        
        .faq-block p {
            font-size: .9rem;
            color: var(--text-body);
            line-height: 1.9;
            margin-bottom: 24px;
        }
        
        .faq-block .faq-next {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            color: #003d82;
            font-size: .82rem;
            font-weight: 600;
            cursor: pointer;
            transition: gap .3s var(--ease);
        }
        
        .faq-block .faq-next:hover {
            gap: 10px
        }
        /* ===== Contact ===== */
        
        .contact {
            background: var(--cream);
            padding: 100px 0
        }
        
        .contact-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 64px;
            align-items: start
        }
        
        .contact-left .section-h2 {
            font-size: 2.1rem
        }
        
        .contact-left p {
            color: var(--text-body);
            font-size: .98rem;
            line-height: 1.9;
            margin-top: 18px;
            max-width: 420px;
        }
        
        .contact-items {
            margin-top: 40px
        }
        
        .contact-row {
            display: flex;
            align-items: flex-start;
            gap: 18px;
            padding: 22px 0;
            border-bottom: 1px solid var(--cream-2);
        }
        
        .contact-row:last-child {
            border-bottom: none
        }
        
        .contact-ico {
            width: 42px;
            height: 42px;
            border: 1px solid var(--cream-2);
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            background: var(--white);
        }
        
        .contact-ico svg {
            width: 20px;
            height: 20px
        }
        
        .contact-row .clabel {
            font-size: .7rem;
            color: var(--warm-gray);
            letter-spacing: 2px;
            text-transform: uppercase;
            margin-bottom: 3px
        }
        
        .contact-row .cval {
            font-size: .92rem;
            color: var(--text-dark);
            font-weight: 600
        }
        
        .contact-form-box {
            background: var(--white);
            border: 1px solid var(--cream-2);
            border-radius: 12px;
            padding: 44px;
            box-shadow: 0 4px 24px rgba(13, 15, 18, .04);
        }
        
        .form-field {
            margin-bottom: 18px
        }
        
        .form-field label {
            display: block;
            font-size: .76rem;
            color: var(--text-dark);
            font-weight: 600;
            letter-spacing: 1px;
            margin-bottom: 7px;
            text-transform: uppercase;
        }
        
        .form-field input,
        .form-field textarea,
        .form-field select {
            width: 100%;
            padding: 13px 16px;
            border: 1px solid var(--cream-2);
            border-radius: 6px;
            font-size: .88rem;
            font-family: inherit;
            background: var(--cream);
            transition: all .3s var(--ease);
        }
        
        .form-field input:focus,
        .form-field textarea:focus,
        .form-field select:focus {
            outline: none;
            border-color: var(--copper);
            background: #fff;
            box-shadow: 0 0 0 3px rgba(0, 61, 130, .08);
        }
        
        .form-field textarea {
            resize: vertical;
            min-height: 110px
        }
        
        .form-pair {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 14px
        }
        
        .form-btn {
            width: 100%;
            background: var(--charcoal);
            color: #fff;
            border: none;
            padding: 15px;
            border-radius: 6px;
            font-size: .88rem;
            font-weight: 600;
            letter-spacing: 1px;
            cursor: pointer;
            transition: all .3s var(--ease);
            text-transform: uppercase;
        }
        
        .form-btn:hover {
            background: var(--copper)
        }
        /* ===== Footer ===== */
        
        footer {
            background: var(--charcoal);
            color: rgba(255, 255, 255, .35);
            padding: 56px 0 28px
        }
        
        .footer-top {
            max-width: 1480px;
            margin: 0 auto;
            padding: 0 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-bottom: 20px;
        }
        
        .footer-logo {
            display: flex;
            align-items: center;
            gap: 10px
        }
        
        .footer-logo .logo-text {
            font-size: 1.05rem
        }
        
        .footer-nav {
            display: flex;
            gap: 24px;
            flex-wrap: wrap
        }
        
        .footer-nav a {
            font-size: .8rem;
            transition: color .3s var(--ease)
        }
        
        .footer-nav a:hover {
            color: #fff
        }
        
        .footer-bottom {
            border-top: 1px solid var(--border);
            margin-top: 36px;
            padding-top: 22px;
            text-align: center;
            font-size: .76rem;
        }
        /* ===== Responsive ===== */
        
        @media(max-width:1024px) {
            .hero-title {
                font-size: 3.2rem
            }
            .hero-content {
                grid-template-columns: 1fr;
                gap: 40px
            }
            .hero-stats {
                flex-direction: row;
                gap: 16px
            }
            .hero-stat-item {
                border-bottom: none;
                border-right: 1px solid rgba(255, 255, 255, .06);
                padding-bottom: 0;
                padding-right: 16px
            }
            .hero-stat-item:last-child {
                border-right: none
            }
            .hero-stat-num {
                font-size: 1.8rem
            }
            .solutions-bento {
                grid-template-columns: 1fr;
                grid-template-areas: unset
            }
            .sol-cell-large {
                min-height: 300px
            }
            .adv-bento {
                grid-template-columns: 1fr 1fr
            }
            .adv-box-dark {
                grid-row: span 1
            }
            .adv-box-wide {
                grid-column: span 1
            }
            .compare-cards {
                grid-template-columns: 1fr
            }
            .cases-grid {
                grid-template-columns: 1fr 1fr
            }
            .gallery-grid {
                grid-template-columns: 1fr 1fr
            }
            .cert-wall {
                grid-template-columns: repeat(2, 1fr);
                gap: 24px
            }
            .safety-panel-grid {
                grid-template-columns: 1fr
            }
            .process-node {
                grid-template-columns: 1fr;
                gap: 16px
            }
            .contact-grid {
                grid-template-columns: 1fr
            }
            .faq-layout {
                grid-template-columns: 1fr
            }
            .faq-sidebar {
                position: static
            }
            .footer-top {
                flex-direction: column;
                gap: 20px;
                text-align: center
            }
        }
        
        @media(max-width:640px) {
            .hero-title {
                font-size: 2.2rem
            }
            .hero-subtitle {
                font-size: 1rem
            }
            .hero-stats {
                flex-direction: column
            }
            .hero-stat-item {
                border-right: none;
                border-bottom: 1px solid rgba(255, 255, 255, .06);
                padding-right: 0;
                padding-bottom: 12px
            }
            .hero-stat-item:last-child {
                border-bottom: none;
                padding-bottom: 0
            }
            .section {
                padding: 80px 0
            }
            .section-h2 {
                font-size: 1.7rem
            }
            .cert-wall {
                grid-template-columns: 1fr
            }
            .gallery-grid {
                grid-template-columns: 1fr
            }
            .gallery-item.featured {
                grid-column: span 1;
                aspect-ratio: 4/3
            }
            .products-gallery {
                grid-template-columns: 1fr
            }
            .compare-card {
                padding: 32px 24px
            }
            .safety-tabs {
                flex-direction: column
            }
            .contact-form-box {
                padding: 28px 20px
            }
            .form-pair {
                grid-template-columns: 1fr
            }
            .nav-main,
            .header-cta {
                display: none
            }
            .mobile-toggle {
                display: block
            }
            .header-inner {
                grid-template-columns: 1fr auto
            }
            .container,
            .container-wide {
                padding: 0 20px
            }
            .hero-content {
                padding: 0 20px
            }
            .hero-left {
                padding-top: 20px
            }
            .hero-tag {
                font-size: .65rem;
                letter-spacing: 2px;
                padding: 6px 12px;
                margin-bottom: 20px
            }
            .hero-title {
                font-size: 1.9rem;
                letter-spacing: -1px;
                margin-bottom: 18px
            }
            .hero-subtitle {
                font-size: .9rem;
                margin-bottom: 24px
            }
            .hero-actions {
                flex-direction: column
            }
            .hero-actions a {
                text-align: center
            }
            .hero-stats {
                padding: 24px 20px;
                gap: 16px
            }
            .hero-stat-num {
                font-size: 1.8rem
            }
            .hero-switcher {
                right: 20px
            }
            .section-head {
                margin-bottom: 36px
            }
            .section-h2 {
                font-size: 1.55rem
            }
            .section-sub {
                font-size: .9rem
            }
            .solutions,
            .products,
            .safety,
            .cases,
            .site-gallery,
            .advantages,
            .process,
            .faq,
            .contact {
                padding: 60px 0
            }
            .solutions-bento {
                grid-template-columns: 1fr;
                grid-template-areas: unset
            }
            .sol-cell {
                min-height: 240px;
                margin-bottom: 20px;
            }
            .sol-cell-large {
                min-height: 280px
            }
            .sol-content {
                padding: 24px 20px 28px
            }
            .sol-cell h3 {
                font-size: 1.15rem
            }
            .sol-cell p {
                font-size: .82rem
            }
            .cases-grid {
                grid-template-columns: 1fr
            }
            .case-box {
                min-height: 300px
            }
            .case-inner {
                padding: 24px 20px
            }
            .case-metrics {
                flex-wrap: wrap;
                gap: 12px
            }
            .adv-bento {
                grid-template-columns: 1fr
            }
            .adv-box {
                padding: 28px 22px
            }
            .compare-banner {
                flex-direction: column;
                text-align: center;
                padding: 22px 20px
            }
            .compare-list li {
                flex-direction: column;
                gap: 4px
            }
            .compare-list .cl-label {
                min-width: auto
            }
            .products-list {
                gap: 28px;
                margin-top: 36px
            }
            .product-visual {
                min-height: 180px
            }
            .product-content {
                padding: 24px 18px
            }
            .product-content h3 {
                font-size: 1.15rem
            }
            .product-content h3.product-primary-title {
                font-size: 1.4rem
            }
            .product-content>p {
                font-size: .85rem;
                margin-bottom: 20px
            }
            .safety-tabs {
                flex-wrap: wrap
            }
            .safety-tab {
                padding: 10px 14px;
                font-size: .82rem
            }
            .safety-panel-grid {
                gap: 10px
            }
            .safety-item {
                padding: 14px 16px;
                font-size: .82rem
            }
            .cert-wall {
                gap: 16px;
                margin-top: 28px
            }
            .gallery-grid {
                gap: 10px
            }
            .faq-layout {
                gap: 24px;
                margin-top: 32px
            }
            .faq-sidebar h3 {
                font-size: .7rem
            }
            .faq-nav-item {
                padding: 10px 14px;
                font-size: .82rem
            }
            .faq-block h4 {
                font-size: 1.05rem
            }
            .faq-block p {
                font-size: .85rem
            }
            .contact-grid {
                gap: 36px
            }
            .contact-left .section-h2 {
                font-size: 1.5rem
            }
            .contact-form-box {
                padding: 24px 18px
            }
            .footer-top {
                padding: 0 20px
            }
            .footer-nav {
                justify-content: center;
                gap: 14px 18px
            }
            .footer-social {
                padding: 24px 20px
            }
            .footer-social-links {
                gap: 10px
            }
            .social-link {
                padding: 8px 14px;
                font-size: .76rem
            }
        }
        
        @media(max-width:480px) {
            .hero-title {
                font-size: 1.6rem
            }
            .section-h2 {
                font-size: 1.35rem
            }
            .section-tag {
                font-size: .65rem;
                letter-spacing: 2px
            }
            .hero-stat-num {
                font-size: 1.5rem
            }
            .hero-stat-label {
                font-size: .7rem
            }
            .sol-tags {
                gap: 4px
            }
            .sol-tags span {
                font-size: .65rem;
                padding: 3px 8px
            }
            .case-metric-num {
                font-size: 1.2rem
            }
            .product-num {
                font-size: 2.5rem
            }
            .product-visual-icon {
                width: 60px;
                height: 60px;
                margin: 16px auto
            }
            .product-visual-icon svg {
                width: 28px;
                height: 28px
            }
            .adv-box h3 {
                font-size: 1rem
            }
            .adv-box p {
                font-size: .8rem
            }
            .cert-wall-info h4 {
                font-size: .75rem
            }
            .lightbox {
                padding: 20px
            }
            .lightbox img {
                max-width: 95%
            }
            .lightbox-nav {
                font-size: 1.5rem;
                padding: 10px 14px
            }
            .fab-bar {
                right: 10px;
                bottom: 80px;
                gap: 8px
            }
            .fab-btn {
                padding: 8px 10px;
                font-size: .7rem
            }
        }
        /* ===== Animations ===== */
        
        @keyframes fadeUp {
            from {
                opacity: 0;
                transform: translateY(30px)
            }
            to {
                opacity: 1;
                transform: translateY(0)
            }
        }
        
        .hero-tag,
        .hero-title,
        .hero-subtitle,
        .hero-actions,
        .hero-stats {
            opacity: 0
        }
        
        .hero-content.active .hero-tag {
            animation: fadeUp .7s var(--ease) .1s forwards
        }
        
        .hero-content.active .hero-title {
            animation: fadeUp .7s var(--ease) .2s forwards
        }
        
        .hero-content.active .hero-subtitle {
            animation: fadeUp .7s var(--ease) .3s forwards
        }
        
        .hero-content.active .hero-actions {
            animation: fadeUp .7s var(--ease) .4s forwards
        }
        
        .hero-content.active .hero-stats {
            animation: fadeUp .7s var(--ease) .5s forwards
        }
        
        @media only screen and (min-width: 996px) {}
        
        @media only screen and (max-width: 996px) {
            .solutions-bento {
                display: block !important;
            }
        }
        
        .fab-btn[title="电话"] svg {
            color: #d97b35 !important;
        }
        
        .fab-btn[title="电话"] .fab-label {
            color: #d97b35 !important;
        }
        
        .fab-btn[title="电话"]:hover {
            background: rgba(0, 61, 130, .12);
            border-color: rgba(217, 123, 53, .6) !important;
            transform: translateX(-4px);
        }
        
        .fab-btn img {
            filter: grayscale(100%) invert(100%);
        }
        
        .fab-btn:hover img {
            filter: none !important;
        }
        
        .footer-social-links a img {
            filter: grayscale(100%) invert(100%);
        }
        
        .footer-social-links a:hover img {
            filter: none !important;
        }