/* ============================================================
   南方數據官網 —— 淺色主題（覆蓋 site.css 的深色 token）
   白底 · 黑字 · 細灰邊框 · 黑色主按鈕
   ============================================================ */

:root{
  --bg:        #ffffff;
  --bg-elev:   #fafafa;
  --bg-card:   #ffffff;
  --ink:       #111318;
  --ink-dim:   #3d434e;
  --muted:     #6b7280;
  --line:      rgba(17,19,24,.12);
  --line-soft: rgba(17,19,24,.07);
  --accent:    #111318;
  --accent-ink:#1a56db;
  --cyan:      #0ea5e9;
  --ok:        #16a34a;
}

body{ background:var(--bg); color:var(--ink); }

/* 头部 */
.hdr.is-stuck{
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(140%) blur(12px);
  border-bottom-color:var(--line);
}
.nav a{ color:var(--ink-dim); }
.nav a:hover,.nav a[aria-current="page"]{ color:var(--ink); }
.nav a::after{ background:var(--ink); }
.burger{ border-color:var(--line); }
.burger span,.burger span::before,.burger span::after{ background:var(--ink); }
.drawer{ background:var(--bg); }
.drawer a{ border-bottom-color:var(--line-soft); }

/* 按钮 */
.btn{ border-color:var(--line); color:var(--ink); }
.btn:hover{ border-color:rgba(17,19,24,.35); background:rgba(17,19,24,.03); }
.btn--primary{ background:var(--ink); border-color:var(--ink); color:#fff; }
.btn--primary:hover{ background:#2b2f38; border-color:#2b2f38; }
.btn--ghost:hover{ color:var(--accent-ink); background:none; }
.link-arrow{ color:var(--accent-ink); }

/* 首屏 */
.hero{ border-bottom-color:var(--line-soft); }
.hero__mesh{
  opacity:1;
  background-image:
    linear-gradient(to right, rgba(17,19,24,.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(17,19,24,.055) 1px, transparent 1px);
}
.hero__aside{
  background:
    radial-gradient(160deg, rgba(17,19,24,.03), transparent 55%),
    #fff;
  border-color:var(--line);
  border-radius:14px;
}
.hero__aside-hd{ border-bottom-color:var(--line-soft); }

/* 数据条 */
.stats{ border-top-color:var(--line-soft); border-radius:12px; }
.stat{ border-right-color:var(--line-soft); }
.stat__v span{ color:var(--muted); }

/* 卡片栅格：白底卡片 + 灰边 */
.grid-2,.grid-3{ background:transparent; border:0; gap:18px; }
.cell{
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 1px 2px rgba(17,19,24,.04);
}
.cell:hover{ background:#fff; border-color:rgba(17,19,24,.2); box-shadow:0 4px 16px rgba(17,19,24,.06); }
.cell h3{ color:var(--ink); }
.cell p{ color:var(--ink-dim); }
.cell li{ border-top-color:var(--line-soft); color:var(--ink-dim); }
.cell li::before{ color:var(--ink); }
.cell__no{ color:var(--muted); }

/* 机房/服务块 */
.fac{ background:transparent; border:0; gap:18px; }
.fac__body,.fac__media{ border:1px solid var(--line); border-radius:14px; }
.fac__body{ background:#fff; }
.fac__media{
  background:radial-gradient(circle at 70% 30%, rgba(17,19,24,.035), transparent 60%), var(--bg-elev);
}
.fac__tag{ color:var(--ok); border-color:rgba(22,163,74,.3); background:rgba(22,163,74,.06); }

/* 规格表 */
.spec-table th{ color:var(--muted); }
.spec-table th,.spec-table td{ border-bottom-color:var(--line-soft); }
.spec-table td{ color:var(--ink); }

/* 流程步骤 */
.steps{ border-top-color:var(--line); }
.step::before{ background:var(--ink); }
.step__n{ color:var(--muted); }

/* CTA 带 */
.cta{
  border-top-color:var(--line);
  background:var(--bg-elev);
}

/* 提示块 */
.note{ background:var(--bg-elev); border-color:var(--line); border-radius:12px; }
.note strong{ color:var(--ink); }

/* 表单 */
.field input,.field textarea,.field select{
  background:#fff; border-color:var(--line); color:var(--ink);
}
.field input:focus,.field textarea:focus,.field select:focus{ border-color:var(--ink); background:#fff; }
.field label{ color:var(--muted); }

/* 页脚 */
.ftr{ border-top-color:var(--line-soft); }
.ftr ul a{ color:var(--ink-dim); }
.ftr ul a:hover{ color:var(--ink); }
.ftr h5{ color:var(--muted); }
.ftr__bot{ border-top-color:var(--line-soft); color:var(--muted); }

/* 拓扑图配色（浅底） */
.topo-node{ fill:#fff; stroke:rgba(17,19,24,.18); }
.topo-line{ stroke:rgba(17,19,24,.35); }
.topo-line--dash{ stroke:rgba(17,19,24,.14); }
.topo-txt{ fill:var(--muted); }
.topo-txt--accent{ fill:var(--accent-ink); }

/* 标签 */
.tag,.eyebrow{ color:var(--muted); }
.eyebrow::before{ background:var(--ink); }
