html,body{height:100%}
body{margin:0;background:#f4f7fb;color:#0f172a;font-family:"微软雅黑","新宋体",Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none}
ul,li{margin:0;padding:0;list-style:none}
*{box-sizing:border-box}

.wrap{width:1220px;margin:0 auto}
@media (max-width:1280px){.wrap{width:92%}}
.row{display:flex;align-items:center}
.between{justify-content:space-between}
.gap8{gap:8px}.gap10{gap:10px}.gap12{gap:12px}.gap14{gap:14px}.gap16{gap:16px}.gap18{gap:18px}
.bk10{height:10px}.bk14{height:14px}.bk18{height:18px}.bk24{height:24px}.bk28{height:28px}.bk34{height:34px}.bk44{height:44px}
.muted{color:#5b6c84}
@media (max-width:500px){.gap10:first-of-type{display:none}}

.titleRow{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.title{margin:0;color:#0b1220;font-size:22px;letter-spacing:.1px}
.sub{margin:10px 0 0 0;color:#5b6c84;font-size:13px;line-height:1.85}
.rightNote{color:#64748b;font-size:12px;padding:8px 10px;border:1px solid #e7edf6;background:#fff;border-radius:14px;box-shadow:0 10px 28px rgba(15,23,42,.06);white-space:nowrap}

/* 顶部通知条 */
.notice{background:#0b1220;color:rgba(255,255,255,.86);border-bottom:1px solid rgba(255,255,255,.10);font-size:12px}
.notice .wrap{padding:9px 0}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.82);white-space:nowrap;font-size:12px}
.dot{width:8px;height:8px;border-radius:999px;background:#34d399;box-shadow:0 0 0 4px rgba(52,211,153,.14)}

/* 头部导航 */
.header{background:#0b1220;color:#fff;border-bottom:1px solid rgba(255,255,255,.10);position:sticky;top:0;z-index:999}
.header .wrap{padding:14px 0}

/* ===== LOGO：云计算 SVG 图标 + 精简文字 ===== */
.brand{display:flex;align-items:center;gap:12px;min-width:150px}
.logo{
  width:44px;height:44px;border-radius:14px;
  background:linear-gradient(135deg,#58b6ff,#245bff);
  box-shadow:0 18px 60px rgba(36,91,255,.30);
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
}
.logo:after{
  content:"";position:absolute;inset:-40% -25%;
  background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.60), rgba(255,255,255,0) 58%);
  transform:rotate(11deg);pointer-events:none
}
.logo svg{position:relative;z-index:1;display:block}
.bname{font-weight:1000;font-size:16px;letter-spacing:.4px;line-height:1.1}

.nav{display:flex;align-items:center;gap:6px;position:relative}
.nav>li{position:relative}
.nav>li>a{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:12px;color:rgba(255,255,255,.88);font-size:13px;font-weight:900;transition:background .15s ease}
.nav>li>a:hover{background:rgba(255,255,255,.08)}
.nav>li>a.on{background:rgba(88,182,255,.18)}
.caret{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid rgba(255,255,255,.55);margin-top:2px}

 
.mega{
  position:fixed;left:0;right:0;width:auto;
  top:72px;background:rgba(255,255,255,.98);color:#0f172a;
  border-top:1px solid #e7edf6;border-bottom:1px solid #e7edf6;
  border-left:none;border-right:none;border-radius:0 0 18px 18px;
  box-shadow:0 28px 88px rgba(15,23,42,.28);
  overflow:hidden;display:none;z-index:999;
}
.nav>li.open .mega{display:block}
.mega .hd{
  padding:14px 16px;background:linear-gradient(180deg,#ffffff,#fbfdff);
  border-bottom:1px solid #eef3fb;display:flex;align-items:center;justify-content:space-between;gap:10px
}
.mega .bd{padding:14px 16px 16px 16px;max-height:calc(100vh - 120px);overflow:auto}
.mgrid{display:flex;gap:14px;flex-wrap:wrap}
.mcol{flex:0 0 calc(50% - 7px);min-width:360px}
@media (max-width:900px){.mcol{flex:1 1 100%;min-width:0}.mega{border-radius:0 0 16px 16px}}
.mlist a{display:flex;align-items:flex-start;gap:10px;border:1px solid #e7edf6;background:#fff;border-radius:16px;padding:12px 12px;margin-top:10px;transition:transform .08s ease, box-shadow .15s ease, border-color .15s ease}
.mlist a:hover{transform:translateY(-1px);border-color:#cfe2ff;box-shadow:0 14px 30px rgba(15,23,42,.08)}
.mi{width:34px;height:34px;border-radius:12px;background:#f3f8ff;border:1px solid #d9e6fb;display:flex;align-items:center;justify-content:center;color:#1d4ed8;font-weight:900;flex:0 0 auto}
.mt{font-weight:900;font-size:13px;color:#0b1220}
.ms{margin-top:6px;font-size:12px;color:#5b6c84;line-height:1.7}
.mb{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
.bp{display:inline-flex;align-items:center;gap:8px;padding:6px 9px;border-radius:999px;background:#f3f8ff;border:1px solid #d9e6fb;color:#1d4ed8;font-weight:900;font-size:11px;white-space:nowrap}
.bp i{font-style:normal;width:6px;height:6px;border-radius:999px;background:#245bff;box-shadow:0 0 0 3px rgba(36,91,255,.12)}
.mega .ft{padding:12px 16px;border-top:1px solid #eef3fb;background:#fbfdff;display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.link{display:inline-flex;align-items:center;justify-content:center;padding:9px 12px;border-radius:14px;background:#f3f8ff;border:1px solid #d9e6fb;color:#1d4ed8;font-weight:900;font-size:12px;white-space:nowrap}
.link:hover{background:#eaf3ff}
.nav > li.hasMega::after{content:"";position:absolute;left:0;right:0;top:100%;height:12px;background:transparent;}

.cta{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff;font-weight:900;font-size:13px;cursor:pointer;white-space:nowrap;transition:transform .08s ease, background .15s ease}
.btn:hover{background:rgba(255,255,255,.10)}
.btn:active{transform:translateY(1px)}
.btn.primary{border:1px solid rgba(88,182,255,.44);background:linear-gradient(135deg,#58b6ff,#245bff);box-shadow:0 18px 60px rgba(36,91,255,.26)}
.hamburger{display:inline-flex}
@media (max-width:1000px){.nav{display:none}}

.mnav{display:none;background:#0b1220;border-bottom:1px solid rgba(255,255,255,.10)}
.mnav.show{display:block}
.mnav .wrap{padding:12px 0}
.mnav a{display:block;padding:12px 12px;margin:8px 0;border-radius:14px;color:rgba(255,255,255,.86);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.mnav a:hover{background:rgba(255,255,255,.10)}
.mgroup{margin:10px 0;padding:10px 12px;color:rgba(255,255,255,.70);font-weight:900;font-size:12px;letter-spacing:.3px}

/* Hero */
.hero{
  background:
radial-gradient(900px 520px at 18% 8%, rgba(88,182,255,.28), rgba(88,182,255,0) 62%),
radial-gradient(800px 420px at 82% 0%, rgba(124,92,255,.18), rgba(124,92,255,0) 60%),
linear-gradient(180deg,#0b1220,#050a13 36%, #0a1430 100%);
  color:#fff;position:relative;overflow:hidden;
}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);background-size:54px 54px;opacity:.18;transform:translateY(-10px);pointer-events:none}
.hero .wrap{position:relative;padding:44px 0 28px 0}
.hgrid{display:flex;gap:18px;align-items:stretch}
.hl{flex:1;min-width:0}
.hr{width:440px}
@media (max-width:1024px){.hgrid{flex-direction:column}.hr{width:auto}}
.hbadge{display:inline-flex;align-items:center;gap:10px;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);font-size:12px;color:rgba(255,255,255,.88)}
.h1{margin:14px 0 0 0;font-size:40px;line-height:1.16;letter-spacing:.2px}
@media (max-width:520px){.h1{font-size:30px}}
.lead{margin:12px 0 0 0;color:rgba(255,255,255,.74);font-size:14px;line-height:1.95;max-width:820px}
.heroBadges{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}
.hchip{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);font-size:12px;color:rgba(255,255,255,.80)}
.hchip i{font-style:normal;width:8px;height:8px;border-radius:999px;background:#58b6ff;box-shadow:0 0 0 4px rgba(88,182,255,.14)}
.card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.35);overflow:hidden}
.card .hd{padding:16px 16px 12px 16px;border-bottom:1px solid rgba(255,255,255,.10)}
.card .hd .t{font-weight:900;color:#fff;font-size:14px}
.card .hd .s{margin-top:6px;color:rgba(255,255,255,.65);font-size:12px;line-height:1.7}
.card .bd{padding:14px 16px 16px 16px}
.field{margin-bottom:10px}
.label{display:block;margin-bottom:6px;font-size:12px;color:rgba(255,255,255,.70)}
.control{width:100%;padding:12px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;font-size:13px;outline:none}
.control::placeholder{color:rgba(255,255,255,.45)}
.control:focus{border-color:rgba(88,182,255,.55);box-shadow:0 0 0 4px rgba(88,182,255,.20)}
.row2{display:flex;gap:10px}
.row2 .field{flex:1}
@media (max-width:520px){.row2{flex-direction:column}}
.hint{display:none;margin-top:8px;color:#bfe0ff;font-size:12px;line-height:1.7}
.card .ft{padding:0 16px 16px 16px}
.card .ft .btn{width:100%;padding:12px 16px;border-radius:16px}
.trustBar{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}
.trust{flex:1 1 260px;min-width:230px;padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);box-shadow:0 18px 60px rgba(0,0,0,.22)}
.trust b{display:block;color:#fff;font-size:14px}
.trust span{display:block;margin-top:8px;color:rgba(255,255,255,.66);font-size:12px;line-height:1.75}
.footer2c{position:relative;overflow:hidden;margin-top:18px;color:rgba(255,255,255,.78);background:linear-gradient(180deg,#071022 0%, #050a13 58%, #030813 100%);border-top:1px solid rgba(255,255,255,.10)}
.footer2c:before{content:"";position:absolute;right:-220px;bottom:-280px;width:780px;height:780px;border-radius:999px;background:radial-gradient(circle at 35% 35%, rgba(88,182,255,.22), rgba(88,182,255,0) 68%);pointer-events:none}
.footer2c:after{content:"";position:absolute;left:-260px;top:-320px;width:900px;height:900px;border-radius:999px;background:radial-gradient(circle at 40% 30%, rgba(124,92,255,.16), rgba(124,92,255,0) 72%);pointer-events:none}
.f2cWrap{position:relative;z-index:2;padding:34px 0 16px 0;display:flex;gap:16px;flex-wrap:wrap}
.f2cL{flex:1 1 560px;min-width:300px}
.f2cR{flex:0 0 380px;min-width:300px}
@media (max-width:960px){.f2cR{flex:1 1 100%}}
.f2cHero{display:flex;align-items:flex-start;gap:14px;padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);box-shadow:0 26px 90px rgba(0,0,0,.34)}
.f2cLogo{width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,#58b6ff,#245bff);box-shadow:0 22px 70px rgba(36,91,255,.35);position:relative;overflow:hidden;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.f2cLogo:after{content:"";position:absolute;inset:-45% -30%;background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.65), rgba(255,255,255,0) 60%);transform:rotate(12deg);pointer-events:none}
.f2cLogo svg{position:relative;z-index:1;display:block}
.f2cTitle{font-weight:1000;color:#fff;font-size:16px;letter-spacing:.3px}
.f2cDesc{margin-top:6px;color:rgba(255,255,255,.66);font-size:12px;line-height:1.85}
.f2cBadges{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
.f2cBadge{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.86);font-weight:900;font-size:12px;white-space:nowrap}
.f2cBadge:before{content:"";width:8px;height:8px;border-radius:999px;background:#34d399;box-shadow:0 0 0 4px rgba(52,211,153,.14)}
.f2cNote{margin-top:14px;padding:14px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);box-shadow:0 18px 70px rgba(0,0,0,.22);color:rgba(255,255,255,.64);font-size:12px;line-height:1.9}
.f2cQuick{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.f2cBtn{display:inline-flex;align-items:center;justify-content:center;padding:11px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;font-weight:1000;font-size:12px;white-space:nowrap;transition:transform .08s ease, background .15s ease, border-color .15s ease}
.f2cBtn:hover{background:rgba(255,255,255,.10)}
.f2cBtn:active{transform:translateY(1px)}
.f2cBtn.primary{border:1px solid rgba(88,182,255,.44);background:linear-gradient(135deg,#58b6ff,#245bff);box-shadow:0 18px 60px rgba(36,91,255,.18)}
.f2cBtn.ghost{background:transparent;border:1px solid rgba(255,255,255,.16)}
.f2cPanel{height:100%;padding:18px;border-radius:22px;border:1px solid rgba(255,255,255,.12);background:radial-gradient(420px 240px at 18% 0%, rgba(88,182,255,.18), rgba(88,182,255,0) 65%),radial-gradient(420px 240px at 90% 10%, rgba(124,92,255,.14), rgba(124,92,255,0) 70%),rgba(255,255,255,.05);box-shadow:0 26px 90px rgba(0,0,0,.34)}
.f2cH{color:rgba(255,255,255,.92);font-weight:1000;font-size:13px;letter-spacing:.3px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.10);margin-bottom:10px}
.f2cLine{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.10)}
.f2cLine:last-of-type{border-bottom:none}
.f2cLine .k{color:rgba(255,255,255,.62);font-size:12px}
.f2cLine .v{color:#fff;font-weight:1000;font-size:12px}
.f2cMini{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.f2cMiniBtn{flex:1 1 46%;text-align:center;padding:10px 12px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;font-weight:1000;font-size:12px}
.f2cMiniBtn:hover{background:rgba(255,255,255,.10)}
.f2cBottom{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 2px 0 2px;margin-top:16px;border-top:1px solid rgba(255,255,255,.10)}
.f2cBottom .copy{color:rgba(255,255,255,.55);font-size:12px;line-height:1.7}
.f2cBottom .links{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.f2cBottom .links a{color:rgba(255,255,255,.62);font-size:12px}
.f2cBottom .links a:hover{color:rgba(255,255,255,.86)}
.footer2c .sep{color:rgba(255,255,255,.25);padding:0 6px}
.float{position:fixed;right:16px;bottom:16px;z-index:9999;display:flex;flex-direction:column;gap:10px}
.fab{width:46px;height:46px;border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(11,18,32,.92);color:#fff;cursor:pointer;box-shadow:0 18px 45px rgba(0,0,0,.28);display:flex;align-items:center;justify-content:center;user-select:none}
.drawer{position:fixed;right:16px;bottom:72px;z-index:9998;width:330px;max-width:calc(100% - 32px);background:#fff;border:1px solid #e7edf6;border-radius:18px;box-shadow:0 26px 80px rgba(15,23,42,.18);overflow:hidden;display:none}
.drawer.show{display:block}
.drawer .dhd{background:linear-gradient(135deg,#58b6ff,#245bff);color:#fff;padding:14px}
.drawer .dhd b{display:block;font-size:14px}
.drawer .dhd span{display:block;margin-top:6px;font-size:12px;opacity:.85;line-height:1.6}
.drawer .dbd{padding:14px}
.drawer .line{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #eef3fb}
.drawer .line:last-child{border-bottom:none}
.drawer .k{color:#64748b;font-size:12px}
.drawer .v{color:#0b1220;font-weight:900;font-size:12px}
.drawer .qa{margin-top:12px}
.drawer .qa a{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:11px 12px;border-radius:14px;background:#f3f8ff;border:1px solid #d9e6fb;color:#1d4ed8;font-weight:900;font-size:13px}
.drawer .qa a:hover{background:#eaf3ff}

select.control{background: rgba(255,255,255,.06) !important;color:#fff !important;border:1px solid rgba(255,255,255,.14) !important}
select.control option{background:#0b1220 !important;color:#fff !important}