/* 产品体系下级页面通用样式 */
*{margin:0;padding:0;box-sizing:border-box}
:root{--bl:#1b6ef3;--dk:#0f2544;--tx:#17263d;--mu:#61728c;--ln:#e4eaf2;--gy:#f5f8fc}
body{background:#fff;color:var(--tx);font:15px/1.7 "IBM Plex Sans","Microsoft YaHei",Arial,sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1320px;margin:0 auto;padding:0 20px}

/* 顶栏 */
header{position:sticky;top:0;z-index:9;background:#fff;border-bottom:1px solid #e0e0e0}
.mast{display:flex;align-items:center;height:56px}
.logo{display:flex;align-items:center;gap:14px;font-size:18px;font-weight:600;color:#161616}
.logo i{width:1px;height:22px;background:#c6c6c6}
.logo span{font-weight:300;color:#525252;font-size:15px;letter-spacing:1px}
.menu{display:flex;list-style:none;margin-left:30px;height:56px}
.menu a,.menu .mtop{display:flex;align-items:center;height:56px;padding:0 16px;font-size:14px;color:#161616;border-bottom:2px solid transparent}
.menu a:hover,.menu li.hasdrop:hover>.mtop{background:#f4f4f4;border-bottom-color:var(--bl)}
.menu>li{position:relative}
.mtop{cursor:default}
.menu li.hasdrop>.mtop::after{content:"";width:6px;height:6px;margin-left:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.drop{position:absolute;left:0;top:56px;min-width:224px;background:#fff;border:1px solid #e0e0e0;box-shadow:0 16px 36px rgba(15,37,68,.16);padding:6px 0;display:none;z-index:20}
.menu li:hover .drop,.menu li:focus-within .drop{display:block}
.drop a{display:block;height:auto;padding:11px 20px;font-size:14px;white-space:nowrap;border-bottom:0}
.drop a:hover{background:#f4f4f4;color:var(--bl)}
.mact{display:flex;align-items:center;margin-left:auto}
.mlink{display:flex;align-items:center;height:56px;padding:0 16px;font-size:14px;color:#161616}
.mlink:hover{background:#f4f4f4}
.btn{display:inline-flex;align-items:center;gap:12px;height:48px;padding:0 18px;font-size:14px;transition:.2s}
.btn.solid{background:var(--bl);color:#fff}
.btn.solid:hover{background:#0353e9}
.btn.line{border:1px solid var(--bl);color:var(--bl)}
.btn.line:hover{background:#edf4ff}

/* 页头 */
.phero{background:#f4f4f4;border-bottom:1px solid #e0e0e0;padding:46px 0 40px}
.crumb{font-size:13px;color:#6f6f6f;margin-bottom:16px}
.crumb a:hover{color:var(--bl)}
.crumb b{color:#161616;font-weight:600}
.phero h1{font-size:40px;line-height:1.2;font-weight:300;color:#161616;letter-spacing:-.5px;margin-bottom:14px}
.lead{font-size:16px;color:#525252;max-width:860px}
.keys{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;list-style:none}
.keys li{border:1px solid #c9d6ea;background:#fff;color:var(--dk);font-size:13px;padding:7px 14px}

/* 正文布局 */
.pbody{padding:40px 0 56px}
.pgrid{display:grid;grid-template-columns:232px 1fr;gap:40px;align-items:start}
.pnav{position:sticky;top:76px;border-left:2px solid var(--ln);padding-left:16px}
.pnav b{display:block;font-size:13px;letter-spacing:2px;color:var(--bl);margin-bottom:12px;font-weight:600}
.pnav a{display:block;padding:7px 0;font-size:14px;color:var(--mu)}
.pnav a:hover{color:var(--bl)}
.pnav .all{display:block;margin-top:14px;font-size:13px;color:var(--bl)}

/* 每个幻灯片区块 */
.slide{border-top:1px solid var(--ln);padding:34px 0 8px}
.slide:first-child{border-top:0;padding-top:0}
.shead{display:flex;align-items:flex-start;gap:16px;margin-bottom:18px}
.snum{flex-shrink:0;width:40px;height:40px;background:var(--dk);color:#fff;font-size:15px;display:flex;align-items:center;justify-content:center}
.shead h2{font-size:24px;color:var(--dk);font-weight:600;letter-spacing:.5px}
.skey{font-size:13px;color:var(--mu);margin-top:6px}
.shot{border:1px solid var(--ln);background:#f7f9fc;overflow:hidden}
.shot img{width:100%;height:auto;transition:.3s}
.shot:hover img{opacity:.94}
.shotcap{font-size:12px;color:var(--mu);margin-top:8px;text-align:right}
.desc{font-size:15px;color:#42536b;margin-top:18px}
.points{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}
.points.one{grid-template-columns:1fr}
.points.three{grid-template-columns:repeat(3,1fr)}
.pt{background:var(--gy);border-left:3px solid var(--bl);padding:14px 18px}
.pt h4{font-size:15px;color:var(--dk);margin-bottom:6px}
.pt p{font-size:13.5px;color:#5a6b83;line-height:1.65}
.foot-note{margin-top:18px;font-size:13px;color:var(--bl);letter-spacing:1px;border-top:1px dashed var(--ln);padding-top:12px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.chips span{border:1px solid var(--ln);background:#fff;font-size:13px;color:#42536b;padding:6px 12px}

/* 相关产品线 */
.next{margin-top:44px;border-top:1px solid var(--ln);padding-top:22px}
.next b{font-size:13px;letter-spacing:2px;color:var(--bl)}
.next-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.next-list a{border:1px solid var(--ln);padding:12px 14px;font-size:14px;color:var(--dk);transition:.2s}
.next-list a:hover{border-color:var(--bl);color:var(--bl);background:#f7faff}

/* 页脚 */
footer{background:#0f2544;color:#c9d6ea;padding:44px 0 0;margin-top:20px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:34px;padding-bottom:30px}
footer h3{color:#fff;font-size:17px;margin-bottom:14px;font-weight:600}
footer .cbiz{display:inline-block;margin-bottom:8px;padding:2px 8px;border-radius:4px;background:rgba(255,255,255,.12);color:#9ec9f5;font-size:12px}
footer a:hover{color:#fff;text-decoration:underline}
footer h4{color:#fff;font-size:14px;margin-bottom:12px;letter-spacing:1px}
footer p{font-size:13.5px;margin-bottom:7px}
footer a:hover{color:#7fb0ff}
.copy{text-align:center;border-top:1px solid rgba(255,255,255,.12);padding:20px;font-size:13px;color:#8ea3c0}
.copy .gab{display:inline-flex;align-items:center;gap:5px;vertical-align:-2px;margin-left:5em}
.copy .gab img{width:16px;height:16px}

@media(max-width:960px){
  .menu{display:none}
  .pgrid{grid-template-columns:1fr;gap:24px}
  .pnav{position:static;border-left:0;border-bottom:1px solid var(--ln);padding:0 0 14px;display:flex;flex-wrap:wrap;gap:14px}
  .pnav b{width:100%;margin-bottom:0}
  .phero h1{font-size:28px}
  .points,.points.three,.next-list,.fgrid{grid-template-columns:1fr}
}
