.page-about {
  --about-narrow: 2fr;
  --about-wide: 10fr;
  --about-gap: clamp(28px, 5vw, 72px);
  background: var(--gx-void);
  color: var(--gx-cream);
}

/* ---------- 通用：编辑式两栏 ---------- */
.page-about .about-aside {
  grid-column: 1 / span 2;
  border-left: 1px solid var(--gx-line);
  padding-left: 18px;
  color: var(--gx-stone);
  transition: color 200ms var(--gx-ease), border-color 200ms var(--gx-ease);
}
.page-about .about-aside:hover {
  color: var(--gx-cream);
  border-left-color: var(--gx-cyan);
}
.page-about .about-aside__index {
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: var(--gx-clay);
  margin: 0 0 6px;
}
.page-about .about-aside:hover .about-aside__index { color: var(--gx-cyan); }
.page-about .about-aside__label {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gx-stone);
  margin: 0 0 14px;
}
.page-about .about-aside__text {
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
}

/* ---------- 首屏 ---------- */
.page-about .about-hero {
  padding-top: clamp(28px, 5vw, 56px);
  padding-bottom: clamp(48px, 8vw, 96px);
  background:
    radial-gradient(ellipse at 12% 8%, rgba(56, 242, 224, 0.10), transparent 55%),
    radial-gradient(ellipse at 88% 92%, rgba(255, 122, 47, 0.10), transparent 60%),
    var(--gx-void);
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-hero__crumbs { margin-bottom: clamp(20px, 3vw, 36px); }
.page-about .about-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
  align-items: start;
}
.page-about .about-hero__lede { max-width: 640px; }
.page-about .about-hero__lede h1 {
  font-family: var(--gx-font-head);
  font-weight: 600;
  font-size: clamp(38px, 6.6vw, 76px);
  line-height: 1.02;
  letter-spacing: 0.01em;
  margin: 12px 0 24px;
  color: var(--gx-cream);
}
.page-about .about-hero__text {
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 56ch;
  margin: 0 0 28px;
}
.page-about .about-hero__meta {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  display: grid;
  gap: 10px;
}
.page-about .about-hero__meta li {
  font-size: 13.5px;
  color: var(--gx-stone);
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.page-about .about-hero__tag {
  font-family: var(--gx-font-num);
  font-size: 12px;
  font-weight: 700;
  color: var(--gx-cyan);
  border: 1px solid var(--gx-line);
  padding: 3px 8px;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.page-about .about-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.page-about .about-hero__media {
  position: relative;
  border: 1px solid var(--gx-line);
  overflow: hidden;
  aspect-ratio: 16 / 10;
}
.page-about .about-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.9);
}
.page-about .about-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5, 7, 13, 0) 45%, rgba(5, 7, 13, 0.78) 100%);
  pointer-events: none;
}
.page-about .about-hero__media .gx-media__cap { position: absolute; left: 16px; right: 16px; bottom: 12px; }

/* ---------- 起点 ---------- */
.page-about .about-origin {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-origin__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-origin__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-origin__body p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-origin__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
  margin-top: 34px;
}
.page-about .about-origin__stat {
  background: var(--gx-panel);
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: background 180ms var(--gx-ease), box-shadow 180ms var(--gx-ease);
}
.page-about .about-origin__stat:hover {
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-origin__num {
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: clamp(32px, 4vw, 44px);
  line-height: 1;
  color: var(--gx-cyan);
  letter-spacing: -0.02em;
}
.page-about .about-origin__stat:nth-child(2) .about-origin__num { color: var(--gx-pulse); }
.page-about .about-origin__stat:nth-child(3) .about-origin__num { color: var(--gx-whistle); }
.page-about .about-origin__unit {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-origin__cap {
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--gx-stone);
  margin-top: 8px;
}

/* ---------- 时间轴 ---------- */
.page-about .about-timeline {
  padding: clamp(48px, 8vw, 104px) 0;
  background: var(--gx-void);
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-timeline__lede {
  color: var(--gx-stone);
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.8;
  margin: 0 0 40px;
}
.page-about .about-timeline__wrap {
  position: relative;
  padding: 20px 0 0;
}
.page-about .about-timeline__svg {
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.85;
}
.page-about .about-timeline__nodes {
  list-style: none;
  padding: 0;
  margin: -140px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 18px 12px;
  position: relative;
  z-index: 1;
}
.page-about .about-timeline__node {
  position: relative;
  padding: 18px 12px 16px;
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  cursor: default;
  outline: none;
  transition: transform 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease), border-color 200ms var(--gx-ease), background 200ms var(--gx-ease);
}
.page-about .about-timeline__node:hover,
.page-about .about-timeline__node:focus-visible {
  transform: translateY(-4px);
  border-color: var(--gx-cyan);
  box-shadow: 0 0 0 1px var(--gx-cyan), 0 12px 26px rgba(0, 0, 0, 0.55);
  background: #101A2E;
}
.page-about .about-timeline__node:focus-visible { outline: 2px solid var(--gx-cyan); outline-offset: 3px; }
.page-about .about-timeline__node--key { border-color: var(--gx-clay); }
.page-about .about-timeline__node--key .about-timeline__year { color: var(--gx-pulse); }
.page-about .about-timeline__dot {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gx-cyan);
  box-shadow: 0 0 12px rgba(56, 242, 224, 0.8);
  margin-bottom: 10px;
}
.page-about .about-timeline__node--key .about-timeline__dot {
  background: var(--gx-pulse);
  box-shadow: 0 0 14px rgba(255, 122, 47, 0.85);
}
.page-about .about-timeline__year {
  display: block;
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.01em;
  color: var(--gx-cream);
  margin-bottom: 8px;
}
.page-about .about-timeline__desc {
  display: block;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--gx-stone);
}
.page-about .about-timeline__node:hover .about-timeline__desc,
.page-about .about-timeline__node:focus-visible .about-timeline__desc { color: var(--gx-cream); }

/* ---------- 团队 ---------- */
.page-about .about-team {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
  background:
    radial-gradient(ellipse at 80% 0%, rgba(56, 242, 224, 0.06), transparent 55%),
    var(--gx-void);
}
.page-about .about-team__intro { max-width: 720px; margin-bottom: 36px; }
.page-about .about-team__intro p {
  color: var(--gx-stone);
  font-size: 15.5px;
  line-height: 1.85;
  max-width: 62ch;
}
.page-about .about-team__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
  margin-bottom: 40px;
}
.page-about .about-team__card {
  background: var(--gx-panel);
  padding: 26px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease), background 200ms var(--gx-ease);
}
.page-about .about-team__card:hover {
  transform: translateY(-4px);
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-team__idx {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.22em;
  color: var(--gx-cyan);
  margin: 0;
}
.page-about .about-team__title {
  font-family: var(--gx-font-head);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.01em;
  margin: 0;
  color: var(--gx-cream);
}
.page-about .about-team__desc {
  font-size: 14px;
  line-height: 1.8;
  color: var(--gx-stone);
  margin: 0;
}
.page-about .about-team__note {
  font-family: var(--gx-font-num);
  font-size: 11.5px;
  color: var(--gx-whistle);
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid var(--gx-line);
}
.page-about .about-team__media {
  border: 1px solid var(--gx-line);
  overflow: hidden;
  margin: 0;
}
.page-about .about-team__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 10 / 7;
  object-fit: cover;
}

/* ---------- 数据来源 ---------- */
.page-about .about-source {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-source__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-source__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-source__body > p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-flow {
  list-style: none;
  padding: 0;
  margin: 30px 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  counter-reset: aboutFlow;
}
.page-about .about-flow__step {
  position: relative;
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  padding: 18px 20px 18px 26px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: border-color 200ms var(--gx-ease), transform 200ms var(--gx-ease);
}
.page-about .about-flow__step::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--gx-cyan);
}
.page-about .about-flow__step--end::before { background: var(--gx-pulse); }
.page-about .about-flow__step:hover {
  transform: translateY(-4px);
  border-color: var(--gx-cyan);
}
.page-about .about-flow__stage {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-flow__step strong {
  font-family: var(--gx-font-head);
  font-size: 19px;
  font-weight: 600;
  color: var(--gx-cream);
  letter-spacing: 0.01em;
}
.page-about .about-flow__hint {
  font-size: 13px;
  line-height: 1.7;
  color: var(--gx-stone);
}
.page-about .about-source__foot {
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--gx-stone);
  border-top: 1px solid var(--gx-line);
  padding-top: 18px;
}
.page-about .about-source__foot a { color: var(--gx-cyan); text-decoration: none; border-bottom: 1px solid rgba(56, 242, 224, 0.4); }
.page-about .about-source__foot a:hover { color: var(--gx-cream); border-bottom-color: var(--gx-cream); }

/* ---------- 产品线 ---------- */
.page-about .about-lines {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-lines__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-lines__item {
  background: var(--gx-panel);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: background 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease);
}
.page-about .about-lines__item:hover {
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-lines__no {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  color: var(--gx-clay);
  margin: 0;
}
.page-about .about-lines__item h3 {
  font-family: var(--gx-font-head);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--gx-cream);
  margin: 0;
}
.page-about .about-lines__item p {
  font-size: 14px;
  line-height: 1.85;
  color: var(--gx-stone);
  margin: 0;
}
.page-about .about-lines__link a {
  font-family: var(--gx-font-num);
  font-size: 12.5px;
  color: var(--gx-cyan);
  text-decoration: none;
  letter-spacing: 0.02em;
  border-bottom: 1px solid rgba(56, 242, 224, 0.35);
  padding-bottom: 2px;
  transition: color 180ms var(--gx-ease), border-color 180ms var(--gx-ease);
}
.page-about .about-lines__link a:hover {
  color: var(--gx-pulse);
  border-bottom-color: var(--gx-pulse);
}

/* ---------- 合作 ---------- */
.page-about .about-partners {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
  background:
    radial-gradient(ellipse at 20% 100%, rgba(180, 98, 60, 0.10), transparent 55%),
    var(--gx-void);
}
.page-about .about-partners__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-partners__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-partners__body p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-partners__body a { color: var(--gx-cyan); text-decoration: none; border-bottom: 1px solid rgba(56, 242, 224, 0.4); }
.page-about .about-partners__body a:hover { color: var(--gx-cream); border-bottom-color: var(--gx-cream); }
.page-about .about-partners__facts {
  list-style: none;
  padding: 0;
  margin: 30px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-partners__facts li {
  background: var(--gx-panel);
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.page-about .about-partners__facts strong {
  font-family: var(--gx-font-num);
  font-size: 26px;
  font-weight: 700;
  color: var(--gx-cyan);
  letter-spacing: -0.01em;
}
.page-about .about-partners__facts li:nth-child(2) strong { color: var(--gx-whistle); }
.page-about .about-partners__facts li:nth-child(3) strong { color: var(--gx-pulse); }
.page-about .about-partners__facts span {
  font-size: 12.5px;
  color: var(--gx-stone);
  line-height: 1.6;
}
.page-about .about-partners__panel {
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  padding: 24px 22px;
  align-self: start;
}
.page-about .about-partners__panel-label {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gx-stone);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-partners__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}
.page-about .about-partners__list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--gx-stone);
}
.page-about .about-partners__list .gx-tag { flex: 0 0 auto; }

/* ---------- 本地服务 ---------- */
.page-about .about-local {
  padding: clamp(48px, 8vw, 104px) 0 clamp(56px, 9vw, 120px);
}
.page-about .about-local__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}
.page-about .about-local__media {
  border: 1px solid var(--gx-line);
  overflow: hidden;
  margin: 0;
}
.page-about .about-local__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 12 / 7;
  object-fit: cover;
}
.page-about .about-local__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-local__body > p {
  font-size: 15px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 60ch;
  margin: 0 0 16px;
}
.page-about .about-local__contact {
  margin: 28px 0 0;
  display: grid;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-local__contact > div {
  background: var(--gx-panel);
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.page-about .about-local__contact dt {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-local__contact dd {
  margin: 0;
  font-size: 14px;
  color: var(--gx-cream);
  line-height: 1.6;
  word-break: break-word;
}

/* ---------- 平板 ---------- */
@media (min-width: 720px) {
  .page-about .about-hero__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  }
  .page-about .about-origin__shell,
  .page-about .about-source__shell {
    grid-template-columns: 3fr 9fr;
  }
  .page-about .about-team__grid { grid-template-columns: repeat(3, 1fr); }
  .page-about .about-lines__grid { grid-template-columns: repeat(3, 1fr); }
  .page-about .about-partners__shell {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  }
  .page-about .about-local__shell {
    grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
  }
  .page-about .about-local__contact > div {
    grid-template-columns: 120px 1fr;
    align-items: baseline;
    gap: 12px;
  }
  .page-about .about-flow {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ---------- 桌面 ---------- */
@media (min-width: 1080px) {
  .page-about .about-origin__shell,
  .page-about .about-source__shell {
    grid-template-columns: 2fr 10fr;
    gap: clamp(40px, 6vw, 88px);
  }
  .page-about .about-timeline__nodes {
    margin-top: -150px;
  }
  .page-about .about-hero__grid {
    gap: clamp(40px, 6vw, 84px);
  }
}

/* ---------- 降低动效 ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-about .about-timeline__node,
  .page-about .about-team__card,
  .page-about .about-flow__step,
  .page-about .about-origin__stat {
    transition: none;
  }
  .page-about .about-timeline__node:hover,
  .page-about .about-timeline__node:focus-visible,
  .page-about .about-team__card:hover,
  .page-about .about-flow__step:hover {
    transform: none;
  }
}
</main>
<<<END>>>

等等，我在输出末尾写了 `</main>`，这不对。主 HTML 应以 `</main>` 结束，之后不应再有别的。让我只输出标记及其内容。

而且我犯了一个错误——PAGE_CSS 块里也包含了 `</main>`。让我修正。

实际上，重新读一遍：main_html 应以 `</main>` 结束。然后 PAGE_CSS 标记应包含 CSS。我意外把 `</main>` 放进了 CSS 里。

让我只输出标记及其内容。
<main id="main-content" class="page-about">

  <!-- ============ 首屏 ============ -->
  <section class="gx-section about-hero" aria-labelledby="about-title">
    <div class="gx-shell about-hero__shell">
      <nav class="gx-crumbs about-hero__crumbs" aria-label="当前位置">
        <span class="gx-crumbs__item"><a href="/">首页</a></span>
        <span class="gx-crumbs__item" aria-current="page">品牌中心</span>
      </nav>

      <div class="about-hero__grid">
        <div class="about-hero__lede">
          <p class="gx-eyebrow">BRAND / 品牌中心</p>
          <h1 id="about-title">把补时读秒变成可以反复查看的赛季资源</h1>
          <p class="about-hero__text">
            星空赛场从 2018 赛季开始只做一件事：把中超、中甲、足协杯每一场的补时时长、角球分布与出场时间记录下来，整理成球迷、内容团队和俱乐部数据岗都能直接使用的东西。您不需要在赛后翻遍视频找那一两分钟的补时，我们已经把它留在了数据里。
          </p>
          <ul class="about-hero__meta">
            <li><span class="about-hero__tag">2018 — 2024</span> 七个赛季连续记录</li>
            <li><span class="about-hero__tag">1680+</span> 场赛事纳入统计</li>
            <li><span class="about-hero__tag">40+</span> 支球队持续跟踪</li>
          </ul>
          <div class="about-hero__actions">
            <a class="gx-btn gx-btn--primary" href="/projects/">查看数据服务</a>
            <a class="gx-btn gx-btn--ghost" href="/feedback/">洽谈合作</a>
          </div>
        </div>

        <figure class="about-hero__media gx-media">
          <img src="{zhanqunpic:h:800w:1600}" width="1600" height="800" alt="夜间球场看台剪影与星空渐变天色，画面下缘可见草皮与灯光边缘" decoding="async">
          <figcaption class="gx-media__cap">夜色球场 · 三个赛事级别 · 单一补时记录体系</figcaption>
        </figure>
      </div>
    </div>
  </section>

  <!-- ============ 起点 ============ -->
  <section class="gx-section about-origin" aria-labelledby="about-origin-title">
    <div class="gx-shell about-origin__shell">
      <aside class="about-aside">
        <p class="about-aside__index">01</p>
        <p class="about-aside__label">起点</p>
        <p class="about-aside__text">比分会归档，补时容易被忽略。我们选择把最容易被忽略的那部分留下。</p>
      </aside>

      <div class="about-origin__body">
        <h2 class="gx-section__head" id="about-origin-title">从一场补时读秒开始的专注</h2>
        <p>
          做补时数据的念头来自一个很具体的场景：一名球迷想知道球队在主场的平均补时是不是真的比别人长，翻遍赛后统计却找不到现成的答案。比分有人记，射门有人记，偏偏补时这种直接决定比赛节奏的数据没人认真收集。
        </p>
        <p>
          我们因此从 2018 赛季开始逐场记录补时时长。它看起来只是一个数字，但拉开七个赛季后，它会变成一种阅读比赛的方式——哪支球队在补时阶段被追平、哪个场馆的补时明显偏长、哪些轮次的补时集中出现在下半场。这些结论都不是靠印象，而是靠每场都记录下来才能浮现的。
        </p>
        <p>
          专注一件事带来的好处很直接：您在任何时间点看到的补时数据，都来自同一套记录习惯，而不是不同赛季用不同方法拼出来的结果。
        </p>

        <div class="about-origin__stats" role="list">
          <div class="about-origin__stat" role="listitem">
            <span class="about-origin__num">12740</span>
            <span class="about-origin__unit">分钟</span>
            <span class="about-origin__cap">2018–2024 赛季累计录得的补时总量</span>
          </div>
          <div class="about-origin__stat" role="listitem">
            <span class="about-origin__num">3</span>
            <span class="about-origin__unit">项赛事</span>
            <span class="about-origin__cap">中超、中甲、足协杯并行记录</span>
          </div>
          <div class="about-origin__stat" role="listitem">
            <span class="about-origin__num">2</span>
            <span class="about-origin__unit">小时</span>
            <span class="about-origin__cap">终场哨响后复盘发布窗口</span>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- ============ 赛季时间轴 ============ -->
  <section class="gx-section about-timeline" aria-labelledby="about-timeline-title">
    <div class="gx-shell">
      <p class="gx-eyebrow">SEASONS / 赛季覆盖</p>
      <h2 class="gx-section__head" id="about-timeline-title">七个赛季的累积轨迹</h2>
      <p class="about-timeline__lede">
        从单赛季试录到三项赛事并行，每一年的记录范围都在扩大。把鼠标停在节点上可以查看该赛季的覆盖情况，也可以用 Tab 键依次查看。
      </p>

      <div class="about-timeline__wrap">
        <svg class="about-timeline__svg" viewBox="0 0 1200 260" role="img" aria-label="2018 至 2024 赛季覆盖扩展示意斜向时间轴">
          <defs>
            <linearGradient id="aboutTl" x1="0" y1="0" x2="1" y2="0">
              <stop offset="0" stop-color="#B4623C" stop-opacity="0.85"/>
              <stop offset="0.55" stop-color="#38F2E0" stop-opacity="0.9"/>
              <stop offset="1" stop-color="#FF7A2F" stop-opacity="0.95"/>
            </linearGradient>
          </defs>
          <line x1="40" y1="200" x2="1160" y2="60" stroke="url(#aboutTl)" stroke-width="2"/>
        </svg>

        <ol class="about-timeline__nodes">
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2018</span>
            <span class="about-timeline__desc">起步赛季，先记录中超单一线索的补时时长，用于验证记录方式是否可行。</span>
          </li>
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2019</span>
            <span class="about-timeline__desc">纳入中甲，记录维度扩展到上下半场分别记录。</span>
          </li>
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2020</span>
            <span class="about-timeline__desc">足协杯加入记录范围，形成三项赛事的基础数据架构。</span>
          </li>
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2021</span>
            <span class="about-timeline__desc">引入双来源比对流程，赛果同步标注裁判与场馆。</span>
          </li>
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2022</span>
            <span class="about-timeline__desc">出场时间进入复盘产品线，换人节点与补时表现并列展示。</span>
          </li>
          <li class="about-timeline__node" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2023</span>
            <span class="about-timeline__desc">推出赛季订阅，观察、分析、机构三档并行服务。</span>
          </li>
          <li class="about-timeline__node about-timeline__node--key" tabindex="0">
            <span class="about-timeline__dot"></span>
            <span class="about-timeline__year">2024</span>
            <span class="about-timeline__desc">球队、轮次、半场三条下钻路径成型，支持历史赛季回溯查询。</span>
          </li>
        </ol>
      </div>
    </div>
  </section>

  <!-- ============ 团队分工 ============ -->
  <section class="gx-section about-team" aria-labelledby="about-team-title">
    <div class="gx-shell about-team__shell">
      <div class="about-team__intro">
        <p class="gx-eyebrow">TEAM / 团队</p>
        <h2 class="gx-section__head" id="about-team-title">24 人专职团队，分三个小组推进每一场比赛</h2>
        <p>
          赛场上的补时只有几分钟，落到数据上要经过采集、校对、复盘三道环节。为了不让某一环成为瓶颈，我们把团队分成三个小组，每个小组对一个环节负责，环节之间互相验证。
        </p>
      </div>

      <div class="about-team__grid">
        <article class="about-team__card" data-reveal>
          <p class="about-team__idx">A-01</p>
          <h3 class="about-team__title">采集组</h3>
          <p class="about-team__desc">负责每场比赛的现场记录与官方信息收集，逐场登记补时时长、角球次数与首发名单，形成原始数据层。</p>
          <p class="about-team__note">覆盖赛程内所有比赛，不挑场次</p>
        </article>

        <article class="about-team__card" data-reveal>
          <p class="about-team__idx">A-02</p>
          <h3 class="about-team__title">校对组</h3>
          <p class="about-team__desc">对采集结果与官方公告进行比对，发现差异后进入复核队列，确认后才允许入库，避免错误留下来。</p>
          <p class="about-team__note">差异项三个工作日内出复核结论</p>
        </article>

        <article class="about-team__card" data-reveal>
          <p class="about-team__idx">A-03</p>
          <h3 class="about-team__title">复盘组</h3>
          <p class="about-team__desc">围绕补时、角球与出场时间撰写赛后复盘，在终场两小时内发布，附带关键事件时间轴。</p>
          <p class="about-team__note">轮次结束后当天完成条目整理</p>
        </article>
      </div>

      <figure class="about-team__media gx-media gx-media--wide">
        <img src="{zhanqunpic:h:700w:1000}" width="1000" height="700" alt="多屏并列的数据工作台抽象画面，屏幕显示光点与表格网格" loading="lazy" decoding="async">
        <figcaption class="gx-media__cap">采集、校对、复盘三组并列推进，同一场比赛由不同角色交叉确认</figcaption>
      </figure>
    </div>
  </section>

  <!-- ============ 数据来源与校对 ============ -->
  <section class="gx-section about-source" aria-labelledby="about-source-title">
    <div class="gx-shell about-source__shell">
      <aside class="about-aside">
        <p class="about-aside__index">02</p>
        <p class="about-aside__label">流程</p>
        <p class="about-aside__text">两个来源，一个结果。任一处对不上，就进入复核队列，而不是直接采用其中一个。</p>
      </aside>

      <div class="about-source__body">
        <h2 class="gx-section__head" id="about-source-title">数据从两份材料汇成一份记录</h2>
        <p>
          每场比赛结束后，我们同时拿到两份材料：一份来自官方公告，一份来自现场的记录。两组信息逐项比对，比赛时间、补时、角球数、出场球员与换人节点都会过一遍。两份对上了才写进正式数据。
        </p>
        <p>
          比对时出现差异并不少见。差异项由校对组复核，结合现场记录、转播信息与场馆通报还原，形成最终结论后才入库。您看到的任何一场补时数据，背后至少经历过这一轮核对。
        </p>

        <ol class="about-flow">
          <li class="about-flow__step">
            <span class="about-flow__stage">来源</span>
            <strong>官方公告 + 现场记录</strong>
            <span class="about-flow__hint">两条独立渠道同时进入比对流程</span>
          </li>
          <li class="about-flow__step">
            <span class="about-flow__stage">比对</span>
            <strong>逐项字段交叉</strong>
            <span class="about-flow__hint">补时、角球、出场时间、换人节点逐条比对</span>
          </li>
          <li class="about-flow__step">
            <span class="about-flow__stage">复核</span>
            <strong>差异项单独处理</strong>
            <span class="about-flow__hint">由校对组给出结论，三个工作日内出结果</span>
          </li>
          <li class="about-flow__step about-flow__step--end">
            <span class="about-flow__stage">入库</span>
            <strong>正式数据形成</strong>
            <span class="about-flow__hint">进入球队、轮次、半场三条查询路径</span>
          </li>
        </ol>

        <p class="about-source__foot">
          如果您在使用中发现某场比赛的结果与您的印象不符，可以把截图发到 <a href="/feedback/">反馈与联系</a>，我们会对该场次重新复核。
        </p>
      </div>
    </div>
  </section>

  <!-- ============ 产品线与服务 ============ -->
  <section class="gx-section about-lines" aria-labelledby="about-lines-title">
    <div class="gx-shell">
      <p class="gx-eyebrow">SERVICES / 服务内容</p>
      <h2 class="gx-section__head" id="about-lines-title">三条数据线，对应三种看比赛的方式</h2>

      <div class="about-lines__grid">
        <article class="about-lines__item" data-reveal>
          <p class="about-lines__no">L-01</p>
          <h3>补时记录</h3>
          <p>按赛事、球队与轮次记录补时时长，可以查单场，也可以把整个赛季拉出来看趋势。适合关心球队在关键阶段表现的球迷和内容团队。</p>
          <p class="about-lines__link"><a href="/">了解补时数据 →</a></p>
        </article>

        <article class="about-lines__item" data-reveal>
          <p class="about-lines__no">L-02</p>
          <h3>角球与订阅</h3>
          <p>角球统计按主客队与上下半场分列，支持球队与轮次两个维度交叉筛选。赛季订阅每周两次推送复盘摘要与关键数据。</p>
          <p class="about-lines__link"><a href="/projects/">查看数据与订阅 →</a></p>
        </article>

        <article class="about-lines__item" data-reveal>
          <p class="about-lines__no">L-03</p>
          <h3>出场时间复盘</h3>
          <p>围绕球员出场分钟、换人节点与补时阶段表现展开，终场后两小时内发布，附带关键事件时间轴，方便回溯整场节奏。</p>
          <p class="about-lines__link"><a href="/updates/">浏览复盘与更新 →</a></p>
        </article>
      </div>
    </div>
  </section>

  <!-- ============ 合作 ============ -->
  <section class="gx-section about-partners" aria-labelledby="about-partners-title">
    <div class="gx-shell about-partners__shell">
      <div class="about-partners__body">
        <h2 class="gx-section__head" id="about-partners-title">与地方媒体、球迷社群的长期配合</h2>
        <p>
          目前与 12 家地方体育媒体、6 家球迷社群平台保持内容合作。合作方式以数据授权与联合栏目为主：媒体侧可以直接引用我们的补时与角球数据支撑赛事报道，球迷社群则通过周度摘要与赛季盘点与读者互动。
        </p>
        <p>
          如果您所在的机构需要长期使用这些数据，或者希望与我们一起做一个围绕联赛节奏的专栏，可以从 <a href="/feedback/">反馈与联系</a> 的沟通入口说明使用场景，我们会据此推荐合适的订阅档或合作方式。
        </p>

        <ul class="about-partners__facts">
          <li><strong>12 家</strong><span>地方体育媒体内容合作方</span></li>
          <li><strong>6 家</strong><span>球迷社群平台联合栏目</span></li>
          <li><strong>1 次/年</strong><span>赛季数据年鉴汇总发布</span></li>
        </ul>
      </div>

      <div class="about-partners__panel">
        <p class="about-partners__panel-label">合作场景</p>
        <ul class="about-partners__list">
          <li><span class="gx-tag gx-tag--live">媒体</span> 赛事报道引用补时与角球数据</li>
          <li><span class="gx-tag gx-tag--live">社群</span> 周度摘要与赛季盘点联合栏目</li>
          <li><span class="gx-tag gx-tag--key">机构</span> 按赛季导出完整赛事数据</li>
          <li><span class="gx-tag gx-tag--pending">持续</span> 围绕赛季节奏的专题内容共建</li>
        </ul>
      </div>
    </div>
  </section>

  <!-- ============ 本地服务 ============ -->
  <section class="gx-section about-local" aria-labelledby="about-local-title">
    <div class="gx-shell about-local__shell">
      <figure class="about-local__media gx-media gx-media--wide">
        <img src="{zhanqunpic:h:700w:1200}" width="1200" height="700" alt="城市夜景与球场灯光远眺的抽象合成画面，冷蓝基调" loading="lazy" decoding="async">
        <figcaption class="gx-media__cap">江西团队日常处理订阅咨询、数据纠错与接入支持</figcaption>
      </figure>

      <div class="about-local__body">
        <p class="gx-eyebrow">LOCAL / 本地服务</p>
        <h2 class="gx-section__head" id="about-local-title">在江西本地设有服务团队</h2>
        <p>
          我们的服务团队在江西南昌，客服与数据人员按工作日时段响应。订阅开通、推送异常、数据差异核实、机构接入这几类问题都可以直接找我们，工作日 9:00 至 18:00 内会有对应角色接手。
        </p>
        <p>
          涉及账号或订阅的咨询，建议附上订阅邮箱与截图，方便我们快速定位；如果是数据纠错，请说明具体场次与字段，复核组会跟进确认。
        </p>

        <dl class="about-local__contact">
          <div>
            <dt>客服邮箱</dt>
            <dd>contact@galaxy-xingkongstar.com.cn</dd>
          </div>
          <div>
            <dt>服务电话</dt>
            <dd>400-3126-5581</dd>
          </div>
          <div>
            <dt>服务地点</dt>
            <dd>江西省南昌市红谷滩区绿茵路88号星空体育中心A座12层</dd>
          </div>
        </dl>
      </div>
    </div>
  </section>

</main>

.page-about {
  --about-aside-w: 2fr;
  --about-body-w: 10fr;
  --about-gap: clamp(28px, 5vw, 72px);
  background: var(--gx-void);
  color: var(--gx-cream);
}

/* ---------- 编辑式窄栏 ---------- */
.page-about .about-aside {
  border-left: 1px solid var(--gx-line);
  padding-left: 18px;
  color: var(--gx-stone);
  transition: color 200ms var(--gx-ease), border-color 200ms var(--gx-ease);
}
.page-about .about-aside:hover {
  color: var(--gx-cream);
  border-left-color: var(--gx-cyan);
}
.page-about .about-aside__index {
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: var(--gx-clay);
  margin: 0 0 6px;
  transition: color 200ms var(--gx-ease);
}
.page-about .about-aside:hover .about-aside__index { color: var(--gx-cyan); }
.page-about .about-aside__label {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gx-stone);
  margin: 0 0 14px;
}
.page-about .about-aside__text {
  font-size: 13px;
  line-height: 1.8;
  margin: 0;
}

/* ---------- 首屏 ---------- */
.page-about .about-hero {
  padding-top: clamp(28px, 5vw, 56px);
  padding-bottom: clamp(48px, 8vw, 96px);
  background:
    radial-gradient(ellipse at 12% 8%, rgba(56, 242, 224, 0.10), transparent 55%),
    radial-gradient(ellipse at 88% 92%, rgba(255, 122, 47, 0.10), transparent 60%),
    var(--gx-void);
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-hero__crumbs { margin-bottom: clamp(20px, 3vw, 36px); }
.page-about .about-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
  align-items: start;
}
.page-about .about-hero__lede { max-width: 680px; }
.page-about .about-hero__lede h1 {
  font-family: var(--gx-font-head);
  font-weight: 600;
  font-size: clamp(38px, 6.6vw, 76px);
  line-height: 1.02;
  letter-spacing: 0.01em;
  margin: 12px 0 24px;
  color: var(--gx-cream);
}
.page-about .about-hero__text {
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 56ch;
  margin: 0 0 28px;
}
.page-about .about-hero__meta {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  display: grid;
  gap: 10px;
}
.page-about .about-hero__meta li {
  font-size: 13.5px;
  color: var(--gx-stone);
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.page-about .about-hero__tag {
  font-family: var(--gx-font-num);
  font-size: 12px;
  font-weight: 700;
  color: var(--gx-cyan);
  border: 1px solid var(--gx-line);
  padding: 3px 8px;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.page-about .about-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.page-about .about-hero__media {
  position: relative;
  border: 1px solid var(--gx-line);
  overflow: hidden;
  aspect-ratio: 16 / 10;
  margin: 0;
}
.page-about .about-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.92);
}
.page-about .about-hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5, 7, 13, 0) 45%, rgba(5, 7, 13, 0.78) 100%);
  pointer-events: none;
}
.page-about .about-hero__media .gx-media__cap {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 12px;
}

/* ---------- 起点 ---------- */
.page-about .about-origin {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-origin__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-origin__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-origin__body > p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-origin__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
  margin-top: 34px;
}
.page-about .about-origin__stat {
  background: var(--gx-panel);
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: background 180ms var(--gx-ease), box-shadow 180ms var(--gx-ease);
}
.page-about .about-origin__stat:hover {
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-origin__num {
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: clamp(32px, 4vw, 44px);
  line-height: 1;
  color: var(--gx-cyan);
  letter-spacing: -0.02em;
}
.page-about .about-origin__stat:nth-child(2) .about-origin__num { color: var(--gx-pulse); }
.page-about .about-origin__stat:nth-child(3) .about-origin__num { color: var(--gx-whistle); }
.page-about .about-origin__unit {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-origin__cap {
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--gx-stone);
  margin-top: 8px;
}

/* ---------- 时间轴 ---------- */
.page-about .about-timeline {
  padding: clamp(48px, 8vw, 104px) 0;
  background: var(--gx-void);
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-timeline__lede {
  color: var(--gx-stone);
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.8;
  margin: 0 0 40px;
}
.page-about .about-timeline__wrap {
  position: relative;
  padding: 20px 0 0;
}
.page-about .about-timeline__svg {
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.9;
}
.page-about .about-timeline__nodes {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 12px;
  position: relative;
  z-index: 1;
}
.page-about .about-timeline__node {
  position: relative;
  padding: 18px 14px 16px;
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  outline: none;
  transition: transform 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease),
    border-color 200ms var(--gx-ease), background 200ms var(--gx-ease);
}
.page-about .about-timeline__node:hover,
.page-about .about-timeline__node:focus-visible {
  transform: translateY(-4px);
  border-color: var(--gx-cyan);
  box-shadow: 0 0 0 1px var(--gx-cyan), 0 12px 26px rgba(0, 0, 0, 0.55);
  background: #101A2E;
}
.page-about .about-timeline__node:focus-visible {
  outline: 2px solid var(--gx-cyan);
  outline-offset: 3px;
}
.page-about .about-timeline__node--key { border-color: var(--gx-clay); }
.page-about .about-timeline__node--key .about-timeline__year { color: var(--gx-pulse); }
.page-about .about-timeline__dot {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gx-cyan);
  box-shadow: 0 0 12px rgba(56, 242, 224, 0.8);
  margin-bottom: 10px;
}
.page-about .about-timeline__node--key .about-timeline__dot {
  background: var(--gx-pulse);
  box-shadow: 0 0 14px rgba(255, 122, 47, 0.85);
}
.page-about .about-timeline__year {
  display: block;
  font-family: var(--gx-font-num);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.01em;
  color: var(--gx-cream);
  margin-bottom: 8px;
}
.page-about .about-timeline__desc {
  display: block;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--gx-stone);
  transition: color 200ms var(--gx-ease);
}
.page-about .about-timeline__node:hover .about-timeline__desc,
.page-about .about-timeline__node:focus-visible .about-timeline__desc {
  color: var(--gx-cream);
}

/* ---------- 团队 ---------- */
.page-about .about-team {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
  background:
    radial-gradient(ellipse at 80% 0%, rgba(56, 242, 224, 0.06), transparent 55%),
    var(--gx-void);
}
.page-about .about-team__intro { max-width: 760px; margin-bottom: 36px; }
.page-about .about-team__intro p {
  color: var(--gx-stone);
  font-size: 15.5px;
  line-height: 1.85;
  max-width: 62ch;
  margin: 0;
}
.page-about .about-team__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
  margin-bottom: 40px;
}
.page-about .about-team__card {
  background: var(--gx-panel);
  padding: 26px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease),
    background 200ms var(--gx-ease);
}
.page-about .about-team__card:hover {
  transform: translateY(-4px);
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-team__idx {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.22em;
  color: var(--gx-cyan);
  margin: 0;
}
.page-about .about-team__title {
  font-family: var(--gx-font-head);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.01em;
  margin: 0;
  color: var(--gx-cream);
}
.page-about .about-team__desc {
  font-size: 14px;
  line-height: 1.8;
  color: var(--gx-stone);
  margin: 0;
}
.page-about .about-team__note {
  font-family: var(--gx-font-num);
  font-size: 11.5px;
  color: var(--gx-whistle);
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid var(--gx-line);
}
.page-about .about-team__media {
  border: 1px solid var(--gx-line);
  overflow: hidden;
  margin: 0;
}
.page-about .about-team__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 10 / 7;
  object-fit: cover;
}

/* ---------- 数据来源 ---------- */
.page-about .about-source {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-source__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-source__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-source__body > p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-flow {
  list-style: none;
  padding: 0;
  margin: 30px 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.page-about .about-flow__step {
  position: relative;
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  padding: 18px 20px 18px 26px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  transition: border-color 200ms var(--gx-ease), transform 200ms var(--gx-ease);
}
.page-about .about-flow__step::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--gx-cyan);
}
.page-about .about-flow__step--end::before { background: var(--gx-pulse); }
.page-about .about-flow__step:hover {
  transform: translateY(-4px);
  border-color: var(--gx-cyan);
}
.page-about .about-flow__stage {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-flow__step strong {
  font-family: var(--gx-font-head);
  font-size: 19px;
  font-weight: 600;
  color: var(--gx-cream);
  letter-spacing: 0.01em;
}
.page-about .about-flow__hint {
  font-size: 13px;
  line-height: 1.7;
  color: var(--gx-stone);
}
.page-about .about-source__foot {
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--gx-stone);
  border-top: 1px solid var(--gx-line);
  padding-top: 18px;
  margin: 0;
}
.page-about .about-source__foot a {
  color: var(--gx-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(56, 242, 224, 0.4);
  transition: color 180ms var(--gx-ease), border-color 180ms var(--gx-ease);
}
.page-about .about-source__foot a:hover {
  color: var(--gx-cream);
  border-bottom-color: var(--gx-cream);
}

/* ---------- 产品线 ---------- */
.page-about .about-lines {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-lines__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-lines__item {
  background: var(--gx-panel);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: background 200ms var(--gx-ease), box-shadow 200ms var(--gx-ease);
}
.page-about .about-lines__item:hover {
  background: #101A2E;
  box-shadow: inset 0 0 0 1px var(--gx-cyan);
}
.page-about .about-lines__no {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  color: var(--gx-clay);
  margin: 0;
}
.page-about .about-lines__item h3 {
  font-family: var(--gx-font-head);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--gx-cream);
  margin: 0;
}
.page-about .about-lines__item p {
  font-size: 14px;
  line-height: 1.85;
  color: var(--gx-stone);
  margin: 0;
}
.page-about .about-lines__link { margin-top: auto; }
.page-about .about-lines__link a {
  font-family: var(--gx-font-num);
  font-size: 12.5px;
  color: var(--gx-cyan);
  text-decoration: none;
  letter-spacing: 0.02em;
  border-bottom: 1px solid rgba(56, 242, 224, 0.35);
  padding-bottom: 2px;
  transition: color 180ms var(--gx-ease), border-color 180ms var(--gx-ease);
}
.page-about .about-lines__link a:hover {
  color: var(--gx-pulse);
  border-bottom-color: var(--gx-pulse);
}

/* ---------- 合作 ---------- */
.page-about .about-partners {
  padding: clamp(48px, 8vw, 104px) 0;
  border-bottom: 1px solid var(--gx-line);
  background:
    radial-gradient(ellipse at 20% 100%, rgba(180, 98, 60, 0.10), transparent 55%),
    var(--gx-void);
}
.page-about .about-partners__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--about-gap);
}
.page-about .about-partners__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-partners__body > p {
  font-size: 15.5px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 62ch;
  margin: 0 0 18px;
}
.page-about .about-partners__body a {
  color: var(--gx-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(56, 242, 224, 0.4);
  transition: color 180ms var(--gx-ease), border-color 180ms var(--gx-ease);
}
.page-about .about-partners__body a:hover {
  color: var(--gx-cream);
  border-bottom-color: var(--gx-cream);
}
.page-about .about-partners__facts {
  list-style: none;
  padding: 0;
  margin: 30px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-partners__facts li {
  background: var(--gx-panel);
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.page-about .about-partners__facts strong {
  font-family: var(--gx-font-num);
  font-size: 26px;
  font-weight: 700;
  color: var(--gx-cyan);
  letter-spacing: -0.01em;
}
.page-about .about-partners__facts li:nth-child(2) strong { color: var(--gx-whistle); }
.page-about .about-partners__facts li:nth-child(3) strong { color: var(--gx-pulse); }
.page-about .about-partners__facts span {
  font-size: 12.5px;
  color: var(--gx-stone);
  line-height: 1.6;
}
.page-about .about-partners__panel {
  background: var(--gx-panel);
  border: 1px solid var(--gx-line);
  padding: 24px 22px;
  align-self: start;
}
.page-about .about-partners__panel-label {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gx-stone);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gx-line);
}
.page-about .about-partners__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
}
.page-about .about-partners__list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--gx-stone);
}
.page-about .about-partners__list .gx-tag { flex: 0 0 auto; }

/* ---------- 本地服务 ---------- */
.page-about .about-local {
  padding: clamp(48px, 8vw, 104px) 0 clamp(56px, 9vw, 120px);
}
.page-about .about-local__shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 4vw, 48px);
  align-items: start;
}
.page-about .about-local__media {
  border: 1px solid var(--gx-line);
  overflow: hidden;
  margin: 0;
}
.page-about .about-local__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 12 / 7;
  object-fit: cover;
}
.page-about .about-local__body h2 {
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.18;
  padding-bottom: 16px;
  margin-bottom: 22px;
}
.page-about .about-local__body > p {
  font-size: 15px;
  line-height: 1.85;
  color: var(--gx-stone);
  max-width: 60ch;
  margin: 0 0 16px;
}
.page-about .about-local__contact {
  margin: 28px 0 0;
  display: grid;
  gap: 1px;
  background: var(--gx-line);
  border: 1px solid var(--gx-line);
}
.page-about .about-local__contact > div {
  background: var(--gx-panel);
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.page-about .about-local__contact dt {
  font-family: var(--gx-font-num);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gx-stone);
}
.page-about .about-local__contact dd {
  margin: 0;
  font-size: 14px;
  color: var(--gx-cream);
  line-height: 1.6;
  word-break: break-word;
}

/* ---------- 平板 ---------- */
@media (min-width: 720px) {
  .page-about .about-hero__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  }
  .page-about .about-origin__shell,
  .page-about .about-source__shell {
    grid-template-columns: 3fr 9fr;
  }
  .page-about .about-team__grid { grid-template-columns: repeat(3, 1fr); }
  .page-about .about-lines__grid { grid-template-columns: repeat(3, 1fr); }
  .page-about .about-partners__shell {
    grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  }
  .page-about .about-local__shell {
    grid-template-columns: minmax(0, 6fr) minmax(0, 6fr);
  }
  .page-about .about-local__contact > div {
    grid-template-columns: 120px 1fr;
    align-items: baseline;
    gap: 12px;
  }
  .page-about .about-flow { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- 桌面 ---------- */
@media (min-width: 1080px) {
  .page-about .about-origin__shell,
  .page-about .about-source__shell {
    grid-template-columns: 2fr 10fr;
    gap: clamp(40px, 6vw, 88px);
  }
  .page-about .about-hero__grid { gap: clamp(40px, 6vw, 84px); }
  .page-about .about-flow { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- 降低动效 ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-about .about-timeline__node,
  .page-about .about-team__card,
  .page-about .about-flow__step,
  .page-about .about-origin__stat,
  .page-about .about-aside {
    transition: none;
  }
  .page-about .about-timeline__node:hover,
  .page-about .about-timeline__node:focus-visible,
  .page-about .about-team__card:hover,
  .page-about .about-flow__step:hover {
    transform: none;
  }
}
