.page-about{
  --about-rail:96px;
  background:
    radial-gradient(1100px 540px at 82% -8%, rgba(55,240,194,.07), transparent 62%),
    radial-gradient(760px 420px at 6% 34%, rgba(242,180,65,.05), transparent 64%),
    var(--ink-900);
  color:var(--paper);
  font-family:var(--font-body);
  overflow-x:clip;
}

.page-about .about-head{
  padding-top:clamp(26px,5vw,58px);
  padding-bottom:clamp(30px,5vw,64px);
}
.page-about .breadcrumb{margin-bottom:clamp(22px,4vw,40px)}

.page-about .about-head__title{
  margin:14px 0 18px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(2rem,5.2vw,3.6rem);
  line-height:1.16;
  letter-spacing:.01em;
  max-width:16em;
}
.page-about .about-head__lede{
  margin:0;
  max-width:34em;
  font-size:clamp(1rem,.55vw + .9rem,1.12rem);
  line-height:1.85;
  color:var(--muted);
}

.page-about .about-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  margin:clamp(30px,5vw,48px) 0 0;
  padding:0;
  list-style:none;
  border-top:var(--edge);
  border-left:var(--edge);
  max-width:820px;
}
.page-about .about-facts__item{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px 14px;
  border-right:var(--edge);
  border-bottom:var(--edge);
  background:rgba(22,34,58,.5);
}
.page-about .about-facts__num{
  font-family:var(--font-mono);
  font-weight:700;
  font-size:clamp(1.35rem,2.4vw,1.9rem);
  letter-spacing:.02em;
  color:var(--paper);
}
.page-about .about-facts__item:nth-child(3) .about-facts__num{color:var(--signal)}
.page-about .about-facts__label{
  font-size:12px;
  letter-spacing:.22em;
  color:var(--muted);
}

.page-about .about-index{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:clamp(20px,3vw,30px);
}
.page-about .about-index__link{
  display:inline-block;
  padding:7px 12px;
  border:var(--edge);
  border-radius:var(--radius);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.1em;
  color:var(--muted);
  text-decoration:none;
  transition:color .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease);
}
.page-about .about-index__link:hover,
.page-about .about-index__link:focus-visible{
  color:var(--paper);
  border-color:var(--signal);
  background:rgba(55,240,194,.08);
}

.page-about .section{padding-top:clamp(48px,8vw,96px);padding-bottom:clamp(48px,8vw,96px)}
.page-about .about-h2{
  margin:14px 0 16px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.6rem,3.4vw,2.5rem);
  line-height:1.2;
  letter-spacing:.01em;
  max-width:20em;
}
.page-about .about-sub{
  margin:0 0 clamp(24px,4vw,40px);
  max-width:34em;
  font-size:1rem;
  line-height:1.85;
  color:var(--muted);
}
.page-about .prose p{
  margin:0 0 1.1em;
  max-width:34em;
  font-size:clamp(1rem,.4vw + .92rem,1.08rem);
  line-height:1.85;
  color:var(--paper);
}
.page-about .prose p:last-child{margin-bottom:0}

/* ---------- 01 定位 ---------- */
.page-about .about-position__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(26px,4vw,52px);
  align-items:start;
}
.page-about .about-position__text{min-width:0}

.page-about .about-points{
  margin:clamp(22px,3vw,32px) 0 0;
  padding:0;
  list-style:none;
  border-top:var(--edge);
}
.page-about .about-points__item{
  padding:14px 0;
  border-bottom:var(--edge);
  font-size:.96rem;
  line-height:1.75;
  color:var(--muted);
}
.page-about .about-points__k{
  display:inline-block;
  min-width:3.4em;
  margin-right:10px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.22em;
  color:var(--signal);
}

.page-about .about-position__figure{
  margin:0;
  min-width:0;
}
.page-about .about-position__figure .media{
  border:var(--edge);
  box-shadow:var(--shadow-hard);
  background:var(--ink-700);
  overflow:hidden;
  transform:translate(0,0);
  transition:transform .24s var(--ease),box-shadow .24s var(--ease);
}
.page-about .about-position__figure:hover .media{
  transform:translate(4px,4px);
  box-shadow:2px 2px 0 var(--line-600);
}
.page-about .about-position__figure .media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  filter:saturate(.85) brightness(.82);
}
.page-about .about-position__cap{
  margin-top:14px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--muted);
}

/* ---------- 02 时间线 ---------- */
.page-about .about-timeline__banner{margin:0 0 clamp(28px,4vw,44px)}
.page-about .about-timeline__banner .media{
  border:var(--edge);
  background:var(--ink-800);
  overflow:hidden;
}
.page-about .about-timeline__banner img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  opacity:.78;
}

.page-about .tl{
  margin:0;
  padding:0;
  list-style:none;
}
.page-about .tl__item{
  display:grid;
  grid-template-columns:56px 20px minmax(0,1fr);
  gap:0 12px;
  padding-bottom:clamp(26px,3.5vw,40px);
}
.page-about .tl__item:last-child{padding-bottom:0}

.page-about .tl__year{
  font-family:var(--font-mono);
  font-weight:700;
  font-size:clamp(.95rem,1.6vw,1.15rem);
  letter-spacing:.06em;
  color:var(--muted);
  padding-top:2px;
}
.page-about .tl__axis{
  position:relative;
  display:flex;
  justify-content:center;
}
.page-about .tl__axis::before{
  content:"";
  position:absolute;
  top:12px;
  bottom:-14px;
  left:50%;
  width:2px;
  margin-left:-1px;
  background:var(--line-600);
}
.page-about .tl__item:last-child .tl__axis::before{display:none}
.page-about .tl__dot{
  position:relative;
  z-index:1;
  width:12px;
  height:12px;
  margin-top:4px;
  border-radius:50%;
  background:var(--ink-900);
  border:2px solid var(--line-600);
  transition:background .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.page-about .tl__item:hover .tl__dot,
.page-about .tl__item:focus-within .tl__dot{
  background:var(--signal);
  border-color:var(--signal);
  box-shadow:0 0 0 4px rgba(55,240,194,.14);
}
.page-about .tl__item:hover .tl__year,
.page-about .tl__item:focus-within .tl__year{color:var(--amber)}

.page-about .tl__body{min-width:0;padding-bottom:2px}
.page-about .tl__title{
  margin:0 0 8px;
  font-family:var(--font-body);
  font-weight:700;
  font-size:1.02rem;
  letter-spacing:.01em;
  color:var(--paper);
}
.page-about .tl__text{
  margin:0;
  max-width:32em;
  font-size:.94rem;
  line-height:1.8;
  color:var(--muted);
}

/* ---------- 03 团队 ---------- */
.page-about .about-team__banner{margin:0 0 clamp(26px,4vw,42px)}
.page-about .about-team__banner .media{
  border:var(--edge);
  background:var(--ink-800);
  overflow:hidden;
}
.page-about .about-team__banner img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  opacity:.8;
}

.page-about .team-row{
  display:grid;
  grid-template-columns:1fr;
  gap:22px;
  align-items:start;
}
.page-about .team-card{
  min-width:0;
  padding:22px 20px 20px;
  background:var(--ink-700);
  transition:transform .24s var(--ease),box-shadow .24s var(--ease),border-color .24s var(--ease);
}
.page-about .team-card:hover{
  transform:translate(6px,6px);
  box-shadow:2px 2px 0 var(--line-600);
}
.page-about .team-card__num{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-weight:700;
  font-size:1.7rem;
  letter-spacing:.06em;
  line-height:1;
}
.page-about .team-card--version .team-card__num{color:var(--signal)}
.page-about .team-card--editor .team-card__num{color:var(--amber)}
.page-about .team-card--service .team-card__num{color:var(--mint)}
.page-about .team-card__title{
  margin:0 0 10px;
  font-size:1.06rem;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--paper);
}
.page-about .team-card__text{
  margin:0 0 16px;
  font-size:.94rem;
  line-height:1.8;
  color:var(--muted);
}
.page-about .team-card__link{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  color:var(--paper);
  text-decoration:none;
  border-bottom:2px solid var(--line-600);
  padding-bottom:2px;
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.page-about .team-card__link:hover,
.page-about .team-card__link:focus-visible{
  color:var(--signal);
  border-color:var(--signal);
}

/* ---------- 04 服务地区 ---------- */
.page-about .about-area__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(26px,4vw,52px);
  align-items:start;
}
.page-about .about-area__text{min-width:0}

.page-about .area-card{
  margin-top:clamp(22px,3vw,32px);
  padding:22px 20px;
  background:var(--ink-700);
}
.page-about .area-card__label{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.3em;
  color:var(--amber);
}
.page-about .area-card__addr{
  margin:0 0 16px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.05rem;
  line-height:1.6;
  color:var(--paper);
}
.page-about .area-card__list{
  margin:0 0 18px;
  padding:0;
  list-style:none;
  border-top:var(--edge);
}
.page-about .area-card__row{
  display:grid;
  grid-template-columns:6.2em minmax(0,1fr);
  gap:10px;
  padding:10px 0;
  border-bottom:var(--edge);
  font-size:.9rem;
  line-height:1.6;
  color:var(--paper);
  overflow-wrap:anywhere;
}
.page-about .area-card__k{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--muted);
  padding-top:3px;
}

.page-about .area-map{
  border:var(--edge);
  box-shadow:var(--shadow-soft);
  background:var(--ink-800);
  padding:20px 16px 16px;
}
.page-about .area-map__svg{
  display:block;
  width:100%;
  max-width:320px;
  height:auto;
  margin:0 auto;
}
.page-about .area-map__shape{
  fill:rgba(42,58,92,.35);
  stroke:var(--line-600);
  stroke-width:2;
  stroke-linejoin:round;
}
.page-about .area-map__pulse{
  fill:rgba(55,240,194,.14);
  animation:about-pulse 4.5s ease-in-out infinite;
}
.page-about .area-map__dot{
  fill:var(--signal);
}
.page-about .area-map__text{
  fill:var(--muted);
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.18em;
}
.page-about .area-map__cap{
  margin:14px 0 0;
  text-align:center;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--muted);
}

@keyframes about-pulse{
  0%,100%{opacity:.45;transform:scale(.82);transform-origin:150px 152px}
  50%{opacity:1;transform:scale(1.06);transform-origin:150px 152px}
}

/* ---------- 05 更新节奏 ---------- */
.page-about .rhythm{
  border-top:var(--edge);
}
.page-about .rhythm__row{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  padding:20px 0;
  border-bottom:var(--edge);
}
.page-about .rhythm__key{
  margin:0;
  display:flex;
  align-items:baseline;
  gap:6px;
  font-family:var(--font-mono);
}
.page-about .rhythm__num{
  font-weight:700;
  font-size:1.6rem;
  line-height:1;
  letter-spacing:.03em;
  color:var(--signal);
}
.page-about .rhythm__unit{
  font-size:12px;
  letter-spacing:.16em;
  color:var(--muted);
}
.page-about .rhythm__body{min-width:0}
.page-about .rhythm__title{
  margin:0 0 6px;
  font-size:1.02rem;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--paper);
}
.page-about .rhythm__text{
  margin:0;
  max-width:36em;
  font-size:.94rem;
  line-height:1.8;
  color:var(--muted);
}

.page-about .about-updates__more{
  margin:clamp(22px,3vw,32px) 0 0;
  font-size:.95rem;
  line-height:1.8;
  color:var(--muted);
}
.page-about .about-inline-link{
  color:var(--mint);
  text-decoration:none;
  border-bottom:2px solid rgba(168,255,228,.35);
  padding-bottom:1px;
  transition:border-color .2s var(--ease),color .2s var(--ease);
}
.page-about .about-inline-link:hover,
.page-about .about-inline-link:focus-visible{
  color:var(--paper);
  border-color:var(--signal);
}

/* ---------- 06 理由与收尾 ---------- */
.page-about .reason-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,34px);
}
.page-about .reason{
  min-width:0;
  padding:2px 0 2px 16px;
  border-left:2px solid var(--line-600);
  transition:border-color .22s var(--ease);
}
.page-about .reason:hover{border-color:var(--amber)}
.page-about .reason__idx{
  margin:0 0 8px;
  font-family:var(--font-mono);
  font-weight:700;
  font-size:12px;
  letter-spacing:.3em;
  color:var(--amber);
}
.page-about .reason__title{
  margin:0 0 8px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1.16rem;
  line-height:1.4;
  color:var(--paper);
}
.page-about .reason__text{
  margin:0;
  max-width:30em;
  font-size:.94rem;
  line-height:1.8;
  color:var(--muted);
}

.page-about .about-cta{
  margin-top:clamp(36px,5vw,60px);
  padding:clamp(22px,4vw,40px);
  border:var(--edge);
  box-shadow:var(--shadow-hard);
  background:var(--ink-700);
}
.page-about .about-cta__title{
  margin:0 0 10px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(1.3rem,2.6vw,1.75rem);
  line-height:1.3;
  color:var(--paper);
}
.page-about .about-cta__text{
  margin:0 0 22px;
  max-width:34em;
  font-size:.98rem;
  line-height:1.8;
  color:var(--muted);
}
.page-about .about-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.page-about .about-cta__actions .btn{flex:0 1 auto}

.page-about :focus-visible{
  outline:2px solid var(--signal);
  outline-offset:2px;
}

/* ---------- 断点 ---------- */
@media (min-width:640px){
  .page-about .about-facts{grid-template-columns:repeat(4,1fr)}
  .page-about .rhythm__row{grid-template-columns:150px minmax(0,1fr);gap:22px;align-items:start;padding:24px 0}
  .page-about .reason-grid{grid-template-columns:1fr 1fr}
  .page-about .area-card__row{grid-template-columns:7em minmax(0,1fr)}
}

@media (min-width:860px){
  .page-about .about-position__grid{grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);gap:clamp(32px,4vw,64px)}
  .page-about .about-position__figure{margin-top:36px}
  .page-about .about-area__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,4vw,60px)}
  .page-about .area-map{padding:28px 24px 22px}
  .page-about .tl__item{grid-template-columns:88px 26px minmax(0,1fr);gap:0 18px}
}

@media (min-width:900px){
  .page-about .team-row{grid-template-columns:minmax(0,1fr) minmax(0,1.14fr) minmax(0,1fr);gap:20px}
  .page-about .team-row > .team-card:nth-child(2){margin-top:-22px}
  .page-about .team-row > .team-card:nth-child(3){margin-top:14px}
}

@media (prefers-reduced-motion:reduce){
  .page-about *,
  .page-about *::before,
  .page-about *::after{
    animation:none !important;
    transition:none !important;
  }
  .page-about .about-position__figure .media,
  .page-about .team-card{transform:none !important}
}
<<<PAGE_CSS_END>>>