/* ============================================================
 * 暖屿主题 warm.css —— 温馨·舒缓·不幼稚（心理测评场景）
 * 用法：在站点 index.html/test.html 的 style.css 之后引入本文件。
 * 设计语言：暖纸奶油底 + 柔雾自然色强调 + 大圆角 + 细腻阴影
 *           + 舒缓行距 + 低饱和文字层级；无卡通元素、无高饱和色块。
 * ============================================================ */
:root {
  --bg: #F5F0E8;
  --surface: #FFFCF6;
  --ink: #37302A;
  --ink-2: #6E6355;
  --ink-3: #A99B89;
  --line: #E8DFD0;
  --accent: #7C8F72;              /* 每站可覆盖：暖紫/鼠尾草绿/暖杏 */
  --accent-contrast: #FFFFFF;
  --accent-soft: rgba(124, 143, 114, .13);
  --good: #4E7A5F;   --good-soft: rgba(78, 122, 95, .11);
  --warn: #A97C3F;   --warn-soft: rgba(169, 124, 63, .13);
  --bad: #A45A48;    --bad-soft: rgba(164, 90, 72, .11);
  --radius: 22px;
  --radius-sm: 14px;
  --shadow: 0 18px 44px rgba(96, 82, 60, .10);
  --shadow-soft: 0 8px 22px rgba(96, 82, 60, .06);
}

body {
  background:
    radial-gradient(1100px 420px at 50% -8%, rgba(255, 253, 247, .95), rgba(255, 253, 247, 0) 70%),
    var(--bg);
}
::selection { background: var(--accent-soft); }
a, button, input, select, textarea { transition-duration: .2s; }

/* 标题：暖墨、舒缓、克制的字重变化 */
.h-display { font-weight: 320; letter-spacing: .005em; color: var(--ink); }
.h-1 { font-weight: 340; }
.h-2 { font-weight: 460; }
.lead { font-weight: 330; }
.eyebrow { color: var(--ink-3); letter-spacing: .24em; }
.eyebrow .dot { color: var(--accent); }

/* 卡片：白面 + 暖线 + 柔和投影 */
.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}
.panel-soft { box-shadow: var(--shadow-soft); background: var(--surface); border-radius: var(--radius); }

/* 按钮 */
.btn { border-radius: 999px; font-weight: 480; letter-spacing: .05em; }
.btn-primary { background: var(--accent); box-shadow: 0 8px 20px var(--accent-soft); }
.btn-primary:hover { box-shadow: 0 12px 26px rgba(124, 143, 114, .22); }
.btn-ghost { border-color: var(--line); background: var(--surface); }
.btn-ghost:hover { border-color: var(--ink-3); background: #FFFDF8; }

/* 徽章 / 指标 */
.badge { border-radius: 999px; }
.metric {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-soft);
}

/* 条形图轨道更柔和 */
.bar-track { background: rgba(124, 112, 90, .10); height: 10px; }
.bar-fill { border-radius: 999px; }

/* 组列表 */
.group-list li { border-bottom-color: var(--line); }

/* 报告 */
.report-hero { padding-top: 40px; }
.report-section h3 { font-weight: 520; }
.report-section ul li { border-bottom-color: var(--line); }
.report-section ul li::before { background: var(--accent); opacity: .65; }
.advice-box { background: var(--accent-soft); border-radius: var(--radius); }
.footnote { border-top-color: var(--line); color: var(--ink-3); }

/* 答题控件 */
.opt-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}
.opt-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.opt-card.selected { border-color: var(--accent); background: rgba(124, 143, 114, .09); }
.opt-key { border-color: var(--line); background: var(--surface); }
.likert-pill { border-radius: 999px; background: var(--surface); border-color: var(--line); }
.likert-pill.selected { background: var(--accent); border-color: var(--accent); }
.progress-fill { background: var(--accent); border-radius: 999px; }
.progress-track { background: rgba(124, 112, 90, .10); }

/* 输入框 */
.code-input {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}
.code-input:focus { border-color: var(--accent); }

/* 落地页区块 */
.site-header { border-bottom: 1px solid transparent; }
.section + .section { border-top-color: var(--line); }
.feature .fnum { color: var(--accent); letter-spacing: .24em; }
.chip i { background: var(--accent); opacity: .8; }
.step { border-top-color: var(--line); }
.step-num { color: var(--accent); font-weight: 300; }
.faq-item { border-top-color: var(--line); }
.site-footer {
  background: #EEE5D5;
  border-top: none;
  border-radius: 34px 34px 0 0;
  margin-top: 56px;
}

/* 落地页价格行 */
.price { font-weight: 300; }

/* 打印时去掉装饰底 */
@media print {
  body { background: #fff !important; }
  .panel, .metric { box-shadow: none; }
}
