/* ============================================================
   安企 GEO · 设计系统 v1
   方向：简洁 · 明亮 · 高效 · 专业 · 高端
   原则：白底为骨、发丝线为界、字号层级为眼、留白为气
   ============================================================ */

/* ---------- 1. 设计令牌 ---------- */
:root{
  /* 墨色五阶：标题 → 正文 → 次要 → 线 → 底 */
  --ink:#0B1220;          /* 标题、强调 */
  --text:#3F4A5A;         /* 正文 */
  --muted:#6B7789;        /* 说明、辅助（对白底 4.6:1，达 WCAG AA） */
  --line:#E9ECF1;         /* 发丝线（默认） */
  --line-2:#D9DFE8;       /* 发丝线（悬停/强调） */
  --bg:#FFFFFF;
  --bg-sub:#F5F7FA;       /* 区块浅底：承载白色面板，形成层次 */
  --bg-tint:#F3F6FD;      /* 主色极浅底 */
  --panel:#FFFFFF;
  --sh-1:0 1px 2px rgba(11,18,32,.04),0 1px 3px rgba(11,18,32,.03);
  --sh-2:0 2px 8px rgba(11,18,32,.05),0 16px 40px rgba(11,18,32,.06);

  /* 单一主色 + 状态色 */
  --brand:#1A4FD6;
  --brand-2:#153FB0;
  --brand-weak:#EFF3FE;
  --ok:#0F7B3F;   --ok-weak:#ECF8F1;
  --warn:#A85B06; --warn-weak:#FEF7EC;
  --bad:#B91C1C;  --bad-weak:#FDF1F1;

  /* 字阶：只用这几档 */
  --fs-12:12px; --fs-13:13px; --fs-14:14px; --fs-16:16px;
  --fs-18:18px; --fs-22:22px; --fs-26:26px; --fs-32:32px; --fs-44:44px;

  /* 间距：8 的倍数 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px;

  --r-sm:6px; --r-md:8px; --r-lg:12px;
  --container:1120px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --ease:cubic-bezier(.4,0,.2,1);
}

/* ---------- 2. 基础 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font);font-size:var(--fs-16);line-height:1.75;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none;transition:color .15s var(--ease)}
a:hover{color:var(--brand-2)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--r-sm)}
::selection{background:var(--brand-weak)}
hr{border:0;border-top:1px solid var(--line);margin:var(--s7) 0}

/* ---------- 3. 布局 ---------- */
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--s5)}
.section{padding:var(--s8) 0}
.section--lg{padding:var(--s9) 0}
.section--tight{padding:var(--s7) 0}
.section--sub{background:var(--bg-sub)}
.rule{border-top:1px solid var(--line)}

/* ---------- 4. 排版 ---------- */
h1,h2,h3,h4{margin:0;color:var(--ink);font-weight:700;line-height:1.25;letter-spacing:-.02em}
h1{font-size:var(--fs-44);line-height:1.15;letter-spacing:-.03em}
h2{font-size:var(--fs-32);letter-spacing:-.025em}
h3{font-size:var(--fs-22)}
h4{font-size:var(--fs-18);letter-spacing:-.01em}
p{margin:0 0 var(--s4)}
.lead{font-size:var(--fs-18);line-height:1.75;color:var(--text)}
.prose{max-width:68ch}
.prose p{margin:0 0 var(--s5)}
.eyebrow{
  display:inline-block;font-size:var(--fs-12);font-weight:600;color:var(--brand);
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:var(--s4);
}
.muted{color:var(--muted)}
.small{font-size:var(--fs-14)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.center{text-align:center}
.center .lead,.center .prose{margin-left:auto;margin-right:auto}

/* ---------- 5. 页头 ---------- */
.site-header{
  position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);
}
.site-header .inner{display:flex;align-items:center;gap:var(--s6);height:64px}
.brand{font-size:var(--fs-18);font-weight:700;color:var(--ink);letter-spacing:-.02em;white-space:nowrap}
.brand em{font-style:normal;color:var(--brand)}
.site-nav{display:flex;align-items:center;gap:var(--s1);margin-left:auto;flex-wrap:wrap}
.site-nav a{
  display:block;padding:var(--s2) var(--s3);border-radius:var(--r-sm);
  font-size:var(--fs-14);color:var(--text)
}
.site-nav a:hover{background:var(--bg-sub);color:var(--ink)}
.site-nav a.is-active{color:var(--brand);background:var(--brand-weak);font-weight:600}

/* ---------- 6. 英雄区 ---------- */
.hero{padding:var(--s9) 0 var(--s8);border-bottom:1px solid var(--line)}
.hero .lead{margin-top:var(--s5)}
.hero-actions{display:flex;gap:var(--s3);margin-top:var(--s7);flex-wrap:wrap}
.hero-meta{margin-top:var(--s6);font-size:var(--fs-14);color:var(--muted)}
.hero-meta span+span::before{content:"·";margin:0 var(--s3);color:var(--line-2)}

/* ---------- 7. 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);
  height:44px;padding:0 var(--s5);border-radius:var(--r-md);border:1px solid transparent;
  font-size:var(--fs-14);font-weight:600;line-height:1;cursor:pointer;
  transition:background-color .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease);
  white-space:nowrap;
}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-2);color:#fff}
.btn-secondary{background:#fff;color:var(--ink);border-color:var(--line-2)}
.btn-secondary:hover{border-color:var(--ink);color:var(--ink)}
.btn-ghost{background:transparent;color:var(--brand);padding:0 var(--s2)}
.btn-ghost:hover{color:var(--brand-2);text-decoration:underline}
.btn-sm{height:36px;padding:0 var(--s4);font-size:var(--fs-13)}
.btn-lg{height:52px;padding:0 var(--s6);font-size:var(--fs-16)}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* ---------- 8. 卡片 ---------- */
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s5);transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.card:hover{border-color:var(--line-2);box-shadow:0 4px 16px rgba(11,18,32,.05)}
.card h3{margin-bottom:var(--s2)}
.card p{margin:0 0 var(--s4);font-size:var(--fs-14);color:var(--muted)}
.card .card-link{font-size:var(--fs-14);font-weight:600}
.grid{display:grid;gap:var(--s5)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-auto{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}

/* 编号条目（标准项 / 检测项） */
.entry{padding:var(--s5) 0;border-bottom:1px solid var(--line)}
.entry:last-child{border-bottom:0}
.entry-head{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap}
/* 编号：纯文字蓝色，不做按钮 / 徽章样式 */
.entry-code{color:var(--brand);font-weight:600;letter-spacing:.02em}
.entry-title{font-size:var(--fs-18);font-weight:600;color:var(--ink)}
.entry dl{margin:var(--s3) 0 0;display:grid;gap:var(--s2)}
.entry dt{font-size:var(--fs-13);font-weight:600;color:var(--muted);letter-spacing:.02em}
.entry dd{margin:0 0 var(--s2);font-size:var(--fs-14);color:var(--text)}
.entry dt + dd{margin-top:2px}

/* ---------- 9. 标签 / 状态 ---------- */
.tag{
  display:inline-block;font-size:var(--fs-12);font-weight:600;line-height:1.6;
  padding:1px var(--s2);border-radius:var(--r-sm);letter-spacing:.02em;
}
.tag-ok{background:var(--ok-weak);color:var(--ok)}
.tag-warn{background:var(--warn-weak);color:var(--warn)}
.tag-bad{background:var(--bad-weak);color:var(--bad)}
.tag-neutral{background:var(--bg-sub);color:var(--muted);border:1px solid var(--line)}
.tag-brand{background:var(--brand-weak);color:var(--brand)}

/* ---------- 10. 表格 ---------- */
.table{width:100%;border-collapse:collapse;font-size:var(--fs-14)}
.table th,.table td{padding:var(--s3) var(--s4);text-align:left;border-bottom:1px solid var(--line)}
.table th{background:var(--bg-sub);color:var(--muted);font-weight:600;font-size:var(--fs-13)}
.table tr:last-child td{border-bottom:0}
.table td:first-child{color:var(--ink);font-weight:600}
.table .num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}

/* ---------- 11. 指标 ---------- */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s5);margin-top:var(--s6)}
.stat{border-left:2px solid var(--line-2);padding-left:var(--s4)}
.stat .v{font-family:var(--mono);font-size:var(--fs-26);font-weight:700;color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat .k{font-size:var(--fs-13);color:var(--muted);margin-top:var(--s1)}

/* ---------- 12. 引用块（供 AI 摘录） ---------- */
.quote{
  background:var(--ink);color:#E8ECF4;border-radius:var(--r-lg);
  padding:var(--s6);margin:var(--s5) 0;
}
.quote p{margin:0;color:#fff;font-size:var(--fs-16);line-height:1.8;max-width:70ch}
.quote .meta{margin-top:var(--s4);font-size:var(--fs-13);color:#96A1B5;line-height:1.9}
.quote code{color:#C7D2FE}

/* ---------- 13. 表单 ---------- */
.field{
  width:100%;height:44px;padding:0 var(--s4);font-family:var(--font);font-size:var(--fs-16);
  color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:var(--r-md);
  transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.field::placeholder{color:var(--muted)}
.field:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-weak)}
.field-row{display:flex;gap:var(--s3);flex-wrap:wrap}
.field-row .field{flex:1;min-width:260px}

/* ---------- 14. 提示条 ---------- */
.notice{
  display:flex;gap:var(--s3);align-items:flex-start;
  padding:var(--s4) var(--s5);border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--bg-sub);font-size:var(--fs-14);color:var(--text);
}
.notice--brand{background:var(--brand-weak);border-color:#DCE5FD}

/* ---------- 15. 代码 / 复制 ---------- */
.code{
  font-family:var(--mono);font-size:var(--fs-13);line-height:1.9;color:#E8ECF4;
  background:var(--ink);border-radius:var(--r-md);padding:var(--s4) var(--s5);
  white-space:pre-wrap;word-break:break-all;margin:0;
}

/* ---------- 16. FAQ ---------- */
.faq{background:none;border:0;border-radius:0;overflow:visible}
.faq details{border-bottom:1px solid var(--line-2)}
.faq details:last-child{border-bottom:0}
.faq summary{
  cursor:pointer;list-style:none;padding:var(--s4) 0;
  font-size:var(--fs-16);font-weight:600;color:var(--ink);
  display:flex;justify-content:space-between;gap:var(--s4);align-items:center;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:10px;height:10px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);transition:transform .2s var(--ease);flex:none}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq .answer{padding:0 0 var(--s4);font-size:var(--fs-14);color:var(--muted)}

/* ---------- 17. 页脚 ---------- */
.site-footer{background:#121212;padding:var(--s7) 0;color:#8B95A5}
.site-footer .inner{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s4)}
.site-footer p{margin:0;font-size:var(--fs-13);color:#8B95A5}
.site-footer nav{display:flex;gap:var(--s5);flex-wrap:wrap}
.site-footer nav a{font-size:var(--fs-13);color:#C9D1DB}
.site-footer nav a:hover{color:#fff}

/* ---------- 18. 得分盘（检测页） ---------- */
.score{display:flex;align-items:center;gap:var(--s7);flex-wrap:wrap;padding:var(--s6);border:1px solid var(--line);border-radius:var(--r-lg);background:#fff}
.score .value{font-family:var(--mono);font-size:56px;font-weight:700;line-height:1;color:var(--ink);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.score .value small{font-size:var(--fs-18);color:var(--muted);font-weight:500}
.score .verdict{font-size:var(--fs-22);font-weight:700;color:var(--ink);letter-spacing:-.02em}
.score .note{font-size:var(--fs-14);color:var(--muted);margin-top:var(--s1)}

/* ---------- 19. 结果条目 ---------- */
.result{padding:var(--s4) 0;border-bottom:1px solid var(--line)}
.result:last-child{border-bottom:0}
.result-head{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap}
.result .evidence{margin-top:var(--s2);font-size:var(--fs-14);color:var(--text);word-break:break-word}
.result .fix{margin-top:var(--s1);font-size:var(--fs-14);color:var(--muted)}
.result .fix b{color:var(--text);font-weight:600}

/* ---------- 20. 工具条 / 进度 ---------- */
.progress{height:3px;background:var(--line);border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--brand);width:0;transition:width .3s var(--ease)}

/* ---------- 21. 响应式 ---------- */
@media (max-width:960px){
  .grid-3,.stat-row{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  :root{--fs-44:30px;--fs-32:25px;--fs-26:20px;--fs-22:19px}
  .section{padding:var(--s8) 0}
  .hero{padding:var(--s8) 0}
  .grid-2,.grid-3,.grid-auto,.stat-row{grid-template-columns:1fr}
  .site-header .inner{height:auto;padding-top:var(--s3);padding-bottom:var(--s3);flex-wrap:wrap;gap:var(--s3)}
  .site-nav{margin-left:0;width:100%}
  .score{gap:var(--s5)}
  .score .value{font-size:44px}
}
@media print{.site-header,.site-footer,.btn{display:none}}

/* ============================================================
   22. 层次与节奏（layering & rhythm）
   手法：浅灰底承载白色面板 → 面与面叠压；
        组内紧、组间松 → 呼吸有节奏；
        克制的阴影只给"要浮起来"的面。
   ============================================================ */

/* 区块标题组：统一底部间距，形成稳定节奏 */
.section-head{margin-bottom:var(--s7)}
.section-head .eyebrow{margin-bottom:var(--s3)}
.section-head h2{margin-bottom:var(--s3)}
.section-head p{margin:0;color:var(--muted)}

/* 面板：白色面 + 发丝线 + 极轻阴影 → 在浅灰底上"浮"起来 */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}
.panel-head{padding:var(--s4) var(--s6);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:var(--s3);background:#fff}
.panel-head h4{margin:0;font-size:var(--fs-16)}
.panel-head .tag{margin-left:auto}
.panel-body{padding:var(--s5) var(--s6)}
.panel-body--flush{padding:0}

/* 事实带：横向四格，用发丝线上下界定 */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s6);padding:var(--s6) 0}
.facts--ruled{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fact .v{font-family:var(--mono);font-size:var(--fs-22);font-weight:700;color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fact .k{font-size:var(--fs-13);color:var(--muted);margin-top:var(--s1)}

/* 小列表（卡片内补充信息，增加信息密度） */
.mini{margin:var(--s3) 0 0;padding:0;list-style:none}
.mini li{position:relative;padding-left:var(--s5);font-size:var(--fs-14);color:var(--text);margin-bottom:var(--s2)}
.mini li:last-child{margin-bottom:0}
.mini li::before{content:"";position:absolute;left:5px;top:.66em;width:5px;height:5px;border-radius:99px;background:var(--brand)}

/* 收尾面板 */
/* 收尾面板：白色区块 + 浅灰面板（层次靠深浅对比） */
.cta-panel{
  background:var(--bg-sub);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:var(--s9) var(--s6);text-align:center;
}
.cta-panel h2{margin-bottom:var(--s3)}
.cta-panel p{margin:0 auto var(--s6);color:var(--muted);max-width:54ch}
.cta-panel .cta-actions{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap}
.cta-panel .cta-note{margin:var(--s6) auto 0;font-size:var(--fs-13);color:var(--muted)}

/* 面板内表格：去掉外框，融进面板 */
.panel-body .table th:first-child,.panel-body .table td:first-child{padding-left:0}
.panel-body .table th:last-child,.panel-body .table td:last-child{padding-right:0}

@media (max-width:960px){
  .facts{grid-template-columns:repeat(2,1fr);gap:var(--s5)}
}
@media (max-width:720px){
  .facts{grid-template-columns:1fr 1fr}
  .panel-head,.panel-body{padding-left:var(--s5);padding-right:var(--s5)}
  .cta-panel{padding:var(--s7) var(--s5)}
}

/* ============================================================
   23. 无框列表 / 流程步进 / 凹角色块
   ============================================================ */

/* 无外框列表：只有每行一条下边框 */
.list{list-style:none;margin:var(--s5) 0 0;padding:0}
.list li{
  display:flex;align-items:baseline;gap:var(--s3);
  padding:var(--s3) 0;border-bottom:1px solid var(--line);
  font-size:var(--fs-14);color:var(--text);
}
.list li:last-child{border-bottom:0}
/* 编号：纯文字蓝色 —— 显式清空背景/边框/内边距，避免继承 .code 的代码块样式 */
.list .no{
  flex:none;color:var(--brand);font-weight:600;
  background:none;border:0;padding:0;margin:0;border-radius:0;
  font-family:var(--font);font-size:var(--fs-14);line-height:inherit;
  white-space:normal;letter-spacing:0;
}

/* 流程步进：一条横向基线 + 三个编号节点 */
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);position:relative;margin-top:var(--s8)}
.process::before{content:"";position:absolute;left:16px;right:16px;top:16px;height:1px;background:var(--line-2)}
.proc{position:relative;padding-top:var(--s8)}
.proc .n{
  position:absolute;top:0;left:0;width:33px;height:33px;border-radius:99px;
  background:#fff;border:1px solid var(--line-2);color:var(--brand);
  font-family:var(--mono);font-size:var(--fs-13);font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.proc h4{margin-bottom:var(--s2)}
.proc p{margin:0;font-size:var(--fs-14);color:var(--muted)}
.proc .out{
  margin-top:var(--s3);font-size:var(--fs-13);color:var(--text);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:var(--s2) var(--s3);display:inline-block;
}

@media (max-width:960px){
  .process{grid-template-columns:1fr;gap:var(--s5)}
  .process::before{display:none}
  .proc{padding-top:var(--s7)}
}

/* ============================================================
   24. 凹角收尾块：整体白底 + 左右两个 #F5F7FA 凹角遮挡
   遮挡色与上方浅灰区块同色 → 形成自然的弧形过渡
   ============================================================ */
.scoop{
  position:relative;background:#fff;
  border-radius:0 0 96px 96px;
  padding:var(--s8) 0;
}
.scoop::before,.scoop::after{
  content:"";position:absolute;top:0;width:120px;height:120px;
  background-repeat:no-repeat;background-size:100% 100%;pointer-events:none;
}
.scoop::before{
  left:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cpath fill='%23F5F7FA' d='M80 80c0 58-40 80-80 80V0h160c-40 0-80 22-80 80z'/%3E%3C/svg%3E");
}
.scoop::after{
  right:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cpath fill='%23F5F7FA' d='M80 80c0 58 40 80 80 80V0H0c40 0 80 22 80 80z'/%3E%3C/svg%3E");
}
.scoop__inner{max-width:680px;margin:0 auto;text-align:center;padding:0 var(--s5)}
.scoop h2{margin-bottom:var(--s4)}
.scoop p{margin:0 auto var(--s5);color:var(--muted);max-width:56ch}
.scoop .scoop-actions{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap}
.scoop .scoop-note{margin-top:var(--s5);font-size:var(--fs-13);color:var(--muted)}

@media (max-width:720px){
  .scoop{padding:var(--s7) 0;border-radius:0 0 56px 56px}
  .scoop::before,.scoop::after{width:72px;height:72px}
}

/* ============================================================
   25. 移动端适配
   断点：960px（平板）/ 720px（手机）/ 420px（小屏）
   原则：栅格降为单列、触控目标加高、长内容防溢出、字号随字阶缩放
   ============================================================ */

/* ---------- 平板 ---------- */
@media (max-width:960px){
  .grid-2,.grid-3,.grid-auto,.stat-row{grid-template-columns:1fr}
  .facts{grid-template-columns:repeat(2,1fr);gap:var(--s5)}
  .panel-head{flex-wrap:wrap}
  .process{grid-template-columns:1fr;gap:var(--s5)}
  .process::before{display:none}
  .proc{padding-top:var(--s7)}
  .site-header .inner{height:auto;padding-top:var(--s3);padding-bottom:var(--s3);flex-wrap:wrap;gap:var(--s3)}
  .site-nav{margin-left:0;width:100%}
}

/* ---------- 手机 ---------- */
@media (max-width:720px){
  :root{
    --fs-44:28px; --fs-32:23px; --fs-26:19px; --fs-22:18px;
    --s9:56px; --s8:44px; --s7:36px;
  }
  .wrap{padding:0 var(--s4)}
  .section{padding:var(--s7) 0}
  .hero{padding:var(--s7) 0 var(--s8)}

  /* 页头：保持紧凑单行——品牌 + 可横向滑动的导航 */
  .site-header .inner{flex-wrap:nowrap;padding-top:var(--s2);padding-bottom:var(--s2);gap:var(--s3)}
  .site-nav{margin-left:auto;width:auto;flex:1 1 auto;min-width:0;justify-content:flex-end;
            flex-wrap:nowrap;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .site-nav::-webkit-scrollbar{display:none}
  .site-nav a{padding:10px var(--s3);font-size:var(--fs-13);white-space:nowrap}
  .brand{font-size:var(--fs-16)}

  /* 按钮：成组出现时占满整行，便于点按 */
  .hero-actions,.cta-actions,.scoop-actions{flex-direction:column;gap:var(--s2)}
  .hero-actions .btn,.cta-actions .btn,.scoop-actions .btn{width:100%}
  .btn{height:46px}
  .btn-lg{height:50px}

  /* 表单：输入与按钮上下排列；输入保持 16px 以防 iOS 自动放大 */
  .field-row{flex-direction:column}
  .field-row .field{min-width:0;width:100%}
  .field-row .btn{width:100%}
  .field{height:46px}

  /* 事实带与各类容器内边距收紧 */
  .facts{padding:var(--s5) 0}
  .fact .v{font-size:var(--fs-18)}
  .panel-head{padding:var(--s3) var(--s4)}
  .panel-body{padding:var(--s4)}
  .cta-panel{padding:var(--s7) var(--s4)}
  .scoop{padding:var(--s7) 0;border-radius:0 0 48px 48px}
  .scoop::before,.scoop::after{width:64px;height:64px}
  .scoop__inner{padding:0 var(--s4)}

  /* 表格：紧凑 + 长串可断行，避免撑破布局 */
  .table{font-size:var(--fs-13)}
  .table th,.table td{padding:var(--s3) var(--s2);word-break:break-word}

  /* 检测结果 */
  .score{padding:var(--s5);gap:var(--s4)}
  .score .value{font-size:40px}
  .score .verdict{font-size:var(--fs-18)}
  .result .evidence{font-size:var(--fs-13)}

  /* 引用块与代码块 */
  .quote{padding:var(--s5)}
  .quote p{font-size:var(--fs-14)}
  .code{font-size:var(--fs-12);padding:var(--s3) var(--s4)}

  /* 触控目标统一加高到 ≥44px */
  .faq summary{padding:var(--s4) 0}
  .list li{padding:var(--s3) 0}
  .entry{padding:var(--s5) 0}
  .btn-sm{height:40px}

  /* 页脚 */
  .site-footer{padding:var(--s6) 0}
  .site-footer .inner{gap:var(--s3)}
  .site-footer nav{gap:var(--s2) var(--s4)}
}

/* ---------- 小屏 ---------- */
@media (max-width:420px){
  .facts{grid-template-columns:1fr;gap:var(--s3)}
  .fact{padding-bottom:var(--s3);border-bottom:1px solid var(--line)}
  .fact:last-child{border-bottom:0;padding-bottom:0}
  .hero-meta{margin-top:var(--s5);gap:var(--s2)}
  .hero-meta span+span::before{margin:0 var(--s2)}
}

/* ============================================================
   26. 移动端抽屉导航
   桌面：汉堡按钮与抽屉都不显示，用横排导航
   ≤720px：隐藏横排导航，改用右上汉堡 + 右侧抽屉
   ============================================================ */

/* ---------- 汉堡按钮（默认隐藏） ---------- */
.nav-toggle{
  display:none;
  margin-left:auto;
  width:44px;height:44px;padding:0;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;
  background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.nav-toggle span{
  display:block;width:20px;height:2px;border-radius:2px;background:var(--ink);
  transition:transform .22s var(--ease),opacity .18s var(--ease);
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.4)}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- 抽屉容器 ---------- */
.drawer{position:fixed;inset:0;z-index:100;display:none}
.drawer.is-open{display:block}
.drawer__mask{
  position:absolute;inset:0;background:rgba(11,18,32,.46);
  opacity:0;transition:opacity .26s var(--ease);
}
.drawer.is-open .drawer__mask{opacity:1}

.drawer__panel{
  position:absolute;top:0;right:0;height:100%;
  width:80%;max-width:330px;
  display:flex;flex-direction:column;background:#fff;
  box-shadow:-10px 0 36px rgba(11,18,32,.14);
  transform:translateX(100%);
  transition:transform .26s var(--ease);
  will-change:transform;
}
.drawer.is-open .drawer__panel{transform:translateX(0)}

.drawer__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--s3) var(--s4) var(--s3) var(--s5);
  border-bottom:1px solid var(--line);flex:none;
}
.drawer__title{font-size:var(--fs-13);font-weight:600;color:var(--muted);letter-spacing:.06em}
.drawer__close{
  width:44px;height:44px;padding:0;border:0;background:none;cursor:pointer;
  font-size:24px;line-height:1;color:var(--muted);
}
.drawer__close:hover{color:var(--ink)}

.drawer__nav{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.drawer__nav a{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  padding:var(--s4) var(--s5);
  font-size:var(--fs-16);color:var(--ink);
  border-bottom:1px solid var(--line);
}
.drawer__nav a:last-child{border-bottom:0}
.drawer__nav a:active{background:var(--bg-sub)}
.drawer__nav a.is-active{color:var(--brand);font-weight:600;background:var(--brand-weak)}
.drawer__nav a::after{
  content:"";flex:none;width:8px;height:8px;
  border-right:1.5px solid var(--line-2);border-bottom:1.5px solid var(--line-2);
  transform:rotate(-45deg);
}

.drawer__foot{
  flex:none;padding:var(--s4) var(--s5);
  border-top:1px solid var(--line);
  font-size:var(--fs-12);color:var(--muted);
}

/* 抽屉打开时锁定页面滚动 */
body.drawer-open{overflow:hidden}

/* ---------- 手机端：切换为抽屉 ---------- */
@media (max-width:720px){
  .nav-toggle{display:flex}
  .site-nav{display:none}          /* 横排导航让位给抽屉 */
  .site-header .inner{padding-top:var(--s2);padding-bottom:var(--s2);flex-wrap:nowrap;gap:var(--s2)}
}

/* ============================================================
   27. 内容页：列表卡片 + 正文排版（CMS 渲染的 HTML）
   ============================================================ */

/* ---------- 内容列表 ---------- */
.post-list{display:grid;gap:var(--s5)}
.post-card{
  display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s5);transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.post-card:hover{border-color:var(--line-2);box-shadow:var(--sh-2)}
.post-card .meta{display:flex;align-items:center;gap:var(--s3);font-size:var(--fs-12);color:var(--muted);margin-bottom:var(--s2)}
.post-card .meta .mono{font-family:var(--mono)}
.post-card h3{font-size:var(--fs-20,20px);font-weight:700;margin:0 0 var(--s2);letter-spacing:-.01em}
.post-card p{margin:0;font-size:var(--fs-14);color:var(--muted)}
.post-card .more{margin-top:var(--s3);font-size:var(--fs-13);font-weight:600;color:var(--brand)}

/* ---------- 正文排版 ---------- */
.article-body{font-size:var(--fs-16);line-height:1.85;color:var(--text)}
.article-body>*:first-child{margin-top:0}
.article-body h2{
  font-size:var(--fs-26);font-weight:700;color:var(--ink);letter-spacing:-.02em;
  margin:var(--s8) 0 var(--s4);padding-top:var(--s5);border-top:1px solid var(--line);
}
.article-body h3{font-size:var(--fs-20,20px);font-weight:700;color:var(--ink);margin:var(--s7) 0 var(--s3)}
.article-body h4{font-size:var(--fs-18);font-weight:600;color:var(--ink);margin:var(--s6) 0 var(--s2)}
.article-body p{margin:0 0 var(--s5)}
.article-body ul,.article-body ol{margin:0 0 var(--s5);padding-left:1.4em}
.article-body li{margin:var(--s2) 0}
.article-body a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.article-body strong{color:var(--ink);font-weight:650}
.article-body blockquote{
  margin:var(--s5) 0;padding:var(--s4) var(--s5);
  background:var(--bg-sub);border-left:3px solid var(--brand);border-radius:0 var(--r-md) var(--r-md) 0;
  color:var(--text);font-size:var(--fs-14);
}
.article-body blockquote p:last-child{margin:0}
.article-body code{
  font-family:var(--mono);font-size:.92em;background:var(--bg-sub);
  border:1px solid var(--line);border-radius:var(--r-sm);padding:1px 6px;color:#0B1220;
}
.article-body pre{
  background:var(--ink);color:#E8ECF4;border-radius:var(--r-md);
  padding:var(--s4) var(--s5);overflow-x:auto;margin:0 0 var(--s5);
  font-size:var(--fs-13);line-height:1.8;
}
.article-body pre code{background:none;border:0;padding:0;color:inherit;font-size:inherit}
.article-body table{width:100%;border-collapse:collapse;margin:0 0 var(--s5);font-size:var(--fs-14)}
.article-body th,.article-body td{padding:var(--s3) var(--s4);border-bottom:1px solid var(--line);text-align:left}
.article-body th{background:var(--bg-sub);font-weight:600;color:var(--ink);font-size:var(--fs-13)}
.article-body img{border-radius:var(--r-md);margin:var(--s5) 0}
.article-body hr{border:0;border-top:1px solid var(--line);margin:var(--s7) 0}

/* 关键结论块（供 AI 摘录） */
.keybox{
  background:var(--bg-tint);border:1px solid #DCE5FD;border-radius:var(--r-lg);
  padding:var(--s5);margin:0 0 var(--s6);
}
.keybox .label{font-size:var(--fs-12);font-weight:700;color:var(--brand);letter-spacing:.08em;display:block;margin-bottom:var(--s2)}
.keybox p{margin:0;font-size:var(--fs-16);color:var(--ink)}

/* 分页 */
.pager{display:flex;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s8);align-items:center}
.pager a,.pager span{
  min-width:40px;height:40px;padding:0 var(--s3);display:inline-flex;
  align-items:center;justify-content:center;border:1px solid var(--line);
  border-radius:var(--r-sm);font-size:var(--fs-14);color:var(--text);
}
.pager a:hover{border-color:var(--brand);color:var(--brand)}
.pager .current{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}

/* 文章头部信息 */
.article-meta{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;font-size:var(--fs-13);color:var(--muted);margin-top:var(--s4)}
.article-meta .tag{font-size:var(--fs-12)}

/* ---------- 13. 搜索 / 标签 ---------- */
.crumbs{font-size:var(--fs-13);color:var(--muted);margin-bottom:var(--s4)}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--brand)}
.crumbs .sep{margin:0 var(--s2);opacity:.55}

/* 搜索框 */
.searchbox{margin-top:var(--s6);max-width:640px}
.searchbox form{display:flex;gap:var(--s3)}
.searchbox .field{flex:1}
.searchbox .btn{flex:0 0 auto}

/* 结果统计条 */
.list-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);
  flex-wrap:wrap;padding-bottom:var(--s4);margin-bottom:var(--s6);
  border-bottom:1px solid var(--line);font-size:var(--fs-14);color:var(--muted);
}
.list-head strong{color:var(--ink);font-weight:700}

/* 空状态 / 无结果 */
.empty{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s8) var(--s6);text-align:center;
}
.empty h2{font-size:var(--fs-20,20px);font-weight:700;margin:0 0 var(--s3);letter-spacing:-.01em}
.empty p{margin:0 auto;max-width:56ch;color:var(--muted);font-size:var(--fs-14)}
.empty .btn{margin-top:var(--s5)}

/* 标签云 */
.tagcloud{display:flex;flex-wrap:wrap;gap:var(--s3)}
.tagcloud a{
  display:inline-flex;align-items:center;gap:var(--s2);
  padding:var(--s2) var(--s4);background:#fff;border:1px solid var(--line);
  border-radius:var(--r-pill,999px);font-size:var(--fs-14);color:var(--text);
  transition:border-color .15s,color .15s,box-shadow .15s;
}
.tagcloud a:hover{border-color:var(--brand);color:var(--brand);box-shadow:var(--sh-1)}
.tagcloud .letter{
  font-family:var(--mono);font-size:var(--fs-11,11px);font-weight:700;
  color:var(--brand);background:var(--brand-weak);border-radius:5px;
  width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;
}

@media (max-width:720px){
  .searchbox form{flex-direction:column}
  .searchbox .btn{width:100%}
  .empty{padding:var(--s7) var(--s5)}
  .tagcloud a{font-size:var(--fs-13)}
}
