/* ============ base ============ */
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
body{font:14px/1.7 "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;color:#16181D;background:#fff;overflow-x:hidden}
a,a:visited{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
ul{list-style:none}
button{font-family:inherit}
.wrap{width:1200px;margin:0 auto}
:root{
  --blue:#1A56DB;--blue-d:#1444B0;--blue-l:#EEF3FE;
  --ink:#16181D;--ink2:#5A6472;--ink3:#8A94A6;
  --line:#E8EBF0;--bg:#F5F7FA;--dark:#111C2E;
}

/* ============ loader ============ */
#loader{position:fixed;inset:0;background:#fff;z-index:9999;display:grid;place-items:center;transition:opacity .45s ease}
#loader.done{opacity:0;pointer-events:none}
#loader .lw{display:grid;place-items:center}
#loader .lring{width:46px;height:46px;display:block}
#loader .larc{transform-origin:50% 50%;animation:lspin 1s linear infinite}
@keyframes lspin{to{transform:rotate(360deg)}}

/* ============ header ============ */
header#siteHeader{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line)}
.hd{height:72px;display:flex;align-items:center;gap:34px}
.logo img{height:38px;width:auto}
nav{display:flex;gap:28px;font-size:14px;color:#2B303B}
nav a{position:relative;padding:24px 0;transition:color .2s;display:inline-flex;align-items:center}
nav a:hover{color:var(--blue)}
nav a.hot:after{content:"HOT";position:absolute;top:14px;right:-20px;background:#F04438;color:#fff;font-size:9px;line-height:13px;padding:0 3px;border-radius:2px}
.hd-right{margin-left:auto;display:flex;align-items:center;gap:24px;font-size:14px;color:var(--ink2)}
.hd-right a:hover{color:var(--blue)}
.btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 22px;border:0;border-radius:4px;background:var(--blue);color:#fff;font-size:14px;cursor:pointer;transition:background .2s}
.btn:hover{background:var(--blue-d)}
.btn.line{background:#fff;color:var(--blue);border:1px solid var(--blue)}
.btn.line:hover{background:var(--blue-l)}
.burger{display:none;margin-left:auto;width:40px;height:40px;border:0;background:none;cursor:pointer;padding:10px}
.burger span{display:block;height:2px;background:#2B303B;border-radius:2px;margin:4px 0;transition:.25s}
.burger.on span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0}
.burger.on span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mnav{display:none;border-top:1px solid var(--line);background:#fff;padding:8px 20px 18px}
.mnav a{display:block;padding:13px 0;font-size:15px;border-bottom:1px solid #F1F3F7}
.mnav-act{display:flex;gap:12px;margin-top:14px}
.mnav-act .btn{flex:1}
.mnav.open{display:block}

/* ============ hero ============ */
.hero{position:relative;height:378px;background:#F8FAFD;overflow:hidden}
.hero .track{position:absolute;inset:0}
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;
  transition:opacity 1.15s ease,visibility 0s linear 1.15s}
.slide.on{opacity:1;visibility:visible;z-index:2;transition:opacity 1.15s ease,visibility 0s}
.slide .slide-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.slide .inner{position:relative;z-index:3;height:378px;display:flex;align-items:center;justify-content:space-between;gap:40px;padding-top:6px}
.hero-txt{max-width:520px;flex:none}

.label{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#16181D}
.label:before{content:"";width:3px;height:14px;background:#E8590C}
.hero-txt h2{margin-top:14px;font-size:38px;line-height:1.28;font-weight:700;letter-spacing:-.4px}
.hero-txt h2 .b{color:var(--blue)}
.hero-txt p{margin-top:14px;font-size:13.5px;color:#4B5462;max-width:520px}
.hero-txt .act{margin-top:24px}
.hero-txt .btn{height:42px;padding:0 30px;font-size:14.5px}
.slide .an{opacity:0;transform:translateX(-36px)}
.slide .act.an{transform:translateY(16px)}   /* 按钮保持从下往上 */
.slide.on .an{animation:fromLeft .7s cubic-bezier(.22,.61,.36,1) forwards}
.slide.on .act.an{animation:up .6s cubic-bezier(.22,.61,.36,1) forwards}
.slide.on .an:nth-child(1){animation-delay:.28s}
.slide.on .an:nth-child(2){animation-delay:.38s}
.slide.on .an:nth-child(3){animation-delay:.48s}
.slide.on .an:nth-child(4){animation-delay:.58s}
@keyframes up{to{opacity:1;transform:none}}
@keyframes fromLeft{to{opacity:1;transform:none}}
.hctrl{position:absolute;z-index:9;left:0;right:0;bottom:58px}
.hctrl .wrap{display:flex;align-items:center;gap:14px}
.dots{display:flex;gap:8px}
.dots button{width:34px;height:4px;border:0;background:rgba(22,24,29,.42);cursor:pointer;padding:0;position:relative;overflow:hidden;border-radius:2px}
.dots button.on:after{content:"";position:absolute;inset:0;background:var(--blue);transform-origin:left;animation:fill 5s linear forwards}
.dots button.on.paused:after{animation-play-state:paused}
@keyframes fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.arrows{margin-left:auto;display:flex;gap:8px}
.arrows button{width:34px;height:34px;border:1px solid #E2E5EB;background:#fff;border-radius:50%;cursor:pointer;display:grid;place-items:center;color:#5A6472;transition:.2s}
.arrows button:hover{border-color:var(--blue);color:var(--blue)}
.arrows svg{width:14px;height:14px}

/* ============ quick ============ */
.quick{position:relative;z-index:20;margin-top:-46px}
.quick ul{display:flex;background:#fff;border-radius:6px;box-shadow:0 8px 26px rgba(20,32,64,.09);overflow:hidden}
.quick li{flex:1;border-right:1px solid var(--line)}
.quick li:last-child{border-right:0}
.quick li a{display:flex;align-items:center;gap:12px;padding:19px 14px;transition:background .2s}
.quick li a:hover{background:#FAFBFD}
.quick img{width:34px;height:34px;object-fit:contain;flex:none}
.quick b{display:block;font-size:14.5px;font-weight:600;line-height:1.4}
.quick span{display:block;font-size:12px;color:var(--ink3);margin-top:1px}

/* ============ section ============ */
.sec{padding:76px 0}
.sec.gray{background:var(--bg)}
.sec-h{text-align:center;margin-bottom:38px}
.sec-h h3{font-size:32px;font-weight:600;letter-spacing:-.5px}
.sec-h p{margin-top:12px;color:var(--ink2);font-size:15px}

/* products */
.ptabs{display:flex;align-items:center;height:56px;background:var(--blue);border-radius:6px;padding:0 10px;overflow:auto;scrollbar-width:none;-ms-overflow-style:none}
.ptabs::-webkit-scrollbar{display:none}
.ptabs button{height:36px;padding:0 22px;border:0;border-radius:4px;background:transparent;color:rgba(255,255,255,.85);font-size:14px;cursor:pointer;transition:.2s;white-space:nowrap}
.ptabs button.on{background:#fff;color:var(--blue);font-weight:600}
.ptabs .all{margin-left:auto;display:inline-flex;align-items:center;gap:6px;color:#fff;font-size:13px;opacity:.92;padding-left:12px;white-space:nowrap}
.ptabs .all svg{width:13px;height:13px}
.pshelf{margin-top:18px;background:#FAFBFD;border:1px solid var(--line);border-radius:6px;padding:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcard{background:#fff;border:1px solid var(--line);border-radius:6px;padding:22px 22px 0;transition:.25s;display:flex;flex-direction:column}
.pcard:hover{border-color:#C9D6F5;box-shadow:0 10px 26px rgba(20,32,64,.08)}
.pcard h4{font-size:17px;font-weight:600}
.pcard .tagline{font-size:12.5px;color:var(--ink3);margin:6px 0 18px}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
.specs div{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink3);background:#F5F7FA;border-radius:4px;padding:6px 10px;gap:6px}
.specs b{color:var(--ink);font-weight:600;white-space:nowrap}
.price{margin-top:18px;display:flex;align-items:baseline;gap:5px;color:var(--blue)}
.price .n{font-size:23px;font-weight:700}
.price .u{font-size:13px;font-weight:400;color:var(--ink3)}
.pcard .buy{margin:14px -22px 0;display:flex;align-items:center;justify-content:center;height:44px;background:var(--blue);color:#fff;font-size:14px;border-radius:0 0 5px 5px;transition:background .2s;margin-top:auto}
.pcard .buy:hover{background:var(--blue-d)}

/* market */
.mkt-lead{max-width:860px;margin:0 auto 34px;text-align:center;color:var(--ink2);font-size:14.5px}
.checks{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1000px;margin:0 auto 34px}
.checks div{display:flex;align-items:center;gap:10px;justify-content:center;font-size:14px;color:#2B303B}
.checks svg{width:20px;height:20px;stroke:var(--blue);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.svc6{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.svc6 a{background:#fff;border:1px solid var(--line);border-radius:6px;padding:24px 10px;text-align:center;transition:.22s;display:block}
.svc6 a:hover{border-color:#C9D6F5;transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,32,64,.06)}
.svc6 .ic{width:44px;height:44px;border-radius:10px;background:var(--blue-l);display:grid;place-items:center;margin:0 auto 12px}
.svc6 svg{width:22px;height:22px;stroke:var(--blue);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.svc6 span{font-size:13.5px;color:#2B303B}

/* solutions */
.sol{display:grid;grid-template-columns:300px 1fr;gap:56px;align-items:start}
.sol-list li{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:6px;cursor:pointer;color:var(--ink2);transition:.2s}
.sol-list li .no{font:600 13px/1 Arial;color:var(--ink3);letter-spacing:1px}
.sol-list li.on{background:var(--blue-l);color:var(--blue);font-weight:600}
.sol-list li.on .no{color:var(--blue)}
.sol-body h4{font-size:26px;font-weight:600}
.sol-body p{margin-top:14px;color:var(--ink2);font-size:14.5px}
.sol-stats{display:flex;gap:44px;margin-top:26px}
.sol-stats b{display:block;font-size:22px;color:var(--blue)}
.sol-stats span{font-size:12.5px;color:var(--ink3)}
.sol-media{margin-top:26px;border-radius:6px;border:1px solid var(--line);overflow:hidden;background:#F7F9FC;max-height:320px}
.sol-media img{display:block;width:100%;height:320px;object-fit:cover;object-position:center}
.sol-act{margin-top:22px}

/* why */
.why{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.why .c{background:#fff;border:1px solid var(--line);border-radius:6px;padding:28px 24px;transition:.25s}
.why .c:hover{border-color:#C9D6F5;box-shadow:0 12px 28px rgba(20,32,64,.07)}
.why .ico{width:46px;height:46px;border-radius:8px;background:var(--blue-l);display:grid;place-items:center;margin-bottom:18px}
.why .ico svg{width:24px;height:24px;stroke:var(--blue);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.why h5{font-size:16.5px;font-weight:600}
.why p{margin-top:10px;font-size:13.5px;color:var(--ink2);min-height:76px}
.why .ks{display:flex;gap:8px;flex-wrap:wrap}
.why .ks i{font-style:normal;font-size:12px;color:var(--blue);background:var(--blue-l);border-radius:3px;padding:3px 8px}

/* partners */
.plogos{display:grid;grid-template-columns:repeat(9,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.plogos div{background:#fff;height:86px;display:grid;place-items:center;padding:14px;transition:.2s}
.plogos div:hover{background:#FAFBFD}
.plogos img{height:34px;width:auto;opacity:.75;transition:.25s}
.plogos div:hover img{opacity:1}

/* infra */
.infra{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.infra .map img{width:100%;height:auto}
.infra h4{font-size:28px;font-weight:600;line-height:1.35}
.infra .sub{margin-top:14px;color:var(--ink2);font-size:14.5px}
.infra .nums{display:grid;grid-template-columns:1fr 1fr;gap:26px 40px;margin-top:34px}
.infra .nums b{display:block;font-size:30px;font-weight:700;color:var(--blue);letter-spacing:-.5px}
.infra .nums span{font-size:13px;color:var(--ink3)}
.cities{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.cities i{font-style:normal;font-size:12.5px;color:#2B303B;border:1px solid var(--line);border-radius:14px;padding:5px 12px}
.certs{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.certs i{font-style:normal;font-size:12px;color:var(--ink2);background:#F5F7FA;border-radius:3px;padding:5px 10px}

/* news */
.news{display:grid;grid-template-columns:420px 1fr;gap:40px;align-items:start}
.news .lead{border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:.25s;display:block;align-self:start}
.news .lead:hover{box-shadow:0 12px 28px rgba(20,32,64,.08)}
.news .lead .ph{height:236px;background:#EEF1F5;overflow:hidden}
.news .lead img{width:100%;height:100%;object-fit:cover}
.news .lead .tx{padding:20px 22px}
.news .lead .dt{font-size:12.5px;color:var(--ink3)}
.news .lead h5{margin-top:8px;font-size:18px;font-weight:600}
.news-list li{border-bottom:1px dashed var(--line)}
.news-list li a{display:flex;gap:16px;padding:16px 0;align-items:center}
.news-list img{width:112px;height:64px;object-fit:cover;border-radius:4px;background:#EEF3FE;flex:none}
.news-list h6{font-size:14.5px;font-weight:500;transition:color .2s}
.news-list li:hover h6{color:var(--blue)}
.news-list .dt{font-size:12px;color:var(--ink3);margin-top:6px}
.news .more{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font-size:13.5px;color:var(--blue)}
.news .more svg{width:13px;height:13px}

/* cta */
.cta{position:relative;overflow:hidden;background:#111C2E url(/web/seven/assets/cta-pattern.svg) center/cover no-repeat}
.cta .over{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:64px 0;color:#fff}
.cta .over h4{font-size:30px;font-weight:600}
.cta .over p{margin-top:8px;font-size:14px;color:rgba(255,255,255,.72)}
.cta .btn{background:#fff;color:var(--blue);flex:none}
.cta .btn:hover{background:#EEF3FE}

/* footer */
footer{background:var(--dark);color:#94A3B8;padding:64px 0 0;font-size:13.5px}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:36px}
footer h5{color:#fff;font-size:14.5px;font-weight:600;margin-bottom:16px}
footer li{line-height:2.1}
footer li a:hover{color:#fff}
footer .brand p{margin-top:12px;font-size:13px;color:#7A8AA0;line-height:1.9}
footer .brand img{height:36px;opacity:.95}
footer .tel{margin-top:16px;color:#fff;font-size:19px;font-weight:600;letter-spacing:.5px}
.copy{margin-top:44px;border-top:1px solid rgba(255,255,255,.09);padding:22px 0;display:flex;justify-content:space-between;gap:12px;font-size:12.5px;color:#67788F;flex-wrap:wrap}

/* floating */
.side{position:fixed;right:24px;bottom:110px;z-index:90;display:flex;flex-direction:column;gap:10px}
.side .sc,.side .top{width:46px;height:46px;border:1px solid var(--line);background:#fff;border-radius:6px;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 18px rgba(20,32,64,.08);transition:.2s}
.side .sc:hover,.side .top:hover{color:var(--blue);border-color:var(--blue)}
.side svg{width:20px;height:20px;stroke:#4A5464;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.slide .an{opacity:1;transform:none}}


/* ============ 参考 cloud.hyydns.com 重构的组件 ============ */
.hero-txt .label i{display:inline-block;width:1px;height:12px;background:#C9D0DC;margin:0 2px}
.btn.sq{border-radius:3px;height:44px;padding:0 30px;font-size:15px}
.hero-txt h2{font-size:46px;line-height:1.2;letter-spacing:-1px;margin-top:16px}
.hero-txt p{margin-top:16px;font-size:15px;max-width:460px}
.hero-txt .act{margin-top:26px}

/* hero 底部悬浮卡 */
.qcards{position:relative;z-index:20;margin-top:-52px}
.qcards ul{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.qcards li{background:#fff;border-radius:6px;box-shadow:0 10px 30px rgba(20,32,64,.10);transition:.25s}
.qcards li:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(20,32,64,.14)}
.qcards li a{display:flex;align-items:center;gap:14px;padding:20px 18px}
.qcards .qi{width:52px;height:52px;flex:none;border-radius:6px;background:var(--blue-l);display:grid;place-items:center}
.qcards .qi svg{width:22px;height:22px;stroke:var(--blue);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.qcards b{display:block;font-size:15px;font-weight:600;line-height:1.4}
.qcards small{display:block;font-size:12.5px;color:var(--ink3);margin-top:3px}

/* 产品分类（图标 + 下划线） */
.hlink{color:var(--blue)}
.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:0 8px;border-bottom:1px solid var(--line);margin-bottom:30px}
.cats a{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 6px 18px;font-size:14px;color:#3A4250;transition:.2s;text-align:center}
.cats a i{display:grid;place-items:center;width:56px;height:56px}
.cats a svg{width:26px;height:26px;stroke:#5A6472;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:.2s}
.cats a:hover{color:var(--blue)}
.cats a:hover svg{stroke:var(--blue)}
.cats a.on{color:var(--blue);font-weight:600}
.cats a.on svg{stroke:var(--blue)}
.cats a.on:after{content:"";position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);width:64px;height:2px;background:var(--blue)}

/* 解决方案 */
.sol2{display:grid;grid-template-columns:460px 1fr;gap:44px;align-items:start}
.sol2-photo{position:relative;display:block;border-radius:6px;overflow:hidden;box-shadow:0 14px 34px rgba(20,32,64,.10)}
.sol2-photo .sol2-imgs{position:relative;height:330px;background:#F5F8FE}
.sol2-photo .sol2-imgs img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease,transform .5s ease}
.sol2-photo .sol2-imgs img.on{opacity:1}
.sol2-photo:hover .sol2-imgs img.on{transform:scale(1.03)}
.sol2-photo .cap{position:absolute;left:26px;right:26px;bottom:24px;background:#fff;border-radius:4px;padding:16px 18px;box-shadow:0 8px 22px rgba(20,32,64,.12)}
.sol2-photo .cap b{display:block;font-size:18px;font-weight:600}
.sol2-photo .cap span{display:block;font-size:12.5px;color:var(--ink3);margin-top:4px}
.sol2-tabs{display:flex;gap:10px;flex-wrap:wrap}
.sol2-tabs button{height:38px;padding:0 20px;border:0;border-radius:3px;background:#fff;color:#3A4250;font-size:14px;cursor:pointer;transition:.2s}
.sol2-tabs button:hover{color:var(--blue)}
.sol2-tabs button.on{background:var(--blue);color:#fff;font-weight:600}
.sol2-body p{margin-top:20px;color:var(--ink2);font-size:14.5px;line-height:1.9}
.sol2-list{margin-top:18px;display:grid;gap:12px}
.sol2-list li{position:relative;padding-left:26px;font-size:14px;color:#2B303B}
.sol2-list li:before{content:"";position:absolute;left:0;top:5px;width:14px;height:14px;border-radius:3px;background:var(--blue-l) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A56DB' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'><path d='M5 13l4 4 10-10'/></svg>") center/11px no-repeat}
.sol2-body .btn{margin-top:26px}

/* 为什么选择我们 2×2 */
.why2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.why2 .c{display:flex;align-items:flex-start;gap:22px;justify-content:space-between;background:#fff;border:1px solid var(--line);border-radius:6px;padding:28px 26px;transition:.25s}
.why2 .c:hover{border-color:#C9D6F5;box-shadow:0 12px 28px rgba(20,32,64,.07)}
.why2 h5{font-size:17px;font-weight:600}
.why2 p{margin-top:10px;font-size:13.5px;color:var(--ink2);line-height:1.85;max-width:320px}
.why2 .more2{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-size:13px;color:var(--blue)}
.why2 .more2 svg{width:13px;height:13px;transition:transform .2s}
.why2 .more2:hover svg{transform:translateX(3px)}
.why2 .tile{flex:none;width:76px;height:76px;border-radius:10px;background:#F2F6FF;display:grid;place-items:center}
.why2 .tile svg{width:34px;height:34px;stroke:var(--blue);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* 资源布局 */
.net{display:grid;grid-template-columns:1fr;gap:30px}
.net-tx{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.net-tx .blk+.blk{margin-top:0}
.net-tx h5{font-size:19px;font-weight:600}
.net-tx h5 b{color:var(--blue);font-size:26px;margin-right:6px;letter-spacing:-.5px}
.net-tx p{margin-top:8px;font-size:13.5px;color:var(--ink2);line-height:1.85}
.net-map img{display:block;width:100%;max-width:560px;height:auto;margin-left:auto}
.certs2{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.certs2 div{background:#fff;border:1px solid var(--line);border-radius:6px;padding:18px 14px;text-align:center}
.certs2 .bd{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 10px;border-radius:50%;background:var(--blue-l)}
.certs2 .bd svg{width:22px;height:22px;stroke:var(--blue);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.certs2 b{display:block;font-size:13.5px;font-weight:600}
.certs2 small{display:block;font-size:11.5px;color:var(--ink3);margin-top:4px}

/* 伙伴墙（三行左右交替无缝滚动，无线框分隔） */
.plogos2{position:relative;overflow:hidden;padding:4px 0;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.plogos2 .mrow{overflow:hidden}
.plogos2 .mrow+.mrow{margin-top:32px}
.plogos2 .mtrack{display:flex;width:max-content;will-change:transform;animation:pl-marquee 44s linear infinite}
.plogos2 .mrow-a .mtrack{animation-duration:44s;animation-delay:-1s}   /* 6 个 logo / 段 */
.plogos2 .mrow-b .mtrack{animation-duration:37s;animation-delay:-11s;animation-direction:reverse}
.plogos2 .mrow-c .mtrack{animation-duration:37s;animation-delay:-21s}
/* 注意：不要在这里加 :hover/:active 暂停。鼠标停在跑马灯上（点击后自然停留）会让三行停住，
   用户会以为是坏了；触摸屏点一下更会一直粘住 hover 状态。始终播放。 */
.plogos2 .mrow{overflow:hidden;cursor:default}
.plogos2,.plogos2 .mtrack i{-webkit-user-select:none;-moz-user-select:none;user-select:none}
.plogos2 .mtrack i{flex:0 0 auto;width:258px;height:84px;display:grid;place-items:center;padding:0 22px;font-style:normal}
.plogos2 .mtrack img{height:30px;width:auto;max-width:100%;opacity:1;pointer-events:none;-webkit-user-drag:none;user-select:none}
.plogos2 .mtrack i.big img{height:40px}   /* 香港/日本运营商方标，略微放大对齐视觉重量 */
@keyframes pl-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){.plogos2 .mtrack{animation:none}}

/* 价值带 */
.bands{background:var(--dark);padding:26px 0}
.bands ul{display:grid;grid-template-columns:repeat(4,1fr)}
.bands li{display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;font-size:14.5px;border-right:1px solid rgba(255,255,255,.09)}
.bands li:last-child{border-right:0}
.bands span{display:grid;place-items:center;width:32px;height:32px}
.bands svg{width:20px;height:20px;stroke:#7FA6FF;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* 新组件响应式 */
@media (max-width:1024px){
  .hero-txt h2{font-size:36px}
  .qcards{margin-top:-40px}
  .cats{grid-template-columns:repeat(4,1fr)}
  .sol2{grid-template-columns:1fr 1fr;gap:30px}
  .sol2-photo .sol2-imgs{height:290px}
  .why2{grid-template-columns:1fr}
  .net{grid-template-columns:1fr;gap:32px}
  .net-tx{grid-template-columns:repeat(3,1fr);gap:20px}
  .certs2{grid-template-columns:repeat(3,1fr)}
  .plogos2 .mtrack i{width:206px}
  .bands ul{grid-template-columns:1fr 1fr;gap:16px}
  .bands li{border-right:0;justify-content:flex-start}
}
@media (max-width:767px){
  .hero-txt h2{font-size:23px;letter-spacing:-.4px;margin-top:8px}
  .hero-txt p{font-size:12.5px;margin-top:8px}
  .hero-txt .label i{background:rgba(0,0,0,.18)}
  .btn.sq{height:38px;padding:0 22px;font-size:14px}
  .qcards{margin-top:0;padding-top:14px}
  .qcards ul{grid-template-columns:1fr;gap:10px}
  .qcards li{box-shadow:0 6px 18px rgba(20,32,64,.07)}
  .qcards li a{padding:14px 14px;gap:12px}
  .qcards .qi{width:44px;height:44px}
  .qcards b{font-size:14px}
  .cats{grid-template-columns:repeat(3,1fr)}
  .cats a{padding:12px 4px 14px;font-size:12.5px}
  .cats a i{width:44px;height:44px}
  .cats a.on:after{width:40px}
  .sol2{grid-template-columns:1fr;gap:24px}
  .sol2-photo .sol2-imgs{height:230px}
  .sol2-photo .sol2-imgs img{object-position:center 42%}
  .sol2-photo{background:#fff}
  .sol2-photo .cap{position:static;left:auto;right:auto;bottom:auto;box-shadow:none;border-top:1px solid var(--line);padding:14px 16px}
  .sol2-photo .cap{left:14px;right:14px;bottom:14px;padding:12px 14px}
  .sol2-photo .cap b{font-size:16px}
  .sol2-tabs{gap:8px}
  .sol2-tabs button{height:34px;padding:0 14px;font-size:13px}
  .sol2-body p{font-size:13.5px;line-height:1.8}
  .sol2-list li{font-size:13px}
  .why2 .c{padding:20px 18px;gap:14px}
  .why2 .tile{width:56px;height:56px;border-radius:8px}
  .why2 .tile svg{width:26px;height:26px}
  .why2 p{max-width:none}
  .net-tx{grid-template-columns:1fr;gap:16px}
  .net-tx h5{font-size:17px}
  .net-tx h5 b{font-size:22px}
  .certs2{grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
  .plogos2 .mrow+.mrow{margin-top:20px}
  .plogos2 .mtrack i{width:150px;height:64px;padding:0 12px}
  .plogos2 .mtrack img{height:24px}
  .plogos2 .mtrack i.big img{height:31px}
  .bands ul{grid-template-columns:1fr;gap:12px}
  .bands{padding:20px 0}
}

/* ============ 响应式 ============ */
@media (max-width:1260px){
  .wrap{width:100%;padding-left:20px;padding-right:20px}
  .infra{gap:40px}
}
@media (max-width:1024px){
  .hd{gap:20px;height:64px}
  nav,.hd-right .btn{display:none}
  .hd-right{gap:16px}
  .burger{display:block}
  .nav-open nav{display:none}
  .hero{height:344px}
  .slide .inner{height:344px}
  .hero-visual img{max-width:380px}
  .hero-txt h2{font-size:32px}
  .quick{margin-top:-34px}
  .quick ul{flex-wrap:wrap}
  .quick li{flex:1 1 33.33%;border-bottom:1px solid var(--line)}
  .quick li:nth-child(3n){border-right:0}
  .sec{padding:56px 0}
  .sec-h h3{font-size:26px}
  .pshelf{grid-template-columns:1fr 1fr;padding:18px;gap:16px}
  .svc6{grid-template-columns:repeat(3,1fr)}
  .checks{grid-template-columns:1fr 1fr;gap:14px;max-width:100%}
  .checks div{justify-content:flex-start}
  .sol{grid-template-columns:1fr;gap:26px}
  .sol-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .why{grid-template-columns:1fr 1fr}
  .plogos{grid-template-columns:repeat(4,1fr)}
  .infra{grid-template-columns:1fr}
  .infra .map{order:2}
  .news{grid-template-columns:1fr;gap:26px}
  footer .cols{grid-template-columns:1fr 1fr 1fr;gap:28px}
  .cta .over{padding:0 32px}
  .cta .over h4{font-size:22px}
  .side{display:none}
}
@media (max-width:767px){
  .hd-right{display:none}
  /* 手机端：整幅竖版图铺满 hero，深色文字直接压在图上（只靠白色光晕保可读，不加任何色块/黑边） */
  .hero{height:370px;background:#F8FAFD}
  .slide .slide-img{object-position:center center}
  .slide .inner{height:370px;padding:0 18px 34px;align-items:flex-end;z-index:3}
  .hero-txt{max-width:100%;color:#16181D}
  .hero-txt .label{font-size:11.5px;color:#16181D;text-shadow:0 0 8px rgba(255,255,255,.95),0 0 18px rgba(255,255,255,.8)}
  .hero-txt .label:before{background:#E8590C}
  .hero-txt h2{font-size:22px;line-height:1.3;margin-top:8px;color:#16181D;
    text-shadow:0 0 10px rgba(255,255,255,.95),0 0 22px rgba(255,255,255,.85),0 1px 2px rgba(255,255,255,.9)}
  .hero-txt h2 .b{color:#1A56DB}
  .hero-txt p{font-size:12px;line-height:1.55;margin-top:8px;color:#4B5462;
    text-shadow:0 0 10px rgba(255,255,255,.95),0 0 20px rgba(255,255,255,.8)}
  .hero-txt .act{margin-top:14px}
  .hero-txt .btn{height:36px;padding:0 22px;font-size:13.5px}
  .hctrl{bottom:10px}
  .dots button{width:24px}
  .arrows button{width:30px;height:30px}
  .quick{margin-top:0;padding-top:18px}
  .quick li{flex:1 1 50%;padding:0}
  .quick li:nth-child(2n){border-right:0}
  .quick li a{padding:14px 12px;gap:10px}
  .quick li:nth-child(2n){border-right:0}
  .quick img{width:28px;height:28px}
  .quick b{font-size:13.5px}
  .quick span{display:none}
  .sec{padding:44px 0}
  .sec-h{margin-bottom:26px}
  .sec-h h3{font-size:21px;line-height:1.4}
  .sec-h p{font-size:13px;margin-top:8px}
  .ptabs{height:auto;flex-wrap:wrap;padding:8px;gap:6px}
  .ptabs button{padding:0 14px;height:32px;font-size:13px}
  .ptabs .all{margin-left:0;padding:8px 6px}
  .pshelf{grid-template-columns:1fr;padding:14px}
  .svc6{grid-template-columns:1fr 1fr}
  .sol-list{grid-template-columns:1fr}
  .sol-body h4{font-size:19px}
  .sol-stats{gap:24px}
  .why{grid-template-columns:1fr}
  .why p{min-height:0}
  .plogos{grid-template-columns:repeat(3,1fr)}
  .plogos div{height:70px;padding:10px}
  .infra h4{font-size:20px}
  .infra .nums{grid-template-columns:1fr 1fr;gap:18px}
  .infra .nums b{font-size:24px}
  .news .lead .ph{height:180px}
  .news-list img{width:88px;height:54px}
  .news-list h6{font-size:13.5px}
  .cta .over{padding:36px 20px;flex-direction:column;align-items:flex-start}
  .cta .over h4{font-size:18px}
  footer{padding-top:40px}
  footer .cols{grid-template-columns:1fr 1fr;gap:22px}
  footer .brand{grid-column:1/-1}
  .copy{flex-direction:column;gap:6px;font-size:12px}
  .side{display:none}
}

/* ============ 按钮 / 带边框控件：一律四角直角 ============ */
button,
.btn,
.btn.sq,
.btn.line,
.hero-txt .btn,
.hero-txt .act a,
.pcard .buy,
.ptabs button,
.sol2-tabs button,
.arrows button,
.arrows button:hover,
.dots button,
.dots button.on,
.dots button.on:after,
.side .sc,
.side .top,
.mnav a,
.cats a.on:after{border-radius:0 !important}

/* ============ 修复：hero 文案与指示条间距 / 手机菜单里的登录按钮 ============ */
@media (min-width:768px){
  .slide .inner{padding-bottom:104px}          /* 文案整体上移，和底部指示条拉开距离 */
}
.mnav .mnav-act a{
  display:inline-flex;align-items:center;justify-content:center;
  height:44px;padding:0 12px;border:0;border-bottom:0;font-size:15px;
  flex:1;margin:0;border-radius:0
}
.mnav .mnav-act a:not(.line){background:var(--blue);color:#fff}
.mnav .mnav-act a.line{border:1px solid var(--blue);color:var(--blue);background:#fff}

/* ============ 平铺世界地图 ============ */
.net-map .globe{max-width:100%;margin:0;position:relative;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#EAF3FD}
.net-map canvas{display:block;width:100%;height:auto}

/* ============ 客服悬浮按钮：真人头像 ============ */
.side .sc.cs{padding:0;border:0;background:none;width:54px;height:54px;border-radius:50%;overflow:visible;position:relative;box-shadow:0 6px 18px rgba(20,32,64,.16)}
.side .sc.cs img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;border:0;box-sizing:border-box;box-shadow:0 4px 14px rgba(10,20,40,.18)}
.side .sc.cs .online{position:absolute;right:1px;bottom:1px;width:11px;height:11px;border-radius:50%;background:#22C55E;border:0;box-sizing:content-box;box-shadow:0 0 0 1px rgba(10,20,40,.10)}
.side .sc.cs .tip{position:absolute;right:66px;top:50%;transform:translateY(-50%);background:rgba(17,28,46,.92);color:#fff;font-size:12px;font-weight:400;line-height:1;padding:8px 10px;border-radius:3px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s}
.side .sc.cs:hover .tip{opacity:1}

/* 手机/平板也显示悬浮客服，尺寸收小 */
@media (max-width:1024px){
  .side{display:flex;right:14px;bottom:88px;gap:8px}
  .side .sc.cs{width:48px;height:48px}
  .side .top{width:40px;height:40px}
  .side .sc.cs .tip{display:none}
}
@media (max-width:767px){
  .side{display:flex;right:12px;bottom:74px;gap:8px}
  .side .sc.cs{width:46px;height:46px}
  .side .top{width:38px;height:38px}
  .side .top svg{width:17px;height:17px}
}

/* ============ 客服对话窗口 ============ */
.cs-panel{position:fixed;right:24px;bottom:178px;z-index:95;width:336px;height:min(580px,calc(100vh - 200px));max-height:none;
  display:none;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:4px;
  box-shadow:0 18px 48px rgba(16,28,52,.18);overflow:hidden}
.cs-panel.open{display:flex;animation:csIn .18s ease-out}
@keyframes csIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cs-hd{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:#F7FAFF}
.cs-hd img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:0;box-shadow:0 2px 6px rgba(20,32,64,.12)}
.cs-hd .who{flex:1;min-width:0}
.cs-hd b{display:block;font-size:14px;color:var(--ink)}
.cs-hd span{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink3);margin-top:2px}
.cs-hd span i{width:6px;height:6px;border-radius:50%;background:#22C55E;flex:none}
.cs-x{border:0;background:none;font-size:20px;line-height:1;color:#98A2B3;cursor:pointer;padding:2px 4px}
.cs-x:hover{color:var(--ink)}
.cs-body{flex:1;overflow-y:auto;padding:14px;background:#FBFCFE}
.cs-msg{display:flex;flex-wrap:wrap;margin-bottom:10px}
.cs-msg p{max-width:82%;font-size:13px;line-height:1.7;padding:9px 12px;border-radius:4px}
.cs-msg.agent p{background:#fff;border:1px solid var(--line);color:#2B303B}
.cs-msg.user{justify-content:flex-end}
.cs-msg.user p{background:var(--blue);color:#fff}
.cs-chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 2px}
.cs-chips button{border:1px solid #D7E2F7;background:#fff;color:var(--blue);font-size:12px;line-height:1;
  padding:8px 10px;border-radius:3px;cursor:pointer;transition:.18s}
.cs-chips button:hover{background:var(--blue-l);border-color:var(--blue)}
.cs-ft{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.cs-ft input{flex:1;height:36px;border:1px solid var(--line);border-radius:3px;padding:0 10px;font-size:13px;color:var(--ink);outline:none;font-family:inherit}
.cs-ft input:focus{border-color:var(--blue)}
.cs-ft button{height:36px;padding:0 16px;border:0;border-radius:3px;background:var(--blue);color:#fff;font-size:13px;cursor:pointer}
.cs-ft button:hover{background:var(--blue-d)}
.cs-opts{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px 10px;background:#fff;font-size:11.5px;color:var(--ink3)}
.cs-opts a{color:var(--blue)}
.cs-switch{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.cs-switch input{position:absolute;opacity:0;width:0;height:0}
.cs-switch i{width:26px;height:14px;border-radius:0;background:#D7DEE9;position:relative;transition:.2s;flex:none}
.cs-switch i:after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;background:#fff;transition:.2s}
.cs-switch input:checked + i{background:var(--blue)}
.cs-switch input:checked + i:after{left:14px}
.cs-src{margin-top:6px;flex:0 0 100%;max-width:82%;font-size:11px;line-height:1.6;color:var(--ink3)}
.cs-src b{display:block;color:#98A2B3;font-weight:400;margin-bottom:2px}
.cs-src a{display:block;color:var(--blue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.cs-src a:hover{text-decoration:underline}
@media (max-width:1024px){
  .cs-panel{right:14px;bottom:152px;width:320px;height:min(540px,calc(100vh - 170px))}
}
@media (max-width:767px){
  .cs-panel{right:12px;left:12px;width:auto;bottom:128px;height:min(72vh,560px);max-height:none}
}

/* ============ 图标位改用 3D 图片（替换原 line SVG） ============ */
.cats a i img{display:block;width:56px;height:56px;object-fit:contain}
.qcards .qi img{display:block;width:44px;height:44px;object-fit:contain}
.why2 .tile img{display:block;width:56px;height:56px;object-fit:contain}
.certs2 .bd img{display:block;width:38px;height:38px;object-fit:contain}
.bands span img{display:block;width:30px;height:30px;object-fit:contain}
.certs2 .bd{background:#F7FAFF}
@media (max-width:767px){
  .cats a i img{width:44px;height:44px}
  .why2 .tile img{width:44px;height:44px}
  .certs2 .bd img{width:30px;height:30px}
  .bands span img{width:22px;height:22px}
}

/* 客服头像：元素本身也必须是圆，否则 box-shadow 会画出一个方形阴影 */
.side .sc.cs{border-radius:50% !important;box-shadow:0 3px 12px rgba(10,20,40,.16)}
.side .sc.cs:hover{border-color:transparent}

/* ============ 移动端导航：左侧抽屉（从左往右滑出，占半屏以上） ============ */
.mnav-mask{display:none;position:fixed;inset:0;background:rgba(12,20,36,.45);z-index:190;opacity:0;transition:opacity .28s ease}
.mnav-mask.on{display:block;opacity:1}
@media (max-width:1024px){
  .mnav{
    display:block;position:fixed;left:0;top:0;bottom:0;z-index:200;
    width:62%;max-width:340px;min-width:240px;height:100%;
    background:#fff;border-top:0;border-right:1px solid var(--line);
    padding:0 0 20px;overflow-y:auto;
    transform:translateX(-102%);transition:transform .32s cubic-bezier(.22,.61,.36,1);
    box-shadow:12px 0 32px rgba(12,20,36,.12);
    will-change:transform;
  }
  .mnav.open{transform:translateX(0)}
  .mnav-hd{display:flex;align-items:center;justify-content:flex-end;position:sticky;top:0;
    background:#fff;border-bottom:1px solid var(--line);padding:14px 18px;margin-bottom:2px}
  .mnav-x{border:0;background:none;font-size:22px;line-height:1;color:#98A2B3;cursor:pointer;padding:0 2px}
  .mnav-x:hover{color:var(--ink)}
  .mnav a{padding:14px 18px;font-size:15px}
  .mnav-act{padding:0 18px;margin-top:18px}
}
@media (min-width:1025px){
  .mnav,.mnav-mask{display:none !important}
}

/* 图标尺寸（3D 图标留白多，容器略放大） */
.cats a i img{width:54px;height:54px}
.certs2 .bd img{width:34px;height:34px}
.bands span img{width:28px;height:28px}
.bands span img{width:28px;height:28px;object-fit:contain}

/* ============ 直角统一：所有方形元素四角为 0 ============ */
.pshelf,.pcard,.pcard .buy,.specs div,.cats,.cats a i,
.qcards li,.qcards .qi,.why2 .c,.why2 .tile,
.certs2 div,.certs2 .bd,
.plogos2,.plogos2 div,.plogos2 img,
.sol2-photo,.sol2-photo .cap,.sol2-tabs button,.sol2-list li:before,
.news .lead,.news-list img,.news .more svg,
.cs-panel,.cs-msg p,.cs-chips button,.cs-ft input,.cs-ft button,.cs-src,
.cs-hd,.cs-hd img:not(.sc),
.mnav,.mnav a,.mnav-act a,.mnav-x,
.dots button,.hctrl .dots button,
.checks svg,.svc6 a,.why .c,.why .ico{border-radius:0 !important}
/* 头像与在线圆点保持圆形 */
.side .sc.cs,.side .sc.cs img,.side .sc.cs .online,.cs-hd img{border-radius:50% !important}

/* hero 悬浮卡：两列两行 */
.qcards ul{grid-template-columns:repeat(2,1fr)}
@media (max-width:767px){
  .qcards ul{grid-template-columns:repeat(2,1fr);gap:8px}
  .qcards li a{padding:12px 10px;gap:8px}
  .qcards .qi{width:34px;height:34px}
  .qcards .qi img{width:30px;height:30px}
  .qcards b{font-size:12.5px;line-height:1.35}
  .qcards small{font-size:11px;margin-top:2px}
}

/* 手机端悬浮卡：标题按词换行，藏掉副标题避免挤压 */
@media (max-width:767px){
  .qcards small{display:none}
  .qcards b{font-size:12.5px;word-break:keep-all;overflow-wrap:normal;line-height:1.4}
  .qcards li a{align-items:center}
}

/* ============ 内页（统一版式，替代 default 模板回落） ============ */
.p-hero{background:#F5F8FE;border-bottom:1px solid var(--line);padding:44px 0 46px;overflow:hidden}
/* 右侧配图：文字一栏 + 图一栏（图左缘渐隐，融进 band 底色） */
.p-hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,600px);column-gap:52px;align-items:center;align-content:center;row-gap:0}
.p-hero .ph-bg{grid-column:2;grid-row:1 / span 3;width:100%;height:auto;display:block;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20%,#000 86%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 20%,#000 86%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%,#000 84%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.p-hero .crumb{grid-column:1;font-size:13px;color:var(--ink3);display:flex;align-items:center;gap:8px}
.p-hero .crumb a{color:var(--ink3)}
.p-hero .crumb a:hover{color:var(--blue)}
.p-hero .crumb i{font-style:normal;color:#C9D0DC}
.p-hero h1{grid-column:1;margin-top:14px;font-size:38px;line-height:1.25;font-weight:700;letter-spacing:-.6px;color:var(--ink)}
.p-hero p{grid-column:1;margin-top:14px;max-width:760px;font-size:15px;line-height:1.85;color:var(--ink2)}
@media (max-width:900px){
  .p-hero{padding:34px 0 0}
  .p-hero .wrap{grid-template-columns:1fr;column-gap:0}
  .p-hero h1{font-size:29px}
  .p-hero .ph-bg{grid-column:1;grid-row:auto;order:9;margin-top:20px;width:100%;height:auto;aspect-ratio:16/7.4;
    object-fit:cover;object-position:center 42%;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%,#000 88%,transparent 100%);
            mask-image:linear-gradient(180deg,transparent 0,#000 30%,#000 88%,transparent 100%)}
}

.p-blk{margin-bottom:34px}
.p-blk h3{font-size:22px;font-weight:600;margin-bottom:14px;letter-spacing:-.3px}
.p-blk p{font-size:14.5px;line-height:1.95;color:var(--ink2);margin-bottom:12px}
.p-blk p:last-child{margin-bottom:0}

.cards3,.cards4{display:grid;gap:20px;margin-bottom:36px}
.cards3{grid-template-columns:repeat(3,1fr)}
.cards4{grid-template-columns:repeat(4,1fr)}
.cards3 .cd,.cards4 .cd{background:#fff;border:1px solid var(--line);padding:26px 22px;transition:.22s}
.cards3 .cd:hover,.cards4 .cd:hover{border-color:#C9D6F5;box-shadow:0 10px 26px rgba(20,32,64,.06)}
.cd .ci{display:block;width:56px;height:56px;margin-bottom:14px}
.cd .ci img{width:52px;height:52px;object-fit:contain}
.cd h4{font-size:16.5px;font-weight:600;margin-bottom:8px}
.cd p{font-size:13.5px;line-height:1.85;color:var(--ink2)}

.plist{margin:0}
.plist li{position:relative;padding-left:20px;font-size:14.5px;line-height:2;color:#2B303B}
.plist li:before{content:"";position:absolute;left:0;top:13px;width:6px;height:6px;background:var(--blue)}

.steplist{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:36px}
.steplist .st{background:#F7FAFF;border-left:3px solid var(--blue);padding:20px 18px}
.steplist b{display:block;font-size:20px;color:var(--blue);font-weight:700;letter-spacing:-.5px}
.steplist h5{margin-top:6px;font-size:15.5px;font-weight:600}
.steplist p{margin-top:6px;font-size:13px;line-height:1.8;color:var(--ink2)}

.faqbox{border:1px solid var(--line);margin-bottom:34px}
.faqbox details{border-bottom:1px solid var(--line);background:#fff}
.faqbox details:last-child{border-bottom:0}
.faqbox summary{cursor:pointer;padding:16px 20px;font-size:15px;font-weight:600;list-style:none;position:relative}
.faqbox summary::-webkit-details-marker{display:none}
.faqbox summary:before{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--blue);font-size:18px;font-weight:400}
.faqbox details[open] summary:before{content:"–"}
.faqbox summary:hover{color:var(--blue)}
.faqbox .ans{padding:0 20px 18px;font-size:14px;line-height:1.9;color:var(--ink2)}

.spectable{width:100%;border-collapse:collapse;margin-bottom:34px;font-size:14px}
.spectable th,.spectable td{border:1px solid var(--line);padding:14px 16px;text-align:left}
.spectable thead th{background:#F7FAFF;font-weight:600;font-size:13.5px;color:var(--ink)}
.spectable tbody tr:nth-child(even){background:#FBFCFE}
.spectable td:first-child{width:44%;color:var(--ink)}
.spectable td:last-child{color:var(--ink2)}

.contactbox{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-bottom:34px}
.contactbox .cb{background:#fff;border:1px solid var(--line);padding:22px 20px}
.contactbox .cb b{display:block;font-size:13px;color:var(--ink3);font-weight:400;margin-bottom:6px}
.contactbox .cb span{font-size:15px;color:var(--ink);font-weight:600;line-height:1.6}

.pcta{background:#F0F5FF;border:1px solid #DCE7FA;padding:32px 34px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:44px 0 8px}
.pcta h4{font-size:20px;font-weight:600}
.pcta p{margin-top:6px;font-size:13.5px;color:var(--ink2)}

@media (max-width:1024px){
  .p-hero h1{font-size:30px}
  .cards3,.cards4{grid-template-columns:repeat(2,1fr)}
  .steplist{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
  .p-hero{padding:30px 0 32px}
  .p-hero h1{font-size:24px}
  .p-hero p{font-size:13.5px}
  .cards3,.cards4{grid-template-columns:1fr;gap:14px}
  .steplist{grid-template-columns:1fr}
  .contactbox{grid-template-columns:1fr}
  .pcta{flex-direction:column;align-items:flex-start;padding:24px 20px}
  .spectable th,.spectable td{padding:10px 12px;font-size:13px}
}

/* ============ 登录 / 注册 / 找回密码（安东自有版式：顶部蓝线 + 磨砂窄面板 + 下划线输入） ============ */
body.auth{min-height:100vh;display:flex;flex-direction:column;
  background:#F6F9FE url(/web/seven/assets/auth-bg.jpg?v=1) center center/cover no-repeat}
.au-top{height:72px;display:flex;align-items:center;padding:0 56px;flex:none}
.au-top img{height:30px;width:auto;display:block}

.au-wrap{flex:1;display:flex;align-items:center;padding:0 56px 44px}
.au-card{position:relative;width:420px;background:rgba(255,255,255,.95);
  -webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
  border:1px solid rgba(26,86,219,.10);border-top:3px solid var(--blue);
  box-shadow:0 34px 66px -34px rgba(12,26,54,.36);
  padding:38px 40px 32px;border-radius:0}

.au-corner{position:absolute;right:18px;top:13px;background:none;border:0;color:#9AA5B8;
  font-size:12.5px;line-height:1;padding:6px 0 6px 8px;transition:.2s}
.au-corner::after{content:"\2192";margin-left:5px;font-size:11px}
.au-corner:hover{color:var(--blue)}

.au-card h1{font-size:27px;font-weight:700;letter-spacing:-.4px;color:var(--ink);
  position:relative;padding-bottom:14px}
.au-card h1::after{content:"";position:absolute;left:0;bottom:0;width:30px;height:3px;background:var(--blue)}
.au-reg{margin-top:13px;font-size:13px;color:var(--ink3)}
.au-reg a{color:var(--blue)}
.au-reg a:hover{text-decoration:underline}

.au-tabs{margin-top:26px;display:flex;gap:28px;flex-wrap:wrap;border-bottom:1px solid #E9EEF6}
.au-tabs button{position:relative;background:none;border:0;padding:0 0 12px;font-size:13.5px;
  color:#8A94A6;cursor:pointer;border-radius:0;transition:.2s}
.au-tabs button:hover{color:var(--ink)}
.au-tabs button.on{color:var(--blue);font-weight:600}
.au-tabs button.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--blue)}

.au-pane{margin-top:22px;display:flex;flex-direction:column;gap:18px}
.au-field{display:flex;flex-direction:column;gap:6px}
.au-field label{font-size:12px;color:#96A1B4;letter-spacing:.2px}
.au-input{height:44px;width:100%;border:0;border-bottom:1px solid #DDE4EF;background:transparent;
  padding:0 2px;font-size:14.5px;color:var(--ink);border-radius:0;font-family:inherit;transition:.2s}
.au-input::placeholder{color:#B9C1CE}
.au-input:focus{outline:none;border-bottom-color:var(--blue);box-shadow:0 1px 0 var(--blue)}

.au-code{display:flex;gap:12px;align-items:flex-end}
.au-code .au-input{flex:1}
.au-code-btn{flex:none;width:118px;height:44px;border:1px solid #DDE4EF;background:#fff;color:var(--blue);
  font-size:12.5px;cursor:pointer;border-radius:0;transition:.2s}
.au-code-btn:hover:not([disabled]){border-color:var(--blue);background:#F4F8FF}
.au-code-btn[disabled]{opacity:.55;cursor:not-allowed}

.au-tip{min-height:18px;margin-top:12px;font-size:13px;color:#E5484D}
.au-tip.ok{color:#17803D}
.au-btn{width:100%;height:50px;background:linear-gradient(90deg,#1A56DB,#2E6BEA);color:#fff;border:0;
  font-size:15px;font-weight:600;letter-spacing:1px;cursor:pointer;border-radius:0;transition:.2s;
  box-shadow:0 16px 28px -20px rgba(26,86,219,.95)}
.au-btn:hover:not([disabled]){background:linear-gradient(90deg,#1546B4,#1F5BD6);transform:translateY(-1px)}
.au-btn[disabled]{opacity:.6;cursor:not-allowed;transform:none}
.au-btn2{width:100%;height:40px;margin-top:12px;background:none;border:0;color:#8A94A6;font-size:13px;
  cursor:pointer;border-radius:0;transition:.2s}
.au-btn2:hover{color:var(--blue)}
.au-check{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink2);margin-top:16px}
.au-check input{width:14px;height:14px;accent-color:var(--blue)}
.au-check a{color:var(--blue)}
.au-help{margin-top:16px;font-size:12.5px;color:#96A1B4;text-align:center}
.au-help a{color:var(--blue)}

.au-icp{flex:none;padding:0 0 20px;text-align:center;font-size:12px;color:#93A0B4}

@media (max-width:1024px){
  .au-top{height:64px;padding:0 24px}
  .au-top img{height:27px}
  .au-wrap{padding:22px 24px 38px;align-items:flex-start}
  .au-card{width:100%;max-width:420px;margin:0 auto;padding:34px 26px 26px}
}
@media (max-width:767px){
  body.auth{background-size:auto 100%}
  .au-top{height:58px;padding:0 16px}
  .au-wrap{padding:14px 14px 30px}
  .au-card{width:100%;max-width:none;padding:30px 20px 24px;box-shadow:0 20px 44px -26px rgba(12,26,54,.34)}
  .au-card h1{font-size:23px;padding-bottom:12px}
  .au-tabs{gap:22px;margin-top:22px}
  .au-pane{gap:16px;margin-top:18px}
  .au-input,.au-btn{height:46px;font-size:16px}   /* 16px 防 iOS 聚焦放大 */
  .au-code-btn{width:110px;font-size:12px;height:46px}
  .au-corner{right:14px;top:10px;font-size:12px}
  .au-icp{font-size:11px;padding-bottom:14px}
}
.au-pane[hidden]{display:none !important}

/* ============ 顶部导航「安装宝塔」按钮 ============ */
nav a.btbtn{align-self:center;height:36px;padding:0 15px;gap:6px;background:var(--blue);color:#fff;border:1px solid var(--blue);border-radius:4px;font-weight:600;font-size:14px}
nav a.btbtn svg{width:15px;height:15px;flex:none}
nav a.btbtn:hover{background:var(--blue-d);color:#fff;border-color:var(--blue-d)}
.mnav a.mnav-bt{display:flex;align-items:center;justify-content:space-between;background:var(--blue-l);color:var(--blue);font-weight:600;padding:12px;margin:10px 0 4px;border:0}
.mnav a.mnav-bt em{font-style:normal;font-size:12px;line-height:20px;padding:0 8px;background:var(--blue);color:#fff}
@media (max-width:767px){nav a.btbtn{display:none}}

/* ===== 顶栏登录态（已登录：头像 + 用户名 + 下拉） ===== */
.hd-auth{display:flex;align-items:center;gap:24px}
.u-box{position:relative;display:inline-flex;align-items:center}
.u-btn{display:inline-flex;align-items:center;gap:9px;text-decoration:none}
.u-ava-wrap{position:relative;width:30px;height:30px;flex:none;display:inline-flex}
.u-ava{width:30px;height:30px;border-radius:50%;object-fit:cover;background:var(--blue-l);display:block}
.u-ava-txt{width:30px;height:30px;border-radius:50%;background:var(--blue);color:#fff;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}
.u-name{font-size:14px;color:var(--ink2);max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-box:hover .u-name,.u-box.open .u-name{color:var(--blue)}
.u-drop{position:absolute;top:100%;right:0;padding-top:8px;min-width:168px;display:none;z-index:80}
.u-drop>a,.u-drop>.sep{background:#fff}
.u-drop{filter:drop-shadow(0 8px 22px rgba(15,23,42,.12))}
.u-box.open .u-drop,.u-box:hover .u-drop{display:block}
.u-drop>a{display:block;padding:9px 16px;font-size:13.5px;color:var(--ink2);white-space:nowrap}
.u-drop>a:first-child{border-radius:4px 4px 0 0}
.u-drop>a:hover{background:var(--blue-l);color:var(--blue)}
.u-drop>.sep{height:1px;margin:6px 0;background:var(--line)}
.u-drop>a:last-child{border-radius:0 0 4px 4px}
.mnav-act.is-user{flex-direction:column;align-items:stretch;gap:10px;margin-top:18px}
.mnav .mnav-act a.m-u-box{display:flex;align-items:center;gap:10px;padding:12px;background:var(--blue-l);border:0;border-radius:4px;text-decoration:none;color:var(--ink)}
.mnav .mnav-act a.m-u-box .u-name{color:var(--ink);font-weight:600;max-width:none;font-size:15px}
.mnav .mnav-act a.m-u-box .u-ava,.mnav .mnav-act a.m-u-box .u-ava-txt{width:34px;height:34px}
.mnav .mnav-act a.m-u-out{width:100%;text-align:center;justify-content:center;display:flex;align-items:center}

/* ============ hero 实拍照片：桌面图左侧已烘焙白底，仅手机端需要竖向遮罩 ============ */
@media (max-width:767px){
  .slide:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
    background:linear-gradient(180deg,rgba(255,255,255,0) 12%,rgba(255,255,255,.55) 44%,rgba(255,255,255,.93) 74%,rgba(255,255,255,.99) 100%)}
}
