.page-about{
  --about-rail:248px;
  --about-line:rgba(156,178,184,.28);
  --about-ink-line:rgba(10,20,24,.26);
  --about-quiet:rgba(243,232,212,.66);
  background:var(--night);
  color:var(--paper);
  font-family:var(--font-sans);
  padding:clamp(18px,2.6vw,32px) 0 clamp(56px,7vw,96px);
  overflow-x:hidden;
}

/* 面包屑 */
.page-about .about-crumb{padding-bottom:clamp(16px,2vw,24px);}
.page-about .about-crumb__list{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  list-style:none;margin:0;padding:0;
  font-size:12px;letter-spacing:.1em;color:var(--about-quiet);
}
.page-about .about-crumb__list li+li::before{content:"/";margin-right:8px;color:rgba(156,178,184,.5);}
.page-about .about-crumb__list a{color:var(--neon);text-decoration:none;border-bottom:1px solid transparent;}
.page-about .about-crumb__list a:hover,.page-about .about-crumb__list a:focus-visible{border-bottom-color:var(--neon);}

/* 小标签 */
.page-about .about-label{
  margin:0 0 10px;
  font-size:12px;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--about-quiet);
}

/* 首屏 */
.page-about .about-hero{
  display:grid;gap:var(--gap);
  padding:clamp(18px,3vw,30px) 0 clamp(26px,4vw,42px);
  border-top:3px solid var(--line-strong);
}
@media (min-width:900px){
  .page-about .about-hero{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:end;}
}
.page-about .about-hero__title{
  margin:0 0 18px;
  font-size:clamp(2.5rem,7.4vw,5.2rem);
  font-weight:900;line-height:.98;letter-spacing:-.035em;
  color:var(--paper);
}
.page-about .about-hero__dek{
  margin:0;max-width:56ch;
  font-size:clamp(15px,1.6vw,17px);line-height:1.78;color:var(--paper-soft);
}
.page-about .about-hero__acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px;}

.page-about .about-hero__card{
  border:2px solid var(--line-strong);
  background:var(--cabin);
  box-shadow:var(--shadow);
  padding:clamp(16px,2.4vw,24px);
  border-left:5px solid var(--neon);
}
.page-about .about-hero__quote{
  margin:0 0 14px;
  font-size:clamp(1.3rem,2.6vw,1.75rem);
  font-weight:800;line-height:1.34;letter-spacing:-.01em;color:var(--paper);
}
.page-about .about-hero__cardnote{
  margin:0;font-size:13px;line-height:1.7;color:var(--about-quiet);
  padding-top:12px;border-top:1px solid var(--line);
}

/* 按钮 */
.page-about .about-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 18px;border:2px solid var(--paper);
  color:var(--paper);background:transparent;
  font-size:14px;font-weight:600;letter-spacing:.04em;
  text-decoration:none;cursor:pointer;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease,border-color .15s ease;
}
.page-about .about-cta:hover,.page-about .about-cta:focus-visible{
  background:var(--paper);color:var(--ink);
  transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ember);
}
.page-about .about-cta--solid{
  background:var(--ember);border-color:var(--ember);color:var(--ink);
  box-shadow:5px 5px 0 rgba(3,12,20,.9);
}
.page-about .about-cta--solid:hover,.page-about .about-cta--solid:focus-visible{
  background:var(--neon);border-color:var(--neon);color:var(--ink);
  box-shadow:5px 5px 0 rgba(3,12,20,.9);
}
.page-about .about-panel--paper .about-cta{border-color:var(--ink);color:var(--ink);}
.page-about .about-panel--paper .about-cta:hover{background:var(--ink);color:var(--paper);box-shadow:5px 5px 0 var(--ember);}
.page-about .about-panel--paper .about-cta--solid{background:var(--ember);border-color:var(--ember);color:var(--ink);box-shadow:5px 5px 0 var(--ink);}

/* 数据条 */
.page-about .about-stats{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  list-style:none;margin:0 0 clamp(26px,4vw,44px);padding:0;
  border-top:2px solid var(--about-line);
  border-bottom:2px solid var(--about-line);
}
@media (min-width:760px){
  .page-about .about-stats{grid-template-columns:repeat(5,minmax(0,1fr));}
}
.page-about .about-stats__item{
  padding:clamp(12px,2vw,18px) clamp(10px,1.6vw,16px);
  border-right:1px solid var(--about-line);
  border-bottom:1px solid var(--about-line);
}
.page-about .about-stats__item:nth-child(2n){border-right:0;}
@media (min-width:760px){
  .page-about .about-stats__item{border-bottom:0;}
  .page-about .about-stats__item:nth-child(2n){border-right:1px solid var(--about-line);}
  .page-about .about-stats__item:last-child{border-right:0;}
}
.page-about .about-stats__num{
  display:block;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:clamp(1.5rem,3.4vw,2.1rem);line-height:1.1;font-weight:600;
  color:var(--neon);letter-spacing:-.02em;
}
.page-about .about-stats__cap{
  display:block;margin-top:6px;
  font-size:12px;letter-spacing:.1em;color:var(--about-quiet);
}

/* 主布局 */
.page-about .about-layout{display:grid;gap:clamp(20px,3vw,36px);}
@media (min-width:1000px){
  .page-about .about-layout{grid-template-columns:var(--about-rail) minmax(0,1fr);align-items:start;}
}

/* 左侧章节轴 */
.page-about .about-rail{min-width:0;}
.page-about .about-rail__title{margin-bottom:8px;}
.page-about .about-rail__list{
  display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;
  list-style:none;margin:0;padding:0 0 8px;
  -webkit-overflow-scrolling:touch;
}
.page-about .about-rail__list li{flex:0 0 auto;scroll-snap-align:start;}
.page-about .about-rail__link{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border:2px solid var(--about-line);
  background:rgba(13,42,58,.55);
  color:var(--paper-soft);text-decoration:none;
  font-size:13px;white-space:nowrap;
  transition:border-color .15s ease,background .15s ease,color .15s ease;
}
.page-about .about-rail__link:hover,.page-about .about-rail__link:focus-visible{
  border-color:var(--neon);color:var(--paper);background:rgba(49,242,200,.1);
}
.page-about .about-rail__idx{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;color:var(--neon);
}
@media (min-width:1000px){
  .page-about .about-rail__inner{position:sticky;top:92px;}
  .page-about .about-rail__list{
    display:block;overflow:visible;padding:0;
    border-left:2px solid var(--about-line);
  }
  .page-about .about-rail__list li{margin-bottom:2px;}
  .page-about .about-rail__link{
    display:flex;width:100%;
    margin-left:-2px;padding:10px 12px;
    border:0;border-left:3px solid transparent;
    background:transparent;white-space:normal;
  }
  .page-about .about-rail__link:hover,.page-about .about-rail__link:focus-visible{
    border-left-color:var(--neon);background:rgba(49,242,200,.08);
  }
}

/* 面板 */
.page-about .about-main{display:grid;gap:clamp(16px,2.4vw,24px);min-width:0;}
.page-about .about-panel{
  position:relative;
  border:2px solid var(--line-strong);
  background:var(--cabin);
  box-shadow:var(--shadow);
  padding:clamp(20px,3vw,34px);
  min-width:0;
}
.page-about .about-panel--paper{
  background:var(--paper);color:var(--ink);
  border-color:var(--ink);box-shadow:var(--shadow-paper);
}
.page-about .about-panel p{margin:0 0 14px;font-size:clamp(15px,1.5vw,16.5px);line-height:1.8;color:var(--paper-soft);}
.page-about .about-panel--paper p{color:rgba(10,20,24,.82);}
.page-about .about-panel p:last-child{margin-bottom:0;}

.page-about .about-panel__head{
  display:grid;gap:8px;
  margin-bottom:clamp(16px,2.4vw,22px);
  padding-bottom:14px;
  border-bottom:2px solid var(--about-line);
}
.page-about .about-panel--paper .about-panel__head{border-bottom-color:var(--about-ink-line);}
@media (min-width:720px){
  .page-about .about-panel__head{
    grid-template-columns:auto minmax(0,1fr);
    align-items:end;column-gap:18px;
  }
}
.page-about .about-num{
  display:block;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:clamp(2.4rem,6vw,4.2rem);line-height:.84;
  font-weight:700;letter-spacing:-.05em;color:var(--neon);
}
@supports ((-webkit-text-stroke:1px #000)){
  .page-about .about-num{color:transparent;-webkit-text-stroke:1.6px var(--neon);}
}
.page-about .about-panel--paper .about-num{color:var(--ember);}
@supports ((-webkit-text-stroke:1px #000)){
  .page-about .about-panel--paper .about-num{color:transparent;-webkit-text-stroke:1.6px var(--ember);}
}
.page-about .about-panel__title{
  margin:0;
  font-size:clamp(1.4rem,3vw,2.15rem);
  font-weight:800;line-height:1.16;letter-spacing:-.02em;
  color:var(--paper);
}
.page-about .about-panel--paper .about-panel__title{color:var(--ink);}

/* 图片框 */
.page-about .about-media{
  margin:clamp(18px,2.6vw,26px) 0 0;
  border:2px solid var(--ink);
  background:var(--paper);
  box-shadow:var(--shadow-paper);
  overflow:hidden;
}
.page-about .about-media img{
  display:block;width:100%;height:auto;max-width:100%;
  object-fit:cover;
}
.page-about .about-media__cap{
  padding:9px 12px;
  border-top:2px solid var(--ink);
  font-size:12px;line-height:1.6;letter-spacing:.04em;
  color:rgba(10,20,24,.72);
}
.page-about .about-media--tall{margin-top:0;}

/* 双栏 */
.page-about .about-split{display:grid;gap:clamp(18px,2.6vw,26px);}
@media (min-width:900px){
  .page-about .about-split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;}
}

/* 方法卡 */
.page-about .about-methods{
  display:grid;gap:10px;margin:18px 0;
}
@media (min-width:760px){
  .page-about .about-methods{grid-template-columns:repeat(3,minmax(0,1fr));}
}
.page-about .about-method{
  border:2px solid var(--about-ink-line);
  background:rgba(255,255,255,.42);
  padding:14px;
  transition:border-color .15s ease,background .15s ease,transform .15s ease,box-shadow .15s ease;
}
.page-about .about-method:hover,.page-about .about-method:focus-within{
  border-color:var(--ink);background:rgba(255,255,255,.78);
  transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--ink);
}
.page-about .about-method__title{
  margin:0 0 8px;
  font-size:15px;font-weight:800;letter-spacing:.02em;color:var(--ink);
  padding-bottom:8px;border-bottom:2px solid var(--ember);
}
.page-about .about-method p{margin:0;font-size:14px;line-height:1.72;color:rgba(10,20,24,.78);}

.page-about .about-quip{
  margin:18px 0 0 !important;
  padding:12px 16px;
  border-left:4px solid var(--ember);
  background:rgba(255,138,61,.16);
  font-size:14px !important;line-height:1.75 !important;
  color:var(--ink) !important;
}
.page-about .about-panel:not(.about-panel--paper) .about-quip{
  background:rgba(255,138,61,.12);
  color:var(--paper-soft) !important;
}

/* 联赛分层 */
.page-about .about-lead{font-size:clamp(15px,1.6vw,17px) !important;color:var(--paper) !important;}
.page-about .about-league-grid{
  display:grid;gap:12px;margin:6px 0 18px;
}
@media (min-width:720px){
  .page-about .about-league-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
.page-about .about-league{
  border:2px solid var(--about-line);
  border-left-width:6px;
  background:rgba(13,42,58,.7);
  padding:14px;
  transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease;
}
.page-about .about-league:hover{
  transform:translate(-2px,-2px);
  box-shadow:5px 5px 0 rgba(3,12,20,.9);
}
.page-about .about-league--foot{border-left-color:var(--league-foot);}
.page-about .about-league--basket{border-left-color:var(--league-basket);}
.page-about .about-league--cup{border-left-color:var(--league-cup);}
.page-about .about-league .about-label{margin-bottom:6px;color:var(--paper);}
.page-about .about-league p{margin:0;font-size:14px;line-height:1.72;color:var(--paper-soft);}

/* 时间线 */
.page-about .about-timeline{
  position:relative;
  list-style:none;margin:0;padding:0 0 0 22px;
}
.page-about .about-timeline::before{
  content:"";position:absolute;left:5px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,var(--neon),rgba(49,242,200,.12));
}
.page-about .about-stage{
  position:relative;
  margin-bottom:12px;padding:14px 16px;
  border:2px solid var(--about-line);
  background:rgba(13,42,58,.62);
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .15s ease;
}
.page-about .about-stage:last-child{margin-bottom:0;}
.page-about .about-stage::before{
  content:"";position:absolute;left:-24px;top:18px;
  width:12px;height:12px;
  background:var(--night);border:2px solid var(--neon);
  transition:background .15s ease,transform .15s ease;
}
.page-about .about-stage:hover,.page-about .about-stage:focus-within{
  border-color:var(--neon);
  background:rgba(49,242,200,.08);
  transform:translateX(3px);
  box-shadow:5px 5px 0 rgba(3,12,20,.9);
}
.page-about .about-stage:hover::before,.page-about .about-stage:focus-within::before{
  background:var(--neon);transform:scale(1.18);
}
.page-about .about-stage__year{
  margin:0 0 4px !important;
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:13px;letter-spacing:.16em;color:var(--neon);
}
.page-about .about-stage__name{
  margin:0 0 8px;
  font-size:clamp(1.05rem,2vw,1.3rem);
  font-weight:800;letter-spacing:-.01em;color:var(--paper);
}
.page-about .about-stage p{margin:0;font-size:14px;line-height:1.75;color:var(--paper-soft);}

/* 团队 */
.page-about .about-team{display:grid;gap:12px;margin:18px 0;}
@media (min-width:560px){
  .page-about .about-team{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:1000px){
  .page-about .about-team{grid-template-columns:repeat(4,minmax(0,1fr));}
}
.page-about .about-team__card{
  border:2px solid var(--about-ink-line);
  background:rgba(255,255,255,.42);
  padding:14px;
  transition:border-color .15s ease,background .15s ease,transform .15s ease,box-shadow .15s ease;
}
.page-about .about-team__card:hover,.page-about .about-team__card:focus-within{
  border-color:var(--ink);background:rgba(49,242,200,.2);
  transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink);
}
.page-about .about-team__title{
  margin:0 0 8px;
  font-size:15px;font-weight:800;color:var(--ink);
  padding-bottom:8px;border-bottom:2px solid var(--ember);
}
.page-about .about-team__card p{margin:0;font-size:14px;line-height:1.72;color:rgba(10,20,24,.78);}

.page-about .about-office{
  margin-top:6px;padding:16px;
  border:2px dashed var(--about-ink-line);
  background:rgba(184,138,74,.1);
}
.page-about .about-office__addr{
  font-family:var(--font-mono);
  font-size:14px !important;letter-spacing:.01em;
  color:var(--ink) !important;
  padding-bottom:10px;margin-bottom:12px !important;
  border-bottom:1px solid var(--about-ink-line);
}

/* 合作 */
.page-about .about-coop{display:grid;gap:14px;}
@media (min-width:780px){
  .page-about .about-coop{grid-template-columns:repeat(2,minmax(0,1fr));}
}
.page-about .about-coop__col{
  border:2px solid var(--about-line);
  background:rgba(13,42,58,.55);
  padding:16px;
}
.page-about .about-coop__mail,
.page-about .about-coop__tel{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:15px !important;letter-spacing:.02em;
  color:var(--neon) !important;
  word-break:break-word;
}
.page-about .about-coop__col .about-cta{margin-top:6px;}
.page-about .about-tail{
  margin-top:18px !important;
  padding-top:14px;border-top:1px solid var(--line);
  font-size:14px !important;color:var(--about-quiet) !important;
}
.page-about .about-tail a{color:var(--neon);text-decoration:none;border-bottom:1px solid rgba(49,242,200,.45);}
.page-about .about-tail a:hover,.page-about .about-tail a:focus-visible{border-bottom-color:var(--neon);background:rgba(49,242,200,.1);}

/* 窄屏节奏微调 */
@media (max-width:480px){
  .page-about .about-cta{width:100%;}
  .page-about .about-hero__acts{gap:10px;}
  .page-about .about-timeline{padding-left:18px;}
  .page-about .about-stage::before{left:-20px;width:10px;height:10px;}
  .page-about .about-stats__num{font-size:1.35rem;}
}
<<<END>>>
