.page-about{
  position:relative;
  background:var(--color-bg);
  color:var(--color-text);
  overflow-x:clip;
}

.page-about :is(a,button,[tabindex]):focus-visible{
  outline:2px solid var(--color-gold);
  outline-offset:3px;
}

/* 面包屑 */
.page-about .breadcrumb{
  display:flex;
  align-items:center;
  gap:.6rem;
  max-width:var(--container);
  margin:0 auto;
  padding:1.25rem 1.25rem 0;
  font-size:.8rem;
  color:var(--color-muted);
}

.page-about .breadcrumb a{
  color:var(--color-link);
  text-decoration:none;
}

.page-about .breadcrumb a:hover{
  color:var(--color-gold);
  text-decoration:underline;
}

/* 首屏 */
.page-about .about-hero{
  position:relative;
  padding:clamp(2rem,6vw,5rem) 1.25rem clamp(2rem,5vw,4rem);
}

.page-about .about-hero::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(63,167,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(63,167,255,.04) 1px,transparent 1px);
  background-size:34px 34px;
  pointer-events:none;
}

.page-about .about-hero::after{
  content:'';
  position:absolute;
  right:-8rem;
  top:-8rem;
  width:22rem;
  height:22rem;
  background:radial-gradient(circle,rgba(255,201,56,.08) 0,transparent 70%);
  pointer-events:none;
}

.page-about .about-hero-inner{
  position:relative;
  z-index:1;
  max-width:var(--container);
  margin:0 auto;
}

.page-about .about-kicker{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--color-gold);
  margin-bottom:.75rem;
}

.page-about .about-kicker .gold-dot{
  width:.35rem;
  height:.35rem;
  background:var(--color-gold);
}

.page-about .about-hero h1{
  font-family:var(--font-title);
  font-weight:900;
  font-size:clamp(2rem,6vw,4.4rem);
  line-height:1.12;
  margin:0 0 1.25rem;
  max-width:14em;
}

.page-about .about-lead{
  max-width:68ch;
  color:var(--color-muted);
  line-height:1.85;
  font-size:1rem;
}

.page-about .about-hero-meta{
  margin-top:2rem;
  border-top:1px solid var(--color-line);
  padding-top:1rem;
  max-width:38rem;
}

.page-about .about-hero-meta dl{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem 1.5rem;
}

.page-about .about-hero-meta dl > div{
  display:grid;
  grid-template-columns:5rem 1fr;
  align-items:baseline;
  gap:.75rem;
}

.page-about .about-hero-meta dt{
  color:var(--color-gold);
  font-size:.75rem;
  letter-spacing:.05em;
}

.page-about .about-hero-meta dd{
  color:var(--color-muted);
  font-family:var(--font-number);
}

/* 章节通用 */
.page-about .section{
  padding:clamp(2.75rem,7vw,5.5rem) 1.25rem;
}

.page-about .section-heading{
  position:relative;
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:.75rem 1rem;
  max-width:var(--container);
  margin:0 auto 1.75rem;
}

.page-about .section-index{
  color:var(--color-gold);
  font-family:var(--font-number);
  font-size:.8rem;
  letter-spacing:.1em;
}

.page-about .section-title{
  font-family:var(--font-title);
  font-weight:900;
  font-size:clamp(1.5rem,3.5vw,2.5rem);
  line-height:1.2;
}

.page-about .rotated-note{
  color:var(--color-muted);
  font-size:.68rem;
  letter-spacing:.15em;
  text-transform:uppercase;
}

/* 品牌历程 */
.page-about .about-history{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(9,13,26,0) 0%,rgba(9,13,26,.25) 60%,rgba(9,13,26,0) 100%);
}

.page-about .city-silhouette{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.85;
  pointer-events:none;
}

.page-about .city-silhouette svg{
  width:100%;
  height:100%;
  display:block;
}

.page-about .about-history > *:not(.city-silhouette){
  position:relative;
  z-index:1;
}

.page-about .about-intro{
  max-width:62ch;
  color:var(--color-muted);
  line-height:1.85;
  margin-bottom:2.5rem;
}

.page-about .about-timeline{
  max-width:var(--container);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
}

.page-about .timeline-media{
  order:-1;
}

.page-about .timeline-media img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid var(--color-line);
  background:var(--color-bg-deep);
}

.page-about .timeline-list{
  position:relative;
  margin-left:.5rem;
  padding-left:1.75rem;
  border-left:1px solid var(--color-line);
}

.page-about .timeline-entry{
  position:relative;
  padding:1.5rem 0 1.75rem .25rem;
  transition:background-color .2s ease;
}

.page-about .timeline-entry:hover,
.page-about .timeline-entry:focus-within{
  background:rgba(255,201,56,.02);
}

.page-about .timeline-entry::before{
  content:'';
  position:absolute;
  left:-1.95rem;
  top:2.15rem;
  width:.65rem;
  height:.65rem;
  border-radius:50%;
  background:var(--color-gold);
  box-shadow:0 0 0 .25rem rgba(255,201,56,.12);
}

.page-about .timeline-year{
  font-family:var(--font-number);
  font-weight:700;
  font-size:clamp(2rem,8vw,2.6rem);
  line-height:1;
  color:var(--color-gold);
  margin-bottom:.75rem;
}

.page-about .timeline-event h3{
  font-family:var(--font-title);
  font-weight:700;
  font-size:1.15rem;
  margin-bottom:.4rem;
}

.page-about .timeline-event p{
  color:var(--color-muted);
  font-size:.91rem;
  line-height:1.8;
  max-width:60ch;
}

/* 团队 */
.page-about .about-team{
  background:
    radial-gradient(circle at 8% 18%, rgba(63,167,255,.07), transparent 16rem),
    var(--color-bg-deep);
}

.page-about .about-team-intro{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  max-width:var(--container);
  margin:0 auto 2rem;
}

.page-about .team-media img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid var(--color-line);
}

.page-about .team-copy{
  color:var(--color-muted);
  font-size:.95rem;
  line-height:1.85;
}

.page-about .team-copy p + p{
  margin-top:1rem;
}

.page-about .team-note{
  max-width:var(--container);
  margin:0 auto 2rem;
}

.page-about .panel-light{
  background:var(--color-panel);
  color:#182136;
  padding:1.5rem;
  border-left:.35rem solid var(--color-gold);
  font-size:.95rem;
  line-height:1.75;
}

.page-about .panel-light strong{
  color:#B8891B;
  font-family:var(--font-number);
  font-size:1.05rem;
}

.page-about .team-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  max-width:var(--container);
  margin:0 auto;
}

.page-about .team-card{
  display:flex;
  flex-direction:column;
  background:rgba(11,16,38,.72);
  border:1px solid var(--color-line);
  border-top:2px solid var(--color-gold);
  padding:1.35rem 1.25rem;
  transition:border-color .2s ease,transform .2s ease,background-color .2s ease;
}

.page-about .team-card:hover,
.page-about .team-card:focus-within{
  border-color:var(--color-gold);
  background:rgba(15,24,48,.85);
  transform:translateY(-2px);
}

.page-about .team-icon{
  width:2.6rem;
  height:2.6rem;
  color:var(--color-gold);
  margin-bottom:.85rem;
}

.page-about .team-icon svg{
  width:100%;
  height:100%;
  display:block;
}

.page-about .team-card h3{
  font-family:var(--font-title);
  font-size:1.12rem;
  font-weight:700;
}

.page-about .team-size{
  font-family:var(--font-number);
  color:var(--color-link);
  font-size:.78rem;
  margin:.3rem 0 .6rem;
}

.page-about .team-card > p:last-child{
  color:var(--color-muted);
  font-size:.87rem;
  line-height:1.7;
}

/* 资质 */
.page-about .about-credentials{
  background:linear-gradient(180deg,transparent 0%,rgba(9,13,26,.55) 100%);
}

.page-about .cred-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  max-width:var(--container);
  margin:0 auto;
}

.page-about .cred-main{
  display:grid;
  gap:2rem;
}

.page-about .cred-list{
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}

.page-about .cred-item{
  border:1px solid var(--color-line);
  border-top:2px solid var(--color-gold);
  background:rgba(11,16,38,.6);
  padding:1.2rem 1.1rem;
}

.page-about .cred-item h3{
  color:var(--color-gold);
  font-size:.78rem;
  letter-spacing:.08em;
  margin-bottom:.55rem;
}

.page-about .cred-value{
  color:var(--color-white);
  font-family:var(--font-number);
  font-size:1.02rem;
  line-height:1.4;
}

.page-about .cred-item > p:last-child{
  color:var(--color-muted);
  font-size:.8rem;
  line-height:1.5;
  margin-top:.5rem;
}

.page-about .cred-honors{
  border-left:1px solid var(--color-gold);
  padding-left:1.25rem;
}

.page-about .cred-honors h3{
  font-family:var(--font-title);
  font-size:1.02rem;
  margin-bottom:.4rem;
}

.page-about .cred-honors ul{
  list-style:none;
}

.page-about .cred-honors li{
  color:var(--color-muted);
  font-size:.9rem;
  line-height:1.5;
  padding:.55rem 0;
  border-bottom:1px solid rgba(31,58,95,.5);
}

.page-about .cred-honors li span{
  color:var(--color-gold);
  font-family:var(--font-number);
  margin-right:.5rem;
}

.page-about .cred-seal{
  display:flex;
  justify-content:center;
}

.page-about .cred-seal img{
  width:min(100%,16rem);
  height:auto;
  border:1px solid rgba(255,201,56,.55);
  padding:.5rem;
  background:var(--color-bg-deep);
}

/* 技术实力 */
.page-about .about-tech{
  position:relative;
  overflow:hidden;
  background:var(--color-bg-deep);
}

.page-about .about-tech::before{
  content:'';
  position:absolute;
  top:-10rem;
  left:50%;
  width:30rem;
  height:30rem;
  background:radial-gradient(circle,rgba(255,201,56,.05) 0,transparent 70%);
  pointer-events:none;
}

.page-about .about-tech-header{
  max-width:var(--container);
  margin:0 auto;
  display:grid;
  gap:1.5rem;
}

.page-about .about-tech-header p{
  color:var(--color-muted);
  max-width:68ch;
  line-height:1.85;
}

.page-about .tech-metrics{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--color-line);
  border:1px solid var(--color-line);
  max-width:var(--container);
  margin:2.5rem auto 0;
}

.page-about .metric-cell{
  background:#0B1026;
  padding:1.5rem 1.25rem;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.15rem .45rem;
  min-height:8.5rem;
  transition:background-color .2s ease;
}

.page-about .metric-cell:hover{
  background:#0D142C;
}

.page-about .metric-num{
  font-family:var(--font-number);
  font-weight:700;
  font-size:clamp(2rem,6vw,3rem);
  line-height:1;
  color:var(--color-gold);
}

.page-about .metric-unit{
  font-size:.72rem;
  color:var(--color-link);
  letter-spacing:.05em;
}

.page-about .metric-cell p{
  flex-basis:100%;
  color:var(--color-muted);
  font-size:.82rem;
  line-height:1.5;
  margin-top:.4rem;
}

.page-about .tech-note{
  max-width:var(--container);
  margin:1.75rem auto 0;
  color:var(--color-muted);
  font-size:.88rem;
  line-height:1.85;
}

/* 合作生态 */
.page-about .about-eco{
  background:linear-gradient(180deg,var(--color-bg-deep) 0%,var(--color-bg) 100%);
}

.page-about .eco-lead{
  max-width:var(--container);
  margin:0 auto 2.25rem;
  color:var(--color-muted);
  line-height:1.85;
}

.page-about .eco-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
  max-width:var(--container);
  margin:0 auto;
}

.page-about .eco-item{
  position:relative;
  border:1px solid var(--color-line);
  background:rgba(11,16,38,.78);
  padding:1.6rem 1.4rem 1.4rem;
  overflow:hidden;
  transition:border-color .2s ease,background-color .2s ease;
}

.page-about .eco-item:hover{
  border-color:var(--color-gold);
  background:rgba(13,22,46,.85);
}

.page-about .eco-index{
  position:absolute;
  top:.4rem;
  right:.9rem;
  font-family:var(--font-number);
  font-weight:700;
  font-size:3rem;
  color:rgba(255,201,56,.08);
  line-height:1;
}

.page-about .eco-item h3{
  font-family:var(--font-title);
  font-size:1.15rem;
  font-weight:700;
}

.page-about .eco-item p{
  color:var(--color-muted);
  font-size:.9rem;
  line-height:1.7;
  margin-top:.5rem;
  max-width:44ch;
}

.page-about .eco-links{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  max-width:var(--container);
  margin:2rem auto 0;
}

.page-about .btn{
  padding:.7rem 1.1rem;
  font-family:var(--font-body);
  font-size:.88rem;
  text-decoration:none;
  border:1px solid transparent;
  transition:color .2s ease,border-color .2s ease,background-color .2s ease;
}

.page-about .btn-outline{
  border-color:var(--color-line);
  color:var(--color-muted);
  background:transparent;
}

.page-about .btn-outline:hover{
  border-color:var(--color-gold);
  color:var(--color-gold);
  background:rgba(255,201,56,.06);
}

/* 桌面端断点 */
@media (min-width:700px){
  .page-about .team-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .page-about .cred-list{
    grid-template-columns:repeat(2,1fr);
  }

  .page-about .tech-metrics{
    grid-template-columns:repeat(3,1fr);
  }
}

@media (min-width:920px){
  .page-about .about-timeline{
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    gap:clamp(2rem,5vw,5rem);
    align-items:start;
  }

  .page-about .timeline-media{
    order:0;
    position:sticky;
    top:6rem;
  }

  .page-about .timeline-list{
    margin-left:0;
    padding-left:0;
    border-left:none;
  }

  .page-about .timeline-entry{
    display:grid;
    grid-template-columns:9rem 1fr;
    gap:2.25rem;
    padding:2.25rem 0;
    border-top:1px solid var(--color-line);
    align-items:start;
  }

  .page-about .timeline-entry:first-child{
    border-top:0;
    padding-top:0;
  }

  .page-about .timeline-entry::before{
    display:none;
  }

  .page-about .timeline-year{
    grid-column:1;
    text-align:right;
    font-size:clamp(3rem,6vw,5rem);
    margin-bottom:0;
    padding-top:.25rem;
  }

  .page-about .timeline-event{
    grid-column:2;
    border-left:1px solid var(--color-line);
    padding-left:2.25rem;
    position:relative;
  }

  .page-about .timeline-event::before{
    content:'';
    position:absolute;
    left:-.42rem;
    top:.75rem;
    width:.75rem;
    height:.75rem;
    border-radius:50%;
    background:var(--color-gold);
    box-shadow:0 0 0 .3rem rgba(255,201,56,.12);
  }

  .page-about .about-intro{
    margin-left:calc((100% - var(--container)) / 2 + 5rem);
  }

  .page-about .about-team-intro{
    grid-template-columns:.85fr 1.15fr;
    align-items:center;
  }

  .page-about .team-grid{
    grid-template-columns:repeat(5,1fr);
  }
}

@media (min-width:960px){
  .page-about .cred-layout{
    grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
    align-items:start;
  }

  .page-about .cred-seal{
    position:sticky;
    top:6rem;
  }

  .page-about .eco-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

@media (min-width:1100px){
  .page-about .tech-metrics{
    grid-template-columns:repeat(6,1fr);
  }
}