.page-about{
  --about-hair:rgba(18,33,30,.14);
  background:var(--paper);
  color:var(--t-paper);
  overflow-x:hidden;
}

/* ---------- 开场 ---------- */
.page-about .open{
  position:relative;
  overflow:hidden;
  background:var(--ink);
  color:var(--t-ink);
  padding:clamp(20px,3vw,38px) 0 clamp(44px,7vw,96px);
  border-bottom:1px solid var(--line-ink);
}
.page-about .open::after{
  content:"";
  position:absolute;
  right:-140px;
  top:-140px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle at center,rgba(56,242,214,.20),rgba(30,91,255,.10) 46%,transparent 72%);
  pointer-events:none;
}
.page-about .open__grid{
  position:relative;
  z-index:1;
  display:grid;
  gap:22px;
}
.page-about .open__rail{
  display:flex;
  align-items:center;
  gap:14px;
  overflow-x:auto;
  padding:0 0 14px;
  border-bottom:1px solid var(--line-ink);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:rgba(234,247,244,.52);
}
.page-about .open__yr{
  position:relative;
  flex:0 0 auto;
  padding-left:12px;
}
.page-about .open__yr::before{
  content:"";
  position:absolute;
  left:0;
  top:7px;
  width:6px;
  height:1px;
  background:var(--cyan);
}
.page-about .open__yr--now{
  color:var(--cyan);
  border:1px solid rgba(56,242,214,.55);
  padding:2px 8px 2px 8px;
}
.page-about .open__yr--now::before{display:none;}

.page-about .open__main{min-width:0;}
.page-about .open__kicker{
  margin:22px 0 0;
  font-size:12px;
  letter-spacing:.18em;
  color:var(--cyan);
}
.page-about .open__title{
  margin:14px 0 0;
  max-width:16ch;
  font-size:clamp(36px,7.4vw,92px);
  font-weight:900;
  line-height:.98;
  letter-spacing:-.03em;
}
.page-about .open__title em{
  font-style:normal;
  color:var(--cyan);
}
.page-about .open__lead{
  margin:22px 0 0;
  max-width:56ch;
  font-size:clamp(16px,1.6vw,18px);
  line-height:1.85;
  color:rgba(234,247,244,.84);
}
.page-about .open__meta{
  display:flex;
  flex-wrap:wrap;
  gap:12px 26px;
  margin:28px 0 0;
  padding:18px 0 0;
  border-top:1px solid var(--line-ink);
  list-style:none;
  font-size:14px;
  color:rgba(234,247,244,.72);
}
.page-about .open__meta .mono{
  margin-right:6px;
  font-size:15px;
  color:var(--cyan);
}

/* ---------- 章节骨架 ---------- */
.page-about .chapter{
  padding:clamp(44px,7vw,104px) 0;
  border-top:1px solid var(--line-c);
}
.page-about .chapter:first-of-type{border-top:0;}
.page-about .chapter__inner{
  display:grid;
  gap:16px;
}
.page-about .chapter__no{
  margin:0;
  font-family:var(--font-mono);
  font-size:clamp(26px,3.6vw,52px);
  line-height:1;
  letter-spacing:-.02em;
  color:var(--blue);
}
.page-about .chapter__body{min-width:0;}
.page-about .chapter__title{
  margin:0;
  max-width:22ch;
  font-size:clamp(24px,3.6vw,42px);
  font-weight:800;
  line-height:1.16;
  letter-spacing:-.02em;
}
.page-about .chapter__desc{
  margin:14px 0 0;
  max-width:58ch;
  font-size:16px;
  line-height:1.85;
  color:var(--muted);
}
.page-about .chapter__more{
  margin:26px 0 0;
  font-size:15px;
}
.page-about .chapter__aside{display:none;}

/* ---------- 三条产品线 ---------- */
.page-about .lines{
  display:grid;
  gap:14px;
  margin-top:30px;
}
.page-about .pline{
  background:var(--paper-2);
  border-top:3px solid var(--blue);
  padding:20px 18px 22px;
}
.page-about .pline:nth-child(2){border-top-color:var(--clay);}
.page-about .pline:nth-child(3){border-top-color:var(--cyan);}
.page-about .pline__who{
  margin:0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--muted);
}
.page-about .pline__name{
  margin:10px 0 8px;
  font-size:23px;
  font-weight:800;
  letter-spacing:-.01em;
}
.page-about .pline__text{
  margin:0;
  font-size:15.5px;
  line-height:1.8;
}

/* ---------- 历程时间轴 ---------- */
.page-about .tl{
  position:relative;
  margin:32px 0 0;
  padding:0;
  list-style:none;
}
.page-about .tl::before{
  content:"";
  position:absolute;
  left:5px;
  top:8px;
  bottom:16px;
  width:1px;
  background:linear-gradient(180deg,var(--blue),var(--cyan));
}
.page-about .tl__item{
  position:relative;
  padding:0 0 30px 32px;
}
.page-about .tl__item::before{
  content:"";
  position:absolute;
  left:1px;
  top:7px;
  width:9px;
  height:9px;
  background:var(--paper);
  border:1px solid var(--blue);
  transition:background .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease);
}
.page-about .tl__item:hover::before,
.page-about .tl__item:focus-within::before{
  background:var(--cyan);
  border-color:var(--cyan);
  transform:scale(1.3);
}
.page-about .tl__item:last-child{padding-bottom:0;}
.page-about .tl__year{
  margin:0;
  font-size:13px;
  letter-spacing:.12em;
  color:var(--blue);
}
.page-about .tl__title{
  margin:6px 0 6px;
  font-size:19px;
  font-weight:800;
}
.page-about .tl__text{
  margin:0;
  max-width:54ch;
  font-size:15px;
  line-height:1.8;
  color:var(--muted);
}
.page-about .tl-figure{margin:34px 0 0;}

/* ---------- 团队 ---------- */
.page-about .crew{
  display:grid;
  gap:18px;
  margin-top:30px;
}
.page-about .crew__item{
  border-left:2px solid var(--blue);
  padding-left:14px;
}
.page-about .crew__num{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(30px,4vw,42px);
  line-height:1;
  color:var(--t-paper);
}
.page-about .crew__label{
  margin:8px 0 12px;
  font-size:14px;
  color:var(--muted);
}
.page-about .crew__bar{
  position:relative;
  display:block;
  height:3px;
  background:var(--paper-2);
}
.page-about .crew__bar::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  height:100%;
  background:var(--cyan);
  width:var(--w,50%);
}
.page-about .crew__item:nth-child(1) .crew__bar::after{width:54%;}
.page-about .crew__item:nth-child(2) .crew__bar::after{width:25%;}
.page-about .crew__item:nth-child(3) .crew__bar::after{width:13%;}
.page-about .crew__item:nth-child(4) .crew__bar::after{width:8%;}

.page-about .team-split{
  display:grid;
  gap:24px;
  margin-top:34px;
}
.page-about .regions{
  display:grid;
  gap:1px;
  background:var(--line-c);
  border:1px solid var(--line-c);
}
.page-about .region{
  background:var(--paper);
  padding:20px 18px 22px;
  transition:background .18s var(--ease);
}
.page-about .region:hover{background:var(--paper-2);}
.page-about .region__coord{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.12em;
  color:var(--clay);
}
.page-about .region__name{
  margin:8px 0 6px;
  font-size:21px;
  font-weight:800;
}
.page-about .region__duty{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:var(--muted);
}
.page-about .regions-figure{margin:0;}

/* ---------- 合作生态 ---------- */
.page-about .eco{
  margin-top:30px;
  border-top:1px solid var(--line-c);
}
.page-about .eco .acc__item{
  position:relative;
  border-bottom:1px solid var(--line-c);
}
.page-about .eco .acc__btn{
  display:flex;
  align-items:baseline;
  gap:10px;
  width:100%;
  padding:18px 30px 18px 0;
  border:0;
  background:none;
  color:inherit;
  font-family:inherit;
  font-size:17px;
  font-weight:700;
  text-align:left;
  cursor:pointer;
}
.page-about .eco .acc__btn:focus-visible{
  outline:2px solid var(--blue);
  outline-offset:3px;
}
.page-about .eco .acc__btn .mono{
  margin-right:6px;
  color:var(--blue);
  font-weight:400;
}
.page-about .eco .acc__sign{
  position:absolute;
  right:0;
  top:20px;
  color:var(--blue);
}
.page-about .eco .acc__body p{
  margin:0 0 18px;
  max-width:58ch;
  font-size:15px;
  line-height:1.8;
  color:var(--muted);
}

/* ---------- 资质档案 ---------- */
.page-about .creds{
  display:grid;
  gap:12px;
  margin-top:30px;
}
.page-about .cred{
  display:flex;
  flex-direction:column;
  gap:10px;
  background:var(--paper-2);
  border:1px solid rgba(201,113,75,.38);
  padding:18px 18px 20px;
  transition:transform .2s var(--ease),border-color .2s var(--ease);
}
.page-about .cred:hover{
  transform:translateY(-3px);
  border-color:var(--clay);
}
.page-about .cred__num{
  margin:0;
  font-family:var(--font-mono);
  font-size:clamp(23px,3vw,30px);
  line-height:1.1;
  color:var(--t-paper);
}
.page-about .cred__text{
  margin:0;
  font-size:14.5px;
  line-height:1.7;
  color:var(--muted);
}
.page-about .cred-figure{margin:30px 0 0;}

/* ---------- 选择理由 ---------- */
.page-about .why{
  display:grid;
  margin-top:30px;
  border-top:1px solid var(--line-c);
}
.page-about .why__item{
  padding:20px 0 22px;
  border-bottom:1px solid var(--line-c);
}
.page-about .why__num{
  margin:0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--clay);
}
.page-about .why__title{
  margin:8px 0;
  font-size:19px;
  font-weight:800;
}
.page-about .why__text{
  margin:0;
  max-width:48ch;
  font-size:15px;
  line-height:1.8;
  color:var(--muted);
}

/* ---------- 收口 ---------- */
.page-about .outro{
  background:var(--ink);
  color:var(--t-ink);
  padding:clamp(40px,6vw,86px) 0;
  border-top:1px solid var(--line-ink);
}
.page-about .outro__title{
  margin:0;
  max-width:24ch;
  font-size:clamp(24px,3.6vw,40px);
  font-weight:800;
  line-height:1.2;
  letter-spacing:-.02em;
}
.page-about .outro__text{
  margin:14px 0 0;
  max-width:54ch;
  font-size:16px;
  line-height:1.85;
  color:rgba(234,247,244,.8);
}
.page-about .outro__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}
.page-about .outro .btn--ghost{
  border-color:rgba(234,247,244,.42);
  color:var(--t-ink);
}
.page-about .outro__note{
  margin:22px 0 0;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:rgba(234,247,244,.56);
}

/* ---------- 图片 ---------- */
.page-about .media{
  max-width:100%;
  overflow:hidden;
}
.page-about .media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}
.page-about .media--placeholder{
  background:linear-gradient(135deg,var(--paper-2),var(--paper));
}

/* ---------- 断点 ---------- */
@media (min-width:620px){
  .page-about .crew{grid-template-columns:repeat(2,minmax(0,1fr));}
  .page-about .regions{grid-template-columns:1fr 1fr;}
  .page-about .creds{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (min-width:840px){
  .page-about .lines{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
  }
  .page-about .why{grid-template-columns:1fr 1fr;column-gap:48px;}
}

@media (min-width:900px){
  .page-about .open__grid{
    grid-template-columns:76px minmax(0,1fr);
    gap:clamp(28px,5vw,72px);
  }
  .page-about .open__rail{
    flex-direction:column;
    align-items:flex-start;
    gap:20px;
    overflow:visible;
    padding:4px 0 0 16px;
    border-bottom:0;
    border-left:1px solid var(--line-ink);
  }
  .page-about .open__yr{padding-left:0;}
  .page-about .open__yr::before{
    left:-21px;
    top:7px;
    width:9px;
  }
  .page-about .open__yr--now{padding:2px 6px;}

  .page-about .chapter__inner{
    grid-template-columns:86px minmax(0,1fr);
    gap:clamp(24px,4vw,64px);
    align-items:start;
  }
  .page-about .team-split{
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    gap:32px;
    align-items:start;
  }
}

@media (min-width:1000px){
  .page-about .crew{grid-template-columns:repeat(4,minmax(0,1fr));}
}

@media (min-width:1080px){
  .page-about .creds{grid-template-columns:repeat(3,minmax(0,1fr));}
}

@media (min-width:1200px){
  .page-about .chapter--anno .chapter__inner{
    grid-template-columns:86px minmax(0,1fr) 28px;
  }
  .page-about .chapter__aside{
    display:block;
    align-self:start;
    justify-self:end;
    writing-mode:vertical-rl;
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:.26em;
    color:var(--stone);
  }
}

@media (prefers-reduced-motion:reduce){
  .page-about .tl__item::before,
  .page-about .cred,
  .page-about .region{
    transition:none;
  }
  .page-about .tl__item:hover::before,
  .page-about .cred:hover{
    transform:none;
  }
}

.page-about {
  --w: 1rem;
}