.page-about{
  --about-pad: clamp(42px,6vw,76px);
  --about-gap: clamp(20px,3.5vw,40px);
  --about-rail: 34px;
  background: var(--ink-800);
  color: var(--paper);
  padding-bottom: clamp(40px,6vw,80px);
}

.page-about .breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  padding-top: clamp(18px,3vw,30px);
  font-family: var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color: var(--rock);
}
.page-about .breadcrumb a{
  color: var(--rock);
  text-decoration:none;
  border-bottom:1px solid var(--ink-600);
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-about .breadcrumb a:hover,
.page-about .breadcrumb a:focus-visible{
  color: var(--signal);
  border-color: var(--signal);
}
.page-about .breadcrumb [aria-current="page"]{
  color: var(--paper);
}

/* ---------- 首屏 ---------- */
.page-about .about-hero{
  padding-block: clamp(26px,5vw,64px) clamp(30px,5vw,66px);
}
.page-about .hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(26px,4vw,48px);
  align-items:end;
}
.page-about h1{
  margin: 14px 0 0;
  font-family: var(--font-display);
  font-weight:900;
  font-size: clamp(32px,5.6vw,62px);
  line-height:1.06;
  letter-spacing:-.02em;
  max-width: 16ch;
  text-wrap: balance;
}
.page-about .hero-lede{
  margin-top: clamp(16px,2.4vw,24px);
  max-width: 38ch;
  font-size: clamp(15px,1.7vw,17px);
  line-height:1.85;
  color: var(--rock);
}

.page-about .stat-panel{
  margin:0;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:1px;
  background: var(--ink-600);
  border:2px solid var(--ink-600);
  box-shadow: var(--shadow-soft);
}
.page-about .stat{
  background: var(--ink-700);
  padding: clamp(14px,2.2vw,22px);
}
.page-about .stat dt{
  font-family: var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  color: var(--rock);
}
.page-about .stat dd{
  margin: 10px 0 0;
  font-family: var(--font-mono);
  font-size: clamp(22px,3vw,28px);
  letter-spacing:.02em;
  color: var(--paper);
}
.page-about .stat .unit{
  margin-left:6px;
  font-family: var(--font-body);
  font-size:12px;
  letter-spacing:.04em;
  color: var(--celadon);
}

/* ---------- 通用区块 ---------- */
.page-about .about-block{
  padding-block: var(--about-pad);
  border-top:1px solid var(--ink-600);
}
.page-about .block-head{
  max-width: 60ch;
}
.page-about .block-title{
  margin: 12px 0 0;
  font-family: var(--font-display);
  font-weight:900;
  font-size: clamp(25px,3.6vw,40px);
  line-height:1.12;
  letter-spacing:-.015em;
}
.page-about .block-lede{
  margin: clamp(14px,2vw,20px) 0 0;
  max-width: 42ch;
  font-size: clamp(15px,1.6vw,16px);
  line-height:1.85;
  color: var(--rock);
}

/* ---------- 时间线 ---------- */
.page-about .tl-index{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top: clamp(24px,3.5vw,36px);
}
.page-about .tl-index a{
  display:inline-block;
  padding:8px 12px;
  border:1px solid var(--ink-600);
  font-family: var(--font-mono);
  font-size:12px;
  letter-spacing:.03em;
  color: var(--rock);
  text-decoration:none;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}
.page-about .tl-index a:hover,
.page-about .tl-index a:focus-visible{
  color: var(--paper);
  border-color: var(--celadon);
}

.page-about .timeline{
  position:relative;
  margin: clamp(28px,4vw,44px) 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap: clamp(26px,3.6vw,40px);
}
.page-about .timeline::before{
  content:"";
  position:absolute;
  top:8px;
  bottom:8px;
  left:8px;
  width:1px;
  background: var(--ink-600);
}
.page-about .tl-item{
  position:relative;
  display:grid;
  gap:10px;
  padding-left: var(--about-rail);
  scroll-margin-top: 110px;
}
.page-about .tl-item::before{
  content:"";
  position:absolute;
  left:2px;
  top:7px;
  width:12px;
  height:12px;
  background: var(--rock);
  border:2px solid var(--ink-800);
  transition: background .24s var(--ease), box-shadow .24s var(--ease);
}
.page-about .tl-item:target::before{
  background: var(--celadon);
  box-shadow: 0 0 0 4px rgba(69,179,154,.16);
}
.page-about .tl-year{
  display:flex;
  align-items:baseline;
  gap:10px;
}
.page-about .tl-year-num{
  font-family: var(--font-mono);
  font-size: clamp(17px,2.2vw,22px);
  letter-spacing:.02em;
  color: var(--terracotta);
}
.page-about .tl-year-label{
  font-family: var(--font-mono);
  font-size:11px;
  letter-spacing:.1em;
  color: var(--rock);
}
.page-about .tl-body h3{
  margin:0;
  font-family: var(--font-display);
  font-weight:900;
  font-size: clamp(17px,2.1vw,21px);
  line-height:1.35;
  letter-spacing:-.01em;
}
.page-about .tl-body p{
  margin:10px 0 0;
  max-width: 46ch;
  font-size:15px;
  line-height:1.85;
  color: var(--rock);
}

/* ---------- 团队 ---------- */
.page-about .team-top{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(24px,3.5vw,40px);
  align-items:start;
}
.page-about .team-fig{
  margin:0;
}
.page-about .about-fig img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  border:2px solid var(--ink-600);
  background: var(--ink-700);
}
.page-about .about-fig .media-caption{
  display:block;
  margin-top:10px;
  font-family: var(--font-mono);
  font-size:12px;
  line-height:1.6;
  color: var(--rock);
}

.page-about .team-cards{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top: clamp(26px,3.6vw,40px);
}
.page-about .role-card{
  background: var(--ink-700);
  border:1px solid var(--ink-600);
  padding: clamp(16px,2.2vw,22px);
  transition: border-color .22s var(--ease);
}
.page-about .role-card:nth-child(1){ border-width:2px; }
.page-about .role-card:nth-child(3){ border-top:3px solid var(--terracotta); }
.page-about .role-card[open]{ border-color: var(--celadon); }
.page-about .role-card summary{
  display:grid;
  grid-template-columns: auto 1fr auto auto;
  align-items:baseline;
  gap:10px;
  list-style:none;
  cursor:pointer;
  min-height:44px;
}
.page-about .role-card summary::-webkit-details-marker{ display:none; }
.page-about .role-card summary::marker{ content:""; }
.page-about .role-card summary:focus-visible{
  outline:2px solid var(--celadon);
  outline-offset:4px;
}
.page-about .role-no{
  font-family: var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color: var(--terracotta);
}
.page-about .role-name{
  font-family: var(--font-display);
  font-weight:900;
  font-size:18px;
  letter-spacing:-.01em;
}
.page-about .role-count{
  font-family: var(--font-mono);
  font-size:12px;
  color: var(--rock);
}
.page-about .role-toggle{
  font-family: var(--font-mono);
  font-size:15px;
  line-height:1;
  color: var(--celadon);
}
.page-about .role-toggle::before{ content:"+"; }
.page-about .role-card[open] .role-toggle::before{ content:"–"; }
.page-about .role-list{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:9px;
}
.page-about .role-list li{
  position:relative;
  padding-left:18px;
  font-size:15px;
  line-height:1.7;
  color: var(--rock);
}
.page-about .role-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:8px;
  height:1px;
  background: var(--terracotta);
}

/* ---------- 维护机制 ---------- */
.page-about .maint-grid{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(26px,4vw,48px);
  align-items:start;
}
.page-about .maint-steps{
  margin: clamp(22px,3vw,32px) 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap: clamp(16px,2.4vw,22px);
  counter-reset: none;
}
.page-about .maint-steps li{
  display:grid;
  grid-template-columns: 34px minmax(0,1fr);
  gap:12px;
  padding-top:16px;
  border-top:1px solid var(--ink-600);
}
.page-about .step-no{
  font-family: var(--font-mono);
  font-size:12px;
  letter-spacing:.06em;
  color: var(--terracotta);
  padding-top:3px;
}
.page-about .maint-steps h3{
  margin:0;
  font-family: var(--font-display);
  font-weight:900;
  font-size:16px;
  letter-spacing:-.01em;
}
.page-about .maint-steps p{
  margin:8px 0 0;
  max-width: 44ch;
  font-size:15px;
  line-height:1.8;
  color: var(--rock);
}
.page-about .maint-note{
  margin: clamp(22px,3vw,30px) 0 0;
  padding-left:16px;
  border-left:2px solid var(--signal);
  max-width: 46ch;
  font-size:15px;
  line-height:1.85;
  color: var(--paper);
}
.page-about .maint-fig{
  margin:0;
}

/* ---------- 资质与合作 ---------- */
.page-about .creds-panel{
  background: var(--paper);
  color: var(--ink-800);
  padding: clamp(24px,4vw,52px);
  box-shadow: var(--shadow-hard);
}
.page-about .creds-panel .eyebrow{
  color: var(--terracotta);
}
.page-about .creds-panel .block-title{
  color: var(--ink-800);
  max-width: 20ch;
}
.page-about .creds-grid{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(18px,2.6vw,28px);
  margin-top: clamp(24px,3.4vw,36px);
}
.page-about .cred-item{
  padding-left:14px;
  border-left:2px solid var(--terracotta);
}
.page-about .cred-item h3{
  margin:0;
  font-family: var(--font-display);
  font-weight:900;
  font-size:16px;
  letter-spacing:-.01em;
  color: var(--ink-800);
}
.page-about .cred-item p{
  margin:8px 0 0;
  font-size:15px;
  line-height:1.8;
  color: var(--ink-600);
}
.page-about .creds-foot{
  margin: clamp(22px,3vw,32px) 0 0;
  padding-top:16px;
  border-top:1px solid var(--rock);
  font-family: var(--font-mono);
  font-size:12px;
  line-height:1.8;
  letter-spacing:.02em;
  color: var(--ink-600);
}

/* ---------- 运营地区 ---------- */
.page-about .region-fig{
  margin:0 0 clamp(24px,3.6vw,40px);
}
.page-about .region-cols{
  display:grid;
  grid-template-columns:1fr;
  gap: clamp(20px,3vw,32px);
  margin-top: clamp(24px,3.4vw,36px);
}
.page-about .region-col{
  background: var(--ink-700);
  border:1px solid var(--ink-600);
  border-left:3px solid var(--celadon);
  padding: clamp(18px,2.6vw,26px);
}
.page-about .region-col--alt{
  border-left-color: var(--signal);
}
.page-about .region-col h3{
  margin:0;
  font-family: var(--font-display);
  font-weight:900;
  font-size:17px;
  letter-spacing:-.01em;
}
.page-about .region-col p{
  margin:12px 0 0;
  max-width: 46ch;
  font-size:15px;
  line-height:1.85;
  color: var(--rock);
}
.page-about .region-col a{
  color: var(--paper);
  text-decoration:none;
  border-bottom:1px solid var(--signal);
}
.page-about .region-col a:hover,
.page-about .region-col a:focus-visible{
  color: var(--signal);
}

/* ---------- 下一步 ---------- */
.page-about .next-links{
  margin: clamp(24px,3.4vw,36px) 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:0;
}
.page-about .next-links li{
  border-top:1px solid var(--ink-600);
}
.page-about .next-links a{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap:6px;
  padding: clamp(16px,2.4vw,22px) 0;
  text-decoration:none;
  color: var(--paper);
  transition: color .2s var(--ease);
}
.page-about .next-links a::after{
  content:"→";
  font-family: var(--font-mono);
  font-size:14px;
  color: var(--rock);
  transition: color .2s var(--ease);
}
.page-about .next-links a:hover,
.page-about .next-links a:focus-visible{
  color: var(--signal);
}
.page-about .next-links a:hover::after,
.page-about .next-links a:focus-visible::after{
  color: var(--signal);
}
.page-about .next-name{
  font-family: var(--font-display);
  font-weight:900;
  font-size:18px;
  letter-spacing:-.01em;
}
.page-about .next-desc{
  font-size:14px;
  line-height:1.7;
  color: var(--rock);
}

/* ---------- 断点 ---------- */
@media (min-width: 640px){
  .page-about .creds-grid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .page-about .region-cols{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .page-about .next-links a{
    grid-template-columns: minmax(0,auto) minmax(0,1fr) auto;
    align-items:baseline;
    gap:20px;
  }
}

@media (min-width: 760px){
  .page-about .team-cards{
    grid-template-columns: 1.12fr 1fr .88fr;
  }
  .page-about .tl-item{
    grid-template-columns: 132px minmax(0,1fr);
    gap: clamp(16px,3vw,32px);
    align-items:start;
  }
  .page-about .tl-year{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
}

@media (min-width: 900px){
  .page-about .hero-grid{
    grid-template-columns: minmax(0,7fr) minmax(0,4fr);
    gap: clamp(32px,5vw,72px);
  }
  .page-about .stat-panel{
    transform: translateY(18px);
  }
  .page-about .team-top{
    grid-template-columns: minmax(0,8fr) minmax(0,4fr);
    gap: clamp(28px,4vw,56px);
  }
  .page-about .maint-grid{
    grid-template-columns: minmax(0,7fr) minmax(0,5fr);
  }
  .page-about .maint-fig{
    position:sticky;
    top:110px;
  }
}

@media (prefers-reduced-motion: reduce){
  .page-about .stat-panel{ transform:none; }
  .page-about *{
    transition-duration:.01ms !important;
  }
}