/* ══════════════════════════════════════════════════════════════
   妙笔 · 智慧写作 — 协议 / 政策页 共享样式
   对齐 common.css 设计 token（--primary #7C3AED 等）
   文档阅读型布局：hero + TOC + 章节 + 页脚协议导航
   ══════════════════════════════════════════════════════════════ */
*{box-sizing:border-box}
body{
  margin:0;background:var(--bg,#FBFAFE);color:var(--text,#1F2937);
  font-family:var(--font-family,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif);
  line-height:1.75;
}

.legal-wrap{max-width:840px;margin:0 auto;padding:var(--space-6) var(--space-5) var(--space-10)}

/* ── 顶栏（复用 common.css .nav-bar 风格） ── */
.legal-nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-light,#EEE);
  background:var(--white,#fff);position:sticky;top:0;z-index:10;
}
.legal-nav .logo{font-size:var(--font-size-md);font-weight:600;color:var(--text);display:flex;align-items:center;gap:.4rem}
.legal-nav .logo span{color:var(--primary)}
.legal-nav .logo img{width:24px;height:24px;border-radius:6px}
.legal-nav a.back{color:var(--primary);font-weight:600;text-decoration:none;font-size:var(--font-size-sm)}
.legal-nav a.back:hover{text-decoration:underline}

/* ── Hero ── */
.legal-hero{
  background:var(--gradient-hero,linear-gradient(135deg,#4C1D95,#6D28D9 55%,#7C3AED));
  border-radius:var(--radius-lg,16px);padding:var(--space-8) var(--space-6);
  color:#fff;margin:var(--space-5) 0 var(--space-6);box-shadow:var(--shadow,0 2px 16px rgba(0,0,0,.08));
}
.legal-hero .eyebrow{
  display:inline-block;background:rgba(255,255,255,.18);border-radius:99px;
  padding:var(--space-1) var(--space-4);font-size:var(--font-size-xs);letter-spacing:1px;margin-bottom:var(--space-3);
}
.legal-hero h1{font-size:var(--font-size-2xl,1.6rem);margin:0 0 var(--space-3);font-weight:600;line-height:1.3}
.legal-hero .meta{opacity:.9;font-size:var(--font-size-sm);margin:0}

/* ── 目录 TOC ── */
.legal-toc{
  background:var(--white,#fff);border:1px solid var(--border,#E5E1EF);border-radius:var(--radius-lg,16px);
  padding:var(--space-5);margin-bottom:var(--space-6);
}
.legal-toc .toc-title{font-size:var(--font-size-sm);font-weight:600;color:var(--text-muted);margin:0 0 var(--space-3)}
.legal-toc ol{margin:0;padding-left:0;columns:2;column-gap:2rem;list-style:none}
.legal-toc li{margin:.3rem 0;break-inside:avoid}
.legal-toc a{color:var(--primary);text-decoration:none;font-size:var(--font-size-sm)}
.legal-toc a:hover{text-decoration:underline}

/* ── 章节 ── */
.legal-section{margin:var(--space-7) 0}
.legal-section:first-of-type{margin-top:var(--space-4)}
.legal-section h2{
  font-size:var(--font-size-lg,1.15rem);margin:0 0 var(--space-3);
  display:flex;align-items:center;gap:.5rem;color:var(--text);font-weight:600;
}
.legal-section h2::before{
  content:"";width:4px;height:1.15rem;background:var(--primary);border-radius:4px;display:inline-block;flex-shrink:0;
}
.legal-section h3{font-size:var(--font-size-md,0.95rem);margin:var(--space-5) 0 var(--space-2);color:var(--primary-dark,#6D28D9);font-weight:600}
.legal-section p{margin:0 0 var(--space-3);color:var(--text-secondary,#4B5563);font-size:var(--font-size-md,0.95rem)}
.legal-section ul,.legal-section ol.list{margin:0 0 var(--space-3);padding-left:1.3rem;color:var(--text-secondary,#4B5563);font-size:var(--font-size-md,0.95rem)}
.legal-section li{margin:.35rem 0}
.legal-section strong{color:var(--text)}

/* ── 强调提示框 ── */
.callout{
  background:var(--primary-light,#EDE9FE);border-left:4px solid var(--primary);
  border-radius:var(--radius,10px);padding:var(--space-4) var(--space-5);
  margin:var(--space-4) 0;font-size:var(--font-size-sm);color:var(--primary-dark,#6D28D9);line-height:1.7;
}
.callout b{color:var(--primary-dark)}

/* ── 页脚协议导航 ── */
.legal-footer{
  text-align:center;padding:var(--space-8) var(--space-5);font-size:var(--font-size-sm);
  color:var(--text-muted);background:var(--bg);border-top:1px solid var(--border-light);margin-top:var(--space-10);
}
.legal-footer .links{display:flex;gap:.4rem 1rem;justify-content:center;flex-wrap:wrap;margin-bottom:var(--space-3)}
.legal-footer .links a{color:var(--primary);text-decoration:none;font-weight:500}
.legal-footer .links a:hover{text-decoration:underline}
.legal-footer .copyright{opacity:.85}

/* ── 联系我们：服务号二维码（4 份协议页通用） ── */
.contact-qr{
  display:flex;align-items:center;gap:var(--space-5);
  background:var(--primary-light,#EDE9FE);border:1px solid var(--border,#E5E1EF);
  border-radius:var(--radius-lg,16px);padding:var(--space-5);margin-top:var(--space-4);
}
.contact-qr img{width:140px;height:140px;object-fit:contain;border-radius:var(--radius,10px);
  background:#fff;box-shadow:var(--shadow,0 2px 8px rgba(0,0,0,.08));flex-shrink:0}
.contact-qr .cq-title{font-size:var(--font-size-md,0.95rem);font-weight:600;color:var(--primary-dark,#6D28D9);margin-bottom:var(--space-2)}
.contact-qr p{margin:0;font-size:var(--font-size-sm);color:var(--text-secondary,#4B5563)}

@media(max-width:640px){
  .contact-qr{flex-direction:column;text-align:center}
  .legal-toc ol{columns:1}
  .legal-hero{padding:var(--space-6) var(--space-5)}
  .legal-hero h1{font-size:var(--font-size-xl,1.3rem)}
}
  .legal-toc ol{columns:1}
  .legal-hero{padding:var(--space-6) var(--space-5)}
  .legal-hero h1{font-size:var(--font-size-xl,1.3rem)}
}