/* 1001 Brand Stories · 出海品牌故事 */
:root {
  --bg: #f7f5f0;
  --card: #fffdf8;
  --fg: #211d18;
  --muted: #76705f;
  --accent: #9a3b26;
  --accent-soft: #b3543d;
  --line: #e5dfd2;
  --serif: "Noto Serif SC", "Songti SC", "STSong", "SimSun", Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
    "Noto Sans SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #171411;
    --card: #1f1b17;
    --fg: #e8e2d6;
    --muted: #9b9485;
    --accent: #d08263;
    --accent-soft: #b96a4e;
    --line: #322c25;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.95;
  text-rendering: optimizeLegibility;
}
html[lang="en"] body { line-height: 1.75; }
.wrap { max-width: 44rem; margin: 0 auto; padding: 0 20px; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
img { max-width: 100%; height: auto; display: block; }

/* 预览横幅 */
.preview-banner {
  background: #8a6d1f;
  color: #fdf6e3;
  text-align: center;
  font-size: 13px;
  padding: 6px 12px;
  letter-spacing: 0.04em;
}

/* 顶栏 */
.top { border-bottom: 1px solid var(--line); }
.top nav {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 18px;
  padding-bottom: 14px;
  gap: 12px;
  flex-wrap: wrap;
}
.brand {
  font-family: var(--serif);
  font-weight: 900;
  font-size: 19px;
  color: var(--fg);
  letter-spacing: 0.02em;
}
.brand:hover { text-decoration: none; color: var(--accent); }
.top .links { display: flex; gap: 18px; font-size: 14px; }
.top .links a { color: var(--muted); }
.top .links a:hover { color: var(--accent); text-decoration: none; }
.top .lang {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 1px 11px;
}

/* 首页头部 */
.hero-head { padding: 54px 0 30px; border-bottom: 1px solid var(--line); }
.hero-head h1 {
  font-family: var(--serif);
  font-weight: 900;
  font-size: clamp(30px, 6vw, 42px);
  margin: 0 0 10px;
  line-height: 1.3;
}
.hero-head .tagline { margin: 0; color: var(--muted); font-size: 16px; }
.hero-head .motto-line {
  margin: 18px 0 0;
  font-family: var(--serif);
  font-weight: 600;
  color: var(--accent);
  font-size: 15px;
  letter-spacing: 0.03em;
}

/* 文章列表 */
ol.list { list-style: none; margin: 0; padding: 10px 0 60px; }
ol.list li {
  display: flex;
  gap: 18px;
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
}
ol.list .no {
  font-family: var(--serif);
  font-weight: 900;
  font-size: 22px;
  color: var(--accent);
  opacity: 0.85;
  min-width: 2.4em;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}
ol.list .t {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 19px;
  line-height: 1.55;
  color: var(--fg);
  display: inline-block;
}
ol.list .t:hover { color: var(--accent); text-decoration: none; }
ol.list .m { margin: 6px 0 0; font-size: 13px; color: var(--muted); }
ol.list .h { margin: 6px 0 0; font-size: 14.5px; color: var(--muted); line-height: 1.7; }

/* 文章页 */
article { padding: 44px 0 30px; }
.kicker {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--muted);
  letter-spacing: 0.06em;
}
.kicker .no {
  color: var(--accent);
  font-weight: 700;
  border: 1px solid var(--accent);
  border-radius: 999px;
  padding: 1px 10px;
  margin-right: 4px;
  font-variant-numeric: tabular-nums;
}
article h1 {
  font-family: var(--serif);
  font-weight: 900;
  font-size: clamp(25px, 5.4vw, 34px);
  line-height: 1.5;
  margin: 0 0 14px;
}
.hook {
  font-size: 17px;
  color: var(--muted);
  margin: 0 0 10px;
  line-height: 1.8;
}
.meta { font-size: 14px; color: var(--muted); margin: 0 0 26px; }
figure { margin: 28px 0; }
figure img { border-radius: 10px; width: 100%; }
figure.hero { margin: 6px 0 34px; }
figcaption {
  font-size: 13px;
  color: var(--muted);
  text-align: center;
  margin-top: 10px;
}
.body p { margin: 1.45em 0; }
.body h2 {
  font-family: var(--serif);
  font-weight: 700;
  font-size: 21px;
  margin: 2.2em 0 0.9em;
  line-height: 1.5;
}
.body hr {
  border: none;
  border-top: 1px solid var(--line);
  margin: 2.4em auto;
  width: 38%;
}
.body blockquote {
  margin: 2em 0;
  padding: 18px 22px;
  background: var(--card);
  border-left: 3px solid var(--accent);
  border-radius: 0 10px 10px 0;
  font-family: var(--serif);
}
.body blockquote p { margin: 0.5em 0; }
.body strong { font-weight: 700; }

/* 文末 CTA */
.cta {
  margin: 56px 0 10px;
  padding: 26px 24px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.cta .motto {
  font-family: var(--serif);
  font-weight: 700;
  color: var(--accent);
  margin: 0 0 12px;
  font-size: 16.5px;
}
.cta p { margin: 8px 0; font-size: 15px; line-height: 1.85; }
.cta .small { color: var(--muted); font-size: 13.5px; }

/* 页脚 */
.foot { border-top: 1px solid var(--line); margin-top: 40px; }
.foot .wrap { padding-top: 30px; padding-bottom: 44px; }
.foot .motto {
  font-family: var(--serif);
  font-weight: 600;
  color: var(--muted);
  font-size: 14.5px;
  margin: 0 0 10px;
}
.foot .contact { color: var(--fg); font-size: 14px; margin: 0 0 8px; line-height: 1.9; }
.foot .contact a { font-weight: 600; }
.foot .small { color: var(--muted); font-size: 12.5px; margin: 0; line-height: 1.9; }

@media (max-width: 560px) {
  body { font-size: 16px; }
  ol.list li { gap: 12px; padding: 22px 0; }
  ol.list .no { font-size: 18px; min-width: 2em; }
  ol.list .t { font-size: 17.5px; }
  article { padding: 32px 0 20px; }
}