:root{
    --sp-navy:#0a1730;--sp-blue:#2563eb;--sp-cyan:#22d3ee;
    --sp-grad:linear-gradient(120deg,#2563eb 0%,#4f7cf6 45%,#22d3ee 100%);
    --sp-grad-soft:linear-gradient(135deg,#dbe7ff 0%,#d7f4fb 100%);
    --sp-ink:#0f1b34;--sp-muted:#5b6b8c;--sp-line:rgba(37,99,235,.12);
    --sp-card:#fff;--sp-soft:#f4f7fd;
    --sp-shadow:0 18px 40px rgba(16,38,76,.08);
    --sp-shadow-lg:0 30px 60px rgba(37,99,235,.18);
    --sp-radius:20px;
}
*{box-sizing:border-box;}
.sp-page{font-family:"微软雅黑","Microsoft YaHei",sans-serif;color:var(--sp-ink);background:#fff;overflow-x:hidden;}
.sp-page .wrap{width:100%;padding:0 24px;}

/* ===== HERO ===== */
.sp-hero{position:relative;padding:96px 0 110px;background:radial-gradient(1200px 620px at 12% 0,#13275c 0,transparent 60%),radial-gradient(1000px 520px at 92% 100%,#0b1c44 0,transparent 55%),var(--sp-navy);overflow:hidden;}
.sp-hero-bg{position:absolute;inset:0;pointer-events:none;}
.sp-orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;}
.sp-hero .o1{width:420px;height:420px;background:#2563eb;top:-120px;right:-80px;}
.sp-hero .o2{width:340px;height:340px;background:#22d3ee;bottom:-140px;left:-60px;opacity:.4;}
.sp-hero .o3{width:260px;height:260px;background:#7c3aed;top:40%;left:46%;opacity:.28;}
.sp-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle at 50% 40%,#000,transparent 75%);}
.sp-hero-inner{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
.sp-hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#cfe3ff;font-size:13px;font-weight:700;backdrop-filter:blur(6px);}
.sp-hero-badge i{color:var(--sp-cyan);}
.sp-hero-copy h1{margin:22px 0 0;font-size:clamp(34px,4.4vw,56px);font-weight:900;line-height:1.12;letter-spacing:-.5px;color:#fff;}
.sp-hero-copy .hl{background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.sp-hero-desc{margin:22px 0 0;font-size:16px;line-height:1.9;color:rgba(214,226,250,.78);max-width:520px;}
.sp-hero-feats{display:flex;flex-wrap:wrap;gap:10px 22px;margin:28px 0 0;}
.sp-hero-feat{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#e7eefc;font-weight:600;}
.sp-hero-feat i{width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--sp-grad);color:#fff;font-size:10px;}
.sp-hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:34px 0 0;}
.sp-btn{display:inline-flex;align-items:center;gap:10px;padding:15px 30px;border-radius:999px;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:.35s cubic-bezier(.2,.7,.2,1);}
.sp-btn-primary{background:var(--sp-grad);color:#fff;box-shadow:0 16px 34px rgba(37,99,235,.42);}
.sp-btn-primary:hover{transform:translateY(-3px);box-shadow:0 22px 44px rgba(37,99,235,.55);}
.sp-btn-ghost{background:rgba(255,255,255,.06);color:#e7eefc;border:1px solid rgba(255,255,255,.22);}
.sp-btn-ghost:hover{background:rgba(255,255,255,.14);transform:translateY(-3px);}
.sp-hero-stats{display:flex;gap:34px;margin:40px 0 0;padding-top:28px;border-top:1px solid rgba(255,255,255,.12);}
.sp-gs b{display:block;font-size:30px;font-weight:900;color:#fff;line-height:1;background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.sp-gs span{display:block;margin-top:8px;font-size:13px;color:rgba(214,226,250,.66);}

/* glass mockup */
.sp-hero-visual{position:relative;}
.sp-glass{position:relative;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:22px;padding:18px;backdrop-filter:blur(14px);box-shadow:0 30px 70px rgba(0,0,0,.35);}
.sp-glass-top{display:flex;align-items:center;gap:7px;padding-bottom:12px;}
.sp-glass-top .d{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.3);}
.sp-glass-top b{margin-left:auto;font-size:12px;color:rgba(207,227,255,.7);letter-spacing:.5px;}
.sp-glass-screen{border-radius:14px;overflow:hidden;background:#0d1c3a;border:1px solid rgba(255,255,255,.08);}
.sp-glass-screen img{display:block;width:100%;height:auto;}
.sp-glass-row{display:flex;align-items:center;gap:10px;padding:11px 6px 0;font-size:13px;color:rgba(220,232,255,.82);}
.sp-glass-row i{width:28px;height:28px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:var(--sp-grad);color:#fff;font-size:13px;flex:none;}
.sp-float-card{position:absolute;display:flex;align-items:center;gap:10px;background:#fff;border-radius:14px;padding:10px 14px;box-shadow:0 16px 34px rgba(8,20,46,.28);animation:spFloat 5s ease-in-out infinite;}
.sp-float-card strong{display:block;font-size:13.5px;font-weight:800;color:var(--sp-ink);}
.sp-float-card span{display:block;font-size:11.5px;color:var(--sp-muted);}
.sp-fc-ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:var(--sp-grad);color:#fff;font-size:17px;flex:none;}
.sp-float-card.c1{top:-22px;left:-26px;animation-delay:0s;}
.sp-float-card.c2{bottom:64px;right:-34px;animation-delay:1.4s;}
.sp-float-card.c3{bottom:-22px;left:30px;animation-delay:2.6s;}
@keyframes spFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}

/* ===== 服务类型标签 ===== */
.sp-tags{position:relative;z-index:2;margin-top:-30px;background:transparent;}
.sp-tags-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:16px;padding:14px 18px;box-shadow:var(--sp-shadow);}
.sp-tag{padding:9px 18px;border-radius:999px;font-size:14px;font-weight:600;color:var(--sp-muted);text-decoration:none;background:var(--sp-soft);transition:.3s;}
.sp-tag:hover{color:var(--sp-blue);background:#eaf1ff;}
.sp-tag.active{background:var(--sp-grad);color:#fff;box-shadow:0 10px 22px rgba(37,99,235,.32);}

/* ===== 通用区块 ===== */
.sp-sec{padding:96px 0;position:relative;}
.sp-sec.soft{background:var(--sp-soft);}
.sp-head{max-width:760px;margin:0 auto 52px;text-align:center;}
.sp-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:var(--sp-blue);margin-bottom:14px;}
.sp-eyebrow::before,.sp-eyebrow::after{content:'';width:26px;height:2px;background:var(--sp-grad);border-radius:2px;}
.sp-head h2{font-size:clamp(28px,3.6vw,42px);font-weight:900;line-height:1.2;margin:0;letter-spacing:-.5px;}
.sp-head .hl{background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.sp-head p{margin:16px auto 0;max-width:640px;font-size:16px;line-height:1.85;color:var(--sp-muted);}

/* ===== 电商模式 ===== */
.sp-plat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.sp-plat-card{position:relative;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:var(--sp-radius);padding:28px 24px 26px;overflow:hidden;transition:.4s cubic-bezier(.2,.7,.2,1);}
.sp-plat-card::before{content:'';position:absolute;inset:0 0 auto 0;height:4px;background:var(--sp-grad);transform:scaleX(0);transform-origin:left;transition:transform .4s ease;}
.sp-plat-card:hover{transform:translateY(-10px);box-shadow:var(--sp-shadow-lg);border-color:transparent;}
.sp-plat-card:hover::before{transform:scaleX(1);}
.sp-plat-ic{width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;background:var(--sp-grad);box-shadow:0 14px 28px rgba(37,99,235,.3);transition:.4s cubic-bezier(.2,.7,.2,1);}
.sp-plat-card:hover .sp-plat-ic{transform:translateY(-4px) rotate(-4deg);box-shadow:0 20px 38px rgba(37,99,235,.42);}
.sp-plat-card h3{margin:18px 0 8px;font-size:19px;font-weight:800;color:var(--sp-ink);}
.sp-plat-card p{margin:0 0 16px;font-size:13.5px;line-height:1.7;color:var(--sp-muted);min-height:46px;}
.sp-plat-list{list-style:none;margin:0;padding:0;display:grid;gap:9px;}
.sp-plat-list li{position:relative;padding-left:22px;font-size:13.5px;color:#455270;line-height:1.5;}
.sp-plat-list li::before{content:'';position:absolute;left:5px;top:5px;width:5px;height:9px;border:solid var(--sp-cyan);border-width:0 2px 2px 0;transform:rotate(45deg);border-radius:1px;}
.sp-plat-tag{position:absolute;top:18px;right:18px;padding:5px 12px;border-radius:999px;font-size:11.5px;font-weight:800;color:#fff;}
.sp-plat-tag.hot{background:linear-gradient(120deg,#f43f5e,#fb7185);}
.sp-plat-tag.rec{background:var(--sp-grad);}
.sp-plat-tag.new{background:linear-gradient(120deg,#7c3aed,#a855f7);}
.sp-plat-tag.mkt{background:linear-gradient(120deg,#0ea5e9,#22d3ee);}

/* ===== 核心功能 Tab ===== */
.sp-tabs{background:var(--sp-card);border:1px solid var(--sp-line);border-radius:24px;padding:24px;box-shadow:var(--sp-shadow);}
.sp-tab-nav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;}
.sp-tab-btn{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border-radius:13px;border:1px solid var(--sp-line);background:var(--sp-soft);color:var(--sp-muted);font-size:14.5px;font-weight:700;cursor:pointer;transition:.3s;}
.sp-tab-btn i{font-size:15px;}
.sp-tab-btn:hover{color:var(--sp-blue);background:#eaf1ff;}
.sp-tab-btn.active{background:var(--sp-grad);color:#fff;border-color:transparent;box-shadow:0 12px 26px rgba(37,99,235,.34);}
.sp-tab-pane{display:none;animation:spFade .45s ease;}
.sp-tab-pane.active{display:block;}
@keyframes spFade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.sp-feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.sp-feat{display:flex;align-items:center;gap:12px;padding:16px 18px;border-radius:14px;background:var(--sp-soft);border:1px solid transparent;transition:.3s;}
.sp-feat:hover{background:#eaf1ff;border-color:var(--sp-line);transform:translateY(-3px);}
.sp-feat i{width:40px;height:40px;border-radius:11px;flex:none;display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;background:var(--sp-grad);}
.sp-feat span{font-size:14.5px;font-weight:600;color:var(--sp-ink);}

/* ===== 全平台 ===== */
.sp-mp-list{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.sp-mp-item{display:flex;align-items:flex-start;gap:16px;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:var(--sp-radius);padding:24px;transition:.4s cubic-bezier(.2,.7,.2,1);}
.sp-mp-item:hover{transform:translateY(-8px);box-shadow:var(--sp-shadow-lg);border-color:transparent;}
.sp-mp-ic{width:52px;height:52px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;background:var(--sp-grad);box-shadow:0 12px 26px rgba(37,99,235,.3);}
.sp-mp-info h3{margin:0 0 8px;font-size:17px;font-weight:800;color:var(--sp-ink);}
.sp-mp-info p{margin:0;font-size:13.5px;line-height:1.7;color:var(--sp-muted);}

/* ===== 行业方案 ===== */
.sp-sol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.sp-sol-card{display:block;text-decoration:none;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:var(--sp-radius);overflow:hidden;transition:.45s cubic-bezier(.2,.7,.2,1);}
.sp-sol-card:hover{transform:translateY(-12px);box-shadow:var(--sp-shadow-lg);border-color:transparent;}
.sp-sol-card{display:block;text-decoration:none;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:var(--sp-radius);padding:30px 28px 26px;overflow:hidden;transition:.45s cubic-bezier(.2,.7,.2,1);}
.sp-sol-card:hover{transform:translateY(-10px);box-shadow:var(--sp-shadow-lg);border-color:transparent;}
.sp-sol-body{}
.sp-sol-flag{display:inline-block;margin-bottom:10px;padding:5px 14px;border-radius:999px;font-size:11.5px;font-weight:800;color:#fff;background:var(--sp-grad);box-shadow:0 6px 16px rgba(37,99,235,.3);}
.sp-sol-body h3{margin:0 0 8px;font-size:20px;font-weight:800;color:var(--sp-ink);}
.sp-sol-body p{margin:0 0 16px;font-size:13.5px;line-height:1.78;color:var(--sp-muted);}
.sp-sol-list{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:9px;}
.sp-sol-list li{position:relative;padding-left:24px;font-size:13.5px;color:#455270;line-height:1.55;}
.sp-sol-list li::before{content:'';position:absolute;left:6px;top:5px;width:5px;height:9px;border:solid var(--sp-cyan);border-width:0 2px 2px 0;transform:rotate(45deg);border-radius:1px;}
.sp-sol-link{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--sp-blue);}
.sp-sol-card:hover .sp-sol-link i{transform:translateX(5px);transition:.3s;}
/* 错峰揭示 */
.sp-sol-grid .sp-reveal:nth-child(1){transition-delay:.04s;}
.sp-sol-grid .sp-reveal:nth-child(2){transition-delay:.10s;}
.sp-sol-grid .sp-reveal:nth-child(3){transition-delay:.16s;}
.sp-sol-grid .sp-reveal:nth-child(4){transition-delay:.04s;}
.sp-sol-grid .sp-reveal:nth-child(5){transition-delay:.10s;}
.sp-sol-grid .sp-reveal:nth-child(6){transition-delay:.16s;}

/* ===== 优势 ===== */
.sp-adv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.sp-adv{position:relative;display:flex;align-items:flex-start;gap:16px;background:var(--sp-card);border:1px solid var(--sp-line);border-radius:var(--sp-radius);padding:24px 24px;overflow:hidden;transition:.4s cubic-bezier(.2,.7,.2,1);}
.sp-adv:hover{transform:translateY(-10px);box-shadow:var(--sp-shadow-lg);border-color:transparent;}
.sp-adv-ic{width:54px;height:54px;border-radius:15px;flex:none;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;background:var(--sp-grad-soft);color:var(--sp-blue);box-shadow:0 14px 28px rgba(37,99,235,.2);transition:.4s cubic-bezier(.2,.7,.2,1);}
.sp-adv:hover .sp-adv-ic{transform:rotate(-6deg);background:var(--sp-grad);color:#fff;}
.sp-adv-txt{flex:1;min-width:0;}
.sp-adv h3{margin:2px 0 8px;font-size:17px;font-weight:800;color:var(--sp-ink);}
.sp-adv p{margin:0;font-size:13.5px;line-height:1.72;color:var(--sp-muted);}

/* ===== CTA ===== */
.sp-cta{position:relative;padding:84px 0;background:radial-gradient(1000px 500px at 10% 0,#13275c 0,transparent 60%),radial-gradient(900px 460px at 95% 100%,#0b1c44 0,transparent 55%),var(--sp-navy);overflow:hidden;text-align:center;}
.sp-cta .o1{width:360px;height:360px;background:#2563eb;top:-140px;left:-60px;}
.sp-cta .o2{width:300px;height:300px;background:#22d3ee;bottom:-150px;right:-40px;opacity:.4;}
.sp-cta-inner{position:relative;}
.sp-cta-inner h2{margin:0;font-size:clamp(26px,3.4vw,40px);font-weight:900;color:#fff;}
.sp-cta-inner .hl{background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.sp-cta-inner p{margin:18px auto 0;font-size:16px;color:rgba(214,226,250,.78);}
.sp-cta-btns{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin:32px 0 0;}
.sp-btn-light{background:#fff;color:var(--sp-blue);box-shadow:0 16px 34px rgba(0,0,0,.3);}
.sp-btn-light:hover{transform:translateY(-3px);box-shadow:0 22px 44px rgba(0,0,0,.42);}
.sp-cta-contact{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 34px;margin:28px 0 0;font-size:14px;color:rgba(214,226,250,.8);}
.sp-cta-contact i{color:var(--sp-cyan);margin-right:6px;}

/* ===== 揭示动画 ===== */
.sp-reveal{opacity:0;transform:translateY(26px);transition:.7s cubic-bezier(.2,.7,.2,1);}
.sp-reveal.in{opacity:1;transform:none;}

/* ===== 响应式 ===== */
@media(max-width:1080px){
    .sp-hero-inner{grid-template-columns:1fr;gap:48px;}
    .sp-hero-visual{max-width:520px;}
    .sp-plat-grid{grid-template-columns:repeat(2,1fr);}
    .sp-feat-grid{grid-template-columns:repeat(3,1fr);}
    .sp-mp-list{grid-template-columns:repeat(2,1fr);}
    .sp-sol-grid{grid-template-columns:repeat(2,1fr);}
    .sp-adv-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
    .sp-hero{padding:72px 0 90px;}
    .sp-sec{padding:64px 0;}
    .sp-plat-grid,.sp-feat-grid,.sp-mp-list,.sp-sol-grid,.sp-adv-grid{grid-template-columns:1fr;}
    .sp-tags{margin-top:-22px;}
    .sp-hero-stats{gap:22px;}
    .sp-gs b{font-size:24px;}
    .sp-tab-btn{flex:1 1 45%;}
    .sp-float-card.c2{right:-10px;}
}