/* ============================================================
   webcafe 站点统一设计系统 · base.css
   放在站点 CSS 之前加载：只提供设计令牌、基础排版下限和公共组件默认值，
   站点自己的 CSS 可以覆盖任何一条。
   ============================================================ */

:root {
  /* 色彩令牌（站点可覆盖） */
  --ds-ink: #1b1f24;
  --ds-ink-soft: #414a54;
  --ds-muted: #5f6b78;
  --ds-paper: #ffffff;
  --ds-paper-soft: #f6f7f5;
  --ds-line: #e2e6ea;
  --ds-accent: #1456f0;
  --ds-accent-ink: #ffffff;
  --ds-warn: #b4560b;
  --ds-ok: #1a7526;

  /* 排版令牌：正文 ≥16px，辅助文字 ≥12px */
  --ds-font-body: 17px;
  --ds-font-small: 13px;
  --ds-font-tiny: 12px;
  --ds-line-tall: 1.75;

  /* 间距与布局 */
  --ds-space: clamp(16px, 3vw, 36px);
  --ds-space-lg: clamp(32px, 6vw, 72px);
  --ds-max: 1180px;
  --ds-radius: 10px;
  --ds-radius-sm: 6px;
  --ds-shadow: 0 8px 28px rgba(20, 30, 40, 0.08);
}

html {
  font-size: var(--ds-font-body);
  -webkit-text-size-adjust: 100%;
}

body {
  font-size: 1rem;
  line-height: var(--ds-line-tall);
  color: var(--ds-ink);
  background: var(--ds-paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 标题阶梯：桌面够大，手机不塌 */
h1 { font-size: clamp(2.1rem, 4.3vw, 3.5rem); line-height: 1.14; letter-spacing: -0.02em; margin: 0 0 0.45em; }
h2 { font-size: clamp(1.55rem, 2.6vw, 2.25rem); line-height: 1.22; letter-spacing: -0.012em; margin: 0 0 0.5em; }
h3 { font-size: clamp(1.15rem, 1.7vw, 1.45rem); line-height: 1.3; margin: 0 0 0.5em; }
h4 { font-size: 1.06rem; line-height: 1.35; margin: 0 0 0.45em; }

p, li, dd, dt, td, th, label, legend, summary, blockquote, figcaption {
  font-size: 1rem;
  line-height: var(--ds-line-tall);
}

p { margin: 0 0 1em; }
ul, ol { padding-left: 1.3em; }
li { margin: 0.35em 0; }

small, .ds-small { font-size: var(--ds-font-small); }
.ds-tiny, .ds-meta { font-size: var(--ds-font-tiny); }

a { color: var(--ds-accent); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }

code, kbd, samp, pre { font-size: 0.95em; }

/* 公共布局 */
.ds-wrap { max-width: var(--ds-max); margin-inline: auto; padding-inline: var(--ds-space); }
.ds-section { padding-block: var(--ds-space-lg); }
.ds-stack > * + * { margin-top: 1em; }

/* 公共组件 */
.ds-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 12px 24px;
  font-size: 1rem; font-weight: 600; line-height: 1.2;
  border-radius: var(--ds-radius-sm); border: 1px solid transparent;
  text-decoration: none; cursor: pointer;
}
.ds-btn--primary { background: var(--ds-accent); color: var(--ds-accent-ink); }
.ds-btn--ghost { background: transparent; color: var(--ds-ink); border-color: var(--ds-line); }

.ds-card {
  border: 1px solid var(--ds-line); border-radius: var(--ds-radius);
  padding: clamp(18px, 2.4vw, 28px); background: var(--ds-paper);
}

/* 统一页脚（模板：templates/footer.html） */
.site-footer {
  border-top: 1px solid var(--ds-line);
  padding-block: 28px;
  color: var(--ds-muted);
  font-size: var(--ds-font-small);
}
.site-footer .ds-wrap {
  display: flex; flex-wrap: wrap; gap: 14px 28px;
  align-items: baseline; justify-content: space-between;
}
.site-footer nav { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.site-footer a { color: var(--ds-muted); text-decoration: none; }
.site-footer a:hover { color: var(--ds-accent); text-decoration: underline; }
.site-footer .ds-fineprint {
  flex-basis: 100%; font-size: var(--ds-font-tiny); line-height: 1.7;
  margin: 6px 0 0; color: var(--ds-muted);
}

/* 可访问性：键盘焦点必须可见 */
:focus-visible { outline: 3px solid var(--ds-accent); outline-offset: 3px; border-radius: 4px; }

@media (max-width: 640px) {
  html { font-size: 16.5px; }
  h1 { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  h2 { font-size: clamp(1.45rem, 6vw, 1.8rem); }
  .ds-btn { width: 100%; }
}