/* ========== 全局样式 ========== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; color: #333; line-height: 1.6; background: #f8fafc; }
a { text-decoration: none; color: inherit; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.top-banner { background: linear-gradient(90deg,#dc2626,#ea580c,#dc2626); color: #fff; text-align: center; padding: 10px 0; font-size: 16px; font-weight: 600; position: relative; overflow: hidden; animation: pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:0.9;} }
.top-banner::before { content:''; position:absolute; top:-50%; left:-100%; width:200%; height:200%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent); animation:shine 3s infinite; }
@keyframes shine { 0%{left:-100%;} 100%{left:100%;} }

.header { background:#fff; box-shadow:0 2px 12px rgba(0,0,0,0.06); position:sticky; top:0; z-index:999; }
.nav-wrap { display:flex; justify-content:space-between; align-items:center; padding:16px 20px; max-width:1200px; margin:0 auto; }
.logo { font-size:24px; font-weight:800; color:#1e40af; }
.logo-sub { font-size:12px; color:#64748b; font-weight:normal; }
.nav-links { display:flex; gap:32px; align-items:center; }
.nav-links a { font-size:16px; font-weight:500; color:#475569; padding:8px 0; transition:0.2s; position:relative; }
.nav-links a:hover,.nav-links a.active { color:#2563eb; }
.nav-links a.active::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:2px; background:#2563eb; }
.consult-btn-nav { background:linear-gradient(135deg,#2563eb,#1d4ed8); color:#fff!important; padding:10px 24px!important; border-radius:24px; font-weight:600!important; transition:0.2s; }
.consult-btn-nav:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(37,99,235,0.35); }
.hamburger { display:none; font-size:28px; cursor:pointer; color:#2563eb; }

.mobile-menu { position:fixed; top:0; right:-280px; width:280px; height:100vh; background:#fff; box-shadow:-4px 0 20px rgba(0,0,0,0.15); z-index:1001; transition:right 0.3s; padding:60px 24px 24px; }
.mobile-menu.open { right:0; }
.menu-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:1000; display:none; }
.menu-overlay.open { display:block; }
.close-menu { position:absolute; top:16px; right:16px; font-size:28px; cursor:pointer; color:#64748b; }
.mobile-menu a { display:block; padding:14px 0; font-size:17px; color:#334155; border-bottom:1px solid #f1f5f9; }
.mobile-qq-area { margin-top:24px; padding:16px; background:#eff6ff; border-radius:12px; }
.mobile-copy-btn { width:100%; padding:12px; background:linear-gradient(135deg,#2563eb,#1d4ed8); color:#fff; border:none; border-radius:8px; font-size:16px; font-weight:600; cursor:pointer; margin-top:8px; }

.banner { background:linear-gradient(135deg,#1e3a8a,#2563eb,#3b82f6); color:#fff; padding:80px 20px; text-align:center; position:relative; overflow:hidden; }
.banner::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle at 20% 30%,rgba(255,255,255,0.08) 1px,transparent 1px),radial-gradient(circle at 80% 70%,rgba(255,255,255,0.08) 1px,transparent 1px); background-size:40px 40px; }
.banner-glow { position:absolute; width:300px; height:300px; background:rgba(96,165,250,0.3); border-radius:50%; filter:blur(80px); }
.banner-glow.g1 { top:-100px; left:10%; }
.banner-glow.g2 { bottom:-100px; right:10%; background:rgba(168,85,247,0.2); }
.banner-content { position:relative; z-index:1; max-width:800px; margin:0 auto; }
.banner h1 { font-size:44px; font-weight:800; margin-bottom:16px; line-height:1.2; }
.banner p { font-size:18px; opacity:0.92; margin-bottom:32px; }
.banner-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.btn-primary { background:#fff; color:#2563eb; padding:14px 32px; border-radius:30px; font-size:17px; font-weight:700; cursor:pointer; border:none; transition:0.2s; display:inline-block; }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 10px 20px rgba(0,0,0,0.2); }
.btn-secondary { background:rgba(255,255,255,0.15); color:#fff; padding:14px 32px; border-radius:30px; font-size:17px; font-weight:700; cursor:pointer; border:2px solid rgba(255,255,255,0.4); transition:0.2s; display:inline-block; backdrop-filter:blur(4px); }
.btn-secondary:hover { background:rgba(255,255,255,0.25); }

.section { padding:70px 20px; }
.section-title { text-align:center; margin-bottom:50px; }
.section-title h2 { font-size:34px; font-weight:800; color:#0f172a; margin-bottom:12px; }
.section-title p { font-size:16px; color:#64748b; }

.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1200px; margin:0 auto; }
.service-card { background:#fff; border-radius:16px; padding:32px 28px; box-shadow:0 4px 16px rgba(0,0,0,0.05); transition:0.3s; text-align:center; }
.service-card:hover { transform:translateY(-8px); box-shadow:0 12px 32px rgba(37,99,235,0.12); }
.service-icon { width:72px; height:72px; margin:0 auto 20px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-size:36px; }
.si-blue{background:linear-gradient(135deg,#dbeafe,#bfdbfe);}.si-purple{background:linear-gradient(135deg,#ede9fe,#ddd6fe);}.si-green{background:linear-gradient(135deg,#dcfce7,#bbf7d0);}
.si-orange{background:linear-gradient(135deg,#ffedd5,#fed7aa);}.si-pink{background:linear-gradient(135deg,#fce7f3,#fbcfe8);}.si-cyan{background:linear-gradient(135deg,#cffafe,#a5f3fc);}
.si-amber{background:linear-gradient(135deg,#fef3c7,#fde68a);}.si-indigo{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);}.si-rose{background:linear-gradient(135deg,#ffe4e6,#fecdd3);}
.service-card h3 { font-size:20px; font-weight:700; color:#0f172a; margin-bottom:10px; }
.service-card p { color:#64748b; font-size:14px; line-height:1.7; }

.price-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; max-width:1200px; margin:0 auto; }
.price-card { background:#fff; border-radius:16px; padding:36px 24px; text-align:center; box-shadow:0 4px 16px rgba(0,0,0,0.05); position:relative; border:2px solid transparent; transition:0.3s; }
.price-card:hover { transform:translateY(-6px); box-shadow:0 12px 28px rgba(0,0,0,0.1); }
.price-card.recommended { border-color:#3b82f6; }
.price-badge { position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,#ef4444,#f97316); color:#fff; padding:6px 18px; border-radius:20px; font-size:13px; font-weight:700; }
.price-card h3 { font-size:22px; font-weight:700; color:#1e293b; margin-bottom:16px; }
.price-num { font-size:48px; font-weight:800; margin-bottom:24px; }
.p-blue{color:#2563eb;}.p-purple{color:#7c3aed;}.p-orange{color:#ea580c;}.p-gray{color:#475569;}
.price-num span { font-size:18px; font-weight:500; color:#64748b; }
.price-features { list-style:none; margin-bottom:28px; text-align:left; }
.price-features li { padding:8px 0; color:#475569; font-size:15px; padding-left:24px; position:relative; }
.price-features li::before { content:'✓'; position:absolute; left:0; color:#10b981; font-weight:700; }
.price-btn { width:100%; padding:14px; border-radius:10px; border:none; font-size:16px; font-weight:700; cursor:pointer; transition:0.2s; }
.pbtn-blue{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;}.pbtn-purple{background:linear-gradient(135deg,#9333ea,#7c3aed);color:#fff;}
.pbtn-orange{background:linear-gradient(135deg,#ea580c,#c2410c);color:#fff;}.pbtn-gray{background:#475569;color:#fff;}
.price-btn:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,0.15); }

.about-section { background:#fff; }
.about-wrap { display:grid; grid-template-columns:1fr 1fr; gap:60px; max-width:1200px; margin:0 auto; align-items:center; }
.about-text h2 { font-size:36px; font-weight:800; color:#0f172a; margin-bottom:20px; line-height:1.3; }
.about-text p { color:#475569; font-size:16px; line-height:1.8; margin-bottom:16px; }
.about-features { margin:28px 0; }
.about-features li { list-style:none; padding:8px 0; padding-left:32px; position:relative; font-size:15px; color:#334155; }
.about-features li::before { content:'✓'; position:absolute; left:0; top:8px; width:22px; height:22px; background:#dcfce7; color:#16a34a; border-radius:50%; text-align:center; font-size:13px; line-height:22px; font-weight:700; }
.about-btns { display:flex; gap:16px; margin-top:28px; flex-wrap:wrap; }
.btn-blue-solid { background:linear-gradient(135deg,#2563eb,#1d4ed8); color:#fff; padding:14px 30px; border-radius:10px; font-size:16px; font-weight:600; border:none; cursor:pointer; transition:0.2s; }
.btn-blue-solid:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(37,99,235,0.3); }
.btn-white-outline { background:#fff; color:#2563eb; padding:14px 30px; border-radius:10px; font-size:16px; font-weight:600; border:2px solid #2563eb; cursor:pointer; transition:0.2s; }
.btn-white-outline:hover { background:#eff6ff; }
.about-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.stat-card { background:linear-gradient(135deg,#eff6ff,#dbeafe); padding:28px 20px; border-radius:16px; text-align:center; }
.stat-num { font-size:38px; font-weight:800; color:#1d4ed8; }
.stat-label { font-size:14px; color:#475569; margin-top:6px; }

.news-section { background:#f8fafc; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; max-width:1200px; margin:0 auto 32px; }
.news-card { background:#fff; border-radius:14px; padding:28px; box-shadow:0 4px 12px rgba(0,0,0,0.05); transition:0.3s; cursor:pointer; }
.news-card:hover { transform:translateY(-4px); box-shadow:0 10px 24px rgba(37,99,235,0.1); }
.news-tag { display:inline-block; background:#dbeafe; color:#1d4ed8; padding:4px 12px; border-radius:6px; font-size:12px; font-weight:600; margin-bottom:12px; }
.news-card h3 { font-size:18px; font-weight:700; color:#0f172a; margin-bottom:10px; line-height:1.4; }
.news-card p { color:#64748b; font-size:14px; line-height:1.6; margin-bottom:14px; }
.news-meta { font-size:13px; color:#94a3b8; display:flex; justify-content:space-between; }
.news-more { text-align:center; }
.btn-more { display:inline-block; padding:14px 40px; background:#fff; color:#2563eb; border:2px solid #2563eb; border-radius:30px; font-size:16px; font-weight:600; transition:0.2s; cursor:pointer; }
.btn-more:hover { background:#2563eb; color:#fff; }

.cta-section { background:linear-gradient(135deg,#1e3a8a,#2563eb,#3b82f6); color:#fff; text-align:center; padding:60px 20px; position:relative; overflow:hidden; }
.cta-section::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle,rgba(255,255,255,0.1) 1px,transparent 1px); background-size:30px 30px; }
.cta-content { position:relative; z-index:1; max-width:700px; margin:0 auto; }
.cta-section h2 { font-size:32px; font-weight:800; margin-bottom:12px; }
.cta-section p { font-size:17px; opacity:0.9; margin-bottom:28px; }
.cta-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.cta-phone { background:#16a34a; color:#fff; padding:16px 36px; border-radius:12px; font-size:18px; font-weight:700; border:none; cursor:pointer; transition:0.2s; box-shadow:0 6px 0 #15803d; }
.cta-phone:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(22,163,74,0.4); }
.cta-qq { background:#2563eb; color:#fff; padding:16px 36px; border-radius:12px; font-size:18px; font-weight:700; border:none; cursor:pointer; transition:0.2s; box-shadow:0 6px 0 #1d4ed8; }
.cta-qq:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(37,99,235,0.4); }

.footer { background:#0f172a; color:#94a3b8; padding:50px 20px 24px; }
.footer-wrap { display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; max-width:1200px; margin:0 auto; padding-bottom:32px; border-bottom:1px solid #1e293b; }
.footer-col h4 { color:#fff; font-size:18px; font-weight:700; margin-bottom:18px; }
.footer-col p { font-size:14px; line-height:1.8; margin-bottom:10px; }
.footer-col a { display:block; padding:6px 0; font-size:14px; color:#94a3b8; transition:0.2s; }
.footer-col a:hover { color:#60a5fa; }
.footer-copy { text-align:center; padding-top:24px; font-size:13px; }
.footer-disclaimer { margin-top:12px; font-size:12px; color:#64748b; }
.footer-copy-btn { background:#1e40af; color:#fff; border:none; padding:6px 14px; border-radius:6px; font-size:13px; cursor:pointer; margin-left:8px; }
.footer-copy-btn:hover { background:#2563eb; }

.fixed-qq { position:fixed; right:20px; top:50%; transform:translateY(-50%); background:#fff; border-radius:16px; padding:16px 12px; box-shadow:0 8px 32px rgba(0,0,0,0.15); z-index:998; width:140px; text-align:center; }
.fixed-qq-header { background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; padding:8px; border-radius:10px; font-size:13px; font-weight:700; margin-bottom:12px; }
.fixed-qq-avatar { width:56px; height:56px; background:linear-gradient(135deg,#3b82f6,#60a5fa); border-radius:50%; margin:0 auto 10px; display:flex; align-items:center; justify-content:center; font-size:28px; }
.fixed-qq-name { font-size:13px; color:#64748b; margin-bottom:4px; }
.fixed-qq-num { font-size:17px; font-weight:800; color:#0f172a; margin-bottom:10px; user-select:all; }
.fixed-qq-copy { width:100%; background:linear-gradient(135deg,#f97316,#ea580c); color:#fff; border:none; padding:8px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; transition:0.2s; }
.fixed-qq-copy:hover { transform:scale(1.03); }
.fixed-qq-slogan { font-size:11px; color:#94a3b8; margin-top:8px; }
.fixed-qq-slogan::before { content:'💎 '; }

.copy-toast { position:fixed; top:80px; left:50%; transform:translateX(-50%); background:#16a34a; color:#fff; padding:12px 28px; border-radius:10px; font-size:15px; font-weight:600; z-index:9999; box-shadow:0 8px 24px rgba(22,163,74,0.3); opacity:0; transition:opacity 0.3s; pointer-events:none; }
.copy-toast.show { opacity:1; }

.page-banner { background:linear-gradient(135deg,#1e3a8a,#2563eb); color:#fff; padding:60px 20px; text-align:center; }
.page-banner h1 { font-size:38px; font-weight:800; margin-bottom:10px; }
.page-banner p { font-size:16px; opacity:0.9; }
.breadcrumb { font-size:14px; margin-top:12px; opacity:0.8; }
.breadcrumb a { color:#93c5fd; }
.list-wrap { max-width:1200px; margin:0 auto; padding:40px 20px; display:grid; grid-template-columns:1fr 300px; gap:30px; }
.list-main { background:#fff; border-radius:16px; padding:32px; box-shadow:0 4px 12px rgba(0,0,0,0.05); }
.news-list-item { padding:24px 0; border-bottom:1px solid #f1f5f9; transition:0.2s; cursor:pointer; }
.news-list-item:last-child { border-bottom:none; }
.news-list-item:hover { padding-left:8px; }
.news-list-item h3 { font-size:20px; font-weight:700; color:#0f172a; margin-bottom:10px; transition:0.2s; }
.news-list-item:hover h3 { color:#2563eb; }
.news-list-item p { color:#64748b; font-size:14px; line-height:1.7; margin-bottom:12px; }
.pagination { display:flex; justify-content:center; gap:8px; margin-top:32px; }
.page-num { width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:8px; background:#f1f5f9; color:#475569; font-weight:600; cursor:pointer; transition:0.2s; }
.page-num.active,.page-num:hover { background:#2563eb; color:#fff; }

.sidebar { display:flex; flex-direction:column; gap:24px; }
.side-card { background:#fff; border-radius:14px; padding:24px; box-shadow:0 4px 12px rgba(0,0,0,0.05); }
.side-card h4 { font-size:18px; font-weight:700; color:#0f172a; margin-bottom:18px; padding-bottom:10px; border-bottom:2px solid #2563eb; display:inline-block; }
.side-copy-phone { width:100%; background:linear-gradient(135deg,#16a34a,#15803d); color:#fff; padding:14px; border-radius:10px; border:none; font-size:16px; font-weight:700; cursor:pointer; margin-bottom:10px; transition:0.2s; }
.side-copy-qq { width:100%; background:linear-gradient(135deg,#2563eb,#1d4ed8); color:#fff; padding:14px; border-radius:10px; border:none; font-size:16px; font-weight:700; cursor:pointer; transition:0.2s; }
.side-copy-phone:hover,.side-copy-qq:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,0.15); }
.side-tag { display:inline-block; background:#eff6ff; color:#2563eb; padding:6px 14px; border-radius:6px; font-size:13px; margin:0 6px 8px 0; transition:0.2s; cursor:pointer; }
.side-tag:hover { background:#2563eb; color:#fff; }
.side-news-item { padding:10px 0; border-bottom:1px solid #f1f5f9; font-size:14px; color:#475569; cursor:pointer; transition:0.2s; }
.side-news-item:last-child { border-bottom:none; }
.side-news-item:hover { color:#2563eb; padding-left:4px; }

.article-wrap { max-width:1200px; margin:0 auto; padding:40px 20px; display:grid; grid-template-columns:1fr 300px; gap:30px; }
.article-main { background:#fff; border-radius:16px; padding:40px; box-shadow:0 4px 12px rgba(0,0,0,0.05); }
.article-hero { margin:-40px -40px 36px; padding:48px 40px; background:linear-gradient(135deg,#1e3a8a,#2563eb,#3b82f6); color:#fff; border-radius:16px 16px 0 0; position:relative; overflow:hidden; }
.article-hero::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle,rgba(255,255,255,0.08) 1px,transparent 1px); background-size:30px 30px; }
.article-hero-content { position:relative; z-index:1; }
.article-hero h1 { font-size:32px; font-weight:800; margin-bottom:16px; line-height:1.3; }
.article-meta { font-size:14px; opacity:0.85; display:flex; gap:20px; flex-wrap:wrap; }
.article-body { font-size:16px; line-height:1.9; color:#334155; }
.article-body h2 { font-size:24px; font-weight:700; color:#0f172a; margin:36px 0 18px; padding-left:14px; border-left:4px solid #2563eb; }
.article-body h3 { font-size:19px; font-weight:700; color:#1e293b; margin:24px 0 12px; }
.article-body p { margin-bottom:16px; }
.article-body ul { margin-bottom:16px; padding-left:24px; }
.article-body li { margin-bottom:8px; }
.tip-box { background:#eff6ff; border-left:4px solid #3b82f6; padding:16px 20px; border-radius:0 10px 10px 0; margin:20px 0; }
.tip-box strong { color:#1d4ed8; }
.warn-box { background:#fef3c7; border-left:4px solid #f59e0b; padding:16px 20px; border-radius:0 10px 10px 0; margin:20px 0; }
.warn-box strong { color:#b45309; }
.danger-box { background:#fef2f2; border-left:4px solid #ef4444; padding:16px 20px; border-radius:0 10px 10px 0; margin:20px 0; }
.danger-box strong { color:#b91c1c; }
.compare-table { width:100%; border-collapse:collapse; margin:20px 0; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.compare-table th { background:#2563eb; color:#fff; padding:12px 16px; text-align:left; font-weight:600; font-size:15px; }
.compare-table td { padding:12px 16px; border-bottom:1px solid #f1f5f9; font-size:14px; }
.compare-table tr:last-child td { border-bottom:none; }
.compare-table tr:nth-child(even) { background:#f8fafc; }
.article-cta { margin:36px 0 0; padding:28px; background:linear-gradient(135deg,#eff6ff,#dbeafe); border-radius:14px; border:1px solid #bfdbfe; }
.article-cta h3 { font-size:22px; font-weight:700; color:#1e40af; margin-bottom:10px; }
.article-cta p { color:#475569; margin-bottom:18px; }
.article-cta-btns { display:flex; gap:12px; flex-wrap:wrap; }
.article-tag-area { margin-top:32px; padding-top:24px; border-top:1px solid #e2e8f0; }
.article-tag-area span { display:inline-block; background:#eff6ff; color:#2563eb; padding:6px 14px; border-radius:6px; font-size:13px; margin:0 6px 8px 0; }
.article-nav { display:flex; justify-content:space-between; margin-top:32px; padding-top:24px; border-top:1px solid #e2e8f0; font-size:14px; }
.article-nav a { color:#475569; max-width:45%; transition:0.2s; }
.article-nav a:hover { color:#2563eb; }
.article-nav .next { text-align:right; }

@media (max-width:900px) {
  .services-grid{grid-template-columns:repeat(2,1fr);}.price-grid{grid-template-columns:repeat(2,1fr);}.about-wrap{grid-template-columns:1fr;gap:32px;}
  .news-grid{grid-template-columns:1fr;}.footer-wrap{grid-template-columns:1fr;gap:28px;}.list-wrap,.article-wrap{grid-template-columns:1fr;}.sidebar{order:-1;}
  .nav-links{display:none;}.hamburger{display:block;}.fixed-qq{right:10px;width:110px;padding:12px 8px;}.fixed-qq-num{font-size:15px;}
  .banner h1{font-size:30px;}.banner{padding:50px 16px;}.section{padding:50px 16px;}.section-title h2{font-size:26px;}
  .article-hero{padding:32px 20px;margin:-40px -40px 24px;}.article-hero h1{font-size:24px;}.article-main{padding:24px;}
}
@media (max-width:600px) {
  .services-grid{grid-template-columns:1fr;}.price-grid{grid-template-columns:1fr;}.about-stats{grid-template-columns:1fr;}.banner-btns{flex-direction:column;align-items:center;}
}