.page-about{
  --about-rule:3px double var(--color-line);
  --about-rule-ink:3px double var(--color-contrast-line);
  --about-mark:3px;
  --about-rail:216px;
  --about-dim:color-mix(in srgb, var(--color-contrast-ink) 72%, transparent);
  --about-tint:color-mix(in srgb, var(--color-primary) 16%, transparent);
  --about-lift:color-mix(in srgb, var(--color-contrast-ink) 9%, transparent);
  display:block;
}

/* ---------- 首屏：窄列导语 + 右侧档案图 ---------- */
.page-about .about-masthead{
  padding-top:var(--space-4);
  padding-bottom:var(--space-8);
}
.page-about .masthead-grid{
  display:grid;
  gap:var(--space-6);
  margin-top:var(--space-4);
}
.page-about .about-h1{
  font-family:var(--font-heading);
  font-weight:var(--weight-heading);
  font-size:var(--text-2xl);
  line-height:var(--leading-heading);
  letter-spacing:var(--tracking-heading);
  color:var(--color-ink);
  margin:var(--space-2) 0 var(--space-3);
  max-width:22ch;
}
.page-about .masthead-lead{
  font-size:var(--text-base);
  line-height:var(--leading-body);
  color:var(--color-ink-soft);
  max-width:var(--measure);
  margin:0 0 var(--space-4);
}
.page-about .masthead-meta{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-2) var(--space-6);
  margin:0;
  padding:var(--space-3) 0 0;
  border-top:var(--about-rule);
}
.page-about .masthead-meta li{
  font-size:var(--text-sm);
  color:var(--color-ink);
}
.page-about .masthead-meta .mono{
  display:block;
  font-size:var(--text-xs);
  letter-spacing:0.14em;
  color:var(--color-ink-muted);
  margin-bottom:var(--space-1);
}

/* ---------- 图片构件 ---------- */
.page-about .about-fig{
  margin:0;
}
.page-about .fig-media{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-md);
  background:var(--color-surface-deep);
}
.page-about .fig-media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-about .fig-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:var(--about-tint);
  pointer-events:none;
}
.page-about .figure__caption{
  margin-top:var(--space-2);
  font-size:var(--text-xs);
  line-height:1.6;
  letter-spacing:0.04em;
  color:var(--color-ink-muted);
}

/* ---------- 主体栅格：左侧小节索引 + 纵向叙事 ---------- */
.page-about .about-body{
  display:grid;
  gap:var(--space-6);
  padding-bottom:var(--space-8);
}
.page-about .about-rail{
  border-top:var(--about-rule);
  padding-top:var(--space-3);
}
.page-about .rail-title{
  margin:0 0 var(--space-2);
  font-size:var(--text-xs);
  letter-spacing:0.18em;
  color:var(--color-ink-muted);
}
.page-about .rail-list{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-2) var(--space-4);
  margin:0;
  padding:0;
}
.page-about .rail-link{
  display:inline-flex;
  align-items:baseline;
  gap:var(--space-1);
  font-size:var(--text-sm);
  color:var(--color-ink-soft);
  text-decoration:none;
  border-bottom:var(--border-thin) solid transparent;
  padding-bottom:var(--space-1);
  transition:color 160ms ease, border-color 160ms ease;
}
.page-about .rail-link .mono{
  color:var(--color-primary);
  font-size:var(--text-xs);
  letter-spacing:0.1em;
}
.page-about .rail-link:hover,
.page-about .rail-link:focus-visible{
  color:var(--color-ink);
  border-bottom-color:var(--color-accent);
}

/* ---------- 小节 ---------- */
.page-about .about-sec{
  padding-block:var(--space-6);
  scroll-margin-top:var(--space-8);
}
.page-about .about-sec + .about-sec{
  border-top:var(--border-thin) solid var(--color-line);
}
.page-about .sec-head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:var(--space-2);
  margin-bottom:var(--space-4);
}
.page-about .sec-head h2{
  margin:0;
  font-family:var(--font-heading);
  font-weight:var(--weight-heading);
  font-size:var(--text-xl);
  line-height:var(--leading-heading);
  letter-spacing:var(--tracking-heading);
  color:var(--color-ink);
}
.page-about .about-prose{
  font-size:var(--text-base);
  line-height:var(--leading-body);
  color:var(--color-ink);
  max-width:var(--measure);
  margin:0 0 var(--space-3);
}
.page-about .stamp{
  margin:0 0 var(--space-4);
  font-size:var(--text-xs);
  letter-spacing:0.14em;
}

/* ---------- 叙事条目 ---------- */
.page-about .entry + .entry{
  margin-top:var(--space-6);
}
.page-about .entry-id{
  margin:0;
  font-size:var(--text-xs);
  letter-spacing:0.16em;
  color:var(--color-ink-muted);
}
.page-about .entry h3{
  margin:var(--space-1) 0 var(--space-2);
  font-family:var(--font-heading);
  font-weight:var(--weight-heading);
  font-size:var(--text-lg);
  line-height:var(--leading-heading);
  letter-spacing:var(--tracking-heading);
  color:var(--color-ink);
}
.page-about .entry .about-prose{
  margin-bottom:0;
}

/* ---------- 阶段清单 ---------- */
.page-about .stage-fig{
  margin:var(--space-4) 0 var(--space-6);
}
.page-about .stage-list{
  list-style:none;
  display:grid;
  gap:var(--space-4);
  margin:0;
  padding:0;
}
.page-about .stage-item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--space-2);
  align-items:start;
  padding-top:var(--space-3);
  border-top:var(--border-thin) solid var(--color-line);
}
.page-about .stage-body h3{
  margin:0 0 var(--space-1);
  font-family:var(--font-heading);
  font-weight:var(--weight-heading);
  font-size:var(--text-base);
  line-height:var(--leading-heading);
  color:var(--color-ink);
}
.page-about .stage-body p{
  margin:0;
  font-size:var(--text-sm);
  line-height:1.6;
  color:var(--color-ink-soft);
}

/* ---------- 数据口径：全页唯一的深底切口 ---------- */
.page-about .datum-band{
  background:var(--color-contrast-surface);
  color:var(--color-contrast-ink);
  padding:var(--space-6) var(--space-4);
  border-radius:var(--radius-md);
}
.page-about .datum-band .sec-head{
  margin-bottom:var(--space-3);
}
.page-about .datum-band h2{
  color:var(--color-contrast-ink);
}
.page-about .band-lead{
  font-size:var(--text-base);
  line-height:var(--leading-body);
  color:var(--about-dim);
  max-width:var(--measure);
  margin:0 0 var(--space-4);
}
.page-about .datum-grid{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  margin:0;
  padding:0;
  border-top:var(--border-thin) solid var(--color-contrast-line);
}
.page-about .datum{
  padding:var(--space-3) var(--space-2);
  border-bottom:var(--border-thin) solid var(--color-contrast-line);
  transition:background-color 160ms ease, box-shadow 160ms ease;
}
.page-about .datum:hover,
.page-about .datum:focus-within{
  background:var(--about-lift);
  box-shadow:inset var(--about-mark) 0 0 var(--color-contrast-accent);
}
.page-about .datum-num{
  display:block;
  font-family:var(--font-mono);
  font-size:var(--text-xl);
  line-height:1;
  color:var(--color-contrast-ink);
}
.page-about .datum-label{
  display:block;
  margin-top:var(--space-1);
  font-size:var(--text-xs);
  letter-spacing:0.14em;
  color:var(--color-contrast-accent);
}
.page-about .datum-note{
  margin:var(--space-2) 0 0;
  font-size:var(--text-sm);
  line-height:1.55;
  color:var(--about-dim);
}
.page-about .band-foot{
  margin:var(--space-4) 0 0;
  padding-top:var(--space-3);
  border-top:var(--about-rule-ink);
  font-size:var(--text-xs);
  letter-spacing:0.08em;
  color:var(--about-dim);
}

/* ---------- 检索入口 ---------- */
.page-about .route-list{
  list-style:none;
  display:grid;
  gap:var(--space-4);
  margin:var(--space-2) 0 0;
  padding:0;
}
.page-about .route-item{
  padding-top:var(--space-3);
  border-top:var(--border-thin) solid var(--color-line);
}
.page-about .route-item h3{
  margin:var(--space-2) 0 var(--space-2);
  font-family:var(--font-heading);
  font-weight:var(--weight-heading);
  font-size:var(--text-base);
  line-height:var(--leading-heading);
}
.page-about .route-item .about-prose{
  margin-bottom:0;
  font-size:var(--text-sm);
  line-height:1.6;
  color:var(--color-ink-soft);
}

/* ---------- 联系 ---------- */
.page-about .contact-list{
  display:grid;
  gap:0;
  margin:var(--space-4) 0;
  padding:0;
  border-top:var(--about-rule);
  border-bottom:var(--about-rule);
}
.page-about .contact-row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-1);
  padding:var(--space-3) 0;
}
.page-about .contact-row + .contact-row{
  border-top:var(--border-thin) solid var(--color-line);
}
.page-about .contact-row dt{
  font-size:var(--text-xs);
  letter-spacing:0.14em;
  color:var(--color-ink-muted);
}
.page-about .contact-row dd{
  margin:0;
  font-size:var(--text-base);
  line-height:1.5;
  color:var(--color-ink);
  overflow-wrap:anywhere;
}
.page-about .wide-fig{
  margin:var(--space-6) 0 0;
}
.page-about .back-top{
  margin:var(--space-6) 0 0;
  font-size:var(--text-sm);
}

/* ---------- 断点 ---------- */
@media (min-width:760px){
  .page-about .stage-list{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:var(--space-4) var(--space-6);
  }
  .page-about .route-list{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:var(--space-4) var(--space-6);
  }
  .page-about .contact-row{
    grid-template-columns:minmax(0,9rem) minmax(0,1fr);
    align-items:baseline;
    gap:var(--space-2);
  }
  .page-about .datum-band{
    padding:var(--space-8) var(--space-6);
  }
}

@media (min-width:900px){
  .page-about .about-h1{
    font-size:var(--text-3xl);
  }
  .page-about .masthead-grid{
    grid-template-columns:minmax(0,1.02fr) minmax(0,0.98fr);
    gap:var(--space-8);
    align-items:start;
  }
  .page-about .about-body{
    grid-template-columns:var(--about-rail) minmax(0,1fr);
    gap:var(--space-8);
    align-items:start;
    padding-bottom:var(--section-y);
  }
  .page-about .about-rail{
    position:sticky;
    top:var(--space-6);
  }
  .page-about .rail-list{
    display:grid;
    gap:var(--space-2);
  }
  .page-about .about-sec{
    padding-block:var(--space-8);
  }
  .page-about .datum-grid{
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
}