/* ===========================================================
   X本真 · 视觉基线（暖纸档案）
   第一阶段样板：仅视觉，不接业务逻辑
   =========================================================== */

@font-face {
  font-family: "BZ Serif";
  src: url("fonts/serif-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "BZ Serif";
  src: url("fonts/serif-600.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "BZ Script";
  src: url("fonts/script-400.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}

:root {
  /* 纸与墨 */
  --paper: #f8f4ed;
  --paper-2: #fbf8f2;
  --card: #fffdf9;
  --ink: #2c2822;
  --ink-2: #6a6154;
  --ink-3: #9a9184;
  --line: #e9e0d1;
  --line-2: #f1ebdf;

  /* 强调 */
  --gold: #7e5e2e;
  --gold-soft: #a8874f;
  --green: #33453b;
  --green-soft: #4a6152;
  --sage: #e9ede4;

  /* 圆角与阴影 */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --sh-1: 0 1px 2px rgba(72, 55, 30, 0.05);
  --sh-2: 0 2px 6px rgba(72, 55, 30, 0.06), 0 12px 32px rgba(72, 55, 30, 0.05);

  /* 字体 */
  --serif: "Microsoft YaHei", "微软雅黑", "Noto Sans SC", sans-serif; /* 2026-11-05 用户要求：宋体字全部改微软雅黑（手写 --script 不动） */
  --sans: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --script: "BZ Script", "KaiTi", "STKaiti", cursive;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; background: var(--paper); }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 极淡纸纹，避免大色块发死 */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }

h1, h2, h3, h4 {
  font-family: var(--serif);
  font-weight: 600;
  letter-spacing: 0.01em;
  margin: 0;
  color: var(--ink);
}

p { margin: 0; }

.wrap { width: min(1180px, 91vw); margin: 0 auto; }

/* ── 按钮 ───────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease, border-color 0.16s ease;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.btn--gold { background: var(--gold); color: #fdf9f1; box-shadow: 0 4px 14px rgba(126, 94, 46, 0.22); }
.btn--gold:hover { background: #6d5027; }

.btn--green { background: var(--green); color: #f7f4ec; box-shadow: 0 4px 14px rgba(51, 69, 59, 0.18); }
.btn--green:hover { background: #2b3a31; }

.btn--ghost { background: rgba(255, 253, 249, 0.7); border-color: var(--line); color: var(--ink); }
.btn--ghost:hover { background: #fff; border-color: #ddd2bf; }

.btn--lg { height: 50px; padding: 0 28px; font-size: 15px; }

.arrow { width: 15px; height: 15px; flex: none; }

/* ── 通用小件 ───────────────────────────── */
.eyebrow {
  font-size: 12.5px;
  letter-spacing: 0.16em;
  color: var(--ink-3);
  text-transform: uppercase;
}

.script {
  font-family: var(--script);
  color: #6f5a3c;
  line-height: 1.9;
  font-size: 17px;
  letter-spacing: 0.04em;
  opacity: 0.9;
}

.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-1);
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 26px;
  padding: 0 11px;
  border-radius: 999px;
  background: #f3ecdd;
  color: #7a6644;
  font-size: 12px;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.chip--free { background: #eef1e7; color: #566a52; }
.chip--round { background: #f2ead9; color: #7a6644; font-variant-numeric: tabular-nums; }
.chip--lock { background: #f1ece1; color: #988972; }

.muted { color: var(--ink-2); }
.small { font-size: 12.5px; color: var(--ink-3); }
