/* ============================================================
   自動跟隨用戶系統外觀：淺色模式自動適配 (Prefers Color Scheme: Light)
   ============================================================ */
@media (prefers-color-scheme: light) {
/* ============================================================
   南方數據官網 —— 淺色主題（覆蓋 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); }

/* ---- 遠程支援服务页 ---- */
.feat-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.feat{border:1px solid #E7E9EE;border-radius:10px;padding:20px 22px;background:#fff;transition:border-color .2s,box-shadow .2s;display:block}
a.feat:hover{border-color:#111318;box-shadow:0 6px 20px rgba(17,19,24,.07)}
.feat h3{font-size:16px;margin:0 0 8px;color:#111318}
.feat p{font-size:14px;line-height:1.7;color:#5A6070;margin:0}
.ticks{list-style:none;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ticks li{position:relative;padding-left:22px;font-size:14.5px;color:#333}
.ticks li:before{content:"✓";position:absolute;left:0;color:#111318;font-weight:700}
.steps{padding-left:20px}
.steps li{margin:10px 0;line-height:1.75}
details.faq{border-bottom:1px solid #E7E9EE;padding:14px 0}
details.faq summary{cursor:pointer;font-weight:600;color:#111318;list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:before{content:"+";display:inline-block;width:18px;color:#8A90A0}
details.faq[open] summary:before{content:"−"}
details.faq p{margin:10px 0 0;color:#5A6070;line-height:1.75;font-size:14.5px}

/* 导航项变多后收紧间距，避免折行 */
@media (min-width:1025px){
  .nav{gap:18px}
  .nav a{font-size:13.5px;white-space:nowrap}
  .hdr__cta .btn{padding:10px 16px;font-size:13.5px}
}

}