/* ============================================================
   查询站统一设计系统 v2（2026-10-06）
   现代简洁风：去渐变、单主色、轻阴影、大圆角、清晰层级
   各页原有 <style> 保持不动，本文件做覆盖升级
   ============================================================ */

/* 字体：MiSans 免费商用，按 unicode-range 分片加载 */
@import url('fonts/misans/misans.css');

:root {
  --brand: #0b3d66;        /* 深藏青（标题/主文字重音） */
  --accent: #1e7ef0;       /* 亮蓝（按钮/链接/选中） */
  --accent-weak: #eaf3fe;  /* 淡蓝底 */
  --accent-line: #c9dff8;  /* 淡蓝边 */
  --bg: #eef2f8;           /* 页面底（冷调蓝灰） */
  --card: #ffffff;
  --ink: #1c2b3a;          /* 正文 */
  --ink-2: #52627a;        /* 次级文字 */
  --ink-3: #8b9bb0;        /* 弱文字 */
  --line: #e6ebf2;         /* 边框 */
  --radius: 14px;
  --shadow: 0 1px 2px rgba(30,90,180,.05), 0 6px 20px rgba(30,90,180,.08);
  --shadow-hover: 0 8px 28px rgba(30,126,240,.16);
  --card-line: #dfe8f4;
}

html { -webkit-text-size-adjust: 100%; }
body {
  background: linear-gradient(180deg, #f0f4fa 0%, #e9eef7 60%, #edf2f9 100%) fixed;
  color: var(--ink);
  font-family: MiSans, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif !important;
  font-size: 14.5px;
  line-height: 1.75;
}

/* ---------- 头部：去大渐变，改深色纯面 + 呼吸留白 ---------- */
.header {
  background: linear-gradient(180deg, #0d3a75 0%, #12519b 100%) !important;
  padding: 0 !important;
}
.topbar { background:#08264a; color:#6b7a8f; font-size:12.5px; border-bottom:1px solid #eef1f5; }
.tb-hot a { color:#7fc9f7; }
.brand-row { max-width:1200px; margin:0 auto; padding:18px 20px 12px; }
.logo { display:flex; align-items:baseline; gap:10px; }
.logo b { font-size:23px; color:#fff; font-weight:600; letter-spacing:1px; }
.lg-sub { font-size:12px; color:rgba(255,255,255,.55); border-left:1px solid rgba(255,255,255,.3); padding-left:10px; }
.header .nav { gap:4px !important; margin:0 auto !important; max-width:1200px; padding:6px 12px !important; display:flex; justify-content:center; flex-wrap:wrap; background:rgba(255,255,255,.08); border-top:1px solid rgba(255,255,255,.12); }
.header .nav a { background:transparent !important; border:none !important; border-radius:6px !important; color:rgba(255,255,255,.88) !important; font-size:13px !important; padding:9px 12px !important; border-bottom:3px solid transparent !important; }
.header .nav a:hover { color:#fff !important; background:rgba(255,255,255,.14) !important; }
.header .nav a.on { color:#0b3d66 !important; background:#eaf4ff !important; font-weight:600 !important; box-shadow:none !important; }
.pagetitle { background:linear-gradient(120deg,#0b3d66 0%,#12518c 55%,#1e7ef0 100%); padding:36px 20px 40px; text-align:center; position:relative; overflow:hidden; }
.pagetitle::before { content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.14) 1px, transparent 1px); background-size:18px 18px; mask-image:linear-gradient(120deg, rgba(0,0,0,.9), transparent 70%); }
.pagetitle h1 { margin:0; color:#fff !important; font-size:26px !important; letter-spacing:1.5px !important; position:relative; }
.header .pagetitle p { margin-top:10px; color:#5a6472 !important; opacity:1 !important; font-size:13px !important; position:relative; }
@media (max-width:760px){
  .topbar-in { flex-direction:column; gap:3px; padding:7px 14px; }
  .pagetitle h1 { font-size:21px !important; letter-spacing:1.5px !important; text-wrap:balance; }
  .pagetitle { padding:32px 16px 36px !important; }
  .brand-row { padding:14px 14px 10px; }
  .logo b { font-size:19px; }
  .header .nav a { padding:10px 9px 8px !important; font-size:12.5px !important; }
  .pagetitle { padding:22px 14px 26px; }
}

/* 吸顶栏：匹配官网浅色风格（覆盖各页内联深蓝样式） */
.sbar { background:linear-gradient(180deg,#0d3a75,#12519b) !important; box-shadow:0 4px 18px rgba(11,61,102,.14) !important; border-bottom:1px solid #e8eef6; }
.sbar-ttl { color:#101418 !important; }
.sbar-find { border:none !important; }
.sbar-find input { color:#1c2b3a !important; }
.sbar-find select { background:#f0f5fb !important; color:#4a6274 !important; }
.sbar-find button { background:#1e7ef0 !important; }
.sbar-find button:hover { background:#1668cc !important; }
.sbar-nav a { color:rgba(255,255,255,.85) !important; border:1px solid rgba(255,255,255,.35) !important; background:transparent !important; }
.sbar-nav a:hover { background:rgba(255,255,255,.15) !important; }
.sbar-nav a.on { background:#eaf4ff !important; border-color:#eaf4ff !important; color:#0b3d66 !important; }


/* ============================================================
   DJI 式暗色门面（2026-10-19）：近黑沉浸头部 + 白字细体导航
   + 唯一蓝色 CTA + 深色标题带；内容区保持浅色易读
   ============================================================ */
.topbar { background:#fff !important; color:#6b7684 !important; border-bottom:1px solid #eceff3 !important; }
.tb-hot a { color:#2a6df4 !important; }
.header {
  background:#fff !important;
  padding:0 !important;
  border-bottom:1px solid #eef0f4 !important;
}
.brand-row { padding:20px 20px 12px !important; }
.logo b { color:#101418 !important; font-weight:600 !important; letter-spacing:2px !important; }
.lg-sub { color:#9aa4b2 !important; border-left:1px solid #e3e7ee !important; }
.header .nav { background:transparent !important; border-top:none !important; gap:1px !important; padding:4px 8px 10px !important; }
.header .nav a {
  background:transparent !important;
  color:#3d4552 !important;
  font-size:12.5px !important;
  font-weight:400 !important;
  padding:8px 9px !important;
  border-radius:999px !important;
  letter-spacing:0 !important;
  transition:color .15s, background .15s;
}
.header .nav a:hover { color:#101418 !important; background:#f2f4f7 !important; }
.header .nav a.on { color:#101418 !important; background:#eef1f5 !important; font-weight:500 !important; }
/* 标题带：暗夜沉浸 + 蓝色光晕 + 点阵 */
.pagetitle {
  background:linear-gradient(180deg,#fbfcfe 0%,#eef2f7 100%) !important;
  padding:44px 20px 48px !important;
  border-bottom:1px solid #e6eaf1;
}
.pagetitle::before {
  background-image:radial-gradient(rgba(30,60,120,.10) 1px, transparent 1px) !important;
  mask-image:radial-gradient(600px 300px at 50% 115%, rgba(0,0,0,.8), transparent) !important;
  -webkit-mask-image:radial-gradient(600px 300px at 50% 115%, rgba(0,0,0,.8), transparent) !important;
}
.pagetitle::after { content:""; position:absolute; left:50%; bottom:-140px; width:520px; height:260px; transform:translateX(-50%);
  background:radial-gradient(closest-side, rgba(42,109,244,.14), transparent); pointer-events:none; }
.pagetitle h1 { color:#101418 !important; font-weight:600 !important; letter-spacing:4px !important; font-size:26px !important; position:relative; text-wrap:balance; }
.header .pagetitle p { color:#5a6472 !important; letter-spacing:.5px !important; position:relative; }
/* 吸顶栏：同款近黑毛玻璃 */
.sbar { background:rgba(255,255,255,.97) !important; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,.06) !important; }
.sbar.show { opacity:1 !important; transform:translateY(0) !important; }
.sbar-ttl { color:#101418 !important; }
.sbar-find { border:1px solid #e3e7ee !important; background:#fff !important; }
.sbar-find input { background:transparent !important; color:#101418 !important; }
.sbar-find input::placeholder { color:#a5aebc; }
.sbar-find select { background:#f7f9fb !important; color:#4a5568 !important; border-left:1px solid #e3e7ee !important; }
.sbar-find button { background:#2a6df4 !important; }
.sbar-nav a { color:#3d4552 !important; border:1px solid #e0e5ec !important; background:#fff !important; border-radius:999px !important; }
.sbar-nav a:hover { color:#101418 !important; background:#f2f4f7 !important; }
.sbar-nav a.on { background:#101319 !important; border-color:#101319 !important; color:#fff !important; }
/* 回到顶部按钮配深色 */
.totop { background:#fff !important; color:#101418 !important; border:1px solid #e0e5ec !important; }

/* 一键置顶按钮（全站通用） */
#gotop { position:fixed; right:22px; bottom:26px; z-index:999; width:44px; height:44px;
  border:none; border-radius:50%; background:#2563eb; color:#fff; cursor:pointer;
  box-shadow:0 3px 10px rgba(37,99,235,.35); display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:translateY(14px); transition:all .25s ease; }
#gotop.show { opacity:1; visibility:visible; transform:translateY(0); }
#gotop:hover { background:#1e3a5f; }
@media (max-width:600px){ #gotop { right:14px; bottom:18px; width:40px; height:40px; } }
