﻿:root{--primary-color: #4f46e5;--primary-light: #818cf8;--primary-dark: #3730a3;--secondary-color: #ec4899;--dark-color: #1e293b;--light-color: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--success-color: #10b981;--warning-color: #f59e0b;--danger-color: #ef4444;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);--radius-sm: 0.25rem;--radius-md: 0.375rem;--radius-lg: 0.5rem;--radius-xl: 0.75rem;--radius-2xl: 1rem;--transition: all 0.3s ease;}

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

body{font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;line-height: 1.6;color: var(--gray-800);background-color: var(--light-color);}

/* 容器*/.container{width: 100%;max-width: 1200px;margin: 0 auto;padding: 16px 0;}

/* 文本中心对齐*/.text-center{text-align: center;}

/* 渐变背景*/.gradient-bg{background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));color: white;}

/* 按钮样式*/.btn{display: inline-block;padding: 0.75rem 1.5rem;font-weight: 600;font-size: 1rem;border-radius: var(--radius-md);text-decoration: none;transition: var(--transition);cursor: pointer;border: none;outline: none;}

.btn-primary{background-color: var(--primary-color);color: white;box-shadow: var(--shadow-md);}

.btn-primary:hover{background-color: var(--primary-dark);transform: translateY(-2px);box-shadow: var(--shadow-lg);}

.btn-outline{background-color: transparent;color: var(--primary-color);border: 2px solid var(--primary-color);}

.btn-outline:hover{background-color: var(--primary-color);color: white;}

/* 部分标题*/.section-header{margin-bottom: 3rem;}

.section-title{font-size: 2.5rem;font-weight: 800;color: var(--gray-900);margin-bottom: 1rem;position: relative;}

.section-title::after{content: '';position: absolute;bottom: -10px;left: 50%;transform: translateX(-50%);width: 60px;height: 4px;background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));border-radius: 2px;}

.section-desc{font-size: 1.125rem;color: var(--gray-600);max-width: 700px;margin: 0 auto;}

/* 英雄区域*/.hero{padding: 150px 0 100px;

                background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));

            position: relative;

            overflow: hidden;

            margin-top: 80px;

            color: var(--white);}

.hero-container{display: flex;align-items: center;gap: 3rem;}

.hero-content{flex: 1;}

.hero-image{flex: 1;}

.hero-badge{display: inline-block;background-color: rgba(79, 70, 229, 0.7);color: #fff;padding: 0.5rem 1rem;border-radius: 9999px;font-size: 0.875rem;font-weight: 600;margin-bottom: 1.5rem;}

.hero-title{font-size: 3.5rem;font-weight: 800;line-height: 1.2;color: var(--gray-900);margin-bottom: 1.5rem;}

.hero-title span{background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));-webkit-background-clip: text;background-clip: text;color: transparent;}

.hero-desc{font-size: 1.25rem;color: var(--gray-600);margin-bottom: 2rem;max-width: 500px;}

.hero-actions{display: flex;gap: 1rem;margin-bottom: 2rem;}

.hero-stats{display: flex;gap: 3rem;}

.stat-item{text-align: center;}

.stat-number{display: block;font-size: 1.5rem;font-weight: 700;color:#fff;margin-bottom: 0.25rem;}

.stat-text{font-size: 0.875rem;color:#fff;}

.hero-image-wrapper{position: relative;}

.hero-main-image{width: 100%;height: auto;}

.hero-main-image:hover{transform: scale(1.02);}

.hero-glow{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 120%;height: 120%;background: radial-gradient(circle, rgba(79, 70, 229, 0.2) 0%, rgba(236, 72, 153, 0.1) 100%);border-radius: 50%;z-index: -1;}

.hero-wave{position: absolute;bottom: 0;left: 0;width: 100%;height: 100px;background-position: center;background-repeat: no-repeat;}

/* 品牌信任*/.ff-trust{background-color: white;padding: 4rem 0;}

.ff-trust-text{text-align: center;font-size: 0.875rem;color: var(--gray-500);margin-bottom: 2rem;text-transform: uppercase;letter-spacing: 0.1em;}

.ff-logos{display: flex;justify-content: center;align-items: center;gap: 4rem;flex-wrap: wrap;}

.ff-logo{display: flex;align-items: center;gap: 0.5rem;font-size: 1.25rem;color: var(--gray-600);font-weight: 500;transition: var(--transition);}

.ff-logo i{color: var(--primary-color);font-size: 1.5rem;}

.ff-logo:hover{color: var(--primary-color);transform: translateY(-2px);}

/* 产品特性*/.features{background-color: var(--gray-100);padding: 8rem 0;}

.features-grid{display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 2rem;}

.feature-card{background-color: white;padding: 2rem;border-radius: var(--radius-xl);box-shadow: var(--shadow-md);transition: var(--transition);border-top: 4px solid var(--primary-color);}

.feature-card.hover-lift:hover{transform: translateY(-10px);box-shadow: var(--shadow-xl);}

.feature-icon{width: 64px;height: 64px;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin-bottom: 1.5rem;font-size: 1.5rem;}

.feature-title{font-size: 1.25rem;font-weight: 700;color: var(--gray-900);margin-bottom: 1rem;}

.feature-desc{color: var(--gray-600);font-size: 1rem;}

/* 安全技术*/.security{background-color: white;padding: 8rem 0;}

.ffg-container{display: flex;align-items: center;gap: 5rem;}

.ffg-features{flex: 1;}

.ffg-visual{flex: 1;}

.ffg-item{display: flex;gap: 1.5rem;align-items: flex-start;margin-bottom: 2rem;padding: 1.5rem;background-color: var(--gray-100);border-radius: var(--radius-lg);transition: var(--transition);}

.ffg-item:hover{transform: translateX(5px);background-color: var(--gray-200);}

.ffg-icon{flex-shrink: 0;width: 60px;height: 60px;border-radius: 50%;background-color: white;display: flex;align-items: center;justify-content: center;box-shadow: var(--shadow-md);}

.ffg-icon-inner{width: 48px;height: 48px;border-radius: 50%;background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));display: flex;align-items: center;justify-content: center;color: white;font-size: 1.25rem;}

.ffg-content h3{font-size: 1.25rem;font-weight: 700;color: var(--gray-900);margin-bottom: 0.5rem;}

.ffg-content p{color: var(--gray-600);font-size: 1rem;}

.ffg-visual-inner{position: relative;display: flex;align-items: center;justify-content: center;height: 400px;}

.ffg-shield{font-size: 12rem;color: var(--primary-color);opacity: 0.1;position: relative;z-index: 1;}

.ffg-circles{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}

.circle{position: absolute;border-radius: 50%;border: 2px dashed var(--primary-light);animation: rotate 20s linear infinite;}

.circle-1{width: 300px;height: 300px;top: -150px;left: -150px;animation-duration: 30s;}

.circle-2{width: 200px;height: 200px;top: -100px;left: -100px;animation-duration: 20s;animation-direction: reverse;}

.circle-3{width: 100px;height: 100px;top: -50px;left: -50px;animation-duration: 10s;}

@keyframes rotate{from{transform: rotate(0deg);}

to{transform: rotate(360deg);}}

/* 客户评价*/.testimonials{background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));padding: 8rem 0;color: white;}

.testimonials .section-title{color: white;}

.testimonials .section-title::after{background: linear-gradient(90deg, white, rgba(255, 255, 255, 0.5));}

.testimonials .section-desc{color: rgba(255, 255, 255, 0.8);}

.testimonials-slider{display: flex;gap: 2rem;overflow-x: auto;padding: 2rem 0;scroll-behavior: smooth;scrollbar-width: none;}

.testimonials-slider::-webkit-scrollbar{display: none;}

.ttx-card{min-width: 350px;background-color: rgba(255, 255, 255, 0.1);backdrop-filter: blur(10px);padding: 2rem;border-radius: var(--radius-xl);border: 1px solid rgba(255, 255, 255, 0.2);transition: var(--transition);}

.ttx-card:hover{transform: translateY(-5px);background-color: rgba(255, 255, 255, 0.15);}

.ttx-header{display: flex;align-items: center;gap: 1rem;margin-bottom: 1.5rem;}

.ttx-avatar{width: 60px;height: 60px;border-radius: 50%;overflow: hidden;border: 3px solid white;}

.ttx-avatar img{width: 100%;height: 100%;object-fit: cover;}

.ttx-info h4{font-size: 1.125rem;font-weight: 700;margin-bottom: 0.25rem;}

.ttx-info p{font-size: 0.875rem;color: rgba(255, 255, 255, 0.7);}

.ttx-rating{margin-left: auto;}

.ttx-rating i{color: #fbbf24;font-size: 1rem;}

.ttx-content{font-size: 1rem;line-height: 1.6;color: rgba(255, 255, 255, 0.9);}

.ttx-indicators{display: flex;justify-content: center;gap: 0.5rem;margin-top: 2rem;}

.indicator{width: 12px;height: 12px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.3);border: none;cursor: pointer;transition: var(--transition);}

.indicator.active{background-color: white;width: 24px;border-radius: 6px;}

.pagination {

    display: table;

    padding-left: 0;

    margin: 20px auto;

    border-radius: 4px; }

.pagination > li {

    display: inline; }

.pagination > li > a,

.pagination > li > span {

    position: relative;

    float: left;

    padding: 6px 12px;

    line-height: 1.42857;

    text-decoration: none;

    color: #333;

    background-color: #fff;

    border: 1px solid #ddd;

    margin-left: -1px; }

.pagination > li:first-child > a,

.pagination > li:first-child > span {

    margin-left: 0;

    border-bottom-left-radius: 4px;

    border-top-left-radius: 4px; }

.pagination > li:last-child > a,

.pagination > li:last-child > span {

    border-bottom-right-radius: 4px;

    border-top-right-radius: 4px; }

.pagination > li > a:hover, .pagination > li > a:focus,

.pagination > li > span:hover,

.pagination > li > span:focus {

    z-index: 2;

    color: #333;

    background-color: #eeeeee;

    border-color: #ddd; }

.pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > a:focus,

.pagination > .active > span,

.pagination > .active > span:hover,

.pagination > .active > span:focus {

    z-index: 3;

    color: #fff;

    background-color: #165DFF;

    border-color: #165DFF;

    cursor: default; }

/* 常见问题*/

.h40{ height:40px;}

.articles{background-color: var(--gray-100);padding: 5rem 0;}

.section-header{margin-bottom: 3rem;text-align: center;}

.section-title{font-size: 2.5rem;font-weight: 700;color: var(--gray-900);margin-bottom: 1rem;}

.section-desc{font-size: 1.125rem;color: var(--gray-600);max-width: 600px;margin: 0 auto;}

.articles-grid{display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1rem;}

.article-card{background-color: white;border-radius: var(--radius-lg);overflow: hidden;box-shadow: var(--shadow-md);transition: var(--transition);height: 100%;display: flex;flex-direction: column;}

.article-card:hover{transform: translateY(-5px);box-shadow: var(--shadow-lg);}

.article-image{height: 200px;overflow: hidden;}

.article-image img{width: 100%;height: 100%;object-fit: cover;transition: var(--transition);}

.article-card:hover .article-image img{transform: scale(1.05);}

.article-content{padding: 1rem;flex-grow: 1;display: flex;flex-direction: column;}

.article-title{font-size: 1rem;font-weight: 600;color: var(--gray-900);margin-bottom: 0.55rem;line-height: 1.4;}

.article-title a{color: var(--gray-900);}

.article-desc{color: var(--gray-600);margin-bottom: 1rem;flex-grow: 1; font-size:0.8rem;}

.article-meta{display: flex;justify-content: space-between;align-items: center;margin-top: auto;padding-top: 0.8rem;border-top: 1px solid var(--gray-200);font-size: 0.875rem;color: var(--gray-600);}

.article-category{background-color: var(--primary-color);color: white;padding: 0.25rem 0.75rem;border-radius: 20px;font-size: 0.75rem;font-weight: 500;}
.article-category a{ color:#FFF}
.btn{display: inline-block;background-color: var(--primary-color);color: white;padding: 0.75rem 1.5rem;border-radius: var(--radius-lg);text-decoration: none;font-weight: 500;transition: var(--transition);border: none;cursor: pointer;}

.btn:hover{background-color: #3a5ce5;transform: translateY(-2px);}

.text-center{text-align: center;}

.mt-4{margin-top: 2rem;}

@media (max-width: 768px){

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

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

.h40{ height:10px;}

}

.wz_article-detail{padding: 3rem 0;}

.wz_article-header{margin-bottom: 2rem;padding-bottom: 1.5rem;border-bottom: 1px solid var(--wz-gray-200); margin-top:2rem;}

.wz_article-title{font-size: 2rem;font-weight: 700;color: var(--wz-gray-900);margin-bottom: 1rem;line-height: 1.3;}

.wz_article-meta{display: flex;align-items: center;gap: 1.5rem;color: var(--wz-gray-600);font-size: 0.9rem;}

.wz_meta-item{display: flex;align-items: center;gap: 0.5rem;}

.wz_article-content{background-color: white;border-radius: var(--wz-radius-lg);padding: 2.5rem;box-shadow: var(--wz-shadow-md);margin-bottom: 3rem;}

.wz_content-section{margin-bottom: 2rem;}

.wz_content-section h2{font-size: 1.5rem;font-weight: 600;color: var(--wz-gray-900);margin-bottom: 1rem;padding-bottom: 0.5rem;border-bottom: 1px solid var(--wz-gray-200);}

.wz_content-section p{margin-bottom: 1rem;}

.wz_content-section ul, .wz_content-section ol{margin-bottom: 1rem;padding-left: 1.5rem;}

.wz_content-section li{margin-bottom: 0.5rem;}

.wz_article-navigation{display: flex;justify-content: space-between;margin-bottom: 3rem;}

.wz_nav-btn{display: flex;align-items: center;gap: 0.5rem;padding: 0.75rem 1.5rem;background-color: white;border-radius: var(--wz-radius-lg);text-decoration: none;color: var(--wz-gray-700);font-weight: 500;box-shadow: var(--wz-shadow-md);transition: var(--wz-transition);max-width: 45%;}

.wz_nav-btn.wz_prev{text-align: left;}

.wz_nav-btn.wz_next{text-align: right;flex-direction: row-reverse;}

.wz_recommended-articles{margin-bottom: 3rem;}

.wz_section-title{font-size: 1.75rem;font-weight: 600;color: var(--wz-gray-900);margin-bottom: 1.5rem;padding-bottom: 0.5rem;border-bottom: 2px solid var(--wz-primary-color);}

.wz_articles-grid{display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 1.5rem;}

.wz_article-card{background-color: white;border-radius: var(--wz-radius-lg);overflow: hidden;box-shadow: var(--wz-shadow-md);transition: var(--wz-transition);height: 100%;display: flex;flex-direction: column;}

.wz_article-card:hover{transform: translateY(-5px);box-shadow: var(--wz-shadow-lg);}

.wz_article-image{height: 160px;overflow: hidden;}

.wz_article-image img{width: 100%;height: 100%;object-fit: cover;transition: var(--wz-transition);}

.wz_article-card:hover .wz_article-image img{transform: scale(1.05);}

.wz_article-card-content{padding: 1.25rem;flex-grow: 1;display: flex;flex-direction: column;}

.wz_article-card-title{font-size: 1rem;font-weight: 600;color: var(--wz-gray-900);margin-bottom: 0.75rem;line-height: 1.4;}

.wz_article-card-title a{color: var(--wz-gray-900);}

.wz_article-card-meta{display: flex;justify-content: space-between;align-items: center;margin-top: auto;border-top: 1px solid var(--wz-gray-200);font-size: 0.8rem;color: var(--wz-gray-600);}

.wz_article-category{background-color: var(--wz-primary-color);color: white;padding: 0.2rem 0.6rem;border-radius: 20px;font-size: 0.7rem;font-weight: 500;}

 @media (max-width: 768px){

.wz_article-title{font-size:1.5rem;}

.wz_article-content{padding: 1.5rem;}

.wz_article-navigation{flex-direction: column;gap: 1rem;}

.wz_nav-btn{max-width: 100%;}

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

}

/* 下载区域*/

.download{background-color: white;padding: 8rem 0;}

.download-inner{display: flex;align-items: center;gap: 3rem;background: linear-gradient(135deg, var(--gray-100), var(--gray-200));padding: 3rem;border-radius: var(--radius-2xl);box-shadow: var(--shadow-lg);}

.download-content{flex: 1;}

.download-image{flex: 1;}

.download-title{font-size: 2.5rem;font-weight: 800;color: var(--gray-900);margin-bottom: 1rem;}

.download-desc{font-size: 1.125rem;color: var(--gray-600);margin-bottom: 2rem;}

.download-buttons{display: flex;flex-wrap: wrap;gap: 1rem;}

.download-btn{display: flex;align-items: center;gap: 0.75rem;background-color: white;color: var(--gray-900);padding: 0.75rem 1.25rem;border-radius: var(--radius-lg);text-decoration: none;box-shadow: var(--shadow-sm);transition: var(--transition);}

.download-btn:hover{transform: translateY(-2px);box-shadow: var(--shadow-md);}

.download-btn i{font-size: 1.5rem;color: var(--primary-color);}

.download-btn-text{display: flex;flex-direction: column; width:100px;}

.download-btn-subtitle{font-size: 0.75rem;color: var(--gray-500);}

.download-btn-title{font-size: 1rem;font-weight: 600;color: var(--gray-900);}

.download-image img{width: 100%;height: auto;border-radius: var(--radius-lg);box-shadow: var(--shadow-lg);}

/* 页脚*/footer{background-color: var(--gray-900);color: white;padding: 5rem 0 2rem;}

.footer-main{display: flex;justify-content: space-between;gap: 25rem;margin-bottom: 3rem;}

.footer-brand{flex: 1;max-width: 300px;}

.footer-links-grid{flex: 2;display: grid;grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 2rem;}

.footer-logo{display: flex;align-items: center;gap: 0.75rem;margin-bottom: 1rem;}

.footer-logo img{width: 40px;height: 40px;border-radius: 50%;}

.footer-logo-text{font-size: 1.5rem;font-weight: 700;}

.footer-desc{color: rgba(255, 255, 255, 0.7);margin-bottom: 1.5rem;font-size: 1rem;}

.social-links{display: flex;gap: 1rem;}

.social-link{display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.1);color: white;text-decoration: none;transition: var(--transition);}

.social-link:hover{background-color: var(--primary-color);transform: translateY(-2px);}

.footer-title{font-size: 1.125rem;font-weight: 700;margin-bottom: 1rem;}

.footer-links{list-style: none;}

.footer-links li{margin-bottom: 0.5rem;}

.footer-links a{color: rgba(255, 255, 255, 0.7);text-decoration: none;transition: var(--transition);display: block;padding: 0.25rem 0;}

.footer-links a:hover{color: white;transform: translateX(5px);}

.contact-info{list-style: none;}

.contact-info li{display: flex;align-items: center;gap: 0.75rem;margin-bottom: 0.75rem;color: rgba(255, 255, 255, 0.7);}

.contact-info i{color: var(--primary-color);}

.footer-bottom{padding-top: 1rem;border-top: 1px solid rgba(255, 255, 255, 0.1); text-align:center;}

.copyright-links{display: flex;gap: 1.5rem;flex-wrap: wrap;}

.copyright-links a{color: rgba(255, 255, 255, 0.7);text-decoration: none;font-size: 0.875rem;transition: var(--transition);}

.copyright-links a:hover{color: white;}

footer .copyright{font-size: 0.875rem;color: rgba(255, 255, 255, 0.5);}

/* 响应式设计*/@media (max-width: 1200px){.hero-title{font-size: 3rem;}

.ffg-container{gap: 3rem;}}

@media (max-width: 992px){.hero-container{flex-direction: column;text-align: center;}

.hero-stats{justify-content: center;}

.ffg-container{flex-direction: column;text-align: center;}

.ffg-item{flex-direction: column;text-align: center;align-items: center;}

.download-inner{flex-direction: column;text-align: center;}

.download-buttons{justify-content: center;}

.footer-main{flex-direction: column;gap: 0rem;}

.footer-brand{max-width: 100%;}}

@media (max-width: 768px){.section-title{font-size: 2rem;}

.hero{padding: 6rem 0 4rem;}

.hero-title{font-size: 2.5rem;}

.features, .security, .testimonials, .faq, .download{padding: 6rem 0;}

.ff-logos{gap: 2rem;}

.ttx-card{min-width: 100%;}

.download-title{font-size: 2rem;}

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

.footer-bottom{flex-direction: column;text-align: center;}}

@media (max-width: 576px){.hero-title{font-size: 2rem;}

.hero-actions{flex-direction: column;}

.hero-stats{flex-direction: column;gap: 1rem;}

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

.download-inner{padding: 2rem;}

.download-buttons{flex-direction: column;}}