/*!
 * Flykit — web 主题设计系统（fly.io 风格）
 * 浅色粉彩紫 + 衬线大标题 + 细边框卡片 + 紫色主按钮
 */
:root{
  --brand:#2563eb; --brand-strong:#1d4ed8; --brand-deep:#1e40af;
  --brand-soft:#eff6ff; --brand-soft2:#dbeafe; --brand-line:#bfdbfe;
  --grad:linear-gradient(96deg,#2563eb 0%,#3b82f6 48%,#06b6d4 100%);
  --ink:#0f172a; --ink-2:#334155; --ink-3:#64748b; --muted:#94a3b8;
  --line:#e2e8f0; --line-2:#f1f5f9;
  --bg:#ffffff; --bg-soft:#f8fafc; --tint:#f0f7ff; --tint-2:#e0f2fe;
  --dark:#0f172a; --dark-2:#1e293b; --dark-line:#334155;
  --ok:#16a34a; --ok-bg:#ecfdf3; --warn:#d97706; --warn-bg:#fff7ea;
  --bad:#dc2626; --bad-bg:#fdeeee; --info:#0369a1; --info-bg:#eff8ff;
  --radius:12px; --radius-lg:16px; --radius-sm:8px;
  --shadow-sm:0 1px 2px rgba(33,26,51,.05);
  --shadow:0 1px 2px rgba(33,26,51,.04),0 10px 30px -14px rgba(33,26,51,.14);
  --shadow-lg:0 24px 60px -24px rgba(15,23,42,.28);
  --sans:"Inter","Segoe UI",system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  --serif:Georgia,"Times New Roman","STZhongsong","SimSun",serif;
  --mono:ui-monospace,"Cascadia Code",Consolas,Menlo,monospace;
  --nav-h:66px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.72 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-strong)}
img{max-width:100%;border:0}
button{font-family:var(--sans)}
.container{max-width:1200px;margin:0 auto;padding:0 22px}
.mono{font-family:var(--mono)}
::selection{background:#dbeafe;color:var(--ink)}

/* ---------- 标题体系 ---------- */
h1,h2,h3,h4{margin:0;color:var(--ink)}
.display{font-family:var(--serif);font-weight:700;letter-spacing:-.01em;line-height:1.22}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--brand)}
.eyebrow:before{content:"";width:18px;height:2px;background:var(--grad);border-radius:2px}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

/* ---------- 按钮 (Theme Dynamic Gradient & Micro-Interactions) ---------- */
.btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height:42px;
  padding:0 24px;
  border-radius:10px;
  border:1px solid transparent;
  font-size:14px;
  font-weight:600;
  letter-spacing:.01em;
  cursor:pointer;
  transition:all .22s cubic-bezier(0.16,1,0.3,1);
  white-space:nowrap;
  line-height:1;
  text-decoration:none;
  user-select:none;
  overflow:hidden;
  transform:translateZ(0);
}
.btn svg{flex:none;transition:transform .2s ease}
.btn:active,.btn-primary:active,.btn-ghost:active,.btn-soft:active,.btn-light:active,.btn-outline-light:active{
  transform:scale(0.96) !important;
}
.btn:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(37,99,235,.35);
}

/* 主色按钮：经典紫粉极光流光渐变 + 晶莹顶光 + 悬停光晕扫光 */
.btn-primary{
  background:linear-gradient(135deg,#2563eb 0%,#3b82f6 48%,#0ea5e9 100%);
  color:#fff;
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 4px 14px -2px rgba(37,99,235,.45),0 8px 20px -6px rgba(6,182,212,.35),inset 0 1px 0 rgba(255,255,255,.28);
}
.btn-primary::after{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:60%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-20deg);
  pointer-events:none;
  transition:none;
}
.btn-primary:hover{
  background:linear-gradient(135deg,#1d4ed8 0%,#2563eb 48%,#0284c7 100%);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 6px 20px -2px rgba(37,99,235,.6),0 12px 28px -4px rgba(6,182,212,.45),inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-primary:hover::after{
  left:160%;
  transition:left .75s cubic-bezier(0.16,1,0.3,1);
}

/* 幽灵/次级按钮：白底微光卡片 + 悬停紫粉淡雅渐变与流光边框 */
.btn-ghost{
  background:#fff;
  color:var(--ink-2, #374151);
  border:1.2px solid #e5def5;
  box-shadow:0 1px 3px rgba(33,26,51,.04);
}
.btn-ghost:hover{
  background:linear-gradient(135deg,#f8fafc 0%,#eff6ff 100%);
  color:var(--brand);
  border-color:#93c5fd;
  box-shadow:0 4px 14px -2px rgba(37,99,235,.16);
  transform:translateY(-1.5px);
}

/* 柔和按钮：二次元马卡龙紫粉糖果质感 */
.btn-soft{
  background:linear-gradient(135deg,#eff6ff 0%,#f0f9ff 100%);
  color:#1d4ed8;
  border:1px solid rgba(37,99,235,.16);
}
.btn-soft:hover{
  background:linear-gradient(135deg,#dbeafe 0%,#e0f2fe 100%);
  color:#1e40af;
  border-color:rgba(37,99,235,.32);
  box-shadow:0 4px 14px -2px rgba(37,99,235,.2);
  transform:translateY(-1.5px);
}

.btn-dark{background:var(--dark);color:#fff}
.btn-dark:hover{background:#241a45;color:#fff;transform:translateY(-1.5px)}
.btn-lg{height:48px;padding:0 28px;font-size:15px;border-radius:12px;font-weight:700}
.btn-sm{height:34px;padding:0 15px;font-size:13px;border-radius:8px}
.btn-block{width:100%;display:flex}
.btn[disabled],.btn.disabled{opacity:.5;cursor:not-allowed;pointer-events:none;transform:none!important;box-shadow:none!important}

/* 深色底 / 横幅上的高光按钮 */
.btn-light{
  background:#ffffff;
  color:var(--brand-deep);
  font-weight:700;
  border:1px solid rgba(255,255,255,.9);
  box-shadow:0 4px 16px -2px rgba(0,0,0,.2),0 0 0 1px rgba(255,255,255,.4);
  transition:all .22s cubic-bezier(0.16,1,0.3,1);
}
.btn-light:hover{
  background:#ffffff;
  color:#db2777;
  transform:translateY(-2px);
  box-shadow:0 8px 24px -4px rgba(219,39,119,.42),0 0 20px rgba(255,255,255,.6);
}
.btn-outline-light{
  background:rgba(255,255,255,.14) !important;
  color:#ffffff !important;
  border:1.5px solid rgba(255,255,255,.65) !important;
  box-shadow:0 4px 14px -3px rgba(0,0,0,.2);
  font-weight:600;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:all .22s cubic-bezier(0.16,1,0.3,1);
}
.btn-outline-light:hover{
  background:#ffffff !important;
  color:#2563eb !important;
  border-color:#ffffff !important;
  box-shadow:0 8px 24px -4px rgba(255,255,255,.5);
  transform:translateY(-2px);
}

/* ---------- 顶栏 ---------- */
.topbar-wrap{position:sticky;top:0;z-index:900}
.topbar{background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:relative;transform:translateZ(0);will-change:transform}
.nav-inner{display:flex;align-items:center;gap:26px;height:var(--nav-h)}
.brand{display:flex;align-items:center;gap:10px;flex:none;color:var(--ink);font-weight:700;font-size:18px;letter-spacing:-.01em}
.brand:hover{color:var(--ink)}
.brand-logo-img{max-height:38px;width:auto;display:block}
.brand-mark{width:32px;height:32px;border-radius:9px;background:var(--grad);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;font-family:var(--serif)}
.topbar.transparent .brand{color:#fff}
.nav-burger{display:none;width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:9px;cursor:pointer;padding:10px 9px;flex-direction:column;justify-content:space-between}
.nav-burger span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:.2s}
.topbar.transparent .nav-burger{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25)}
.topbar.transparent .nav-burger span{background:#fff}
.nav-menu{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.nav-menu>a,.nm-toggle{display:inline-flex;align-items:center;gap:5px;padding:8px 13px;border-radius:8px;font-size:14.5px;font-weight:500;color:var(--ink-2);cursor:pointer;white-space:nowrap}
.nav-menu>a:hover,.nm-toggle:hover{color:var(--brand);background:var(--brand-soft)}
.nav-menu>a.on{color:var(--brand);font-weight:600}
.dd-caret{opacity:.55;transition:.2s}
.nav-drop{position:relative}
.nav-drop-cat{position:static}
.nav-drop-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:208px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:60}
.nav-drop:hover .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu,.nav-drop.open .nav-drop-menu{opacity:1;visibility:visible;transform:none}
.nav-drop:hover .dd-caret,.nav-drop.open .dd-caret{transform:rotate(180deg)}
.nd-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--ink-2);font-size:14px}
.nd-item:hover{background:var(--brand-soft);color:var(--brand)}
.nd-item svg{color:var(--brand);flex:none}
.nd-item .nd-sub{display:block;font-size:12px;color:var(--ink-3);margin-top:1px}
.nav-right{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;margin-left:auto}
.nav-user{display:inline-flex;align-items:center;gap:7px;padding:3px 10px 3px 3px;border:1px solid var(--line);border-radius:99px;background:#fff;cursor:pointer;position:relative;color:var(--ink);max-width:180px;overflow:hidden;flex-shrink:0}
.nav-user:hover{border-color:var(--brand-line)}
.nav-avatar{position:relative;width:32px;height:32px;min-width:32px;min-height:32px;max-width:32px;max-height:32px;border-radius:50%;background:var(--grad);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;overflow:hidden;flex:none;box-shadow:0 2px 6px -1px rgba(37,99,235,.28)}
.nav-avatar img{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;margin:0;padding:0}
.nav-user b{font-size:13px;font-weight:600;max-width:85px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}
/* 公告条 */
.announce-bar{background:var(--dark);color:#e9e3fb;font-size:13px;position:relative;z-index:20}
.announce-bar .container{display:flex;align-items:center;gap:12px;height:38px;overflow:hidden}
.announce-bar .ab-tag{flex:none;display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:#bae6fd;text-transform:uppercase}
.announce-bar .ab-tag i{width:7px;height:7px;border-radius:50%;background:#38bdf8;box-shadow:0 0 0 4px rgba(56,189,248,.22);animation:abPulse 1.6s infinite}
@keyframes abPulse{50%{box-shadow:0 0 0 7px rgba(56,189,248,.05)}}
.ab-track{flex:1;position:relative;height:38px;overflow:hidden;min-width:0}
.ab-item{position:absolute;inset:0;display:flex;align-items:center;gap:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(100%);transition:.45s}
.ab-item.on{opacity:1;transform:none}
.ab-item a{color:#fff}
.ab-item time{color:#94a3b8;font-family:var(--mono);font-size:11.5px}

/* ---------- 商品目录 Mega ---------- */
.nav-mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(33,26,51,.25);padding:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:80;max-height:calc(100vh - 75px);display:flex;flex-direction:column}
.nav-drop:hover>.nav-mega,.nav-drop.open>.nav-mega,.nav-drop:focus-within>.nav-mega{opacity:1;visibility:visible;transform:none}
.nm-body{display:grid;grid-template-columns:220px 230px 1fr;height:min(520px,calc(100vh - 145px));max-height:min(520px,calc(100vh - 145px));min-height:280px;overflow:hidden;background:#fff}
.nm-col{padding:14px 8px 12px;border-right:1px solid var(--line-2);height:100%;max-height:100%;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#bfdbfe transparent}
.nm-col::-webkit-scrollbar{width:5px}
.nm-col::-webkit-scrollbar-thumb{background:#bfdbfe;border-radius:5px}
.nm-col::-webkit-scrollbar-track{background:transparent}
.nm-col:last-child{border-right:0}
.nm-hd{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:2px 12px 10px;margin-bottom:4px;border-bottom:1px solid var(--bg-soft);position:sticky;top:-14px;background:inherit;z-index:3}
.nm-col.nm-l3{padding:14px 12px 12px;background:#f8fafc}
.nm-col.nm-l3 .nm-hd{background:#f8fafc}
.nm-col.nm-l3 .nm-pane{flex:1;min-height:0}
.nm-item{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:8px;font-size:14px;color:var(--ink-2);cursor:pointer;text-decoration:none}
.nm-item:hover{background:var(--brand-soft);color:var(--brand)}
.nm-item .nm-txt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nm-item .nm-count{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--muted);background:var(--bg-soft);border:1px solid var(--line-2);border-radius:20px;padding:0 7px;line-height:18px}
.nm-item .nm-arrow{font-style:normal;color:var(--muted)}
.nm-pane{display:none}
.nm-pane.on{display:block}
.nm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:6px;padding:2px 2px 16px}
.nm-prod{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:9px;font-size:13px;color:var(--ink-2);background:#fff;border:1px solid var(--line-2);transition:all .15s ease;min-width:0;text-decoration:none;box-shadow:0 1px 2px rgba(33,26,51,.02)}
.nm-prod:hover{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand);transform:translateY(-1px);box-shadow:0 4px 12px -2px rgba(37,99,235,.12)}
.nm-prod-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.nm-prod span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nm-prod.is-soldout{opacity:.62;cursor:not-allowed !important;background:#f8fafc;border-color:#e2e8f0;box-shadow:none}
.nm-prod.is-soldout:hover{transform:none;box-shadow:none;background:#f1f5f9;border-color:#e2e8f0;color:#64748b}
.nm-prod.is-soldout .nm-prod-name{color:#64748b}
.nm-prod.is-soldout *{cursor:not-allowed !important}
.nm-sold-tag{display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;line-height:1;font-weight:700;padding:2px 6px;border-radius:4px;background:#fee2e2;color:#ef4444;flex-shrink:0;margin-left:auto;letter-spacing:.02em;border:1px solid rgba(239,68,68,.18)}
.nm-prod .nm-count{font-style:normal;margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--muted);flex-shrink:0}
.nm-flag{width:18px;height:13px;border-radius:2.5px;object-fit:cover;box-shadow:0 0 0 1px rgba(33,26,51,.12);flex-shrink:0}
.nm-ft{flex:none;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;border-top:1px solid var(--line-2);font-size:13px;color:var(--ink-3);background:var(--bg-soft);border-radius:0 0 var(--radius-lg) var(--radius-lg)}
.nm-ft a{font-weight:600}

/* ---------- Hero / Banner (全功能自定义轮播：视频/图案/大图/手绘) ---------- */
.banner{position:relative;overflow:hidden;background:#faf7fd}
.banner:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(37,99,235,.13) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 75%);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 75%);pointer-events:none;z-index:2}
.bn-track{display:grid;grid-template-areas:"slide";width:100%;min-height:580px;position:relative}
.bn-slide{grid-area:slide;opacity:0;visibility:hidden;transition:opacity .6s cubic-bezier(.4,0,.2,1),visibility .6s ease;pointer-events:none;position:relative;display:flex;align-items:center;min-height:580px;overflow:hidden}
.bn-slide.on{opacity:1;visibility:visible;pointer-events:auto;z-index:3}

/* 纯图片横幅海报模式：全宽自适应，不遮挡，可整体点击 */
.bn-slide-graphic{display:flex;align-items:center;justify-content:center;padding:0;min-height:0;background:transparent}
.bn-graphic-link{display:block;width:100%;height:100%;text-decoration:none}
.bn-graphic-img{width:100%;height:auto;min-height:480px;max-height:620px;object-fit:cover;object-position:center;display:block}

/* 背景媒体（自定义视频 / 图案 / 大图） */
.bn-media-bg{position:absolute;inset:0;z-index:0;overflow:hidden;background:#0d0918}
.bn-media-obj{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.bn-desk-video{transform:scale(1.02);transition:transform 8s ease}
.bn-slide.on .bn-desk-video{transform:scale(1)}
.bn-mob-img{display:none}

/* 渐变遮罩 (Scrim)：默认动漫紫调 / 媒体背景下适度柔化保证文字锐利且不泛白 */
.bn-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  radial-gradient(1100px 520px at 82% -10%,#fdeef7 0%,transparent 60%),
  radial-gradient(900px 480px at 8% 0%,#ece4fd 0%,transparent 55%),
  linear-gradient(180deg,#f7f3ff 0%,#fdfbff 78%,#fff 100%)}
.bn-scrim.bn-scrim-media, .bn-scrim.with-media{background:
  linear-gradient(90deg,rgba(247,243,255,.86) 0%,rgba(247,243,255,.62) 46%,rgba(247,243,255,.18) 72%,transparent 100%),
  linear-gradient(180deg,rgba(247,243,255,.2) 0%,transparent 40%,rgba(255,255,255,.92) 96%,#fff 100%)}

/* 视频直播浮标 */
.bn-live-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:99px;background:rgba(255,255,255,.88);border:1px solid rgba(37,99,235,.25);box-shadow:var(--shadow-sm);font-family:var(--mono);font-size:12px;font-weight:700;color:var(--ink);backdrop-filter:blur(8px)}
.blb-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.25);animation:abPulse 1.5s infinite}

.bn-cap-wrap{position:relative;z-index:2;width:100%}
.bn-inner{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:44px;align-items:center;padding:76px 0 84px}
.bn-copy{position:relative;z-index:2}
.bn-kicker-tag{margin-bottom:14px;box-shadow:var(--shadow-sm);display:inline-flex;align-items:center;gap:6px}
.bn-title{font-family:var(--serif);font-size:clamp(34px,4.6vw,56px);line-height:1.16;margin:14px 0 0;font-weight:700;letter-spacing:.005em;color:var(--ink)}
.bn-sub{font-size:16.5px;color:var(--ink-2);margin:16px 0 0;max-width:54ch;line-height:1.8}
.bn-proof{display:flex;align-items:center;gap:12px;margin-top:22px}
.bn-avatars{display:flex}
.bn-avatars span{width:26px;height:26px;border-radius:50%;color:#fff;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;margin-right:-7px;box-shadow:0 0 0 2px #fff;border:1px solid rgba(0,0,0,.08)}
.bn-proof p{margin:0;font-size:12.5px;color:var(--ink-2);line-height:1.45}
.bn-proof b{color:var(--ink);font-weight:700}
.bn-actions{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
.bn-meta{display:flex;gap:34px;margin-top:40px;flex-wrap:wrap}
.bn-meta b{display:block;font-family:var(--serif);font-size:26px;line-height:1.2;color:var(--ink)}
.bn-meta span{font-size:12.5px;color:var(--ink-3)}

/* 右侧视觉容器 */
.bn-visual{position:relative;display:flex;justify-content:center;align-items:center}
.bn-media-wrap{position:relative;border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg),0 0 0 1px rgba(37,99,235,.14);background:#fff;aspect-ratio:16/10;width:100%}

/* 自定义视频/图案背景下的玻璃态 HUD 卡片 */
.bn-hud-glass{position:relative;width:100%;max-width:440px;padding:24px 26px;border-radius:20px;background:rgba(255,255,255,.84);border:1.5px solid rgba(255,255,255,.95);box-shadow:var(--shadow-lg),0 0 0 1px rgba(37,99,235,.12);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:transform .3s ease,box-shadow .3s ease}
.bn-hud-glass:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl),0 0 0 2px var(--brand-line)}
.bn-hud-top{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line-2)}
.bn-hud-dot{width:8px;height:8px;border-radius:50%;background:#10b981;box-shadow:0 0 0 3px rgba(16,185,129,.2);animation:abPulse 1.6s infinite}
.bn-hud-title{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--ink-2);text-transform:uppercase}
.bn-hud-status{margin-left:auto;font-family:var(--mono);font-size:11px;font-weight:700;color:var(--brand);background:var(--brand-soft);padding:3px 8px;border-radius:99px;border:1px solid var(--brand-line)}
.bn-hud-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.bh-item{padding:12px 14px;background:rgba(255,255,255,.72);border:1px solid rgba(37,99,235,.1);border-radius:12px}
.bh-label{display:block;font-size:12px;color:var(--muted);margin-bottom:4px}
.bh-val{font-size:14.5px;font-weight:700;color:var(--ink)}
.bh-val.c-brand{color:var(--brand)}
.bh-val.c-green{color:#059669}
.bn-hud-tag1{position:absolute;top:-12px;right:-10px;animation:abFloat 3.8s ease-in-out infinite}
.bn-hud-tag2{position:absolute;bottom:-14px;left:-12px;animation:abFloat 4.2s ease-in-out infinite reverse}

/* 轮播切换按钮与指示点 */
.bn-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--brand-line);background:rgba(255,255,255,.92);color:var(--brand);font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.bn-arrow:hover{border-color:var(--brand);background:var(--brand);color:#fff;box-shadow:0 6px 20px rgba(37,99,235,.35);transform:translateY(-50%) scale(1.06)}
.bn-arrow.prev{left:20px}.bn-arrow.next{right:20px}
.bn-dots{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;gap:8px;z-index:5}
.bn-dots button{width:22px;height:5px;border-radius:99px;border:0;background:rgba(37,99,235,.25);cursor:pointer;transition:.25s;padding:0}
.bn-dots button.on{background:var(--grad);width:36px}

/* 窄屏 / 移动端适配 */
@media (max-width:960px){
  .bn-inner{grid-template-columns:minmax(0,1fr) !important;width:100% !important;max-width:100% !important;box-sizing:border-box !important;gap:30px;padding:50px 0 60px;text-align:center}
  .bn-copy{min-width:0 !important;width:100% !important;max-width:100% !important;box-sizing:border-box !important}
  .bn-title{font-size:clamp(24px,6.2vw,36px) !important;line-height:1.25 !important;margin:12px 0 0 !important;word-break:break-word !important;overflow-wrap:break-word !important}
  .bn-sub{font-size:14.5px !important;line-height:1.68 !important;margin:12px auto 0 !important;max-width:92% !important;word-break:break-word !important}
  .bn-kicker-tag{margin-left:auto;margin-right:auto}
  .bn-proof{justify-content:center}
  .bn-actions{justify-content:center;gap:12px;margin-top:24px;flex-wrap:wrap}
  .bn-actions .btn{padding:11px 22px;font-size:14px}
  .bn-meta{justify-content:center;gap:24px;margin-top:30px}
  .bn-scrim.bn-scrim-media,
  .bn-scrim.with-media{background:linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.80) 50%,rgba(255,255,255,.94) 100%) !important}
  .bn-hud-glass{margin:0 auto}
  .bn-graphic-img,
  .bn-media-obj,
  .bn-mob-img,
  .banner img,
  .banner video {
    object-position: right center !important;
  }
}
@media (max-width:680px){
  .bn-track{min-height:220px}
  .bn-slide{min-height:220px}
  .bn-inner{padding:36px 0 46px !important;gap:20px !important}
  .bn-title{font-size:clamp(21px,5.8vw,28px) !important;line-height:1.26 !important}
  .bn-sub{font-size:13px !important;margin-top:8px !important;line-height:1.6 !important}
  .bn-actions{gap:10px !important;margin-top:18px !important}
  .bn-actions .btn{flex:1 1 125px !important;max-width:160px !important;padding:10px 16px !important;font-size:13px !important}
  .bn-meta{gap:16px !important;margin-top:22px !important}
  .bn-meta b{font-size:20px !important}
  .bn-meta span{font-size:11.5px !important}
  .bn-arrow{display:none}
  .bn-dots{bottom:12px}
  .bn-dots button{width:18px;height:4px}
  .bn-dots button.on{width:28px}
  .doodle-float{display:none !important}
  .bn-visual{display:none !important}
  .bn-slide-graphic{display:flex !important;align-items:center !important;justify-content:center !important;min-height:0 !important;width:100% !important;padding:0 !important}
  .bn-graphic-link{display:block !important;width:100% !important}
  .bn-graphic-img{
    width:100% !important;
    height:auto !important;
    min-height:160px !important;
    max-height:380px !important;
    object-fit:cover !important;
    object-position:right center !important;
    display:block !important;
  }
  .bn-media-bg.has-mob-img .bn-desk-video{display:none !important}
  .bn-media-bg.has-mob-img .bn-mob-img{display:block !important;object-position:right center !important}
  .bn-media-obj,
  .banner img,
  .banner video {
    object-position: right center !important;
  }
}
@media (max-width:380px){
  .bn-title{font-size:clamp(19px,5.5vw,23px) !important}
  .bn-actions .btn{flex:1 1 100% !important;max-width:100% !important}
  .bn-meta{gap:12px !important}
  .bn-meta div{flex:1 1 28% !important}
}


/* ---------- 区块 ---------- */
.section{padding:78px 0}
.section.tint{background:var(--tint);position:relative}
.section.tint:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(37,99,235,.10) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 70%);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 70%);pointer-events:none}
.section.dark{background:var(--dark);color:#cfc7e8}
.section.dark h2,.section.dark h3{color:#fff}
.section-head{max-width:640px;margin:0 auto 46px;text-align:center}
.sec-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:44px;text-align:left;max-width:none}
.sec-head-row p{margin:8px 0 0}
.section-head h2,.sec-head-row h2{font-family:var(--serif);font-size:clamp(26px,3vw,36px);font-weight:700;letter-spacing:-.005em}
.section-head p,.sec-head-row .sec-sub{font-size:15px;color:var(--ink-2);margin-top:12px;line-height:1.8}
.section.dark .section-head p,.section.dark .sec-sub{color:#a99ccf}
.sec-more{flex:none}

/* ---------- 特性卡 ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feat{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px 22px;transition:.2s;position:relative}
.feat:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-3px)}
.feat-ic{width:44px;height:44px;border-radius:11px;background:var(--brand-soft);color:var(--brand);display:flex;align-items:center;justify-content:center;margin-bottom:16px;border:1px solid var(--brand-line)}
.feat b{display:block;font-size:15.5px;margin-bottom:7px}
.feat p{font-size:13.5px;color:var(--ink-3);margin:0;line-height:1.75}

/* ---------- IDC 能力（bento） ---------- */
.idc-layout{display:grid;grid-template-columns:1.05fr 1.2fr;gap:44px;align-items:center}
.idc-copy h2{font-family:var(--serif);font-size:clamp(26px,3vw,36px)}
.idc-copy p{color:var(--ink-2);font-size:15px;line-height:1.85;margin:16px 0 0}
.idc-points{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.idc-points li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--ink-2)}
.idc-points svg{color:var(--brand);flex:none;margin-top:4px}
.idc-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.idc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px;transition:.2s}
.idc-card:hover{border-color:var(--brand-line);box-shadow:var(--shadow)}
.idc-card .ic-num{font-family:var(--serif);font-size:30px;font-weight:700;color:var(--brand-deep);letter-spacing:-.01em}
.idc-card b{display:block;font-size:14.5px;margin-top:6px}
.idc-card span{font-size:12.5px;color:var(--ink-3)}

/* ---------- CTA 通栏 ---------- */
.cta-band{position:relative;overflow:hidden;background:var(--dark);color:#fff;border-radius:20px;margin:0 22px}
.cta-band:before{content:"";position:absolute;inset:0;background:radial-gradient(640px 300px at 18% 120%,rgba(37,99,235,.55),transparent 65%),radial-gradient(560px 280px at 88% -30%,rgba(6,182,212,.35),transparent 60%)}
.cta-inner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:26px;padding:44px 50px;flex-wrap:wrap}
.cta-inner h2{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);color:#fff}
.cta-inner p{margin:8px 0 0;color:#b7aade;font-size:14.5px}
.cta-band .cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- 精选推荐 TAB ---------- */
.home-tab-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.home-tab-item{border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:13.5px;font-weight:600;border-radius:99px;padding:8px 18px;cursor:pointer;transition:.16s}
.home-tab-item:hover{border-color:var(--brand-line);color:var(--brand)}
.home-tab-item.active{background:var(--dark);border-color:var(--dark);color:#fff}
.home-tab-panel{display:none}
.home-tab-panel.active{display:block;animation:bnIn .4s ease}

/* ---------- 商品卡 ---------- */
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.product-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 20px 20px;transition:.2s;overflow:hidden}
.product-card:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-3px)}
.pc-tag{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-deep);background:var(--brand-soft2);border:1px solid var(--brand-line);border-radius:99px;padding:2px 9px}
.pc-name{font-size:16px;font-weight:700;letter-spacing:-.01em;display:block;padding-right:64px}
.pc-stk{font-family:var(--mono);font-size:11px;color:var(--ink-3);background:var(--bg-soft);border:1px solid var(--line-2);border-radius:6px;padding:1px 7px}
.pc-stk.out{color:var(--bad);background:var(--bad-bg);border-color:#f6c9c9}
.pc-specs{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px dashed var(--line);display:grid;gap:9px;flex:1}
.spec-row{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--ink-2);min-width:0}
.spec-row .s-ic{width:24px;height:24px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;flex:none;background:var(--bg-soft);border:1px solid var(--line-2);color:var(--ink-3)}
.s-ic-b{color:var(--brand)!important;background:var(--brand-soft)!important;border-color:var(--brand-line)!important}
.s-ic-p{color:#db2777!important;background:#fdf0f7!important;border-color:#f9d3e6!important}
.s-ic-g{color:#059669!important;background:#ecfdf5!important;border-color:#c7f0dd!important}
.s-ic-o{color:#d97706!important;background:#fff7ea!important;border-color:#f5ddb8!important}
.spec-row .s-lb{flex:none;width:44px;color:var(--muted);font-size:12px}
.spec-row .s-val{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-price{display:flex;align-items:baseline;gap:4px;margin:16px 0 14px}
.pc-price small{font-size:12px;color:var(--ink-3)}
.pc-price b{font-family:var(--serif);font-size:27px;letter-spacing:-.02em}
.pc-price span{font-size:12.5px;color:var(--ink-3)}
.pc-buy{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;border-radius:9px;background:var(--dark);color:#fff;font-size:13.5px;font-weight:600;transition:.16s}
.pc-buy:hover{background:var(--brand);color:#fff}
.pc-buy.soldout{background:var(--bg-soft);color:var(--muted);border:1px solid var(--line);pointer-events:none}
.pc-member{font-size:11.5px;color:var(--brand-deep);background:var(--brand-soft2);border:1px dashed var(--brand-line);border-radius:7px;padding:2px 8px;display:inline-flex;margin-left:auto}

/* ---------- 全球节点 ---------- */
.deploy-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:8px}
.deploy-node{background:var(--dark-2);border:1px solid var(--dark-line);border-radius:var(--radius-lg);padding:20px;transition:.2s}
.deploy-node:hover{border-color:#4c3a86;transform:translateY(-3px)}
.deploy-node .dn-flag{width:26px;height:19px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.deploy-node b{display:block;color:#fff;font-size:14.5px;margin-top:12px}
.deploy-node span{display:block;font-family:var(--mono);font-size:11.5px;color:#8f7fc7;margin-top:3px;letter-spacing:.08em;text-transform:uppercase}
.deploy-node .dn-ms{margin-top:12px;font-family:var(--mono);font-size:12.5px;color:#7ee2a8;display:inline-flex;align-items:center;gap:6px}
.deploy-node .dn-ms i{width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.2)}

/* ---------- 应用跑马灯 ---------- */
.support-sec{overflow:hidden}
.support-track{display:flex;gap:12px;width:max-content;animation:supScroll 36s linear infinite}
.support-sec:hover .support-track{animation-play-state:paused}
@keyframes supScroll{to{transform:translateX(-50%)}}
.support-item{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.support-item svg{color:var(--brand)}

/* ---------- 环境支持 ---------- */
.env-sec .env-groups{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.env-group{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px}
.env-group>h3{font-size:15px;margin-bottom:16px;display:flex;align-items:center;gap:9px}
.env-group>h3 svg{color:var(--brand)}
.env-items{display:flex;flex-wrap:wrap;gap:8px}
.env-item{font-size:12.5px;color:var(--ink-2);background:var(--bg-soft);border:1px solid var(--line);border-radius:8px;padding:5px 12px}

/* ---------- 页脚 CTA ---------- */
.footer-cta{margin:0 22px 26px;border-radius:20px;position:relative;overflow:hidden;background:var(--dark);color:#fff}
.footer-cta:after{content:"";position:absolute;inset:0;background:radial-gradient(480px 220px at 88% -20%,rgba(37,99,235,.4),transparent 62%),radial-gradient(360px 180px at 4% 130%,rgba(6,182,212,.18),transparent 60%);pointer-events:none}
.footer-cta .fc-inner{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:40px 48px;flex-wrap:wrap}
.footer-cta h2{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);color:#fff}
.footer-cta p{margin:8px 0 0;color:rgba(255,255,255,.82);font-size:14.5px}
.footer-cta .fc-doodles{position:absolute;inset:0;pointer-events:none;z-index:1}
.footer-cta .fc-doodles svg{position:absolute}
.footer-cta .fc-doodles .fd-1{top:14px;right:26%;transform:rotate(12deg)}
.footer-cta .fc-doodles .fd-2{bottom:14px;left:4%;transform:rotate(-8deg)}
.footer-cta .fc-doodles .fd-3{right:22%;bottom:-14px;transform:rotate(-4deg)}
.footer-cta .fc-doodles .fd-4{top:-8px;left:34%;transform:rotate(6deg)}
.fc-actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- 页脚 ---------- */
.footer{background:var(--dark);color:#9c92c4;margin-top:78px}
.footer .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;padding:56px 0 40px}
.footer .about p{font-size:13.5px;line-height:1.9;margin:14px 0 0;max-width:36ch}
.footer h4{color:#fff;font-size:14px;margin:6px 0 16px;font-family:var(--mono);letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.footer .footer-grid a{display:block;color:#9c92c4;font-size:13.5px;padding:5px 0}
.footer .footer-grid a:hover{color:#fff}
.footer .brand{color:#fff}
.footer .copyright{border-top:1px solid var(--dark-line);padding:20px 0 26px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12.5px}
.footer .copyright p{margin:0}
.footer .copyright a{color:#b7aade}
.ft-icp{display:flex;gap:16px;flex-wrap:wrap}

/* ---------- 弹窗公告 (Popup Notice) ---------- */
.mfp-root{display:none;position:fixed;inset:0;z-index:99991;align-items:center;justify-content:center;background:rgba(15,10,30,0.62);padding:20px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.mfp-root.show{display:flex}
.mfp-dialog{position:relative;width:100%;max-width:550px;max-height:88vh;overflow:auto;background:#fff;border-radius:20px;box-shadow:0 25px 70px -10px rgba(37,99,235,0.35),0 0 0 1px rgba(255,255,255,0.4);animation:mfpIn .32s cubic-bezier(0.16,1,0.3,1);display:flex;flex-direction:column}
@keyframes mfpIn{from{opacity:0;transform:translateY(22px) scale(0.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.mfp-close{position:absolute;top:14px;right:14px;z-index:10;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,0.35);background:rgba(255,255,255,0.22);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);box-shadow:0 4px 12px rgba(0,0,0,0.15);transition:all .2s ease}
.mfp-close:hover{background:#fff;color:#2563eb;transform:rotate(90deg) scale(1.05)}

/* 1. 顶部视觉 Banner (HTML 与 文字 模式) */
.mfp-head{position:relative;overflow:hidden;background:linear-gradient(135deg,#180d30 0%,#291058 35%,#4c1d95 75%,#2563eb 100%);color:#fff;padding:28px 28px 24px;border-radius:20px 20px 0 0}
.mfp-head-decor{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 90% 15%,rgba(6,182,212,0.38),transparent 45%),radial-gradient(circle at 10% 90%,rgba(37,99,235,0.35),transparent 40%)}
.mfp-head-decor::after{content:"";position:absolute;right:-20px;top:-20px;width:130px;height:130px;border:1px dashed rgba(255,255,255,0.18);border-radius:50%}
.mfp-head .hd-tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono,monospace);font-size:11px;font-weight:700;letter-spacing:.08em;background:rgba(255,255,255,0.14);border:1px solid rgba(255,255,255,0.28);border-radius:20px;padding:4px 12px;position:relative;z-index:2;text-transform:uppercase;color:#fff}
.hd-tag-dot{width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 8px #34d399;animation:mfpDotPulse 1.8s infinite}
@keyframes mfpDotPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}
.mfp-head .hd-title{font-family:var(--serif,system-ui);font-size:21px;font-weight:800;margin:12px 0 0;position:relative;z-index:2;line-height:1.35;color:#fff;letter-spacing:-0.01em;text-shadow:0 2px 10px rgba(0,0,0,0.25)}
.mfp-head .hd-sub{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:rgba(233,213,255,0.9);margin-top:8px;position:relative;z-index:2}

/* 2. 纯图片海报模式 */
.mfp-mode-image{max-width:580px}
.mfp-mode-image .mfp-close{background:rgba(0,0,0,0.45);border-color:rgba(255,255,255,0.35)}
.mfp-mode-image .mfp-close:hover{background:#fff;color:#111}
.mfp-img-wrap{position:relative;line-height:0;background:#0f0a1e;border-radius:20px 20px 0 0;overflow:hidden}
.mfp-img{display:block;width:100%;max-height:480px;object-fit:cover}
.mfp-img-mask{position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(transparent,rgba(15,10,30,0.85));pointer-events:none}
.mfp-img-cap{position:absolute;left:20px;right:20px;bottom:16px;z-index:3;color:#fff;font-size:18px;font-weight:800;line-height:1.4;text-shadow:0 2px 10px rgba(0,0,0,0.5)}

/* 3. HTML 富内容模式 */
.mfp-body-box{padding:22px 26px 12px;max-height:52vh;overflow-y:auto}
.mfp-html .mfp-body-content{font-size:14.5px;color:#334155;line-height:1.85;word-break:break-word}
.mfp-html .mfp-body-content p{margin:0 0 12px}
.mfp-html .mfp-body-content p:last-child{margin-bottom:0}
.mfp-html .mfp-body-content img{max-width:100%;height:auto;border-radius:12px;margin:10px 0;box-shadow:0 4px 16px rgba(0,0,0,0.08)}
.mfp-html .mfp-body-content a{color:#2563eb;font-weight:600;text-decoration:underline}
.mfp-html .mfp-body-content table{width:100%;border-collapse:collapse;margin:12px 0}
.mfp-html .mfp-body-content th,.mfp-html .mfp-body-content td{border:1px solid #e2e8f0;padding:8px 12px;font-size:13.5px}
.mfp-html .mfp-body-content th{background:#f8fafc;font-weight:700}

/* 4. 纯文字模式 */
.mfp-text .mfp-text-card{background:#f8fafc;border:1px solid #eef2f7;border-left:4px solid #2563eb;border-radius:10px;padding:16px 20px;font-size:14.5px;line-height:1.85;color:#334155;white-space:pre-wrap;word-break:break-word}

/* 5. 底部栏 */
.mfp-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 26px 22px;border-top:1px solid #f1f5f9;background:#fff;border-radius:0 0 20px 20px}
.mfp-once-label{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-size:13px;color:#64748b;user-select:none}
.mfp-once-label input{width:16px;height:16px;accent-color:#2563eb;cursor:pointer}
.mfp-btn{border:none;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;font-size:13.5px;font-weight:700;padding:9px 24px;border-radius:20px;cursor:pointer;box-shadow:0 4px 14px rgba(37,99,235,0.3);transition:all .16s ease}
.mfp-btn:hover{background:linear-gradient(135deg,#1d4ed8,#1e40af);transform:translateY(-1px);box-shadow:0 6px 18px rgba(37,99,235,0.4)}

/* ---------- 弹窗公告悬浮召唤小铃铛 (Glassmorphic Capsule Bell) ---------- */
.mfp-float{position:fixed;left:22px;bottom:26px;z-index:99990;display:inline-flex;align-items:center;gap:9px;padding:6px 15px 6px 6px;border-radius:999px;border:1px solid rgba(37,99,235,0.18);background:rgba(255,255,255,0.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#1e1b4b;cursor:pointer;box-shadow:0 10px 28px -6px rgba(37,99,235,0.22),0 4px 10px -2px rgba(15,23,42,0.06),inset 0 1px 0 rgba(255,255,255,0.9);transition:all .24s cubic-bezier(0.16,1,0.3,1);outline:none}
.mfp-float:hover{transform:translateY(-3px);border-color:rgba(37,99,235,0.38);background:#ffffff;box-shadow:0 16px 36px -6px rgba(37,99,235,0.3),0 6px 14px -2px rgba(15,23,42,0.08)}
.mfp-float:active{transform:translateY(-1px) scale(0.97)}
.mfp-float .fl-ring{display:none}
.mfp-float .fl-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#2563eb 0%,#3b82f6 55%,#ec4899 100%);color:#fff;box-shadow:0 4px 12px rgba(37,99,235,0.35),inset 0 1px 1px rgba(255,255,255,0.4);flex-shrink:0}
.mfp-float .fl-bell svg{width:17px;height:17px;transform-origin:50% 2px;animation:mfpBellSwing 4.5s ease-in-out infinite}
.mfp-float:hover .fl-bell svg{animation:mfpBellHover .6s ease-in-out}
@keyframes mfpBellSwing{0%,78%,100%{transform:rotate(0)}82%{transform:rotate(14deg)}86%{transform:rotate(-12deg)}90%{transform:rotate(8deg)}94%{transform:rotate(-5deg)}}
@keyframes mfpBellHover{0%,100%{transform:rotate(0)}20%{transform:rotate(16deg)}45%{transform:rotate(-14deg)}70%{transform:rotate(9deg)}85%{transform:rotate(-5deg)}}
.mfp-float .fl-dot{position:absolute;top:-1px;right:-1px;width:9px;height:9px;border-radius:50%;background:#f43f5e;border:2px solid #fff;box-shadow:0 0 0 2px rgba(244,63,94,0.22)}
.mfp-float .fl-text{font-size:13px;font-weight:700;color:#0f172a;letter-spacing:.01em;white-space:nowrap;transition:color .2s}
.mfp-float:hover .fl-text{color:#2563eb}
@media(max-width:680px){.mfp-float{left:14px;bottom:calc(76px + env(safe-area-inset-bottom));padding:5px;border-radius:50%}.mfp-float .fl-text{display:none}}

/* ---------- 登录吉祥物 ---------- */
.mascot{position:fixed;right:18px;bottom:96px;z-index:900;width:210px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-lg);overflow:hidden;animation:mfpIn .4s ease}
.mascot img{display:block;width:100%;height:130px;object-fit:cover}
.mascot .ms-body{padding:13px 15px 15px}
.mascot .ms-body b{display:block;font-size:13.5px;margin-bottom:4px}
.mascot .ms-body p{margin:0 0 11px;font-size:12px;color:var(--ink-3);line-height:1.65}
.mascot .ms-x{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(23,15,43,.5);color:#fff;cursor:pointer;font-size:13px;line-height:24px;padding:0;text-align:center}

/* ---------- 手机底部导航 ---------- */
.bottom-nav{display:none;position:fixed;left:0;right:0;bottom:0;z-index:920;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.bottom-nav ul{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;margin:0;padding:0}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 0;font-size:11px;color:var(--ink-3);border-radius:10px}
.bottom-nav a.on{color:var(--brand);font-weight:600}
.bottom-nav svg{width:21px;height:21px}

/* ---------- 表格 / 表单 / 徽标（兜底页共用） ---------- */
.fk-table{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.fk-table th,.fk-table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line-2);vertical-align:middle}
.fk-table th{background:var(--bg-soft);font-size:12px;color:var(--ink-3);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.fk-table tr:last-child td{border-bottom:0}
.badge{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.badge.bad{background:var(--bad-bg);color:var(--bad)}
.badge.info{background:var(--brand-soft2);color:var(--brand-deep)}
.badge.gray{background:var(--bg-soft);color:var(--ink-3);border:1px solid var(--line)}
.input,.select,.textarea{width:100%;height:42px;border:1px solid var(--line);border-radius:9px;padding:0 13px;font-size:14px;color:var(--ink);background:#fff;transition:.16s;font-family:var(--sans)}
.textarea{height:auto;min-height:96px;padding:11px 13px;resize:vertical}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.14)}
.field{margin-bottom:16px}
.field>label{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:7px}

/* ---------- 通用页头（兜底页） ---------- */
.page-hero{background:var(--tint);border-bottom:1px solid var(--line-2);padding:44px 0;position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(37,99,235,.1) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}
.page-hero .ph-inner{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}
.page-hero h1{font-family:var(--serif);font-size:clamp(24px,3vw,32px)}
.page-hero .crumb{font-family:var(--mono);font-size:12px;color:var(--ink-3);margin-bottom:10px;letter-spacing:.06em}
.page-hero .crumb a{color:var(--ink-3)}
.page-hero .crumb a:hover{color:var(--brand)}

/* ---------- 响应式 ---------- */
@media(max-width:1100px){
  .feat-grid{grid-template-columns:repeat(2,1fr)}
  .deploy-grid{grid-template-columns:repeat(2,1fr)}
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .idc-layout{grid-template-columns:1fr;gap:30px}
  .env-sec .env-groups{grid-template-columns:repeat(2,1fr)}
  .footer .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:992px){
  .bn-inner{grid-template-columns:minmax(0,1fr) !important;padding:48px 0 56px;gap:28px}
  .bn-media-wrap{order:-1}
  .nm-body{grid-template-columns:200px 210px 1fr}
}
@media(max-width:820px){
  .nav-burger{display:flex}
  .nav-menu{position:fixed;inset:var(--nav-h) 0 auto 0;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-lg);flex-direction:column;align-items:stretch;gap:2px;padding:12px 16px 18px;display:none;max-height:calc(100vh - var(--nav-h));overflow:auto;z-index:80}
  .topbar.nav-open .nav-menu{display:flex}
  .topbar.nav-open .nav-burger span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  .topbar.nav-open .nav-burger span:nth-child(2){opacity:0}
  .topbar.nav-open .nav-burger span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
  .nav-menu>a,.nm-toggle{padding:12px 10px;border-radius:9px}
  .nav-drop-menu,.nav-mega{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px;display:none;min-width:0}
  .nav-drop.open .nav-drop-menu,.nav-drop.open .nav-mega{display:block}
  .nav-drop-cat .nav-mega{display:none !important}
  .nav-drop-cat .dd-caret{display:none !important}
  .nm-body{grid-template-columns:1fr;max-height:none;min-height:0}
  .nm-col{border-right:0;border-top:1px dashed var(--line);min-height:0;padding:12px 4px}
  .nm-pane{display:block;margin-bottom:6px}
  .nm-grid{grid-template-columns:1fr}
  .nm-ft{border-radius:0}
}
@media(max-width:680px){
  .section{padding:56px 0}
  .feat-grid,.product-grid,.deploy-grid,.env-sec .env-groups,.idc-cards{grid-template-columns:1fr}
  .bottom-nav{display:block}
  body{padding-bottom:70px}
  .sec-head-row{flex-direction:column;align-items:flex-start}
  .cta-inner,.footer-cta .fc-inner{padding:34px 26px}
  .cta-band,.footer-cta{margin:0 14px}
  .footer .footer-grid{grid-template-columns:1fr;gap:26px;padding:44px 0 30px}
  .mascot{display:none}
  .bn-meta{gap:22px}
}
@media print{
  .topbar,.bottom-nav,.mascot,.footer-cta{display:none}
}

/* ==================== Fly 手绘涂鸦层（手绘边框 / 贴纸 / 涂鸦图形） ==================== */
/* 歪歪扭扭的手绘边框（多形态，避免整齐划一） */
.wobbly{border:2.5px solid #241b3f;border-radius:255px 15px 225px 15px/15px 225px 15px 255px}
.wobbly-2{border:2.5px solid #241b3f;border-radius:15px 225px 15px 255px/255px 15px 225px 15px}
.wobbly-3{border:2.5px solid #241b3f;border-radius:125px 10px 20px 185px/25px 205px 205px 25px}
/* 手绘波浪下划线（替代渐变文字） */
.doodle-u{padding-bottom:.18em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 24' preserveAspectRatio='none'%3E%3Cpath d='M4 16 Q 30 6 55 13 T 104 12 T 152 14 T 196 9' fill='none' stroke='%23f472b6' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat bottom/100% .16em}
.doodle-u-v{padding-bottom:.18em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 24' preserveAspectRatio='none'%3E%3Cpath d='M4 15 Q 35 20 60 12 T 108 15 T 155 9 T 196 14' fill='none' stroke='%23fbbf24' stroke-width='7' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat bottom/100% .16em}
/* 贴纸 */
.sticker{display:inline-flex;align-items:center;gap:6px;background:#fff;border:2.5px solid #241b3f;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;padding:7px 16px;font-weight:700;font-size:13.5px;color:#241b3f;box-shadow:3px 4px 0 rgba(36,27,63,.9);transform:rotate(-2deg)}
.sticker.st-rot2{transform:rotate(1.6deg);border-radius:15px 225px 15px 255px/255px 15px 225px 15px}
.sticker.st-pink{background:#fde7f3}
.sticker.st-vio{background:#dbeafe}
.sticker.st-yel{background:#fef3c7}
.sticker svg{flex:none}
/* 漂浮涂鸦 */
.doodle-float{position:absolute;pointer-events:none;color:#241b3f}
.doodle-float.df-1{top:6%;left:3%;transform:rotate(-12deg)}
.doodle-float.df-2{top:12%;right:4%;transform:rotate(14deg);color:#f472b6}
.doodle-float.df-3{bottom:8%;left:42%;transform:rotate(8deg);color:#2563eb}
/* 特性卡：手绘图标砖 */
.feat-ic.sketch{background:#fff;border:2.5px solid #241b3f;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;box-shadow:3px 3px 0 rgba(36,27,63,.85)}
.feat-ic.sketch svg{color:#2563eb}
.feat.sketch-card:hover .feat-ic.sketch{transform:rotate(-3deg) scale(1.04)}
/* 卡片角上的贴纸角标（替代胶囊 tag） */
.pc-stk-tag{position:absolute;top:-12px;right:12px;background:#fef3c7;border:2.5px solid #241b3f;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;box-shadow:2px 3px 0 rgba(36,27,63,.9);font-size:11px;font-weight:800;padding:3px 11px;transform:rotate(2deg);color:#241b3f}
/* 顶部导航品牌小翼 */
.brand-mark{position:relative}
/* 深色段涂鸦 */
.cta-band .cb-doodles{position:absolute;inset:0;pointer-events:none}
.footer-cta .fc-doodles{position:absolute;inset:0;pointer-events:none}
/* 首页 hero 手绘场景 */
.bn-media-wrap.sketch-scene{background:#eff6ff;border:none;box-shadow:6px 8px 0 rgba(36,27,63,.15),0 0 0 2.5px #241b3f;border-radius:255px 15px 225px 15px/15px 225px 15px 255px;overflow:hidden}
.bn-media-wrap.sketch-scene img,.bn-media-wrap.sketch-scene video{border-radius:0}

/* ==================== 首页内容增强 ==================== */
/* 客户/生态 Logo 墙 */
.logo-sec{padding:34px 0 10px}
.logo-sec .lg-tip{text-align:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:22px}
.lg-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.lg-item{display:inline-flex;align-items:center;gap:9px;height:52px;padding:0 24px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink-3);font-weight:700;font-size:15px;transition:.18s;letter-spacing:.02em}
.lg-item:hover{color:var(--brand);border-color:var(--brand-line);transform:translateY(-2px)}
.lg-item svg{opacity:.65}
/* 产品分区卡（数据驱动） */
.pg-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pg-card{position:relative;display:flex;flex-direction:column;gap:6px;background:#fff;border:2px solid var(--line);border-radius:14px;padding:22px 20px 18px;transition:.18s;color:var(--ink)}
.pg-card:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-3px);color:var(--ink)}
.pg-card .pg-ic{width:38px;height:38px;border-radius:10px;background:var(--brand-soft);color:var(--brand);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.pg-card b{font-size:15.5px}
.pg-card .pg-sub{font-size:12.5px;color:var(--ink-3);line-height:1.7;flex:1}
.pg-card .pg-meta{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding-top:12px;border-top:1px dashed var(--line);font-size:12px;color:var(--muted)}
.pg-card .pg-go{display:inline-flex;align-items:center;gap:5px;color:var(--brand);font-weight:700;font-size:12.5px}
/* 三步部署 */
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.step-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px 22px;transition:.18s}
.step-card:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-3px)}
.step-no{font-family:var(--mono);font-size:12px;font-weight:700;color:#fff;background:var(--dark);border-radius:8px;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-bottom:14px;transform:rotate(-3deg);box-shadow:2.5px 2.5px 0 rgba(36,27,63,.35)}
.step-card b{display:block;font-size:16px;margin-bottom:8px}
.step-card p{font-size:13.5px;color:var(--ink-3);margin:0 0 14px;line-height:1.8}
.step-code{font-family:var(--mono);font-size:11.5px;background:var(--dark);color:#b7aade;border-radius:8px;padding:8px 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.step-code em{font-style:normal;color:#7ee2a8}
/* 社交认证（头像堆叠） */
.bn-proof{display:flex;align-items:center;gap:12px;margin-top:26px}
.bn-avatars{display:flex}
.bn-avatars span{width:34px;height:34px;border-radius:50%;border:2.5px solid #fff;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:800;color:#fff;margin-left:-9px;box-shadow:0 2px 6px rgba(33,26,51,.18)}
.bn-avatars span:first-child{margin-left:0}
.bn-proof p{margin:0;font-size:12.5px;color:var(--ink-3);line-height:1.55}
.bn-proof b{color:var(--ink)}
/* Hero 场景贴纸 */
.bn-media-wrap .bn-tag{position:absolute;left:14px;bottom:14px;z-index:3}
.bn-media-wrap .bn-tag2{position:absolute;right:12px;top:14px;z-index:3}
/* 节点区网络弧线 */
.deploy-wrap{position:relative}
.deploy-arcs{position:absolute;inset:0;pointer-events:none;opacity:.6}
.deploy-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px;flex-wrap:wrap;font-size:13px;color:#a99ccf}
.deploy-foot a{color:#93c5fd}
/* 环境组描述 */
.env-group .eg-desc{font-size:12.5px;color:var(--ink-3);margin:-8px 0 14px;line-height:1.7}
@media(max-width:1100px){.pg-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.pg-grid,.step-grid{grid-template-columns:1fr}.lg-row{gap:10px}}
.deploy-wrap .deploy-grid{position:relative;z-index:1}

/* ==================== 精选推荐（复刻 default 结构 · 后台首页精选驱动） ==================== */
.sec-kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brand);margin-bottom:10px}
.sec-kicker:before{content:"";width:18px;height:2px;background:var(--grad);border-radius:2px}
.home-tab-bar-wrap{position:relative;display:flex;align-items:center;gap:8px;flex:0 1 auto;min-width:0;max-width:100%;margin-bottom:0}
.home-tab-bar{display:flex;gap:10px;overflow-x:auto;scroll-behavior:smooth;flex:0 1 auto;margin-left:auto;padding:2px;-ms-overflow-style:none;scrollbar-width:none}
.home-tab-bar::-webkit-scrollbar{display:none}
.ht-arrow{flex:none;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;padding:0}
.ht-arrow:hover{border-color:var(--brand-line);color:var(--brand)}
.ht-arrow:disabled{opacity:.35;cursor:default}
.home-tab-item{position:relative;flex:none;padding:9px 20px;border-radius:999px;border:1px solid var(--line);background:var(--bg-soft);color:var(--ink-2);font-size:14px;font-weight:600;cursor:pointer;transition:.25s;white-space:nowrap;font-family:var(--sans)}
.home-tab-item:hover{border-color:var(--brand-line);color:var(--brand);transform:translateY(-1px)}
.home-tab-item.active{background:var(--dark);color:#fff;border-color:var(--dark)}
.home-tab-item.active::after{content:'';position:absolute;left:50%;bottom:-10px;height:3px;width:22px;border-radius:3px;background:var(--grad);transform:translateX(-50%);animation:htDot .35s ease both}
@keyframes htDot{from{opacity:0;transform:translateX(-50%) scaleX(.3)}to{opacity:1;transform:translateX(-50%) scaleX(1)}}
.home-tabs{margin-top:6px}
.home-tab-panel{display:none}
.home-tab-panel.active{display:block;animation:htFade .3s ease}
@keyframes htFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.home-tab-panel.active .product-card{animation:pcIn .5s cubic-bezier(.22,.85,.35,1) backwards}
.home-tab-panel.active .product-card:nth-child(2){animation-delay:.07s}
.home-tab-panel.active .product-card:nth-child(3){animation-delay:.14s}
.home-tab-panel.active .product-card:nth-child(4){animation-delay:.21s}
.home-tab-panel.active .product-card:nth-child(5){animation-delay:.28s}
.home-tab-panel.active .product-card:nth-child(6){animation-delay:.35s}
.home-tab-panel.active .product-card:nth-child(7){animation-delay:.42s}
.home-tab-panel.active .product-card:nth-child(8){animation-delay:.49s}
@keyframes pcIn{from{opacity:0;transform:translateY(18px)}}
/* 精选卡片：标题带灰底头带（default 同款层次） */
.home-tab-panel .pc-top{margin:-22px -20px 16px;padding:14px 20px;background:var(--tint);border-bottom:1px solid var(--line-2);align-items:center;border-radius:14px 14px 0 0}
.home-tab-panel .product-card:hover .pc-top{background:var(--tint-2,#dbeafe)}
.home-featured-empty{grid-column:1/-1;text-align:center;padding:46px 20px;color:var(--muted);background:var(--bg-soft);border:1px dashed var(--line);border-radius:var(--radius-lg)}
.home-featured-more{margin-top:26px;text-align:center}
.home-featured-more .btn{display:inline-flex;align-items:center;gap:6px}
@media(max-width:820px){
  .sec-head-row{flex-direction:column;align-items:flex-start}
  .home-tab-bar-wrap{width:100%}
  .home-tab-bar{margin-left:0}
}

/* ==================== fly.io 交互式 CLI 终端演示窗口 ==================== */
.terminal-block{margin-top:36px;border-radius:var(--radius-lg);background:#160f26;border:1px solid #2e2350;box-shadow:0 24px 50px -15px rgba(22,15,38,.55),0 0 0 1px rgba(37,99,235,.15);overflow:hidden;font-family:var(--mono)}
.terminal-bar{display:flex;align-items:center;padding:12px 18px;background:#1e1435;border-bottom:1px solid #2e2350}
.term-dots{display:flex;gap:7px;margin-right:16px}
.term-dot{width:11px;height:11px;border-radius:50%}
.term-dot.r{background:#ff5f56}.term-dot.y{background:#ffbd2e}.term-dot.g{background:#27c93f}
.term-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.term-tabs::-webkit-scrollbar{display:none}
.term-tab{background:transparent;border:0;color:#9b8ec2;font-family:var(--mono);font-size:12px;padding:6px 12px;border-radius:6px;cursor:pointer;transition:.15s;white-space:nowrap}
.term-tab:hover{color:#fff;background:rgba(255,255,255,.06)}
.term-tab.on{color:#fff;background:rgba(37,99,235,.3);box-shadow:inset 0 0 0 1px rgba(56,189,248,.35)}
.term-pane{display:none;padding:22px 24px 26px;font-size:13.5px;line-height:1.75;color:#e3dcfa;overflow-x:auto}
.term-pane.on{display:block;animation:htFade .25s ease}
.term-line{display:flex;gap:10px;align-items:baseline}
.term-p{color:#38bdf8;font-weight:700;user-select:none;flex:none}
.term-cmd{color:#fff;font-weight:600}
.term-copy-btn{margin-left:auto;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#38bdf8;padding:2px 10px;border-radius:4px;font-size:11px;font-family:var(--mono);cursor:pointer;transition:.15s;outline:none}
.term-copy-btn:hover{background:#2563eb;color:#fff;border-color:#2563eb}
.term-out{color:#a99ec9;margin:2px 0 10px 18px}
.term-ok{color:#34d399}
.term-hl{color:#fbbf24}
.term-dim{color:#766996}
.term-cursor{display:inline-block;width:8px;height:15px;background:#38bdf8;vertical-align:middle;margin-left:4px;animation:tCur 1s infinite}
@keyframes tCur{0%,49%{opacity:1}50%,100%{opacity:0}}

/* ==================== JidonYun 布局参考 · 快捷入口卡片 ==================== */
.quick-entry-sec{background:#fff;border-bottom:1px solid var(--line);position:relative;z-index:10;box-shadow:0 4px 20px -8px rgba(33,26,51,.04)}
.qe-wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.5fr);gap:1px;background:var(--line);border-left:1px solid var(--line);border-right:1px solid var(--line)}
.qe-item{display:flex;align-items:center;gap:14px;padding:22px 24px;background:#fff;color:var(--ink);text-decoration:none;transition:all .2s ease;position:relative}
.qe-item:hover{background:var(--brand-soft);color:var(--ink);text-decoration:none}
.qe-tag{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:4px;margin-bottom:6px;line-height:1.4}
.qe-tag.hot{background:#fee2e2;color:#dc2626}
.qe-tag.rec{background:var(--brand-soft2);color:var(--brand-deep)}
.qe-tag.global{background:#e0f2fe;color:#0284c7}
.qe-text{flex:1;min-width:0}
.qe-title{font-size:15px;font-weight:700;color:var(--ink);margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qe-desc{font-size:12.5px;color:var(--ink-3);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qe-arrow{width:18px;height:18px;color:var(--brand);flex:none;transition:transform .2s ease}
.qe-item:hover .qe-arrow{transform:translateX(5px)}
/* 快捷活动宽卡 */
.qe-event{background:linear-gradient(135deg,#fcfaff 0%,#f4edfe 100%);padding:20px 24px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.qe-event:hover{background:linear-gradient(135deg,#faf6ff 0%,#efe5fd 100%)}
.qe-event-tag{position:absolute;top:0;right:0;font-size:11px;font-weight:700;color:#fff;background:var(--grad);padding:3px 12px;border-radius:0 0 0 9px}
.qe-event-links{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-top:4px}
.qe-event-link{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink-2);text-decoration:none;transition:color .18s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qe-event-link:hover{color:var(--brand)}
.qe-event-link svg{flex:none;color:var(--brand)}
@media(max-width:1100px){.qe-wrap{grid-template-columns:repeat(2,1fr)}.qe-event{grid-column:1/-1}}
@media(max-width:640px){.qe-wrap{grid-template-columns:1fr}}

/* ==================== 解决方案专区 (Solutions) ==================== */
.sol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
.sol-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px 24px;display:flex;flex-direction:column;transition:all .24s ease;text-decoration:none;color:var(--ink);position:relative;overflow:hidden}
.sol-card:hover{transform:translateY(-4px);border-color:var(--brand-line);box-shadow:var(--shadow);color:var(--ink)}
.sol-head{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.sol-ic{width:52px;height:52px;border-radius:14px;background:var(--tint);border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;flex:none;transition:all .24s ease;overflow:hidden}
.sol-card:hover .sol-ic{background:#dbeafe;border-color:var(--brand-line);box-shadow:0 6px 16px -4px rgba(37,99,235,.25);transform:scale(1.05)}
.sol-sprite{width:36px;height:36px;display:block;background-size:100% 1700%;background-position:0 0;background-repeat:no-repeat;position:relative}
.sol-static{width:36px;height:36px;object-fit:contain;display:block;transition:opacity .18s ease}
.sol-card:hover .sol-static{opacity:0}
.sol-card:hover .sol-sprite{animation:solSpritePlay .85s steps(16) infinite alternate}
@keyframes solSpritePlay{from{background-position:0 0}to{background-position:0 100%}}
.sol-title{font-size:17px;font-weight:700;color:var(--ink);margin:0}
.sol-desc{font-size:13px;color:var(--ink-3);line-height:1.75;margin:0 0 16px;flex:1}
.sol-tags{display:flex;gap:7px;flex-wrap:wrap}
.sol-tag{font-size:11.5px;color:var(--brand-deep);background:var(--brand-soft);border:1px solid var(--brand-line);padding:3px 9px;border-radius:6px;font-weight:500}
@media(max-width:960px){.sol-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.sol-grid{grid-template-columns:1fr}}

/* ==================== 为什么选择我们 (Why Choose Us) ==================== */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:36px}
.why-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px 26px;display:flex;flex-direction:column;justify-content:space-between;transition:all .24s ease;box-shadow:var(--shadow-sm)}
.why-card:hover{border-color:var(--brand-line);box-shadow:var(--shadow);transform:translateY(-3px)}
.why-main{display:flex;align-items:center;gap:22px}
.why-ic{width:82px;height:82px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--tint);border:1px solid var(--line-2);border-radius:18px;padding:10px;transition:all .26s ease;box-shadow:0 4px 14px -4px rgba(37,99,235,.1)}
.why-card:hover .why-ic{transform:translateY(-2px) scale(1.06) rotate(-2deg);border-color:var(--brand-line);background:#dbeafe;box-shadow:0 8px 22px -4px rgba(37,99,235,.25)}
.why-ic img{width:100%;height:100%;object-fit:contain;display:block}
.why-text{flex:1;min-width:0}
.why-title{font-size:18px;font-weight:700;color:var(--ink);margin:0 0 8px}
.why-desc{font-size:13.5px;color:var(--ink-2);line-height:1.75;margin:0}
.why-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px dashed var(--line)}
.why-tag{font-size:12px;color:var(--ink-2);background:var(--bg-soft);border:1px solid var(--line-2);padding:4px 12px;border-radius:6px;transition:.18s;cursor:default}
.why-tag:hover{background:var(--brand-soft);color:var(--brand-deep);border-color:var(--brand-line)}
@media(max-width:820px){
  .why-grid{grid-template-columns:1fr}
  .why-main{gap:16px}
  .why-ic{width:66px;height:66px;padding:8px;border-radius:14px}
}

/* ==================== 全球数据中心网络 (Global Infrastructure) ==================== */
.infra-sec{background:linear-gradient(180deg,#faf7ff 0%,#ffffff 100%);padding:80px 0;position:relative;overflow:hidden;border-top:1px solid var(--line-2)}
.infra-stats{display:flex;justify-content:center;gap:70px;margin:34px 0 46px;flex-wrap:wrap}
.infra-stat-item{text-align:center}
.infra-stat-num{font-family:var(--serif);font-size:44px;font-weight:700;color:var(--brand-deep);line-height:1.1;letter-spacing:-.02em}
.infra-stat-lbl{font-size:13.5px;color:var(--ink-3);margin-top:6px;font-weight:500}
.infra-map-box{position:relative;max-width:1100px;margin:0 auto;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);padding:24px 20px;overflow:hidden}
.infra-map-img{width:100%;height:auto;display:block;opacity:.88;filter:hue-rotate(240deg) saturate(.85)}
/* 节点脉冲标记 */
.map-node{position:absolute;transform:translate(-50%,-50%);z-index:2;cursor:pointer}
.mn-dot{width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(37,99,235,.25);display:block;animation:mnPulse 1.8s infinite}
@keyframes mnPulse{50%{box-shadow:0 0 0 9px rgba(37,99,235,.08)}}
.mn-tip{position:absolute;top:-28px;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;font-size:11px;font-weight:600;padding:2px 8px;border-radius:5px;white-space:nowrap;pointer-events:none;box-shadow:0 4px 10px rgba(0,0,0,.2)}
.mn-tip::after{content:"";position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);border-width:4px 4px 0;border-style:solid;border-color:#0f172a transparent transparent}
@media(max-width:768px){.infra-stats{gap:30px}.infra-stat-num{font-size:32px}.map-node{display:none}}
.infra-feature-wrap{text-align:center;margin-top:28px}
.infra-feature{display:inline-flex;align-items:center;gap:10px;padding:8px 22px;background:var(--brand-soft);border:1px solid var(--brand-line);border-radius:999px;font-size:13.5px;color:var(--brand-deep);font-weight:600}
.infra-nodes-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:28px}
.infra-node-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px 18px;transition:all .2s ease;display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.infra-node-card:hover{border-color:var(--brand-line);transform:translateY(-2px);box-shadow:var(--shadow-sm);color:var(--ink);text-decoration:none}
.infra-node-card .dn-flag{width:28px;height:20px;border-radius:3px;object-fit:cover;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.infra-node-info{flex:1;min-width:0}
.infra-node-info b{display:block;font-size:13.5px;color:var(--ink);font-weight:700}
.infra-node-info span{display:block;font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-top:2px;letter-spacing:.05em}
.infra-node-card .dn-ms{font-family:var(--mono);font-size:12px;color:#059669;font-weight:700;display:inline-flex;align-items:center;gap:5px;flex:none;background:#ecfdf5;padding:3px 8px;border-radius:5px}
.infra-node-card .dn-ms i{width:6px;height:6px;border-radius:50%;background:#10b981;box-shadow:0 0 0 2px rgba(16,185,129,.2)}
@media(max-width:960px){.infra-nodes-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.infra-nodes-grid{grid-template-columns:1fr}}

/* ==================== 在线云服务器选配与实时算价器 (Configurator) ==================== */
.cfg-sec{padding:64px 0;background:#fff;border-bottom:1px solid var(--line)}
.cfg-box{background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-lg);padding:32px 36px;box-shadow:var(--shadow-sm);position:relative}
.cfg-presets-bar{display:flex;align-items:center;gap:10px;margin-bottom:28px;padding-bottom:20px;border-bottom:1px dashed var(--line);flex-wrap:wrap}
.cfg-preset-lbl{font-size:13px;font-weight:700;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;flex:none}
.cfg-preset-btn{display:inline-flex;align-items:center;gap:7px;background:var(--bg-soft);border:1.5px solid var(--line-2);border-radius:20px;padding:6px 14px;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:all .18s;outline:none;user-select:none}
.cfg-preset-btn:hover{background:var(--brand-soft);color:var(--brand-deep);border-color:var(--brand-line)}
.cfg-preset-btn.active{background:var(--brand);color:#fff;border-color:var(--brand);box-shadow:0 4px 12px rgba(37,99,235,.25)}
.cfg-preset-btn.active .cfg-preset-tag{background:rgba(255,255,255,.2);color:#fff}
.cfg-preset-btn.active .cfg-preset-price{color:#eff6ff}
.cfg-preset-btn .cfg-preset-tag{font-size:10.5px;font-weight:700;padding:1px 6px;border-radius:4px;background:#f3e8ff;color:var(--brand-deep)}
.cfg-preset-btn .cfg-preset-price{font-size:11px;font-family:var(--mono);color:var(--muted);font-weight:normal;margin-left:2px}
.cfg-preset-btn.soldout{opacity:.55;cursor:not-allowed}
.sum-buy-btn.disabled{background:#e2e8f0!important;border-color:#cbd5e1!important;color:#94a3b8!important;cursor:not-allowed!important;box-shadow:none!important}
.cfg-grid{display:grid;grid-template-columns:1fr 340px;gap:36px;align-items:start}
.cfg-row{margin-bottom:24px}
.cfg-row:last-child{margin-bottom:0}
.cfg-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:13.5px;font-weight:700;color:var(--ink)}
.cfg-label-tip{font-weight:500;font-size:12px;color:var(--muted)}
.cfg-pills{display:flex;gap:10px;flex-wrap:wrap}
.cfg-pill{padding:9px 16px;background:#fff;border:1.5px solid var(--line-2);border-radius:10px;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:all .18s;user-select:none;display:inline-flex;align-items:center;gap:6px}
.cfg-pill:hover{border-color:var(--brand-line);color:var(--brand)}
.cfg-pill.active{background:var(--brand-soft);border-color:var(--brand);color:var(--brand-deep);box-shadow:0 0 0 2px rgba(37,99,235,.1)}
.cfg-pill-sub{font-size:11px;color:var(--muted);font-weight:normal}
.cfg-pill.active .cfg-pill-sub{color:var(--brand)}
.cfg-slider-wrap{background:var(--bg-soft);padding:14px 18px;border-radius:12px;border:1px solid var(--line-2)}
.cfg-slider-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cfg-slider-val{font-family:var(--mono);font-size:16px;font-weight:700;color:var(--brand-deep)}
.cfg-range{width:100%;height:6px;background:var(--line);border-radius:3px;outline:none;-webkit-appearance:none;cursor:pointer}
.cfg-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 2px 6px rgba(37,99,235,.4);cursor:pointer;transition:.15s}
.cfg-range::-webkit-slider-thumb:hover{transform:scale(1.15)}
.cfg-slider-marks{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:6px;font-family:var(--mono)}
/* 计费周期 */
.cfg-cycles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.cfg-cycle-item{padding:10px;text-align:center;border:1.5px solid var(--line-2);border-radius:10px;cursor:pointer;background:#fff;transition:all .18s;position:relative}
.cfg-cycle-item:hover{border-color:var(--brand-line)}
.cfg-cycle-item.active{background:var(--brand-soft);border-color:var(--brand);box-shadow:0 0 0 2px rgba(37,99,235,.1)}
.cfg-cycle-name{display:block;font-size:13px;font-weight:700;color:var(--ink)}
.cfg-cycle-discount{display:inline-block;font-size:10.5px;color:#dc2626;background:#fee2e2;padding:1px 6px;border-radius:4px;margin-top:4px;font-weight:600}
/* 账单摘要卡片 */
.cfg-summary-card{background:linear-gradient(145deg,#fcfaff 0%,#f5effe 100%);border:1.5px solid var(--brand-line);border-radius:var(--radius-lg);padding:24px 22px;box-shadow:0 12px 28px -10px rgba(37,99,235,.15);position:sticky;top:84px}
.sum-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--brand-line)}
.sum-title{font-size:16px;font-weight:700;color:var(--ink);margin:0}
.sum-badge{font-size:11px;font-weight:700;color:var(--brand-deep);background:#fff;border:1px solid var(--brand-line);padding:2px 8px;border-radius:6px}
.sum-specs{list-style:none;margin:0;padding:0}
.sum-row{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;margin-bottom:10px;color:var(--ink-2)}
.sum-row span{color:var(--muted)}
.sum-row b{font-weight:600;color:var(--ink)}
.sum-price-wrap{margin-top:18px;padding-top:16px;border-top:1px dashed var(--brand-line);text-align:center}
.sum-price-del{font-size:12px;color:var(--muted);text-decoration:line-through;margin-bottom:2px}
.sum-price{display:flex;align-items:baseline;justify-content:center;gap:2px;font-family:var(--serif);line-height:1}
.sum-price small{font-size:18px;color:var(--brand-deep);font-weight:700}
.sum-price b{font-size:36px;color:var(--brand-deep);font-weight:700;letter-spacing:-.02em}
.sum-price span{font-size:12.5px;color:var(--ink-3);font-family:var(--font);margin-left:4px}
.sum-saving{display:inline-block;font-size:11px;font-weight:600;color:#059669;background:#ecfdf5;border:1px solid #a7f3d0;padding:2px 8px;border-radius:4px;margin-top:8px}
.sum-buy-btn{width:100%;margin-top:16px;justify-content:center;font-size:15px;padding:12px 20px;border-radius:10px;font-weight:700}
.sum-guarantee{display:flex;flex-direction:column;gap:5px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(37,99,235,.1);font-size:11.5px;color:var(--ink-3)}
.sum-guarantee span{display:flex;align-items:center;gap:6px}

/* ==================== 测速交互面板 (Live Ping / Looking Glass) ==================== */
.infra-test-console{margin-top:24px;background:#1e1533;border:1px solid #3d2b63;border-radius:var(--radius-lg);padding:22px 24px;color:#fff;box-shadow:0 14px 34px -10px rgba(22,15,40,.5)}
.itc-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid #332354}
.itc-node-name{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700}
.itc-node-name .dn-flag{width:26px;height:18px;border-radius:3px;object-fit:cover}
.itc-actions{display:flex;gap:8px;align-items:center}
.itc-btn{background:#2a1e47;border:1px solid #4a3875;color:#ddd;padding:6px 14px;border-radius:6px;font-size:12px;font-family:var(--mono);cursor:pointer;transition:.15s;outline:none}
.itc-btn:hover{background:#2563eb;color:#fff;border-color:#2563eb}
.itc-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;font-family:var(--mono)}
.itc-stat-box{background:#160f26;border:1px solid #2e224d;border-radius:8px;padding:12px 14px}
.itc-stat-lbl{font-size:11px;color:#9b8ec2;text-transform:uppercase;margin-bottom:4px}
.itc-stat-val{font-size:18px;font-weight:700;display:flex;align-items:baseline;gap:4px}
.itc-stat-val.ok{color:#34d399}
.itc-stat-val.hl{color:#38bdf8}
.itc-trace-box{margin-top:14px;background:#140d21;border-radius:6px;padding:12px 14px;font-family:var(--mono);font-size:11.5px;color:#a99ec9;line-height:1.7;display:none}
.itc-trace-box.show{display:block}
.infra-node-card{cursor:pointer}
.infra-node-card.active{border-color:var(--brand);background:var(--brand-soft);box-shadow:0 0 0 2px rgba(37,99,235,.15)}

/* ==================== 选购答疑手风琴 (Server FAQ Accordion) ==================== */
.faq-sec{padding:68px 0;background:#faf8fe;border-top:1px solid var(--line-2)}
.faq-wrap{max-width:820px;margin:0 auto}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);margin-bottom:12px;overflow:hidden;transition:all .2s ease}
.faq-item.open{border-color:var(--brand-line);box-shadow:var(--shadow-sm)}
.faq-q{padding:20px 24px;font-size:15.5px;font-weight:700;color:var(--ink);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;user-select:none}
.faq-q:hover{color:var(--brand)}
.faq-arrow{width:20px;height:20px;color:var(--muted);flex:none;transition:transform .25s ease}
.faq-item.open .faq-arrow{transform:rotate(180deg);color:var(--brand)}
.faq-a{display:none;padding:0 24px 22px;font-size:14px;color:var(--ink-2);line-height:1.8;border-top:1px dashed transparent}
.faq-item.open .faq-a{display:block;border-top-color:var(--line-2);padding-top:14px}

/* ==================== 全局 Toast 提示 ==================== */
.fk-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#0f172a;color:#fff;font-size:13px;font-weight:600;padding:10px 22px;border-radius:30px;box-shadow:0 12px 28px rgba(0,0,0,.3);z-index:9999;opacity:0;pointer-events:none;transition:all .25s ease}
.fk-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media(max-width:960px){
  .cfg-grid{grid-template-columns:1fr}
  .cfg-summary-card{position:static}
  .itc-stats-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .cfg-box{padding:20px 18px}
  .itc-stats-grid{grid-template-columns:1fr}
  .cfg-cycles{grid-template-columns:1fr}
}




/* ==================== 页尾四大服务保障 (Footer Service Guarantees) ==================== */
.pls-footer-service{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line-2);padding:28px 0}
.pls-service-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;list-style:none;margin:0;padding:0}
.pls-service-item{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none;transition:all .2s ease}
.pls-service-item:hover{color:var(--brand);text-decoration:none}
.pls-service-icon{width:42px;height:42px;object-fit:contain;flex:none}
.pls-service-title{font-size:15px;font-weight:700;color:var(--ink);display:block}
.pls-service-desc{font-size:12px;color:var(--muted);display:block;margin-top:2px}
@media(max-width:960px){.pls-service-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.pls-service-list{grid-template-columns:1fr}}