/* ===== 品牌使命页 · 页面专属样式（作用域 .page-about） ===== */

.page-about{
  --ab-gap:clamp(18px,3.2vw,54px);
  --ab-side-top:calc(var(--sb-navbar-h) + 26px);
  --ab-hair:rgba(231,237,249,.14);
}

.page-about__crumbs{
  padding-top:clamp(14px,2.4vw,28px);
}

/* ---------- 封面：4:8 分屏 ---------- */
.page-about .ab-hero{
  padding-top:clamp(18px,3vw,38px);
}

.page-about .ab-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(26px,4vw,58px);
  align-items:start;
}

.page-about .ab-hero__main{
  display:grid;
  gap:clamp(16px,2.2vw,26px);
  min-width:0;
}

.page-about .ab-hero__media{
  margin-top:clamp(6px,1.4vw,16px);
}

/* ---------- 左侧章节轨道 ---------- */
.page-about .ab-rail{
  align-self:start;
  padding:18px 18px 20px;
  border:1px solid var(--sb-line);
  border-radius:var(--sb-r);
  background:var(--sb-glass-bg);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.page-about .ab-rail__tag{
  margin:0 0 14px;
  font-family:var(--sb-mono);
  font-size:12px;
  letter-spacing:.12em;
  color:var(--sb-steel);
}

.page-about .ab-rail__list{
  position:relative;
  margin:0;
  padding:0 0 0 20px;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 16px;
}

.page-about .ab-rail__list::before{
  content:"";
  position:absolute;
  left:4px;
  top:7px;
  bottom:7px;
  width:1px;
  background:linear-gradient(180deg,var(--sb-cyan),var(--sb-blue) 52%,rgba(231,237,249,.06));
  opacity:.75;
}

.page-about .ab-rail__item{
  min-width:0;
}

.page-about .ab-rail__link{
  position:relative;
  display:flex;
  align-items:baseline;
  gap:7px;
  font-size:14px;
  line-height:1.4;
  color:var(--sb-steel);
  text-decoration:none;
  transition:color .2s var(--sb-ease);
}

.page-about .ab-rail__link::before{
  content:"";
  position:absolute;
  left:-20px;
  top:.42em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--sb-ink);
  border:1px solid rgba(255,106,26,.6);
  transition:background .2s var(--sb-ease),box-shadow .2s var(--sb-ease);
}

.page-about .ab-rail__link:hover,
.page-about .ab-rail__link:focus-visible{
  color:var(--sb-white);
}

.page-about .ab-rail__link[data-current]{
  color:var(--sb-white);
}

.page-about .ab-rail__link[data-current]::before{
  background:var(--sb-orange);
  box-shadow:0 0 0 4px rgba(255,106,26,.16);
}

.page-about .ab-rail__num{
  font-family:var(--sb-mono);
  font-size:12px;
  color:var(--sb-blue);
}

.page-about .ab-rail__link[data-current] .ab-rail__num{
  color:var(--sb-orange);
}

/* ---------- 倾斜分隔带 ---------- */
.page-about .ab-slant{
  height:2px;
  max-width:var(--sb-max);
  margin:clamp(30px,5vw,60px) auto;
  background:var(--sb-grad);
  opacity:.5;
  transform:rotate(-6deg) scaleX(1.02);
}

/* ---------- 通用叙事行：左窄右宽 ---------- */
.page-about .ab-row{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(14px,2.4vw,34px);
}

.page-about .ab-row__side{
  display:flex;
  align-items:baseline;
  gap:12px;
  min-width:0;
}

.page-about .ab-row__num{
  font-family:var(--sb-mono);
  font-size:28px;
  font-weight:700;
  line-height:1;
  letter-spacing:-.02em;
  color:var(--sb-orange);
}

.page-about .ab-row__note{
  margin:0;
  font-size:13px;
  letter-spacing:.06em;
  color:var(--sb-steel);
}

.page-about .ab-row__body{
  display:grid;
  gap:clamp(12px,1.8vw,20px);
  min-width:0;
}

.page-about .ab-row__body > p{
  margin:0;
  max-width:44ch;
}

.page-about .ab-quote{
  margin:8px 0 0;
  padding:14px 18px;
  border-left:3px solid var(--sb-orange);
  border-radius:0 var(--sb-r-s) var(--sb-r-s) 0;
  background:linear-gradient(100deg,rgba(255,106,26,.12),rgba(5,7,15,0) 70%);
  color:var(--sb-white);
  font-weight:600;
}

/* ---------- 三条主线 ---------- */
.page-about .ab-lines{
  display:grid;
  gap:14px;
}

.page-about .ab-line{
  padding:clamp(16px,2.4vw,24px);
  border:1px solid var(--sb-line);
  border-left:3px solid rgba(29,107,255,.55);
  border-radius:var(--sb-r);
  background:linear-gradient(118deg,rgba(29,107,255,.10),rgba(5,7,15,0) 58%),var(--sb-ink-2);
  transition:border-left-color .25s var(--sb-ease),background-color .25s var(--sb-ease);
}

.page-about .ab-line:hover,
.page-about .ab-line:focus-within{
  border-left-color:var(--sb-orange);
}

.page-about .ab-line__tag{
  margin:0 0 8px;
  font-size:12px;
  letter-spacing:.1em;
  color:var(--sb-cyan);
}

.page-about .ab-line h3{
  margin:0 0 8px;
}

.page-about .ab-line p{
  margin:0;
  max-width:46ch;
}

.page-about .ab-line__more{
  margin-top:12px !important;
}

/* ---------- 服务对象 ---------- */
.page-about .ab-who{
  margin:0;
  display:grid;
}

.page-about .ab-who__item{
  display:grid;
  gap:6px;
  padding:18px 0;
  border-top:1px solid var(--ab-hair);
}

.page-about .ab-who__item:last-child{
  border-bottom:1px solid var(--ab-hair);
}

.page-about .ab-who__item dt{
  font-size:18px;
  font-weight:700;
  color:var(--sb-white);
}

.page-about .ab-who__item dd{
  margin:0;
  color:var(--sb-steel);
  font-size:16px;
  line-height:1.7;
  max-width:46ch;
}

/* ---------- 团队 ---------- */
.page-about .ab-team{
  display:grid;
  gap:clamp(18px,3vw,38px);
}

.page-about .ab-team__media{
  min-width:0;
}

.page-about .ab-team__list{
  display:grid;
  gap:12px;
  align-content:start;
  min-width:0;
}

.page-about .ab-group{
  position:relative;
  padding:16px 18px 16px 52px;
  border:1px solid var(--sb-line);
  border-radius:var(--sb-r);
  background:var(--sb-ink-2);
  transition:border-color .25s var(--sb-ease),background .25s var(--sb-ease);
}

.page-about .ab-group:hover,
.page-about .ab-group:focus-within{
  border-color:rgba(22,224,210,.5);
  background:linear-gradient(110deg,rgba(22,224,210,.10),rgba(11,18,38,.9) 62%);
}

.page-about .ab-group__num{
  position:absolute;
  left:16px;
  top:17px;
  margin:0;
  font-size:13px;
  font-weight:700;
  color:var(--sb-orange);
}

.page-about .ab-group h3{
  margin:0 0 6px;
  font-size:20px;
}

.page-about .ab-group p{
  margin:0;
  font-size:15px;
  line-height:1.7;
  color:var(--sb-steel);
}

.page-about .ab-note{
  margin:6px 0 0;
  padding-top:12px;
  border-top:1px dashed var(--sb-line-strong);
  font-size:14px;
  line-height:1.75;
  color:var(--sb-steel);
}

/* ---------- 覆盖网络 ---------- */
.page-about .ab-reach__media{
  margin-bottom:clamp(14px,2vw,22px);
}

.page-about .ab-reach__stats{
  display:grid;
  gap:14px;
  margin-top:clamp(10px,1.6vw,18px);
}

.page-about .ab-stat{
  padding:18px 20px;
  border:1px solid var(--sb-line);
  border-radius:var(--sb-r);
  background:linear-gradient(135deg,rgba(29,107,255,.12),rgba(11,18,38,.9) 60%);
}

.page-about .ab-stat__num{
  margin:0 0 6px;
  font-family:var(--sb-mono);
  font-size:clamp(38px,6vw,58px);
  font-weight:700;
  line-height:1;
  letter-spacing:-.02em;
  color:var(--sb-white);
}

.page-about .ab-stat__unit{
  margin-left:4px;
  font-size:16px;
  font-weight:600;
  color:var(--sb-cyan);
}

.page-about .ab-stat__label{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:var(--sb-steel);
}

/* ---------- 发展节点 ---------- */
.page-about .ab-road{
  position:relative;
  margin:0;
  padding:0 0 0 24px;
  list-style:none;
  display:grid;
  gap:20px;
}

.page-about .ab-road::before{
  content:"";
  position:absolute;
  left:5px;
  top:8px;
  bottom:8px;
  width:1px;
  background:linear-gradient(180deg,var(--sb-cyan),var(--sb-blue) 58%,rgba(231,237,249,.06));
  opacity:.7;
}

.page-about .ab-road__item{
  position:relative;
  min-width:0;
}

.page-about .ab-road__item::before{
  content:"";
  position:absolute;
  left:-24px;
  top:8px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--sb-orange);
  box-shadow:0 0 0 4px rgba(255,106,26,.14);
}

.page-about .ab-road__when{
  margin:0 0 4px;
  font-size:12px;
  letter-spacing:.1em;
  color:var(--sb-cyan);
}

.page-about .ab-road__item h3{
  margin:0 0 6px;
  font-size:20px;
}

.page-about .ab-road__item p{
  margin:0;
  max-width:46ch;
  font-size:15px;
  line-height:1.75;
}

/* ---------- 服务标准 ---------- */
.page-about .ab-pledge{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}

.page-about .ab-pledge__item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:16px 18px;
  border:1px solid var(--sb-line);
  border-radius:var(--sb-r);
  background:var(--sb-ink-2);
}

.page-about .ab-pledge__num{
  font-size:13px;
  font-weight:700;
  color:var(--sb-orange);
  padding-top:3px;
}

.page-about .ab-pledge__item p{
  margin:0;
  font-size:15px;
  line-height:1.75;
}

/* ---------- 收口 ---------- */
.page-about .ab-close__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0;
}

/* ---------- 响应式 ---------- */
@media (min-width:760px){
  .page-about .ab-rail__list{
    grid-template-columns:minmax(0,1fr);
  }

  .page-about .ab-who__item{
    grid-template-columns:minmax(0,4fr) minmax(0,8fr);
    gap:24px;
    align-items:start;
  }

  .page-about .ab-reach__stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (min-width:900px){
  .page-about .ab-hero__grid{
    grid-template-columns:minmax(0,4fr) minmax(0,8fr);
    gap:clamp(30px,4vw,62px);
  }

  .page-about .ab-rail{
    position:sticky;
    top:var(--ab-side-top);
  }

  .page-about .ab-row{
    grid-template-columns:minmax(0,4fr) minmax(0,8fr);
    gap:clamp(24px,3.2vw,52px);
  }

  .page-about .ab-row__side{
    position:sticky;
    top:var(--ab-side-top);
    align-self:start;
    display:grid;
    gap:10px;
    align-content:start;
  }

  .page-about .ab-row__num{
    font-size:44px;
  }

  .page-about .ab-team{
    grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  }

  .page-about .ab-line:nth-child(2){
    transform:translateX(28px);
  }

  .page-about .ab-line:nth-child(3){
    transform:translateX(10px);
  }
}

@media (prefers-reduced-motion:reduce){
  .page-about .ab-slant{
    transform:none;
  }
  .page-about .ab-line:nth-child(2),
  .page-about .ab-line:nth-child(3){
    transform:none;
  }
}
<<<END>>>