.page-about{
  --about-paper-ink:#141A24;
  --about-rail-w:186px;
  background:var(--ink-900);
  overflow-x:hidden;
}

/* ---------- 面包屑 ---------- */
.page-about .about-crumb{
  padding-top:calc(var(--bar-h) + 1.1rem);
}
.page-about .breadcrumbs{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.06em;
  color:var(--text-dim);
}
.page-about .breadcrumbs a{
  color:var(--cyan);
  text-decoration:none;
}
.page-about .breadcrumbs a:hover,
.page-about .breadcrumbs a:focus-visible{
  text-decoration:underline;
}

/* ---------- 首屏框景 ---------- */
.page-about .about-hero{
  position:relative;
  margin-top:1.4rem;
  padding-bottom:clamp(2rem,5vw,3rem);
  background:
    radial-gradient(1100px 520px at 80% -12%,rgba(27,107,255,.24),transparent 62%),
    radial-gradient(700px 420px at 4% 108%,rgba(255,61,174,.12),transparent 68%);
}
.page-about .about-hero::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  opacity:.5;
}
.page-about .about-hero__inner{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(1.6rem,4vw,2.6rem);
  padding:clamp(1.4rem,4vw,2.4rem);
  border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,0) 55%);
}
.page-about .about-hero__inner::before,
.page-about .about-hero__inner::after{
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  border:2px solid var(--cyan);
  opacity:.85;
}
.page-about .about-hero__inner::before{
  top:-1px;
  left:-1px;
  border-right:0;
  border-bottom:0;
}
.page-about .about-hero__inner::after{
  bottom:-1px;
  right:-1px;
  border-left:0;
  border-top:0;
}
.page-about .about-hero__eyebrow{
  margin:0;
  font-size:.7rem;
  letter-spacing:.22em;
  color:var(--cyan);
  text-transform:uppercase;
}
.page-about .about-hero__title{
  margin:.7rem 0 1rem;
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(2rem,7.2vw,3.7rem);
  line-height:1.08;
  letter-spacing:-.045em;
  color:#fff;
}
.page-about .about-hero__lede{
  margin:0;
  max-width:44ch;
  font-size:clamp(.95rem,2.2vw,1.05rem);
  line-height:1.85;
  color:var(--text);
}
.page-about .about-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:1.5rem;
}
.page-about .about-hero__media{
  position:relative;
  margin:0;
  border:1px solid var(--line);
  background:var(--ink-800);
  overflow:hidden;
}
.page-about .about-hero__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:7/4;
  object-fit:cover;
  filter:saturate(.86) contrast(1.06);
}
.page-about .about-hero__media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(8,11,18,.05),rgba(8,11,18,.72));
  pointer-events:none;
}
.page-about .about-hero__caption{
  position:absolute;
  left:0;
  bottom:0;
  z-index:1;
  padding:.5rem .8rem;
  font-size:.66rem;
  letter-spacing:.08em;
  color:var(--paper);
  background:rgba(8,11,18,.72);
  border-top:1px solid var(--line);
  border-right:1px solid var(--line);
}

/* ---------- 首屏数据条 ---------- */
.page-about .about-stats{
  list-style:none;
  margin:clamp(1.5rem,3vw,2.2rem) auto 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.page-about .about-stats__item{
  background:var(--ink-800);
  padding:.95rem 1.05rem 1.1rem;
  display:flex;
  flex-direction:column;
  gap:.3rem;
}
.page-about .about-stats__num{
  font-size:clamp(1.3rem,3.6vw,1.8rem);
  font-weight:700;
  color:var(--green);
  letter-spacing:-.02em;
}
.page-about .about-stats__item:nth-child(2) .about-stats__num{color:var(--cyan);}
.page-about .about-stats__item:nth-child(3) .about-stats__num{color:#fff;}
.page-about .about-stats__item:nth-child(4) .about-stats__num{color:var(--magenta);}
.page-about .about-stats__label{
  font-size:.76rem;
  color:var(--text-dim);
  letter-spacing:.02em;
}

/* ---------- 长卷骨架 ---------- */
.page-about .about-shell{
  padding-top:clamp(2rem,5vw,3.4rem);
  padding-bottom:clamp(3rem,7vw,5rem);
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
}

.page-about .about-rail{
  border-left:2px solid var(--blue);
  padding-left:1rem;
}
.page-about .about-rail__title{
  margin:0 0 .7rem;
  font-size:.68rem;
  letter-spacing:.24em;
  color:var(--text-dim);
}
.page-about .about-rail__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.1rem;
}
.page-about .about-rail__list a{
  display:flex;
  gap:.55rem;
  align-items:baseline;
  padding:.35rem .4rem .35rem .2rem;
  font-size:.85rem;
  color:var(--text);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.06);
  transition:color .2s ease,background-color .2s ease;
}
.page-about .about-rail__list a .mono{
  font-size:.68rem;
  color:var(--cyan);
  letter-spacing:.06em;
}
.page-about .about-rail__list a:hover,
.page-about .about-rail__list a:focus-visible{
  color:#fff;
  background:rgba(27,107,255,.14);
}

/* ---------- 章节 ---------- */
.page-about .about-chapter{
  padding:2.4rem 0;
  border-top:1px solid var(--line);
  scroll-margin-top:calc(var(--bar-h) + 1.2rem);
}
.page-about .about-chapter:first-child{
  border-top:0;
  padding-top:.4rem;
}
.page-about .about-chapter .chapter__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.6rem 1rem;
  margin-bottom:1.4rem;
}
.page-about .chapter__index{
  margin:0;
  font-family:var(--font-mono);
  font-size:clamp(1.5rem,4vw,2.1rem);
  line-height:1;
  color:var(--cyan);
  opacity:.9;
}
.page-about .chapter__title{
  margin:0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(1.35rem,4.2vw,2.05rem);
  letter-spacing:-.035em;
  line-height:1.24;
  color:#fff;
}
.page-about .about-chapter__body{
  display:grid;
  grid-template-columns:1fr;
  gap:1.6rem;
}
.page-about .about-main{
  min-width:0;
}
.page-about .about-main > p{
  margin:0 0 1.05rem;
  font-size:clamp(.92rem,2.1vw,1rem);
  line-height:1.85;
  color:var(--text);
}
.page-about .about-lead{
  font-size:clamp(1rem,2.4vw,1.14rem);
  line-height:1.82;
  color:#E6ECF6;
  border-left:3px solid var(--green);
  padding-left:.9rem;
}
.page-about .about-note{
  align-self:start;
  padding-left:1rem;
  border-left:1px solid rgba(255,61,174,.5);
  font-family:var(--font-serif);
  font-size:.83rem;
  line-height:1.95;
  color:var(--text-dim);
}
.page-about .about-note p{
  margin:0 0 .6rem;
}
.page-about .about-note__tag{
  font-family:var(--font-mono);
  font-size:.66rem;
  letter-spacing:.16em;
  color:var(--magenta);
}

/* ---------- 时效流程 ---------- */
.page-about .about-flow{
  list-style:none;
  margin:1.6rem 0 0;
  padding:1px;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.page-about .about-flow__item{
  background:var(--ink-800);
  padding:1rem 1.05rem 1.2rem;
  border-top:2px solid transparent;
  transition:border-color .22s ease,background-color .22s ease;
}
.page-about .about-flow__item:hover{
  background:#16203A;
  border-top-color:var(--cyan);
}
.page-about .about-flow__time{
  margin:0 0 .45rem;
  font-size:.7rem;
  letter-spacing:.06em;
  color:var(--cyan);
}
.page-about .about-flow__name{
  margin:0 0 .35rem;
  font-weight:700;
  font-size:1rem;
  color:#fff;
}
.page-about .about-flow__desc{
  margin:0;
  font-size:.82rem;
  line-height:1.7;
  color:var(--text-dim);
}

/* ---------- 团队 ---------- */
.page-about .about-team{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  margin:1.4rem 0 1.6rem;
  background:var(--line);
  border:1px solid var(--line);
}
.page-about .about-team__col{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0));
  padding:1.1rem 1.1rem 1.25rem;
}
.page-about .about-team__num{
  margin:0;
  font-size:1.9rem;
  font-weight:700;
  line-height:1;
  color:var(--green);
}
.page-about .about-team__role{
  margin:.45rem 0 .4rem;
  font-weight:700;
  color:#fff;
}
.page-about .about-team__desc{
  margin:0;
  font-size:.82rem;
  line-height:1.7;
  color:var(--text-dim);
}

/* ---------- 图 ---------- */
.page-about .about-figure{
  margin:0 0 1.5rem;
  border:1px solid var(--line);
  background:var(--ink-800);
  overflow:hidden;
}
.page-about .about-figure img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:9/7;
  object-fit:cover;
  filter:saturate(.8) contrast(1.05);
}
.page-about .about-figure--wide img{
  aspect-ratio:12/7;
}
.page-about .about-figure figcaption{
  padding:.6rem .85rem;
  font-family:var(--font-serif);
  font-size:.75rem;
  letter-spacing:.02em;
  color:var(--paper-shadow);
  border-top:1px solid var(--line);
}

/* ---------- 折叠 ---------- */
.page-about .about-fold{
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
}
.page-about .about-fold summary{
  cursor:pointer;
  padding:.85rem 1rem;
  font-weight:700;
  font-size:.92rem;
  color:#fff;
  list-style:none;
}
.page-about .about-fold summary::-webkit-details-marker{
  display:none;
}
.page-about .about-fold summary::before{
  content:"+";
  display:inline-block;
  width:1.1rem;
  font-family:var(--font-mono);
  color:var(--green);
}
.page-about .about-fold[open] summary::before{
  content:"−";
  color:var(--magenta);
}
.page-about .about-fold__list{
  margin:0;
  padding:0 1rem 1.1rem 2.1rem;
  display:grid;
  gap:.55rem;
  font-size:.85rem;
  line-height:1.75;
  color:var(--text-dim);
}
.page-about .about-fold__list strong{
  color:var(--cyan);
  font-weight:600;
  margin-right:.25rem;
}

/* ---------- 分类树 ---------- */
.page-about .about-tree-wrap{
  overflow-x:auto;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(27,107,255,.12),rgba(8,11,18,.2));
  padding:.6rem;
  margin-bottom:1.4rem;
}
.page-about .about-tree{
  display:block;
  width:100%;
  min-width:520px;
  height:auto;
}
.page-about .tree-root{
  fill:rgba(242,233,216,.94);
}
.page-about .tree-root-label{
  fill:#141A24;
  font-size:13px;
  font-weight:700;
  text-anchor:middle;
  font-family:var(--font-head);
}
.page-about .tree-line{
  fill:none;
  stroke:rgba(49,215,255,.5);
  stroke-width:1.5;
}
.page-about .tree-dot--blue{fill:#1B6BFF;}
.page-about .tree-dot--cyan{fill:#31D7FF;}
.page-about .tree-dot--magenta{fill:#FF3DAE;}
.page-about .tree-dot--green{fill:#7CFF6B;}
.page-about .tree-label{
  fill:#F2E9D8;
  font-size:13px;
  font-weight:600;
  font-family:var(--font-head);
}
.page-about .tree-sub{
  fill:#8894AB;
  font-size:11px;
  font-family:var(--font-mono);
}

/* ---------- 时间轴 ---------- */
.page-about .about-timeline{
  list-style:none;
  margin:1.6rem 0 0;
  padding:0 0 0 1.5rem;
  position:relative;
}
.page-about .about-timeline::before{
  content:"";
  position:absolute;
  left:5px;
  top:.5rem;
  bottom:.6rem;
  width:1px;
  background:linear-gradient(180deg,var(--cyan),var(--blue) 55%,var(--magenta));
  opacity:.65;
}
.page-about .about-timeline__item{
  position:relative;
  padding:0 0 1.7rem;
}
.page-about .about-timeline__item:last-child{
  padding-bottom:0;
}
.page-about .about-timeline__item::before{
  content:"";
  position:absolute;
  left:calc(-1.5rem - .5px);
  top:.42rem;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--ink-900);
  border:2px solid var(--cyan);
}
.page-about .about-timeline__item:nth-child(2)::before{border-color:var(--green);}
.page-about .about-timeline__item:nth-child(3)::before{border-color:var(--magenta);}
.page-about .about-timeline__item:nth-child(4)::before{border-color:var(--blue);}
.page-about .about-timeline__stage{
  margin:0 0 .35rem;
  font-size:.68rem;
  letter-spacing:.14em;
  color:var(--text-dim);
}
.page-about .about-timeline__title{
  margin:0 0 .4rem;
  font-family:var(--font-head);
  font-size:1.02rem;
  font-weight:700;
  color:#fff;
  letter-spacing:-.01em;
}
.page-about .about-timeline__item p:last-child{
  margin:0;
  font-size:.87rem;
  line-height:1.78;
  color:var(--text);
}

/* ---------- 合作 ---------- */
.page-about .about-collab{
  list-style:none;
  margin:0 0 1.6rem;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.page-about .about-collab__item{
  background:var(--ink-800);
  padding:1rem 1.05rem 1.15rem;
}
.page-about .about-collab__item h3{
  margin:0 0 .35rem;
  font-size:.96rem;
  font-weight:700;
  color:var(--green);
}
.page-about .about-collab__item p{
  margin:0;
  font-size:.83rem;
  line-height:1.72;
  color:var(--text-dim);
}

.page-about .about-honors{
  display:grid;
  grid-template-columns:1fr;
  gap:1.2rem;
  align-items:start;
  padding:1.2rem;
  background:var(--paper);
  color:var(--about-paper-ink);
  border-radius:2px;
}
.page-about .about-seal{
  width:96px;
  height:96px;
  border-radius:50%;
  border:2px solid #0F6B2E;
  color:#0F6B2E;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.15rem;
  transform:rotate(-8deg);
  background:rgba(124,255,107,.16);
}
.page-about .about-seal__num{
  font-size:1.5rem;
  font-weight:700;
  line-height:1;
}
.page-about .about-seal__txt{
  font-size:.62rem;
  letter-spacing:.06em;
}
.page-about .about-honors__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.85rem;
}
.page-about .about-honors__list li{
  border-top:1px solid rgba(20,26,36,.18);
  padding-top:.7rem;
}
.page-about .about-honors__list li:first-child{
  border-top:0;
  padding-top:0;
}
.page-about .about-honors__name{
  margin:0 0 .2rem;
  font-weight:700;
  font-size:.92rem;
  color:var(--about-paper-ink);
}
.page-about .about-honors__desc{
  margin:0;
  font-size:.8rem;
  line-height:1.7;
  color:#4A5361;
}

/* ---------- 场景 ---------- */
.page-about .about-scenes{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  margin:1.4rem 0 1.6rem;
}
.page-about .about-scene{
  position:relative;
  padding:1.15rem 1.15rem 1.25rem;
  border:1px solid var(--line);
  background:linear-gradient(150deg,rgba(49,215,255,.1),rgba(255,255,255,.02) 60%);
  transition:border-color .22s ease,transform .22s ease;
}
.page-about .about-scene:hover{
  border-color:rgba(49,215,255,.5);
  transform:translateY(-2px);
}
.page-about .about-scene__idx{
  position:absolute;
  top:1rem;
  right:1rem;
  margin:0;
  font-size:1.1rem;
  font-weight:700;
  color:rgba(49,215,255,.45);
}
.page-about .about-scene__title{
  margin:0 0 .45rem;
  font-family:var(--font-head);
  font-size:1rem;
  font-weight:700;
  color:#fff;
}
.page-about .about-scene p{
  margin:0 0 .8rem;
  font-size:.84rem;
  line-height:1.75;
  color:var(--text);
}
.page-about .about-scene__link{
  font-family:var(--font-mono);
  font-size:.76rem;
  color:var(--green);
  text-decoration:none;
  border-bottom:1px solid rgba(124,255,107,.4);
}
.page-about .about-scene__link:hover,
.page-about .about-scene__link:focus-visible{
  color:#fff;
  border-bottom-color:#fff;
}

.page-about .about-cta{
  display:grid;
  gap:1rem;
  padding:1.2rem 1.25rem;
  border:1px solid rgba(27,107,255,.45);
  background:linear-gradient(120deg,rgba(27,107,255,.22),rgba(255,61,174,.1));
}
.page-about .about-cta__text{
  margin:0;
  font-size:.92rem;
  line-height:1.78;
  color:#E6ECF6;
}
.page-about .about-cta__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}

/* ---------- 动效 ---------- */
@keyframes about-rise{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:none;}
}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .page-about [data-reveal]{
      animation:about-rise .6s ease both;
      animation-timeline:view();
      animation-range:entry 0% cover 24%;
    }
  }
}

/* ---------- 响应式 ---------- */
@media (min-width:600px){
  .page-about .about-stats{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .about-team{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-about .about-honors{
    grid-template-columns:auto minmax(0,1fr);
    gap:1.6rem;
  }
  .page-about .about-scenes{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-about .about-cta{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
  }
}

@media (min-width:900px){
  .page-about .about-hero__inner{
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
    align-items:center;
  }
  .page-about .about-chapter__body{
    grid-template-columns:minmax(0,7fr) minmax(0,3fr);
    gap:clamp(1.6rem,3.2vw,2.6rem);
  }
  .page-about .about-flow{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .about-collab{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (min-width:1000px){
  .page-about .about-shell{
    grid-template-columns:var(--about-rail-w) minmax(0,1fr);
    gap:clamp(2rem,3.6vw,3.4rem);
    align-items:start;
  }
  .page-about .about-rail{
    position:sticky;
    top:calc(var(--bar-h) + 1.4rem);
  }
}

@media (min-width:1240px){
  .page-about .about-chapter__body{
    grid-template-columns:minmax(0,7fr) minmax(0,3fr);
  }
  .page-about .about-main{
    padding-right:clamp(0rem,1.4vw,1.4rem);
  }
}
