.page-about{
  --ab-rule:rgba(76,86,84,.26);
  --ab-rule-soft:rgba(76,86,84,.13);
  --ab-rule-dark:rgba(244,240,230,.18);
  --ab-gold:rgba(201,162,75,.34);
  --ab-gap:clamp(24px,4vw,56px);
  background:var(--ng-paper);
  color:var(--ng-ink);
  font-family:var(--font-body);
  line-height:1.8;
}

/* ---------- 首屏框景 ---------- */
.page-about .about-hero{
  position:relative;
  background-color:var(--ng-night);
  background-image:
    radial-gradient(90% 70% at 50% 0%, rgba(46,125,79,.26), transparent 68%),
    linear-gradient(rgba(244,240,230,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244,240,230,.05) 1px, transparent 1px);
  background-size:100% 100%, 72px 72px, 72px 72px;
  color:var(--ng-paper);
  padding:clamp(26px,4vw,46px) 0 clamp(40px,6vw,80px);
}

.page-about .about-hero__inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 var(--gutter);
}

.page-about .about-frame{
  position:relative;
  border:1px solid var(--ab-rule-dark);
  padding:clamp(22px,4vw,54px) clamp(18px,3.4vw,48px);
}

.page-about .about-frame__corner{
  position:absolute;
  width:14px;
  height:14px;
  border:2px solid var(--ng-trophy);
}

.page-about .about-frame__corner--tl{top:-1px;left:-1px;border-right:0;border-bottom:0;}
.page-about .about-frame__corner--tr{top:-1px;right:-1px;border-left:0;border-bottom:0;}
.page-about .about-frame__corner--bl{bottom:-1px;left:-1px;border-right:0;border-top:0;}
.page-about .about-frame__corner--br{bottom:-1px;right:-1px;border-left:0;border-top:0;}

.page-about .about-hero__eyebrow{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:var(--label);
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--ng-trophy);
  margin:0 0 var(--space-2);
  padding-bottom:6px;
  border-bottom:1px solid var(--ab-gold);
}

.page-about .about-hero__title{
  font-family:var(--font-title);
  font-size:var(--h1);
  font-weight:700;
  line-height:1.08;
  letter-spacing:-.01em;
  color:var(--ng-paper);
  margin:0 0 var(--space-2);
  max-width:14em;
}

.page-about .about-hero__lede{
  font-size:clamp(1rem,1.25vw,1.1rem);
  line-height:1.9;
  color:rgba(244,240,230,.82);
  max-width:34em;
  margin:0 0 var(--space-3);
}

.page-about .about-hero__stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin:0;
  background:var(--ab-rule-dark);
  border:1px solid var(--ab-rule-dark);
}

.page-about .about-stat{
  background:var(--ng-night);
  padding:16px 14px;
}

.page-about .about-stat__label{
  display:block;
  margin:0 0 8px;
  font-size:var(--label);
  letter-spacing:.14em;
  color:rgba(244,240,230,.52);
}

.page-about .about-stat__value{
  margin:0;
  display:flex;
  align-items:baseline;
  gap:6px;
  font-family:var(--font-mono);
  font-size:clamp(1.5rem,3vw,2.2rem);
  line-height:1.1;
  color:var(--ng-paper);
  font-variant-numeric:tabular-nums;
}

.page-about .about-stat__unit{
  font-family:var(--font-body);
  font-size:.74rem;
  letter-spacing:.06em;
  color:var(--ng-signal);
}

/* ---------- 主体双栏 ---------- */
.page-about .about-layout{
  max-width:var(--shell);
  margin:0 auto;
  padding:clamp(40px,6vw,88px) var(--gutter) clamp(30px,5vw,60px);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--ab-gap);
}

.page-about .about-toc{
  display:none;
}

.page-about .about-toc__title{
  margin:0 0 16px;
  padding-bottom:10px;
  font-family:var(--font-mono);
  font-size:var(--label);
  letter-spacing:.18em;
  color:var(--ng-slate);
  border-bottom:1px solid var(--ab-rule);
}

.page-about .about-toc__list{
  list-style:none;
  margin:0;
  padding:0;
}

.page-about .about-toc__link{
  display:block;
  min-height:44px;
  padding:10px 8px 10px 14px;
  border-left:1px solid var(--ab-rule-soft);
  color:var(--ng-stone);
  font-size:.86rem;
  line-height:1.6;
  text-decoration:none;
  transition:color .2s var(--ease), border-color .2s var(--ease), background-color .2s var(--ease);
}

.page-about .about-toc__link:hover{
  color:var(--ng-ink);
  border-left-color:var(--ng-pitch);
  background:rgba(46,125,79,.06);
}

.page-about .about-toc__link.is-current{
  color:var(--ng-signal);
  border-left-color:var(--ng-signal);
  font-weight:600;
}

.page-about .about-chapters{
  min-width:0;
}

/* ---------- 编号章节 ---------- */
.page-about .about-chapter{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-2);
  padding:clamp(28px,4.2vw,52px) 0;
  border-top:1px solid var(--ab-rule-soft);
  scroll-margin-top:132px;
}

.page-about .about-chapters > .about-chapter:first-child{
  border-top-color:var(--ab-rule);
}

.page-about .about-chapter__no{
  margin:0;
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--font-mono);
  font-size:.92rem;
  letter-spacing:.2em;
  line-height:1;
  color:var(--ng-slate);
}

.page-about .about-chapter__no::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:var(--ab-rule-soft);
}

.page-about .about-chapter__main{
  min-width:0;
}

.page-about .about-chapter__title{
  font-family:var(--font-title);
  font-size:var(--h2);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.01em;
  color:var(--ng-ink);
  margin:0 0 var(--space-2);
  max-width:20em;
}

.page-about .about-chapter__body p{
  margin:0 0 1.1em;
  max-width:36em;
  color:var(--ng-ink);
}

.page-about .about-chapter__body p:last-child{
  margin-bottom:0;
}

.page-about .about-chapter__body a,
.page-about .about-contact a{
  color:var(--ng-pitch);
  text-decoration:none;
  border-bottom:1px solid rgba(46,125,79,.45);
  padding-bottom:1px;
}

.page-about .about-chapter__body a:hover,
.page-about .about-contact a:hover{
  color:var(--ng-signal);
  border-bottom-color:var(--ng-signal);
}

/* ---------- 图片 ---------- */
.page-about .about-figure{
  margin:var(--space-3) 0 0;
  max-width:36em;
}

.page-about .about-figure--wide{
  max-width:46em;
}

.page-about .about-figure__media{
  position:relative;
  overflow:hidden;
  border:1px solid var(--ab-rule-soft);
  background:var(--ng-night);
}

.page-about .about-figure__media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(155deg, rgba(11,42,34,.32), rgba(11,42,34,.05) 58%, rgba(180,99,60,.16));
  pointer-events:none;
}

.page-about .about-figure__img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  filter:saturate(.7) contrast(1.03);
}

.page-about .about-figure--wide .about-figure__img{
  aspect-ratio:7/4;
}

.page-about .about-figure__caption{
  margin:10px 0 0;
  padding-left:12px;
  border-left:2px solid var(--ng-slate);
  font-size:.82rem;
  line-height:1.7;
  color:var(--ng-stone);
  max-width:32em;
}

/* ---------- 小组索引 ---------- */
.page-about .about-crew{
  list-style:none;
  margin:var(--space-3) 0 0;
  padding:0;
  border-top:1px solid var(--ab-rule);
}

.page-about .about-crew__item{
  display:grid;
  grid-template-columns:2.4rem minmax(0,1fr) auto;
  gap:6px 14px;
  align-items:baseline;
  padding:18px 14px;
  border-bottom:1px solid var(--ab-rule-soft);
  border-left:3px solid transparent;
  transition:border-color .22s var(--ease), background-color .22s var(--ease);
}

.page-about .about-crew__item:hover,
.page-about .about-crew__item:focus-within{
  border-left-color:var(--ng-pitch);
  background:rgba(46,125,79,.07);
}

.page-about .about-crew__no{
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.08em;
  color:var(--ng-slate);
}

.page-about .about-crew__name{
  margin:0;
  font-family:var(--font-title);
  font-size:var(--h3);
  font-weight:600;
  line-height:1.35;
  color:var(--ng-ink);
}

.page-about .about-crew__count{
  font-family:var(--font-mono);
  font-size:1.05rem;
  color:var(--ng-signal);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

.page-about .about-crew__count small{
  font-family:var(--font-body);
  font-size:.72rem;
  color:var(--ng-stone);
  margin-left:3px;
}

.page-about .about-crew__duty{
  grid-column:1 / -1;
  margin:6px 0 0;
  font-size:.94rem;
  line-height:1.8;
  color:var(--ng-stone);
}

/* ---------- 横向刻度时间线 ---------- */
.page-about .about-tl{
  list-style:none;
  margin:var(--space-3) 0 var(--space-2);
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(86px,1fr));
  border-top:1px solid var(--ab-rule);
}

.page-about .about-tl__node{
  position:relative;
  min-width:0;
  padding:24px 10px 14px;
  border-right:1px solid var(--ab-rule-soft);
}

.page-about .about-tl__node:last-child{
  border-right:0;
}

.page-about .about-tl__dot{
  position:absolute;
  top:-5px;
  left:10px;
  width:9px;
  height:9px;
  box-sizing:border-box;
  background:var(--ng-paper);
  border:2px solid var(--ng-pitch);
}

.page-about .about-tl__node--mile .about-tl__dot{
  background:var(--ng-trophy);
  border-color:var(--ng-trophy);
}

.page-about .about-tl__label{
  display:block;
  font-family:var(--font-mono);
  font-size:.82rem;
  letter-spacing:.02em;
  color:var(--ng-ink);
  font-variant-numeric:tabular-nums;
}

.page-about .about-tl__note{
  display:block;
  margin-top:4px;
  font-size:.74rem;
  line-height:1.5;
  color:var(--ng-stone);
}

.page-about .about-tl__node--mile .about-tl__note{
  font-weight:600;
  color:var(--ng-ink);
}

/* ---------- 里程碑折叠 ---------- */
.page-about .about-milestones{
  margin-top:var(--space-2);
  border-top:1px solid var(--ab-rule);
}

.page-about .fold{
  border-bottom:1px solid var(--ab-rule-soft);
}

.page-about .fold__summary{
  list-style:none;
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:52px;
  padding:14px 42px 14px 0;
  cursor:pointer;
  font-family:var(--font-title);
  font-size:1.02rem;
  font-weight:600;
  line-height:1.5;
  color:var(--ng-ink);
  transition:color .2s var(--ease);
}

.page-about .fold__summary::-webkit-details-marker{
  display:none;
}

.page-about .fold__summary::after{
  content:"+";
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  font-family:var(--font-mono);
  font-size:1.15rem;
  font-weight:400;
  color:var(--ng-slate);
}

.page-about .fold[open] > .fold__summary::after{
  content:"−";
  color:var(--ng-signal);
}

.page-about .fold__summary:hover{
  color:var(--ng-pitch);
}

.page-about .about-fold__key{
  font-family:var(--font-mono);
  font-size:.82rem;
  letter-spacing:.05em;
  color:var(--ng-slate);
}

.page-about .fold__body{
  padding:0 0 20px;
  max-width:36em;
}

.page-about .fold__body p{
  margin:0 0 .9em;
  font-size:.95rem;
  line-height:1.85;
  color:var(--ng-stone);
}

.page-about .fold__body p:last-child{
  margin-bottom:0;
}

/* ---------- 复核清单 ---------- */
.page-about .about-check{
  list-style:none;
  margin:var(--space-2) 0 var(--space-3);
  padding:0;
  display:grid;
  gap:1px;
  background:var(--ab-rule-soft);
  border:1px solid var(--ab-rule-soft);
}

.page-about .about-check__item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 18px;
  background:var(--ng-paper);
}

.page-about .about-check__mark{
  flex:0 0 auto;
  width:10px;
  height:10px;
  margin-top:9px;
  background:var(--ng-pitch);
}

.page-about .about-check__text{
  font-size:.94rem;
  line-height:1.8;
  color:var(--ng-ink);
}

.page-about .about-check__text strong{
  font-weight:600;
}

/* ---------- 女足欧冠区块 ---------- */
.page-about .about-clay{
  position:relative;
  margin:0 0 var(--space-3);
  padding:clamp(18px,2.6vw,28px) clamp(16px,2.4vw,26px);
  border-left:4px solid var(--ng-clay);
  background:linear-gradient(120deg, rgba(180,99,60,.10), rgba(180,99,60,.02) 70%);
}

.page-about .about-clay .tag{
  display:inline-block;
  margin-bottom:14px;
}

.page-about .about-clay p{
  margin:0 0 1em;
  max-width:34em;
}

.page-about .about-clay p:last-child{
  margin-bottom:0;
}

/* ---------- 联系索引 ---------- */
.page-about .about-contact{
  margin:var(--space-3) 0 var(--space-3);
  border-top:1px solid var(--ab-rule);
}

.page-about .about-contact__row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:4px 18px;
  align-items:baseline;
  padding:16px 14px;
  min-height:44px;
  border-bottom:1px solid var(--ab-rule-soft);
  border-left:3px solid transparent;
  transition:border-color .22s var(--ease), background-color .22s var(--ease);
}

.page-about .about-contact__row:hover{
  border-left-color:var(--ng-pitch);
  background:rgba(46,125,79,.06);
}

.page-about .about-contact__value{
  font-size:1rem;
  color:var(--ng-ink);
  overflow-wrap:anywhere;
}

/* ---------- 收束行动区 ---------- */
.page-about .about-next{
  margin-top:clamp(32px,5vw,64px);
  padding:clamp(40px,6vw,80px) 0;
  background-color:var(--ng-night);
  background-image:radial-gradient(80% 100% at 12% 0%, rgba(46,125,79,.28), transparent 66%);
  color:var(--ng-paper);
}

.page-about .about-next__inner{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 var(--gutter);
}

.page-about .about-next__title{
  font-family:var(--font-title);
  font-size:var(--h2);
  font-weight:600;
  line-height:1.2;
  margin:0 0 var(--space-2);
  color:var(--ng-paper);
  max-width:20em;
}

.page-about .about-next__lede{
  margin:0 0 var(--space-3);
  max-width:34em;
  color:rgba(244,240,230,.76);
}

.page-about .about-next__links{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

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

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

  .page-about .about-chapter{
    grid-template-columns:minmax(0,76px) minmax(0,1fr);
    gap:clamp(18px,3vw,40px);
  }

  .page-about .about-chapter__no{
    align-items:flex-start;
    padding-top:12px;
  }

  .page-about .about-chapter__no::after{
    display:none;
  }

  .page-about .about-contact__row{
    grid-template-columns:120px minmax(0,1fr);
  }

  .page-about .about-contact__row .index-list__meta{
    grid-column:2 / -1;
  }
}

@media (min-width:1024px){
  .page-about .about-layout{
    grid-template-columns:210px minmax(0,1fr);
    gap:clamp(32px,5vw,72px);
  }

  .page-about .about-toc{
    display:block;
    position:sticky;
    top:132px;
    align-self:start;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-about .about-crew__item,
  .page-about .about-contact__row,
  .page-about .about-toc__link,
  .page-about .fold__summary{
    transition:none;
  }
}
<<<END>>>