/* ============================================================================
   法律文书页共用样式（隐私政策 / 服务条款）
   ----------------------------------------------------------------------------
   为什么单独一个文件、而不是复用 assets/site.css：
     site.css 是给「商城 App 外壳」用的（顶栏、底部 Tab、卡片流），
     法律页是另一种东西 —— 一篇要能安静读完的长文。
     两套版式硬塞进一个文件，改商城版式时就会误伤法律页。

   为什么这两个页面【不依赖 JS 也能读】：
     法律文书要在任何情况下可访问、可截图、可打印、可存档。
     接口挂了、JS 报错、老浏览器 —— 都不能变成「看不到隐私政策」。
     所以公司名称、备案号这类动态信息用「先写占位、JS 到位再替换」的方式，
     而不是等 JS 渲染出整页。
   ========================================================================== */

:root{
  --bg:#F6FBFD;
  --surface:#FFFFFF;
  --surface-2:#F0F8FB;
  --ink:#0B2A34;
  --ink-2:#4E7280;
  --ink-3:#87A4AE;
  --line:rgba(11,42,52,.10);
  --aqua:#0FA3B1;
  --aqua-deep:#06737F;
  --aqua-soft:#E4F5F8;
  --ok:#0A7256;
  --warn:#9A6108;
  --warn-soft:#FFF4EC;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --serif:"Noto Serif SC",Georgia,"Songti SC",serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:15.5px;line-height:1.9;
  -webkit-font-smoothing:antialiased;
}

/* ---------- 顶栏 ---------- */
.lg-top{
  position:sticky;top:0;z-index:10;
  background:rgba(246,251,253,.92);backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--line);
}
.lg-top-in{
  max-width:860px;margin:0 auto;padding:12px 22px;
  display:flex;align-items:center;gap:12px;
}
.lg-mark{
  width:30px;height:30px;border-radius:10px;flex:none;
  background:linear-gradient(140deg,var(--aqua),var(--aqua-deep));
  display:grid;place-items:center;color:#fff;font-weight:700;font-size:13px;
  letter-spacing:.5px;
}
.lg-brand{font-weight:700;font-size:15px;letter-spacing:.3px}
.lg-brand small{display:block;font-weight:500;font-size:11px;color:var(--ink-3);letter-spacing:.6px}
.lg-back{
  margin-left:auto;font-size:13.5px;color:var(--aqua-deep);text-decoration:none;
  border:1px solid var(--line);border-radius:999px;padding:6px 14px;background:var(--surface);
  white-space:nowrap;
}
.lg-back:hover{background:var(--aqua-soft)}

/* ---------- 正文 ---------- */
.lg-wrap{max-width:860px;margin:0 auto;padding:26px 22px 60px}
.lg-head{padding:22px 0 18px;border-bottom:1px solid var(--line);margin-bottom:8px}
.lg-head h1{font-family:var(--serif);font-size:30px;line-height:1.35;letter-spacing:.5px}
.lg-meta{margin-top:10px;font-size:13px;color:var(--ink-3);line-height:1.9}
.lg-meta b{color:var(--ink-2);font-weight:600}

.lg-lead{
  background:var(--surface);border:1px solid var(--line);border-radius:16px;
  padding:16px 18px;margin:20px 0 6px;font-size:14.5px;color:var(--ink-2);
}
.lg-lead strong{color:var(--ink)}

h2{
  font-size:17.5px;font-weight:700;margin:34px 0 10px;
  padding-top:18px;border-top:1px solid var(--line);
  display:flex;gap:10px;align-items:baseline;
}
h2 .n{
  flex:none;width:24px;height:24px;border-radius:8px;background:var(--aqua-soft);
  color:var(--aqua-deep);font-size:12.5px;font-weight:700;
  display:grid;place-items:center;position:relative;top:1px;
}
h3{font-size:15px;font-weight:700;margin:18px 0 6px;color:var(--ink)}
p{margin:9px 0;color:var(--ink-2)}
p strong,li strong{color:var(--ink);font-weight:600}
ul,ol{margin:9px 0 9px 22px;color:var(--ink-2)}
li{margin:5px 0}
a{color:var(--aqua-deep)}
code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13px;background:var(--surface-2);border:1px solid var(--line);
  border-radius:5px;padding:1px 5px;color:var(--ink);
}

/* 表格：信息收集清单 */
.lg-table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14px}
.lg-table th,.lg-table td{
  border:1px solid var(--line);padding:9px 11px;text-align:left;vertical-align:top;
}
.lg-table th{background:var(--surface-2);font-weight:600;color:var(--ink);white-space:nowrap}
.lg-table td{color:var(--ink-2)}
.lg-table td:first-child{color:var(--ink);font-weight:600}

/* 提示块 */
.lg-note{
  border-left:3px solid var(--aqua);background:var(--aqua-soft);
  border-radius:0 12px 12px 0;padding:12px 15px;margin:14px 0;font-size:14px;color:var(--ink-2);
}
.lg-note.warn{border-left-color:#E0A32E;background:var(--warn-soft)}
.lg-note strong{color:var(--ink)}
.lg-note .t{display:block;font-weight:700;color:var(--ink);margin-bottom:3px}

/* 待补字段：后台没维护时显示这个，绝不印 undefined */
.todo{
  background:var(--warn-soft);border:1px dashed #E0A32E;border-radius:5px;
  padding:0 5px;font-size:13.5px;color:var(--warn);
}

/* 联系方式卡片 */
.lg-card{
  background:var(--surface);border:1px solid var(--line);border-radius:16px;
  padding:16px 18px;margin:16px 0;
}
.lg-card dl{display:grid;grid-template-columns:88px 1fr;gap:6px 14px;font-size:14px}
.lg-card dt{color:var(--ink-3)}
.lg-card dd{color:var(--ink);font-weight:600}

/* ---------- 页脚 ---------- */
.lg-foot{
  border-top:1px solid var(--line);background:var(--surface);
  padding:22px;margin-top:40px;
}
.lg-foot-in{max-width:860px;margin:0 auto;font-size:13px;color:var(--ink-3);line-height:2}
.lg-foot-in a{color:var(--ink-2)}
.lg-foot-links{margin-bottom:6px}
.lg-foot-links a{margin-right:14px;text-decoration:none}
.lg-foot-links a:hover{color:var(--aqua-deep);text-decoration:underline}

@media (max-width:600px){
  body{font-size:15px}
  .lg-head h1{font-size:24px}
  .lg-wrap{padding:18px 16px 48px}
  .lg-table{font-size:13px}
  .lg-table th,.lg-table td{padding:7px 8px}
  .lg-card dl{grid-template-columns:76px 1fr}
}

@media print{
  .lg-top,.lg-back{display:none}
  body{background:#fff;font-size:11.5pt}
  .lg-wrap{max-width:none;padding:0}
  h2{page-break-after:avoid}
  .lg-note,.lg-card,.lg-table{page-break-inside:avoid}
}
