/* ============================================================
   字体自托管（2026-09-23）
   原由 Google Fonts CDN 引入，大陆访客加载缓慢或不可达；
   现改为按站点实际字符集（1382 字）子集化的本地 woff2，
   6 个字重共约 868 KB，浏览器按页面实际用字按需加载。
   ============================================================ */
@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/noto-serif-sc-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/noto-serif-sc-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Noto Sans SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/noto-sans-sc-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Noto Sans SC';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/noto-sans-sc-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/cormorant-garamond-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/cormorant-garamond-600.woff2') format('woff2');
}
/* ============================================================
   姚源远个人官网 · styles.css
   依据：P2《设计系统与视觉方案》v1.0 · 1:1 落码
   结构：§1 Design Tokens → §2 基础 → §3 导航/抽屉 → §4 按钮/文字链
         → §5 章节头 → §6 Hero/信任条 → §7 组件（卡片/案例行/文章行/
           时间轴/引用块/CTA/表单/页脚） → §8 内页版式 → §9 动效
   断点（P2 §9 固化约定）：sm ≤479 / md 480-767 / lg 768-1023 /
   xl 1024-1279 / 2xl ≥1280
   ============================================================ */

/* ---------- §1 Design Tokens（P2 §9 原样） ---------- */
:root {
  /* ── Color · 基底 ── */
  --color-bg:            #FAF8F5;  /* 暖白米 页面底 */
  --color-surface:       #FFFFFF;  /* 纸白 卡面 */
  --color-surface-alt:   #F3F0EA;  /* 米灰 交替分区 */
  --color-surface-hover: #FDFCFB;  /* 卡片 hover 微亮 */
  --color-line:          #E7E1D6;  /* 米线 1px 分隔 */
  --color-line-strong:   #D8D1C4;  /* 深米线 输入边/hover线 */

  /* ── Color · 主色（深藏青） ── */
  --color-navy-900:      #111C33;  /* hover 加深 / 页脚深层 */
  --color-navy-800:      #1B2A4A;  /* 主色 */
  --color-navy-600:      #2C3E63;  /* 深底次级强调 */
  --color-navy-200:      #B8C0D2;  /* 深底正文（on navy ≈7.8:1） */
  --color-navy-100:      #8A94AC;  /* 深底弱文字（备案号级） */

  /* ── Color · 点缀（古铜金）── */
  --color-gold-700:      #96754A;  /* 金 hover / 标签字 */
  --color-gold-500:      #B08D57;  /* 主金：编号、细线、装饰（on 米白仅装饰用） */
  --color-gold-300:      #CDB695;  /* 深底弱金点缀 */
  --color-gold-100:      #F0E9DC;  /* 金雾 标签底 */

  /* ── Color · 文字 ── */
  --color-ink:           #2B2926;  /* 正文（on 米白 ≈13.7:1） */
  --color-ink-secondary: #5C5952;  /* 次级（≈6.4:1） */
  --color-ink-muted:     #6B675F;  /* caption（≈5.3:1） */
  --color-ink-placeholder: #8A857C; /* 仅占位符与装饰（≈3.5:1） */
  --color-ink-inverse:   #FFFFFF;  /* 深底标题/按钮字 */

  /* ── Color · 功能 ── */
  --color-error:         #A94438;
  --color-success:       #4A6B4F;
  --color-disabled-bg:   #E5E0D7;
  --color-disabled-text: #A19B90;

  /* ── Typography ── */
  --font-serif:   "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --font-sans:    "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
  --font-display: "Cormorant Garamond", "Cormorant", "Georgia", "Times New Roman", serif;
  /* 楷体/行楷栈（仅用于 Hero 水印装饰字；华文行楷需 Office，缺省回退系统楷体） */
  --font-kai: "华文行楷", "STXingkai", "楷体", "KaiTi", "楷体_GB2312", "STKaiti", "Kaiti SC", "TW-Kai", "Noto Serif SC", serif;

  --text-display: clamp(40px, 5vw, 64px);  /* →375px: 32px */
  --text-h1:      clamp(32px, 4vw, 48px);  /* →375px: 28px */
  --text-h2:      clamp(26px, 3vw, 36px);  /* →375px: 24px */
  --text-h3:      clamp(20px, 2.2vw, 24px);/* →375px: 20px */
  --text-h4:      18px;
  --text-body-lg: 17px;
  --text-body:    16px;
  --text-body-sm: 14px;
  --text-caption: 12px;

  --leading-tight:  1.25;  /* Display/H1 */
  --leading-heading:1.35;  /* H2/H3 */
  --leading-body:   1.8;
  --leading-caption:1.5;

  --weight-serif:   600;   /* 衬线标题仅此一档加粗 */
  --weight-medium:  500;
  --weight-regular: 400;

  --tracking-heading: 0.02em; /* 中文标题字距，不得省略 */
  --tracking-number:  0.18em; /* 章节编号字距 */
  --tracking-eyebrow: 0.25em; /* 英文眉行字距 */

  /* ── Spacing（4/8 系） ── */
  --space-3xs: 4px;  --space-2xs: 8px;  --space-xs: 12px;
  --space-s:  16px;  --space-m:  24px;  --space-l: 32px;
  --space-xl: 48px;  --space-2xl:64px;  --space-3xl: 96px;
  --space-4xl: 128px;

  /* ── Layout ── */
  --container-max: 1200px;
  --container-pad: 48px;   /* ≥1024；768-1023:32px；≤767:20px */
  --grid-columns: 12;
  --grid-gutter: 24px;     /* 平板16 移动12 */
  --nav-height: 72px;      /* 移动 56px */

  /* ── Radius（克制） ── */
  --radius-none: 0;
  --radius-sm:   2px;  /* 按钮、输入、标签 */
  --radius-md:   2px;  /* 卡片与按钮同级，不放大 */

  /* ── Shadow（仅此两档） ── */
  --shadow-1: 0 1px 2px rgba(27, 42, 74, 0.04), 0 2px 8px rgba(27, 42, 74, 0.05);  /* 导航浮起 */
  --shadow-2: 0 4px 16px rgba(27, 42, 74, 0.06);                                   /* 仅个别浮层 */

  /* ── Motion ── */
  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);   /* 进场 */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);     /* hover/交互 */
  --dur-fast:    150ms;
  --dur-base:    240ms;
  --dur-reveal:  560ms;
  --dur-reveal-long: 600ms;
  --stagger:     80ms;
  --reveal-distance: 16px;

  /* ── Z-index ── */
  --z-nav: 100; --z-drawer: 200; --z-toast: 300;

  /* ---------- 组件级补充 Tokens（全部取自 P2 组件规范，非新值） ----------
     P2 §3.2 字号阶梯移动步进 / §5 §7 §8 组件定值 / §2.2 §5.6 §5.9 §7.1 派生值 */
  --text-display-sm: 32px;      /* §3.2 Display →375px */
  --text-h1-sm:      28px;      /* §3.2 H1 →375px */
  --text-h2-sm:      24px;      /* §3.2 H2 →375px */
  --text-h3-sm:      20px;      /* §3.2 H3 →375px */
  --text-nav:        15px;      /* §5.1 导航链接 / §5.2 按钮 15px */
  --text-brand-cn:   20px;      /* §5.1 品牌标中文 */
  --text-brand-en:   10px;      /* §5.1 品牌标英文缀 */
  --text-drawer-cn:  24px;      /* §5.1 抽屉菜单中文大字 */
  --text-section-no-sm: 13px;   /* §5.7 编号移动步进 */
  --text-year:       20px;      /* §5.5 时间轴年份 */
  --text-year-sm:    18px;      /* §5.5 时间轴年份移动步进 */
  --text-quote:      clamp(22px, 3vw, 28px); /* §5.6 引用块正文（P5 会审修订 30→28：保 720 容器内 20 字单行，消孤行） */
  --text-quote-sm:   20px;      /* §7.4 引用块移动步进 */
  --text-quote-narrow: 20px;    /* §5.6 内页窄版引用 / §8.3 签名姓名 */
  --text-footer-name: 22px;     /* §5.9 页脚姓名 */
  --text-trust-sm:   13px;      /* §7.2 信任条移动步进 */
  --text-side-name:  28px;      /* §8.1 关于我侧栏姓名 */
  --text-article-h3: 20px;      /* §8.3 文内 H3 */
  --text-numeral:    96px;      /* §3.2 大编号（仅引用块装饰） */
  --text-numeral-sm: 64px;      /* §3.2 大编号移动步进 */
  --text-vline:      14px;      /* §7.1 竖排小字 */
  --leading-article: 1.9;       /* §8.3 文章正文行高 */
  --leading-quote:   1.7;       /* §5.6 引用块行高 */
  --tracking-brand-en: 0.2em;   /* §5.1 品牌英文字距 */
  --tracking-section-en: 0.12em;/* §5.7 编号英文字距 */
  --tracking-vline:  0.3em;     /* §7.1 竖排小字字距 */
  --tracking-cite:   0.1em;     /* §5.6 署名行字距 */
  --tracking-col-title: 0.15em; /* §5.9 页脚栏目小标题字距 */
  --tracking-caption: 0.05em;   /* §3.2 Caption 字距 */
  --color-line-hover: #B8B0A2;  /* §2.2 输入框 hover 边线 */
  --gold-frame-line: rgba(176, 141, 87, 0.4); /* §7.1 卷宗外框（金 40%） */
  --grain-opacity:   0.03;      /* §7.1 纸纹不透明度 ≤3% */
  --footer-divider:  rgba(255, 255, 255, 0.12); /* §5.9 页脚细线 */
  --quote-mark-opacity: 0.6;    /* §5.6 引号透明度 60% */
  --tag-pad-x:       10px;      /* §5.4 案由标签内距 4px 10px */

  /* ── v1.3 风格化增强（2026-09-14 站长指示「更加风格化」）──
     新增印泥红：仅限「钤印」装饰元素使用（印章=文书落款语义，非泛用点缀，金色纪律不变） */
  --color-seal:        #A8402F;  /* 印泥红（米白底） */
  --color-seal-navy:   #C4523F;  /* 印泥红（深藏青底提亮档） */
  --grain-opacity-page: 0.02;  /* 整页纸纹，低于 hero 3% 档 */
}

/* 断点内 Token 覆写（P2 §4.2） */
@media (max-width: 1023px) {
  :root { --container-pad: 32px; --grid-gutter: 16px; }
}
@media (max-width: 767px) {
  :root { --container-pad: 20px; --grid-gutter: 12px; --nav-height: 56px; }
}

/* ---------- §2 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: var(--leading-body);
  color: var(--color-ink);
  background: var(--color-bg);
  font-variant-numeric: tabular-nums; /* §3.2 数字场景 */
}
body.nav-locked { overflow: hidden; }

/* v1.3 整页纸纹：P2 §7.1 hero 纸纹扩展至全页（2%），纸面材质感 */
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 500;
  opacity: var(--grain-opacity-page);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection { background: var(--color-gold-100); color: var(--color-navy-800); }

h1, h2, h3, h4 {
  font-family: var(--font-serif);
  font-weight: var(--weight-serif);
  color: var(--color-navy-800);
  letter-spacing: var(--tracking-heading);
  line-height: var(--leading-heading);
  margin: 0;
}
h1 { font-size: var(--text-h1); line-height: var(--leading-tight); }
h2 { font-size: var(--text-h2); }
h3 { font-size: var(--text-h3); }
h4 { font-family: var(--font-sans); font-weight: var(--weight-medium); font-size: var(--text-h4); color: var(--color-ink); letter-spacing: 0; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
a { color: inherit; }
img { max-width: 100%; display: block; }

.container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-pad); }

/* 键盘焦点（P2 §9 全局唯一标准） */
:focus-visible { outline: 2px solid var(--color-navy-800); outline-offset: 2px; }
.on-navy :focus-visible { outline-color: var(--color-gold-300); }

/* 跳转链接（无障碍） */
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: var(--z-toast);
  background: var(--color-navy-800); color: var(--color-ink-inverse);
  font-size: var(--text-body-sm); padding: var(--space-xs) var(--space-s);
  text-decoration: none;
}
.skip-link:focus { left: 0; }

/* 动效降级（P2 §9 原样） */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  /* reveal 直接呈现终态 */
  .js .reveal { opacity: 1; transform: none; }
}

/* 进场淡入（P2 §6.2-1，仅 JS 可用时启用） */
.js .reveal {
  opacity: 0;
  transform: translateY(var(--reveal-distance));
  transition: opacity var(--dur-reveal) var(--ease-out-soft), transform var(--dur-reveal) var(--ease-out-soft);
}
.js .reveal.is-visible { opacity: 1; transform: none; }

/* ---------- §3 顶部导航（P2 §5.1） ---------- */
.site-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: var(--z-nav);
  height: var(--nav-height);
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background var(--dur-base) var(--ease-standard),
              border-color var(--dur-base) var(--ease-standard),
              box-shadow var(--dur-base) var(--ease-standard);
}
.site-nav.is-scrolled {
  background: var(--color-bg);
  border-bottom-color: var(--color-line);
  box-shadow: var(--shadow-1);
}
.nav-inner { height: 100%; display: flex; align-items: center; gap: var(--space-l); }

.brand { display: flex; flex-direction: column; text-decoration: none; line-height: 1; flex-shrink: 0; }
.brand-cn {
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-brand-cn); letter-spacing: var(--tracking-heading);
  color: var(--color-navy-800); white-space: nowrap; /* P5 修订：五字品牌标防孤字换行 */
}
.brand-en {
  align-self: flex-end; margin-top: var(--space-3xs);
  font-family: var(--font-display); font-size: var(--text-brand-en);
  letter-spacing: var(--tracking-brand-en); color: var(--color-gold-500);
}

.nav-links { display: flex; gap: var(--space-l); margin-left: auto; }
.nav-links a {
  position: relative; display: inline-flex; align-items: center;
  padding: var(--space-s) 0; /* 44px 触控目标 */
  font-size: var(--text-nav); font-weight: var(--weight-medium);
  color: var(--color-navy-800); text-decoration: none;
  transition: color var(--dur-fast) var(--ease-standard);
}
.nav-links a:hover { color: var(--color-gold-700); }
.nav-links a[aria-current="page"]::after {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%);
  bottom: var(--space-2xs); width: 24px; height: 2px; /* §5.1 当前页 24px 金色短线 */
  background: var(--color-gold-500);
}
.nav-cta { height: 40px; padding: 0 var(--space-m); } /* §5.1 导航按钮高 40px */
/* P5 修订：≤374px 超窄屏隐藏表头按钮，保五字品牌标不换行（转化由抽屉与页内 CTA 承接） */
@media (max-width: 374.9px) { .site-nav .nav-cta { display: none; } }

/* 汉堡（两线，§5.1） */
.nav-toggle {
  display: none; width: 44px; height: 44px; margin-left: auto;
  background: none; border: 0; padding: 0; cursor: pointer;
  flex-direction: column; align-items: center; justify-content: center; gap: 6px;
}
.nav-toggle-line {
  display: block; width: 20px; height: 1.5px;
  background: var(--color-navy-800);
  transition: transform var(--dur-base) var(--ease-standard);
}
.nav-toggle[aria-expanded="true"] .nav-toggle-line:first-child { transform: translateY(3.75px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-line:last-child { transform: translateY(-3.75px) rotate(-45deg); }

/* 全屏抽屉（≤1023px，§5.1） */
.nav-drawer {
  position: fixed; inset: 0; z-index: var(--z-drawer);
  background: var(--color-bg);
  padding: calc(var(--nav-height) + var(--space-2xl)) var(--container-pad) var(--space-2xl);
  display: flex; flex-direction: column;
  visibility: hidden; opacity: 0; transform: translateX(16px);
  transition: opacity var(--dur-base) var(--ease-out-soft),
              transform var(--dur-base) var(--ease-out-soft),
              visibility 0s linear var(--dur-base);
}
.nav-drawer.is-open {
  visibility: visible; opacity: 1; transform: none;
  transition: opacity var(--dur-base) var(--ease-out-soft),
              transform var(--dur-base) var(--ease-out-soft);
}
/* P5 会审修订：抽屉打开时页头浮于抽屉之上，× 形态的关闭钮保持可见可点（P2 §5.1“汉堡变×”） */
body.nav-locked .site-nav {
  z-index: calc(var(--z-drawer) + 1);
  background: var(--color-bg);
  border-bottom-color: transparent;
  box-shadow: none;
}
.drawer-nav { display: flex; flex-direction: column; gap: var(--space-l); } /* 行间距 32px */
.drawer-link {
  display: flex; align-items: baseline; gap: var(--space-m);
  min-height: 44px; text-decoration: none;
}
.drawer-no {
  font-family: var(--font-display); font-size: var(--text-nav);
  letter-spacing: var(--tracking-number); color: var(--color-gold-500);
}
.drawer-cn {
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-drawer-cn); letter-spacing: var(--tracking-heading);
  color: var(--color-navy-800);
  transition: color var(--dur-fast) var(--ease-standard);
}
.drawer-link:hover .drawer-cn { color: var(--color-gold-700); }
.drawer-link.is-current .drawer-cn { color: var(--color-gold-700); } /* 当前项编号与文字均转金 */
.drawer-contact {
  margin-top: auto; padding-top: var(--space-m);
  border-top: 1px solid var(--color-line);
  display: flex; flex-direction: column; align-items: flex-start;
  font-size: var(--text-caption); letter-spacing: var(--tracking-caption);
  color: var(--color-ink-muted);
}
.drawer-contact a {
  color: var(--color-ink-muted); text-decoration: none;
  display: inline-flex; align-items: center; min-height: 44px;
}
.drawer-contact a:hover { color: var(--color-navy-800); }

@media (max-width: 1023px) {
  .nav-links, .nav-cta { display: none; }
  .nav-toggle { display: flex; }
}

/* ---------- §4 按钮（P2 §5.2）与文字链 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-sans); font-size: var(--text-nav); font-weight: var(--weight-medium);
  height: 48px; padding: 0 var(--space-l);
  border-radius: var(--radius-sm); border: 1px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background var(--dur-fast) var(--ease-standard),
              color var(--dur-fast) var(--ease-standard),
              border-color var(--dur-fast) var(--ease-standard),
              transform var(--dur-fast) var(--ease-standard);
}
.btn-primary { background: var(--color-navy-800); color: var(--color-ink-inverse); }
.btn-primary:hover { background: var(--color-navy-900); transform: translateY(-1px); }
.btn-primary:active { transform: translateY(0); }
.btn-primary:disabled { background: var(--color-disabled-bg); color: var(--color-disabled-text); transform: none; cursor: default; }
.btn-secondary { background: transparent; border-color: var(--color-navy-800); color: var(--color-navy-800); }
.btn-secondary:hover { border-color: var(--color-gold-500); color: var(--color-gold-700); }
.btn-secondary:active { border-color: var(--color-gold-700); }
.btn-secondary:disabled { border-color: var(--color-disabled-bg); color: var(--color-disabled-text); cursor: default; }

.link-arrow {
  display: inline-flex; align-items: center; gap: var(--space-2xs);
  min-height: 44px;
  font-size: var(--text-nav); font-weight: var(--weight-medium);
  color: var(--color-navy-800); text-decoration: none;
}
.link-arrow .arrow {
  font-family: var(--font-display); color: var(--color-gold-500);
  transition: transform var(--dur-fast) var(--ease-standard);
}
.link-arrow:hover {
  color: var(--color-navy-800);
  text-decoration: underline;
  text-decoration-color: var(--color-gold-500);
  text-underline-offset: 4px;
}
.link-arrow:hover .arrow { transform: translateX(4px); }

/* ---------- §5 章节头（P2 §5.7） ---------- */
.section-no {
  margin: 0;
  font-family: var(--font-display); font-size: var(--text-nav);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-number);
  color: var(--color-gold-500);
}
.section-en { color: var(--color-ink-muted); letter-spacing: var(--tracking-section-en); }
.section-title { margin-top: var(--space-xs); }
.section-rule { width: 32px; height: 1px; background: var(--color-gold-500); margin-top: var(--space-m); } /* §5.7 金色短线 */

.section-top { /* 章节头 + 右侧文字链 */
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--space-m); flex-wrap: wrap; margin-bottom: var(--space-xl);
}

.section { padding-block: var(--space-3xl); }
.section--alt { background: var(--color-surface-alt); }
@media (max-width: 767px) {
  .section { padding-block: var(--space-2xl); } /* §4.1 移动区块距 64 */
  .section-no { font-size: var(--text-section-no-sm); }
}

/* ---------- §6 Hero（P2 §7.1 A 版式）与信任条 ---------- */
.hero {
  position: relative;
  padding: calc(var(--nav-height) + var(--space-2xl)) 0 var(--space-2xl);
  min-height: 640px; /* §7.3 */
  display: flex; align-items: center;
}
/* 全屏纸纹噪点：SVG feTurbulence，不透明度 ≤3%（§7.1） */
.hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero .container { position: relative; width: 100%; }

/* 卷宗双细线框 */
.hero-frame {
  position: relative;
  border: 1px solid var(--gold-frame-line);       /* 外框 金 40% */
  padding: var(--space-4xl) var(--space-3xl) var(--space-3xl);
}
.hero-frame::before {                              /* 内框 米线，间距 8px */
  content: ""; position: absolute; inset: 8px; pointer-events: none;
  border: 1px solid var(--color-line);
}
/* Hero 水印：楷体（行楷优先）大字垫底，收于框内右下，仅作纸面压印
   楷体笔画较宋体细，压印不透明度相应略提，保持「需细看才见」的分寸 */
.hero-frame::after {
  content: "姚"; position: absolute; right: 2%; bottom: 3%;
  font-family: var(--font-kai); font-weight: 400;
  font-size: clamp(170px, 21vw, 300px); line-height: 1;
  color: var(--color-navy-800); opacity: 0.05;
  pointer-events: none; user-select: none;
}
/* 四角线端出头 8px（装订角线），8s 呼吸为全站唯一循环动画（§6.2-4） */
.hero-ticks { position: absolute; inset: 0; pointer-events: none; animation: hero-breath 8s ease-in-out infinite; }
.hero-tick { position: absolute; width: 17px; height: 17px; }
.hero-tick::before { content: ""; position: absolute; left: 0; top: 8px; width: 17px; height: 1px; background: var(--gold-frame-line); }
.hero-tick::after  { content: ""; position: absolute; left: 8px; top: 0; width: 1px; height: 17px; background: var(--gold-frame-line); }
.hero-tick--tl { top: -8px; left: -8px; }
.hero-tick--tr { top: -8px; right: -8px; }
.hero-tick--bl { bottom: -8px; left: -8px; }
.hero-tick--br { bottom: -8px; right: -8px; }
@keyframes hero-breath { 0%, 100% { opacity: 0.5; } 50% { opacity: 0.8; } }

/* B 版式（2026-09-22 形象照到位）：左排印 + 右人像，1px 金线分隔；排印区宽度由栅格决定 */
.hero-grid { display: grid; grid-template-columns: minmax(0, 0.55fr) minmax(0, 1fr); gap: var(--space-2xl); align-items: center; } /* 人像与排印按比例分配，保证窄桌面下排印列仍容得下主标两行 */ /* 人像 4 栏 + 排印 8 栏（P2 §7.1 B 版式，2026-09-22 左右互换） */
.hero-inner { max-width: 100%; position: relative; z-index: 1; } /* 排印主体；z:1 浮于水印与纸纹之上 */
.hero-portrait { order: -1; position: relative; z-index: 1; margin: 0; border-right: 1px solid var(--gold-frame-line); padding-right: var(--space-xl); } /* order 置首列；金线在人像右侧、与排印相隔 */
.hero-portrait img { width: 100%; height: auto; }
.hero-eyebrow {
  font-family: var(--font-display); font-size: var(--text-caption);
  letter-spacing: var(--tracking-eyebrow); color: var(--color-gold-500);
  margin-bottom: var(--space-m);
}
.hero-title {
  font-size: var(--text-display); line-height: var(--leading-tight);
  letter-spacing: var(--tracking-heading); color: var(--color-navy-800);
}
.hero-sub {
  margin-top: var(--space-l);
  font-size: var(--text-body-lg); color: var(--color-ink-secondary);
  max-width: 34em;
  text-wrap: balance; /* P5 修订：多行时均衡断行，避免末行孤字 */
}
/* 身份短语整体不可断：断行点收窄到短语之间的空格（中文避头尾）。
   窄屏（≤400px）字号逐级下调以容纳最长短语；极窄屏（≤359px）放弃保护，回落自然断行。 */
.hero-sub .nowrap { white-space: nowrap; }
.hero-actions { margin-top: var(--space-xl); display: flex; gap: var(--space-s); }

/* 右上竖排小字（仅此一处竖排，§7.1） */
.hero-vline {
  position: absolute; top: var(--space-xl); right: var(--space-2xl);
  margin: 0;
  writing-mode: vertical-rl;
  font-family: var(--font-serif); font-size: var(--text-vline);
  letter-spacing: var(--tracking-vline); color: var(--color-ink-muted);
}

/* 滚动指示线（§6.2-5）：1px 竖线 24px 高，2s 缓慢伸缩 */
.hero-scroll { position: absolute; left: 50%; bottom: var(--space-m); width: 24px; height: 24px; display: flex; justify-content: center; }
.hero-scroll span {
  display: block; width: 1px; height: 24px; background: var(--color-gold-500);
  transform-origin: top;
  animation: scroll-pulse 2s var(--ease-standard) infinite alternate;
}
@keyframes scroll-pulse { from { transform: scaleY(0.3); } to { transform: scaleY(1); } }

@media (min-width: 1024px) and (max-width: 1199px) {
  .hero-grid { gap: var(--space-xl); } /* 中等桌面收窄列距，保证排印列宽度 */
}
@media (max-width: 1023px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-2xl); } /* 单列 */
  .hero-portrait { order: 0; border-right: 0; padding-right: 0; max-width: 260px; } /* 取消置首，人像回到文字下方 */
}
@media (max-width: 767px) {
  .hero { padding: calc(var(--nav-height) + var(--space-3xl)) 0 var(--space-3xl); min-height: 0; } /* §7.4 上下距 96 */
  .hero-frame { padding: var(--space-xl) var(--space-m); }
  .hero-frame::before { display: none; } /* 卷宗框简化为单线 */
  .hero-frame::after { display: none; }  /* v1.3 水印移动端省略 */
  .hero-ticks { display: none; }
  .hero-inner { max-width: 100%; }
  .hero-portrait { max-width: 200px; } /* 移动端人像缩窄，避免占满首屏 */
  .hero-title { font-size: var(--text-display-sm); }
  .hero-sub { font-size: var(--text-body); }
  .hero-actions { flex-direction: column; gap: var(--space-xs); } /* 主按钮全宽堆叠，间距 12px */
  .hero-actions .btn { width: 100%; }
  .hero-vline { display: none; } /* 竖排小字省略 */
}
@media (max-width: 400px) {
  .hero-sub { font-size: 15px; } /* 容器收窄，字号逐级下调以容纳最长身份短语 */
}
@media (max-width: 359px) {
  .hero-sub .nowrap { white-space: normal; } /* 极窄屏短语宽于容器，放弃保护 */
}

/* 信任条（P2 §7.2）：上下 1px 米线夹一行事实 */
.trust-bar {
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  padding: var(--space-m) 0;
}
.trust-list {
  list-style: none;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--space-2xs) var(--space-s);
}
.trust-list li { font-size: var(--text-body-sm); color: var(--color-ink-secondary); line-height: var(--leading-caption); }
.trust-list li + li::before {
  content: ""; display: inline-block; vertical-align: middle;
  width: 1px; height: 12px; background: var(--color-line-strong);
  margin-right: var(--space-s);
}
.trust-list strong { font-weight: var(--weight-medium); }
@media (max-width: 767px) {
  .trust-list li { font-size: var(--text-trust-sm); } /* 折两行居中，13px */
}

/* ---------- §7 组件 ---------- */

/* 7.1 板块卡（P2 §5.3） */
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--grid-gutter); }
.service-card {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  padding: var(--space-l);
  display: flex; flex-direction: column; gap: var(--space-s);
  transition: border-color var(--dur-base) var(--ease-standard),
              transform var(--dur-base) var(--ease-standard),
              background var(--dur-base) var(--ease-standard);
}
.service-card:hover {
  border-color: var(--color-gold-500);
  transform: translateY(-4px);
  background: var(--color-surface-hover);
}
.card-no { font-family: var(--font-display); font-size: var(--text-nav); letter-spacing: var(--tracking-number); color: var(--color-gold-500); }
.card-title { font-size: var(--text-h3); }
.card-desc { font-size: var(--text-body-sm); color: var(--color-ink-secondary); flex-grow: 1; }
.service-card .link-arrow { margin-top: var(--space-2xs); align-self: flex-start; }
@media (max-width: 1023px) { .service-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) {
  .service-grid { grid-template-columns: 1fr; gap: var(--space-s); } /* 单列，卡间距 16px */
  .service-card { padding: var(--space-s); }                          /* 移动卡内距 16px */
  .card-title { font-size: var(--text-h3-sm); }
}

/* 7.2 案由标签（P2 §5.4） */
.tag {
  display: inline-block; align-self: flex-start;
  font-size: var(--text-caption); line-height: var(--leading-caption);
  letter-spacing: var(--tracking-caption);
  color: var(--color-gold-700);
  background: var(--color-gold-100);
  padding: var(--space-3xs) var(--tag-pad-x);
  border-radius: var(--radius-none);
}

/* 7.3 案例行式列表（P2 §5.4） */
.case-list { border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); }
.case-row {
  display: grid;
  grid-template-columns: 72px auto minmax(0, 1.15fr) minmax(0, 1fr) 24px;
  grid-template-areas: "no tag title result arrow";
  gap: var(--space-m); align-items: center;
  padding: var(--space-m) var(--space-2xs);
  text-decoration: none;
  border-bottom: 1px solid var(--color-line);
  transition: background var(--dur-fast) var(--ease-standard);
}
.case-row:last-child { border-bottom: 0; }
.case-row:hover { background: var(--color-surface-hover); }
.case-no {
  grid-area: no;
  font-family: var(--font-display); font-size: var(--text-body); /* v1.3 14→16px，编号与衬线标题配比 */
  font-weight: 500;
  letter-spacing: var(--tracking-number); color: var(--color-gold-500);
}
.case-row .tag { grid-area: tag; }
.case-title {
  grid-area: title;
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-h4); line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading); color: var(--color-navy-800);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  transition: color var(--dur-fast) var(--ease-standard);
}
.case-result { grid-area: result; font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
.row-arrow {
  grid-area: arrow; justify-self: end;
  font-family: var(--font-display); font-size: var(--text-h4);
  color: var(--color-gold-500);
  transition: transform var(--dur-fast) var(--ease-standard);
}
.case-row:hover .case-title { color: var(--color-gold-700); }
.case-row:hover .row-arrow { transform: translateX(4px); }
@media (max-width: 767px) {
  .case-row {
    grid-template-columns: auto auto 1fr;
    grid-template-areas: "no tag tag" "title title title" "result result result";
    gap: var(--space-2xs) var(--space-xs); /* 编号与标签同行折行，标题独占一行 */
    padding: var(--space-s) 0;             /* 行内距 16px */
  }
  .case-row .row-arrow { display: none; }  /* 箭头隐藏 */
}

/* 7.4 文章行式列表（P2 §5.4 行式形态复用） */
.article-list { border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); }
.article-row {
  position: relative; display: block;
  padding: var(--space-m) var(--space-2xs);
  padding-right: var(--space-xl);
  border-bottom: 1px solid var(--color-line);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-standard);
}
.article-row:last-child { border-bottom: 0; }
.article-row:hover { background: var(--color-surface-hover); }
.article-row-head { display: flex; align-items: center; gap: var(--space-s); margin-bottom: var(--space-2xs); }
.article-row-title {
  display: block; /* v1.3 修复：原行内排布致标题与摘要挤同一段 */
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-h4); letter-spacing: var(--tracking-heading);
  color: var(--color-navy-800);
  transition: color var(--dur-fast) var(--ease-standard);
}
.article-row-summary { display: block; margin-top: var(--space-3xs); font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
.article-row-meta { font-size: var(--text-caption); letter-spacing: var(--tracking-caption); color: var(--color-ink-muted); margin-top: var(--space-2xs); }

/* 文章扁平列表（writings 页：不分层，直接罗列） */
.article-list--flat { margin-top: var(--space-xl); border-top: 1px solid var(--color-line); }
.article-row .row-arrow { position: absolute; right: var(--space-2xs); top: 50%; transform: translateY(-50%); }
.article-row:hover .row-arrow { transform: translateY(-50%) translateX(4px); }
.article-row:hover .article-row-title { color: var(--color-gold-700); }
@media (max-width: 767px) {
  .article-row { padding: var(--space-s) 0; padding-right: 0; }
  .article-row .row-arrow { display: none; }
}

/* 7.5 履历时间轴（P2 §5.5） */
.timeline { list-style: none; position: relative; }
.timeline::before {
  content: ""; position: absolute; left: 3.5px; top: 8px; bottom: 8px;
  width: 1px; background: var(--color-line);             /* 左侧 1px 竖线 */
}
.timeline-item { position: relative; padding-left: var(--space-m); } /* 文字距竖线 24px */
.timeline-item + .timeline-item { margin-top: var(--space-l); }      /* 条目间距 32px */
.timeline-item::before {                                   /* 8px 空心圆环节点 */
  content: ""; position: absolute; left: 0; top: 7px;
  width: 8px; height: 8px; border-radius: 50%;
  border: 1.5px solid var(--color-gold-500);
  background: var(--color-bg);
}
.timeline-item.is-current::before { background: var(--color-gold-500); } /* 最新一条实心 */
.timeline-year {
  display: block; font-family: var(--font-display); font-weight: var(--weight-medium);
  font-size: var(--text-year); line-height: 1;
  color: var(--color-gold-500);
  margin-bottom: var(--space-2xs);
}
.timeline-title {
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-body); letter-spacing: var(--tracking-heading);
  color: var(--color-navy-800);
}
.timeline-desc { font-size: var(--text-body-sm); color: var(--color-ink-secondary); margin-top: var(--space-2xs); }
@media (max-width: 767px) {
  .timeline-item { padding-left: var(--space-s); }   /* 文字距竖线 16px */
  .timeline-year { font-size: var(--text-year-sm); } /* 年份 18px */
}

/* 7.6 引用块（P2 §5.6）：全站唯一深色整幅 */
.quote-block { background: var(--color-navy-800); padding: var(--space-4xl) 0; }
.quote-inner { max-width: 720px; margin-inline: auto; padding-inline: var(--container-pad); position: relative; }
.quote-mark {
  position: absolute; top: -28px; left: -6px;
  font-family: var(--font-display); font-size: var(--text-numeral);
  line-height: 1;
  color: var(--color-gold-500); opacity: var(--quote-mark-opacity);
  pointer-events: none;
}
.quote-block blockquote { margin: 0 0 0 var(--space-m); } /* P5 会审修订：左距 48→24，与 28px 字号配合保单行 */
.quote-block blockquote p {
  font-family: var(--font-serif); font-weight: var(--weight-medium);
  font-size: var(--text-quote); line-height: var(--leading-quote);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink-inverse);
}
.quote-cite {
  margin-top: var(--space-l);
  font-size: var(--text-caption); letter-spacing: var(--tracking-cite);
  color: var(--color-navy-200);
}

/* ---------- v1.3 钤印（姚源远印）：2×2 印文，自右向左读（右上→右下→左上→左下） ---------- */
.seal-mark {
  display: inline-grid; grid-auto-flow: column; grid-template-rows: 1fr 1fr;
  direction: rtl; /* 列序自右向左，印文合传统钤印读法 */
  gap: 2px;
  width: 58px; height: 58px; padding: 6px; box-sizing: border-box;
  border: 2px solid currentColor; border-radius: 3px;
  color: var(--color-seal);
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: 19px; line-height: 1; letter-spacing: 0;
  transform: rotate(-2deg);
  mix-blend-mode: multiply; /* 印泥沁纸 */
  flex: 0 0 auto;
}
.seal-mark i { font-style: normal; display: flex; align-items: center; justify-content: center; }
.on-navy .seal-mark { color: var(--color-seal-navy); mix-blend-mode: normal; }

/* v1.3 信条块桌面端竖排：正文右起两列，落款+钤印居左（落款位） */
@media (min-width: 768px) {
  .quote-inner { display: flex; justify-content: center; gap: var(--space-2xl); }
  .quote-mark { display: none; } /* 竖排构图去西文引号 */
  .quote-block blockquote { margin: 0; }
  .quote-block blockquote p {
    writing-mode: vertical-rl; text-orientation: mixed;
    height: 296px; margin: 0;
  }
  .quote-sign {
    display: flex; flex-direction: column; align-items: center; gap: var(--space-m);
    align-self: flex-end;
  }
  .quote-cite { writing-mode: vertical-rl; margin: 0; }
}
@media (max-width: 767px) {
  .quote-sign {
    display: flex; align-items: center; justify-content: center; gap: var(--space-s);
    margin-top: var(--space-l);
  }
  .quote-cite { margin-top: 0; }
  .seal-mark { width: 48px; height: 48px; font-size: 16px; padding: 5px; }
}
@media (max-width: 767px) {
  .quote-block { padding: var(--space-2xl) 0; }
  .quote-mark { font-size: var(--text-numeral-sm); top: -20px; }
  .quote-block blockquote { margin-left: 0; padding-top: var(--space-l); }
  .quote-block blockquote p { font-size: var(--text-quote-sm); } /* 引用块 20px */
}

/* 内页窄版引用（P2 §5.6 变体）：米白底 + 2px 金竖线 + 衬线 20px 藏青 */
.quote-narrow {
  margin: var(--space-l) 0;
  border-left: 2px solid var(--color-gold-500);
  padding: var(--space-2xs) 0 var(--space-2xs) var(--space-m);
}
.quote-narrow p {
  font-family: var(--font-serif); font-weight: var(--weight-medium);
  font-size: var(--text-quote-narrow); line-height: var(--leading-quote);
  letter-spacing: var(--tracking-heading); color: var(--color-navy-800);
}

/* 7.7 联系 CTA（首页，上下金细线夹内容区，§7.3 区块五） */
.cta {
  border-top: 1px solid var(--color-gold-500);
  border-bottom: 1px solid var(--color-gold-500);
  padding: var(--space-3xl) 0;
  text-align: center;
}
.cta-inner { max-width: 720px; margin-inline: auto; display: flex; flex-direction: column; align-items: center; gap: var(--space-m); }
.cta-title { font-size: var(--text-h2); }
.cta-text { color: var(--color-ink-secondary); }
.cta-contact { font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
@media (max-width: 767px) {
  .cta { padding: var(--space-2xl) 0; text-align: left; }
  .cta-inner { align-items: flex-start; }
  .cta-inner .btn { width: 100%; }
  .cta-title { font-size: var(--text-h2-sm); }
}

/* 7.8 页尾咨询组件（内页通用） */
.page-cta {
  border-top: 1px solid var(--color-line);
  margin-top: var(--space-3xl);
  padding-top: var(--space-xl);
  display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-m);
}
.page-cta p { max-width: 720px; }

/* 7.10 页脚（P2 §5.9） */
.site-footer { background: var(--color-navy-800); color: var(--color-navy-200); padding-top: var(--space-3xl); }
.footer-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--space-xl); padding-bottom: var(--space-xl);
}
.footer-name {
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: var(--text-footer-name); letter-spacing: var(--tracking-heading);
  color: var(--color-ink-inverse);
}
.footer-name-en {
  margin-top: var(--space-3xs);
  font-family: var(--font-display); font-size: var(--text-caption);
  letter-spacing: var(--tracking-brand-en); color: var(--color-gold-300);
}
.footer-tagline { margin-top: var(--space-m); font-size: var(--text-body-sm); color: var(--color-navy-200); }
/* 页脚公众号二维码（2026-09-22：自联系栏移至品牌区） */
.footer-qr { margin-top: var(--space-l); display: flex; align-items: center; gap: var(--space-s); }
.footer-qr img { width: 88px; height: 88px; flex: 0 0 auto; }
.footer-qr p { font-size: var(--text-body-sm); color: var(--color-navy-200); }
.footer-col-title {
  font-size: var(--text-caption); letter-spacing: var(--tracking-col-title);
  color: var(--color-gold-300); margin-bottom: var(--space-2xs);
}
.footer-nav-cols { display: flex; gap: var(--space-2xl); }
.site-footer ul { list-style: none; }
.footer-nav li, .footer-contact li { font-size: var(--text-body-sm); }
.footer-nav a {
  display: inline-block; padding: var(--space-3xs) 0;
  color: var(--color-navy-200); text-decoration: none;
  transition: color var(--dur-fast) var(--ease-standard);
}
.footer-nav a:hover { color: var(--color-ink-inverse); } /* hover 白 */
.footer-contact li { padding: var(--space-3xs) 0; }
.footer-bottom { border-top: 1px solid var(--footer-divider); } /* 1px rgba(255,255,255,.12) */
.footer-bottom-inner {
  display: flex; justify-content: space-between; gap: var(--space-s);
  padding-block: var(--space-m);
  font-size: var(--text-caption); letter-spacing: var(--tracking-caption);
  color: var(--color-navy-100);
}
@media (max-width: 767px) {
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-l); } /* 三栏纵向堆叠，间距 32px */
  .footer-bottom-inner { flex-direction: column; gap: var(--space-3xs); justify-content: flex-start; } /* 下区上下两行居左 */
}

/* ---------- §8 内页版式 ---------- */
.page-head { padding: calc(var(--nav-height) + var(--space-3xl)) 0 var(--space-xl); }
.page-head .section-title, .page-title { margin-top: var(--space-xs); }
.page-lede {
  margin-top: var(--space-m);
  border-left: 2px solid var(--color-gold-500);
  padding-left: var(--space-s);
  font-family: var(--font-serif); font-weight: var(--weight-medium);
  font-size: var(--text-quote-narrow); line-height: var(--leading-quote);
  letter-spacing: var(--tracking-heading); color: var(--color-navy-800);
}
.page-body { padding-bottom: var(--space-3xl); }
.page-body > .container > * + * { margin-top: var(--space-l); }
@media (max-width: 767px) {
  .page-head { padding: calc(var(--nav-height) + var(--space-2xl)) 0 var(--space-l); }
  .page-title { font-size: var(--text-h1-sm); }
  .page-lede { font-size: var(--text-body-lg); }
  .page-body { padding-bottom: var(--space-2xl); }
}

/* 导语 / 正文散文 */
.prose { max-width: 720px; }
/* 正文区标题上下距：全局 h3 的 margin 为 0，正文中的小标题需显式设定，否则紧贴上文 */
.prose h3 { margin: var(--space-xl) 0 var(--space-s); }
.prose h3:first-child { margin-top: var(--space-xl); } /* 与容器 32px 块距折叠后取 48px，与非首标题一致 */
.page-body section > h3 { margin: var(--space-xl) 0 var(--space-s); } /* 与容器 32px 块距折叠后取 48px */
.prose p + p { margin-top: var(--space-m); } /* 段距 24px */
.prose ul { list-style: none; margin-top: var(--space-m); }
.prose ul li { position: relative; padding-left: var(--space-l); margin-bottom: var(--space-2xs); }
.prose ul li::before { content: ""; position: absolute; left: 0; top: 0.85em; width: var(--space-s); height: 1px; background: var(--color-gold-500); }

/* 文章正文（P2 §8.3）：680px 居中列 */
.article-wrap { max-width: 680px; margin-inline: auto; }

/* v1.3 文章首段首字下沉：两行高衬线首字，阅读版式的「开卷」仪式 */
.article-body > p:first-of-type::first-letter {
  float: left;
  font-family: var(--font-serif); font-weight: var(--weight-serif);
  font-size: 54px; line-height: 1;
  padding: 5px 10px 0 0;
  color: var(--color-navy-800);
}
.article-head .tag { margin-bottom: var(--space-m); }
.article-meta { margin-top: var(--space-s); font-size: var(--text-body-sm); color: var(--color-ink-muted); }
.article-caption { margin-top: var(--space-m); font-size: var(--text-body-sm); color: var(--color-ink-muted); }
.article-rule { margin-top: var(--space-l); border: 0; border-top: 1px solid var(--color-line); }
.article-body { margin-top: var(--space-l); line-height: var(--leading-article); }
.article-body p + p { margin-top: var(--space-m); }
.article-body h3 {
  position: relative; margin: var(--space-xl) 0 var(--space-m);
  font-size: var(--text-article-h3); padding-left: 28px;
}
.article-body h3::before { /* 前置 16px 金色短横（§8.3） */
  content: ""; position: absolute; left: 0; top: 0.62em;
  width: 16px; height: 1px; background: var(--color-gold-500);
}

/* 关键结论强调段（P2 §8.2：2px 金色左竖线，每篇最多 1 处） */
.key-point { border-left: 2px solid var(--color-gold-500); padding-left: var(--space-m); }

/* 案例详情：三列信息条（P2 §8.2） */
.case-info {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-l);
  border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line);
  padding: var(--space-l) 0; margin-top: var(--space-xl);
}
.case-info dt { font-size: var(--text-caption); letter-spacing: var(--tracking-caption); color: var(--color-ink-muted); margin-bottom: var(--space-2xs); }
.case-info dd { margin: 0; font-size: var(--text-body-sm); line-height: var(--leading-body); color: var(--color-ink); }
@media (max-width: 767px) {
  .case-info { grid-template-columns: 1fr; gap: var(--space-m); } /* 移动纵向三行 */
}

/* 案例：页尾备注 / 前后导航 */
.case-note { font-size: var(--text-body-sm); color: var(--color-ink-muted); }
.case-pager {
  border-top: 1px solid var(--color-line);
  margin-top: var(--space-xl); padding-top: var(--space-l);
  display: flex; justify-content: space-between; align-items: baseline;
  gap: var(--space-m); flex-wrap: wrap;
}
.case-pager-muted { font-size: var(--text-body-sm); color: var(--color-ink-muted); }

/* 签名块（P2 §8.3） */
.signature { border-top: 1px solid var(--color-line); margin-top: var(--space-xl); padding-top: var(--space-l); }
.signature-name { font-family: var(--font-serif); font-weight: var(--weight-serif); font-size: var(--text-quote-narrow); color: var(--color-navy-800); letter-spacing: var(--tracking-heading); }
.signature-name .seal-mark { width: 46px; height: 46px; font-size: 15px; padding: 4px; margin-left: var(--space-s); vertical-align: -12px; } /* v1.3 落款钤印 */
.signature-role { margin-top: var(--space-2xs); font-size: var(--text-caption); letter-spacing: var(--tracking-caption); color: var(--color-ink-muted); }

/* 文尾过渡 + 二维码占位 */
.article-outro { margin-top: var(--space-l); display: flex; justify-content: space-between; align-items: center; gap: var(--space-l); flex-wrap: wrap; }
.article-outro p { font-size: var(--text-body-sm); color: var(--color-ink-secondary); }

/* 二维码实图（96px） */
.qr-img {
  width: 96px; height: 96px; flex: 0 0 auto; display: block;
  border: 1px solid var(--color-line-strong); background: #fff;
}

/* 相关阅读（P2 §8.3：行式，不做卡片） */
.related { margin-top: var(--space-xl); }
.related .section-title { font-size: var(--text-h3); margin-bottom: var(--space-m); }

/* 服务总览行式列表（P3 §2.0） */
.service-rows { border-top: 1px solid var(--color-line); border-bottom: 1px solid var(--color-line); }
.service-row {
  display: grid; grid-template-columns: 72px minmax(0, 1.2fr) minmax(0, 1fr) 24px;
  grid-template-areas: "no title desc arrow";
  gap: var(--space-m); align-items: center;
  padding: var(--space-m) var(--space-2xs);
  text-decoration: none; border-bottom: 1px solid var(--color-line);
  transition: background var(--dur-fast) var(--ease-standard);
}
.service-row:last-child { border-bottom: 0; }
.service-row:hover { background: var(--color-surface-hover); }
.service-row-no { grid-area: no; font-family: var(--font-display); font-size: var(--text-nav); letter-spacing: var(--tracking-number); color: var(--color-gold-500); }
.service-row-title { grid-area: title; font-family: var(--font-serif); font-weight: var(--weight-serif); font-size: var(--text-h4); letter-spacing: var(--tracking-heading); color: var(--color-navy-800); transition: color var(--dur-fast) var(--ease-standard); }
.service-row-desc { grid-area: desc; font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
.service-row:hover .service-row-title { color: var(--color-gold-700); }
.service-row:hover .row-arrow { transform: translateX(4px); }
@media (max-width: 767px) {
  .service-row { grid-template-columns: 1fr; grid-template-areas: "no" "title" "desc"; gap: var(--space-2xs); padding: var(--space-s) 0; }
  .service-row .row-arrow { display: none; }
}

/* 服务内容列表 */
.lead-list { list-style: none; border-top: 1px solid var(--color-line); margin-top: var(--space-m); }
.lead-list li { padding: var(--space-m) 0; border-bottom: 1px solid var(--color-line); }
.lead-list strong { font-weight: var(--weight-medium); color: var(--color-navy-800); }

/* 栏目说明 / 领域简表（dt + dd 行） */
.term-rows { border-top: 1px solid var(--color-line); margin-top: var(--space-m); }
.term-rows > div { display: grid; grid-template-columns: minmax(96px, 200px) 1fr; gap: var(--space-m); padding: var(--space-m) 0; border-bottom: 1px solid var(--color-line); }
.term-rows dt { font-family: var(--font-serif); font-weight: var(--weight-serif); font-size: var(--text-body); letter-spacing: var(--tracking-heading); color: var(--color-navy-800); }
.term-rows dd { margin: 0; font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
@media (max-width: 767px) {
  .term-rows > div { grid-template-columns: 1fr; gap: var(--space-2xs); }
}

/* 关于我页（P2 §8.1） */
.about-layout { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); column-gap: var(--space-3xl); align-items: start; }
.about-side { position: sticky; top: calc(var(--nav-height) + var(--space-l)); }
.side-name { font-family: var(--font-serif); font-weight: var(--weight-serif); font-size: var(--text-side-name); letter-spacing: var(--tracking-heading); color: var(--color-navy-800); line-height: var(--leading-tight); }
.side-name-en { margin-top: var(--space-2xs); font-family: var(--font-display); font-size: var(--text-caption); letter-spacing: var(--tracking-brand-en); color: var(--color-gold-500); }
.side-role { margin-top: var(--space-s); font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
.side-contact { margin-top: var(--space-l); font-size: var(--text-body-sm); color: var(--color-ink-secondary); }
/* 侧栏照片（2026-09-22 嘉宾照上站）：粘性侧栏随页面滚动保持可见 */
.side-photo { margin: var(--space-l) 0 0; }
.side-photo img { width: 100%; height: auto; }
.side-photo figcaption { margin-top: var(--space-2xs); font-size: var(--text-caption); letter-spacing: var(--tracking-caption); color: var(--color-ink-muted); }
.about-section + .about-section { margin-top: var(--space-2xl); }
.about-section .section-title { font-size: var(--text-h3); }
@media (max-width: 1023px) {
  .about-layout { grid-template-columns: 1fr; }
  .about-side { position: static; margin-bottom: var(--space-xl); } /* 侧栏取消粘性，转页首头部块 */
  .side-photo { max-width: 240px; } /* 照片不占满整屏，避免压过正文 */
}

/* 联系页（P3 §5.1/§5.2） */
.contact-list { list-style: none; border-top: 1px solid var(--color-line); margin-top: var(--space-m); }
.contact-list li {
  display: grid; grid-template-columns: 5em minmax(0, 1fr); gap: var(--space-m);
  align-items: center; padding: var(--space-m) 0; border-bottom: 1px solid var(--color-line);
  font-size: var(--text-body);
}
.contact-label { color: var(--color-navy-800); font-weight: var(--weight-medium); }
.contact-list a { color: var(--color-navy-800); }

/* 媒体查询之外的触控目标兜底：移动端页脚链接放大热区 */
@media (max-width: 767px) {
  .footer-nav a { min-height: 44px; }
}

/* 时间轴区块首页双栏（§7.3 区块一） */
.home-about-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-2xl); align-items: start; }
.home-about-grid .prose { max-width: none; }
.home-about-more { margin-top: var(--space-l); }
@media (max-width: 767px) {
  .home-about-grid { grid-template-columns: 1fr; gap: var(--space-xl); }
}

/* 章节右上文字链（02/04 区块）已在 .section-top 中处理 */
.section-more { display: flex; justify-content: flex-end; margin-top: var(--space-m); }