/* 品牌档案页专属样式 —— 限定在 .page-about 作用域内 */
.page-about{
  background:var(--color-bg);
  color:var(--color-text);
  overflow-x:hidden;
}

/* ========== 01 首屏宣言 ========== */
.page-about .about-hero{
  position:relative;
  background:var(--color-primary);
  color:var(--color-inverse);
  padding:2.5rem 0 3.5rem;
  overflow:hidden;
}
.page-about .about-hero__grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(var(--color-highlight) 1px, transparent 1px),
    linear-gradient(90deg, var(--color-highlight) 1px, transparent 1px);
  background-size:44px 44px;
  opacity:.22;
  pointer-events:none;
}
.page-about .about-hero__inner{
  position:relative;
  z-index:1;
}
.page-about .about-hero .breadcrumbs{
  margin-bottom:2rem;
}
.page-about .about-hero .breadcrumbs a,
.page-about .about-hero .breadcrumbs .breadcrumbs__sep{
  color:rgba(238,242,245,.58);
}
.page-about .about-hero .breadcrumbs [aria-current="page"]{
  color:var(--color-accent);
}
.page-about .about-hero__kicker{
  font-family:var(--font-mono);
  font-size:.875rem;
  letter-spacing:.14em;
  color:var(--color-accent);
  margin:0 0 .65rem;
}
.page-about .about-hero__title{
  font-family:var(--font-heading);
  font-size:1.375rem;
  font-weight:600;
  letter-spacing:.12em;
  color:rgba(238,242,245,.82);
  text-transform:uppercase;
  margin:0;
}
.page-about .about-hero__manifesto{
  font-family:var(--font-heading);
  font-size:clamp(2.25rem,9vw,4.5rem);
  font-weight:700;
  line-height:1.12;
  color:#ffffff;
  margin:.9rem 0 1.5rem;
}
.page-about .about-hero__lead{
  max-width:36em;
  font-size:1.0625rem;
  line-height:1.85;
  color:rgba(238,242,245,.78);
  margin:0;
}
.page-about .about-hero__cta{
  margin-top:2.25rem;
}
.page-about .about-hero__figure{
  margin:3rem 0 0;
}
.page-about .about-hero__figure img{
  width:100%;
  max-width:100%;
  height:auto;
  border:1px solid rgba(212,175,55,.45);
  box-shadow:0 30px 80px rgba(0,0,0,.4);
}
.page-about .about-hero__figure figcaption{
  font-family:var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.1em;
  color:rgba(238,242,245,.52);
  margin-top:.75rem;
  text-align:right;
}

/* ========== 02 我们是谁（窄幅宣言） ========== */
.page-about .about-mission{
  padding:5rem 0;
}
.page-about .about-section__index{
  font-family:var(--font-mono);
  font-size:.8125rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--color-text-secondary);
  margin:0 0 1.5rem;
}
.page-about .about-section__index span{
  color:var(--color-accent);
}
.page-about .about-mission__grid{
  display:grid;
  gap:2rem;
}
.page-about .about-mission__title{
  font-family:var(--font-heading);
  font-size:1.75rem;
  font-weight:700;
  line-height:1.35;
  color:var(--color-text);
  margin:0;
}
.page-about .about-mission__body p{
  font-size:1rem;
  line-height:1.85;
  color:var(--color-text-secondary);
  margin:0 0 1.125rem;
}
.page-about .about-mission__body p:last-child{
  margin-bottom:0;
}

/* ========== 03 成长轨迹（窄长时间线） ========== */
.page-about .about-timeline{
  background:var(--color-surface);
  border-top:1px solid var(--color-border);
  border-bottom:1px solid var(--color-border);
  padding:5rem 0;
}
.page-about .about-section__header{
  margin-bottom:2.5rem;
}
.page-about .about-section__header .about-section__index{
  margin-bottom:1rem;
}
.page-about .about-timeline__title{
  font-family:var(--font-heading);
  font-size:1.75rem;
  font-weight:700;
  line-height:1.3;
  margin:0 0 .75rem;
}
.page-about .about-section__summary{
  max-width:46em;
  font-size:1rem;
  line-height:1.7;
  color:var(--color-text-secondary);
  margin:0;
}
.page-about .about-timeline__layout{
  display:grid;
  gap:2rem;
}
.page-about .about-timeline__figure{
  max-width:120px;
  margin:0;
}
.page-about .about-timeline__figure img{
  width:100%;
  max-width:100%;
  height:auto;
}
.page-about .about-timeline__figure figcaption{
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.08em;
  color:var(--color-text-secondary);
  margin-top:.6rem;
  writing-mode:vertical-rl;
  text-orientation:mixed;
}
.page-about .about-timeline__list{
  list-style:none;
  margin:0;
  padding:0;
  position:relative;
}
.page-about .about-timeline__list::before{
  content:"";
  position:absolute;
  left:9px;
  top:14px;
  bottom:14px;
  width:2px;
  background:linear-gradient(to bottom, transparent, var(--color-accent) 8%, var(--color-accent) 92%, transparent);
}
.page-about .about-timeline__item{
  position:relative;
  padding:0 0 2.25rem 2.75rem;
}
.page-about .about-timeline__item:last-child{
  padding-bottom:0;
}
.page-about .about-timeline__node{
  position:absolute;
  left:0;
  top:.4rem;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--color-surface);
  border:3px solid var(--color-accent);
  transition:background var(--transition), box-shadow var(--transition);
}
.page-about .about-timeline__card{
  border:1px solid var(--color-border);
  background:var(--color-surface);
  border-radius:14px;
  padding:1.375rem 1.5rem;
  transition:border-color var(--transition), background var(--transition), transform var(--transition), box-shadow var(--transition);
}
.page-about .about-timeline__tag{
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--color-accent);
  margin:0 0 .5rem;
}
.page-about .about-timeline__card h3{
  font-family:var(--font-heading);
  font-size:1.1875rem;
  font-weight:600;
  margin:0 0 .625rem;
  color:var(--color-text);
}
.page-about .about-timeline__card p:last-child{
  font-size:.9375rem;
  line-height:1.7;
  color:var(--color-text-secondary);
  margin:0;
}
.page-about .about-timeline__item:hover .about-timeline__card,
.page-about .about-timeline__item:focus-visible .about-timeline__card{
  border-color:var(--color-accent);
  background:var(--color-highlight);
  transform:translateY(-3px);
  box-shadow:0 10px 32px rgba(26,42,58,.08);
}
.page-about .about-timeline__item:hover .about-timeline__node,
.page-about .about-timeline__item:focus-visible .about-timeline__node{
  background:var(--color-accent);
  box-shadow:0 0 0 6px var(--color-highlight);
}
.page-about .about-timeline__item:focus-visible{
  outline:2px solid var(--color-accent);
  outline-offset:4px;
  border-radius:14px;
}

/* ========== 04 内容治理 ========== */
.page-about .about-governance{
  padding:5rem 0;
}
.page-about .about-governance__title{
  font-family:var(--font-heading);
  font-size:1.75rem;
  font-weight:700;
  line-height:1.3;
  margin:0 0 .75rem;
}
.page-about .about-governance__layout{
  display:grid;
  gap:2.5rem;
}
.page-about .about-governance__block{
  border-left:3px solid var(--color-accent);
  padding:.15rem 0 .15rem 1.375rem;
  margin-bottom:1.875rem;
}
.page-about .about-governance__block h3{
  font-family:var(--font-heading);
  font-size:1.125rem;
  font-weight:600;
  margin:0;
  color:var(--color-text);
}
.page-about .about-governance__block ul,
.page-about .about-governance__block ol{
  list-style:none;
  margin:1rem 0 0;
  padding:0;
}
.page-about .about-governance__block li{
  position:relative;
  padding-left:1.25rem;
  margin-bottom:.55rem;
  font-size:.9375rem;
  line-height:1.65;
  color:var(--color-text-secondary);
}
.page-about .about-governance__block li::before{
  content:"";
  position:absolute;
  left:0;
  top:.68em;
  width:6px;
  height:6px;
  background:var(--color-accent);
  border-radius:1px;
  transform:rotate(45deg);
}
.page-about .about-governance__block ol li::before{
  border-radius:50%;
}
.page-about .about-governance__figure{
  margin:0;
  align-self:start;
}
.page-about .about-governance__figure img{
  width:100%;
  max-width:100%;
  height:auto;
  border:1px solid var(--color-border);
  border-radius:14px;
}
.page-about .about-governance__figure figcaption{
  font-family:var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.08em;
  color:var(--color-text-secondary);
  margin-top:.75rem;
  text-align:center;
}

/* ========== 05 团队与协作（非对称双卡片） ========== */
.page-about .about-team{
  background:
    linear-gradient(rgba(212,175,55,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,.045) 1px, transparent 1px),
    var(--color-primary);
  background-size:48px 48px;
  color:var(--color-inverse);
  padding:5rem 0;
}
.page-about .about-team .about-section__index{
  color:rgba(238,242,245,.55);
}
.page-about .about-team .about-section__index span{
  color:var(--color-accent);
}
.page-about .about-team__title{
  font-family:var(--font-heading);
  font-size:1.75rem;
  font-weight:700;
  line-height:1.3;
  margin:0 0 .75rem;
  color:#ffffff;
}
.page-about .about-team .about-section__summary{
  color:rgba(238,242,245,.64);
}
.page-about .about-team__layout{
  display:grid;
  gap:1.5rem;
  margin-top:2.5rem;
}
.page-about .about-team__card{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  padding:2rem 1.875rem;
  backdrop-filter:blur(6px);
  transition:border-color var(--transition), background var(--transition), transform var(--transition);
}
.page-about .about-team__card:hover,
.page-about .about-team__card:focus-visible{
  border-color:var(--color-accent);
  background:rgba(255,255,255,.09);
  transform:translateY(-4px);
}
.page-about .about-team__card:focus-visible{
  outline:2px solid var(--color-accent);
  outline-offset:4px;
}
.page-about .about-team__count{
  font-family:var(--font-mono);
  font-size:3.5rem;
  font-weight:700;
  line-height:1;
  color:var(--color-accent);
  margin:0 0 1rem;
}
.page-about .about-team__card h3{
  font-family:var(--font-heading);
  font-size:1.375rem;
  font-weight:600;
  margin:0 0 .75rem;
  color:#ffffff;
}
.page-about .about-team__desc{
  font-size:.9375rem;
  line-height:1.75;
  color:rgba(238,242,245,.72);
  margin:0 0 1.375rem;
}
.page-about .about-team__list{
  list-style:none;
  margin:0;
  padding:0;
}
.page-about .about-team__list li{
  position:relative;
  padding-left:1.25rem;
  margin-bottom:.55rem;
  font-size:.9375rem;
  line-height:1.6;
  color:rgba(238,242,245,.78);
}
.page-about .about-team__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.65em;
  width:9px;
  height:2px;
  background:var(--color-accent);
}

/* ========== 06 数据带 ========== */
.page-about .about-stats{
  background:var(--color-surface);
  border-top:1px solid var(--color-border);
  border-bottom:1px solid var(--color-border);
  padding:3.25rem 0;
}
.page-about .about-stats__grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:2.125rem 1.5rem;
}
.page-about .about-stats__item{
  text-align:center;
}
.page-about .about-stats__num{
  display:block;
  font-family:var(--font-mono);
  font-size:2rem;
  font-weight:700;
  line-height:1.1;
  color:var(--color-primary);
}
.page-about .about-stats__label{
  display:block;
  font-size:.8125rem;
  letter-spacing:.04em;
  color:var(--color-text-secondary);
  margin-top:.375rem;
}

/* ========== 07 使用边界 ========== */
.page-about .about-compliance{
  padding:5rem 0;
}
.page-about .about-compliance__inner{
  max-width:760px;
  margin:0 auto;
  border-left:3px solid var(--color-accent);
  padding-left:1.75rem;
}
.page-about .about-compliance .about-section__index{
  margin-bottom:1rem;
}
.page-about .about-compliance h2{
  font-family:var(--font-heading);
  font-size:1.625rem;
  font-weight:700;
  line-height:1.35;
  margin:0 0 1.25rem;
}
.page-about .about-compliance p{
  font-size:1rem;
  line-height:1.8;
  color:var(--color-text-secondary);
  margin:0 0 1.125rem;
}
.page-about .about-compliance p:last-child{
  margin-bottom:0;
}
.page-about .about-compliance a{
  color:var(--color-accent);
  text-decoration-color:rgba(212,175,55,.4);
  text-underline-offset:4px;
}
.page-about .about-compliance a:hover,
.page-about .about-compliance a:focus-visible{
  text-decoration-color:var(--color-accent);
}
.page-about .about-compliance__meta{
  font-family:var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.05em;
  color:var(--color-text-secondary);
  margin-top:1.5rem;
  padding-top:1.25rem;
  border-top:1px solid var(--color-border);
}

/* ========== 响应式增强 ========== */
@media (min-width: 768px){
  .page-about .about-hero{
    padding:3.5rem 0 4.5rem;
  }
  .page-about .about-mission__grid{
    grid-template-columns:1fr 1.45fr;
    gap:3.5rem;
  }
  .page-about .about-timeline__layout{
    grid-template-columns:120px 1fr;
    gap:2.75rem;
  }
  .page-about .about-stats__grid{
    grid-template-columns:repeat(3,1fr);
    gap:2.5rem 1.5rem;
  }
  .page-about .about-stats__num{
    font-size:2.375rem;
  }
  .page-about .about-governance__layout{
    grid-template-columns:1fr 1fr;
    gap:3rem;
  }
  .page-about .about-team__layout{
    grid-template-columns:1fr 1fr;
    gap:1.75rem;
  }
}

@media (min-width: 1024px){
  .page-about .about-hero__inner{
    display:grid;
    grid-template-columns:7fr 5fr;
    gap:4rem;
    align-items:center;
    min-height:72vh;
    padding-top:1rem;
    padding-bottom:1rem;
  }
  .page-about .about-hero__figure{
    margin:0;
  }
  .page-about .about-hero__figure img{
    border-width:1px;
    box-shadow:0 40px 90px rgba(0,0,0,.45);
  }
  .page-about .about-mission{
    padding:7rem 0;
  }
  .page-about .about-mission .container{
    max-width:960px;
    margin:0 auto;
  }
  .page-about .about-timeline{
    padding:7rem 0;
  }
  .page-about .about-timeline .container{
    max-width:1080px;
    margin:0 auto;
  }
  .page-about .about-timeline__layout{
    grid-template-columns:140px 1fr;
    gap:4rem;
    margin-top:3.5rem;
  }
  .page-about .about-timeline__figure{
    max-width:140px;
  }
  .page-about .about-timeline__card{
    padding:1.625rem 2rem;
  }
  .page-about .about-governance{
    padding:7rem 0;
  }
  .page-about .about-governance__layout{
    gap:4.5rem;
  }
  .page-about .about-team{
    padding:7rem 0;
  }
  .page-about .about-team__layout{
    grid-template-columns:7fr 5fr;
    gap:2.5rem;
    margin-top:3rem;
  }
  .page-about .about-team__card{
    padding:2.5rem;
  }
  .page-about .about-stats__grid{
    grid-template-columns:repeat(6,1fr);
    gap:1.5rem;
  }
  .page-about .about-stats__num{
    font-size:2.625rem;
  }
  .page-about .about-compliance{
    padding:6rem 0;
  }
}
