/* ══════════════════════════════════════════════════════════════════════
   Time-Honored Goods (007) — 设计系统
   ⭐ 令牌来源: D:\hermes2607\项目素材\项目007\内容站样板\样板-谢馥春品牌页.html
      (:root 色板 2026-09-10 用户定稿 —— 青绿场域 + 印朱符号)
   ⚠️ 改色只改这里; ⛔ 不在模板里散写色值(与 009 的教训一致)
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --moon-white:#FBFBF9;      /* 月白 —— 页面底 */
  --celadon:#2F5D50;         /* 青绿 —— 主色(链接/强调) */
  --ink-green-black:#22332E; /* 墨绿黑 —— 正文 */
  --pale-celadon:#E4EFE9;    /* 淡青 —— 浅底/事实栏 */
  --ink-blue:#3D5A80;        /* 靛 —— 次级强调 */
  --seal-red:#A93226;        /* 印朱 —— 符号色(禁作大面积底) */
  --ochre:#B98A2F;           /* 赭 —— 点缀 */
  --jade:#6E8F7C;            /* 玉 —— 点缀 */
  --hair-1:#D8E7DF; --hair-2:#D6E0DA; --hair-3:#C9DDD2; --hair-4:#9DB3AA;
  --text-2:#6E7B76; --text-3:#5f6b66;
  --wrap:1000px;
  --serif:KaiTi,STKaiti,'Kaiti SC','AR PL UKai CN','WenQuanYi Zen Hei',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--moon-white);color:var(--ink-green-black);
  font-family:var(--sans);font-size:15px;line-height:1.75;
  -webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;min-height:100vh;
}
/* ⭐ 页脚贴底(与 009 落地页同法): wrap 撑满剩余高度 + footer margin-top:auto */
main{flex:1 0 auto}
a{color:var(--celadon)}
a:hover{text-decoration:underline}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%}

/* ── 页头 ──────────────────────────────────────────────────────────── */
header{border-bottom:.5px solid var(--hair-2);background:var(--moon-white)}
.hd{display:flex;align-items:center;justify-content:space-between;
    padding-top:22px;padding-bottom:22px;gap:20px;flex-wrap:wrap}
.brandmark{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}
.brandmark:hover{text-decoration:none}
.seal{width:52px;height:52px;flex-shrink:0}
.wm{display:flex;flex-direction:column;line-height:1.25}
.wordmark{font-size:19px;font-weight:600;letter-spacing:.4px;color:var(--ink-green-black)}
.wordsub{font-size:9px;letter-spacing:1.6px;color:var(--text-2);margin-top:3px}
nav{display:flex;gap:26px}
nav a{color:var(--text-2);text-decoration:none;font-size:14px;letter-spacing:.2px}
nav a:hover{color:var(--celadon);text-decoration:none}

/* ── Hero ─────────────────────────────────────────────────────────── */
.hero{padding:64px 0 44px;border-bottom:.5px solid var(--hair-1)}
.hero-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:48px;align-items:start}
.eyebrow{font-size:11.5px;letter-spacing:1.4px;text-transform:uppercase;
         color:var(--seal-red);font-weight:600;margin-bottom:16px}
h1{font-size:38px;font-weight:600;line-height:1.2;letter-spacing:.2px;
   color:var(--ink-green-black)}
h1 .zh{display:block;font-family:var(--serif);font-size:23px;
       color:var(--text-2);letter-spacing:6px;font-weight:400;margin-top:10px}
.lede{margin-top:26px;font-size:17px;line-height:1.8;
      color:var(--ink-green-black);max-width:62ch}
.lede strong{font-weight:600;color:var(--celadon)}
.logo-card{background:var(--pale-celadon);border:.5px solid var(--hair-3);
           border-radius:4px;padding:26px;text-align:center;
           display:flex;flex-direction:column;align-items:center;gap:10px;
           min-height:190px;justify-content:center}
.logo-card .mark{font-family:var(--serif);font-size:30px;
                 color:var(--celadon);letter-spacing:4px}
.logo-card p{font-size:11px;color:var(--text-2);line-height:1.5}

/* ── 事实栏 ───────────────────────────────────────────────────────── */
.facts{background:var(--pale-celadon);border-top:.5px solid var(--hair-1);
       border-bottom:.5px solid var(--hair-1);padding:30px 0;margin-top:44px}
.facts-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.fact dt{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;
         color:var(--text-2);margin-bottom:7px;font-weight:600}
.fact dd{font-size:15px;color:var(--ink-green-black);line-height:1.45}
.fact dd .sub{display:block;font-size:12px;color:var(--text-2);margin-top:2px}

/* ── 正文分节 ─────────────────────────────────────────────────────── */
.sec-head{display:flex;align-items:center;gap:12px;
          margin:56px 0 20px;padding-bottom:12px;border-bottom:.5px solid var(--hair-3)}
.sec-head h2{font-size:20px;font-weight:600;color:var(--ink-green-black)}
.bar{width:4px;height:19px;border-radius:1px;display:inline-block;flex-shrink:0}
.bar.beauty{background:var(--seal-red)}
.bar.jade{background:var(--jade)}
.bar.ink{background:var(--ink-blue)}
.bar.ochre{background:var(--ochre)}
.bar.celadon{background:var(--celadon)}
.body-col{max-width:68ch}
.body-col p{margin-bottom:18px}
.body-col h2{font-size:20px;font-weight:600;margin:34px 0 14px}
.body-col h3{font-size:16px;font-weight:600;margin:26px 0 10px;color:var(--text-3)}
.body-col ul,.body-col ol{margin:0 0 18px 22px}
.body-col li{margin-bottom:7px}
.body-col blockquote{border-left:3px solid var(--hair-4);padding:6px 0 6px 18px;
                     margin:0 0 18px;color:var(--text-3);font-style:italic}
.body-col hr{border:0;border-top:.5px solid var(--hair-3);margin:28px 0}
/* ⭐ Markdown 表格(品牌稿 Timeline 段用): 否则裸竖线会原样显示 */
.body-col .md-table{width:100%;border-collapse:collapse;margin:0 0 22px;
                    font-size:14px;background:#fff;
                    border:.5px solid var(--hair-2)}
.body-col .md-table th{text-align:left;padding:10px 14px;font-weight:600;
  font-size:11.5px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--text-2);background:var(--pale-celadon);
  border-bottom:.5px solid var(--hair-3)}
.body-col .md-table td{padding:10px 14px;border-bottom:.5px solid var(--hair-1);
                       vertical-align:top;line-height:1.6}
.body-col .md-table tr:last-child td{border-bottom:0}
.body-col .md-table td:first-child{white-space:nowrap;color:var(--celadon);
                                   font-weight:600}

/* ── 卡片网格(Houses 列表 / 首页精选) ─────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:8px}
.card{background:#fff;border:.5px solid var(--hair-2);border-radius:4px;
      padding:22px 20px;text-decoration:none;color:inherit;display:block;
      transition:border-color .18s,box-shadow .18s}
.card:hover{border-color:var(--hair-4);box-shadow:0 6px 20px rgba(34,51,46,.06);
            text-decoration:none}
.card .c-cat{font-size:10.5px;letter-spacing:1.1px;text-transform:uppercase;
             color:var(--text-2);font-weight:600;margin-bottom:9px}
.card .c-name{font-size:17px;font-weight:600;color:var(--ink-green-black);
              line-height:1.3;margin-bottom:5px}
.card .c-zh{font-family:var(--serif);font-size:13px;color:var(--text-2);
            letter-spacing:2px;margin-bottom:11px}
.card .c-meta{font-size:12.5px;color:var(--text-2);line-height:1.6}

/* ── 页脚 ─────────────────────────────────────────────────────────── */
footer{border-top:.5px solid var(--hair-2);background:var(--pale-celadon);
       margin-top:auto;padding:44px 0 26px}
.ft-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:32px;
         padding-bottom:30px;border-bottom:.5px solid var(--hair-3)}
.ft-h{font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;
      font-weight:600;color:var(--ink-green-black);margin-bottom:12px}
.ft-p{font-size:12.5px;color:var(--text-2);line-height:1.7;max-width:34ch}
.ft-l{list-style:none}
.ft-l li{margin-bottom:7px}
.ft-l a{font-size:12.5px;color:var(--text-2);text-decoration:none}
.ft-l a:hover{color:var(--celadon);text-decoration:none}
.ft-base{padding-top:20px;display:flex;flex-direction:column;gap:9px}
.ft-base span{font-size:11.5px;color:var(--text-2);line-height:1.65}
.ft-note{color:var(--text-3)!important;max-width:80ch}

/* ── 通用 ─────────────────────────────────────────────────────────── */
.page-head{padding:56px 0 6px}
.page-head h1{font-size:32px}
.page-head .sub{margin-top:14px;color:var(--text-2);font-size:16px;max-width:66ch}
.empty{padding:60px 0;color:var(--text-2)}

/* ── 响应式 ───────────────────────────────────────────────────────── */
@media(max-width:860px){
  .wrap{padding:0 20px}
  .hero{padding:40px 0 30px}
  .hero-grid{grid-template-columns:1fr;gap:26px}
  h1{font-size:28px}
  h1 .zh{font-size:19px;letter-spacing:4px}
  .lede{font-size:15.5px}
  .facts-grid{grid-template-columns:repeat(2,1fr);gap:18px}
  .cards{grid-template-columns:1fr;gap:14px}
  .ft-grid{grid-template-columns:1fr;gap:24px}
  .hd{gap:14px}
  nav{gap:18px}
  .wordmark{font-size:17px}
  .sec-head{margin:40px 0 16px}
}