* {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: 'Segoe UI', 'Arial', sans-serif;
    }

    body {
        background-color: #ffffff;
        color: #333333;
        line-height: 1.6;
        overflow-x: hidden;
        position: relative;
    }
    /* 修复所有图标倾斜问题 - 全局解决方案 */
    .fas,
    .far,
    .fab,
    .fa-solid,
    .fa-regular,
    .fa-brands {
        font-style: normal !important;
    }

    /* 确保所有图标容器内的图标都正常显示 */
    .step-circle i,
    .section-icon i,
    .option-icon i,
    .wireless-icon i,
    .nav-btn i {
        font-style: normal !important;
        transform: none !important;
    }
    /* 全屏科技感背景 - 白色版本 */
    .tech-background {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -3;
        pointer-events: none;
        background:
            radial-gradient(circle at 20% 30%, rgba(0, 123, 255, 0.03) 0%, transparent 50%),
            radial-gradient(circle at 80% 70%, rgba(0, 198, 255, 0.03) 0%, transparent 50%),
            linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    }

    /* 动态网格背景 */
    .grid-background {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -2;
        background-image:
            linear-gradient(rgba(0, 123, 255, 0.05) 1px, transparent 1px),
            linear-gradient(90deg, rgba(0, 123, 255, 0.05) 1px, transparent 1px);
        background-size: 50px 50px;
        opacity: 0.4;
        animation: gridMove 20s linear infinite;
    }

    @keyframes gridMove {
        0% {
            transform: translate(0, 0);
        }
        100% {
            transform: translate(50px, 50px);
        }
    }

    /* 物联网连接线效果 - 白色背景版本 */
    .iot-connections {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        pointer-events: none;
    }

    .connection {
        position: absolute;
        background: linear-gradient(90deg, transparent, rgba(0, 123, 255, 0.2), transparent);
        height: 1px;
        transform-origin: left center;
        animation: connectionPulse 4s infinite;
    }

    @keyframes connectionPulse {
        0%,
        100% {
            opacity: 0.1;
        }
        50% {
            opacity: 0.3;
        }
    }

    /* 浮动数据点 - 白色背景版本 */
    .data-points {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        pointer-events: none;
    }

    .data-point {
        position: absolute;
        width: 4px;
        height: 4px;
        background-color: rgba(0, 123, 255, 0.5);
        border-radius: 50%;
        box-shadow: 0 0 8px rgba(0, 123, 255, 0.3);
        animation: dataPointFloat 8s infinite ease-in-out;
    }

    @keyframes dataPointFloat {
        0%,
        100% {
            transform: translateY(0) scale(1);
            opacity: 0.3;
        }
        50% {
            transform: translateY(-20px) scale(1.2);
            opacity: 0.6;
        }
    }

    /* 脉冲光环 - 白色背景版本 */
    .pulse-ring {
        position: absolute;
        border-radius: 50%;
        border: 1px solid rgba(0, 123, 255, 0.15);
        animation: pulse 3s infinite;
    }

    @keyframes pulse {
        0% {
            transform: scale(0.8);
            opacity: 0.3;
        }
        70% {
            transform: scale(1.5);
            opacity: 0;
        }
        100% {
            transform: scale(1.5);
            opacity: 0;
        }
    }

    .container {
        max-width: 1400px;
        margin: 0 auto;
        padding: 20px;
    }

    /* 顶部横幅 - 白色背景版本 - 尺寸缩小 */
    .product-banner {
        position: relative;
        padding: 60px 0;
        text-align: center;
        border-radius: 20px;
        margin-bottom: 40px;
        overflow: hidden;
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
        border: 1px solid rgba(0, 123, 255, 0.1);
        box-shadow:
            0 15px 30px rgba(0, 0, 0, 0.05),
            inset 0 1px 0 rgba(255, 255, 255, 0.8);
    }

    .product-banner::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.03) 0%, transparent 50%);
        z-index: 0;
    }

    .product-banner h1 {
        font-size: 2.8rem;
        margin-bottom: 15px;
        font-weight: 800;
        position: relative;
        z-index: 1;
        background: linear-gradient(90deg, #007bff, #00c6ff);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: titleGlow 3s infinite alternate;
    }

    @keyframes titleGlow {
        0% {
            text-shadow: 0 0 20px rgba(0, 123, 255, 0.1);
        }
        100% {
            text-shadow: 0 0 30px rgba(0, 198, 255, 0.2);
        }
    }

    .product-subtitle {
        font-size: 1.5rem;
        margin-bottom: 20px;
        color: #64748b;
        font-weight: 400;
        position: relative;
        z-index: 1;
    }

    .product-tagline {
        font-size: 1.1rem;
        max-width: 800px;
        margin: 0 auto;
        padding: 20px;
        background: rgba(255, 255, 255, 0.8);
        border-radius: 12px;
        border: 1px solid rgba(0, 123, 255, 0.1);
        color: #475569;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(5px);
    }

    .product-tagline::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(0, 198, 255, 0.05), transparent);
        animation: shimmer 6s infinite;
    }

    @keyframes shimmer {
        0% {
            left: -100%;
        }
        100% {
            left: 100%;
        }
    }

    /* 主要特性区域 - 白色背景版本 */
    .features-section {
        margin-bottom: 60px;
    }

    .section-header {
        display: flex;
        align-items: center;
        margin-bottom: 40px;
        padding-bottom: 15px;
        border-bottom: 1px solid rgba(0, 123, 255, 0.1);
        position: relative;
    }

    .section-header::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        width: 100px;
        height: 2px;
        background: linear-gradient(90deg, #007bff, #00c6ff);
        animation: lineGrow 2s infinite alternate;
    }

    @keyframes lineGrow {
        0% {
            width: 100px;
        }
        100% {
            width: 150px;
        }
    }

    .section-icon {
        width: 60px;
        height: 60px;
        background: rgba(0, 123, 255, 0.05);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 20px;
        color: #007bff;
        font-size: 1.8rem;
        border: 1px solid rgba(0, 123, 255, 0.1);
        position: relative;
        overflow: hidden;
    }

    .section-icon::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: linear-gradient(45deg, transparent, rgba(0, 198, 255, 0.05), transparent);
        animation: iconShine 3s infinite;
    }

    @keyframes iconShine {
        0% {
            transform: rotate(0deg);
        }
        100% {
            transform: rotate(360deg);
        }
    }

    .section-title {
        font-size: 2.2rem;
        font-weight: 700;
        color: #1e293b;
    }

    .section-subtitle {
        color: #64748b;
        font-size: 1.1rem;
        margin-top: 8px;
    }

    /* 特性卡片网格 - 白色背景版本 - 更新为列表样式 */
    .features-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
        gap: 25px;
    }

    .feature-card {
        background: white;
        border-radius: 18px;
        padding: 30px;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
        position: relative;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .feature-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.02), transparent);
        z-index: 0;
    }

    .feature-card:hover {
        transform: translateY(-8px);
        box-shadow:
            0 15px 35px rgba(0, 123, 255, 0.1),
            0 0 0 1px rgba(0, 198, 255, 0.1);
        border-color: rgba(0, 198, 255, 0.2);
    }

    .feature-card:hover .feature-icon {
        transform: scale(1.1) rotate(5deg);
        box-shadow: 0 0 20px rgba(0, 198, 255, 0.1);
    }

    .feature-header {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        position: relative;
        z-index: 1;
    }

    /* 正方形图标样式 */
    .square-icon {
        width: 55px;
        height: 55px;
        background: rgba(0, 123, 255, 0.05);
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 18px;
        color: #007bff;
        font-size: 1.6rem;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        position: relative;
        z-index: 1;
        flex-shrink: 0;
    }

    .feature-title {
        font-size: 1.5rem;
        font-weight: 600;
        color: #1e293b;
        position: relative;
        z-index: 1;
    }

    /* 特性列表样式 */
    .feature-list {
        list-style-type: none;
        position: relative;
        z-index: 1;
        flex-grow: 1;
    }

    .feature-list li {
        padding: 8px 0;
        color: #475569;
        line-height: 1.6;
        font-size: 1rem;
        display: flex;
        align-items: flex-start;
        border-bottom: 1px solid rgba(226, 232, 240, 0.5);
    }

    .feature-list li:last-child {
        border-bottom: none;
    }

    .feature-list li i {
        color: #007bff;
        margin-right: 10px;
        margin-top: 3px;
        font-size: 0.85rem;
    }

    /* 动态数字指标 - 白色背景版本 - 框架缩小 */
    .stats-section {
        margin-bottom: 60px;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 25px;
        margin-top: 30px;
    }

    .stat-card {
        background: white;
        border-radius: 18px;
        padding: 30px 20px;
        text-align: center;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
        position: relative;
        overflow: hidden;
    }

    .stat-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.02), transparent);
        z-index: 0;
    }

    .stat-card:hover {
        transform: translateY(-8px);
        box-shadow:
            0 15px 35px rgba(0, 123, 255, 0.1),
            0 0 0 1px rgba(0, 198, 255, 0.1);
        border-color: rgba(0, 198, 255, 0.2);
    }

    .stat-icon {
        font-size: 2.2rem;
        color: #007bff;
        margin-bottom: 15px;
        position: relative;
        z-index: 1;
    }

    .stat-number {
        font-size: 3rem;
        font-weight: 800;
        color: #007bff;
        margin-bottom: 8px;
        position: relative;
        z-index: 1;
        font-family: 'Arial Black', 'Segoe UI', sans-serif;
    }

    .stat-symbol {
        font-size: 1.8rem;
        color: #007bff;
        position: relative;
        z-index: 1;
    }

    .stat-label {
        font-size: 1.1rem;
        color: #475569;
        font-weight: 500;
        position: relative;
        z-index: 1;
    }

    /* 应用场景 - 白色背景版本 */
    .applications-section {
        margin-bottom: 60px;
    }

    .applications-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 25px;
    }

    .application-card {
        background: white;
        border-radius: 18px;
        padding: 25px;
        text-align: center;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
        position: relative;
        overflow: hidden;
    }

    .application-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.02), transparent);
        z-index: 0;
    }

    .application-card:hover {
        transform: translateY(-8px);
        box-shadow:
            0 15px 35px rgba(0, 123, 255, 0.1),
            0 0 0 1px rgba(0, 198, 255, 0.1);
        border-color: rgba(0, 198, 255, 0.2);
    }

    .application-card:hover .application-icon {
        transform: scale(1.2);
    }

    .application-icon {
        font-size: 2.5rem;
        color: #007bff;
        margin-bottom: 15px;
        transition: all 0.4s ease;
        position: relative;
        z-index: 1;
    }

    .application-title {
        font-size: 1.3rem;
        font-weight: 600;
        color: #1e293b;
        margin-bottom: 12px;
        position: relative;
        z-index: 1;
    }

    .application-desc {
        color: #64748b;
        font-size: 0.95rem;
        position: relative;
        z-index: 1;
    }

    /* 配置灵活性动态数字部分 */
    .flexibility-section {
        margin-bottom: 60px;
    }

    .flexibility-stats {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 25px;
        margin-top: 30px;
    }

    .flexibility-stat {
        background: white;
        border-radius: 18px;
        padding: 30px 20px;
        text-align: center;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
        position: relative;
        overflow: hidden;
    }

    .flexibility-stat::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.02), transparent);
        z-index: 0;
    }

    .flexibility-stat:hover {
        transform: translateY(-8px);
        box-shadow:
            0 15px 35px rgba(0, 123, 255, 0.1),
            0 0 0 1px rgba(0, 198, 255, 0.1);
        border-color: rgba(0, 198, 255, 0.2);
    }

    .flexibility-icon {
        font-size: 2.2rem;
        color: #00c6ff;
        margin-bottom: 15px;
        position: relative;
        z-index: 1;
    }

    .flexibility-number {
        font-size: 3rem;
        font-weight: 800;
        color: #00c6ff;
        margin-bottom: 8px;
        position: relative;
        z-index: 1;
        font-family: 'Arial Black', 'Segoe UI', sans-serif;
    }

    .flexibility-symbol {
        font-size: 1.8rem;
        color: #00c6ff;
        position: relative;
        z-index: 1;
    }

    .flexibility-label {
        font-size: 1.1rem;
        color: #475569;
        font-weight: 500;
        position: relative;
        z-index: 1;
    }

    /* 质量认证 - 更新为列表样式 */
    .certification-section {
        margin-bottom: 60px;
    }

    .certification-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 25px;
    }

    .certification-card {
        background: white;
        border-radius: 18px;
        padding: 30px;
        border: 1px solid rgba(0, 123, 255, 0.1);
        transition: all 0.4s ease;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
        position: relative;
        overflow: hidden;
    }

    .certification-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.02), transparent);
        z-index: 0;
    }

    .certification-card:hover {
        transform: translateY(-8px);
        box-shadow:
            0 15px 35px rgba(0, 123, 255, 0.1),
            0 0 0 1px rgba(0, 198, 255, 0.1);
        border-color: rgba(0, 198, 255, 0.2);
    }

    .certification-header {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        position: relative;
        z-index: 1;
    }

    .certification-icon {
        width: 50px;
        height: 50px;
        background: rgba(0, 123, 255, 0.05);
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 15px;
        color: #007bff;
        font-size: 1.4rem;
        border: 1px solid rgba(0, 123, 255, 0.1);
    }

    .certification-title {
        font-size: 1.4rem;
        font-weight: 600;
        color: #1e293b;
    }

    /* 认证列表样式 */
    .certification-list {
        list-style-type: none;
        position: relative;
        z-index: 1;
    }

    .certification-list li {
        padding: 8px 0;
        color: #475569;
        line-height: 1.6;
        font-size: 1rem;
        display: flex;
        align-items: flex-start;
        border-bottom: 1px solid rgba(226, 232, 240, 0.5);
    }

    .certification-list li:last-child {
        border-bottom: none;
    }

    .certification-list li i {
        color: #007bff;
        margin-right: 10px;
        margin-top: 3px;
        font-size: 0.85rem;
    }

    /* 底部行动区域 - 白色背景版本 */
    .action-section {
        background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
        border-radius: 20px;
        padding: 50px;
        text-align: center;
        margin-bottom: 50px;
        border: 1px solid rgba(0, 123, 255, 0.1);
        box-shadow:
            0 15px 30px rgba(0, 0, 0, 0.05),
            inset 0 1px 0 rgba(255, 255, 255, 0.8);
        position: relative;
        overflow: hidden;
    }

    .action-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(135deg, rgba(0, 123, 255, 0.03), transparent);
        z-index: 0;
    }

    .action-title {
        font-size: 2.2rem;
        font-weight: 700;
        color: #1e293b;
        margin-bottom: 20px;
        position: relative;
        z-index: 1;
    }

    .action-buttons {
        display: flex;
        justify-content: center;
        gap: 20px;
        margin-top: 30px;
        position: relative;
        z-index: 1;
    }

    .action-btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        background: linear-gradient(135deg, #007bff, #00c6ff);
        color: white;
        border: none;
        padding: 16px 30px;
        border-radius: 12px;
        font-weight: 600;
        font-size: 1.1rem;
        cursor: pointer;
        transition: all 0.4s ease;
        text-decoration: none;
        box-shadow: 0 8px 20px rgba(0, 123, 255, 0.15);
        position: relative;
        overflow: hidden;
    }

    .action-btn::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
        transition: left 0.7s;
    }

    .action-btn:hover::before {
        left: 100%;
    }

    .action-btn:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 25px rgba(0, 123, 255, 0.25);
    }

    .action-btn.secondary {
        background: white;
        color: #475569;
        border: 1px solid rgba(0, 123, 255, 0.2);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    }

    .action-btn.secondary:hover {
        background: white;
        color: #1e293b;
        border-color: rgba(0, 198, 255, 0.3);
        box-shadow: 0 8px 20px rgba(0, 123, 255, 0.15);
    }

    /* 物联网设备图标动画 */
    .iot-device {
        position: absolute;
        font-size: 1.5rem;
        color: rgba(0, 123, 255, 0.4);
        animation: deviceFloat 10s infinite ease-in-out;
    }

    @keyframes deviceFloat {
        0%,
        100% {
            transform: translate(0, 0) rotate(0deg);
        }
        25% {
            transform: translate(20px, -10px) rotate(5deg);
        }
        50% {
            transform: translate(0, -20px) rotate(0deg);
        }
        75% {
            transform: translate(-20px, -10px) rotate(-5deg);
        }
    }

    /* 响应式设计 */
    @media (max-width: 1024px) {
        .features-grid {
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        }

        .stats-grid,
        .flexibility-stats {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 768px) {
        .product-banner h1 {
            font-size: 2.2rem;
        }

        .product-subtitle {
            font-size: 1.2rem;
        }

        .section-title {
            font-size: 1.8rem;
        }

        .features-grid,
        .applications-grid,
        .certification-grid {
            grid-template-columns: 1fr;
        }

        .stats-grid,
        .flexibility-stats {
            grid-template-columns: 1fr;
        }

        .action-buttons {
            flex-direction: column;
            align-items: center;
        }

        .action-btn {
            width: 100%;
            max-width: 280px;
            justify-content: center;
        }

        .action-section {
            padding: 35px 20px;
        }

        .stat-number,
        .flexibility-number {
            font-size: 2.5rem;
        }

        .square-icon {
            width: 50px;
            height: 50px;
            font-size: 1.4rem;
        }

        .product-banner {
            padding: 40px 0;
        }
    }

    @media (max-width: 480px) {
        .section-header {
            flex-direction: column;
            align-items: flex-start;
        }

        .section-icon {
            margin-bottom: 15px;
        }

        .stat-number,
        .flexibility-number {
            font-size: 2.2rem;
        }

        .square-icon {
            width: 45px;
            height: 45px;
            font-size: 1.3rem;
            margin-right: 15px;
        }

        .feature-header {
            flex-direction: column;
            align-items: flex-start;
        }

        .feature-header h3 {
            margin-top: 12px;
        }

        .product-banner h1 {
            font-size: 1.8rem;
        }

        .product-subtitle {
            font-size: 1.1rem;
        }

        .product-tagline {
            padding: 15px;
            font-size: 1rem;
        }
    }