.page-about {
  --ab-line-ink: rgba(20, 24, 28, .16);
  --ab-line-paper: rgba(242, 239, 230, .18);
  --ab-paper-lift: #FBF9F3;
  --ab-moss-light: #A9C0B2;
  --ab-body-soft: rgba(20, 24, 28, .74);
  color: var(--c-ink);
}

/* 面包屑 */
.page-about .ab-crumbs {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0 0 36px;
  padding: 0;
  font-size: var(--fs-7);
  letter-spacing: .06em;
  color: var(--c-moss);
}

.page-about .ab-crumbs li + li::before {
  content: "/";
  padding: 0 8px;
  color: var(--c-stack);
}

.page-about .ab-crumbs a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--ab-line-ink);
}

.page-about .ab-crumbs a:hover {
  color: var(--c-blue);
  border-bottom-color: var(--c-blue);
}

/* 开篇 */
.page-about .ab-open {
  padding: 40px 0 56px;
}

.page-about .ab-open__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
}

.page-about .ab-open__meta {
  margin: 22px 0 0;
  padding-left: 14px;
  border-left: 2px solid var(--c-stack);
  font-family: var(--font-mono);
  font-size: var(--fs-7);
  line-height: 2;
  letter-spacing: .08em;
  color: var(--c-moss);
}

.page-about .ab-open__main h1 {
  margin: 0;
  font-family: var(--font-head);
  font-size: var(--fs-1);
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: .01em;
  color: var(--c-ink);
}

.page-about .ab-open__lead {
  margin: 22px 0 0;
  max-width: 40em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

/* 数字带 */
.page-about .ab-numbers {
  padding: 56px 0;
  color: var(--c-paper);
}

.page-about .ab-numbers__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 22px;
}

.page-about .ab-numbers__item {
  border-top: 1px solid var(--ab-line-paper);
  padding-top: 18px;
}

.page-about .ab-numbers__item .stat {
  display: block;
}

.page-about .ab-numbers__item .stat__num {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(38px, 7vw, 64px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--c-lime);
}

.page-about .ab-numbers__item .stat__unit {
  display: block;
  margin-top: 8px;
  font-size: var(--fs-7);
  letter-spacing: .12em;
  color: var(--ab-moss-light);
}

.page-about .ab-numbers__cap {
  margin: 12px 0 0;
  font-size: var(--fs-7);
  line-height: 1.8;
  color: var(--ab-moss-light);
}

/* 场边视角 */
.page-about .ab-origin {
  padding: 72px 0 64px;
}

.page-about .ab-origin__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}

.page-about .ab-origin__body h2 {
  margin: 0 0 20px;
  font-family: var(--font-head);
  font-size: var(--fs-2);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .02em;
}

.page-about .ab-origin__body p {
  margin: 0 0 18px;
  max-width: 40em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

.page-about .ab-quote {
  margin: 34px 0 0;
  padding: 24px 26px 22px;
  background: var(--ab-paper-lift);
  border: 1px solid var(--c-ink);
  border-left: 4px solid var(--c-flame);
  box-shadow: 8px 8px 0 var(--c-stack);
}

.page-about .ab-quote p {
  margin: 0;
  max-width: 34em;
  font-size: var(--fs-4);
  font-weight: 600;
  line-height: 1.65;
  color: var(--c-ink);
}

.page-about .ab-quote cite {
  display: block;
  margin-top: 14px;
  font-style: normal;
  font-family: var(--font-mono);
  font-size: var(--fs-7);
  letter-spacing: .12em;
  color: var(--c-moss);
}

/* 同步节奏 */
.page-about .ab-sync {
  padding: 0 0 72px;
}

.page-about .ab-sync__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  align-items: center;
}

.page-about .ab-sync__body h2 {
  margin: 16px 0 0;
  font-family: var(--font-head);
  font-size: var(--fs-2);
  line-height: 1.2;
  letter-spacing: .02em;
}

.page-about .ab-sync__body > p {
  margin: 0 0 18px;
  max-width: 38em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

.page-about .ab-pull {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 20px 0 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ab-line-ink);
}

.page-about .ab-pull__num {
  font-family: var(--font-mono);
  font-size: clamp(52px, 11vw, 88px);
  font-weight: 600;
  line-height: .9;
  letter-spacing: -.04em;
  color: var(--c-night);
}

.page-about .ab-pull__unit {
  font-size: var(--fs-7);
  letter-spacing: .16em;
  color: var(--c-moss);
}

/* 复核流程 */
.page-about .ab-check {
  padding: 72px 0;
  color: var(--c-paper);
}

.page-about .ab-check__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: start;
}

.page-about .ab-check__body h2 {
  margin: 16px 0 0;
  font-family: var(--font-head);
  font-size: var(--fs-2);
  line-height: 1.2;
  letter-spacing: .02em;
  color: var(--c-paper);
}

.page-about .ab-check__intro {
  margin: 16px 0 0;
  max-width: 38em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-moss-light);
}

.page-about .ab-steps {
  list-style: none;
  margin: 30px 0 0;
  padding: 0;
}

.page-about .ab-step {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  column-gap: 16px;
  padding: 22px 0;
  border-top: 1px solid var(--ab-line-paper);
}

.page-about .ab-step:last-child {
  border-bottom: 1px solid var(--ab-line-paper);
}

.page-about .ab-step__idx {
  grid-column: 1;
  grid-row: 1 / span 2;
  font-family: var(--font-mono);
  font-size: var(--fs-4);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: var(--c-lime);
}

.page-about .ab-step__title {
  grid-column: 2;
  margin: 0;
  font-family: var(--font-head);
  font-size: var(--fs-4);
  letter-spacing: .05em;
  color: var(--c-paper);
}

.page-about .ab-step p {
  grid-column: 2;
  margin: 8px 0 0;
  font-size: var(--fs-6);
  line-height: 1.8;
  color: var(--ab-moss-light);
}

.page-about .ab-check__note {
  margin: 26px 0 0;
  padding-left: 14px;
  border-left: 2px solid var(--c-lime);
  font-size: var(--fs-7);
  line-height: 1.8;
  color: var(--ab-moss-light);
}

/* 区块头 */
.page-about .ab-head {
  margin-bottom: 38px;
}

.page-about .ab-head h2 {
  margin: 16px 0 0;
  font-family: var(--font-head);
  font-size: var(--fs-2);
  line-height: 1.2;
  letter-spacing: .02em;
}

.page-about .ab-head__lead {
  margin: 14px 0 0;
  max-width: 42em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

.page-about .ab-head--dark h2 {
  color: var(--c-paper);
}

.page-about .ab-head--dark .ab-head__lead {
  color: var(--ab-moss-light);
}

/* 团队分工 */
.page-about .ab-team {
  padding: 72px 0 56px;
}

.page-about .ab-roles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.page-about .ab-role {
  padding: 18px 20px 20px;
  background: var(--ab-paper-lift);
  border: 1px solid var(--c-ink);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}

.page-about .ab-role:hover,
.page-about .ab-role:focus-within {
  transform: translateY(-4px);
  box-shadow: 6px 6px 0 var(--c-stack);
}

.page-about .ab-role__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.page-about .ab-role__name {
  margin: 0;
  font-family: var(--font-head);
  font-size: var(--fs-4);
  letter-spacing: .05em;
}

.page-about .ab-role__num {
  font-family: var(--font-mono);
  font-size: var(--fs-3);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--c-night);
}

.page-about .ab-role__unit {
  margin-left: 4px;
  font-size: var(--fs-7);
  color: var(--c-moss);
}

.page-about .ab-role__track {
  height: 8px;
  margin: 14px 0 12px;
  background: var(--c-stack);
}

.page-about .ab-role__fill {
  display: block;
  height: 100%;
  background: var(--c-night);
}

.page-about .ab-role__fill--collect {
  width: 35.3%;
}

.page-about .ab-role__fill--frontend {
  width: 20.6%;
}

.page-about .ab-role__fill--content {
  width: 17.6%;
}

.page-about .ab-role__fill--support {
  width: 11.8%;
}

.page-about .ab-role__desc {
  margin: 0;
  font-size: var(--fs-6);
  line-height: 1.8;
  color: var(--ab-body-soft);
}

.page-about .ab-team__note {
  margin: 26px 0 0;
  padding-left: 14px;
  border-left: 2px solid var(--c-stack);
  font-size: var(--fs-7);
  line-height: 1.9;
  color: var(--c-moss);
}

.page-about .ab-team__note a,
.page-about .ab-partners__cta a {
  color: var(--c-blue);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

.page-about .ab-team__note a:hover,
.page-about .ab-partners__cta a:hover {
  color: var(--c-flame);
}

/* 合作生态 */
.page-about .ab-partners {
  padding: 0 0 72px;
}

.page-about .ab-partners__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}

.page-about .ab-partner {
  padding: 28px 26px 26px;
}

.page-about .ab-partner__num {
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(44px, 8vw, 68px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.04em;
  color: var(--c-night);
}

.page-about .ab-partner h3 {
  margin: 10px 0 14px;
  font-family: var(--font-head);
  font-size: var(--fs-4);
  letter-spacing: .05em;
}

.page-about .ab-partner p {
  margin: 0 0 18px;
  font-size: var(--fs-6);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

.page-about .ab-partners__cta {
  margin: 28px 0 0;
  font-size: var(--fs-6);
  line-height: 1.9;
  color: var(--ab-body-soft);
}

/* 赛季演进 */
.page-about .ab-seasons {
  padding: 72px 0 80px;
  color: var(--c-paper);
}

.page-about .ab-trend {
  display: block;
  width: 100%;
  height: auto;
  margin: 4px 0 34px;
}

.page-about .ab-trend__line {
  fill: none;
  stroke: var(--c-lime);
  stroke-width: 1.5;
  stroke-dasharray: 7 7;
  opacity: .75;
}

.page-about .ab-trend__dot {
  fill: var(--c-night);
  stroke: var(--c-lime);
  stroke-width: 1.5;
}

.page-about .ab-trend__dot--now {
  fill: var(--c-lime);
}

.page-about .ab-seasons__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--ab-line-paper);
}

.page-about .ab-season {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 16px;
  padding: 22px 0;
  border-bottom: 1px solid var(--ab-line-paper);
}

.page-about .ab-season__idx {
  font-family: var(--font-mono);
  font-size: var(--fs-4);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: var(--c-lime);
}

.page-about .ab-season h3 {
  margin: 0 0 8px;
  font-family: var(--font-head);
  font-size: var(--fs-4);
  letter-spacing: .05em;
  color: var(--c-paper);
}

.page-about .ab-season p {
  margin: 0;
  max-width: 52em;
  font-size: var(--fs-6);
  line-height: 1.85;
  color: var(--ab-moss-light);
}

.page-about .ab-seasons__cap {
  margin: 40px 0 0;
}

/* 下一步 */
.page-about .ab-next {
  padding: 64px 0 72px;
}

.page-about .ab-next__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
}

.page-about .ab-next__body h2 {
  margin: 0 0 14px;
  font-family: var(--font-head);
  font-size: var(--fs-2);
  line-height: 1.2;
  letter-spacing: .02em;
}

.page-about .ab-next__body p {
  margin: 0;
  max-width: 40em;
  font-size: var(--fs-5);
  line-height: 1.85;
  color: var(--ab-body-soft);
}

.page-about .ab-next__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-content: start;
}

/* 图片容器兜底 */
.page-about .media-frame__img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

/* 桌面端 */
@media (min-width: 760px) {
  .page-about .ab-numbers__list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
  }

  .page-about .ab-roles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-about .ab-partners__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .page-about .ab-open {
    padding: 48px 0 72px;
  }

  .page-about .ab-open__grid {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: 56px;
    align-items: start;
  }

  .page-about .ab-origin__grid {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: 56px;
    align-items: start;
  }

  .page-about .ab-sync__grid {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 48px;
  }

  .page-about .ab-check__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 56px;
  }

  .page-about .ab-next__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
    gap: 48px;
    align-items: center;
  }

  .page-about .ab-steps {
    margin-top: 34px;
  }

  .page-about .ab-trend {
    margin-bottom: 42px;
  }
}