@charset "utf-8";
/* 产品详情页：首屏（.xb-*）、概述区（.xc-*）、能力地图（.cm-*）、价值区（.xe-*）样式 */

.xb-a{padding-top:2.24rem;padding-bottom:.62rem;min-height:0}
.xb-main{width:14rem}
.xb-left{width:6.2rem}

.xb-titles{font-size:clamp(44px,calc(68 * 1rem / 100),68px);font-weight:700;line-height:1.12;letter-spacing:-.015em;color:#0f2231;margin-bottom:.26rem}
.xb-synopsis{font-size:clamp(15px,calc(21 * 1rem / 100),18px);line-height:1.9;color:#5b6b77;max-width:32em}

.xb-buttombox{padding-top:.42rem}
.xb-buttom{height:clamp(44px,calc(52 * 1rem / 100),52px);line-height:clamp(44px,calc(52 * 1rem / 100),52px);padding:0 clamp(28px,calc(46 * 1rem / 100),46px);border-radius:999px;font-size:clamp(14.5px,calc(20 * 1rem / 100),16px);font-weight:600;letter-spacing:.02em;margin:0 .16rem 0 0;box-shadow:0 .12rem .3rem rgba(11,112,161,.22);transition:transform .3s,box-shadow .3s,background-color .3s,color .3s,border-color .3s}
.xb-buttom:hover{transform:translateY(-2px);box-shadow:0 .18rem .34rem rgba(11,112,161,.3);color:#fff;background-color:#0b70a1;background-image:linear-gradient(90deg,#0b70a1 0%,#007db8 100%)}
.xb-buttom + .xb-buttom{background-image:none;background-color:#fff;color:#0b70a1;border:1px solid #cbdde9;box-shadow:none}
.xb-buttom + .xb-buttom:hover{background-color:#f2f8fc;color:#0b70a1;border-color:#0b70a1;box-shadow:none}

.xb-right{width:7.6rem;padding-top:.14rem}
.xb-img img{filter:drop-shadow(0 .2rem .36rem rgba(16,40,64,.16))}

.xb-bottom{display:grid;grid-template-columns:repeat(5,1fr);margin-top:.5rem;background:#fff;border:1px solid #e8f0f6;border-radius:.18rem;box-shadow:0 .12rem .34rem rgba(16,40,64,.08);overflow:hidden}
.xb-bottom .xb-item{width:auto;min-height:0;margin:0;padding:.28rem .24rem;background:transparent;border-radius:0;border-left:1px solid #eef4f9}
.xb-bottom .xb-item:first-child{border-left:0}
.xb-icon{width:clamp(32px,calc(52 * 1rem / 100),46px);height:clamp(32px,calc(52 * 1rem / 100),46px);display:flex;align-items:center;justify-content:center;padding:.06rem;border-radius:50%;background:#eef6fb}
.xb-icon img{width:100%}
.xb-text{padding-left:.16rem}
.xb-name{font-size:clamp(15px,calc(21 * 1rem / 100),17px);font-weight:700;line-height:1.4;color:#12293a}
.xb-intro{font-size:clamp(12px,calc(17 * 1rem / 100),14px);line-height:1.55;color:#6b7d8a;margin-top:.06rem}
.xb-bottom .xb-item{transition:background-color .3s ease}
.xb-icon{transition:background-color .3s ease}
.xb-icon img{transition:filter .3s ease}
.xb-name{transition:color .3s ease}
@media (hover:hover){
.xb-bottom .xb-item:hover{background-color:#f3fafe}
.xb-bottom .xb-item:hover .xb-icon{background-color:#0b70a1}
.xb-bottom .xb-item:hover .xb-icon img{filter:brightness(0) invert(1)}
.xb-bottom .xb-item:hover .xb-name{color:#0b70a1}
}



@media (max-width:900px){
.xb-a{padding-top:1.4rem;padding-bottom:.5rem}
.xb-main{width:100%;max-width:none;padding-left:20px;padding-right:20px}
.xb-left{width:100%}
.xb-titles{font-size:31px;line-height:1.22;margin-bottom:12px}
.xb-synopsis{font-size:14.5px;line-height:1.8}
.xb-buttombox{padding-top:20px;text-align:left}
.xb-buttom{height:44px;line-height:44px;min-width:0;padding:0 26px;font-size:15px;margin:0 10px 0 0}
.xb-right{width:100%;padding-top:26px}
.xb-bottom{grid-template-columns:1fr;margin-top:24px;border-radius:14px}
.xb-bottom .xb-item{width:auto;margin:0;padding:12px 14px;border-left:0;border-top:1px solid #eef4f9}
.xb-bottom .xb-item:first-child{border-top:0}
.xb-icon{width:30px;height:30px;padding:5px}
.xb-name{font-size:14.5px}
.xb-intro{font-size:12px}
}

.xc-a{padding-top:.94rem;padding-bottom:.94rem;background-image:none !important;background:#fff !important}

.xc-main{width:10.4rem}
.xc-cont{display:block}

.xc-left{width:auto}
.xc-titles:before{content:"\201C";display:block;font-family:Georgia,"Times New Roman",serif;font-size:calc(112 * 1rem / 100);font-weight:700;line-height:.72;color:#d3e8f6;margin-bottom:.06rem}

.xc-right{width:auto;margin-top:.26rem}

.xc-titles{font-size:clamp(26px,calc(44 * 1rem / 100),40px);font-weight:700;line-height:1.46;letter-spacing:-.01em;color:#16232e}
.xc-titles p{margin:0;line-height:inherit;text-wrap:balance}
.xc-titles p + p{margin-top:.04rem}
.xc-titles span{font-size:inherit !important;font-family:inherit !important;line-height:inherit !important}

.xc-intro{font-size:clamp(14.5px,calc(20 * 1rem / 100),16.5px);line-height:2.05;color:#5b6b77}
.xc-intro p{margin:0;text-align:left !important}
.xc-intro p + p{margin-top:.5em}
.xc-intro span{font-size:inherit !important;font-family:inherit !important}

.xc-cont:after{content:"";display:block;clear:both}
.xc-right:after{content:"";display:block;width:.5rem;height:2px;margin-top:.36rem;background:#0b70a1}

.xc-titles [style*="79, 129, 189"],.xc-intro [style*="79, 129, 189"]{color:#0b70a1 !important}

@media (max-width:900px){
.xc-a{padding-top:28px;padding-bottom:28px}
.xc-main{width:100%;max-width:none;padding-left:24px;padding-right:24px}
.xc-titles:before{font-size:58px;line-height:.7;margin-bottom:2px}
.xc-titles{font-size:21px;line-height:1.55}
.xc-intro{font-size:14px;line-height:1.95}
}

.cm-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.cm-a{background:#eff5f6;padding:.86rem 0 .9rem}
.cm-main{width:14rem;margin:0 auto}

.cm-hd{text-align:center;margin-bottom:.3rem}
.cm-h2{font-size:clamp(28px,calc(42 * 1rem / 100),42px);font-weight:700;line-height:1.24;letter-spacing:-.012em;color:#0f2231}
.cm-sub{margin-top:.11rem;font-size:clamp(14px,calc(18 * 1rem / 100),18px);line-height:1.7;color:#6b7d8a}

.cm-board{background:#fff;border:1px solid #e3eef7;border-radius:.18rem;overflow:hidden;box-shadow:0 .18rem .5rem -.3rem rgba(16,40,64,.22)}

.cm-map{position:relative;height:4.4rem;background:radial-gradient(ellipse 42% 52% at 50% 50%,#eef7fb 0%,#fff 72%)}
.cm-wires{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
.cm-wire{stroke:#a9cbd3;stroke-width:2;stroke-linecap:round;stroke-dasharray:.1 8;fill:none;vector-effect:non-scaling-stroke;transition:stroke .3s,stroke-width .3s}
.cm-wire.on{stroke:#0878ad;stroke-width:2.2}

.cm-hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:2.86rem;padding:.2rem .2rem .18rem;border:1px solid transparent;border-radius:.18rem;background:#0878ad;color:#fff;text-align:center;font:inherit;line-height:normal;display:block;cursor:pointer;box-shadow:0 .18rem .4rem rgba(8,120,173,.21);transition:transform .18s,box-shadow .18s,border-color .18s}
.cm-hub:hover{transform:translate(-50%,-52%);box-shadow:0 .22rem .46rem rgba(8,120,173,.31);border-color:#8fd1e5}
.cm-hub:focus-visible{outline:3px solid #64c3df;outline-offset:4px}
.cm-hub.on{border-color:#9ed8e6;box-shadow:0 0 0 4px #d8f0f6,0 .18rem .4rem rgba(8,120,173,.21)}
.cm-hub-n{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:clamp(16px,calc(18 * 1rem / 100),18px);font-weight:600;line-height:1.35;margin:0 0 .06rem;color:#fff}
.cm-hub-s{font-size:clamp(9.5px,calc(10 * 1rem / 100),10px);line-height:1.6;color:#fff;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm-expand{display:flex;width:max-content;margin:.11rem auto 0;align-items:center;gap:9px;font-size:clamp(9.5px,calc(10 * 1rem / 100),10px);font-weight:600;color:#fff;letter-spacing:.02em;padding:.07rem .12rem;border:1px solid rgba(255,255,255,.5);border-radius:.2rem;background:rgba(255,255,255,.08);transition:background .16s,border-color .16s}
.cm-expand::after{content:"\2192";font-size:clamp(11px,calc(13 * 1rem / 100),13px);line-height:1}
.cm-hub:hover .cm-expand{background:rgba(255,255,255,.17);border-color:#fff}

.cm-node{position:absolute;z-index:2;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);transform:translate(-50%,-50%);width:clamp(139px,1.56rem,156px);padding:.12rem .13rem;border:1px solid #e1e5e7;border-radius:.11rem;background:#f1f3f4;box-shadow:0 .04rem .12rem rgba(54,71,80,.04);font:inherit;text-align:left;cursor:pointer;color:#65757c;transition:.18s}
.cm-node:hover{transform:translate(-50%,calc(-50% - 3px));border-color:#85bdca;box-shadow:0 .12rem .24rem rgba(33,69,82,.09)}
.cm-node.on{background:#eef8fb;border-color:#087da9;box-shadow:0 .04rem .14rem rgba(8,120,173,.09)}
.cm-node-n{display:block;font-size:clamp(13px,calc(14 * 1rem / 100),14px);font-weight:600;line-height:1.4;color:inherit;transition:color .18s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm-node.on .cm-node-n{color:#087da9}
.cm-node-c{display:block;margin-top:.06rem;font-size:clamp(9.5px,calc(11 * 1rem / 100),11px);line-height:1.5;color:#788990;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.cm-map .cm-node[data-k="1"]{--x:15.36;--y:19.09}
.cm-map .cm-node[data-k="2"]{--x:50;--y:12.73}
.cm-map .cm-node[data-k="3"]{--x:84.64;--y:19.09}
.cm-map .cm-node[data-k="4"]{--x:90.86;--y:50}
.cm-map .cm-node[data-k="5"]{--x:84.64;--y:80.91}
.cm-map .cm-node[data-k="6"]{--x:50;--y:87.27}
.cm-map .cm-node[data-k="7"]{--x:15.36;--y:80.91}
.cm-map .cm-node[data-k="8"]{--x:9;--y:50}

.cm-detail{border-top:1px solid #e8f0f6;padding:.18rem .26rem;background:#fff;min-height:2.6rem;display:flex;align-items:center}
.cm-panel{display:none;width:100%}
.cm-panel.on{display:grid;grid-template-columns:minmax(0,1fr) 3.9rem;gap:.28rem;align-items:center;transition:transform .26s cubic-bezier(.2,.7,.25,1),opacity .26s}

.cm-copy{padding:.2rem .28rem;min-width:0}
.cm-nav{display:flex;align-items:center;gap:.08rem}
.cm-nav button{flex:none;display:flex;align-items:center;justify-content:center;width:.38rem;height:.38rem;padding:0 0 .02rem;border:1px solid #d6e5e9;border-radius:50%;background:rgba(255,255,255,.88);color:#315260;font:inherit;font-size:clamp(15px,calc(19 * 1rem / 100),19px);line-height:1;cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.cm-nav button:hover{background:#0878ad;color:#fff;border-color:#0878ad}
.cm-nav button:focus-visible{outline:2px solid #64c3df;outline-offset:2px}
.cm-nav span{min-width:0;font-size:clamp(15px,calc(20 * 1rem / 100),20px);font-weight:700;color:#0878ad;margin:0 .09rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.cm-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:clamp(17px,calc(19 * 1rem / 100),19px);font-weight:700;line-height:1.4;color:#0f2231;margin:.09rem 0 .11rem}

.cm-rich{font-size:clamp(12.5px,calc(14 * 1rem / 100),14px);line-height:1.8;color:#536b76}
.cm-rich p{margin:0}
.cm-rich p + p{margin-top:.08rem}
.cm-rich span{font-size:inherit !important;line-height:inherit !important}
.cm-rich strong,.cm-rich b,.cm-points strong,.cm-points b{font-weight:700}

.cm-points{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr;gap:.08rem}
.cm-points li{position:relative;padding-left:.15rem;font-size:clamp(12.5px,calc(14 * 1rem / 100),14px);line-height:1.8;color:#536b76}
.cm-points li::before{content:"\2022";position:absolute;left:0;color:#0878ad;font-weight:700}

.cm-image{position:relative;width:100%}
.cm-slides{position:relative;width:100%;height:2.4rem;aspect-ratio:4 / 3;margin:0 auto;cursor:pointer}
.cm-slides img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .45s ease}
.cm-slides img.on{opacity:1}
.cm-img-bar{position:relative;display:flex;align-items:center;justify-content:center;padding-top:.09rem;min-height:.42rem}
.cm-img-dots{display:flex;align-items:center;gap:5px;cursor:pointer}
.cm-dot{width:6px;height:6px;border-radius:9px;background:#cfdde6;cursor:pointer;transition:width .3s,background .3s}
.cm-dot.active{width:18px;background:#0878ad}
.cm-img-ctrl{position:absolute;right:0;top:.09rem;display:flex;gap:6px}
.cm-img-ctrl button{display:flex;align-items:center;justify-content:center;width:.32rem;height:.32rem;padding:0 0 .02rem;border:1px solid #d9e6ee;border-radius:50%;background:#fff;color:#5b7c90;font:inherit;font-size:clamp(13px,calc(15 * 1rem / 100),15px);line-height:1;cursor:pointer;transition:background .18s,color .18s,border-color .18s}
.cm-img-ctrl button:hover{background:#0878ad;border-color:#0878ad;color:#fff}

@keyframes cm-card-settle{from{opacity:0;transform:translate(-50%,-50%) translateX(-24px)}to{opacity:1;transform:translate(-50%,-50%) translateX(0)}}
@keyframes cm-spoke-draw{from{stroke-dashoffset:520;opacity:.12}to{stroke-dashoffset:0;opacity:1}}
.cm-map.is-entering .cm-node{animation:cm-card-settle .42s cubic-bezier(.2,.75,.25,1) both;animation-delay:calc(var(--card-order,0) * .12s)}
.cm-map.is-entering .cm-wire{animation:cm-spoke-draw .42s ease-out both;animation-delay:calc(var(--card-order,0) * .12s)}

@keyframes cm-in-next{from{opacity:.25;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
@keyframes cm-in-prev{from{opacity:.25;transform:translateX(-18px)}to{opacity:1;transform:translateX(0)}}
.cm-detail.is-next .cm-copy,.cm-detail.is-next .cm-image{animation:cm-in-next .32s cubic-bezier(.2,.7,.25,1) both}
.cm-detail.is-prev .cm-copy,.cm-detail.is-prev .cm-image{animation:cm-in-prev .32s cubic-bezier(.2,.7,.25,1) both}

@media (max-width:1200px){
.cm-node{width:1.7rem}
.cm-hub{width:2.9rem}
}

@media (max-width:900px){
.cm-a{padding:42px 0 46px}
.cm-main{width:100%;max-width:none;padding:0 20px}
.cm-hd{margin-bottom:20px;text-align:center}
.cm-h2{font-size:25px;line-height:1.3}
.cm-sub{margin-top:8px;font-size:13.5px;line-height:1.7;padding:0 6px}
.cm-map{display:flex;flex-wrap:wrap;gap:9px;padding:16px 14px;height:auto;min-height:0}
.cm-wires{display:none}
.cm-hub{position:static;left:auto;top:auto;transform:none;order:-1;width:100%;margin:0 0 6px;padding:18px 16px}
.cm-hub:hover{transform:none}
.cm-node{position:static;left:auto;top:auto;transform:none;flex:1 1 calc(50% - 5px);width:auto;padding:11px 12px}
.cm-node:hover{transform:none}
.cm-hub-n{font-size:19px;-webkit-line-clamp:3}
.cm-detail{padding:16px;min-height:0;display:block}
.cm-panel.on{grid-template-columns:1fr;gap:14px;align-items:start}
.cm-copy{padding:12px 4px}
.cm-t{font-size:22px;margin:10px 0 8px;-webkit-line-clamp:3}
.cm-rich,.cm-points li{font-size:13.5px}
.cm-nav button{width:40px;height:40px;font-size:20px}
.cm-nav span{font-size:18px}
.cm-img-ctrl button{width:34px;height:34px;font-size:16px}
.cm-img-bar{padding-top:10px;min-height:46px}
.cm-points{gap:9px}
.cm-image{margin-top:14px}
.cm-slides{height:auto;aspect-ratio:4 / 3}
}

@media (prefers-reduced-motion:reduce){
.cm-map.is-entering .cm-node,.cm-map.is-entering .cm-wire,.cm-detail.is-next .cm-copy,.cm-detail.is-next .cm-image,.cm-detail.is-prev .cm-copy,.cm-detail.is-prev .cm-image{animation:none !important}
.cm-slides img,.cm-node,.cm-hub{transition:none}
}

.xe-a{background:linear-gradient(180deg,#edf4fa 0%,#f7fafd 100%);padding-top:.8rem;padding-bottom:.55rem}

h2.xe-titles{color:#1c2b36;font-weight:700;font-size:clamp(26px,calc(42 * 1rem / 100),42px);line-height:1.25;letter-spacing:-.01em;margin-bottom:.18rem}
.xe-synopsis{color:#5b6b77;line-height:1.7;font-size:clamp(14px,calc(18 * 1rem / 100),18px)}

.xe-cont{gap:.3rem}
.xe-item{width:calc(50% - .15rem);padding:.44rem .48rem;margin-bottom:0;display:grid;grid-template-columns:auto 1fr;column-gap:.26rem;row-gap:.16rem;align-items:center;background:#fff;border:1px solid #e3edf4;border-radius:.16rem;box-shadow:0 6px 22px rgba(16,44,72,.05);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.xe-item:hover{transform:translateY(-4px);border-color:#9fc9e2;box-shadow:0 18px 40px rgba(11,112,161,.13)}

.xe-img{grid-column:1;grid-row:1;width:clamp(42px,calc(60 * 1rem / 100),60px);height:clamp(42px,calc(60 * 1rem / 100),60px);line-height:normal;border-radius:.16rem;background:linear-gradient(135deg,#e8f3fa 0%,#dcecf7 100%);display:flex;align-items:center;justify-content:center;overflow:visible;transition:background .3s ease,box-shadow .3s ease}
.xe-item:hover .xe-img{background:linear-gradient(135deg,#d8ecf8 0%,#c8e3f4 100%);box-shadow:inset 0 0 0 1px #b5d8ec}
.xe-img img{position:static;width:56%;height:auto;object-fit:contain;transform:none}

.xe-text{display:contents}
h3.xe-name{grid-column:2;grid-row:1;padding-bottom:0;margin:0;color:#1c2b36;font-weight:700;font-size:clamp(17px,calc(21 * 1rem / 100),21px);line-height:1.4}
.xe-name:after{display:none}
.xe-intro{grid-column:1/-1;grid-row:2;color:#5b6b77;line-height:1.78;font-size:clamp(14px,calc(15.5 * 1rem / 100),15.5px)}
.xe-intro p{text-align:left!important;margin:0}

@media(max-width:750px){
  .xe-a{padding-top:.6rem;padding-bottom:.4rem}
  .xe-titles{margin-bottom:10px}
  .xe-cont{gap:0}
  .xe-item{width:100%;padding:18px 16px;margin-bottom:12px;column-gap:14px;row-gap:10px;border-radius:14px}
  .xe-img{width:44px;height:44px;border-radius:12px}
  h3.xe-name{font-size:16px}
  .xe-intro{font-size:14px;line-height:1.75}
}