.page-about{
  --about-rail:96px;
  --about-gap:clamp(18px,3vw,34px);
  --about-panel:rgba(13,43,74,.72);
  display:block;
  overflow-x:hidden;
  padding-bottom:clamp(30px,6vw,72px);
}

.page-about .about-context{padding:clamp(14px,2.4vw,24px) 0 0;}

/* ---------- 首屏 ---------- */
.page-about .about-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(18px,3.6vw,40px) 0 clamp(28px,5vw,56px);
}
.page-about .about-hero__glow{
  position:absolute;
  right:-14%;
  bottom:8%;
  width:min(540px,72vw);
  height:min(540px,72vw);
  border-radius:50%;
  background:radial-gradient(circle at center, rgba(61,242,210,.16), rgba(61,242,210,0) 68%);
  pointer-events:none;
}
.page-about .about-hero__inner{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:var(--about-gap);
}
.page-about .about-hero__rail{display:none;}
.page-about .about-hero__eyebrow{
  margin:0 0 14px;
  font-size:13px;
  letter-spacing:.2em;
  color:var(--cyan);
}
.page-about .about-hero h1{
  margin:0;
  font-family:var(--font-head);
  font-size:clamp(30px,7vw,58px);
  font-weight:900;
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--mist);
}
.page-about .about-hero__lead{
  margin:18px 0 0;
  max-width:64ch;
  font-size:clamp(15px,1.5vw,17px);
  line-height:1.85;
  color:var(--mist-soft);
}
.page-about .about-stats{
  list-style:none;
  margin:clamp(24px,4vw,38px) 0 0;
  padding:clamp(18px,3vw,26px) 0 0;
  border-top:1px solid var(--cyan-line);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px 14px;
}
.page-about .about-stat{display:flex;flex-direction:column;gap:6px;}
.page-about .about-stat__num{
  font-family:var(--font-num);
  font-size:clamp(26px,5vw,38px);
  font-weight:700;
  line-height:1;
  color:var(--orange);
}
.page-about .about-stat:nth-child(2) .about-stat__num{color:var(--cyan);}
.page-about .about-stat:nth-child(3) .about-stat__num{color:var(--mist);}
.page-about .about-stat:nth-child(4) .about-stat__num{color:var(--amber);}
.page-about .about-stat__label{
  font-size:13px;
  line-height:1.6;
  color:var(--steel);
}

/* ---------- 章节索引 ---------- */
.page-about .about-index{
  border-top:1px solid var(--cyan-line);
  border-bottom:1px solid var(--steel-line);
  background:rgba(3,16,28,.55);
}
.page-about .about-index__inner{
  display:flex;
  gap:8px;
  padding:10px 0;
  overflow-x:auto;
  scrollbar-width:none;
}
.page-about .about-index__inner::-webkit-scrollbar{display:none;}
.page-about .about-index__link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 15px;
  border:1px solid var(--steel-line);
  border-radius:var(--radius-pill);
  font-size:13px;
  color:var(--mist-soft);
  text-decoration:none;
  transition:border-color .25s var(--ease), color .25s var(--ease), background-color .25s var(--ease);
}
.page-about .about-index__link .num{
  font-family:var(--font-num);
  font-size:12px;
  letter-spacing:.06em;
  color:var(--cyan);
}
.page-about .about-index__link:hover,
.page-about .about-index__link:focus-visible{
  border-color:var(--cyan);
  background:var(--cyan-soft);
  color:var(--mist);
}

/* ---------- 区块通用 ---------- */
.page-about .about-section{
  padding:clamp(38px,6.5vw,84px) 0;
  border-top:1px solid var(--steel-line);
}
.page-about .about-section:first-of-type{border-top:0;}
.page-about .section-head{margin-bottom:clamp(20px,3.6vw,36px);}
.page-about .section-head__title{
  font-family:var(--font-head);
  font-size:clamp(24px,4.2vw,34px);
  font-weight:800;
  line-height:1.16;
  letter-spacing:-.01em;
  color:var(--mist);
}
.page-about .section-head__meta{
  margin:10px 0 0;
  max-width:52ch;
  font-size:14px;
  line-height:1.75;
  color:var(--steel);
}
.page-about .about-figure{
  margin:0 0 clamp(22px,4vw,38px);
  border:1px solid var(--steel-line);
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:var(--abyss-2);
}
.page-about .about-figure--offset{margin:clamp(26px,4.6vw,44px) 0 0;}
.page-about .about-figure .media__img,
.page-about .about-calendar__figure .media__img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
}

/* ---------- 分工切换 ---------- */
.page-about .about-tabs{
  display:flex;
  gap:8px;
  margin-bottom:clamp(16px,2.6vw,24px);
  padding-bottom:4px;
  overflow-x:auto;
  scrollbar-width:none;
}
.page-about .about-tabs::-webkit-scrollbar{display:none;}
.page-about .tabs__btn{
  flex:0 0 auto;
  padding:10px 18px;
  border:1px solid var(--steel-line);
  border-radius:var(--radius-pill);
  background:transparent;
  color:var(--mist-soft);
  font-family:inherit;
  font-size:14px;
  line-height:1.4;
  cursor:pointer;
  transition:border-color .25s var(--ease), color .25s var(--ease), background-color .25s var(--ease);
}
.page-about .tabs__btn:hover{border-color:var(--cyan-line);color:var(--mist);}
.page-about .tabs__btn[aria-selected="true"]{
  border-color:var(--cyan);
  background:var(--cyan-soft);
  color:var(--mist);
}
.page-about .tabs__btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}
.page-about .tab-panel[hidden]{display:none;}
.page-about .about-role{
  padding:clamp(20px,3.4vw,34px);
  border:1px solid var(--steel-line);
  border-radius:var(--radius-lg);
  background:linear-gradient(160deg, rgba(13,43,74,.86), rgba(6,26,46,.92));
}
.page-about .about-role + .about-role{margin-top:14px;}
.page-about .about-role__title{
  margin:0 0 16px;
  font-size:clamp(18px,2.5vw,22px);
  font-weight:800;
  line-height:1.3;
  color:var(--mist);
}
.page-about .about-role__title::before{
  content:"";
  display:inline-block;
  width:20px;
  height:2px;
  margin-right:10px;
  vertical-align:middle;
  background:var(--cyan);
}
.page-about .about-role__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about .about-role__list li{
  position:relative;
  padding-left:22px;
  font-size:15px;
  line-height:1.8;
  color:var(--mist-soft);
}
.page-about .about-role__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:9px;
  height:9px;
  border:1px solid var(--cyan);
  border-radius:50%;
}
.page-about .about-roles__note{
  margin:16px 0 0;
  padding-left:16px;
  border-left:2px solid var(--cyan-line);
  font-size:14px;
  line-height:1.8;
  color:var(--steel);
}

/* ---------- 时间轴 ---------- */
.page-about .about-timeline{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}
.page-about .about-timeline__node{
  position:relative;
  padding:20px 20px 20px 26px;
  border:1px solid var(--steel-line);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg, rgba(13,43,74,.9), rgba(6,26,46,.92));
  transition:border-color .3s var(--ease), transform .3s var(--ease);
}
.page-about .about-timeline__node::before{
  content:"";
  position:absolute;
  left:0;
  top:20px;
  bottom:20px;
  width:3px;
  border-radius:3px;
  background:var(--cyan);
}
.page-about .about-timeline__node:hover,
.page-about .about-timeline__node:focus-within{
  border-color:var(--cyan-line);
  transform:translateY(-2px);
}
.page-about .about-timeline__node:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}
.page-about .about-timeline__time{
  display:inline-block;
  margin-bottom:8px;
  font-family:var(--font-num);
  font-size:13px;
  letter-spacing:.14em;
  color:var(--amber);
}
.page-about .about-timeline__title{
  margin:0 0 8px;
  font-size:clamp(17px,2.4vw,20px);
  font-weight:800;
  line-height:1.35;
  color:var(--mist);
}
.page-about .about-timeline__desc{
  margin:0;
  font-size:14px;
  line-height:1.75;
  color:var(--steel);
}
.page-about .about-timeline__more > div{overflow:hidden;}
.page-about .about-timeline__more p{
  margin:12px 0 0;
  padding-top:12px;
  border-top:1px dashed var(--steel-line);
  font-size:14px;
  line-height:1.8;
  color:var(--mist-soft);
}

/* ---------- 赛季档案 ---------- */
.page-about .about-archive{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(16px,3vw,28px);
}
.page-about .about-archive__subtitle{
  margin:0 0 12px;
  font-size:clamp(17px,2.3vw,21px);
  font-weight:800;
  line-height:1.35;
  color:var(--mist);
}
.page-about .about-archive__text{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:var(--mist-soft);
}
.page-about .about-archive__dims{
  list-style:none;
  margin:18px 0 0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about .about-archive__dims li{
  display:flex;
  gap:12px;
  font-size:15px;
  line-height:1.7;
  color:var(--mist-soft);
}
.page-about .about-archive__dims .num{
  flex:0 0 auto;
  font-family:var(--font-num);
  font-size:13px;
  line-height:1.8;
  color:var(--cyan);
}
.page-about .about-archive__col--panel{
  padding:clamp(20px,3.4vw,32px);
  border:1px solid var(--cyan-line);
  border-radius:var(--radius-lg);
  background:var(--about-panel);
}
.page-about .about-archive__link{margin-top:20px;}

/* ---------- 更新节奏 ---------- */
.page-about .about-calendar__figure{
  margin:0 0 clamp(22px,4vw,38px);
  border:1px solid var(--steel-line);
  border-radius:var(--radius-lg);
  overflow:hidden;
  background:var(--abyss-2);
}
.page-about .about-calendar__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(18px,3vw,26px);
}
.page-about .about-phase{
  padding-top:18px;
  border-top:1px solid var(--cyan-line);
}
.page-about .about-phase__title{
  margin:12px 0 10px;
  font-size:clamp(17px,2.3vw,20px);
  font-weight:800;
  line-height:1.35;
  color:var(--mist);
}
.page-about .about-phase__text{
  margin:0;
  font-size:15px;
  line-height:1.8;
  color:var(--mist-soft);
}

/* ---------- 反馈跟进 ---------- */
.page-about .about-feedback-split{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3.4vw,34px);
}
.page-about .about-feedback{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:fb;
  display:grid;
  gap:16px;
}
.page-about .about-feedback li{
  counter-increment:fb;
  position:relative;
  padding-left:52px;
  font-size:15px;
  line-height:1.8;
  color:var(--mist-soft);
}
.page-about .about-feedback li::before{
  content:counter(fb,decimal-leading-zero);
  position:absolute;
  left:0;
  top:1px;
  padding:3px 9px;
  border:1px solid var(--cyan-line);
  border-radius:var(--radius-pill);
  font-family:var(--font-num);
  font-size:13px;
  line-height:1.4;
  color:var(--cyan);
}
.page-about .about-feedback__side{
  padding:clamp(20px,3.4vw,30px);
  border:1px solid var(--steel-line);
  border-radius:var(--radius-lg);
  background:linear-gradient(160deg, rgba(13,43,74,.72), rgba(6,26,46,.9));
}
.page-about .about-feedback__title{
  margin:0 0 12px;
  font-size:clamp(17px,2.3vw,20px);
  font-weight:800;
  color:var(--mist);
}
.page-about .about-feedback__text{
  margin:0 0 12px;
  font-size:15px;
  line-height:1.8;
  color:var(--mist-soft);
}
.page-about .about-feedback__links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

/* ---------- 收尾 ---------- */
.page-about .about-cta{
  margin-top:clamp(28px,5vw,58px);
  border-top:1px solid var(--cyan-line);
  padding:clamp(26px,4.6vw,52px) 0 0;
}
.page-about .about-cta__title{
  margin:0;
  font-family:var(--font-head);
  font-size:clamp(22px,3.8vw,32px);
  font-weight:900;
  line-height:1.2;
  color:var(--mist);
}
.page-about .about-cta__text{
  margin:14px 0 0;
  max-width:62ch;
  font-size:15px;
  line-height:1.85;
  color:var(--mist-soft);
}
.page-about .about-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

/* ---------- 响应式 ---------- */
@media (min-width:680px){
  .page-about .about-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;}
  .page-about .about-calendar__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (min-width:900px){
  .page-about .about-hero__inner{
    grid-template-columns:var(--about-rail) minmax(0,1fr);
    gap:clamp(24px,3vw,40px);
  }
  .page-about .about-hero__rail{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;
    padding-right:16px;
    border-right:1px solid var(--cyan-line);
  }
  .page-about .rail-note{
    writing-mode:vertical-rl;
    text-orientation:mixed;
    font-size:12px;
    letter-spacing:.34em;
    color:var(--steel);
  }
  .page-about .about-hero__coord{
    font-family:var(--font-num);
    font-size:13px;
    color:var(--cyan);
  }
  .page-about .about-timeline{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
  .page-about .about-timeline__more{
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    transition:grid-template-rows .35s var(--ease), opacity .35s var(--ease);
  }
  .page-about .about-timeline__node:hover .about-timeline__more,
  .page-about .about-timeline__node:focus-within .about-timeline__more{
    grid-template-rows:1fr;
    opacity:1;
  }
  .page-about .about-archive{grid-template-columns:minmax(0,7fr) minmax(0,5fr);}
  .page-about .about-calendar__grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .page-about .about-feedback-split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);}
}

@media (min-width:1180px){
  .page-about .about-hero{padding-top:clamp(26px,3vw,46px);}
  .page-about .about-section{padding:clamp(56px,6vw,96px) 0;}
}

@media (prefers-reduced-motion:reduce){
  .page-about .about-timeline__node,
  .page-about .about-timeline__more,
  .page-about .about-index__link,
  .page-about .tabs__btn{
    transition:none;
  }
  .page-about .about-timeline__node:hover{transform:none;}
}
