.page-about{
  --about-pad:clamp(52px,7vw,104px);
  --about-gap:clamp(20px,3vw,40px);
  --about-ink-dark:#1b2a37;
  --about-ink-soft:#4b5862;
  display:block;
  background:var(--night);
  color:var(--bone);
  font-family:var(--f-sans);
  overflow-x:clip;
}

.page-about .about-wrap{
  width:100%;
  max-width:var(--stage-max);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.page-about .about-band{ padding-block:var(--about-pad); }
.page-about .about-band--deep{ background:var(--deep); }
.page-about .about-band--turf{ background:var(--turf); }
.page-about .about-band--bone{ background:var(--bone); color:var(--about-ink-dark); }
.page-about .about-band--last{ background:var(--night); padding-block:clamp(40px,5vw,72px) clamp(56px,7vw,96px); }

.page-about .about-kicker{
  margin:0;
  font-family:var(--f-mono);
  font-size:11.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--moss);
}
.page-about .about-kicker--dark{ color:var(--clay); }

/* ---------- 首屏 ---------- */
.page-about .about-hero{
  background:var(--night);
  padding-top:clamp(20px,3vw,36px);
  padding-bottom:clamp(40px,5.5vw,84px);
}
.page-about .about-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(30px,4vw,56px);
  align-items:end;
  margin-top:clamp(28px,4vw,56px);
}
.page-about .about-hero h1{
  margin:14px 0 0;
  font-family:var(--f-display);
  font-size:clamp(40px,8.4vw,92px);
  line-height:.98;
  letter-spacing:-.02em;
  font-weight:200;
}
.page-about .about-hero__light{
  display:block;
  font-weight:200;
  color:var(--bone);
}
.page-about .about-hero__heavy{
  display:block;
  font-weight:900;
  color:var(--silver);
  letter-spacing:-.035em;
}
.page-about .about-lede{
  margin:24px 0 0;
  max-width:52ch;
  font-family:var(--f-serif);
  font-size:clamp(16px,1.7vw,18px);
  line-height:1.85;
  color:var(--silver);
}

.page-about .about-facts{
  list-style:none;
  margin:clamp(30px,3.4vw,44px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1px;
  background:var(--line);
  border-top:1px solid var(--line-strong);
  border-bottom:1px solid var(--line);
}
.page-about .about-fact{
  background:var(--night);
  padding:18px 16px 20px;
}
.page-about .about-fact__num{
  display:block;
  font-family:var(--f-mono);
  font-weight:700;
  font-variant-numeric:tabular-nums;
  font-size:clamp(26px,3.2vw,36px);
  line-height:1.05;
  letter-spacing:-.02em;
  color:var(--silver);
}
.page-about .about-fact__label{
  display:block;
  margin-top:8px;
  font-size:13px;
  line-height:1.6;
  color:var(--stone);
}

.page-about .about-hero__media{ margin:0; }
.page-about .about-hero__media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  border:1px solid var(--line-strong);
  box-shadow:var(--hard);
}
.page-about .about-hero__media figcaption,
.page-about .about-org__media figcaption,
.page-about .about-tl__figure figcaption{
  margin-top:12px;
  font-family:var(--f-sans);
  font-style:italic;
  font-weight:300;
  font-size:12.5px;
  line-height:1.65;
  color:var(--stone);
}

/* ---------- 区块头 ---------- */
.page-about .about-sec__head{
  display:grid;
  gap:14px;
  max-width:62ch;
}
.page-about .about-sec__title{
  margin:0;
  font-family:var(--f-display);
  font-weight:200;
  font-size:clamp(30px,4.6vw,56px);
  line-height:1.02;
  letter-spacing:-.02em;
  color:var(--bone);
}
.page-about .about-sec__title--dark{ color:var(--about-ink-dark); font-weight:200; }
.page-about .about-sec__note{
  margin:0;
  max-width:58ch;
  font-size:15px;
  line-height:1.8;
  color:var(--stone);
}

/* ---------- 起点 ---------- */
.page-about .about-origin{
  margin-top:clamp(24px,3vw,36px);
  display:grid;
  gap:18px;
  max-width:64ch;
}
.page-about .about-origin p{
  margin:0;
  font-family:var(--f-serif);
  font-size:clamp(16px,1.7vw,18px);
  line-height:1.95;
  color:var(--silver);
}
.page-about .about-detail{
  margin:clamp(26px,3vw,38px) 0 0;
  padding-left:16px;
  border-left:2px solid var(--clay);
  font-style:italic;
  font-weight:300;
  font-size:12.5px;
  line-height:1.7;
  color:var(--stone);
  max-width:60ch;
}

/* ---------- 数据来源 ---------- */
.page-about .about-sources{
  list-style:none;
  margin:clamp(30px,3.8vw,48px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.page-about .about-src{
  position:relative;
  background:var(--deep);
  padding:clamp(22px,2.6vw,30px);
  transition:background-color .24s var(--ease);
}
.page-about .about-src::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--moss);
  opacity:.45;
  transition:opacity .24s var(--ease),background-color .24s var(--ease);
}
.page-about .about-src:hover,
.page-about .about-src:focus-within{ background:var(--turf); }
.page-about .about-src:hover::before,
.page-about .about-src:focus-within::before{ opacity:1; background:var(--amber); }
.page-about .about-src__index{
  font-family:var(--f-mono);
  font-size:11.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--moss);
}
.page-about .about-src__title{
  margin:12px 0 10px;
  font-family:var(--f-display);
  font-weight:900;
  font-size:clamp(20px,2.2vw,25px);
  line-height:1.15;
  letter-spacing:-.01em;
  color:var(--bone);
}
.page-about .about-src__meta{
  margin:0;
  font-family:var(--f-mono);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--silver);
}
.page-about .about-src__more{
  margin:14px 0 0;
  font-size:14px;
  line-height:1.8;
  color:var(--stone);
}

/* ---------- 时间线 ---------- */
.page-about .about-timeline{
  margin-top:clamp(34px,4.4vw,60px);
  border-left:2px solid var(--line-strong);
  padding-left:clamp(20px,3vw,36px);
}
.page-about .about-tl{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(18px,2.4vw,26px);
  align-items:start;
  padding-bottom:clamp(34px,4.6vw,62px);
}
.page-about .about-tl::before{
  content:"";
  position:absolute;
  top:9px;
  left:calc(-1 * clamp(20px,3vw,36px) - 8px);
  width:12px;
  height:12px;
  background:var(--clay);
}
.page-about .about-tl__main{ min-width:0; }
.page-about .about-tl__ver{
  margin:0;
  font-family:var(--f-mono);
  font-size:11.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--clay);
}
.page-about .about-tl__title{
  margin:10px 0 12px;
  font-family:var(--f-display);
  font-weight:600;
  font-size:clamp(22px,2.7vw,32px);
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--bone);
}
.page-about .about-tl__body{
  margin:0;
  max-width:60ch;
  font-size:15px;
  line-height:1.85;
  color:var(--stone);
}
.page-about .about-tl__add{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:grid;
  gap:8px;
}
.page-about .about-tl__add li{
  position:relative;
  padding-left:18px;
  font-size:13.5px;
  line-height:1.7;
  color:var(--silver);
}
.page-about .about-tl__add li::before{
  content:"—";
  position:absolute;
  left:0;
  color:var(--moss);
}

.page-about .about-card{
  background:var(--deep);
  border-left:4px solid var(--amber);
  padding:clamp(18px,2.2vw,24px);
  box-shadow:var(--hard);
}
.page-about .about-card__label{
  margin:0;
  font-family:var(--f-mono);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--amber);
}
.page-about .about-card__text{
  margin:10px 0 0;
  font-family:var(--f-serif);
  font-size:15px;
  line-height:1.9;
  color:var(--silver);
}

.page-about .about-tl__figure{
  margin:0 0 clamp(34px,4.6vw,62px);
}
.page-about .about-tl__figure img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  border:1px solid var(--line-strong);
  box-shadow:var(--hard);
}

/* ---------- 工作分工 ---------- */
.page-about .about-teams{
  list-style:none;
  margin:clamp(30px,3.8vw,50px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(22px,3vw,32px);
}
.page-about .about-team{
  border-top:2px solid rgba(201,207,214,.42);
  padding-top:18px;
}
.page-about .about-team__idx{
  font-family:var(--f-mono);
  font-size:12px;
  letter-spacing:.2em;
  color:var(--amber);
}
.page-about .about-team__name{
  margin:12px 0 12px;
  font-family:var(--f-display);
  font-weight:900;
  font-size:clamp(20px,2.3vw,27px);
  line-height:1.1;
  letter-spacing:-.01em;
  color:var(--bone);
}
.page-about .about-team__desc{
  margin:0;
  font-size:14.5px;
  line-height:1.85;
  color:var(--stone);
}

/* ---------- 球迷组织 ---------- */
.page-about .about-org{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(28px,4vw,52px);
  align-items:center;
}
.page-about .about-org__p{
  margin:22px 0 0;
  max-width:58ch;
  font-size:15px;
  line-height:1.9;
  color:var(--stone);
}
.page-about .about-org__media{ margin:0; }
.page-about .about-org__media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  border:1px solid var(--line-strong);
  box-shadow:var(--hard);
}

/* ---------- 纠错 ---------- */
.page-about .about-fix{
  margin-top:clamp(30px,3.8vw,48px);
  display:grid;
  gap:10px;
}
.page-about .fold{
  background:var(--deep);
  border-top:1px solid var(--line-strong);
  border-left:2px solid var(--clay);
  padding:0 clamp(16px,2vw,22px);
}
.page-about .fold__title{
  font-family:var(--f-display);
  font-weight:600;
  font-size:clamp(17px,1.9vw,21px);
  letter-spacing:-.01em;
}
.page-about .fold__summary{
  font-size:13px;
  font-style:italic;
  font-weight:300;
  color:var(--stone);
}
.page-about .fold__body p{
  margin:0;
  font-size:14.5px;
  line-height:1.9;
  color:var(--silver);
}

/* ---------- 长期主义 ---------- */
.page-about .about-pledge{ max-width:68ch; }
.page-about .about-pledge__text{
  margin:22px 0 0;
  font-family:var(--f-serif);
  font-size:clamp(17px,1.9vw,21px);
  line-height:1.95;
  color:var(--about-ink-dark);
}
.page-about .about-pledge__note{
  margin:18px 0 0;
  font-size:12.5px;
  font-style:italic;
  font-weight:300;
  line-height:1.75;
  color:var(--about-ink-soft);
}
.page-about .about-pledge__links{
  margin-top:clamp(26px,3vw,38px);
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.page-about .about-band--bone .btn--ghost{
  color:var(--night);
  border-color:rgba(10,26,42,.5);
}
.page-about .about-band--bone .btn--ghost:hover{
  background:var(--night);
  color:var(--bone);
  border-color:var(--night);
}

/* ---------- 后续入口 ---------- */
.page-about .about-next{
  list-style:none;
  margin:clamp(26px,3.2vw,40px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1px;
  background:var(--line);
  border-top:1px solid var(--line-strong);
}
.page-about .about-next__item{
  display:block;
  height:100%;
  padding:20px 18px 22px;
  background:var(--night);
  text-decoration:none;
  color:var(--bone);
  transition:background-color .22s var(--ease);
}
.page-about .about-next__item:hover,
.page-about .about-next__item:focus-visible{ background:var(--turf); }
.page-about .about-next__label{
  display:block;
  font-family:var(--f-display);
  font-weight:600;
  font-size:clamp(17px,1.9vw,20px);
  letter-spacing:-.01em;
  color:var(--bone);
}
.page-about .about-next__note{
  display:block;
  margin-top:8px;
  font-size:12.5px;
  line-height:1.6;
  color:var(--stone);
}

/* ---------- 响应式 ---------- */
@media (min-width:560px){
  .page-about .about-facts{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .page-about .about-next{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

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

@media (min-width:960px){
  .page-about .about-hero__grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  }
  .page-about .about-hero__media img{ aspect-ratio:14/10; }
  .page-about .about-tl{
    grid-template-columns:minmax(0,1fr) minmax(0,340px);
    gap:clamp(28px,4vw,56px);
  }
  .page-about .about-tl__figure{ max-width:820px; }
  .page-about .about-org{
    grid-template-columns:minmax(0,1fr) minmax(0,440px);
  }
}

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

@media (prefers-reduced-motion:reduce){
  .page-about .about-src,
  .page-about .about-next__item,
  .page-about .about-src::before{
    transition:none;
  }
}
