:root{
  --blue:#1a6fff; --blue-d:#0c52d6; --ink:#0f1b2d; --sub:#5b6b80;
  --line:#e6ecf5; --bg:#f5f8ff; --card:#fff; --radius:14px;
  --shadow:0 6px 24px rgba(26,111,255,.10); --ok:#1f9d55;
}
/* ===== Hero ===== */
.hero{padding:64px 0 40px;background:
  radial-gradient(900px 360px at 20% -10%,rgba(26,111,255,.16),transparent),
  linear-gradient(180deg,#eef4ff,#f5f8ff)}
.hero h1{font-size:40px;line-height:1.2;letter-spacing:-.5px}
.hero p{margin-top:14px;font-size:17px;color:var(--sub);max-width:640px}
.hero .btn-primary{display:inline-block;margin-top:24px;background:var(--blue);color:#fff;
  padding:13px 28px;border-radius:10px;font-weight:700;box-shadow:var(--shadow)}
.hero .btn-primary:hover{background:var(--blue-d)}
/* ===== 区块 ===== */
.section{padding:56px 0}
.sec-title{font-size:26px;font-weight:800;margin-bottom:6px}
.sec-sub{color:var(--sub);margin-bottom:30px}
/* ===== 能力矩阵表 ===== */
.matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff;
  box-shadow:var(--shadow)}
table.matrix{width:100%;border-collapse:collapse;min-width:760px;font-size:14px}
table.matrix th,table.matrix td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line)}
table.matrix thead th{background:#eaf1ff;color:var(--blue-d);font-weight:700;position:sticky;top:0}
table.matrix tbody tr:hover{background:#f7faff}
table.matrix .sv{font-weight:700;color:var(--ink)}
table.matrix .lv{display:inline-block;font-size:12px;padding:2px 8px;border-radius:20px;background:#eef4ff;color:var(--blue-d)}
table.matrix .yes{color:var(--ok);font-weight:700}
table.matrix .no{color:#c2ccd9}
/* ===== 系列能力展开 ===== */
.series{margin-bottom:38px;scroll-margin-top:80px}
.series-head{display:flex;align-items:baseline;gap:12px;border-left:4px solid var(--blue);
  padding-left:14px;margin-bottom:8px}
.series-head h3{font-size:21px}
.series-head .tag{font-size:13px;color:#fff;background:var(--blue);padding:2px 10px;border-radius:20px}
.series-desc{color:var(--sub);margin-bottom:14px;max-width:780px}
.feat{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 24px;margin:8px 0 16px}
.feat li{list-style:none;padding-left:22px;position:relative;font-size:14px;color:#33425a}
.feat li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--ok);font-weight:900}
.vers{display:flex;flex-wrap:wrap;gap:10px}
.vchip{background:#fff;border:1px solid var(--line);border-radius:20px;padding:7px 14px;font-size:13px;
  color:#33425a;display:flex;align-items:center;gap:8px}
.vchip a{color:var(--blue);font-weight:600}
/* ===== FAQ / CTA ===== */
.faq-list{display:grid;gap:12px;max-width:820px}
.faq-item{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
.faq-item b{color:var(--blue-d)}
.cta{background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;border-radius:20px;
  padding:44px;text-align:center;margin:10px 0 60px}
.cta h2{font-size:26px}
.cta p{opacity:.9;margin:10px 0 22px}
.cta a{display:inline-block;background:#fff;color:var(--blue-d);font-weight:800;padding:13px 30px;border-radius:10px}
@media(max-width:860px){
  .hero h1{font-size:30px}
  .feat{grid-template-columns:1fr}
  .cta{padding:30px 20px}
}