/* ============================================================
   39VPN · nodes.css(servers.html 线路列表页专属)
   ============================================================ */

:root{
  /* 旗帜补充色(固定真实国旗色,不参与主题切换) */
  --f-black:#1A1A1A;
  --f-gold:#FFCC00;
  --f-navy:#003893;
  --f-saffron:#FF9933;
  --f-sky:#74ACDF;
}

/* ============ 首屏(复用 .hero 骨架,补纵向节奏) ============ */
.nodes-hero .hero-inner{padding-bottom:64px}
.nodes-hero .glow{top:6%}

/* ============ 章节头 ============ */
.sec-head{max-width:780px;margin:0 auto 36px;text-align:center}
.sec-head h2{margin:0 0 12px}
.sec-head p{color:var(--muted);font-size:15px}
.sec-head-dark p{color:var(--deep-muted)}

/* ============ 线路表附注 ============ */
.table-note{margin-top:16px;padding:14px 18px;border:1px dashed var(--border-strong);border-radius:var(--radius-lg);font-size:13px;line-height:1.75;color:var(--muted)}
.lines-more{margin-top:22px;text-align:center}
.more-link{display:inline-flex;align-items:center;min-height:40px;padding:8px 18px;font-size:14.5px;font-weight:700;color:var(--accent);transition:color .15s}
.more-link:hover{color:var(--accent-dark)}

/* ============ 线路类型(暗区面板) ============ */
.type-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.type-grid > *{min-width:0}
.type-card h3{font-size:18px;margin:0 0 10px}
.type-card p{font-size:14px;line-height:1.8}
.type-tag{display:flex;align-items:center;gap:9px;margin-bottom:14px}
.type-fit{margin-top:16px;padding-top:12px;border-top:1px dashed var(--deep-line);font-size:13px;line-height:1.7;color:var(--deep-muted)}
.type-fit strong{color:var(--deep-text)}
.dark-tip{margin-top:20px;border-left:3px solid var(--accent);background:rgba(159,176,214,.08);border-radius:0 var(--radius-lg) var(--radius-lg) 0;padding:16px 20px;font-size:14px;line-height:1.75;color:var(--deep-muted)}
.dark-tip strong{color:var(--deep-text)}

/* ============ 选线建议卡 ============ */
.usecase-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.usecase-grid > *{min-width:0}
.usecase-card{display:flex;flex-direction:column;gap:10px;padding:22px 18px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);box-shadow:var(--shadow-card)}
.usecase-head{display:flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--text)}
.usecase-head i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.uc-a i{background:var(--accent)}
.uc-b i{background:var(--pink)}
.uc-c i{background:var(--gold)}
.uc-d i{background:var(--ok)}
.uc-e i{background:var(--warn)}
.usecase-card p{font-size:13px;line-height:1.75;color:var(--muted)}
.usecase-card p a{color:var(--accent);font-weight:600}
.usecase-card p a:hover{color:var(--accent-dark)}

/* ============ 覆盖地区徽章墙 ============ */
.region-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:6px 0 26px}
.region-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:9px 20px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--bg);font-size:13.5px;font-weight:600;color:var(--text);box-shadow:var(--shadow-card)}
.region-chip i{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.rc-a i{background:var(--accent)}
.rc-b i{background:var(--ok)}
.rc-c i{background:var(--gold)}
.rc-d i{background:var(--pink)}
.rc-e i{background:var(--warn)}
.rc-f i{background:var(--accent-dark)}
.rc-g i{background:var(--muted)}
.coverage-note{max-width:760px;margin:0 auto;text-align:center;font-size:14.5px;line-height:1.8;color:var(--muted)}

/* 选线建议下方的提示块与版心对齐 */
#guide .callout{margin-top:24px}

/* ============ 响应式 ============ */
@media (max-width:1024px){
  .usecase-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
  .type-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .nodes-hero .hero-inner{padding-bottom:48px}
  .region-chip{min-height:36px;padding:7px 16px;font-size:12.5px}
}
@media (max-width:480px){
  .usecase-grid{grid-template-columns:1fr}
}