:root {
    --main-bg: #ffffff;
    --secondary-bg: #112240;
    --accent: #e60012;   
    --text-main:#555555;
    --text-sub: #8892b0;
}


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

body {
    font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
    
    color: var(--text-main);
}


.container {
    max-width: 1800px;
    margin: auto;
    padding: 0 50px;
}


.header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 15px 0;
    background: rgba(10, 25, 47, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
}


.logo {
    display: flex;
    align-items: center;
    gap: 10px;
}

.logo img {
    height: 70px;
}

.logo span {
    font-size: 18px;
    font-weight: bold;
}


.nav {
    display: flex;
    list-style: none;
    gap: 14px;
    margin-right: 30px;
}

.nav a {
    color: var(--text-sub);
    text-decoration: none;
    font-size: 15px;
    position: relative;
    transition: 0.3s;
}


.nav a:hover {
    color: var(--text-main);
}


.nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 0;
    height: 2px;
    background: var(--accent);
    transition: 0.3s;
}

.nav a:hover::after {
    width: 100%;
}




.hero h1 {
    font-size: 52px;
    font-weight: bold;
    letter-spacing: 2px;
    animation: fadeUp 1s ease forwards;
}


.hero p {
    margin-top: 20px;
    font-size: 18px;
    color: var(--text-sub);
    animation: fadeUp 1.5s ease forwards;
}


.hero::after {
    content: "";
    width: 60px;
    height: 4px;
    background: var(--accent);
    margin-top: 30px;
}

.hero {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 80px;

    background: radial-gradient(circle at left);
}


.hero-content {
    max-width: 500px;
}

.hero-content h1 {
    font-size: 48px;
}

.hero-content p {
    margin-top: 20px;
    color: #8892b0;
}


.hero-image img {
    width: 500px;

    animation: float 4s ease-in-out infinite;
}


@keyframes float {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-15px);
    }
    100% {
        transform: translateY(0px);
    }
}


.section {
    padding: 80px 320px;
    text-align: center;
}

.section h2 {
    font-size: 32px;
    margin-bottom: 50px;
}


.grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}
.grid a {
    text-decoration: none;
    color: #444444;
}



















.card:hover {
    transform: translateY(-10px) scale(1.03);
    background: #ffffff;
    color: #e60012;
} 


.news-item {
    margin-bottom: 20px;
    padding: 15px;
    border-bottom: 1px solid #233554;
    text-align: left;
}


.footer {
    text-align: center;
    padding: 30px;
    background: #ffffff;
    color: var(--text-main);
}


@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 5px;
    background: none;
    border: none;
    z-index: 1001;
}
.hamburger span {
    display: block;
    width: 25px;
    height: 2px;
    background: #333;
    transition: 0.3s;
    border-radius: 2px;
}
.hamburger.active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}
.hamburger.active span:nth-child(2) {
    opacity: 0;
}
.hamburger.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
}


@media (max-width: 768px) {
    
    .container {
        padding: 0 15px;
    }

    
    .nav-wrap {
        height: 60px;
    }

    
    .logo img {
        height: 40px;
    }

    
    .hamburger {
        display: flex;
    }

    
    nav {
        position: absolute;
        top: 60px;
        left: 0;
        right: 0;
        background: rgba(255, 255, 255, 0.98);
        backdrop-filter: blur(10px);
        padding: 10px 0;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        display: none;
    }
    nav.open {
        display: block;
    }
    .nav {
        flex-direction: column;
        gap: 0;
        margin: 0;
        width: 100%;
    }
    .nav li {
        padding: 0;
    }
    .nav li a {
        display: block;
        padding: 12px 20px;
        font-size: 15px;
        border-bottom: 1px solid #f0f0f0;
    }
    .nav a::after {
        display: none;
    }

    
    .dropdown-menu {
        position: static;
        background: rgba(0, 0, 0, 0.03);
        box-shadow: none;
        min-width: 100%;
    }
    .dropdown:hover .dropdown-menu {
        display: none;
    }
    .dropdown.open .dropdown-menu {
        display: block;
    }

    
    .top-contact {
        display: none;
    }

    .hero h1 {
        font-size: 32px;
    }

    .grid {
        grid-template-columns: 1fr;
    }

    .section {
        padding: 60px 15px;
    }

    
.abc {
    
    width: auto;
    max-width: 100%;
    text-indent: 0;          
    text-align: justify;      
    font-size: 15px;
    line-height: 1.8;
}

.contact-info-box {
    font-size: 18px;
    line-height: 2.2;
    text-align: center;
}

.contact-info-box {
    font-size: 15px;
    text-align: left;
    padding: 0 5px;
}


    
    .content-us {
        padding: 60px 15px 100px;
    }
    .content-us > div[style*="text-align: center"] {
        text-align: left !important;
    }
    .content-us p {
        text-align: center !important;
        word-break: normal !important;
        white-space: normal !important;
    }
    
    .contact-info-box {
        font-size: 15px;
        line-height: 2;
        text-align: left;
        padding: 0 5px;
    }
    .contact-info-box p {
        text-align: left !important;
        margin: 6px 0;
    }

    
    .about-banner {
        height: 200px;
        margin-top: 60px;
    }
    .about-banner h1 {
        font-size: 28px;
    }

    
    .sub-nav {
        gap: 15px;
        flex-wrap: wrap;
        padding: 10px 15px;
    }
    .sub-nav a {
        font-size: 13px;
        padding: 6px 14px;
    }

    
    .service-cards {
        flex-direction: column;
    }
    .card {
        margin: 20px 15px;
        padding: 25px 20px;
    }

    
    .zhiwei {
        flex-direction: column;
    }
    .zhiwei-div {
        max-width: 100%;
        min-width: unset;
    }

    
    .footer-top {
        flex-direction: column;
        gap: 20px;
        text-align: center;
    }
    .footer-contact {
        text-align: center;
    }
}

.header {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;

    background: linear-gradient(
        to right,
        rgb(255, 255, 255),
        rgb(255, 255, 255,80%)
    );

    backdrop-filter: blur(8px);
}

.nav-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 80px;
    position: relative;
}


.nav li {
    position: relative;
    z-index: 1;
    padding-left: 20px;
}

.nav a {
    color: #5f5d5d;
    text-decoration: none;
    font-size: 18px;
}


.nav a::after {
    content: "";
    display: block;
    height: 2px;
    background: #e60012;
    width: 0;
    transition: 0.3s;
}

.dropdown-menu {
    position: absolute;
    top: 40px;
    left: 0;

    background: rgba(17, 34, 64, 0.95);
    padding: 10px 0;
    list-style: none;

    min-width: 180px;
    display: none;
}

.dropdown-menu li {
    padding: 10px 20px;
    color: #ccc;
    cursor: pointer;
}

.dropdown-menu li:hover {
    background: #1b2f4a;
    color: #fff;
}


.dropdown:hover .dropdown-menu {
    display: block;
}


.nav-right a {
    color: #b12e2e;
    text-decoration: none;
}

.nav-right a:hover {
    color: #e3acac;
}


.about-banner {
    height: 300px;
    background:rgb(80 135 215 / 24%) center/cover no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    color:#ffffff;
    margin-top: 80px;
    position: relative;
}

.about-banner::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    
    background: url(../img/11111.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}


.about-banner h1 {
    position: relative;
    font-size: 40px;
    z-index: 2;
}


.sub-nav {
    display: flex;
    justify-content: center;
    gap: 40px;
    background: #f5f5f5;
    padding: 15px 0;
}

.sub-nav a {
    color: #333;
    text-decoration: none;
    padding: 8px 20px;
    border-radius: 20px;
}

.sub-nav :hover {
    background: #0a3d62;
    color: #fff;
}

















.about-content p {
    color: #555;
    line-height: 2;
    margin-bottom: 20px;
}
.abc {
    text-align: left;
    font-family: "Microsoft YaHei", Arial, sans-serif;
    text-indent: 2em;
    line-height: 35px;
    margin-left: 30px;
    margin-right: 30px;
}






    
    


 



.nav li.active > a::after {
    content: "";
    display: block;
    width: 20px;
    height: 3px;
    background: #e60012;
    margin: 5px auto 0;
}


.dropdown-menu {
    position: absolute;
    top: 50px;
    left: 0;
    min-width: 180px;

    background: rgba(30, 60, 90, 0.95);
    padding: 0;
    list-style: none;

    display: none;
}


.dropdown:hover .dropdown-menu {
    display: block;
}


.dropdown-menu li {
    padding: 12px 20px;
    color: #ccc;
    cursor: pointer;
    transition: 0.3s;
}


.dropdown-menu li:hover {
    background: rgba(255,255,255,0.1);
    color: #fff;
}


.dropdown-menu li.active {
    background: #1f5c9a;
    color: #fff;
    position: relative;
}


.dropdown-menu li.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 100%;
    background: #e60012;
}
 
.top-contact {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.tel i {
    background: url("../img/tel.png") 
    center no-repeat;
    background-size: cover;
    width: 15px;
    height: 15px;
    margin-right: 10px;
    align-items: center;
}
.flex {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
 }

.joinus {
    display: inline-block;
    margin-left: 20px;
    border-radius: 2em;
    padding: 8px 20px;
    background-color: #ba1935;
    transition: all .3s;
}
.joinus span {
    font-size: 14px;
    display: inline-block;
    margin-left: 10px;
    margin-bottom: 5px;
    color: #ffffff;
}
.joinus:hover {
    background-color: #3e8174;
    text-decoration: underline;
    outline: none;
}
.joinus i {
    background: url("../img/arr_1.png") 
    center no-repeat; 
    width: 10px;
    height: 10px;
    background-size: cover;
    margin-left: 10px;
    vertical-align: middle;
    color: #fff;
    transition: all .3s;
    display: inline-block;
}
i {
    font-style: italic;
}  

.company-gallery {
    padding: 60px 0;
    background:#f5f5f500;
}


.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}


.gallery-item {
    overflow: hidden;
    border-radius: 8px;
}


.gallery-item img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    overflow: hidden;
    border-radius: 10px;
    transition: 0.3s;
}


.gallery-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

@media (max-width: 768px) {
    .gallery-grid {
        grid-template-columns: 1fr;
    }
}

html {
            scroll-behavior: smooth;
        }
  
        .qualification-section {
            
            background-color: #f9fafb;
            text-align: center;
            font-family: 'Microsoft YaHei', sans-serif;
        }
 
        .qualification-section h2 {
            color: var(--text-main);
            font-size: 32px;
            margin-bottom: 10px;
            margin-top: 20px;
            position: relative;
            display: inline-block;
        }
 
        .qualification-section h2::after {
            content: '';
            width: 60px;
            height: 3px;
            background: #0056b3;
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
        }
 
        .section-desc {
            color: #666;
            margin-top: 20px;
            margin-bottom: 40px;
            font-size: 16px;
        }
 
        








   
        .qualification-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr); 
            gap: 30px;
            max-width: 1200px; 
            margin: 0 auto;
        }
 
        
        @media (max-width: 640px) {
            .qualification-grid {
                grid-template-columns: 1fr;
            }
        }
        
        .qualification-card {
            background: #fff;
            border-radius: 8px;
            padding: 20px;
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
            transition: all 0.3s ease;
            cursor: pointer;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
 
        .qualification-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);
        }
 
        
        .cert-img-wrapper {
            width: 100%;
            height: 380px;
            display: flex;
            justify-content: center;
            align-items: center;
            overflow: hidden;
            border: 1px solid #eee;
            border-radius: 4px;
            background-color: #fcfcfc;
        }
 
        .cert-img-wrapper img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
            transition: transform 0.5s ease;
        }
 
        .qualification-card:hover .cert-img-wrapper img {
            transform: scale(1.03);
        }
 
        
        .cert-title {
            margin-top: 15px;
            font-size: 16px;
            color: #333;
            font-weight: bold;
        }
 
        .cert-subtitle {
            font-size: 13px;
            color: #888;
            margin-top: 5px;
        }
 
        
        .lightbox-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            z-index: 9999;
            justify-content: center;
            align-items: center;
            cursor: zoom-out;
        }
 
        .lightbox-overlay img {
            max-width: 90%;
            max-height: 90%;
            object-fit: contain;
            box-shadow: 0 0 30px rgba(0,0,0,0.5);
            border-radius: 4px;
        }
 
        .lightbox-close {
            position: absolute;
            top: 30px;
            right: 30px;
            color: #fff;
            font-size: 36px;
            font-weight: bold;
            cursor: pointer;
            width: 40px;
            height: 40px;
            display: flex;
            justify-content: center;
            align-items: center;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 50%;
            transition: background 0.3s;
        }
 
        .lightbox-close:hover {
            background: rgba(255, 255, 255, 0.3);
        }

        
        .footer {
        background-color: #ffffff;
        color: #555555;
        padding: 40px 20px 20px;
        margin-top: 0;
        border-top: 1px solid #e6eaf0;
      }
      .footer-container {
        max-width: 1200px;
        margin: 0 auto;
      }
      .footer-top {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding-bottom: 20px;
        border-bottom: 1px solid #e6eaf0;
      }
      .footer-nav {
        flex: 1;
        min-width: 300px;
        margin-bottom: 20px;
      }
      .footer-nav a {
        color: #555555;
        text-decoration: none;
        margin-right: 20px;
        font-size: 15px;
        transition: color 0.3s;
        display: inline-block;
        margin-bottom: 10px;
      }
      .footer-nav a:hover {
        color: #fb0303;
      }
      .footer-contact {
        flex: 1;
        min-width: 250px;
        margin-bottom: 20px;
        font-size: 14px;
        color: #666666;
        line-height: 2;
      }
      .footer-contact .hotline {
        font-size: 16px;
        margin-bottom: 5px;
      }
      .footer-contact .hotline strong {
        font-size: 22px;
        color: #112240;
      }
      .footer-qr {
        flex: 0 0 120px;
        text-align: center;
        margin-bottom: 20px;
      }
      .qr-placeholder {
        width: 100%;
        height: 100%;
        position: relative;
        background-color: #fff;
        color: #333;
        display: block;
        align-items: center;
        unicode-bidi: isolate;
        justify-content: center;
        font-size: 12px;
        margin-bottom: 5px;
      }
      .qr-placeholder img {
        border: 0;
        width: 134px;
        height: 136px;
        display: block;
        vertical-align: middle;
      }
      .qr-placeholder p {
        font-size: 14px;
        height: 100%;
        color: #555555;
        text-align: center;
        font-family: Source Han Sans,Geneva,sans-serif;
      }
      .footer-bottom {
        padding-top: 20px;
        text-align: center;
        font-size: 13px;
        color: #999999;
        line-height: 1.8;
      }
      .footer-bottom a {
        color: #999999;
        text-decoration: none;
        transition: color 0.3s;
      }
      .footer-bottom a:hover {
        color: var(--accent);
      }
      @media (max-width: 768px) {
        .footer-top {
          flex-direction: column;
          align-items: center;
          text-align: center;
        }
        .footer-nav a {
          margin-right: 20px;
          margin-left: 20px;
        }
        .footer-contact {
          text-align: center;
        }
      }
      
      
      .zhiwei {
        padding: 0;
        margin: 0;
        display: flex;
        position: relative;
        list-style: none;
        height: 100%;
      }
      .zhiwei-div {
        padding: 0;
        margin: 0 auto ;
        height: 100%;
        padding: 25px;
        flex: 1; 
        min-width: 300px; 
        max-width: 25%; 
        display: flex;
        flex-direction: column;
      }
      .zhiwei span {
        text-align: left;
        font-weight: bolder;
        font-size: 18px;
        color: #1f5c9a;
        display: block;
        line-height: 2.0;
      }
      .zhiwei p {
        font-weight: bolder;
        font-size: 16px;
        color: #666666;
        text-align: left;
        line-height: 2.0;
      }
      .zhiwei-ul {
        text-align: left;
        font-size: 14px;
        line-height: 1.75;
      }
      .zhiwei a {
        display: block;
        unicode-bidi: isolate;
        text-align: initial;
        font-size: 12px;
        font-style: normal;
        vertical-align: top;
        width: 100%;
        color: #ffffff;
      }
      .button-a {
        display: inline-block;
        margin: 10px auto;
        padding: 0;
        border: 6px solid #093e8d;
        border-radius: 20px;
        background-color: #093e8d;
        background-repeat: no-repeat;
        background-position: 0 0;
        line-height: 2.0;
      }
      @media (max-width: 900px) {
            .zhiwei-div  {
                max-width: 100%;
            }
      }

    .service-cards {
            display: flex;
            gap: 30px;
            width: 100%;
            height: 100%;
            position: relative;
        }
    .card {
            background-color: #fff;
            flex: 1;
            padding: 40px 30px;
            margin: 80px;
            border-radius: 8px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.31);
            transition: transform 0.3s, box-shadow 0.3s;
        }
    .card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.1);
        }
    .card h4 {
            font-size: 22px;
            color: #0056b3;
            margin-bottom: 20px;
            border-bottom: 2px solid #f0f0f0;
            padding-bottom: 15px;
        }
     .card p {
            font-size: 18px;
            line-height: 1.8;
            color: #666;
            text-align: justify;
        }
    .card img {
        width: auto;
        height: 53px;
        margin-bottom: 20px;
    }
    .service-bgc {
        background-attachment: fixed;
    }
    .service-content{
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        background-image: url(../img/1hjxkhzkjh.jpg);
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: cover;
        opacity: 1;
        transition: all,0.3s;
    }
      .content-us{
        margin: auto;
        padding: 50px;
        width: 100%;
        height: 100%;
        text-align: center;
        background-image: url(../img/syhkshck111.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        opacity: 1;
        transition: all,0.3s;
        background-size: cover;
    }
    
    .contact-info-box {
        font-family: 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
        font-size: 18px;
        line-height: 2.2;
        color: #000000;
        text-align: center;
    }
    .contact-info-box p {
        margin: 8px 0;
    }


        .slider-container {
            position: relative;
            width: 100%;
            height: 100vh;
            overflow: hidden;
        }
        .slider-wrapper {
            display: flex;
            transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            height: 100%;
        }
        .slide {
            min-width: 100%;
            height: 100%;
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        
    
        .slide-bg-1 {
            background-image: url(../img/1.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-position: 50% 80%;
        }
        .slide-bg-2 {
            background-image: url(../img/3.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-position: 50% 80%;
        }
        .slide-bg-3 {
            background-image: url(../img/5.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-position: 50% 80%;
        }
 
        
        .slide::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url(../img/微信图片_20260514173308_472_1.png);
            opacity: 0.1;
            z-index: -1;
        }
 
        .slide-content {
            position: relative;
            z-index: 2;
            text-align: center;
            color: #fff;
            padding: 0 20px;
            max-width: 1000px;
        }
        .slide-subtitle {
            font-size: 24px;
            letter-spacing: 8px;
            margin-bottom: 20px;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 1s 0.3s forwards;
        }
        .slide-title {
            font-size: 68px;
            font-weight: bold;
            letter-spacing: 4px;
            margin-bottom: 30px;
            text-shadow: 0 10px 30px rgba(0,0,0,0.3);
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 1s 0.6s forwards;
            background: linear-gradient(to right, #ffffff, #b3e0ff);
            -webkit-background-clip: text;
            
        }
        .slide-desc {
            font-size: 18px;
            line-height: 1.8;
            margin-bottom: 40px;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 1s 0.9s forwards;
            color: rgba(255,255,255,0.9);
        }
        .slide-btn {
            display: inline-block;
            padding: 14px 40px;
            background: transparent;
            border: 2px solid #fff;
            color: #fff;
            font-size: 16px;
            text-decoration: none;
            border-radius: 50px;
            transition: all 0.4s;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 1s 1.2s forwards;
        }
        .slide-btn:hover {
            background: #fff;
            color: #001529;
            box-shadow: 0 10px 30px rgba(0,0,0,0.2);
        }
 
        
        .slider-arrow {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 50px;
            height: 50px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255,255,255,0.2);
            color: #fff;
            font-size: 24px;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
            z-index: 10;
            transition: all 0.3s;
            border-radius: 4px;
        }
        .slider-arrow:hover {
            background: rgba(255,255,255,0.2);
        }
        .prev-arrow {
            left: 30px;
        }
        .next-arrow {
            right: 30px;
        }
 
        
        .slider-dots {
            position: absolute;
            bottom: 40px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 12px;
            z-index: 10;
        }
        .dot {
            width: 30px;
            height: 3px;
            background: rgba(255,255,255,0.4);
            cursor: pointer;
            transition: all 0.4s;
        }
        .dot.active {
            width: 50px;
            background: #fff;
        }
 
        
        @keyframes fadeInUp {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
 
        
        @media (max-width: 768px) {
            .nav-links { display: none; }
            .slider-container { height: 70vh; }
            .slide-title { font-size: 36px; letter-spacing: 2px; }
            .slide-subtitle { font-size: 14px; letter-spacing: 3px; }
            .slide-desc { font-size: 13px; line-height: 1.6; margin-bottom: 25px; }
            .slide-btn { padding: 10px 28px; font-size: 14px; }
            .slider-arrow { width: 36px; height: 36px; font-size: 16px; }
            .prev-arrow { left: 15px; }
            .next-arrow { right: 15px; }
            .slider-dots { bottom: 25px; gap: 8px; }
            .dot { width: 20px; height: 3px; }
            .dot.active { width: 35px; }
        }
        @media (max-width: 480px) {
            .slider-container { height: 60vh; }
            .slide-title { font-size: 28px; }
            .slide-subtitle { font-size: 12px; letter-spacing: 2px; margin-bottom: 12px; }
            .slide-desc { font-size: 12px; margin-bottom: 20px; }
            .slide-btn { padding: 8px 22px; font-size: 12px; }
        }
.memu1 a {
    height: auto;
    width: 100%;
    line-height: 34px;
    font-family: Arial;
    font-size: 14px;
    color: #444444;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    outline: none;
    gap: 20px;
}
.memu1::before {
    content: "";
    padding: 0 5px;
}
.memu1 a:hover{
    color: #0349fb;
}


.ipg-wrap {
  --ipg-blue: #0a5eb2;
  --ipg-blue-dark: #073d7a;
  --ipg-blue-light: #e8f1fb;
  --ipg-teal: #00897b;
  --ipg-purple: #6a1b9a;
  --ipg-cyan: #0288d1;
  --ipg-orange: #f5a623;
  --ipg-red: #e04c4c;
  --ipg-text: #1a2340;
  --ipg-muted: #5a6582;
  --ipg-border: #dde3ef;
  --ipg-bg: #f7f9fc;
  --ipg-white: #fff;
  font-family: "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  color: var(--ipg-text);
  line-height: 1.8;
}
.ipg-wrap *, .ipg-wrap *::before, .ipg-wrap *::after { box-sizing: border-box; }


.ipg-inner { max-width: 1080px; margin: 0 auto; padding: 0 20px; }
.ipg-sec { padding: 60px 0; background: var(--ipg-bg); }
.ipg-sec.ipg-white { background: var(--ipg-white); }
.ipg-tag {
  display: inline-block;
  background: var(--ipg-blue-light);
  color: var(--ipg-blue);
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px;
  padding: 3px 12px; border-radius: 4px; margin-bottom: 10px;
}
.ipg-h2 { font-size: clamp(20px,3vw,30px); font-weight: 800; margin-bottom: 12px; line-height: 1.3; }
.ipg-desc { color: var(--ipg-muted); font-size: 15px; max-width: 620px; margin-bottom: 36px; }
.ipg-center { text-align: center; }
.ipg-center .ipg-desc { margin: 0 auto 36px; }


.ipg-hero {
  background: linear-gradient(135deg, #073d7a 0%, #0a5eb2 60%, #1e88e5 100%);
  color: #fff; text-align: center; padding: 64px 20px 52px;
}
.ipg-hero-badge {
  display: inline-block;
  border: 1px solid rgba(255,255,255,0.35);
  padding: 5px 16px; border-radius: 20px;
  font-size: 12px; letter-spacing: 1px; margin-bottom: 18px;
  background: rgba(255,255,255,0.12);
}
.ipg-hero h1 { font-size: clamp(24px,4vw,42px); font-weight: 800; margin-bottom: 14px; }
.ipg-hero h1 em { color: var(--ipg-orange); font-style: normal; }
.ipg-hero p { font-size: 16px; opacity: .88; margin: 0 auto 32px; }
.ipg-stats {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 36px; margin-top: 32px;
}
.ipg-stat strong { display: block; font-size: 32px; font-weight: 900; color: var(--ipg-orange); line-height: 1; }
.ipg-stat span { font-size: 12px; opacity: .8; margin-top: 4px; display: block; }


.ipg-grid-4 { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 16px; }
.ipg-pain-card {
  background: var(--ipg-white); border: 1px solid var(--ipg-border);
  border-radius: 12px; padding: 24px 20px; position: relative; overflow: hidden;
  transition: box-shadow .25s, transform .25s;
}
.ipg-pain-card:hover { box-shadow: 0 6px 24px rgba(10,94,178,.12); transform: translateY(-3px); }
.ipg-pain-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--ipg-blue), var(--ipg-orange));
}
.ipg-pain-icon { font-size: 30px; margin-bottom: 10px; }
.ipg-pain-card h3 { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.ipg-pain-card p { font-size: 13px; color: var(--ipg-muted); line-height: 1.6; }


.ipg-arch {
  background: linear-gradient(135deg,#f0f6ff,#e8f1fb);
  border-radius: 16px; padding: 36px 28px;
}
.ipg-arch-rows { display: flex; flex-direction: column; gap: 12px; max-width: 820px; margin: 0 auto; }
.ipg-arch-row {
  display: flex; align-items: stretch; border-radius: 12px;
  overflow: hidden; box-shadow: 0 2px 14px rgba(10,94,178,.09);
}
.ipg-arch-label {
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  padding: 16px 14px; min-width: 110px; text-align: center;
  font-weight: 800; font-size: 13px; line-height: 1.4; color: #fff;
}
.ipg-arch-label small { font-size: 10px; opacity: .8; font-weight: 500; margin-bottom: 3px; display: block; }
.ipg-l1 .ipg-arch-label { background: #1565c0; }
.ipg-l2 .ipg-arch-label { background: #0288d1; }
.ipg-l3 .ipg-arch-label { background: #00897b; }
.ipg-l4 .ipg-arch-label { background: linear-gradient(135deg,#6a1b9a,#e91e63); }
.ipg-arch-tags {
  flex: 1; background: var(--ipg-white); padding: 14px 18px;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
}
.ipg-atag {
  border-radius: 5px; padding: 4px 12px; font-size: 12px; font-weight: 600;
  background: var(--ipg-blue-light); color: var(--ipg-blue-dark);
}
.ipg-l2 .ipg-atag { background: #e3f2fd; color: #01579b; }
.ipg-l3 .ipg-atag { background: #e0f2f1; color: #00695c; }
.ipg-l4 .ipg-atag { background: #f3e5f5; color: #6a1b9a; }
.ipg-arrow { text-align: center; font-size: 18px; color: var(--ipg-blue); opacity: .4; }


.ipg-feature {
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; margin-bottom: 52px;
}
.ipg-feature.rev { direction: rtl; }
.ipg-feature.rev > * { direction: ltr; }
.ipg-visual {
  border-radius: 14px; overflow: hidden; box-shadow: 0 4px 20px rgba(10,94,178,.1);
  background: var(--ipg-blue-light); min-height: 240px;
  display: flex; align-items: center; justify-content: center;
}
.ipg-visual svg { width: 100%; height: auto; display: block; }
.ipg-feature-text h3 { font-size: 22px; font-weight: 800; margin-bottom: 10px; }
.ipg-feature-text p { color: var(--ipg-muted); font-size: 14px; margin-bottom: 18px; }
.ipg-flist { list-style: none; padding: 0; margin: 0; }
.ipg-flist li {
  display: flex; gap: 9px; align-items: flex-start;
  padding: 7px 0; border-bottom: 1px solid var(--ipg-border); font-size: 13.5px;
}
.ipg-flist li:last-child { border-bottom: none; }
.ipg-dot {
  width: 20px; height: 20px; border-radius: 50%; background: var(--ipg-blue);
  color: #fff; font-size: 11px; flex-shrink: 0; margin-top: 2px;
  display: flex; align-items: center; justify-content: center;
}


.ipg-adv-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 20px; }
.ipg-adv {
  background: var(--ipg-white); border: 1px solid var(--ipg-border);
  border-radius: 12px; padding: 28px 20px; text-align: center;
  transition: all .25s;
}
.ipg-adv:hover { transform: translateY(-4px); box-shadow: 0 6px 24px rgba(10,94,178,.12); }
.ipg-adv-num {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 900; color: #fff; margin: 0 auto 14px;
}
.ipg-adv:nth-child(1) .ipg-adv-num { background: linear-gradient(135deg,#1565c0,#0288d1); }
.ipg-adv:nth-child(2) .ipg-adv-num { background: linear-gradient(135deg,#00897b,#26a69a); }
.ipg-adv:nth-child(3) .ipg-adv-num { background: linear-gradient(135deg,#6a1b9a,#ab47bc); }
.ipg-adv:nth-child(4) .ipg-adv-num { background: linear-gradient(135deg,#f57f17,#ffa726); }
.ipg-adv:nth-child(5) .ipg-adv-num { background: linear-gradient(135deg,#b71c1c,#ef5350); }
.ipg-adv h4 { font-size: 16px; font-weight: 800; margin-bottom: 8px; }
.ipg-adv p { font-size: 13px; color: var(--ipg-muted); line-height: 1.7; }


.ipg-modules { display: flex; flex-wrap: wrap; gap: 10px; }
.ipg-mod {
  background: var(--ipg-white); border: 1.5px solid var(--ipg-border);
  border-radius: 7px; padding: 7px 16px; font-size: 13px; font-weight: 600;
  color: var(--ipg-blue-dark); transition: all .2s; cursor: default;
}
.ipg-mod:hover { background: var(--ipg-blue); color: #fff; border-color: var(--ipg-blue); transform: translateY(-2px); }


.ipg-banner {
  background: linear-gradient(135deg,#073d7a,#0a5eb2);
  border-radius: 16px; display: flex; overflow: hidden;
}
.ipg-bstat {
  flex: 1; padding: 36px 20px; text-align: center; color: #fff;
  border-right: 1px solid rgba(255,255,255,.1);
}
.ipg-bstat:last-child { border-right: none; }
.ipg-bstat .n { font-size: 38px; font-weight: 900; color: var(--ipg-orange); line-height: 1; margin-bottom: 6px; }
.ipg-bstat .n sup,.ipg-bstat .n sub { font-size: 16px; }
.ipg-bstat p { font-size: 12px; opacity: .8; }


.ipg-cta {
  background: linear-gradient(135deg,#073d7a,#0a5eb2);
  color: #fff; text-align: center; padding: 56px 20px;
}
.ipg-cta h2 { font-size: 26px; font-weight: 800; margin-bottom: 12px; }
.ipg-cta p { font-size: 15px; opacity: .85; margin-bottom: 28px; }
.ipg-btn {
  display: inline-block; background: var(--ipg-orange); color: var(--ipg-text);
  font-weight: 800; padding: 12px 36px; border-radius: 36px; font-size: 15px;
  text-decoration: none; transition: all .2s; margin: 0 6px 8px;
}
.ipg-btn:hover { background: #e09415; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.25); }
.ipg-btn.ipg-outline {
  background: transparent; border: 2px solid rgba(255,255,255,.45); color: #fff;
}
.ipg-btn.ipg-outline:hover { background: rgba(255,255,255,.1); }

@media(max-width:768px) {
  .ipg-feature,.ipg-feature.rev { grid-template-columns: 1fr; direction: ltr; }
  .ipg-banner { flex-direction: column; }
  .ipg-bstat { border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); }
  .ipg-bstat:last-child { border-bottom: none; }
  .ipg-stats { gap: 20px; }
}


.jf-wrap{font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",sans-serif;
    color:#2d3748;
    line-height:1.75;
    

    margin:0 auto;
    box-sizing:border-box}
.jf-wrap *{box-sizing:border-box}


.jf-hero{
    background:linear-gradient(135deg,#0f2b46 0%,#1a4971 40%,#1e6b9e 100%);
    background-size: cover;
    background-position: 100% 100%;
    color:#fff;
    text-align:center;
    padding:80px 30px 70px;
    border-radius:16px;
    position:relative;
    overflow:hidden;
    margin:40px 0 0
}
.jf-hero::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 600'%3E%3Cg fill='none' stroke='rgba(255,255,255,.06)' stroke-width='1'%3E%3Crect x='50' y='50' width='100' height='60' rx='4' /%3E%3Crect x='200' y='80' width='100' height='60' rx='4' /%3E%3Crect x='350' y='40' width='100' height='60' rx='4' /%3E%3Crect x='500' y='70' width='100' height='60' rx='4' /%3E%3Crect x='650' y='50' width='100' height='60' rx='4' /%3E%3Crect x='120' y='180' width='100' height='60' rx='4' /%3E%3Crect x='270' y='200' width='100' height='60' rx='4' /%3E%3Crect x='420' y='180' width='100' height='60' rx='4' /%3E%3Crect x='570' y='200' width='100' height='60' rx='4' /%3E%3Crect x='50' y='310' width='100' height='60' rx='4' /%3E%3Crect x='200' y='330' width='100' height='60' rx='4' /%3E%3Crect x='350' y='310' width='100' height='60' rx='4' /%3E%3Crect x='500' y='330' width='100' height='60' rx='4' /%3E%3Crect x='650' y='310' width='100' height='60' rx='4' /%3E%3C/g%3E%3Cg stroke='rgba(255,255,255,.08)' stroke-width='1'%3E%3Cline x1='100' y1='125' x2='100' y2='165' /%3E%3Cline x1='250' y1='155' x2='250' y2='165' /%3E%3Cline x1='400' y1='115' x2='400' y2='165' /%3E%3Cline x1='550' y1='145' x2='550' y2='165' /%3E%3Cline x1='170' y1='255' x2='170' y2='295' /%3E%3Cline x1='320' y1='275' x2='320' y2='295' /%3E%3Cline x1='470' y1='255' x2='470' y2='295' /%3E%3C/g%3E%3C/svg%3E");opacity:.5}
.jf-hero>*{position:relative;z-index:1}
.jf-hero-badge{display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);border-radius:30px;padding:6px 24px;font-size:14px;letter-spacing:3px;margin-bottom:24px;backdrop-filter:blur(10px)}
.jf-hero h1{font-size:clamp(28px,5vw,48px);font-weight:700;margin:0 0 16px;letter-spacing:2px}
.jf-hero p{font-size:clamp(15px,2vw,18px);opacity:.9;max-width:800px;margin:0 auto 32px;line-height:1.9}
.jf-hero-stats{
    display:flex;
    justify-content:center;
    gap:50px;
    flex-wrap:wrap;
    margin-top:20px;

    
}
.jf-hero-stat{text-align:center}
.jf-hero-stat .jf-num{font-size:clamp(26px,3.5vw,38px);font-weight:800;display:block}
.jf-hero-stat .jf-label{font-size:13px;opacity:.75;letter-spacing:1px}


.jf-section{margin:60px 0 0;
        
    padding:0 40px;
}
.jf-sec-tag{display:inline-block;color:#1e6b9e;font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;margin-bottom:8px}
.jf-sec-title{font-size:clamp(22px,3vw,32px);font-weight:700;color:#0f2b46;margin:0 0 12px;line-height:1.4}
.jf-sec-desc{font-size:15px;color:#5a6b7d;max-width:800px;margin:0 0 30px;line-height:1.9}


.jf-overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin:30px 0}
.jf-ov-card{background:#fff;border-radius:14px;padding:32px 26px;box-shadow:0 2px 16px rgba(0,0,0,.06);border:1px solid #e8edf2;transition:transform .25s,box-shadow .25s}
.jf-ov-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.jf-ov-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;font-size:24px}
.jf-ov-card h3{font-size:17px;font-weight:700;color:#0f2b46;margin:0 0 8px}
.jf-ov-card p{font-size:14px;color:#5a6b7d;margin:0;line-height:1.8}


.jf-pain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:30px 0}
.jf-pain-card{background:#fff;border-radius:12px;padding:28px 24px;border-left:4px solid #e74c3c;box-shadow:0 2px 12px rgba(0,0,0,.05);transition:transform .25s}
.jf-pain-card:hover{transform:translateY(-3px)}
.jf-pain-card:nth-child(2){border-left-color:#e67e22}
.jf-pain-card:nth-child(3){border-left-color:#f39c12}
.jf-pain-card:nth-child(4){border-left-color:#1e6b9e}
.jf-pain-card h4{font-size:15px;font-weight:700;color:#0f2b46;margin:0 0 8px}
.jf-pain-card p{font-size:13px;color:#5a6b7d;margin:0;line-height:1.7}


.jf-sys-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px;margin:30px 0}
.jf-sys-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.06);border:1px solid #e8edf2}
.jf-sys-hd{background:linear-gradient(135deg,#0f2b46,#1a4971);color:#fff;padding:20px 24px;display:flex;align-items:center;gap:14px}
.jf-sys-num{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:800;flex-shrink:0}
.jf-sys-hd h4{font-size:17px;margin:0;font-weight:700}
.jf-sys-body{padding:22px 24px}
.jf-sys-body p{font-size:13px;color:#5a6b7d;margin:0 0 14px;line-height:1.8}
.jf-sys-tags{display:flex;flex-wrap:wrap;gap:8px}
.jf-sys-tag{display:inline-block;background:#eef4fa;color:#1e6b9e;font-size:11px;padding:4px 12px;border-radius:18px;font-weight:600}


.jf-std-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:30px 0}
.jf-std-card{background:#fff;border-radius:12px;padding:26px 24px;box-shadow:0 2px 12px rgba(0,0,0,.05);border:1px solid #e8edf2;border-top:3px solid #1e6b9e}
.jf-std-card:nth-child(2){border-top-color:#27ae60}
.jf-std-card:nth-child(3){border-top-color:#e67e22}
.jf-std-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px}
.jf-std-card:nth-child(1) .jf-std-label{color:#1e6b9e}
.jf-std-card:nth-child(2) .jf-std-label{color:#27ae60}
.jf-std-card:nth-child(3) .jf-std-label{color:#e67e22}
.jf-std-card h4{font-size:16px;font-weight:700;color:#0f2b46;margin:0 0 10px}
.jf-std-card ul{list-style:none;padding:0;margin:0}
.jf-std-card li{font-size:13px;color:#5a6b7d;padding:4px 0 4px 18px;position:relative;line-height:1.7}
.jf-std-card li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:#1e6b9e}


.jf-flow{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin:30px 0}
.jf-flow-step{background:#fff;border-radius:14px;padding:30px 22px;text-align:center;flex:1;min-width:200px;max-width:250px;box-shadow:0 2px 16px rgba(0,0,0,.06);border:1px solid #e8edf2;position:relative;transition:transform .25s}
.jf-flow-step:hover{transform:translateY(-4px)}
.jf-flow-num{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#1a4971,#1e6b9e);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800;margin:0 auto 14px}
.jf-flow-step h4{font-size:15px;font-weight:700;color:#0f2b46;margin:0 0 8px}
.jf-flow-step p{font-size:12px;color:#5a6b7d;margin:0;line-height:1.7}


.jf-case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:24px;margin:30px 0}
.jf-case-card{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.06);border:1px solid #e8edf2;transition:transform .25s}
.jf-case-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.jf-case-top{background:linear-gradient(135deg,#0f2b46,#1a4971);color:#fff;padding:22px 24px}
.jf-case-top h4{font-size:17px;margin:0 0 6px;font-weight:700}
.jf-case-top .jf-case-sub{font-size:12px;opacity:.75}
.jf-case-body{padding:22px 24px}
.jf-case-body h5{font-size:13px;color:#1e6b9e;font-weight:700;margin:0 0 8px}
.jf-case-body p{font-size:13px;color:#5a6b7d;margin:0 0 14px;line-height:1.8}
.jf-case-specs{display:flex;flex-wrap:wrap;gap:8px}
.jf-case-spec{display:inline-block;background:#eef4fa;color:#1a4971;font-size:11px;padding:4px 12px;border-radius:16px;font-weight:600}


.jf-banner{background:linear-gradient(135deg,#1a4971,#0f2b46);color:#fff;text-align:center;padding:50px 20px;border-radius:14px;margin:50px 0 0}
.jf-banner h3{font-size:clamp(20px,3vw,28px);font-weight:700;margin:0 0 12px}
.jf-banner p{font-size:15px;opacity:.85;max-width:650px;margin:0 auto;line-height:1.8}


.jf-cta{text-align:center;padding:60px 20px;margin:50px 0 40px;background:linear-gradient(135deg,#f7fafc,#e2e8f0);border-radius:16px}
.jf-cta h3{font-size:clamp(22px,3vw,30px);font-weight:700;color:#0f2b46;margin:0 0 10px}
.jf-cta p{font-size:15px;color:#5a6b7d;max-width:600px;margin:0 auto 30px;line-height:1.8}
.jf-cta-btns{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.jf-btn{display:inline-block;padding:13px 36px;border-radius:30px;font-size:15px;font-weight:700;text-decoration:none;transition:all .3s;cursor:pointer;border:none}
.jf-btn-primary{background:linear-gradient(135deg,#1e6b9e,#2889c4);color:#fff;box-shadow:0 4px 15px rgba(30,107,158,.35)}
.jf-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(30,107,158,.45)}
.jf-btn-outline{background:transparent;color:#1e6b9e;border:2px solid #1e6b9e}
.jf-btn-outline:hover{background:#1e6b9e;color:#fff}


.jf-diagram{margin:35px 0;display:flex;
    padding: 0 200px;
    justify-content:center}
.jf-diagram svg{max-width:100%;height:auto}


@media(max-width:768px){
  .jf-hero{padding:50px 20px 40px}
  .jf-hero-stats{gap:28px}
  .jf-flow{flex-direction:column;align-items:center}
  .jf-flow-step{max-width:100%}
  .jf-sys-grid{grid-template-columns:1fr}
  .jf-case-grid{grid-template-columns:1fr}
  .jf-diagram{padding:0 20px}
  .jf-section{padding:0 15px}
  .jf-sec-title{font-size:22px}
  .jf-overview-grid,.jf-pain-grid,.jf-std-grid{grid-template-columns:1fr}
}


#yln-avone{--yl-p:#0A5CFF;--yl-pd:#003FBF;--yl-pl:#E8F0FF;--yl-a:#00D4AA;--yl-ad:#00B894;--yl-dk:#0F172A;--yl-dl:#1E293B;--yl-t:#334155;--yl-tl:#64748B;--yl-w:#FFF;--yl-bg:#F8FAFC;--yl-bd:#E2E8F0;--yl-gh:linear-gradient(135deg,#0A5CFF 0%,#003FBF 40%,#1E1B4B 100%);--yl-ga:linear-gradient(135deg,#00D4AA 0%,#0A5CFF 100%);--yl-rs:8px;--yl-rm:12px;--yl-rl:20px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;color:#334155;line-height:1.7;overflow-x:hidden;box-sizing:border-box}
#yln-avone *,#yln-avone *::before,#yln-avone *::after{box-sizing:border-box;}
#yln-avone a{text-decoration:none;color:inherit}
#yln-avone img{max-width:100%;display:block}


@keyframes yl-fadeIn{from{opacity:0}to{opacity:1}}
@keyframes yl-fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes yl-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes yl-pulse{0%{transform:scale(1);opacity:1}100%{transform:scale(1.5);opacity:0}}


.yl-c{max-width:1200px;margin:0 auto;padding:0 24px}
.yl-label{display:inline-block;font-size:13px;font-weight:600;color:var(--yl-p);background:var(--yl-pl);padding:6px 16px;border-radius:100px;letter-spacing:1px;margin-bottom:16px}
.yl-title{font-size:clamp(26px,4vw,40px);font-weight:700;color:var(--yl-dk);line-height:1.25;margin-bottom:16px}
.yl-desc{font-size:16px;color:var(--yl-tl);max-width:640px;line-height:1.8}
.yl-ani{opacity:0;transform:translateY(30px);transition:all .6s cubic-bezier(.22,1,.36,1)}
.yl-ani.yl-vis{opacity:1;transform:translateY(0)}


#yln-avone .yl-hero{position:relative;padding:100px 0 80px;background:var(--yl-gh);overflow:hidden}
#yln-avone .yl-hero::before{content:'';position:absolute;top:-40%;right:-15%;width:700px;height:700px;background:radial-gradient(circle,rgba(0,212,170,.15) 0%,transparent 60%);border-radius:50%;animation:yl-float 8s ease-in-out infinite}
#yln-avone .yl-hero::after{content:'';position:absolute;bottom:-25%;left:-8%;width:500px;height:500px;background:radial-gradient(circle,rgba(10,92,255,.2) 0%,transparent 60%);border-radius:50%;animation:yl-float 10s ease-in-out infinite reverse}
#yln-avone .yl-hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:60px 60px}
#yln-avone .yl-hero .yl-c{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
#yln-avone .yl-hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:100px;color:rgba(255,255,255,.9);font-size:13px;font-weight:500;margin-bottom:24px;backdrop-filter:blur(10px)}
#yln-avone .yl-hero-dot{width:8px;height:8px;background:var(--yl-a);border-radius:50%;position:relative}
#yln-avone .yl-hero-dot::after{content:'';position:absolute;inset:-3px;border:2px solid var(--yl-a);border-radius:50%;animation:yl-pulse 2s ease-out infinite}
#yln-avone .yl-hero h2{font-size:clamp(32px,4.5vw,50px);font-weight:800;color:#fff;line-height:1.15;margin-bottom:18px}
#yln-avone .yl-hero h2 .yl-ac{color:var(--yl-a)}
#yln-avone .yl-hero-sub{font-size:17px;color:rgba(255,255,255,.75);line-height:1.7;margin-bottom:36px;max-width:500px}
#yln-avone .yl-hero-btns{display:flex;gap:14px;flex-wrap:wrap}
#yln-avone .yl-btn-w{display:inline-flex;align-items:center;gap:8px;padding:13px 30px;background:#fff;color:var(--yl-p);font-weight:600;font-size:15px;border-radius:100px;border:none;cursor:pointer;transition:all .3s}
#yln-avone .yl-btn-w:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(255,255,255,.25)}
#yln-avone .yl-btn-o{display:inline-flex;align-items:center;gap:8px;padding:13px 30px;background:transparent;color:#fff;font-weight:600;font-size:15px;border-radius:100px;border:1.5px solid rgba(255,255,255,.3);cursor:pointer;transition:all .3s}
#yln-avone .yl-btn-o:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6)}
#yln-avone .yl-hero-card{background:rgba(255,255,255,.08);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:var(--yl-rl);padding:36px;position:relative;overflow:hidden}
#yln-avone .yl-hero-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--yl-ga)}
#yln-avone .yl-stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#yln-avone .yl-stat{padding:18px;background:rgba(255,255,255,.05);border-radius:var(--yl-rm);border:1px solid rgba(255,255,255,.08);transition:all .3s}
#yln-avone .yl-stat:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}
#yln-avone .yl-stat-v{font-size:30px;font-weight:800;color:#fff;margin-bottom:3px}
#yln-avone .yl-stat-v .yl-u{font-size:15px;font-weight:500;color:var(--yl-a)}
#yln-avone .yl-stat-l{font-size:13px;color:rgba(255,255,255,.6)}


#yln-avone .yl-sec-vals{padding:80px 0;background:var(--yl-bg)}
#yln-avone .yl-sec-head{text-align:center;margin-bottom:50px}
#yln-avone .yl-sec-head .yl-desc{margin:0 auto}
#yln-avone .yl-vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
#yln-avone .yl-vcard{background:#fff;border-radius:var(--yl-rl);padding:32px 24px;text-align:center;transition:all .4s cubic-bezier(.22,1,.36,1);border:1px solid var(--yl-bd);position:relative;overflow:hidden}
#yln-avone .yl-vcard::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--yl-ga);transform:scaleX(0);transition:transform .4s ease}
#yln-avone .yl-vcard:hover::before{transform:scaleX(1)}
#yln-avone .yl-vcard:hover{transform:translateY(-5px);box-shadow:0 10px 40px rgba(0,0,0,.1)}
#yln-avone .yl-vicon{width:56px;height:56px;margin:0 auto 18px;background:var(--yl-pl);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:26px;transition:all .3s}
#yln-avone .yl-vcard:hover .yl-vicon{background:var(--yl-p);color:#fff}
#yln-avone .yl-vcard h4{font-size:17px;font-weight:700;color:var(--yl-dk);margin-bottom:8px}
#yln-avone .yl-vcard p{font-size:14px;color:var(--yl-tl);line-height:1.7}


#yln-avone .yl-sec-prod{padding:80px 0}
#yln-avone .yl-pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#yln-avone .yl-pcard{background:#fff;border-radius:var(--yl-rl);border:1px solid var(--yl-bd);overflow:hidden;transition:all .4s cubic-bezier(.22,1,.36,1)}
#yln-avone .yl-pcard:hover{transform:translateY(-5px);box-shadow:0 16px 50px rgba(0,0,0,.12)}
#yln-avone .yl-pban{height:160px;display:flex;align-items:center;justify-content:center;font-size:50px}
#yln-avone .yl-pban.yl-bg1{background:linear-gradient(135deg,#0A5CFF,#003FBF)}
#yln-avone .yl-pban.yl-bg2{background:linear-gradient(135deg,#00D4AA,#00B894)}
#yln-avone .yl-pban.yl-bg3{background:linear-gradient(135deg,#6366F1,#4F46E5)}
#yln-avone .yl-pban.yl-bg4{background:linear-gradient(135deg,#F59E0B,#D97706)}
#yln-avone .yl-pban.yl-bg5{background:linear-gradient(135deg,#EF4444,#DC2626)}
#yln-avone .yl-pban.yl-bg6{background:linear-gradient(135deg,#8B5CF6,#7C3AED)}
#yln-avone .yl-pbody{padding:24px}
#yln-avone .yl-psub{font-size:13px;color:var(--yl-p);font-weight:600;margin-bottom:10px}
#yln-avone .yl-pbody h4{font-size:17px;font-weight:700;color:var(--yl-dk);margin-bottom:8px}
#yln-avone .yl-pbody > p{font-size:14px;color:var(--yl-tl);line-height:1.7;margin-bottom:14px}
#yln-avone .yl-tags{display:flex;flex-wrap:wrap;gap:6px}
#yln-avone .yl-tag{padding:4px 11px;background:var(--yl-bg);border-radius:100px;font-size:12px;color:var(--yl-t);font-weight:500}


#yln-avone .yl-sec-scene{padding:80px 0;background:var(--yl-dk);color:#fff}
#yln-avone .yl-sec-scene .yl-label{background:rgba(10,92,255,.2);color:#7CB3FF}
#yln-avone .yl-sec-scene .yl-title{color:#fff}
#yln-avone .yl-sec-scene .yl-desc{color:rgba(255,255,255,.6)}
#yln-avone .yl-tabs{display:flex;justify-content:center;gap:8px;margin-bottom:40px;flex-wrap:wrap}
#yln-avone .yl-tab{padding:10px 20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:100px;color:rgba(255,255,255,.6);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s;font-family:inherit}
#yln-avone .yl-tab:hover,#yln-avone .yl-tab.yl-on{background:var(--yl-p);border-color:var(--yl-p);color:#fff}
#yln-avone .yl-panel{display:none}
#yln-avone .yl-panel.yl-on{display:block;animation:yl-fadeIn .4s ease}
#yln-avone .yl-scontent{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
#yln-avone .yl-sinfo h3{font-size:26px;font-weight:700;margin-bottom:18px;color:#fff}
#yln-avone .yl-sinfo > p{font-size:15px;color:rgba(255,255,255,.65);line-height:1.8;margin-bottom:24px}
#yln-avone .yl-sfl{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:28px}
#yln-avone .yl-sfl li{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:rgba(255,255,255,.8)}
#yln-avone .yl-sfl li .yl-chk{flex-shrink:0;width:20px;height:20px;background:rgba(0,212,170,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--yl-a);font-size:11px;margin-top:2px}
#yln-avone .yl-scard{background:rgba(255,255,255,.04);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);border-radius:var(--yl-rl);padding:32px}
#yln-avone .yl-scard-t{font-size:13px;font-weight:600;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:1px;margin-bottom:18px}
#yln-avone .yl-elist{list-style:none;display:flex;flex-direction:column;gap:10px}
#yln-avone .yl-elist li{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;background:rgba(255,255,255,.04);border-radius:var(--yl-rs);font-size:14px}
#yln-avone .yl-elist li .yl-en{color:rgba(255,255,255,.9);font-weight:500}
#yln-avone .yl-elist li .yl-em{color:var(--yl-a);font-weight:600;font-size:13px}


#yln-avone .yl-sec-ai{padding:80px 0;background:var(--yl-bg)}
#yln-avone .yl-aigrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#yln-avone .yl-aicard{background:#fff;border-radius:var(--yl-rl);padding:32px 24px;border:1px solid var(--yl-bd);transition:all .4s;position:relative;overflow:hidden}
#yln-avone .yl-aicard:hover{transform:translateY(-4px);box-shadow:0 10px 40px rgba(0,0,0,.1)}
#yln-avone .yl-ainum{font-size:64px;font-weight:900;color:var(--yl-pl);position:absolute;top:-6px;right:14px;line-height:1}
#yln-avone .yl-aiicon{width:44px;height:44px;background:linear-gradient(135deg,var(--yl-p),var(--yl-pd));border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:18px}
#yln-avone .yl-aicard h4{font-size:17px;font-weight:700;color:var(--yl-dk);margin-bottom:10px}
#yln-avone .yl-aicard > p{font-size:14px;color:var(--yl-tl);line-height:1.7;margin-bottom:14px}
#yln-avone .yl-ailist{list-style:none}
#yln-avone .yl-ailist li{font-size:13px;color:var(--yl-t);padding:5px 0;display:flex;align-items:center;gap:8px}
#yln-avone .yl-ailist li::before{content:'';width:5px;height:5px;background:var(--yl-a);border-radius:50%;flex-shrink:0}


#yln-avone .yl-sec-des{padding:80px 0;overflow:hidden}
#yln-avone .yl-des-inner{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
#yln-avone .yl-des-vis{position:relative;background:var(--yl-gh);border-radius:var(--yl-rl);padding:40px;color:#fff;min-height:380px;display:flex;flex-direction:column;justify-content:center}
#yln-avone .yl-des-vis::before{content:'';position:absolute;top:-80px;right:-80px;width:250px;height:250px;background:radial-gradient(circle,rgba(0,212,170,.2) 0%,transparent 70%);border-radius:50%}
#yln-avone .yl-dsteps{display:flex;flex-direction:column;gap:16px;position:relative;z-index:2}
#yln-avone .yl-dstep{display:flex;align-items:center;gap:14px;padding:14px 18px;background:rgba(255,255,255,.08);border-radius:var(--yl-rm);border:1px solid rgba(255,255,255,.1);transition:all .3s}
#yln-avone .yl-dstep:hover{background:rgba(255,255,255,.14);transform:translateX(4px)}
#yln-avone .yl-dsn{width:32px;height:32px;background:var(--yl-a);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;color:var(--yl-dk);flex-shrink:0}
#yln-avone .yl-dst{font-size:14px;font-weight:500}
#yln-avone .yl-des-info h3{font-size:26px;font-weight:700;color:var(--yl-dk);margin-bottom:14px;line-height:1.3}
#yln-avone .yl-des-info > p{font-size:15px;color:var(--yl-tl);line-height:1.8;margin-bottom:28px}
#yln-avone .yl-pains{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
#yln-avone .yl-pain{display:flex;gap:10px;padding:14px;background:#FEF2F2;border-radius:var(--yl-rs);border-left:3px solid #EF4444}
#yln-avone .yl-pain-icon{font-size:18px;flex-shrink:0}
#yln-avone .yl-pain p{font-size:13px;color:#991B1B}
#yln-avone .yl-sols{display:flex;flex-direction:column;gap:12px}
#yln-avone .yl-sol{display:flex;gap:10px;padding:14px;background:#ECFDF5;border-radius:var(--yl-rs);border-left:3px solid var(--yl-a)}
#yln-avone .yl-sol-icon{font-size:18px;flex-shrink:0}
#yln-avone .yl-sol p{font-size:13px;color:#065F46}


#yln-avone .yl-sec-cases{padding:80px 0;background:var(--yl-bg)}
#yln-avone .yl-cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#yln-avone .yl-ccard{background:#fff;border-radius:var(--yl-rl);overflow:hidden;border:1px solid var(--yl-bd);transition:all .4s}
#yln-avone .yl-ccard:hover{transform:translateY(-5px);box-shadow:0 16px 50px rgba(0,0,0,.12)}
#yln-avone .yl-ch{padding:28px 24px 16px}
#yln-avone .yl-cind{display:inline-block;padding:4px 11px;background:var(--yl-pl);color:var(--yl-p);font-size:12px;font-weight:600;border-radius:100px;margin-bottom:12px}
#yln-avone .yl-ch h4{font-size:20px;font-weight:700;color:var(--yl-dk);margin-bottom:5px}
#yln-avone .yl-ch > p{font-size:13px;color:var(--yl-tl);line-height:1.7}
#yln-avone .yl-cbody{padding:0 24px 24px}
#yln-avone .yl-cstats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
#yln-avone .yl-cst{padding:12px;background:var(--yl-bg);border-radius:var(--yl-rs);text-align:center}
#yln-avone .yl-csv{font-size:19px;font-weight:800;color:var(--yl-p)}
#yln-avone .yl-csl{font-size:11px;color:var(--yl-tl);margin-top:2px}
#yln-avone .yl-cblock{margin-top:14px;padding:14px;border-radius:var(--yl-rs)}
#yln-avone .yl-cblk-y{background:#FFFBEB;border-left:3px solid #F59E0B}
#yln-avone .yl-cblk-y h5{font-size:13px;font-weight:700;color:#92400E;margin-bottom:4px}
#yln-avone .yl-cblk-y p{font-size:13px;color:#92400E;line-height:1.6}
#yln-avone .yl-cblk-g{background:#ECFDF5;border-left:3px solid var(--yl-a)}
#yln-avone .yl-cblk-g h5{font-size:13px;font-weight:700;color:#065F46;margin-bottom:4px}
#yln-avone .yl-cblk-g p{font-size:13px;color:#065F46;line-height:1.6}
#yln-avone .yl-ctags{display:flex;flex-wrap:wrap;gap:5px;margin-top:14px}
#yln-avone .yl-ctag{padding:3px 9px;background:var(--yl-bg);border:1px solid var(--yl-bd);border-radius:100px;font-size:11px;color:var(--yl-t)}


#yln-avone .yl-sec-cta{padding:80px 0;background:var(--yl-gh);text-align:center;position:relative;overflow:hidden}
#yln-avone .yl-sec-cta::before{content:'';position:absolute;top:-40%;left:50%;transform:translateX(-50%);width:800px;height:800px;background:radial-gradient(circle,rgba(0,212,170,.1) 0%,transparent 60%);border-radius:50%}
#yln-avone .yl-sec-cta .yl-c{position:relative;z-index:2}
#yln-avone .yl-sec-cta h2{font-size:clamp(28px,4vw,40px);font-weight:800;color:#fff;margin-bottom:14px}
#yln-avone .yl-sec-cta > div > p{font-size:17px;color:rgba(255,255,255,.7);margin-bottom:36px;max-width:560px;margin-left:auto;margin-right:auto}
#yln-avone .yl-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
#yln-avone .yl-cta-w{padding:15px 36px;background:#fff;color:var(--yl-p);font-weight:700;font-size:15px;border-radius:100px;border:none;cursor:pointer;transition:all .3s;display:inline-flex;align-items:center;gap:8px;font-family:inherit}
#yln-avone .yl-cta-w:hover{transform:translateY(-2px);box-shadow:0 10px 36px rgba(255,255,255,.2)}
#yln-avone .yl-cta-o{padding:15px 36px;background:transparent;color:#fff;font-weight:600;font-size:15px;border-radius:100px;border:1.5px solid rgba(255,255,255,.3);cursor:pointer;transition:all .3s;font-family:inherit}
#yln-avone .yl-cta-o:hover{background:rgba(255,255,255,.1)}
@media(max-width:576px){
#yln-avone .yl-vgrid,#yln-avone .yl-pgrid,#yln-avone .yl-aigrid{grid-template-columns:1fr}
#yln-avone .yl-finner{grid-template-columns:1fr}
}

#kc-kes{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;color:#334155;line-height:1.7;box-sizing:border-box}
#kc-kes *,#kc-kes *::before,#kc-kes *::after{box-sizing:border-box;margin:0;padding:0}
#kc-kes a{text-decoration:none;color:inherit}
#kc-kes img{max-width:100%;display:block}
@keyframes kc-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
#kc-kes .kc-c{max-width:1160px;margin:0 auto;padding:0 24px}
#kc-kes .kc-label{display:inline-block;font-size:12px;font-weight:600;color:#1A56DB;background:#EBF0FF;padding:5px 14px;border-radius:100px;letter-spacing:.5px;margin-bottom:14px}
#kc-kes .kc-title{font-size:clamp(22px,3vw,34px);font-weight:700;color:#0F172A;line-height:1.3;margin-bottom:12px}
#kc-kes .kc-desc{font-size:15px;color:#64748B;max-width:640px;line-height:1.7}
#kc-kes .kc-sec-head{text-align:center;margin-bottom:40px}
#kc-kes .kc-sec-head .kc-desc{margin:0 auto}
#kc-kes .kc-ani{opacity:0;transform:translateY(24px);transition:all .5s ease}
#kc-kes .kc-ani.kc-vis{opacity:1;transform:translateY(0)}


#kc-kes .kc-hero{padding:100px 0 60px;background:linear-gradient(135deg,#0F172A 0%,#1E3A5F 50%,#1A56DB 100%);overflow:hidden}
#kc-kes .kc-hero .kc-c{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
#kc-kes .kc-hero h2{font-size:clamp(26px,3.5vw,42px);font-weight:800;color:#fff;line-height:1.15;margin-bottom:14px}
#kc-kes .kc-hero h2 em{font-style:normal;color:#34D399}
#kc-kes .kc-hero-sub{font-size:15px;color:rgba(255,255,255,.65);line-height:1.7;margin-bottom:28px}
#kc-kes .kc-hero-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:28px;backdrop-filter:blur(12px)}
#kc-kes .kc-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#kc-kes .kc-stat{padding:14px;background:rgba(255,255,255,.04);border-radius:10px;text-align:center}
#kc-kes .kc-stat-v{font-size:26px;font-weight:800;color:#fff}
#kc-kes .kc-stat-v small{font-size:12px;font-weight:500;color:#34D399}
#kc-kes .kc-stat-l{font-size:11px;color:rgba(255,255,255,.5);margin-top:2px}


#kc-kes .kc-sec-w{padding:60px 0;background:#F8FAFC}
#kc-kes .kc-sec{padding:60px 0}


#kc-kes .kc-mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
#kc-kes .kc-mcard{background:#fff;border-radius:14px;padding:24px 16px;text-align:center;border:1px solid #E2E8F0;transition:all .3s}
#kc-kes .kc-mcard:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(0,0,0,.07)}
#kc-kes .kc-mnum{font-size:30px;font-weight:800;color:#1A56DB;margin-bottom:2px}
#kc-kes .kc-mcard h4{font-size:14px;font-weight:700;color:#0F172A;margin-bottom:4px}
#kc-kes .kc-mcard p{font-size:12px;color:#64748B}


#kc-kes .kc-pgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
#kc-kes .kc-pcard{background:#fff;border-radius:14px;padding:24px;border:1px solid #E2E8F0;transition:all .3s;display:flex;gap:20px;align-items:flex-start}
#kc-kes .kc-pcard:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(0,0,0,.07)}
#kc-kes .kc-picon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;flex-shrink:0}
#kc-kes .kc-picon.c1{background:linear-gradient(135deg,#1A56DB,#1545B0)}
#kc-kes .kc-picon.c2{background:linear-gradient(135deg,#059669,#047857)}
#kc-kes .kc-picon.c3{background:linear-gradient(135deg,#D97706,#B45309)}
#kc-kes .kc-picon.c4{background:linear-gradient(135deg,#7C3AED,#6D28D9)}
#kc-kes .kc-pcard h4{font-size:15px;font-weight:700;color:#0F172A;margin-bottom:4px}
#kc-kes .kc-psub{font-size:11px;color:#1A56DB;font-weight:600;margin-bottom:2px}
#kc-kes .kc-pcard>p{font-size:13px;color:#64748B;line-height:1.6}
#kc-kes .kc-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
#kc-kes .kc-tag{padding:2px 8px;background:#F1F5F9;border-radius:100px;font-size:11px;color:#334155}


#kc-kes .kc-sec-integ{padding:60px 0;background:#0F172A;color:#fff}
#kc-kes .kc-sec-integ .kc-title{color:#fff}
#kc-kes .kc-sec-integ .kc-desc{color:rgba(255,255,255,.55)}
#kc-kes .kc-igrid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
#kc-kes .kc-icard{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:24px 14px;text-align:center;transition:all .3s}
#kc-kes .kc-icard:hover{background:rgba(255,255,255,.08);transform:translateY(-3px)}
#kc-kes .kc-icard-icon{width:44px;height:44px;margin:0 auto 10px;background:linear-gradient(135deg,#059669,#047857);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px}
#kc-kes .kc-icard h4{font-size:13px;font-weight:700;color:#fff;margin-bottom:4px}
#kc-kes .kc-icard p{font-size:11px;color:rgba(255,255,255,.5);line-height:1.5}


#kc-kes .kc-tabs{display:flex;justify-content:center;gap:6px;margin-bottom:30px;flex-wrap:wrap}
#kc-kes .kc-tab{padding:8px 20px;background:#fff;border:1px solid #E2E8F0;border-radius:100px;color:#334155;font-size:13px;font-weight:500;cursor:pointer;transition:all .25s;font-family:inherit}
#kc-kes .kc-tab:hover,#kc-kes .kc-tab.kc-on{background:#1A56DB;border-color:#1A56DB;color:#fff}
#kc-kes .kc-panel{display:none}
#kc-kes .kc-panel.kc-on{display:block;animation:kc-up .35s ease}
#kc-kes .kc-cbar{margin-bottom:16px}
#kc-kes .kc-cbar-label{display:flex;justify-content:space-between;font-size:12px;font-weight:600;margin-bottom:5px}
#kc-kes .kc-cbar-label span:last-child{color:#1A56DB}
#kc-kes .kc-cbar-track{height:7px;background:#E2E8F0;border-radius:100px;overflow:hidden}
#kc-kes .kc-cbar-fill{height:100%;border-radius:100px;background:linear-gradient(90deg,#059669,#1A56DB);transition:width .8s ease}
#kc-kes .kc-clist{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px}
#kc-kes .kc-clist li{display:flex;align-items:center;gap:6px;font-size:12px;color:#334155}
#kc-kes .kc-clist li::before{content:'';width:4px;height:4px;background:#059669;border-radius:50%;flex-shrink:0}


#kc-kes .kc-mig{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
#kc-kes .kc-steps{display:flex;flex-direction:column;gap:10px}
#kc-kes .kc-ms{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#EBF0FF;border-radius:10px;font-size:13px;font-weight:500;color:#0F172A}
#kc-kes .kc-ms-n{width:28px;height:28px;background:#1A56DB;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:#fff;flex-shrink:0}
#kc-kes .kc-mfgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
#kc-kes .kc-mf{padding:12px;background:#ECFDF5;border-radius:8px;border-left:3px solid #059669}
#kc-kes .kc-mf h5{font-size:12px;font-weight:700;color:#065F46;margin-bottom:2px}
#kc-kes .kc-mf p{font-size:11px;color:#065F46}


#kc-kes .kc-sec-cases{padding:60px 0;background:#0F172A;color:#fff}
#kc-kes .kc-sec-cases .kc-title{color:#fff}
#kc-kes .kc-sec-cases .kc-desc{color:rgba(255,255,255,.55)}
#kc-kes .kc-cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
#kc-kes .kc-ccard{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:20px;transition:all .3s}
#kc-kes .kc-ccard:hover{background:rgba(255,255,255,.06);transform:translateY(-3px)}
#kc-kes .kc-ccard-ind{display:inline-block;padding:3px 8px;background:rgba(5,150,105,.15);color:#34D399;font-size:10px;font-weight:600;border-radius:100px;margin-bottom:8px}
#kc-kes .kc-ccard h4{font-size:16px;font-weight:700;color:#fff;margin-bottom:4px}
#kc-kes .kc-ccard>p{font-size:12px;color:rgba(255,255,255,.5);margin-bottom:12px}
#kc-kes .kc-cstats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#kc-kes .kc-cst{padding:8px;background:rgba(255,255,255,.04);border-radius:6px;text-align:center}
#kc-kes .kc-csv{font-size:16px;font-weight:800;color:#34D399}
#kc-kes .kc-csv small{font-size:10px;font-weight:500}
#kc-kes .kc-csl{font-size:10px;color:rgba(255,255,255,.4);margin-top:1px}


#kc-kes .kc-cta{padding:60px 0;background:linear-gradient(135deg,#0F172A 0%,#1E3A5F 50%,#1A56DB 100%);text-align:center}
#kc-kes .kc-cta h2{font-size:clamp(22px,3vw,36px);font-weight:800;color:#fff;margin-bottom:12px}
#kc-kes .kc-cta>p{font-size:15px;color:rgba(255,255,255,.6);margin-bottom:28px;max-width:560px;margin-left:auto;margin-right:auto}
#kc-kes .kc-cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
#kc-kes .kc-btn-w{padding:12px 32px;background:#fff;color:#1A56DB;font-weight:700;font-size:14px;border-radius:100px;border:none;cursor:pointer;transition:all .3s;font-family:inherit}
#kc-kes .kc-btn-w:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(255,255,255,.15)}
#kc-kes .kc-btn-o{padding:12px 32px;background:transparent;color:#fff;font-weight:600;font-size:14px;border-radius:100px;border:1.5px solid rgba(255,255,255,.25);cursor:pointer;transition:all .3s;font-family:inherit}
#kc-kes .kc-btn-o:hover{background:rgba(255,255,255,.1)}


#kc-kes .kc-footer{padding:30px 0 16px;background:#0F172A;color:rgba(255,255,255,.4);text-align:center;font-size:12px}


@media(max-width:1024px){
#kc-kes .kc-hero .kc-c{grid-template-columns:1fr}
#kc-kes .kc-hero{text-align:center}
#kc-kes .kc-hero-sub{margin:0 auto 28px}
#kc-kes .kc-mgrid{grid-template-columns:repeat(2,1fr)}
#kc-kes .kc-pgrid{grid-template-columns:1fr}
#kc-kes .kc-igrid{grid-template-columns:repeat(3,1fr)}
#kc-kes .kc-mig{grid-template-columns:1fr}
#kc-kes .kc-cgrid{grid-template-columns:1fr;max-width:500px;margin:0 auto}
}
@media(max-width:576px){
#kc-kes .kc-mgrid,#kc-kes .kc-igrid{grid-template-columns:1fr}
#kc-kes .kc-clist{grid-template-columns:1fr}
#kc-kes .kc-mfgrid{grid-template-columns:1fr}
}

#sf-mss{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;color:#334155;line-height:1.7;box-sizing:border-box}
#sf-mss *,#sf-mss *::before,#sf-mss *::after{box-sizing:border-box;margin:0;padding:0}
#sf-mss a{text-decoration:none;color:inherit}
#sf-mss img{max-width:100%;display:block}
@keyframes sf-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
#sf-mss .sc{max-width:1160px;margin:0 auto;padding:0 24px}
#sf-mss .sl{display:inline-block;font-size:12px;font-weight:600;color:#E53E3E;background:#FFF5F5;padding:5px 14px;border-radius:100px;letter-spacing:.5px;margin-bottom:14px}
#sf-mss .st{font-size:clamp(22px,3vw,34px);font-weight:700;color:#1A202C;line-height:1.3;margin-bottom:12px}
#sf-mss .sd{font-size:15px;color:#718096;max-width:640px;line-height:1.7}
#sf-mss .sh{text-align:center;margin-bottom:40px}
#sf-mss .sh .sd{margin:0 auto}
#sf-mss .sa{opacity:0;transform:translateY(24px);transition:all .5s ease}
#sf-mss .sa.sv{opacity:1;transform:translateY(0)}


#sf-mss .hero{padding:70px 0 60px;background:linear-gradient(135deg,#1A202C 0%,#2D3748 50%,#C53030 100%);overflow:hidden}
#sf-mss .hero .sc{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
#sf-mss .hero h2{font-size:clamp(26px,3.5vw,42px);font-weight:800;color:#fff;line-height:1.15;margin-bottom:14px}
#sf-mss .hero h2 em{font-style:normal;color:#FC8181}
#sf-mss .hero-sub{font-size:15px;color:rgba(255,255,255,.6);line-height:1.7;margin-bottom:28px}
#sf-mss .hero-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:28px;backdrop-filter:blur(12px)}
#sf-mss .hstats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#sf-mss .hst{padding:14px;background:rgba(255,255,255,.04);border-radius:10px;text-align:center}
#sf-mss .hsv{font-size:26px;font-weight:800;color:#fff}
#sf-mss .hsv small{font-size:12px;font-weight:500;color:#FC8181}
#sf-mss .hsl{font-size:11px;color:rgba(255,255,255,.45);margin-top:2px}


#sf-mss .sw{padding:60px 0;background:#F7FAFC}
#sf-mss .sbg{padding:60px 0;background:#1A202C;color:#fff}
#sf-mss .sbg .st{color:#fff}
#sf-mss .sbg .sd{color:rgba(255,255,255,.5)}
#sf-mss .bn{padding:10px 28px;background:#E53E3E;color:#fff;font-weight:700;font-size:14px;border-radius:100px;border:none;cursor:pointer;transition:all .3s;font-family:inherit}
#sf-mss .bn:hover{background:#C53030;transform:translateY(-2px);box-shadow:0 8px 24px rgba(229,62,62,.2)}
#sf-mss .bo{padding:10px 28px;background:transparent;color:#fff;font-weight:600;font-size:14px;border-radius:100px;border:1.5px solid rgba(255,255,255,.2);cursor:pointer;transition:all .3s;font-family:inherit}
#sf-mss .bo:hover{background:rgba(255,255,255,.08)}
#sf-mss .btns{display:flex;gap:12px;flex-wrap:wrap}


#sf-mss .mech{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
#sf-mss .mcard{background:#fff;border-radius:14px;padding:24px;border:1px solid #E2E8F0;text-align:center;transition:all .3s}
#sf-mss .mcard:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(0,0,0,.06)}
#sf-mss .mcard-icon{width:48px;height:48px;margin:0 auto 10px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff}
#sf-mss .mcard-icon.c1{background:linear-gradient(135deg,#E53E3E,#C53030)}
#sf-mss .mcard-icon.c2{background:linear-gradient(135deg,#3182CE,#2B6CB0)}
#sf-mss .mcard-icon.c3{background:linear-gradient(135deg,#38A169,#2F855A)}
#sf-mss .mcard h4{font-size:15px;font-weight:700;color:#1A202C;margin-bottom:4px}
#sf-mss .mcard p{font-size:12px;color:#718096;line-height:1.5}


#sf-mss .sla-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#sf-mss .sla-card{background:#fff;border-radius:14px;padding:24px;border:1px solid #E2E8F0;transition:all .3s}
#sf-mss .sla-card:hover{box-shadow:0 8px 30px rgba(0,0,0,.06)}
#sf-mss .sla-card h4{font-size:16px;font-weight:700;color:#1A202C;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid #E53E3E}
#sf-mss .sla-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #F7FAFC;font-size:13px}
#sf-mss .sla-row:last-child{border-bottom:none}
#sf-mss .sla-row .val{color:#E53E3E;font-weight:700;font-size:14px}


#sf-mss .scn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#sf-mss .scn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:24px;transition:all .3s}
#sf-mss .scn:hover{background:rgba(255,255,255,.06);transform:translateY(-3px)}
#sf-mss .scn-n{display:inline-block;width:32px;height:32px;background:linear-gradient(135deg,#E53E3E,#C53030);border-radius:8px;text-align:center;line-height:32px;color:#fff;font-weight:800;font-size:14px;margin-bottom:12px}
#sf-mss .scn h4{font-size:15px;font-weight:700;color:#fff;margin-bottom:6px}
#sf-mss .scn p{font-size:12px;color:rgba(255,255,255,.5);line-height:1.6}


#sf-mss .cmp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#sf-mss .cmp{background:#fff;border-radius:14px;padding:24px;border:1px solid #E2E8F0;transition:all .3s}
#sf-mss .cmp:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(0,0,0,.06)}
#sf-mss .cmp-n{font-size:16px;font-weight:800;color:#E53E3E;margin-bottom:2px}
#sf-mss .cmp-h{font-size:13px;font-weight:600;color:#3182CE;margin-bottom:6px}
#sf-mss .cmp p{font-size:12px;color:#718096;line-height:1.6}


#sf-mss .cmp-tbl{width:100%;border-collapse:collapse;font-size:13px}
#sf-mss .cmp-tbl th{padding:12px 16px;text-align:left;font-weight:700;font-size:12px;color:#fff;background:#2D3748}
#sf-mss .cmp-tbl th:nth-child(3){background:#E53E3E}
#sf-mss .cmp-tbl td{padding:10px 16px;border-bottom:1px solid #E2E8F0}
#sf-mss .cmp-tbl tr:hover td{background:#FFF5F5}
#sf-mss .cmp-tbl td:nth-child(3){font-weight:600;color:#E53E3E;background:#FFF5F5}


#sf-mss .cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#sf-mss .cs{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:24px;transition:all .3s}
#sf-mss .cs:hover{background:rgba(255,255,255,.06);transform:translateY(-3px)}
#sf-mss .cs-tag{display:inline-block;padding:3px 8px;background:rgba(229,62,62,.15);color:#FC8181;font-size:10px;font-weight:600;border-radius:100px;margin-bottom:8px}
#sf-mss .cs h4{font-size:16px;font-weight:700;color:#fff;margin-bottom:6px}
#sf-mss .cs>p{font-size:12px;color:rgba(255,255,255,.5);margin-bottom:12px;line-height:1.6}
#sf-mss .cs-data{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#sf-mss .cs-d{padding:8px;background:rgba(255,255,255,.04);border-radius:6px;text-align:center}
#sf-mss .cs-dv{font-size:18px;font-weight:800;color:#FC8181}
#sf-mss .cs-dv small{font-size:10px;font-weight:500}
#sf-mss .cs-dl{font-size:10px;color:rgba(255,255,255,.4);margin-top:1px}


#sf-mss .cta{padding:60px 0;background:linear-gradient(135deg,#1A202C 0%,#a9bddf 50%,#C53030 100%);text-align:center}
#sf-mss .cta h2{font-size:clamp(22px,3vw,36px);font-weight:800;color:#fff;margin-bottom:12px}
#sf-mss .cta>p{font-size:15px;color:rgba(255,255,255,.6);margin-bottom:28px;max-width:560px;margin-left:auto;margin-right:auto}
#sf-mss .cta .btns{justify-content:center}




@media(max-width:1024px){
#sf-mss .hero .sc{grid-template-columns:1fr}
#sf-mss .hero{text-align:center}
#sf-mss .hero-sub{margin:0 auto 28px}
#sf-mss .mech,#sf-mss .scn-grid,#sf-mss .cmp-grid,#sf-mss .cs-grid{grid-template-columns:1fr 1fr}
#sf-mss .sla-grid{grid-template-columns:1fr}
}
@media(max-width:576px){
#sf-mss .mech,#sf-mss .scn-grid,#sf-mss .cmp-grid,#sf-mss .cs-grid,#sf-mss .sla-grid{grid-template-columns:1fr}
#sf-mss .hstats{grid-template-columns:1fr}
}





#qw-micro {
  --qw-p: #1A56DB;
  --qw-pd: #1E3A8A;
  --qw-pg: #EFF6FF;
  --qw-a: #059669;
  --qw-d: #DC2626;
  --qw-t: #1E293B;
  --qw-s: #64748B;
  --qw-bg: #FFFFFF;
  --qw-bg2: #F8FAFC;
  --qw-bg3: #0F172A;
  --qw-r: 12px;
  --qw-sh: 0 4px 24px rgba(0,0,0,0.08);
  font-family: -apple-system, "Microsoft YaHei", sans-serif;
  color: var(--qw-t);
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}


.qw-hero {
  background: linear-gradient(135deg, var(--qw-pd) 0%, var(--qw-p) 50%, #2563EB 100%);
  padding: 150px 0px 60px;
  text-align: center;
  color: #fff;
  position: relative;
}
.qw-hero::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at 30% 50%, rgba(255,255,255,0.05) 0%, transparent 50%);
  pointer-events: none;
}
.qw-hero h1 { font-size: 36px; font-weight: 700; margin: 0 0 12px; letter-spacing: 1px; }
.qw-hero .qw-sub { font-size: 18px; opacity: 0.9; margin: 0 0 40px; }
.qw-hero .qw-tag {
  display: inline-block;
  background: rgba(255,255,255,0.15);
  border: 1px solid rgba(255,255,255,0.3);
  padding: 6px 20px;
  border-radius: 20px;
  font-size: 14px;
  margin-bottom: 40px;
}
.qw-stats {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}
.qw-stats .qw-stat { text-align: center; min-width: 120px; }
.qw-stats .qw-num { font-size: 40px; font-weight: 700; display: block; line-height: 1.2; }
.qw-stats .qw-label { font-size: 13px; opacity: 0.85; margin-top: 4px; display: block; }


.qw-sec { padding: 60px 40px; }
.qw-sec-title { font-size: 28px; font-weight: 700; text-align: center; margin: 0 0 12px; color: var(--qw-t); }
.qw-sec-desc { font-size: 15px; color: var(--qw-s); text-align: center; margin: 0 0 40px; max-width: 700px; margin-left: auto; margin-right: auto; }


.qw-threat { background: var(--qw-bg2); }
.qw-threat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.qw-threat-card {
  background: #fff; border-radius: var(--qw-r); padding: 28px 20px;
  text-align: center; box-shadow: var(--qw-sh); border-left: 4px solid var(--qw-d); transition: transform 0.2s;
}
.qw-threat-card:hover { transform: translateY(-4px); }
.qw-threat-card .qw-big { font-size: 36px; font-weight: 700; color: var(--qw-d); display: block; }
.qw-threat-card .qw-txt { font-size: 13px; color: var(--qw-s); margin-top: 6px; display: block; }


.qw-tri { background: #fff; }
.qw-tri-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; position: relative; }
.qw-tri-grid::before {
  content: '>'; position: absolute; top: 50%; left: 33%;
  transform: translate(-50%, -50%); font-size: 24px; color: var(--qw-p); font-weight: 700;
}
.qw-tri-grid::after {
  content: '>'; position: absolute; top: 50%; left: 66%;
  transform: translate(-50%, -50%); font-size: 24px; color: var(--qw-p); font-weight: 700;
}
.qw-tri-card {
  background: var(--qw-pg); border-radius: var(--qw-r); padding: 32px 24px;
  text-align: center; border: 2px solid #DBEAFE; transition: border-color 0.2s;
}
.qw-tri-card:hover { border-color: var(--qw-p); }
.qw-tri-card .qw-icon {
  width: 56px; height: 56px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; margin: 0 auto 16px;
  font-size: 24px; font-weight: 700; color: #fff;
}
.qw-tri-card:nth-child(1) .qw-icon { background: #3B82F6; }
.qw-tri-card:nth-child(2) .qw-icon { background: var(--qw-a); }
.qw-tri-card:nth-child(3) .qw-icon { background: #F59E0B; }
.qw-tri-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 8px; color: var(--qw-p); }
.qw-tri-card p { font-size: 13px; color: var(--qw-s); margin: 0; }
.qw-tri-note {
  text-align: center; margin-top: 20px; font-size: 14px; color: var(--qw-d);
  font-weight: 600; background: #FEF2F2; padding: 12px 24px; border-radius: 8px;
}


.qw-cap { background: var(--qw-bg2); }
.qw-cap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.qw-cap-card {
  background: #fff; border-radius: var(--qw-r); padding: 28px 24px;
  box-shadow: var(--qw-sh); border-top: 3px solid var(--qw-p); transition: transform 0.2s;
}
.qw-cap-card:hover { transform: translateY(-4px); }
.qw-cap-card h3 { font-size: 16px; font-weight: 700; margin: 0 0 8px; color: var(--qw-p); }
.qw-cap-card .qw-cap-desc { font-size: 13px; color: var(--qw-s); margin: 0; line-height: 1.5; }


.qw-adv { background: var(--qw-bg3); color: #fff; }
.qw-adv .qw-sec-title, .qw-adv .qw-sec-desc { color: #fff; }
.qw-adv .qw-sec-desc { opacity: 0.7; }
.qw-adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.qw-adv-card {
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--qw-r); padding: 28px 20px; text-align: center; transition: background 0.2s;
}
.qw-adv-card:hover { background: rgba(255,255,255,0.12); }
.qw-adv-card h3 { font-size: 16px; font-weight: 700; margin: 0 0 8px; color: #60A5FA; }
.qw-adv-card p { font-size: 13px; opacity: 0.75; margin: 0; }


.qw-case { background: #fff; }
.qw-case-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.qw-case-card {
  background: var(--qw-bg2); border-radius: var(--qw-r); padding: 32px 28px; border-left: 4px solid var(--qw-p);
}
.qw-case-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--qw-p); }
.qw-case-card .qw-case-tag {
  display: inline-block; background: var(--qw-pg); color: var(--qw-p);
  font-size: 12px; padding: 2px 10px; border-radius: 10px; margin-bottom: 12px; font-weight: 600;
}
.qw-case-card p { font-size: 13px; color: var(--qw-s); margin: 0 0 10px; line-height: 1.6; }
.qw-case-card p:last-child { margin-bottom: 0; }
.qw-case-card strong { color: var(--qw-t); }


.qw-cta {
  background: linear-gradient(135deg, var(--qw-pd), var(--qw-p));
  padding: 60px 40px; text-align: center; color: #fff;
}
.qw-cta h2 { font-size: 24px; font-weight: 700; margin: 0 0 16px; }
.qw-cta p { font-size: 15px; opacity: 0.85; margin: 0 0 28px; }
.qw-cta .qw-btn {
  display: inline-block; background: #fff; color: var(--qw-p);
  padding: 12px 36px; border-radius: 8px; font-size: 15px; font-weight: 600;
  text-decoration: none; transition: transform 0.2s, box-shadow 0.2s;
}
.qw-cta .qw-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }








@keyframes qwFadeIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.qw-anim { opacity: 0; }
.qw-anim.qw-show { animation: qwFadeIn 0.5s ease forwards; }


@media (max-width: 900px) {
  .qw-threat-grid, .qw-adv-grid { grid-template-columns: repeat(2, 1fr); }
  .qw-tri-grid { grid-template-columns: 1fr; }
  .qw-tri-grid::before, .qw-tri-grid::after { display: none; }
  .qw-cap-grid { grid-template-columns: repeat(2, 1fr); }
  .qw-case-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .qw-hero { padding: 48px 20px 40px; }
  .qw-hero h1 { font-size: 24px; }
  .qw-stats { gap: 20px; }
  .qw-stats .qw-num { font-size: 28px; }
  .qw-sec { padding: 40px 20px; }
  .qw-sec-title { font-size: 22px; }
  .qw-threat-grid, .qw-cap-grid, .qw-adv-grid { grid-template-columns: 1fr; }
}




#sf-hci {
  --sh-p: #E62222;
  --sh-pd: #B91C1C;
  --sh-b: #1E3A8A;
  --sh-t: #1E293B;
  --sh-s: #64748B;
  --sh-bg: #FFFFFF;
  --sh-bg2: #F8FAFC;
  --sh-bg3: #0F172A;
  --sh-r: 12px;
  --sh-sh: 0 4px 24px rgba(0,0,0,0.08);
  font-family: -apple-system, "Microsoft YaHei", sans-serif;
  color: var(--sh-t);
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}


.sh-hero {
  background: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #1E3A8A 100%);
  padding: 180px 40px 60px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.sh-hero::before {
  content: '';
  position: absolute;
  top: -100px; right: -100px;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(230,34,34,0.15) 0%, transparent 70%);
  pointer-events: none;
}
.sh-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(230,34,34,0.2);
  border: 1px solid rgba(230,34,34,0.4);
  padding: 6px 18px;
  border-radius: 20px;
  font-size: 13px;
  color: #FCA5A5;
  margin-bottom: 24px;
}
.sh-hero h1 { font-size: 38px; font-weight: 700; margin: 0 0 16px; line-height: 1.3; }
.sh-hero h1 span { color: #FCA5A5; }
.sh-hero .sh-sub { font-size: 17px; opacity: 0.8; margin: 0 0 48px; max-width: 700px; margin-left: auto; margin-right: auto; }
.sh-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,0.1);
  border-radius: var(--sh-r);
  overflow: hidden;
  max-width: 800px;
  margin: 0 auto;
}
.sh-stat {
  background: rgba(255,255,255,0.06);
  padding: 24px 16px;
  text-align: center;
}
.sh-stat .sh-num { font-size: 36px; font-weight: 700; color: #FCA5A5; display: block; }
.sh-stat .sh-label { font-size: 12px; opacity: 0.7; margin-top: 4px; display: block; }


.sh-sec { padding: 60px 40px; }
.sh-title { font-size: 28px; font-weight: 700; text-align: center; margin: 0 0 10px; color: var(--sh-t); }
.sh-desc { font-size: 15px; color: var(--sh-s); text-align: center; margin: 0 0 40px; }


.sh-mkt { background: var(--sh-bg2); }
.sh-mkt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sh-mkt-card {
  background: #fff;
  border-radius: var(--sh-r);
  padding: 28px 24px;
  box-shadow: var(--sh-sh);
  border-top: 3px solid var(--sh-p);
  transition: transform 0.2s;
}
.sh-mkt-card:hover { transform: translateY(-4px); }
.sh-mkt-card h3 { font-size: 16px; font-weight: 700; color: var(--sh-p); margin: 0 0 10px; }
.sh-mkt-card p { font-size: 13px; color: var(--sh-s); margin: 0; line-height: 1.6; }
.sh-mkt-card .sh-data {
  font-size: 28px; font-weight: 700; color: var(--sh-p);
  display: block; margin-top: 12px;
}


.sh-plan { background: #fff; }
.sh-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.sh-plan-card {
  border-radius: var(--sh-r);
  padding: 32px 24px;
  border: 2px solid #E2E8F0;
  transition: border-color 0.2s, transform 0.2s;
  position: relative;
}
.sh-plan-card:hover { border-color: var(--sh-p); transform: translateY(-4px); }
.sh-plan-card .sh-plan-num {
  width: 40px; height: 40px;
  background: var(--sh-p);
  color: #fff;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700;
  margin-bottom: 16px;
}
.sh-plan-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--sh-t); }
.sh-plan-card .sh-plan-sub { font-size: 13px; color: var(--sh-p); font-weight: 600; margin-bottom: 12px; }
.sh-plan-card p { font-size: 13px; color: var(--sh-s); margin: 0; line-height: 1.6; }


.sh-cap { background: var(--sh-bg2); }
.sh-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  justify-content: center;
}
.sh-tab {
  padding: 8px 20px;
  border-radius: 6px;
  border: 1px solid #CBD5E1;
  background: #fff;
  color: var(--sh-s);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s;
  font-weight: 500;
}
.sh-tab.sh-active {
  background: var(--sh-p);
  border-color: var(--sh-p);
  color: #fff;
}
.sh-tab-content { display: none; }
.sh-tab-content.sh-show { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sh-cap-card {
  background: #fff;
  border-radius: var(--sh-r);
  padding: 24px;
  box-shadow: var(--sh-sh);
  border-left: 4px solid var(--sh-p);
}
.sh-cap-card h4 { font-size: 15px; font-weight: 700; margin: 0 0 8px; color: var(--sh-t); }
.sh-cap-card p { font-size: 13px; color: var(--sh-s); margin: 0; line-height: 1.5; }


.sh-perf { background: var(--sh-bg3); color: #fff; }
.sh-perf .sh-title, .sh-perf .sh-desc { color: #fff; }
.sh-perf .sh-desc { opacity: 0.7; }
.sh-perf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sh-perf-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--sh-r);
  padding: 28px 20px;
  text-align: center;
  transition: background 0.2s;
}
.sh-perf-card:hover { background: rgba(255,255,255,0.12); }
.sh-perf-card .sh-perf-num { font-size: 36px; font-weight: 700; color: #FCA5A5; display: block; }
.sh-perf-card .sh-perf-label { font-size: 12px; opacity: 0.75; margin-top: 6px; display: block; }
.sh-perf-card .sh-perf-note { font-size: 11px; opacity: 0.5; margin-top: 4px; display: block; }


.sh-compat { background: #fff; }
.sh-compat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sh-compat-card {
  background: var(--sh-bg2);
  border-radius: var(--sh-r);
  padding: 24px 20px;
  text-align: center;
  border: 1px solid #E2E8F0;
}
.sh-compat-card .sh-compat-num { font-size: 32px; font-weight: 700; color: var(--sh-b); display: block; }
.sh-compat-card .sh-compat-txt { font-size: 13px; color: var(--sh-s); margin-top: 6px; display: block; }


.sh-case { background: var(--sh-bg2); }
.sh-case-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.sh-case-card {
  background: #fff;
  border-radius: var(--sh-r);
  padding: 32px 28px;
  box-shadow: var(--sh-sh);
  border-left: 4px solid var(--sh-p);
}
.sh-case-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--sh-t); }
.sh-case-card .sh-case-tag {
  display: inline-block;
  background: #FEF2F2;
  color: var(--sh-p);
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 10px;
  margin-bottom: 12px;
  font-weight: 600;
}
.sh-case-card p { font-size: 13px; color: var(--sh-s); margin: 0 0 10px; line-height: 1.6; }
.sh-case-card p:last-child { margin-bottom: 0; }
.sh-case-card strong { color: var(--sh-t); }


.sh-cta {
  background: linear-gradient(135deg, var(--sh-pd), var(--sh-p));
  padding: 60px 40px;
  text-align: center;
  color: #fff;
}
.sh-cta h2 { font-size: 26px; font-weight: 700; margin: 0 0 16px; }
.sh-cta p { font-size: 15px; opacity: 0.85; margin: 0 0 28px; }
.sh-cta .sh-btn {
  display: inline-block;
  background: #fff;
  color: var(--sh-p);
  padding: 12px 36px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.sh-cta .sh-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }


.sh-footer {
  background: var(--sh-bg3);
  color: rgba(255,255,255,0.5);
  padding: 24px 40px;
  text-align: center;
  font-size: 13px;
}
.sh-footer a { color: rgba(255,255,255,0.7); text-decoration: none; }


@keyframes shFadeIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.sh-anim { opacity: 0; }
.sh-anim.sh-show { animation: shFadeIn 0.5s ease forwards; }


@media (max-width: 900px) {
  .sh-stats { grid-template-columns: repeat(2, 1fr); }
  .sh-mkt-grid, .sh-plan-grid { grid-template-columns: repeat(2, 1fr); }
  .sh-perf-grid, .sh-compat-grid { grid-template-columns: repeat(2, 1fr); }
  .sh-case-grid { grid-template-columns: 1fr; }
  .sh-tab-content.sh-show { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .sh-hero { padding: 48px 20px 40px; }
  .sh-hero h1 { font-size: 24px; }
  .sh-sec { padding: 40px 20px; }
  .sh-title { font-size: 22px; }
  .sh-stats { grid-template-columns: repeat(2, 1fr); }
  .sh-mkt-grid, .sh-plan-grid, .sh-perf-grid, .sh-compat-grid { grid-template-columns: 1fr; }
  .sh-tab-content.sh-show { grid-template-columns: 1fr; }
}




#as-sol {
  --as-p: #0066CC;
  --as-pd: #0052A3;
  --as-t: #1A1A2E;
  --as-s: #6B7280;
  --as-bg: #FFFFFF;
  --as-bg2: #F3F6FB;
  --as-bg3: #0F1729;
  --as-a: #FF6B35;
  --as-r: 12px;
  --as-sh: 0 4px 20px rgba(0,0,0,0.07);
  font-family: -apple-system, "Microsoft YaHei", sans-serif;
  color: var(--as-t);
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}


.as-hero {
  background: linear-gradient(135deg, #0F1729 0%, #1A2744 50%, #003D82 100%);
  padding: 180px 40px 60px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.as-hero::before {
  content: '';
  position: absolute;
  top: -80px; left: -80px;
  width: 350px; height: 350px;
  background: radial-gradient(circle, rgba(255,107,53,0.12) 0%, transparent 70%);
  pointer-events: none;
}
.as-hero::after {
  content: '';
  position: absolute;
  bottom: -80px; right: -80px;
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(0,102,204,0.15) 0%, transparent 70%);
  pointer-events: none;
}
.as-hero-badge {
  display: inline-block;
  background: rgba(255,107,53,0.15);
  border: 1px solid rgba(255,107,53,0.4);
  padding: 6px 18px;
  border-radius: 20px;
  font-size: 13px;
  color: #FFB088;
  margin-bottom: 24px;
}
.as-hero h1 { font-size: 36px; font-weight: 700; margin: 0 0 16px; line-height: 1.3; }
.as-hero h1 span { color: #7CB9F5; }
.as-hero .as-sub { font-size: 16px; opacity: 0.8; margin: 0 0 48px; max-width: 720px; margin-left: auto; margin-right: auto; }
.as-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,0.1);
  border-radius: var(--as-r);
  overflow: hidden;
  max-width: 800px;
  margin: 0 auto;
}
.as-stat {
  background: rgba(255,255,255,0.05);
  padding: 24px 16px;
  text-align: center;
}
.as-stat .as-num { font-size: 34px; font-weight: 700; color: #7CB9F5; display: block; }
.as-stat .as-label { font-size: 12px; opacity: 0.7; margin-top: 4px; display: block; }


.as-sec { padding: 60px 40px; }
.as-title { font-size: 28px; font-weight: 700; text-align: center; margin: 0 0 10px; color: var(--as-t); }
.as-desc { font-size: 15px; color: var(--as-s); text-align: center; margin: 0 0 40px; }


.as-challenge { background: var(--as-bg2); }
.as-challenge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.as-challenge-card {
  background: #fff;
  border-radius: var(--as-r);
  padding: 28px 24px;
  box-shadow: var(--as-sh);
  border-top: 3px solid var(--as-a);
  transition: transform 0.2s;
}
.as-challenge-card:hover { transform: translateY(-4px); }
.as-challenge-card h3 { font-size: 16px; font-weight: 700; color: var(--as-a); margin: 0 0 10px; }
.as-challenge-card p { font-size: 13px; color: var(--as-s); margin: 0; line-height: 1.6; }


.as-arch { background: #fff; }
.as-arch-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.as-arch-card {
  border-radius: var(--as-r);
  padding: 28px 22px;
  border: 2px solid #E2E8F0;
  text-align: center;
  transition: border-color 0.2s, transform 0.2s;
}
.as-arch-card:hover { border-color: var(--as-p); transform: translateY(-4px); }
.as-arch-card .as-arch-icon {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, var(--as-p), var(--as-pd));
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  font-size: 20px; color: #fff;
}
.as-arch-card h3 { font-size: 16px; font-weight: 700; margin: 0 0 8px; color: var(--as-t); }
.as-arch-card p { font-size: 13px; color: var(--as-s); margin: 0; line-height: 1.5; }


.as-cap { background: var(--as-bg2); }
.as-tabs {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 28px; justify-content: center;
}
.as-tab {
  padding: 8px 20px; border-radius: 6px;
  border: 1px solid #CBD5E1; background: #fff;
  color: var(--as-s); font-size: 14px; cursor: pointer;
  transition: all 0.2s; font-weight: 500;
}
.as-tab.as-active { background: var(--as-p); border-color: var(--as-p); color: #fff; }
.as-tab-content { display: none; }
.as-tab-content.as-show { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.as-cap-card {
  background: #fff; border-radius: var(--as-r);
  padding: 24px; box-shadow: var(--as-sh);
  border-left: 4px solid var(--as-p);
}
.as-cap-card h4 { font-size: 15px; font-weight: 700; margin: 0 0 8px; color: var(--as-t); }
.as-cap-card p { font-size: 13px; color: var(--as-s); margin: 0; line-height: 1.5; }


.as-perf { background: var(--as-bg3); color: #fff; }
.as-perf .as-title, .as-perf .as-desc { color: #fff; }
.as-perf .as-desc { opacity: 0.7; }
.as-perf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.as-perf-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--as-r);
  padding: 28px 20px; text-align: center;
  transition: background 0.2s;
}
.as-perf-card:hover { background: rgba(255,255,255,0.12); }
.as-perf-card .as-perf-num { font-size: 34px; font-weight: 700; color: #FF6B35; display: block; }
.as-perf-card .as-perf-label { font-size: 12px; opacity: 0.75; margin-top: 6px; display: block; }
.as-perf-card .as-perf-note { font-size: 11px; opacity: 0.5; margin-top: 4px; display: block; }


.as-mfg { background: #fff; }
.as-mfg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.as-mfg-card {
  background: var(--as-bg2);
  border-radius: var(--as-r);
  padding: 28px 24px;
  border-left: 4px solid var(--as-a);
}
.as-mfg-card h3 { font-size: 16px; font-weight: 700; margin: 0 0 8px; color: var(--as-t); }
.as-mfg-card p { font-size: 13px; color: var(--as-s); margin: 0; line-height: 1.6; }


.as-case { background: var(--as-bg2); }
.as-case-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.as-case-card {
  background: #fff; border-radius: var(--as-r);
  padding: 28px 24px; box-shadow: var(--as-sh);
  border-left: 4px solid var(--as-p);
}
.as-case-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--as-t); }
.as-case-card .as-case-tag {
  display: inline-block;
  background: #EFF6FF; color: var(--as-p);
  font-size: 12px; padding: 2px 10px;
  border-radius: 10px; margin-bottom: 12px; font-weight: 600;
}
.as-case-card p { font-size: 13px; color: var(--as-s); margin: 0 0 10px; line-height: 1.6; }
.as-case-card p:last-child { margin-bottom: 0; }
.as-case-card strong { color: var(--as-t); }


.as-cta {
  background: linear-gradient(135deg, var(--as-pd), var(--as-p));
  padding: 60px 40px; text-align: center; color: #fff;
}
.as-cta h2 { font-size: 26px; font-weight: 700; margin: 0 0 16px; }
.as-cta p { font-size: 15px; opacity: 0.85; margin: 0 0 28px; }
.as-cta .as-btn {
  display: inline-block; background: #fff; color: var(--as-p);
  padding: 12px 36px; border-radius: 8px;
  font-size: 15px; font-weight: 600; text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.as-cta .as-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }


.as-footer {
  background: var(--as-bg3);
  color: rgba(255,255,255,0.5);
  padding: 24px 40px; text-align: center; font-size: 13px;
}
.as-footer a { color: rgba(255,255,255,0.7); text-decoration: none; }


@keyframes asFadeIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.as-anim { opacity: 0; }
.as-anim.as-show { animation: asFadeIn 0.5s ease forwards; }


@media (max-width: 900px) {
  .as-stats { grid-template-columns: repeat(2, 1fr); }
  .as-challenge-grid, .as-arch-grid { grid-template-columns: repeat(2, 1fr); }
  .as-perf-grid { grid-template-columns: repeat(2, 1fr); }
  .as-case-grid, .as-mfg-grid { grid-template-columns: 1fr; }
  .as-tab-content.as-show { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .as-hero { padding: 48px 20px 40px; }
  .as-hero h1 { font-size: 24px; }
  .as-sec { padding: 40px 20px; }
  .as-title { font-size: 22px; }
  .as-stats, .as-challenge-grid, .as-arch-grid, .as-perf-grid { grid-template-columns: 1fr; }
  .as-tab-content.as-show { grid-template-columns: 1fr; }
}




#hk-sol {
  --hk-p: #CF0A2C;
  --hk-pd: #B0081F;
  --hk-r: #E60012;
  --hk-b: #007DFF;
  --hk-t: #191919;
  --hk-s: #666;
  --hk-bg: #FFFFFF;
  --hk-bg2: #F5F6FA;
  --hk-bg3: #0D1117;
  --hk-g: #4CAF50;
  --hk-rd: 12px;
  --hk-sh: 0 4px 20px rgba(0,0,0,0.06);
  font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif;
  color: var(--hk-t);
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}


.hk-hero {
  background: linear-gradient(135deg, #0D1117 0%, #1A1D29 40%, #C41A30 100%);
  padding: 180px 40px 60px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.hk-hero::before {
  content: '';
  position: absolute;
  top: -120px; right: -120px;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(0,125,255,0.12) 0%, transparent 70%);
  pointer-events: none;
}
.hk-hero-badge {
  display: inline-block;
  background: rgba(207,10,44,0.25);
  border: 1px solid rgba(207,10,44,0.5);
  padding: 6px 20px;
  border-radius: 20px;
  font-size: 13px;
  color: #F87171;
  margin-bottom: 24px;
}
.hk-hero h1 { font-size: 36px; font-weight: 700; margin: 0 0 16px; line-height: 1.3; }
.hk-hero h1 span { color: #60A5FA; }
.hk-hero .hk-sub { font-size: 16px; opacity: 0.8; margin: 0 0 48px; max-width: 700px; margin-left: auto; margin-right: auto; }
.hk-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,0.1);
  border-radius: var(--hk-rd);
  overflow: hidden;
  max-width: 800px;
  margin: 0 auto;
}
.hk-stat {
  background: rgba(255,255,255,0.05);
  padding: 24px 16px;
  text-align: center;
}
.hk-stat .hk-num { font-size: 34px; font-weight: 700; color: #60A5FA; display: block; }
.hk-stat .hk-label { font-size: 12px; opacity: 0.7; margin-top: 4px; display: block; }


.hk-sec { padding: 60px 40px; }
.hk-title { font-size: 28px; font-weight: 700; text-align: center; margin: 0 0 10px; color: var(--hk-t); }
.hk-desc { font-size: 15px; color: var(--hk-s); text-align: center; margin: 0 0 40px; }


.hk-arch { background: var(--hk-bg2); }
.hk-arch-row { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; }
.hk-arch-item {
  background: #fff;
  border-radius: var(--hk-rd);
  padding: 20px 28px;
  text-align: center;
  box-shadow: var(--hk-sh);
  min-width: 140px;
  transition: transform 0.2s;
}
.hk-arch-item:hover { transform: translateY(-4px); }
.hk-arch-item .hk-arch-num {
  font-size: 28px; font-weight: 800;
  background: linear-gradient(135deg, var(--hk-p), var(--hk-b));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: block;
}
.hk-arch-item .hk-arch-txt { font-size: 13px; color: var(--hk-s); margin-top: 4px; }
.hk-arch-tag {
  display: inline-block;
  background: rgba(0,125,255,0.08);
  color: var(--hk-b);
  padding: 4px 12px;
  border-radius: 14px;
  font-size: 12px;
  margin: 3px;
}


.hk-net { background: #fff; }
.hk-net-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.hk-net-card {
  border-radius: var(--hk-rd);
  padding: 28px 24px;
  border: 2px solid #E5E7EB;
  transition: border-color 0.2s, transform 0.2s;
}
.hk-net-card:hover { border-color: var(--hk-b); transform: translateY(-4px); }
.hk-net-card h3 { font-size: 17px; font-weight: 700; margin: 0 0 8px; color: var(--hk-b); }
.hk-net-card .hk-net-sub { font-size: 12px; color: var(--hk-p); font-weight: 600; margin-bottom: 12px; }
.hk-net-card p { font-size: 13px; color: var(--hk-s); margin: 0; line-height: 1.6; }
.hk-net-card .hk-data {
  font-size: 26px; font-weight: 700; color: var(--hk-b);
  display: block; margin-top: 12px;
}


.hk-sec-card { background: var(--hk-bg2); }
.hk-sec-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.hk-sec-card-item {
  background: #fff;
  border-radius: var(--hk-rd);
  padding: 28px 24px;
  box-shadow: var(--hk-sh);
  border-top: 3px solid var(--hk-p);
  transition: transform 0.2s;
}
.hk-sec-card-item:hover { transform: translateY(-4px); }
.hk-sec-card-item h3 { font-size: 17px; font-weight: 700; margin: 0 0 10px; color: var(--hk-p); }
.hk-sec-card-item p { font-size: 13px; color: var(--hk-s); margin: 0 0 8px; line-height: 1.6; }
.hk-sec-card-item p:last-child { margin-bottom: 0; }
.hk-sec-card-item .hk-data {
  font-size: 26px; font-weight: 700; color: var(--hk-p);
  display: block; margin-top: 10px;
}
.hk-sec-card-item .hk-sub-data { font-size: 13px; color: var(--hk-s); margin-top: 2px; }


.hk-delivery { background: #fff; }
.hk-delivery-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.hk-delivery-card {
  text-align: center;
  padding: 24px 16px;
  border-radius: var(--hk-rd);
  background: var(--hk-bg2);
  border: 1px solid #E5E7EB;
  transition: transform 0.2s;
}
.hk-delivery-card:hover { transform: translateY(-4px); border-color: var(--hk-b); }
.hk-delivery-card .hk-step {
  width: 36px; height: 36px;
  background: var(--hk-b);
  color: #fff;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700;
  margin: 0 auto 12px;
}
.hk-delivery-card h4 { font-size: 14px; font-weight: 700; margin: 0 0 6px; color: var(--hk-t); }
.hk-delivery-card .hk-time { font-size: 12px; color: var(--hk-g); font-weight: 600; margin-bottom: 6px; display: block; }
.hk-delivery-card p { font-size: 12px; color: var(--hk-s); margin: 0; }


.hk-quality { background: var(--hk-bg3); color: #fff; }
.hk-quality .hk-title, .hk-quality .hk-desc { color: #fff; }
.hk-quality .hk-desc { opacity: 0.7; }
.hk-quality-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.hk-quality-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--hk-rd);
  padding: 28px 20px;
  text-align: center;
  transition: background 0.2s;
}
.hk-quality-card:hover { background: rgba(255,255,255,0.12); }
.hk-quality-card .hk-q-num { font-size: 34px; font-weight: 700; color: #60A5FA; display: block; }
.hk-quality-card .hk-q-label { font-size: 13px; opacity: 0.8; margin-top: 6px; display: block; }
.hk-quality-card .hk-q-note { font-size: 11px; opacity: 0.5; margin-top: 4px; display: block; }


.hk-case { background: var(--hk-bg2); }
.hk-case-card {
  background: #fff;
  border-radius: var(--hk-rd);
  padding: 32px 28px;
  box-shadow: var(--hk-sh);
  border-left: 4px solid var(--hk-p);
}
.hk-case-card h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; color: var(--hk-t); }
.hk-case-card .hk-case-tag {
  display: inline-block;
  background: #FEF2F2;
  color: var(--hk-p);
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 10px;
  margin-bottom: 12px;
  font-weight: 600;
}
.hk-case-card p { font-size: 13px; color: var(--hk-s); margin: 0 0 10px; line-height: 1.6; }
.hk-case-card p:last-child { margin-bottom: 0; }
.hk-case-card strong { color: var(--hk-t); }
.hk-case-products { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.hk-case-products span {
  display: inline-block;
  background: #F0F9FF;
  color: var(--hk-b);
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
}


.hk-cta {
  background: linear-gradient(135deg, var(--hk-pd), var(--hk-p));
  padding: 60px 40px;
  text-align: center;
  color: #fff;
}
.hk-cta h2 { font-size: 26px; font-weight: 700; margin: 0 0 16px; }
.hk-cta p { font-size: 15px; opacity: 0.85; margin: 0 0 28px; }
.hk-cta .hk-btn {
  display: inline-block;
  background: #fff;
  color: var(--hk-p);
  padding: 12px 36px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.hk-cta .hk-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }


.hk-footer {
  background: var(--hk-bg3);
  color: rgba(255,255,255,0.5);
  padding: 24px 40px;
  text-align: center;
  font-size: 13px;
}
.hk-footer a { color: rgba(255,255,255,0.7); text-decoration: none; }


@keyframes hkFadeIn {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}
.hk-anim { opacity: 0; }
.hk-anim.hk-show { animation: hkFadeIn 0.5s ease forwards; }


@media (max-width: 900px) {
  .hk-stats { grid-template-columns: repeat(2, 1fr); }
  .hk-net-grid { grid-template-columns: repeat(2, 1fr); }
  .hk-sec-grid { grid-template-columns: 1fr; }
  .hk-delivery-grid { grid-template-columns: repeat(3, 1fr); }
  .hk-quality-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .hk-hero { padding: 48px 20px 40px; }
  .hk-hero h1 { font-size: 24px; }
  .hk-sec { padding: 40px 20px; }
  .hk-title { font-size: 22px; }
  .hk-stats, .hk-net-grid, .hk-sec-grid { grid-template-columns: 1fr; }
  .hk-delivery-grid { grid-template-columns: repeat(2, 1fr); }
  .hk-quality-grid { grid-template-columns: 1fr; }
}



.news-item a {
    text-decoration: none;
    color: #444444;
}
.news-item a:hover {
    background: #ffffff;
    color: #e60012;
}





#sf-aicp {
  --sf-p: #E84D39;
  --sf-pd: #CF3D2B;
  --sf-b: #2B7DE9;
  --sf-t: #1A1A2E;
  --sf-s: #5A6072;
  --sf-bg: #FFFFFF;
  --sf-bg2: #F4F6FA;
  --sf-bg3: #0B1120;
  --sf-g: #22C55E;
  --sf-rd: 14px;
  --sf-sh: 0 4px 24px rgba(0,0,0,0.06);
  font-family: -apple-system, "Microsoft YaHei", "PingFang SC", sans-serif;
  color: var(--sf-t);
  line-height: 1.6;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
}


.sf-hero {
  background: linear-gradient(135deg, #0B1120 0%, #162040 50%, #1A3050 100%);
  padding: 180px 40px 64px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.sf-hero::before {
  content: '';
  position: absolute;
  top: -160px; right: -100px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(43,125,233,0.15) 0%, transparent 70%);
  pointer-events: none;
}
.sf-hero::after {
  content: '';
  position: absolute;
  bottom: -120px; left: -80px;
  width: 360px; height: 360px;
  background: radial-gradient(circle, rgba(232,77,57,0.1) 0%, transparent 70%);
  pointer-events: none;
}
.sf-hero-badge {
  display: inline-block;
  background: rgba(43,125,233,0.18);
  border: 1px solid rgba(43,125,233,0.45);
  padding: 6px 22px;
  border-radius: 22px;
  font-size: 13px;
  color: #60A5FA;
  margin-bottom: 28px;
  letter-spacing: 0.5px;
}
.sf-hero h1 { font-size: 38px; font-weight: 800; margin: 0 0 12px; line-height: 1.3; letter-spacing: 1px; }
.sf-hero h1 span { color: #60A5FA; }
.sf-hero .sf-sub { font-size: 16px; opacity: 0.75; margin: 0 0 52px; max-width: 720px; margin-left: auto; margin-right: auto; }
.sf-hero-kv {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(255,255,255,0.08);
  border-radius: var(--sf-rd);
  overflow: hidden;
  max-width: 840px;
  margin: 0 auto;
}
.sf-kv {
  background: rgba(255,255,255,0.04);
  padding: 26px 16px;
  text-align: center;
}
.sf-kv .sf-kv-num { font-size: 32px; font-weight: 800; color: #60A5FA; display: block; }
.sf-kv .sf-kv-label { font-size: 12px; opacity: 0.65; margin-top: 6px; display: block; }


.sf-sec { padding: 64px 40px; }
.sf-title { font-size: 28px; font-weight: 700; text-align: center; margin: 0 0 10px; color: var(--sf-t); }
.sf-desc { font-size: 15px; color: var(--sf-s); text-align: center; margin: 0 0 40px; max-width: 640px; margin-left: auto; margin-right: auto; }


.sf-challenge { background: var(--sf-bg2); }
.sf-challenge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sf-challenge-card {
  background: #fff;
  border-radius: var(--sf-rd);
  padding: 28px 24px;
  box-shadow: var(--sf-sh);
  border-top: 3px solid var(--sf-p);
  transition: transform 0.2s;
}
.sf-challenge-card:hover { transform: translateY(-4px); }
.sf-challenge-card h3 { font-size: 17px; font-weight: 700; margin: 0 0 12px; color: var(--sf-p); }
.sf-challenge-card p { font-size: 13px; color: var(--sf-s); margin: 0 0 8px; line-height: 1.7; }
.sf-challenge-card p:last-child { margin-bottom: 0; }
.sf-challenge-card strong { color: var(--sf-t); }


.sf-arch { background: #fff; }
.sf-arch-layer {
  border-radius: var(--sf-rd);
  padding: 24px 28px;
  margin-bottom: 16px;
  text-align: center;
  transition: transform 0.2s;
}
.sf-arch-layer:hover { transform: translateY(-3px); }
.sf-arch-layer h4 { font-size: 15px; font-weight: 700; margin: 0 0 8px; }
.sf-arch-layer p { font-size: 12px; color: var(--sf-s); margin: 0 0 10px; }
.sf-arch-layer p:last-child { margin-bottom: 0; }
.sf-arch-app { background: linear-gradient(135deg, rgba(43,125,233,0.08), rgba(43,125,233,0.03)); border: 1px solid rgba(43,125,233,0.2); }
.sf-arch-app h4 { color: var(--sf-b); }
.sf-arch-paas { background: linear-gradient(135deg, rgba(139,92,246,0.08), rgba(139,92,246,0.03)); border: 1px solid rgba(139,92,246,0.2); }
.sf-arch-paas h4 { color: #8B5CF6; }
.sf-arch-cp { background: linear-gradient(135deg, rgba(232,77,57,0.06), rgba(232,77,57,0.02)); border: 2px solid rgba(232,77,57,0.25); }
.sf-arch-cp h4 { color: var(--sf-p); font-size: 17px; }
.sf-arch-hw { background: linear-gradient(135deg, rgba(100,116,139,0.06), rgba(100,116,139,0.02)); border: 1px solid rgba(100,116,139,0.15); }
.sf-arch-hw h4 { color: #64748B; }
.sf-arch-tags { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }
.sf-arch-tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
}
.sf-arch-tag.blue { background: rgba(43,125,233,0.1); color: var(--sf-b); }
.sf-arch-tag.purple { background: rgba(139,92,246,0.1); color: #8B5CF6; }
.sf-arch-tag.red { background: rgba(232,77,57,0.08); color: var(--sf-p); }
.sf-arch-tag.gray { background: rgba(100,116,139,0.1); color: #64748B; }
.sf-arch-arrow { text-align: center; font-size: 22px; color: #CBD5E1; margin: 4px 0; }


.sf-advantage { background: var(--sf-bg2); }
.sf-adv-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sf-adv-card {
  background: #fff;
  border-radius: var(--sf-rd);
  padding: 32px 24px 28px;
  box-shadow: var(--sf-sh);
  text-align: center;
  border-left: 4px solid var(--sf-b);
  transition: transform 0.2s;
}
.sf-adv-card:hover { transform: translateY(-4px); }
.sf-adv-icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  margin: 0 auto 16px;
}
.sf-adv-icon.blue { background: rgba(43,125,233,0.1); color: var(--sf-b); }
.sf-adv-icon.green { background: rgba(34,197,94,0.1); color: var(--sf-g); }
.sf-adv-icon.orange { background: rgba(245,158,11,0.1); color: #F59E0B; }
.sf-adv-card h3 { font-size: 17px; font-weight: 700; margin: 0 0 10px; color: var(--sf-t); }
.sf-adv-card p { font-size: 13px; color: var(--sf-s); margin: 0 0 8px; line-height: 1.7; }
.sf-adv-card p:last-child { margin-bottom: 0; }
.sf-adv-card .sf-adv-data { font-size: 24px; font-weight: 800; color: var(--sf-b); display: block; margin-top: 10px; }


.sf-safety { background: var(--sf-bg3); color: #fff; }
.sf-safety .sf-title, .sf-safety .sf-desc { color: #fff; }
.sf-safety .sf-desc { opacity: 0.65; }
.sf-safety-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.sf-safety-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--sf-rd);
  padding: 28px 24px;
  transition: background 0.2s;
}
.sf-safety-card:hover { background: rgba(255,255,255,0.1); }
.sf-safety-card h3 { font-size: 17px; font-weight: 700; margin: 0 0 12px; color: #60A5FA; }
.sf-safety-card p { font-size: 13px; opacity: 0.8; margin: 0 0 8px; line-height: 1.7; }
.sf-safety-card p:last-child { margin-bottom: 0; }
.sf-safety-card strong { color: #fff; }
.sf-safety-card .sf-safe-data {
  font-size: 26px; font-weight: 800; color: #22D3EE;
  display: block; margin-top: 12px;
}


.sf-practice { background: #fff; }
.sf-prac-tabs {
  display: flex; gap: 8px; justify-content: center; margin-bottom: 32px; flex-wrap: wrap;
}
.sf-prac-tab {
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid #E5E7EB;
  background: #fff;
  color: var(--sf-s);
  transition: all 0.2s;
}
.sf-prac-tab:hover { border-color: var(--sf-b); color: var(--sf-b); }
.sf-prac-tab.active { background: var(--sf-b); color: #fff; border-color: var(--sf-b); }
.sf-prac-panel { display: none; }
.sf-prac-panel.active { display: block; }
.sf-prac-card {
  background: var(--sf-bg2);
  border-radius: var(--sf-rd);
  padding: 32px 28px;
  border-left: 4px solid var(--sf-b);
}
.sf-prac-card h3 { font-size: 17px; font-weight: 700; margin: 0 0 16px; color: var(--sf-t); }
.sf-prac-data-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.sf-prac-data-item { text-align: center; }
.sf-prac-data-item .sf-pd-num { font-size: 28px; font-weight: 800; color: var(--sf-b); display: block; }
.sf-prac-data-item .sf-pd-label { font-size: 12px; color: var(--sf-s); margin-top: 4px; display: block; }
.sf-prac-card p { font-size: 13px; color: var(--sf-s); margin: 0 0 8px; line-height: 1.7; }
.sf-prac-card p:last-child { margin-bottom: 0; }
.sf-prac-card strong { color: var(--sf-t); }


.sf-scene { background: var(--sf-bg2); }
.sf-scene-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.sf-scene-card {
  background: #fff;
  border-radius: var(--sf-rd);
  padding: 24px 20px;
  text-align: center;
  box-shadow: var(--sf-sh);
  transition: transform 0.2s, box-shadow 0.2s;
}
.sf-scene-card:hover { transform: translateY(-4px); box-shadow: 0 8px 32px rgba(0,0,0,0.1); }
.sf-scene-card h4 { font-size: 15px; font-weight: 700; margin: 0 0 12px; color: var(--sf-t); }
.sf-scene-card .sf-scene-icon {
  font-size: 28px; margin-bottom: 10px; display: block;
}
.sf-scene-card p { font-size: 12px; color: var(--sf-s); margin: 0; line-height: 1.6; }


.sf-cta {
  background: linear-gradient(135deg, #162040, var(--sf-b));
  padding: 64px 40px;
  text-align: center;
  color: #fff;
}
.sf-cta h2 { font-size: 28px; font-weight: 700; margin: 0 0 16px; }
.sf-cta p { font-size: 15px; opacity: 0.85; margin: 0 0 32px; }
.sf-cta .sf-btn {
  display: inline-block;
  background: #fff;
  color: var(--sf-b);
  padding: 14px 40px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}
.sf-cta .sf-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.25); }


.sf-footer {
  background: var(--sf-bg3);
  color: rgba(255,255,255,0.45);
  padding: 24px 40px;
  text-align: center;
  font-size: 13px;
}
.sf-footer a { color: rgba(255,255,255,0.6); text-decoration: none; }


@keyframes sfFadeIn {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
.sf-anim { opacity: 0; }
.sf-anim.sf-show { animation: sfFadeIn 0.5s ease forwards; }


@media (max-width: 900px) {
  .sf-hero-kv { grid-template-columns: repeat(2, 1fr); }
  .sf-challenge-grid { grid-template-columns: 1fr; }
  .sf-adv-grid { grid-template-columns: 1fr; }
  .sf-safety-grid { grid-template-columns: 1fr; }
  .sf-prac-data-row { grid-template-columns: repeat(2, 1fr); }
  .sf-scene-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .sf-hero { padding: 48px 20px 40px; }
  .sf-hero h1 { font-size: 24px; }
  .sf-sec { padding: 40px 20px; }
  .sf-title { font-size: 22px; }
  .sf-hero-kv, .sf-prac-data-row { grid-template-columns: 1fr; }
  .sf-scene-grid { grid-template-columns: 1fr; }
}


/* ============================================================
   产品方案页（products.html）专用样式  pb-*
   原模板引用了这套类但 CSS 里缺失，导致页面无样式，此处补齐。
   主色沿用站点变量：--accent #e60012 / --secondary-bg #112240
   ============================================================ */
#pb-wrap, .pb-wrap { padding: 0; }

/* Hero */
.pb-hero {
    background: linear-gradient(135deg, #112240 0%, #1b375f 100%);
    padding: 72px 20px 60px;
    color: #fff;
}
.pb-hero-inner { max-width: 1100px; margin: 0 auto; text-align: center; }
.pb-hero-badge {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 16px; margin-bottom: 22px;
    border: 1px solid rgba(255, 255, 255, .25); border-radius: 20px;
    font-size: 13px; color: rgba(255, 255, 255, .85);
}
.pb-hero-badge span {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--accent); display: inline-block;
}
.pb-hero h1 { font-size: 40px; line-height: 1.35; margin-bottom: 18px; color: #fff; }
.pb-hero h1 em { font-style: normal; color: var(--accent); }
.pb-hero > .pb-hero-inner > p {
    max-width: 760px; margin: 0 auto; font-size: 16px;
    line-height: 1.9; color: rgba(255, 255, 255, .78);
}

/* Hero 数据条 */
.pb-stats {
    display: flex; align-items: center; justify-content: center;
    gap: 26px; margin-top: 40px; flex-wrap: wrap;
}
.pb-stat-item { text-align: center; min-width: 96px; }
.pb-stat-num { font-size: 30px; font-weight: 700; color: #fff; line-height: 1.2; }
.pb-stat-num sup { font-size: 15px; font-weight: 500; color: var(--accent); }
.pb-stat-label { font-size: 13px; color: rgba(255, 255, 255, .6); margin-top: 4px; }
.pb-stat-divider { width: 1px; height: 34px; background: rgba(255, 255, 255, .18); }

/* 分类筛选栏 */
.pb-filter {
    position: sticky; top: 0; z-index: 20;
    background: #fff; border-bottom: 1px solid #eceff3;
}
.pb-filter-inner {
    max-width: 1100px; margin: 0 auto; padding: 14px 20px;
    display: flex; gap: 10px; overflow-x: auto;
}
.pb-tab {
    flex: 0 0 auto; padding: 8px 18px; border: 1px solid #e2e6ec;
    border-radius: 20px; background: #fff; color: var(--text-main);
    font-size: 14px; cursor: pointer; transition: all .2s;
}
.pb-tab:hover { border-color: var(--accent); color: var(--accent); }
.pb-tab.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* 内容区 */
.pb-content { max-width: 1100px; margin: 0 auto; padding: 36px 20px 60px; }
.pb-section { margin-bottom: 44px; }
.pb-section-head {
    display: flex; align-items: baseline; gap: 12px;
    padding-bottom: 12px; margin-bottom: 20px; border-bottom: 1px solid #eceff3;
}
.pb-section-title { font-size: 21px; color: #112240; position: relative; }
.pb-section-count { font-size: 13px; color: #98a2b3; }

.pb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

/* 方案卡片 */
.pb-card {
    display: block; position: relative;
    background: #fff; border: 1px solid #e9edf2; border-radius: 10px;
    padding: 22px 20px 20px; text-decoration: none; color: inherit;
    transition: transform .22s, box-shadow .22s, border-color .22s;
}
.pb-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(17, 34, 64, .10);
    border-color: var(--accent);
}
.pb-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.pb-card-icon {
    flex: 0 0 46px; width: 46px; height: 46px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center; font-size: 22px;
}
.pb-icon-red    { background: #fdecee; }
.pb-icon-blue   { background: #e8f0fe; }
.pb-icon-rose   { background: #fdeaf1; }
.pb-icon-cyan   { background: #e6f6fb; }
.pb-icon-green  { background: #e9f7ee; }
.pb-icon-purple { background: #f1ebfd; }
.pb-icon-teal   { background: #e6f7f6; }
.pb-icon-orange { background: #fff2e6; }
.pb-icon-slate  { background: #eef1f5; }

.pb-card-meta { min-width: 0; }
.pb-card-brand { font-size: 12px; color: #98a2b3; letter-spacing: .5px; margin-bottom: 3px; }
.pb-card-name { font-size: 16px; font-weight: 700; color: #112240; line-height: 1.45; }

.pb-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.pb-tag {
    font-size: 12px; padding: 3px 9px; border-radius: 4px;
    background: #f2f5f9; color: #6b7688;
}
.pb-tag.hot { background: #fdecee; color: var(--accent); }
.pb-tag.new { background: #e9f7ee; color: #1a9c53; }

.pb-card-value {
    font-size: 14px; line-height: 1.75; color: var(--text-main);
    margin-bottom: 16px;
}

.pb-metrics {
    display: flex; gap: 10px; padding-top: 14px; border-top: 1px dashed #e9edf2;
}
.pb-metric { flex: 1; text-align: center; }
.pb-metric-num { font-size: 16px; font-weight: 700; color: #112240; line-height: 1.3; }
.pb-metric-num span { font-size: 12px; font-weight: 500; color: var(--accent); }
.pb-metric-label { font-size: 11px; color: #98a2b3; margin-top: 3px; }

.pb-card-arrow {
    position: absolute; right: 18px; bottom: 16px;
    font-size: 16px; color: #c7ced8; transition: color .2s, transform .2s;
}
.pb-card:hover .pb-card-arrow { color: var(--accent); transform: translateX(3px); }

/* 筛选隐藏态 */
.pb-hidden { display: none !important; }
.pb-section-hidden { display: none !important; }

/* 底部 CTA */
.pb-cta {
    display: flex; align-items: center; justify-content: space-between;
    gap: 24px; flex-wrap: wrap;
    background: linear-gradient(135deg, #112240, #1b375f);
    border-radius: 12px; padding: 32px 34px; color: #fff;
}
.pb-cta-text h3 { font-size: 20px; margin-bottom: 6px; color: #fff; }
.pb-cta-text p { font-size: 14px; color: rgba(255, 255, 255, .72); }
.pb-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.pb-btn-primary, .pb-btn-outline {
    display: inline-block; padding: 11px 26px; border-radius: 6px;
    font-size: 15px; text-decoration: none; transition: all .2s;
}
.pb-btn-primary { background: var(--accent); color: #fff; }
.pb-btn-primary:hover { background: #c80010; color: #fff; }
.pb-btn-outline { border: 1px solid rgba(255, 255, 255, .45); color: #fff; }
.pb-btn-outline:hover { background: rgba(255, 255, 255, .12); color: #fff; }

/* 亿联 AVONE 页 hero 右列容器 */
.yl-hero-card-wrap { align-self: center; }

@media (max-width: 1000px) {
    .pb-grid { grid-template-columns: repeat(2, 1fr); }
    .pb-hero h1 { font-size: 32px; }
}
@media (max-width: 640px) {
    .pb-grid { grid-template-columns: 1fr; }
    .pb-hero { padding: 116px 18px 40px; }
    .pb-hero h1 { font-size: 26px; }
    .pb-stats { gap: 16px; }
    .pb-stat-divider { display: none; }
    .pb-cta { padding: 24px 20px; }
    .pb-metrics { flex-wrap: wrap; }
}

/* ==========================================================================
   首页新板块（hm-*）：数据条 / 我们能做什么 / 精选方案 / 服务流程 / 行业 / CTA
   配色沿用主题变量：--secondary-bg #112240、--accent #e60012
   ========================================================================== */

/* —— 通用区块与标题 —— */
.hm-section { padding: 78px 0; }
.hm-head { text-align: center; margin-bottom: 46px; }
.hm-eyebrow {
    display: inline-block; font-size: 12px; letter-spacing: 2.5px; font-weight: 700;
    color: var(--accent); margin-bottom: 10px; text-transform: uppercase;
}
.hm-title { font-size: 32px; color: var(--secondary-bg); font-weight: 700; line-height: 1.35; }
.hm-sub { margin-top: 12px; font-size: 15px; color: #6b7280; line-height: 1.8; }
.hm-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; text-align: left; }
.hm-link-all { flex: none; font-size: 15px; font-weight: 600; color: var(--secondary-bg); white-space: nowrap; transition: .25s; }
.hm-link-all span { display: inline-block; transition: transform .25s; }
.hm-link-all:hover { color: var(--accent); }
.hm-link-all:hover span { transform: translateX(4px); }

/* —— 数据条（浅色白卡，参考利迅风格） —— */
.hm-stats { background: #f7f9fc; padding: 36px 0; }
.hm-stats .container {
    display: flex; align-items: center; justify-content: center; gap: 40px; flex-wrap: wrap;
    background: #fff; border: 1px solid #e6eaf0; border-radius: 16px;
    padding: 28px 30px; box-shadow: 0 6px 24px rgba(16, 35, 71, .05);
}
.hm-stat-item { text-align: center; min-width: 150px; }
.hm-stat-num { font-size: 34px; font-weight: 800; color: var(--secondary-bg); line-height: 1.1; }
.hm-stat-num sup { font-size: 16px; color: var(--accent); margin-left: 2px; }
.hm-stat-label { margin-top: 6px; font-size: 13px; color: #6b7280; letter-spacing: .5px; }
.hm-stat-divider { width: 1px; height: 42px; background: #e6eaf0; }

/* —— 我们能做什么：能力矩阵 —— */
.hm-cap { background: #fff; }
.hm-cap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 22px; }
.hm-cap-card {
    background: #fff; border: 1px solid #e6eaf0; border-radius: 14px; padding: 26px 24px;
    display: flex; flex-direction: column; transition: transform .28s, box-shadow .28s, border-color .28s;
}
.hm-cap-card:hover {
    transform: translateY(-5px); border-color: rgba(230, 0, 18, .35);
    box-shadow: 0 14px 34px rgba(16, 35, 71, .1);
}
.hm-cap-top { display: flex; align-items: center; gap: 14px; }
.hm-cap-icon {
    flex: none; width: 54px; height: 54px; border-radius: 14px; background: #fdecee;
    display: flex; align-items: center; justify-content: center; font-size: 26px;
}
.hm-cap-title-wrap { min-width: 0; }
.hm-cap-name { font-size: 18px; font-weight: 700; color: var(--secondary-bg); line-height: 1.4; }
.hm-cap-summary { margin-top: 4px; font-size: 13px; color: #8892b0; line-height: 1.6; }
.hm-cap-list { list-style: none; margin: 18px 0 0; padding: 0; }
.hm-cap-list li a {
    display: block; padding: 9px 0; font-size: 14px; color: #555;
    border-bottom: 1px dashed #eef1f5; transition: color .2s, padding-left .2s;
}
.hm-cap-list li:last-child a { border-bottom: none; }
.hm-cap-list li a::before { content: "› "; color: var(--accent); font-weight: 700; }
.hm-cap-list li a:hover { color: var(--accent); padding-left: 5px; }
.hm-cap-more {
    margin-top: auto; padding-top: 16px; font-size: 14px; font-weight: 600;
    color: var(--accent); display: inline-flex; align-items: center; gap: 5px;
}
.hm-cap-more span { transition: transform .25s; }
.hm-cap-more:hover span { transform: translateX(4px); }

/* —— 精选方案（复用产品页 pb-card 卡片样式，仅换背景） —— */
.hm-featured { background: #f7f9fc; }
.hm-featured .pb-card { background: #fff; }

/* —— 服务流程四步 —— */
.hm-process { background: #fff; }
.hm-step-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.hm-step {
    background: #f7f9fc; border-radius: 14px; padding: 28px 22px; border-top: 3px solid transparent;
    transition: transform .28s, box-shadow .28s, border-color .28s;
}
.hm-step:hover {
    transform: translateY(-4px); border-top-color: var(--accent);
    box-shadow: 0 12px 30px rgba(16, 35, 71, .1);
}
.hm-step-no {
    width: 46px; height: 46px; border-radius: 12px; background: #fdecee; color: var(--accent);
    font-size: 17px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
}
.hm-step h3 { font-size: 17px; color: var(--secondary-bg); font-weight: 700; margin-bottom: 10px; line-height: 1.5; }
.hm-step p { font-size: 14px; color: #6b7280; line-height: 1.85; }

/* —— 服务行业 —— */
.hm-industry { background: #f7f9fc; }
.hm-chip-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.hm-chip {
    background: #fff; border: 1px solid #e6eaf0; color: var(--secondary-bg);
    font-size: 15px; padding: 11px 22px; border-radius: 999px; transition: .25s;
}
.hm-chip:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }

/* —— 底部 CTA（白底浅色风） —— */
.hm-cta { background: #fff; padding: 52px 0; border-top: 1px solid #eef1f5; }
.hm-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.hm-cta-text h3 { font-size: 24px; color: var(--secondary-bg); font-weight: 700; line-height: 1.5; }
.hm-cta-text p { margin-top: 8px; font-size: 14px; color: #6b7280; }
.hm-cta-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hm-btn-primary, .hm-btn-outline {
    display: inline-flex; align-items: center; gap: 8px; padding: 13px 26px; border-radius: 8px;
    font-size: 15px; font-weight: 600; transition: .25s;
    text-decoration: none; /* 覆盖浏览器默认链接下划线 */
}
.hm-btn-primary { background: var(--accent); color: #fff; }
.hm-btn-primary:hover { background: #c80010; color: #fff; }
.hm-btn-outline { border: 1px solid #d5dbe3; color: var(--secondary-bg); }
.hm-btn-outline:hover { border-color: var(--accent); background: #fdecee; color: var(--accent); }

/* —— 滚动淡入（JS 加类，无 JS 时 .hm-fade 不会被加上，不影响显示） —— */
.hm-fade { opacity: 0; transform: translateY(14px); }
.hm-in { opacity: 1; transform: none; transition: opacity .55s ease, transform .55s ease; }

/* —— 响应式 —— */
@media (max-width: 1100px) {
    .hm-step-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
    .hm-section { padding: 56px 0; }
    .hm-title { font-size: 26px; }
    .hm-head-row { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
    .hm-section { padding: 44px 0; }
    .hm-stats .container { gap: 22px; }
    .hm-stat-divider { display: none; }
    .hm-stat-num { font-size: 28px; }
    .hm-stat-item { min-width: 120px; }
    .hm-title { font-size: 23px; }
    .hm-step-grid { grid-template-columns: 1fr; }
    .hm-cta-inner { flex-direction: column; align-items: flex-start; }
    /* 只收窄首页新板块的内边距，不动全站 .container（避免影响其他页面） */
    .hm-section .container, .hm-stats .container, .hm-cta .container { padding: 0 22px; }
}

/* ==========================================================
   2026-09-28 首页改版：静态 Hero + 白色数据条 / CTA / 页脚
   （本块置于文件末尾，覆盖上方同名旧规则）
   ========================================================== */

/* —— 首屏：左文右图（浅色简洁版） —— */
.hero {
    position: relative;
    background: linear-gradient(120deg, #ffffff 0%, #f7f9fc 55%, #eef4fb 100%);
    overflow: hidden;
    padding: 150px 0 130px;
}
.hero-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    gap: 60px;
}
.hero-text { flex: 1 1 46%; min-width: 0; }
.hero-eyebrow {
    display: inline-block;
    font-size: 13px;
    letter-spacing: 4px;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 22px;
}
.hero-title {
    font-size: 54px;
    line-height: 1.28;
    font-weight: 800;
    color: var(--secondary-bg);
    margin-bottom: 24px;
    letter-spacing: 1px;
}
.hero-desc {
    font-size: 17px;
    line-height: 2;
    color: #5b6577;
    margin-bottom: 36px;
}
.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-btn-primary {
    display: inline-block;
    padding: 14px 42px;
    background: var(--accent);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none;
    transition: all .3s;
    box-shadow: 0 10px 26px rgba(230,0,18,.28);
}
.hero-btn-primary:hover { background: #c80010; color: #fff; transform: translateY(-2px); }
.hero-btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 14px 34px;
    background: #fff;
    border: 1px solid #d3d9e3;
    color: var(--secondary-bg);
    font-size: 16px;
    border-radius: 6px;
    text-decoration: none;
    transition: all .3s;
}
.hero-btn-ghost span { transition: transform .25s; }
.hero-btn-ghost:hover { border-color: var(--accent); color: var(--accent); }
.hero-btn-ghost:hover span { transform: translateX(4px); }
.hero-pic { flex: 1 1 54%; min-width: 0; }
.hero-pic img { width: 100%; height: auto; display: block; border-radius: 12px; }

/* 首页首屏轮播图（后台「首页轮播图」有数据时启用，否则回退静态图） */
.hero-pic .hb-carousel { position: relative; width: 100%; aspect-ratio: 3 / 2; border-radius: 12px; overflow: hidden; box-shadow: 0 18px 50px rgba(20, 30, 50, .16); }
.hero-pic .hb-slides { position: absolute; inset: 0; }
.hero-pic .hb-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; display: block; }
.hero-pic .hb-slide.is-active { opacity: 1; z-index: 1; }
.hero-pic .hb-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-pic .hb-slide-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 26px 26px; background: linear-gradient(transparent, rgba(15, 23, 42, .72)); color: #fff; }
.hero-pic .hb-slide-title { font-size: 22px; font-weight: 700; line-height: 1.25; }
.hero-pic .hb-slide-sub { font-size: 14px; opacity: .9; margin-top: 6px; }
.hero-pic .hb-dots { position: absolute; right: 18px; bottom: 16px; display: flex; gap: 8px; z-index: 2; }
.hero-pic .hb-dot { width: 10px; height: 10px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .55); cursor: pointer; padding: 0; transition: background .25s, transform .25s; }
.hero-pic .hb-dot.is-active { background: #fff; transform: scale(1.25); }
@media (max-width: 1100px) {
    .hero-title { font-size: 42px; }
    .hero-inner { gap: 34px; }
}
@media (max-width: 900px) {
    .hero { padding: 120px 0 90px; }
    .hero-inner { flex-direction: column; align-items: flex-start; padding: 0 22px; gap: 30px; }
    .hero-title { font-size: 32px; }
    .hero-desc { font-size: 15px; margin-bottom: 26px; }
    .hero-pic { width: 100%; }
}

/* —— 资质与授权：双行反向自动轮播 —— */
.hm-certs { background: #fff; padding: 70px 0 64px; border-top: 1px solid #eef1f5; }
.hm-certs .hm-head { text-align: center; margin-bottom: 40px; }
.cert-marquee {
    display: flex;
    flex-direction: column;
    gap: 22px;
    overflow: hidden;
    padding: 6px 0;
    /* 两侧柔化收尾，避免硬切边 */
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.cert-track {
    display: flex;
    align-items: stretch;
    gap: 18px;
    width: max-content;
    animation: cert-scroll-left 46s linear infinite;
    will-change: transform;
}
.cert-track-right { animation-name: cert-scroll-right; animation-duration: 52s; }
.cert-marquee:hover .cert-track { animation-play-state: paused; }
@keyframes cert-scroll-left {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
@keyframes cert-scroll-right {
    from { transform: translateX(-50%); }
    to   { transform: translateX(0); }
}
.cert-badge {
    flex: none;
    width: 178px;
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 12px;
    padding: 20px 14px 16px;
    text-align: center;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.cert-badge:hover {
    transform: translateY(-5px);
    border-color: rgba(230, 0, 18, .35);
    box-shadow: 0 12px 28px rgba(16, 35, 71, .1);
}
.cert-badge-img { height: 46px; display: flex; align-items: center; justify-content: center; margin-bottom: 2px; }
.cert-badge-img img {
    max-height: 46px;
    max-width: 120px;
    object-fit: contain;
    transition: transform .3s; /* 保留商标原本颜色，不做灰度降饱和 */
}
.cert-badge:hover .cert-badge-img img { transform: scale(1.06); }
.cert-badge-initial {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    height: 46px;
    padding: 0 12px;
    border-radius: 10px;
    background: #fdecee;
    color: var(--accent);
    font-size: 19px;
    font-weight: 800;
    letter-spacing: 1px;
}
.cert-badge-name { font-size: 15px; font-weight: 700; color: var(--secondary-bg); }
.cert-badge-level { font-size: 12px; color: #8892b0; line-height: 1.5; }
.hm-certs-more { text-align: center; margin-top: 34px; }
.hm-certs-more a { font-size: 15px; font-weight: 600; color: var(--secondary-bg); transition: color .25s; }
.hm-certs-more a span { display: inline-block; transition: transform .25s; }
.hm-certs-more a:hover { color: var(--accent); }
.hm-certs-more a:hover span { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) {
    .cert-track { animation: none; }
    .cert-marquee { overflow-x: auto; }
}

/* —— 数据条：白色圆角卡片，压在 Hero 底部（同参考站样式） —— */
.hm-stats { background: #fff; padding: 0 20px 70px; }
.hm-stats .container {
    max-width: 1200px;
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 16px;
    box-shadow: 0 18px 44px rgba(16,35,71,.08);
    margin-top: -80px;
    padding: 36px 24px;
    position: relative;
    z-index: 5;
}
.hm-stat-num { color: var(--secondary-bg); }
.hm-stat-label { color: #6b7280; }
.hm-stat-divider { background: #e6eaf0; }

/* —— 底部 CTA：白底深字 —— */
.hm-cta { background: #fff; border-top: 1px solid #eef1f5; }
.hm-cta-text h3 { color: var(--secondary-bg); }
.hm-cta-text p { color: #6b7280; }
.hm-btn-outline { border: 1px solid #d3d9e3; color: var(--secondary-bg); }
.hm-btn-outline:hover { background: #f5f7fa; color: var(--secondary-bg); }

/* —— 页脚：白底深字 —— */
.footer { background-color: #fff; color: #555555; border-top: 1px solid #eef1f5; }
.footer-top { border-bottom: 1px solid #e6eaf0; }
.footer-nav a { color: #555555; }
.footer-nav a:hover { color: var(--accent); }
.footer-contact { color: #555555; }
.footer-contact .hotline strong { color: var(--secondary-bg); }
/* 2026-09-28 页脚联系方式字号加大 */
.footer-contact { font-size: 17px; line-height: 2.1; }
.footer-contact .hotline { font-size: 19px; }
.footer-contact .hotline strong { font-size: 27px; }
.footer-contact a { font-size: inherit; }
.footer-bottom { color: #999999; }
.footer-bottom a { color: #999999; }
.footer-bottom a:hover { color: var(--accent); }

/* —— 我们能做什么：四张领域卡片（hover 展开方案清单，手风琴式） —— */
.hm-domains { background: #fff; }
.dm-row { display: flex; gap: 18px; }
.dm-card {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    height: 540px;
    border-radius: 18px;
    overflow: hidden;
    background: #0a1526;
    transition: flex .55s cubic-bezier(.4, 0, .2, 1), box-shadow .4s;
    display: flex;
    flex-direction: column;
}
.dm-card:hover { flex: 2.2; box-shadow: 0 22px 48px rgba(10, 21, 38, .22); }
.dm-cover {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s ease;
}
.dm-card:hover .dm-cover { transform: scale(1.05); }
.dm-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(6, 15, 33, .86) 0%,
        rgba(6, 15, 33, .55) 30%,
        rgba(6, 15, 33, .18) 52%,
        rgba(6, 15, 33, .92) 100%);
}
.dm-top { position: relative; z-index: 2; padding: 30px 26px 0; color: #fff; }
.dm-title { font-size: 22px; font-weight: 800; letter-spacing: .5px; margin-bottom: 10px; }
.dm-desc { font-size: 13.5px; line-height: 1.85; color: rgba(255, 255, 255, .86); }
.dm-panel {
    position: relative;
    z-index: 2;
    margin-top: auto;
    padding: 0 26px 24px;
    color: #fff;
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .4s ease .1s, transform .4s ease .1s;
}
.dm-card:hover .dm-panel { opacity: 1; transform: none; }
.dm-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    font-weight: 700;
    border-top: 2px solid var(--accent);
    padding-top: 12px;
    margin-bottom: 4px;
}
.dm-panel-head span { font-weight: 400; font-size: 12px; color: rgba(255, 255, 255, .6); }
.dm-panel ul { list-style: none; margin: 0; padding: 0; }
.dm-panel li { border-bottom: 1px solid rgba(255, 255, 255, .16); }
.dm-panel li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 2px;
    color: rgba(255, 255, 255, .92);
    font-size: 14px;
    text-decoration: none;
    transition: color .2s, padding-left .2s;
}
.dm-panel li a::after { content: '→'; opacity: .45; font-size: 13px; }
.dm-panel li a:hover { color: #fff; padding-left: 8px; }
.dm-panel-more {
    display: inline-block;
    margin-top: 12px;
    font-size: 13px;
    color: rgba(255, 255, 255, .85);
    text-decoration: none;
    transition: color .2s;
}
.dm-panel-more:hover { color: #fff; }
.dm-arrow {
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 3;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    backdrop-filter: blur(6px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    transition: background .3s;
}
.dm-card:hover .dm-arrow { background: var(--accent); }
@media (max-width: 960px) {
    .dm-row { flex-direction: column; }
    .dm-card { height: 400px; flex: none; }
    .dm-card:hover { flex: none; }
    /* 触屏没有 hover：方案清单直接常显 */
    .dm-panel { opacity: 1; transform: none; }
}

/* ==========================================================
   2026-09-28h 关于华表单页统一版式（公司简介 + 企业文化 + 公司资质）
   顶部下拉样式已随导航下拉一并删除；页脚导航改为一行排开。
   ========================================================== */

/* —— 页脚导航：六个栏目独占一行居中排开（联系方式/二维码放下一行） —— */
.footer-cols {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0 64px;
    flex-basis: 100%;
    margin-bottom: 22px;
}
.footer-cols .footer-col-title {
    color: #111827;
    font-size: 17px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: color .3s;
}
.footer-cols .footer-col-title:hover { color: var(--accent); }
@media (max-width: 768px) {
    .footer-cols { flex-wrap: wrap; gap: 10px 28px; }
    .footer-cols .footer-col-title { font-size: 15px; }
}

/* —— 关于页通用分节：与首页 hm-section 同风格（白底 + 细分隔线） —— */
.about-section { background: #fff; padding: 72px 0; }
.about-section + .about-section { border-top: 1px solid #eef1f5; }
.about-section-alt { background: #f7f9fc; }
.about-section .hm-head { text-align: center; margin-bottom: 44px; }

/* —— 公司简介：左文右图 —— */
.profile-split {
    display: flex;
    align-items: center;
    gap: 52px;
}
.profile-text { flex: 1.15; min-width: 0; }
.profile-text p {
    font-size: 15.5px;
    line-height: 2.05;
    color: #4b5563;
    margin-bottom: 18px;
    text-align: justify;
    text-indent: 2em;
}
.profile-text p:last-child { margin-bottom: 0; }
.profile-em { color: var(--secondary-bg); font-weight: 700; }
.profile-pic {
    flex: 1;
    min-width: 0;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(16, 35, 71, .12);
}
.profile-pic img {
    display: block;
    width: 100%;
    height: 400px;
    object-fit: cover;
}
@media (max-width: 900px) {
    .profile-split { flex-direction: column; gap: 28px; }
    .profile-text p { text-indent: 0; }
    .profile-pic { width: 100%; }
    .profile-pic img { height: 260px; }
}

/* —— 企业文化：卡片式（白卡 + 红色标签 + 悬停上浮，与首页卡片同族） —— */
.culture-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 30px;
}
.culture-card {
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 16px;
    padding: 30px 26px 26px;
    box-shadow: 0 6px 18px rgba(16, 35, 71, .05);
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.culture-card:hover {
    transform: translateY(-6px);
    border-color: rgba(230, 0, 18, .3);
    box-shadow: 0 16px 36px rgba(16, 35, 71, .1);
}
.culture-card-tag {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--accent);
    background: #fdecee;
    border-radius: 999px;
    padding: 4px 16px;
    margin-bottom: 16px;
}
.culture-card h3 {
    font-size: 19px;
    font-weight: 800;
    color: var(--secondary-bg);
    margin-bottom: 12px;
}
.culture-card p { font-size: 14.5px; line-height: 1.95; color: #6b7280; margin: 0; }
.culture-values { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.culture-value {
    font-size: 13px;
    padding: 5px 14px;
    background: #f5f7fa;
    border: 1px solid #e6eaf0;
    border-radius: 8px;
    color: #374151;
    font-weight: 600;
}
/* —— 文化墙标语：第二排卡片（黄色徽章呼应文化墙牌子） —— */
.culture-sub {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 6px 0 20px;
    color: #9aa3b2;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 4px;
}
.culture-sub::before,
.culture-sub::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #e6eaf0;
}
.culture-cards-wall { margin-bottom: 0; }
.wall-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    background: linear-gradient(145deg, #ffd23e, #f5b90f);
    color: #b02418;
    font-size: 23px;
    font-weight: 800;
    margin-bottom: 14px;
    box-shadow: 0 6px 14px rgba(245, 185, 15, .32);
}
/* —— 文化墙：标题下红色英文副标 —— */
.culture-wall-card h3 {
    text-align: center;
    font-size: 22px;
    margin-bottom: 4px;
}
.wall-en {
    display: block;
    text-align: center;
    margin: 0 0 16px;
    padding-top: 10px;
    border-top: 1px dashed #f0d5d5;
    color: var(--accent);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}
.wall-behaviors {
    margin: 0;
    padding: 0;
    list-style: none;
}
.wall-behaviors li {
    position: relative;
    padding-left: 16px;
    font-size: 13.5px;
    line-height: 1.8;
    color: #6b7280;
    margin-bottom: 5px;
}
.wall-behaviors li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: .72em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--accent);
    opacity: .55;
}
@media (max-width: 900px) {
    .culture-cards { grid-template-columns: 1fr; }
}

/* —— 公司资质：证书卡片自动向右轮播（hover 暂停，点击看大图） —— */
.certcard-marquee {
    overflow: hidden;
    padding: 6px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
}
.certcard-track {
    display: flex;
    align-items: stretch;
    gap: 20px;
    width: max-content;
    /* 内容渲染两遍：从 -50% 平移到 0，视觉上卡片整体向右滚动 */
    animation: certcard-scroll 64s linear infinite;
    will-change: transform;
}
.certcard-marquee:hover .certcard-track { animation-play-state: paused; }
@keyframes certcard-scroll {
    from { transform: translateX(-50%); }
    to   { transform: translateX(0); }
}
.certcard {
    flex: none;
    width: 252px;
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 14px;
    overflow: hidden;
    cursor: pointer;
    text-align: center;
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.certcard:hover {
    transform: translateY(-5px);
    border-color: rgba(230, 0, 18, .35);
    box-shadow: 0 12px 28px rgba(16, 35, 71, .12);
}
.certcard-img {
    height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
}
.certcard-img img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    transition: transform .3s;
}
.certcard:hover .certcard-img img { transform: scale(1.04); }
.certcard-title {
    padding: 12px 14px 16px;
    border-top: 1px solid #f0f2f6;
    font-size: 14px;
    font-weight: 600;
    color: var(--secondary-bg);
    line-height: 1.5;
}
@media (prefers-reduced-motion: reduce) {
    .certcard-track { animation: none; }
    .certcard-marquee { overflow-x: auto; }
}

/* ==========================================================
   2026-09-28k 页脚改华讯式：左品牌块（logo+热线+二维码）+ 右多栏导航
   旧 .footer-cols / .footer-contact / .footer-qr 规则随之废弃
   ========================================================== */
.footer-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
    padding: 46px 0 34px;
    text-align: left;
}
.footer-brand { max-width: 300px; }
.footer-brand .footer-logo {
    display: block;
    height: 52px;
    margin-bottom: 18px;
}
.footer-hotline { margin: 0 0 18px; line-height: 1.5; }
.footer-hotline .fh-label {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 14.5px;
    color: #374151;
}
.footer-hotline strong {
    display: block;
    font-size: 24px;
    font-weight: 800;
    color: var(--secondary-bg);
    letter-spacing: .5px;
}
.footer-qrs { display: flex; gap: 22px; }
.footer-qrs .qr-item {
    text-align: center;
    color: #8a94a6;
    font-size: 12.5px;
}
.footer-qrs .qr-item img {
    display: block;
    width: 92px;
    height: 92px;
    border: 1px solid #e6eaf0;
    border-radius: 8px;
    margin-bottom: 6px;
    object-fit: cover;
}
.footer-navcols {
    display: flex;
    flex: 1;
    justify-content: space-between;
    gap: 30px;
    max-width: 760px;
}
.footer-navcol { min-width: 120px; }
.footer-navcol h4 {
    font-size: 16px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 14px;
}
.footer-navcol a {
    display: block;
    font-size: 14px;
    color: #555555;
    text-decoration: none;
    line-height: 2.2;
    transition: color .3s;
}
.footer-navcol a:hover { color: var(--accent); }
@media (max-width: 900px) {
    .footer-top { flex-direction: column; gap: 28px; }
    .footer-brand { max-width: 100%; }
    .footer-navcols { flex-wrap: wrap; justify-content: flex-start; gap: 24px 48px; }
}

/* ==========================================================
   2026-09-28m 公司简介：标题居中于简介文字列正上方 + 强调词红色加粗
   ========================================================== */
.profile-text .hm-head.profile-head {
    text-align: center;
    margin-bottom: 30px;
}
.profile-em { color: var(--accent); }

/* ==========================================================
   2026-09-29a 资质轮播：手动左右切换箭头
   ========================================================== */
.certcard-wrap { position: relative; }
.cert-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 46px;
    height: 46px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 6px 20px rgba(16, 35, 71, .18);
    color: var(--secondary-bg);
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .25s, color .25s, box-shadow .25s;
}
.cert-nav:hover {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 8px 26px rgba(230, 0, 18, .3);
}
.cert-prev { left: 10px; }
.cert-next { right: 10px; }
.certcard-marquee.paused .certcard-track { animation-play-state: paused; }
@media (max-width: 768px) {
    .cert-nav { width: 38px; height: 38px; font-size: 22px; }
}

/* ==========================================================
   2026-09-29b 产品页：hero/CTA 白底 + 方案卡 AI 图标
   ========================================================== */
/* —— 产品页 Hero：白底精简版（大标题一行 + 小字，无徽章无数据条） —— */
/* 顶部内边距须大于固定头部高度（~100px），否则标题被吸顶导航遮挡 */
.pb-hero {
    background: #fff;
    padding: 156px 20px 46px;
    border-bottom: 1px solid #eef1f5;
}
.pb-hero h1 { color: var(--secondary-bg); }
.pb-hero h1 em { color: var(--accent); }
.pb-hero > .pb-hero-inner > p {
    color: #6b7280;
    font-size: 15.5px;
}

/* —— 产品页底部 CTA：白底卡片 —— */
.pb-cta {
    background: #fff;
    border: 1px solid #e6eaf0;
    box-shadow: 0 8px 28px rgba(16, 35, 71, .06);
}
.pb-cta-text h3 { color: var(--secondary-bg); }
.pb-cta-text p { color: #6b7280; }
.pb-btn-outline { border-color: #d5dae2; color: var(--secondary-bg); }
.pb-btn-outline:hover { background: #f5f7fa; color: var(--accent); }

/* —— 方案卡图标：AI 生成图替代 emoji —— */
.pb-card-icon { overflow: hidden; }
.pb-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}


/* ==========================================================
   2026-09-29e 服务页：删 banner / 去背景图 / 卡片样式优化
   ========================================================== */
/* —— 服务内容区：白底，顶部留出固定头部高度 —— */
.service-content {
    background-image: none !important;
    background: #fff;
    max-width: 1100px;
    margin: 0 auto;
    padding: 156px 20px 70px;
}
.service-content .hm-head {
    text-align: center;
    margin-bottom: 44px;
}
.service-content .hm-title { font-size: 30px; }

/* —— 服务卡片：去大边距重影，改细边框浅阴影 + 悬停上浮 —— */
.service-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
    margin: 0 0 26px;
}
.service-cards .card {
    background: #fff;
    border: 1px solid #eef1f5;
    border-radius: 16px;
    box-shadow: 0 6px 22px rgba(16, 35, 71, .06);
    margin: 0;
    padding: 36px 26px 30px;
    text-align: center;
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.service-cards .card:hover {
    transform: translateY(-6px);
    border-color: rgba(230, 0, 18, .18);
    box-shadow: 0 16px 36px rgba(16, 35, 71, .12);
}
.service-cards .card img {
    height: 52px;
    width: auto;
    margin: 0 auto 18px;
    display: block;
}
.service-cards .card h4 {
    font-size: 19px;
    color: #111827;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 14px;
    position: relative;
}
.service-cards .card h4::after {
    content: "";
    display: block;
    width: 34px;
    height: 3px;
    border-radius: 2px;
    background: var(--accent, #e60012);
    margin: 12px auto 0;
}
.service-cards .card p {
    font-size: 15px;
    line-height: 1.9;
    color: #6b7280;
    text-align: justify;
    margin: 0;
}
@media (max-width: 900px) {
    .service-content { padding: 120px 18px 56px; }
    .service-cards { grid-template-columns: 1fr; gap: 18px; }
}


/* ==========================================================
   2026-09-29f 联系我们：左信息卡 + 右表单卡（参考版式）
   ========================================================== */
.ct-page {
    background: #f5f7fa;
    min-height: 60vh;
    padding: 156px 20px 80px;
    display: grid;
    grid-template-columns: 5fr 6fr;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    align-items: start;
}
.ct-title {
    font-size: 40px;
    color: #111827;
    margin: 10px 0 16px;
}
.ct-lead {
    font-size: 15.5px;
    line-height: 1.9;
    color: #6b7280;
    margin-bottom: 34px;
    max-width: 420px;
}
.ct-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ct-card {
    background: #fff;
    border: 1px solid #eef1f5;
    border-radius: 14px;
    padding: 20px 22px;
    transition: box-shadow .3s, transform .3s;
}
.ct-card:hover { box-shadow: 0 12px 28px rgba(16, 35, 71, .10); transform: translateY(-3px); }
.ct-card.ct-wide { grid-column: 1 / -1; }
.ct-label { display: block; font-size: 13px; color: #9ca3af; margin-bottom: 8px; }
.ct-card p { font-size: 15px; color: #374151; line-height: 1.7; margin: 0; word-break: break-all; }
.ct-card .ct-hotline { font-size: 22px; font-weight: 700; color: #111827; letter-spacing: .5px; }

/* —— 右侧表单卡 —— */
.ct-form-card {
    background: #fff;
    border: 1px solid #eef1f5;
    border-radius: 20px;
    box-shadow: 0 14px 40px rgba(16, 35, 71, .08);
    padding: 34px 32px;
}
.ct-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
.ct-field { margin-bottom: 18px; }
.ct-field label {
    display: block;
    font-size: 14px;
    color: #374151;
    margin-bottom: 8px;
    font-weight: 600;
}
.ct-field label i { color: var(--accent, #e60012); font-style: normal; }
.ct-field input, .ct-field select, .ct-field textarea {
    width: 100%;
    box-sizing: border-box;
    background: #f5f7fa;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 15px;
    color: #111827;
    outline: none;
    transition: background .2s, border-color .2s;
    font-family: inherit;
}
.ct-field input::placeholder, .ct-field textarea::placeholder { color: #b3bac4; }
.ct-field input:focus, .ct-field select:focus, .ct-field textarea:focus {
    background: #fff;
    border-color: var(--accent, #e60012);
}
.ct-field textarea { resize: vertical; min-height: 120px; }
.ct-field .errorlist, .ct-field ul.errorlist {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
    font-size: 13px;
    color: var(--accent, #e60012);
}
.ct-submit {
    display: block;
    width: 100%;
    margin-top: 6px;
    background: var(--accent, #e60012);
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 14px 0;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: filter .2s, transform .2s;
}
.ct-submit:hover { filter: brightness(1.08); transform: translateY(-1px); }
.ct-success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #15803d;
    border-radius: 10px;
    padding: 12px 16px;
    font-size: 15px;
    margin-bottom: 18px;
}
@media (max-width: 900px) {
    .ct-page { grid-template-columns: 1fr; padding: 120px 18px 60px; }
    .ct-grid { grid-template-columns: 1fr; gap: 0; }
    .ct-title { font-size: 30px; }
}


/* ==========================================================
   2026-09-29g 联系页：白底 + 信息卡一行一张 + 字号加大
   ========================================================== */
.ct-page {
    background: #fff;
}
.ct-cards { grid-template-columns: 1fr; gap: 18px; max-width: 460px; }
.ct-card { padding: 24px 26px; }
.ct-label { font-size: 14px; color: #8a93a3; margin-bottom: 10px; }
.ct-card p { font-size: 17.5px; color: #1f2937; line-height: 1.8; }
.ct-card .ct-hotline { font-size: 28px; letter-spacing: 1px; }
@media (max-width: 900px) {
    .ct-cards { max-width: none; }
    .ct-card p { font-size: 16px; }
    .ct-card .ct-hotline { font-size: 24px; }
}


/* ==========================================================
   2026-09-29h 联系页左右模块平行等高 + 页脚加公司地址
   ========================================================== */
/* —— 联系页：左右两栏顶底对齐（左列卡片弹性铺满） —— */
.ct-page { align-items: stretch; }
.ct-left { display: flex; flex-direction: column; }
.ct-left .ct-cards { flex: 1; }
.ct-left .ct-card { display: flex; flex-direction: column; justify-content: center; }
.ct-left .ct-card p { margin: 0; }

/* —— 页脚品牌块：公司地址 —— */
.footer-addr {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 14px 0 0;
    max-width: 300px;
}
.footer-addr .fh-label { color: #9ca3af; font-size: 13px; }
.footer-addr span:last-child {
    color: #374151;
    font-size: 14px;
    line-height: 1.8;
}
@media (max-width: 900px) {
    .footer-addr { max-width: none; }
}


/* —— 页脚品牌块：图标式联系信息（参考样式 20260929h） —— */
.footer-brand { max-width: 340px; }
.footer-contact {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.footer-contact li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #374151;
    font-size: 14.5px;
    line-height: 1.65;
}
.footer-contact .fc-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    margin-top: 3px;
    background: var(--accent, #e60012);
    -webkit-mask: var(--fc-mask) center/contain no-repeat;
    mask: var(--fc-mask) center/contain no-repeat;
}
.footer-contact .fc-icon-pin {
    --fc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E");
}
.footer-contact .fc-icon-mail {
    --fc-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
}
.footer-hotline .fh-label .fc-icon-headset {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 7px;
    background: var(--accent, #e60012);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a9 9 0 0 0-9 9v7a3 3 0 0 0 3 3h3v-8H5v-2a7 7 0 1 1 14 0v2h-4v8h3a3 3 0 0 0 3-3v-7a9 9 0 0 0-9-9z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a9 9 0 0 0-9 9v7a3 3 0 0 0 3 3h3v-8H5v-2a7 7 0 1 1 14 0v2h-4v8h3a3 3 0 0 0 3-3v-7a9 9 0 0 0-9-9z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.footer-hotline { margin: 0 0 16px; }
.footer-hotline strong { font-size: 30px; }
.footer-qrs { margin-top: 20px; }


/* —— 加入我们页：统一白底卡片风格（20260929i） —— */
.joinus-intro {
    max-width: 760px;
    margin: 0 auto 48px;
}
.joinus-intro .ji-lead {
    margin: 0 0 26px;
    text-align: center;
    font-size: 21px;
    font-weight: 700;
    color: #111827;
    letter-spacing: 2px;
}
.joinus-intro .ji-lead::after {
    content: "";
    display: block;
    width: 34px;
    height: 3px;
    border-radius: 2px;
    background: var(--accent, #e60012);
    margin: 14px auto 0;
}
.joinus-intro .ji-text {
    margin: 0;
    text-align: justify;
    color: #4b5563;
    font-size: 15.5px;
    line-height: 2.1;
}
.joinus-cards {
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.job-card {
    background: #fff;
    border: 1px solid #eef1f5;
    border-radius: 12px;
    box-shadow: 0 4px 18px rgba(17, 24, 39, .05);
    padding: 26px 30px 30px;
    transition: border-color .25s, box-shadow .25s, transform .25s;
}
.job-card:hover {
    border-color: #f3b8b8;
    box-shadow: 0 10px 26px rgba(17, 24, 39, .09);
    transform: translateY(-3px);
}
.job-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 14px;
    margin-bottom: 20px;
    border-bottom: 1px solid #eef1f5;
}
.job-head h4 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    padding-bottom: 8px;
    border-bottom: 3px solid var(--accent, #e60012);
}
.job-btn {
    display: inline-block;
    padding: 9px 26px;
    border-radius: 999px;
    background: var(--accent, #e60012);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: opacity .2s, transform .2s;
    white-space: nowrap;
}
.job-btn:hover { opacity: .88; transform: translateY(-1px); color: #fff; }
.job-body {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.job-col h5 {
    margin: 0 0 12px;
    font-size: 14.5px;
    font-weight: 700;
    color: #1f2937;
    padding-left: 9px;
    border-left: 3px solid var(--accent, #e60012);
    line-height: 1.4;
}
.job-col ul {
    margin: 0;
    padding-left: 18px;
    color: #4b5563;
    font-size: 13.5px;
    line-height: 1.9;
}
.job-col li { margin-bottom: 6px; }
@media (max-width: 900px) {
    .job-body { grid-template-columns: 1fr; }
    .job-card { padding: 20px 18px 24px; }
}


/* —— 首页领域卡：浅色顶部文字 + 深色底图（20260929q，按用户指定版式回归） —— */
.dm-card { background: #f5f7fa; }
.dm-card:hover { box-shadow: 0 22px 48px rgba(17, 24, 39, .12); }
/* 静止态：顶部白渐变压深色图，底部只留薄雾让图片透出 */
.dm-shade {
    background: linear-gradient(180deg,
        rgba(255, 255, 255, .96) 0%,
        rgba(255, 255, 255, .82) 22%,
        rgba(255, 255, 255, .12) 46%,
        rgba(255, 255, 255, 0) 62%,
        rgba(255, 255, 255, .38) 100%);
}
.dm-top { color: #111827; }
.dm-title { color: #111827; }
.dm-desc { color: #5b6472; }
/* 悬停展开方案清单时：整卡提亮，保证深色面板文字可读 */
.dm-card:hover .dm-shade {
    background: linear-gradient(180deg,
        rgba(255, 255, 255, .96) 0%,
        rgba(255, 255, 255, .88) 26%,
        rgba(255, 255, 255, .84) 55%,
        rgba(255, 255, 255, .94) 100%);
}
.dm-panel-head { color: #111827; }
.dm-panel-head span { color: #8a94a6; }
.dm-panel li { border-bottom: 1px solid rgba(17, 24, 39, .10); }
.dm-panel li a { color: #374151; }
.dm-panel li a:hover { color: var(--accent); }
.dm-panel-more { color: #6b7280; }
.dm-panel-more:hover { color: var(--accent); }
.dm-arrow {
    background: rgba(255, 255, 255, .9);
    border: 1px solid #e5e9f0;
    color: #374151;
}


/* —— 首页右侧悬浮咨询工具条（20260929r / 20260929s 紧贴右缘） —— */
.fab-wrap {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 90;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

.fab-stack {
    width: 62px;
    background: #fff;
    border-radius: 14px 0 0 14px;
    box-shadow: 0 12px 34px rgba(17, 24, 39, .14);
    overflow: visible;
}
.fab-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border: none;
    border-bottom: 1px solid #f0f2f5;
    background: transparent;
    color: #334155;
    cursor: pointer;
    text-decoration: none;
    transition: color .2s, background .2s;
}
.fab-btn:last-child { border-bottom: none; }
.fab-btn svg { width: 25px; height: 25px; }
.fab-btn:hover,
.fab-btn:focus-visible { color: var(--accent, #e60012); background: #f8fafc; }

/* 左弹面板（二维码 / 热线） */
.fab-panel {
    position: absolute;
    right: calc(100% + 16px);
    top: 50%;
    transform: translate(10px, -50%);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 14px 44px rgba(17, 24, 39, .18);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, transform .25s ease, visibility .25s;
    white-space: nowrap;
}
.fab-panel::after {
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    width: 12px;
    height: 12px;
    background: #fff;
    transform: translateY(-50%) rotate(45deg);
}
.fab-btn:hover .fab-panel,
.fab-btn:focus-within .fab-panel { opacity: 1; visibility: visible; transform: translate(0, -50%); }

.fab-qr-panel { padding: 20px 22px 6px; }
.fab-qr-item { text-align: center; margin-bottom: 14px; }
.fab-qr-item img {
    display: block;
    width: 130px;
    height: 130px;
    border-radius: 8px;
    border: 1px solid #eef1f5;
}
.fab-qr-item p { margin: 6px 0 0; font-size: 14px; color: #1f2937; }

.fab-tel-panel { padding: 20px 24px; }
.fab-tel-title { margin: 0 0 12px; font-size: 16.5px; font-weight: 800; color: #111827; }
.fab-tel-row { display: flex; align-items: center; gap: 12px; margin: 0; color: var(--accent, #e60012); }
.fab-tel-row svg { width: 26px; height: 26px; flex: none; }
.fab-tel-text { display: flex; flex-direction: column; line-height: 1.35; }
.fab-tel-text small { font-size: 12.5px; color: #8a94a6; }
.fab-tel-text strong { font-size: 19px; color: var(--accent, #e60012); letter-spacing: .5px; }

/* —— 在线咨询弹窗 —— */
.fab-modal { position: fixed; inset: 0; z-index: 120; display: none; }
.fab-modal.open { display: block; }
.fab-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .48);
}
.fab-modal-card {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, calc(100vw - 40px));
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    background: #fff;
    border-radius: 16px;
    padding: 30px 32px 28px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
    animation: fabPop .25s ease;
}
@keyframes fabPop {
    from { opacity: 0; transform: translate(-50%, -47%); }
    to { opacity: 1; transform: translate(-50%, -50%); }
}
.fab-modal-close {
    position: absolute;
    right: 14px;
    top: 12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #f3f5f8;
    color: #6b7280;
    font-size: 14px;
    cursor: pointer;
    transition: background .2s, color .2s;
}
.fab-modal-close:hover { background: var(--accent, #e60012); color: #fff; }

.fab-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.fab-field { min-width: 0; }
.fab-field.full { grid-column: 1 / -1; }
.fab-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 13.5px;
    font-weight: 700;
    color: #111827;
}
.fab-field label i { color: var(--accent, #e60012); font-style: normal; }
.fab-modal .form-control {
    display: block;
    width: 100%;
    background: #f3f5f8;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 14px;
    color: #111827;
    outline: none;
    transition: border-color .2s, background .2s;
}
.fab-modal .form-control:focus { border-color: var(--accent, #e60012); background: #fff; }
.fab-modal textarea.form-control { resize: vertical; min-height: 110px; }
.fab-error { margin: 5px 0 0; font-size: 12.5px; color: var(--accent, #e60012); min-height: 0; }
.fab-submit {
    grid-column: 1 / -1;
    margin-top: 6px;
    padding: 13px;
    border: none;
    border-radius: 999px;
    background: var(--accent, #e60012);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 4px;
    cursor: pointer;
    transition: filter .2s, transform .2s;
}
.fab-submit:hover { filter: brightness(1.08); transform: translateY(-1px); }

.fab-success { display: none; text-align: center; padding: 46px 0 40px; }
.fab-success-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #e8f7ee;
    color: #16a34a;
    font-size: 26px;
    margin-bottom: 14px;
}
.fab-success p { margin: 0; font-size: 16px; font-weight: 700; color: #111827; }

@media (max-width: 768px) {
    .fab-wrap { right: 0; gap: 10px; }
    .fab-stack { width: 52px; border-radius: 12px 0 0 12px; }
    .fab-btn { width: 52px; height: 52px; }
    .fab-btn svg { width: 22px; height: 22px; }
    /* 触屏没有 hover：面板改为点击展开由 focus-within 覆盖，弹层宽度收窄 */
    .fab-panel { right: calc(100% + 10px); }
    .fab-modal-card { padding: 24px 20px; }
    .fab-grid { grid-template-columns: 1fr; }
}