.page-about{
  --about-cut:18px;
  --about-line:rgba(36,26,20,.14);
  --about-line-gold:rgba(200,162,74,.45);
  background:var(--cream);
  color:var(--brown-black);
  font-family:var(--font-body);
}

/* ---------- 框景首屏 ---------- */
.page-about .about-hero{
  position:relative;
  isolation:isolate;
  padding:clamp(22px,4vw,40px) 0 0;
  background:
    radial-gradient(115% 85% at 84% 0%,rgba(31,87,72,.68),transparent 62%),
    var(--ink-green);
  color:var(--cream);
}
.page-about .about-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background-image:
    linear-gradient(rgba(200,162,74,.09) 1px,transparent 1px),
    linear-gradient(90deg,rgba(200,162,74,.09) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 88%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,.85),transparent 88%);
  pointer-events:none;
}
.page-about .about-hero__inner{
  display:grid;
  gap:clamp(22px,3.6vw,40px);
  align-items:center;
  padding-bottom:clamp(24px,3.6vw,40px);
}
.page-about .about-hero .crumbs ol{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  list-style:none;
  margin:0;
  padding:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
}
.page-about .about-hero .crumbs li{
  display:flex;
  align-items:center;
  gap:6px;
  color:rgba(246,240,227,.55);
}
.page-about .about-hero .crumbs li+li::before{
  content:"/";
  color:rgba(200,162,74,.6);
}
.page-about .about-hero .crumbs a{
  color:rgba(246,240,227,.72);
  text-decoration:none;
}
.page-about .about-hero .crumbs a:hover{
  color:var(--pale-gold);
}
.page-about .about-hero .crumbs [aria-current="page"]{
  color:var(--pale-gold);
}
.page-about .about-hero .kicker{
  margin:14px 0 0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:rgba(231,212,164,.78);
}
.page-about .about-hero h1{
  margin:.42em 0 .4em;
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(30px,6.2vw,58px);
  line-height:1.08;
  letter-spacing:-.022em;
  color:var(--cream);
}
.page-about .about-hero__lede{
  max-width:46ch;
  margin:0;
  font-size:clamp(15px,1.6vw,17px);
  line-height:1.85;
  color:rgba(246,240,227,.82);
}
.page-about .about-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(18px,3vw,28px);
}
.page-about .about-hero .btn--ghost{
  border:1px solid rgba(200,162,74,.5);
  color:var(--pale-gold);
  background:transparent;
}
.page-about .about-hero .btn--ghost:hover{
  border-color:var(--gold);
  color:var(--cream);
}

.page-about .about-hero__frame{
  position:relative;
  margin:0;
  padding:10px;
  background:linear-gradient(155deg,rgba(200,162,74,.55),rgba(47,212,196,.18) 55%,rgba(200,162,74,.14));
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--about-cut)),calc(100% - var(--about-cut)) 100%,0 100%);
}
.page-about .about-hero__frame::before{
  content:"档案 AB—06";
  position:absolute;
  top:10px;
  left:10px;
  z-index:2;
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:.12em;
  padding:3px 8px;
  background:var(--gold);
  color:var(--ink-green);
}
.page-about .about-hero__frame img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  filter:saturate(.85) contrast(1.06);
}
.page-about .about-hero__frame .media__cap{
  position:absolute;
  left:18px;
  bottom:18px;
  margin:0;
  padding:4px 10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color:var(--pale-gold);
  background:rgba(10,36,30,.85);
  border-left:2px solid var(--cyan);
}

.page-about .about-stats{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin:0 0 clamp(20px,3.2vw,32px);
  padding:0;
  background:rgba(232,226,214,.18);
  border-top:1px solid rgba(232,226,214,.18);
}
.page-about .about-stats li{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:14px clamp(10px,2vw,18px);
  background:var(--ink-green);
}
.page-about .about-stats__num{
  font-family:var(--font-mono);
  font-size:clamp(22px,3.4vw,30px);
  line-height:1.1;
  letter-spacing:.02em;
  color:var(--gold);
}
.page-about .about-stats__label{
  font-size:12px;
  letter-spacing:.06em;
  color:rgba(246,240,227,.7);
}
.page-about .about-hero__scale{
  height:8px;
  border-top:1px solid rgba(200,162,74,.35);
  background-image:repeating-linear-gradient(90deg,rgba(200,162,74,.55) 0 1px,transparent 1px 28px);
}

/* ---------- 左侧索引 + 右侧章节 ---------- */
.page-about .about-body{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(24px,4vw,52px);
  padding-block:clamp(32px,6vw,76px);
}
.page-about .about-index{
  padding-top:14px;
  border-top:2px solid var(--brown-black);
}
.page-about .toc__title{
  margin:0;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--moss);
}
.page-about .about-toc__list{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:4px 14px;
  margin:10px 0 0;
  padding:0;
}
.page-about .about-toc__list li{
  min-width:0;
}
.page-about .toc__link{
  display:flex;
  align-items:baseline;
  gap:8px;
  padding:6px 2px;
  font-size:13.5px;
  line-height:1.4;
  color:rgba(36,26,20,.68);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.page-about .toc__link:hover,
.page-about .toc__link:focus-visible{
  color:var(--brown-black);
  border-bottom-color:var(--gold);
}
.page-about .toc__link[data-active]{
  color:var(--ink-green);
  font-weight:600;
  border-bottom-color:var(--gold);
}
.page-about .about-toc__num{
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--gold);
}
.page-about .about-index__foot{
  margin-top:20px;
  padding-top:14px;
  border-top:1px dashed var(--about-line);
  font-size:13px;
  line-height:1.75;
  color:rgba(36,26,20,.72);
}
.page-about .about-index__foot p{
  margin:0 0 4px;
}
.page-about .about-index__kicker{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--moss);
}

/* ---------- 章节 ---------- */
.page-about .about-chapters{
  display:flex;
  flex-direction:column;
  gap:clamp(34px,5vw,64px);
  min-width:0;
}
.page-about .chapter{
  min-width:0;
}
.page-about .chapter__head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:clamp(12px,2vw,20px);
  align-items:start;
  padding-bottom:14px;
  margin-bottom:clamp(16px,2.4vw,24px);
  border-bottom:1px solid var(--about-line);
}
.page-about .chapter__num{
  font-family:var(--font-mono);
  font-size:clamp(26px,4.4vw,38px);
  line-height:.9;
  letter-spacing:-.02em;
  color:var(--gold);
}
.page-about .chapter__titles{
  min-width:0;
}
.page-about .chapter__tag{
  margin:0 0 4px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--moss);
}
.page-about .chapter h2{
  margin:0;
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(21px,3.2vw,30px);
  line-height:1.26;
  letter-spacing:-.012em;
  color:var(--brown-black);
}
.page-about .chapter__body{
  max-width:68ch;
  font-size:15.5px;
  line-height:1.85;
  color:rgba(36,26,20,.86);
}
.page-about .chapter__body p{
  margin:0 0 1em;
}
.page-about .chapter__body p:last-child{
  margin-bottom:0;
}
.page-about .chapter--alt{
  padding:clamp(18px,3vw,28px);
  background:var(--surface-alt);
  border-left:3px solid var(--gold);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--about-cut)),calc(100% - var(--about-cut)) 100%,0 100%);
}
.page-about .chapter--alt .chapter__head{
  border-bottom-color:rgba(36,26,20,.2);
}

.page-about .about-note{
  display:grid;
  gap:4px;
  margin-top:18px;
  padding:12px 14px;
  background:var(--surface-alt);
  border-left:3px solid var(--cyan);
  font-size:13.5px;
  line-height:1.72;
  color:rgba(36,26,20,.8);
}
.page-about .about-note p{
  margin:0;
}
.page-about .about-note__k{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--moss);
}

.page-about .about-list{
  list-style:none;
  display:grid;
  gap:10px;
  margin:16px 0;
  padding:0;
}
.page-about .about-list li{
  position:relative;
  padding-left:18px;
  line-height:1.8;
}
.page-about .about-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:7px;
  height:7px;
  background:var(--gold);
  transform:rotate(45deg);
}
.page-about .about-list strong{
  color:var(--ink-green);
  font-weight:700;
}

/* ---------- 团队三列窄卡 ---------- */
.page-about .team-grid{
  display:grid;
  gap:12px;
  margin:18px 0;
}
.page-about .team-card{
  padding:16px 14px 18px;
  background:var(--cream);
  border:1px solid var(--about-line);
  border-top:3px solid var(--deep-green);
  transition:border-color .22s var(--ease),box-shadow .22s var(--ease);
}
.page-about .team-card:hover{
  border-top-color:var(--gold);
  box-shadow:0 6px 18px rgba(10,36,30,.08);
}
.page-about .team-card__num{
  margin:0 0 8px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--moss);
}
.page-about .team-card h3{
  margin:0 0 8px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:16px;
  line-height:1.35;
  color:var(--ink-green);
}
.page-about .team-card p:last-child{
  margin:0;
  font-size:13.5px;
  line-height:1.75;
  color:rgba(36,26,20,.78);
}

/* ---------- 版本时间轴 ---------- */
.page-about .timeline{
  position:relative;
  list-style:none;
  margin:18px 0 0;
  padding:0 0 0 24px;
}
.page-about .timeline::before{
  content:"";
  position:absolute;
  left:5px;
  top:8px;
  bottom:10px;
  width:2px;
  background:linear-gradient(180deg,var(--gold),rgba(200,162,74,.12));
}
.page-about .timeline__item{
  position:relative;
  padding-bottom:22px;
}
.page-about .timeline__item:last-child{
  padding-bottom:0;
}
.page-about .timeline__item::before{
  content:"";
  position:absolute;
  left:-23px;
  top:6px;
  width:9px;
  height:9px;
  background:var(--gold);
  transform:rotate(45deg);
}
.page-about .timeline__ver{
  margin:0 0 2px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--moss);
}
.page-about .timeline__item h3{
  margin:0 0 4px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:16px;
  line-height:1.4;
  color:var(--brown-black);
}
.page-about .timeline__item p{
  margin:0;
  font-size:14px;
  line-height:1.75;
  color:rgba(36,26,20,.78);
  transition:color .2s var(--ease);
}
.page-about .timeline__item:hover h3,
.page-about .timeline__item:focus-within h3{
  color:var(--ink-green);
}
.page-about .timeline__item--now{
  padding:12px 14px 12px 0;
  border-left:2px solid var(--cyan);
  margin-left:-2px;
}
.page-about .timeline__item--now .timeline__ver{
  color:var(--ember);
}
.page-about .timeline__item--now::before{
  left:-24px;
  background:var(--cyan);
}

/* ---------- 图片框 ---------- */
.page-about .about-figure{
  margin:clamp(18px,3vw,26px) 0 0;
  padding:8px;
  background:var(--warm-gray);
  border:1px solid var(--about-line);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--about-cut)),calc(100% - var(--about-cut)) 100%,0 100%);
}
.page-about .about-figure img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:cover;
}
.page-about .about-figure--wide img{
  aspect-ratio:3/2;
}
.page-about .about-figure .media__cap{
  display:block;
  padding:9px 4px 2px;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.04em;
  color:rgba(36,26,20,.62);
}

/* ---------- 合作步骤 ---------- */
.page-about .about-steps{
  list-style:none;
  display:grid;
  gap:10px;
  margin:18px 0 0;
  padding:0;
}
.page-about .about-steps li{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:10px;
  align-items:start;
  font-size:14px;
  line-height:1.72;
  color:rgba(36,26,20,.82);
}
.page-about .about-steps__n{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--ink-green);
  background:var(--pale-gold);
  clip-path:polygon(0 0,100% 0,100% 68%,68% 100%,0 100%);
}

/* ---------- 联系面板 ---------- */
.page-about .chapter--contact .chapter__head{
  border-bottom-color:var(--about-line-gold);
}
.page-about .about-contact{
  display:grid;
  gap:clamp(18px,3vw,30px);
  padding:clamp(20px,3.4vw,34px);
  color:var(--cream);
}
.page-about .about-contact__copy{
  min-width:0;
}
.page-about .about-contact__copy>p{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:rgba(246,240,227,.85);
}
.page-about .about-contact__list{
  list-style:none;
  display:grid;
  gap:1px;
  margin:16px 0 0;
  padding:0;
  background:rgba(232,226,214,.14);
  border:1px solid rgba(232,226,214,.14);
}
.page-about .about-contact__list li{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:10px;
  padding:10px 12px;
  background:var(--ink-green);
  font-size:14px;
  line-height:1.6;
  word-break:break-word;
  overflow-wrap:anywhere;
  color:rgba(246,240,227,.92);
}
.page-about .about-contact__k{
  margin:0 0 .6em;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--pale-gold);
}
.page-about .about-contact__list .about-contact__k{
  margin:2px 0 0;
}
.page-about .about-contact__actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.page-about .about-contact .btn--ghost{
  border:1px solid rgba(232,226,214,.32);
  color:var(--pale-gold);
  background:transparent;
}
.page-about .about-contact .btn--ghost:hover{
  border-color:var(--cyan);
  color:var(--cyan);
}
.page-about .about-contact__meta{
  padding-top:14px;
  border-top:1px solid rgba(232,226,214,.2);
  font-size:13.5px;
  line-height:1.8;
  color:rgba(246,240,227,.75);
}
.page-about .about-contact__meta p:not(.about-contact__k){
  margin:0 0 .9em;
}
.page-about .about-contact__meta p:last-child{
  margin-bottom:0;
}
.page-about .rule--gold{
  height:0;
  margin:16px 0;
  border:0;
  border-top:1px solid rgba(200,162,74,.55);
}

/* ---------- 桌面版 ---------- */
@media (min-width:620px){
  .page-about .team-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (min-width:700px){
  .page-about .about-stats{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}
@media (min-width:760px){
  .page-about .about-contact{
    grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);
  }
  .page-about .about-contact__meta{
    padding:0 0 0 22px;
    border-top:0;
    border-left:1px solid rgba(232,226,214,.2);
  }
}
@media (min-width:900px){
  .page-about .about-hero__inner{
    grid-template-columns:minmax(0,1.02fr) minmax(0,.82fr);
  }
}
@media (min-width:960px){
  .page-about .about-body{
    grid-template-columns:220px minmax(0,1fr);
    align-items:start;
  }
  .page-about .about-index{
    position:sticky;
    top:calc(var(--header-h) + 24px);
  }
  .page-about .about-toc__list{
    flex-direction:column;
    flex-wrap:nowrap;
    gap:2px;
  }
  .page-about .toc__link{
    width:100%;
  }
  .page-about .chapter__head{
    gap:22px;
  }
}
@media (min-width:1180px){
  .page-about .about-body{
    grid-template-columns:252px minmax(0,1fr);
    gap:64px;
  }
  .page-about .chapter--alt{
    padding:32px 36px;
  }
}
@media (prefers-reduced-motion:reduce){
  .page-about .toc__link,
  .page-about .team-card,
  .page-about .timeline__item p{
    transition:none;
  }
  .page-about .team-card:hover{
    box-shadow:none;
  }
}
