/* ==========================================================================
   ZaraVPN — nodes.css
   线路页专属样式：简化小旗配色 / 概览带 / 线路类型卡 / 覆盖地区徽章墙
   颜色、圆角、投影一律引用 base.css 的 :root 令牌。
   ========================================================================== */

/* ---------- 简化小旗的补充配色（.fl-red / .fl-white / .fl-blue 已在 components.css） ---------- */
.fl-ink{fill:var(--ink)}
.fl-warn{fill:var(--warn)}
.fl-sage{fill:var(--sage)}
.fl-forest{fill:var(--forest)}

/* ---------- 页头 ---------- */
.page-head .cta-row{justify-content:flex-start;margin-top:20px}
.page-head .lead{margin-top:14px}

/* ---------- 概览带（首屏事实） ---------- */
.nodes-band{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:26px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--sh-panel);
  overflow:hidden;
}
.nodes-band-cell{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:20px 22px;
  min-width:0;
}
.nodes-band-cell + .nodes-band-cell{border-left:1px dashed var(--line)}
.nodes-band-num{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(30px,3.4vw,42px);
  font-weight:500;
  line-height:1;
  letter-spacing:-.03em;
  color:var(--indigo);
}
.nodes-band-label{
  margin:0;
  font-size:13px;
  line-height:1.5;
  color:var(--ink-2);
}

/* ---------- 线路类型说明卡 ---------- */
.type-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
  border-top:3px solid var(--line-strong);
}
.type-card--iepl{border-top-color:var(--indigo)}
.type-card--relay{border-top-color:var(--sage)}
.type-card--direct{border-top-color:var(--forest)}
.type-card h3{margin:0}
.type-tagline{
  margin:0;
  font-size:13px;
  line-height:1.6;
  color:var(--ink-2);
}
.type-facts{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:8px 12px;
  margin:12px 0 0;
}
.type-facts dt{
  padding-top:3px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--ink-2);
  white-space:nowrap;
}
.type-facts dd{
  margin:0;
  font-size:14.5px;
  line-height:1.7;
  color:var(--ink-2);
}

/* ---------- 覆盖地区徽章墙 ---------- */
.cover-groups{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.cover-group{
  min-width:0;
  padding:18px 20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  box-shadow:var(--sh-panel);
}
.cover-label{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--ink-2);
}
.chip-wall{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0;
  padding:0;
}
.chip-wall li{margin:0;min-width:0}

/* ---------- 自适应 ---------- */
@media (max-width:900px){
  .cover-groups{grid-template-columns:1fr}
}
@media (max-width:768px){
  .nodes-band{grid-template-columns:1fr}
  .nodes-band-cell + .nodes-band-cell{border-left:0;border-top:1px dashed var(--line)}
  .type-facts{grid-template-columns:1fr;gap:0}
  .type-facts dt{padding-top:10px}
}
@media (max-width:640px){
  .page-head .cta-row{flex-direction:column;align-items:stretch}
  .page-head .cta-row .btn{width:100%;max-width:320px}
}