/* website_121 - 大卡片网格 + 数字动画 - 淘宝代购系统 */
:root {
    --primary: #1e3a8a;
    --primary-light: #3b82f6;
    --primary-dark: #1e40af;
    --accent: #0ea5e9;
    --dark: #0f172a;
    --gray-dark: #334155;
    --gray: #64748b;
    --gray-light: #94a3b8;
    --white: #ffffff;
    --bg-light: #f8fafc;
    --bg-lighter: #f1f5f9;
}

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

html {scroll-behavior:smooth;}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background: var(--white);
    color: var(--dark);
    line-height: 1.6;
}

a {text-decoration:none;color:inherit;transition:0.3s;}
ul {list-style:none;}

/* 导航栏 */
.nav121 {
    position:fixed;
    top:0;
    left:0;
    right:0;
    background: rgba(255,255,255,0.98);
    border-bottom:1px solid #e2e8f0;
    z-index:1000;
}

.nav-container121 {
    max-width:1280px;
    margin:0 auto;
    padding:0 40px;
    height:70px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.nav-logo121 {
    font-size:22px;
    font-weight:700;
    color:var(--primary);
    display:flex;
    align-items:center;
    gap:8px;
}

.nav-logo121 svg {width:32px;height:32px;}

.nav-menu121 {
    display:flex;
    gap:8px;
}

.nav-menu121 a {
    padding:10px 18px;
    font-size:14px;
    font-weight:500;
    color:var(--gray-dark);
    border-radius:6px;
    transition:0.2s;
}

.nav-menu121 a:hover,
.nav-menu121 a.active {
    background:var(--primary);
    color:var(--white);
}

.nav-btn121 {
    background:var(--primary);
    color:var(--white);
    padding:10px 24px;
    border-radius:6px;
    font-size:14px;
    font-weight:600;
}

.nav-btn121:hover {background:var(--primary-dark);}

.mobile-toggle121 {
    display:none;
    flex-direction:column;
    gap:5px;
    background:none;
    border:none;
    cursor:pointer;
    padding:5px;
}

.mobile-toggle121 span {
    width:24px;
    height:2px;
    background:var(--dark);
    transition:0.3s;
}

/* Hero区域 */
.hero121 {
    min-height:100vh;
    padding:120px 40px 80px;
    background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 50%, #1e3a8a 100%);
    position:relative;
    overflow:hidden;
}

.hero121::before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.hero-container121 {
    max-width:1280px;
    margin:0 auto;
    position:relative;
    z-index:1;
}

.hero-grid121 {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.hero-content121 h1 {
    font-size:48px;
    font-weight:800;
    color:var(--white);
    line-height:1.2;
    margin-bottom:24px;
}

.hero-content121 p {
    font-size:18px;
    color:rgba(255,255,255,0.85);
    margin-bottom:32px;
    line-height:1.8;
}

.hero-actions121 {
    display:flex;
    gap:16px;
}

.btn-primary121 {
    background:var(--white);
    color:var(--primary);
    padding:14px 32px;
    border-radius:8px;
    font-weight:600;
    font-size:15px;
}

.btn-secondary121 {
    background:transparent;
    color:var(--white);
    padding:14px 32px;
    border-radius:8px;
    font-weight:600;
    font-size:15px;
    border:2px solid rgba(255,255,255,0.4);
}

.hero-stats121 {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.stat-card121 {
    background:rgba(255,255,255,0.1);
    backdrop-filter:blur(10px);
    border-radius:12px;
    padding:28px;
    text-align:center;
    border:1px solid rgba(255,255,255,0.15);
}

.stat-number121 {
    font-size:42px;
    font-weight:800;
    color:var(--white);
    display:block;
}

.stat-suffix121 {font-size:28px;}

.stat-label121 {
    font-size:14px;
    color:rgba(255,255,255,0.7);
    margin-top:8px;
    display:block;
}

/* 大卡片模块 */
.module121 {
    padding:100px 40px;
}

.module-container121 {
    max-width:1280px;
    margin:0 auto;
}

.module-header121 {
    text-align:center;
    margin-bottom:60px;
}

.module-header121 h2 {
    font-size:36px;
    font-weight:700;
    color:var(--dark);
    margin-bottom:12px;
}

.module-header121 p {
    font-size:16px;
    color:var(--gray);
}

/* 功能卡片网格 */
.features-grid121 {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.feature-card121 {
    background:var(--white);
    border-radius:16px;
    padding:40px 32px;
    border:1px solid #e2e8f0;
    transition:0.3s;
    position:relative;
    overflow:hidden;
}

.feature-card121::before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:4px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    transform:scaleX(0);
    transition:0.3s;
}

.feature-card121:hover::before {
    transform:scaleX(1);
}

.feature-card121:hover {
    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(30,58,138,0.1);
}

.feature-icon121 {
    width:56px;
    height:56px;
    background:linear-gradient(135deg, var(--primary), var(--accent));
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:24px;
}

.feature-icon121 svg {
    width:28px;
    height:28px;
    color:var(--white);
}

.feature-card121 h3 {
    font-size:20px;
    font-weight:700;
    color:var(--dark);
    margin-bottom:12px;
}

.feature-card121 p {
    font-size:14px;
    color:var(--gray);
    line-height:1.7;
}

/* 统计数据区 */
.stats-section121 {
    background:var(--dark);
    padding:80px 40px;
}

.stats-grid121 {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:40px;
    max-width:1200px;
    margin:0 auto;
    text-align:center;
}

.stat-item121 {
    display:flex;
    flex-direction:column;
    align-items:center;
}

.stat-value121 {
    font-size:56px;
    font-weight:800;
    color:var(--white);
    line-height:1;
}

.stat-desc121 {
    font-size:14px;
    color:rgba(255,255,255,0.6);
    margin-top:12px;
}

/* 流程步骤 */
.process-section121 {
    background:var(--bg-light);
}

.process-grid121 {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
}

.process-card121 {
    background:var(--white);
    border-radius:16px;
    padding:40px 28px;
    text-align:center;
    position:relative;
}

.process-num121 {
    width:60px;
    height:60px;
    background:var(--primary);
    color:var(--white);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    font-weight:800;
    margin:0 auto 24px;
}

.process-card121 h3 {
    font-size:18px;
    font-weight:700;
    color:var(--dark);
    margin-bottom:12px;
}

.process-card121 p {
    font-size:14px;
    color:var(--gray);
    line-height:1.6;
}

/* 服务内容 */
.service-section121 {
    background:var(--white);
}

.service-grid121 {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

.service-item121 {
    background:var(--bg-light);
    border-radius:12px;
    padding:32px 24px;
    text-align:center;
    transition:0.3s;
}

.service-item121:hover {
    background:var(--primary);
}

.service-item121:hover svg,
.service-item121:hover h3,
.service-item121:hover p {
    color:var(--white);
}

.service-icon121 {
    width:48px;
    height:48px;
    color:var(--primary);
    margin:0 auto 16px;
}

.service-item121 h3 {
    font-size:16px;
    font-weight:600;
    color:var(--dark);
    margin-bottom:8px;
}

.service-item121 p {
    font-size:13px;
    color:var(--gray);
}

/* 客户评价 */
.review-section121 {
    background:var(--bg-light);
}

.review-grid121 {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.review-card121 {
    background:var(--white);
    border-radius:16px;
    padding:36px;
    border:1px solid #e2e8f0;
}

.review-quote121 {
    font-size:48px;
    color:var(--primary);
    opacity:0.3;
    line-height:1;
}

.review-card121 p {
    font-size:15px;
    color:var(--gray-dark);
    line-height:1.8;
    margin:16px 0 24px;
}

.review-author121 {
    font-size:14px;
    color:var(--dark);
    font-weight:600;
}

/* 联系我们 */
.contact-section121 {
    background:var(--white);
}

.contact-grid121 {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    max-width:1000px;
    margin:0 auto;
}

.contact-card121 {
    background:var(--bg-light);
    border-radius:16px;
    padding:40px 32px;
    text-align:center;
    border:1px solid #e2e8f0;
}

.contact-icon121 {
    width:60px;
    height:60px;
    background:linear-gradient(135deg, var(--primary), var(--accent));
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 20px;
}

.contact-icon121 svg {
    width:28px;
    height:28px;
    color:var(--white);
}

.contact-card121 h3 {
    font-size:16px;
    font-weight:600;
    color:var(--dark);
    margin-bottom:8px;
}

.contact-card121 p {
    font-size:18px;
    color:var(--primary);
    font-weight:600;
}

/* 页脚 */
.footer121 {
    background:var(--dark);
    color:var(--white);
    padding:60px 40px 30px;
}

.footer-container121 {
    max-width:1280px;
    margin:0 auto;
}

.footer-main121 {
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:60px;
    margin-bottom:40px;
}

.footer-brand121 h3 {
    font-size:24px;
    font-weight:700;
    margin-bottom:16px;
    color:var(--white);
}

.footer-brand121 p {
    font-size:14px;
    color:rgba(255,255,255,0.6);
    line-height:1.7;
}

.footer-links121 h4 {
    font-size:14px;
    font-weight:600;
    margin-bottom:20px;
    color:var(--white);
}

.footer-links121 ul li {
    margin-bottom:12px;
}

.footer-links121 a {
    font-size:14px;
    color:rgba(255,255,255,0.6);
}

.footer-links121 a:hover {color:var(--white);}

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

.footer-bottom121 p {
    font-size:13px;
    color:rgba(255,255,255,0.4);
}

/* 响应式 */
@media (max-width:1024px) {
    .hero-grid121 {grid-template-columns:1fr;text-align:center;}
    .hero-actions121 {justify-content:center;}
    .hero-stats121 {grid-template-columns:repeat(2,1fr);}
    .features-grid121 {grid-template-columns:repeat(2,1fr);}
    .process-grid121 {grid-template-columns:repeat(2,1fr);}
    .service-grid121 {grid-template-columns:repeat(2,1fr);}
    .review-grid121 {grid-template-columns:1fr;}
    .footer-main121 {grid-template-columns:1fr 1fr;}
}

@media (max-width:768px) {
    .nav-menu121 {display:none;}
    .nav-btn121 {display:none;}
    .mobile-toggle121 {display:flex;}
    .hero121 {padding:100px 20px 60px;}
    .hero-content121 h1 {font-size:32px;}
    .hero-stats121 {grid-template-columns:1fr;}
    .features-grid121,
    .process-grid121,
    .service-grid121,
    .contact-grid121,
    .stats-grid121 {grid-template-columns:1fr;}
    .module121 {padding:70px 20px;}
    .footer-main121 {grid-template-columns:1fr;gap:40px;text-align:center;}
}
