.page-about{
  --about-card:rgba(11,42,69,.62);
  --about-card-solid:#0B2A45;
  --about-line:rgba(217,164,65,.24);
  --about-line-soft:rgba(201,213,227,.14);
  --about-pad:clamp(18px,3.2vw,40px);
  background:var(--ink);
  color:var(--ice);
  padding-top:calc(var(--header-h) + 8px);
  padding-bottom:clamp(40px,6vw,84px);
  overflow-x:hidden;
}

.page-about .container{
  width:100%;
  max-width:var(--shell);
  margin:0 auto;
  padding-left:clamp(16px,4vw,32px);
  padding-right:clamp(16px,4vw,32px);
}

/* ---------- 面包屑 ---------- */
.page-about .breadcrumbs{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  max-width:var(--shell);
  margin:0 auto;
  padding:0 clamp(16px,4vw,32px) 14px;
  font-size:13px;
  letter-spacing:.04em;
  color:var(--mist);
}
.page-about .breadcrumbs a{
  color:var(--mist);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
.page-about .breadcrumbs a:hover,
.page-about .breadcrumbs a:focus-visible{
  color:var(--gold-bright);
  border-bottom-color:var(--gold);
}
.page-about .breadcrumbs__sep{
  color:var(--gold);
}
.page-about .breadcrumbs [aria-current="page"]{
  color:var(--ice);
}

/* ---------- 首屏框景 ---------- */
.page-about .about-hero{
  padding:0 clamp(16px,4vw,32px) clamp(34px,5vw,64px);
}
.page-about .about-hero__frame{
  position:relative;
  max-width:var(--shell);
  margin:0 auto;
  padding:var(--about-pad);
  border:1px solid var(--about-line);
  border-radius:var(--radius-xl);
  background:
    radial-gradient(120% 90% at 8% 0%, rgba(122,92,255,.20), rgba(6,24,38,0) 60%),
    radial-gradient(90% 70% at 100% 100%, rgba(255,122,61,.14), rgba(6,24,38,0) 62%),
    var(--ink-soft);
  display:grid;
  gap:clamp(22px,3.4vw,40px);
  overflow:hidden;
}
.page-about .about-hero__frame::before,
.page-about .about-hero__frame::after{
  content:"";
  position:absolute;
  width:74px;
  height:74px;
  pointer-events:none;
}
.page-about .about-hero__frame::before{
  top:14px;
  left:14px;
  border-top:2px solid var(--gold);
  border-left:2px solid var(--gold);
  border-top-left-radius:18px;
  opacity:.7;
}
.page-about .about-hero__frame::after{
  bottom:14px;
  right:14px;
  border-bottom:2px solid var(--violet);
  border-right:2px solid var(--violet);
  border-bottom-right-radius:18px;
  opacity:.7;
}

.page-about .eyebrow{
  display:inline-block;
  margin:0 0 14px;
  padding-left:34px;
  position:relative;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-bright);
}
.page-about .eyebrow::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:24px;
  height:2px;
  background:linear-gradient(90deg, var(--gold), rgba(217,164,65,0));
  transform:translateY(-50%);
}

.page-about .about-hero__title{
  margin:0 0 18px;
  font-family:var(--font-display);
  font-weight:900;
  font-size:clamp(2rem,5.4vw,3.9rem);
  line-height:1.18;
  letter-spacing:.01em;
  color:var(--ice);
}
.page-about .about-hero__lead{
  margin:0;
  max-width:44em;
  font-size:clamp(.95rem,1.5vw,1.06rem);
  line-height:1.85;
  color:var(--mist);
}

.page-about .about-stats{
  margin:clamp(22px,3vw,32px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--about-line-soft);
  border:1px solid var(--about-line-soft);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.page-about .about-stats__item{
  background:rgba(6,24,38,.72);
  padding:14px 16px;
}
.page-about .about-stats dt{
  font-size:12px;
  letter-spacing:.08em;
  color:var(--mist);
  margin-bottom:6px;
}
.page-about .about-stats dd{
  margin:0;
  display:flex;
  align-items:baseline;
  gap:4px;
}
.page-about .about-stats__num{
  font-family:var(--font-num);
  font-size:clamp(1.6rem,3.4vw,2.1rem);
  font-weight:700;
  line-height:1;
  color:var(--gold-bright);
}
.page-about .about-stats__unit{
  font-size:13px;
  color:var(--mist);
}

.page-about .about-hero__visual{
  margin:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--about-line);
  background:var(--ink-deep);
}
.page-about .about-hero__visual img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
  aspect-ratio:16 / 9;
}
.page-about .about-hero__visual figcaption{
  padding:10px 16px 12px;
  font-size:12.5px;
  letter-spacing:.04em;
  color:var(--mist);
  border-top:1px solid var(--about-line-soft);
}

/* ---------- 通用章节 ---------- */
.page-about .about-section{
  max-width:var(--shell);
  margin:0 auto clamp(38px,6vw,78px);
  padding:0 clamp(16px,4vw,32px);
}
.page-about .about-section__head{
  margin-bottom:clamp(20px,3vw,34px);
  max-width:52em;
}
.page-about .about-section__head h2,
.page-about .about-culture__body h2{
  margin:0;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.5rem,3.6vw,2.5rem);
  line-height:1.28;
  color:var(--ice);
}
.page-about .about-section__note{
  margin:12px 0 0;
  font-size:14px;
  color:var(--mist);
  line-height:1.75;
}

/* ---------- 起点与定位 ---------- */
.page-about .about-origin__grid{
  display:grid;
  gap:clamp(20px,3vw,34px);
}
.page-about .about-origin__body p{
  margin:0 0 16px;
  font-size:clamp(.94rem,1.4vw,1rem);
  line-height:1.9;
  color:var(--mist);
}
.page-about .about-origin__body p:last-child{
  margin-bottom:0;
}
.page-about .about-origin__quote{
  position:relative;
  padding:24px 22px 24px 26px;
  border-radius:var(--radius-lg);
  border:1px solid var(--about-line);
  border-left:3px solid var(--gold);
  background:linear-gradient(150deg, rgba(122,92,255,.14), rgba(11,42,69,.5));
}
.page-about .about-origin__quote-text{
  margin:0 0 12px;
  font-family:var(--font-display);
  font-size:clamp(1.2rem,2.6vw,1.55rem);
  line-height:1.55;
  color:var(--gold-bright);
}
.page-about .about-origin__quote-note{
  margin:0;
  font-size:13px;
  line-height:1.8;
  color:var(--mist);
}

/* ---------- 时间线 ---------- */
.page-about .about-timeline-wrap{
  position:relative;
}
.page-about .about-timeline{
  position:relative;
  list-style:none;
  margin:0;
  padding:0;
}
.page-about .about-timeline::before{
  content:"";
  position:absolute;
  left:11px;
  top:10px;
  bottom:14px;
  width:2px;
  background:linear-gradient(180deg, var(--gold) 0%, rgba(217,164,65,.4) 55%, rgba(217,164,65,.06) 100%);
}
.page-about .about-timeline__item{
  position:relative;
  padding:0 0 clamp(24px,3.4vw,34px) 44px;
}
.page-about .about-timeline__item:last-child{
  padding-bottom:0;
}
.page-about .about-timeline__item::before{
  content:"";
  position:absolute;
  left:3px;
  top:6px;
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid var(--gold);
  background:var(--ink);
  box-shadow:0 0 0 5px rgba(217,164,65,.10);
  transition:box-shadow .3s ease, background .3s ease;
}
.page-about .about-timeline__item.is-visible::before{
  background:var(--gold-bright);
  box-shadow:0 0 0 7px rgba(243,201,105,.16);
}
.page-about .about-timeline__year{
  display:inline-block;
  margin-bottom:8px;
  padding:3px 12px;
  border-radius:var(--pill);
  border:1px solid var(--about-line);
  font-family:var(--font-num);
  font-size:15px;
  letter-spacing:.12em;
  color:var(--gold-bright);
  background:rgba(6,24,38,.6);
}
.page-about .about-timeline__title{
  margin:0 0 8px;
  font-size:clamp(1.05rem,2vw,1.22rem);
  font-weight:700;
  color:var(--ice);
}
.page-about .about-timeline__text{
  margin:0;
  max-width:46em;
  font-size:14.5px;
  line-height:1.85;
  color:var(--mist);
}

/* ---------- 服务标准 ---------- */
.page-about .about-standards{
  position:relative;
  padding-top:clamp(22px,3.4vw,40px);
  padding-bottom:clamp(22px,3.4vw,40px);
  border-top:1px solid var(--about-line-soft);
  border-bottom:1px solid var(--about-line-soft);
}
.page-about .about-standards__grid{
  display:grid;
  gap:clamp(14px,2vw,20px);
  grid-template-columns:1fr;
}
.page-about .standard-card{
  padding:20px 18px;
  border-radius:var(--radius-lg);
  background:var(--about-card);
  border:1px solid var(--about-line-soft);
  transition:border-color .25s ease, transform .25s ease;
}
.page-about .standard-card:hover{
  border-color:var(--about-line);
  transform:translateY(-2px);
}
.page-about .standard-card__num{
  display:block;
  margin-bottom:10px;
  font-family:var(--font-num);
  font-size:26px;
  line-height:1;
  color:var(--violet);
  letter-spacing:.06em;
}
.page-about .standard-card h3{
  margin:0 0 10px;
  font-size:1.02rem;
  font-weight:700;
  color:var(--ice);
}
.page-about .standard-card p{
  margin:0;
  font-size:14px;
  line-height:1.85;
  color:var(--mist);
}

/* ---------- 团队 ---------- */
.page-about .about-team__intro{
  display:grid;
  gap:clamp(20px,3vw,32px);
  margin-bottom:clamp(20px,3vw,30px);
}
.page-about .about-team__lead{
  margin:14px 0 0;
  max-width:40em;
  font-size:clamp(.94rem,1.4vw,1rem);
  line-height:1.9;
  color:var(--mist);
}
.page-about .about-team__visual{
  margin:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--about-line-soft);
}
.page-about .about-team__visual img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  aspect-ratio:3 / 2;
}
.page-about .about-team__grid{
  display:grid;
  gap:clamp(14px,2vw,18px);
  grid-template-columns:1fr;
}
.page-about .team-card{
  position:relative;
  padding:22px 20px 20px;
  border-radius:var(--radius-lg);
  background:var(--about-card-solid);
  border:1px solid var(--about-line-soft);
  overflow:hidden;
}
.page-about .team-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:var(--gold);
}
.page-about .team-card--violet::before{background:var(--violet);}
.page-about .team-card--gold::before{background:var(--gold);}
.page-about .team-card--orange::before{background:var(--orange);}
.page-about .team-card--teal::before{background:var(--teal);}
.page-about .team-card h3{
  margin:0 0 10px;
  font-size:1.04rem;
  font-weight:700;
  color:var(--ice);
}
.page-about .team-card p{
  margin:0 0 12px;
  font-size:14px;
  line-height:1.85;
  color:var(--mist);
}
.page-about .team-card__meta{
  margin:0;
  font-size:12px;
  letter-spacing:.08em;
  color:var(--gold-bright);
  opacity:.9;
}

/* ---------- 地域文化 ---------- */
.page-about .about-culture{
  padding-top:clamp(24px,4vw,48px);
  padding-bottom:clamp(24px,4vw,48px);
  border-radius:var(--radius-xl);
  background:
    repeating-linear-gradient(115deg, rgba(122,92,255,.07) 0 12px, rgba(6,24,38,0) 12px 44px),
    linear-gradient(160deg, rgba(217,164,65,.10), rgba(6,24,38,0) 58%);
  border:1px solid var(--about-line-soft);
  max-width:var(--shell);
  margin-left:auto;
  margin-right:auto;
}
.page-about .about-culture__inner{
  display:grid;
  gap:clamp(20px,3vw,34px);
  padding:0 clamp(16px,4vw,32px);
}
.page-about .about-culture__visual{
  margin:0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--about-line);
  align-self:start;
}
.page-about .about-culture__visual img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  aspect-ratio:1 / 1;
}
.page-about .about-culture__body p{
  margin:0 0 14px;
  font-size:clamp(.94rem,1.4vw,1rem);
  line-height:1.9;
  color:var(--mist);
}
.page-about .about-culture__list{
  list-style:none;
  margin:18px 0 0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-about .about-culture__list li{
  padding:12px 14px;
  border-radius:var(--radius-md);
  background:rgba(6,24,38,.62);
  border:1px solid var(--about-line-soft);
  font-size:13.5px;
  line-height:1.8;
  color:var(--mist);
}
.page-about .about-culture__list span{
  display:inline-block;
  min-width:44px;
  margin-right:10px;
  font-weight:700;
  color:var(--gold-bright);
  letter-spacing:.06em;
}

/* ---------- 合作生态 ---------- */
.page-about .about-partners__grid{
  display:grid;
  gap:clamp(20px,3vw,32px);
}
.page-about .about-partners__body p{
  margin:0 0 16px;
  font-size:clamp(.94rem,1.4vw,1rem);
  line-height:1.9;
  color:var(--mist);
}
.page-about .about-partners__body p:last-child{
  margin-bottom:0;
}
.page-about .about-partners__tags{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-content:start;
}
.page-about .about-partners__tags .tag{
  padding:9px 16px;
  border-radius:var(--pill);
  border:1px solid var(--about-line);
  background:rgba(11,42,69,.72);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--ice);
}
.page-about .about-partners__tags .tag--violet{
  border-color:rgba(122,92,255,.55);
  background:rgba(122,92,255,.16);
}
.page-about .about-partners__tags .tag--teal{
  border-color:rgba(47,184,166,.5);
  background:rgba(47,184,166,.14);
}

/* ---------- 结尾行动 ---------- */
.page-about .about-cta{
  max-width:var(--shell);
  margin:0 auto;
  padding:0 clamp(16px,4vw,32px);
}
.page-about .about-cta__inner{
  position:relative;
  padding:clamp(26px,4vw,48px);
  border-radius:var(--radius-xl);
  border:1px solid var(--about-line);
  background:
    radial-gradient(90% 120% at 0% 0%, rgba(255,122,61,.20), rgba(6,24,38,0) 58%),
    radial-gradient(80% 110% at 100% 100%, rgba(122,92,255,.24), rgba(6,24,38,0) 60%),
    var(--ink-soft);
  overflow:hidden;
}
.page-about .about-cta__inner h2{
  margin:0 0 12px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.4rem,3.2vw,2.1rem);
  line-height:1.3;
  color:var(--ice);
}
.page-about .about-cta__text{
  margin:0 0 22px;
  max-width:40em;
  font-size:14.5px;
  line-height:1.85;
  color:var(--mist);
}
.page-about .about-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.page-about .about-cta__actions .btn{
  display:inline-block;
  padding:12px 24px;
  border-radius:var(--pill);
  font-size:14px;
  font-weight:700;
  letter-spacing:.04em;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.page-about .about-cta__actions .btn--accent{
  background:var(--orange);
  color:var(--ink);
  border:1px solid var(--orange);
}
.page-about .about-cta__actions .btn--gold{
  background:var(--gold);
  color:var(--ink);
  border:1px solid var(--gold);
}
.page-about .about-cta__actions .btn--ghost{
  background:transparent;
  color:var(--ice);
  border:1px solid var(--about-line);
}
.page-about .about-cta__actions .btn:hover,
.page-about .about-cta__actions .btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(6,24,38,.55);
}
.page-about .about-cta__actions .btn--ghost:hover,
.page-about .about-cta__actions .btn--ghost:focus-visible{
  border-color:var(--gold-bright);
  color:var(--gold-bright);
}

/* ---------- 响应式 ---------- */
@media (min-width:600px){
  .page-about .about-stats{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .about-standards__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-about .about-team__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (min-width:900px){
  .page-about .about-hero__frame{
    grid-template-columns:1.08fr .92fr;
    align-items:center;
  }
  .page-about .about-origin__grid{
    grid-template-columns:8fr 4fr;
    align-items:start;
  }
  .page-about .about-team__intro{
    grid-template-columns:7fr 5fr;
    align-items:center;
  }
  .page-about .about-culture__inner{
    grid-template-columns:5fr 7fr;
    align-items:center;
  }
  .page-about .about-partners__grid{
    grid-template-columns:7fr 5fr;
    align-items:start;
  }
  .page-about .about-standards__grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .about-timeline__item{
    padding-left:56px;
  }
  .page-about .about-timeline::before{
    left:15px;
  }
  .page-about .about-timeline__item::before{
    left:7px;
    width:18px;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-about .standard-card,
  .page-about .about-cta__actions .btn,
  .page-about .about-timeline__item::before{
    transition:none;
  }
  .page-about .standard-card:hover,
  .page-about .about-cta__actions .btn:hover,
  .page-about .about-cta__actions .btn:focus-visible{
    transform:none;
  }
}
<<<END>>>