/* =============================================================================
   VPNZM · legal-terms.css
   使用条款页专属排版:阅读栏、章节节奏与要点侧栏。
   颜色、圆角、阴影一律取自 base.css 的设计令牌,不新增色值。
   ========================================================================== */

.legal-hero{padding-bottom:0}
.legal-hero .kicker{margin-bottom:4px}
.legal-hero h1{margin-top:8px;font-size:clamp(38px,4.4vw,56px);letter-spacing:-.03em}
.legal-meta{
  margin-top:12px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;
  color:var(--text-muted);
}
.legal-lede{
  margin-top:12px;max-width:62ch;
  font-size:15px;line-height:1.8;color:var(--text-muted);
}

.legal-main{padding-top:28px}
.legal-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(248px,296px);
  gap:26px;
  align-items:start;
}

.legal-doc{
  min-width:0;
  padding:30px 28px 34px;
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-card);
}
.legal-doc h2{
  margin-top:34px;padding-top:24px;
  font-size:21px;letter-spacing:-.012em;
  border-top:1px solid var(--border);
}
.legal-doc h2:first-of-type{margin-top:0;padding-top:0;border-top:0}
.legal-doc p{margin-top:12px;font-size:14.5px;line-height:1.85}
.legal-doc ul{margin-top:12px;display:grid;gap:8px}
.legal-doc li{
  position:relative;padding-left:20px;
  font-size:14.5px;line-height:1.8;
}
.legal-doc li::before{
  content:"";position:absolute;left:3px;top:.78em;
  width:6px;height:6px;border-radius:50%;
  background:var(--accent);opacity:.5;
}
.legal-doc .callout{margin-top:14px}

.legal-aside{display:grid;gap:14px;min-width:0}
.legal-card-title{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;
  color:var(--text-muted);
}
.legal-facts{display:grid;gap:12px;margin-top:14px}
.legal-facts b{display:block;font-size:13.5px;color:var(--text);font-weight:700}
.legal-facts span{
  display:block;margin-top:3px;
  font-size:12.5px;line-height:1.7;color:var(--text-muted);
}
.legal-links{display:grid;gap:2px;margin-top:10px}
.legal-links a{
  display:inline-flex;align-items:center;min-height:32px;
  font-size:13.5px;color:var(--text-muted);
}
.legal-links a:hover{color:var(--accent)}

@media (max-width:900px){
  .legal-grid{grid-template-columns:1fr;gap:20px}
  .legal-doc{padding:24px 20px 28px}
}
@media (max-width:640px){
  .legal-hero h1{font-size:34px;letter-spacing:-.02em}
  .legal-doc h2{font-size:19px;margin-top:28px;padding-top:20px}
  .legal-doc p,.legal-doc li{font-size:14px}
  .legal-lede{font-size:14px}
}