.page-about{
  --ab-line: rgba(216,199,168,.75);
  --ab-line-soft: rgba(216,199,168,.4);
  --ab-glow: rgba(255,211,106,.18);
  background: var(--c-paper);
  color: var(--c-ink);
  font-family: var(--font-body);
  overflow-x: clip;
}

/* ===== 首屏 ===== */
.page-about .ab-hero{
  position: relative;
  overflow: hidden;
  color: var(--c-surface);
  background-image: linear-gradient(168deg, var(--c-blue-deep) 0%, var(--c-blue) 46%, var(--c-red) 46.4%, var(--c-red-deep) 100%);
  padding: clamp(96px,13vw,148px) 0 clamp(48px,7vw,84px);
}
.page-about .ab-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    repeating-linear-gradient(90deg, rgba(217,164,65,.14) 0 1px, transparent 1px 92px),
    repeating-linear-gradient(0deg, rgba(217,164,65,.09) 0 1px, transparent 1px 92px);
  pointer-events:none;
}
.page-about .ab-hero::after{
  content:"";
  position:absolute;
  right:-90px;
  bottom:-120px;
  width:320px;
  height:320px;
  border:1px solid rgba(255,211,106,.32);
  border-radius:50%;
  box-shadow:0 0 0 26px rgba(255,211,106,.05), 0 0 0 52px rgba(255,211,106,.04);
  pointer-events:none;
}
.page-about .ab-hero-inner{
  position:relative;
  z-index:1;
}
.page-about .ab-hero .breadcrumb{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  font-size:var(--fs-12);
  letter-spacing:.08em;
  color:rgba(255,249,239,.66);
  margin-bottom:clamp(22px,3vw,36px);
}
.page-about .ab-hero .breadcrumb a{
  color:rgba(255,249,239,.86);
  text-decoration:none;
  border-bottom:1px solid rgba(255,211,106,.4);
}
.page-about .ab-hero .breadcrumb a:hover{
  color:var(--c-gold-glow);
}
.page-about .ab-hero-grid{
  display:grid;
  gap:clamp(28px,5vw,52px);
  align-items:start;
}
.page-about .ab-hero .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--font-mono);
  font-size:var(--fs-12);
  letter-spacing:.16em;
  color:var(--c-gold-glow);
  margin:0 0 16px;
}
.page-about .ab-hero .eyebrow::before{
  content:"";
  width:26px;
  height:1px;
  background:var(--c-gold-glow);
}
.page-about .ab-hero h1{
  font-family:var(--font-display);
  font-size:clamp(30px,5.6vw,58px);
  line-height:1.16;
  letter-spacing:.01em;
  font-weight:900;
  margin:0 0 20px;
  color:#FFF9EF;
  text-shadow:0 2px 0 rgba(92,15,13,.25);
  max-width:16em;
}
.page-about .ab-hero-lede{
  font-size:clamp(15px,2vw,18px);
  line-height:1.8;
  color:rgba(255,249,239,.9);
  max-width:36em;
  margin:0 0 26px;
}
.page-about .ab-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.page-about .ab-btn-line{
  color:#FFF9EF;
  border-color:rgba(255,211,106,.6);
  background:transparent;
}
.page-about .ab-btn-line:hover{
  color:var(--c-blue-deep);
  background:var(--c-gold-glow);
  border-color:var(--c-gold-glow);
}
.page-about .ab-hero-stats{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about .ab-hero-stats li{
  background:rgba(15,35,56,.42);
  border:1px solid rgba(217,164,65,.42);
  border-radius:var(--radius);
  padding:16px 18px;
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:16px;
  backdrop-filter:blur(2px);
  box-shadow:var(--sh-1);
}
.page-about .ab-stat-num{
  font-size:clamp(22px,3.4vw,30px);
  font-weight:700;
  color:var(--c-gold-glow);
  letter-spacing:.02em;
  white-space:nowrap;
}
.page-about .ab-stat-label{
  font-size:var(--fs-14);
  line-height:1.6;
  color:rgba(255,249,239,.82);
}

/* ===== 正文两栏 ===== */
.page-about .ab-body{
  padding:clamp(40px,6vw,76px) 0 clamp(56px,8vw,96px);
}
.page-about .ab-index{
  border-top:2px solid var(--c-red);
  padding-top:14px;
  margin-bottom:clamp(28px,4vw,44px);
}
.page-about .ab-index-title{
  font-family:var(--font-display);
  font-weight:700;
  font-size:var(--fs-14);
  letter-spacing:.14em;
  color:var(--c-gold-text);
  margin:0 0 12px;
}
.page-about .ab-index ol{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding-bottom:6px;
}
.page-about .ab-index li{
  flex:0 0 auto;
}
.page-about .ab-index a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  font-size:var(--fs-14);
  color:var(--c-ink-soft);
  text-decoration:none;
  border:1px solid var(--ab-line);
  border-radius:var(--radius);
  background:var(--c-surface);
  white-space:nowrap;
  transition:color .2s ease, border-color .2s ease, background-color .2s ease;
}
.page-about .ab-index a .mono{
  font-size:var(--fs-12);
  color:var(--c-gold-text);
}
.page-about .ab-index a:hover,
.page-about .ab-index a:focus-visible{
  color:var(--c-red);
  border-color:var(--c-red);
  background:#fff;
}
.page-about .ab-flow{
  min-width:0;
}

/* ===== 章节通用 ===== */
.page-about .ab-section{
  margin-top:clamp(40px,6vw,72px);
  padding-top:clamp(22px,3.4vw,34px);
  border-top:1px solid var(--ab-line);
}
.page-about .ab-section:first-child{
  margin-top:0;
}
.page-about .ab-section-head{
  position:relative;
  padding-left:clamp(0px,0vw,0px);
  margin-bottom:clamp(22px,3vw,32px);
}
.page-about .ab-num{
  display:block;
  font-size:var(--fs-12);
  letter-spacing:.22em;
  color:var(--c-gold-text);
  margin-bottom:10px;
}
.page-about .ab-section-head h2{
  font-family:var(--font-display);
  font-size:clamp(22px,3.6vw,36px);
  line-height:1.28;
  font-weight:900;
  margin:0 0 12px;
  color:var(--c-ink);
  max-width:20em;
}
.page-about .ab-lede{
  margin:0;
  font-size:var(--fs-16);
  line-height:1.75;
  color:var(--c-ink-soft);
  max-width:34em;
}
.page-about .ab-prose p{
  margin:0 0 16px;
  font-size:var(--fs-16);
  line-height:1.8;
  color:var(--c-ink);
  max-width:52ch;
}
.page-about .ab-prose p:last-child{
  margin-bottom:0;
}

/* ===== 01 品牌起点 ===== */
.page-about .ab-origin-grid{
  display:grid;
  gap:clamp(20px,3vw,36px);
  align-items:start;
}
.page-about .ab-origin-media{
  margin:0;
  border:1px solid var(--ab-line);
  background:var(--c-surface);
  padding:10px;
  box-shadow:var(--sh-1);
}
.page-about .ab-origin-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  aspect-ratio:4 / 3;
}
.page-about .media-caption{
  display:block;
  margin-top:10px;
  font-size:var(--fs-12);
  line-height:1.6;
  color:var(--c-ink-soft);
  padding-left:10px;
  border-left:2px solid var(--c-gold);
}
.page-about .ab-fact-row{
  list-style:none;
  margin:clamp(24px,3.6vw,36px) 0 0;
  padding:0;
  display:grid;
  gap:14px;
}
.page-about .ab-fact{
  padding:18px 18px 16px;
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  box-shadow:var(--sh-1);
  border-radius:var(--radius);
}
.page-about .ab-fact .card-index{
  display:inline-block;
  font-size:var(--fs-12);
  letter-spacing:.12em;
  color:var(--c-gold-text);
  border-bottom:1px solid var(--ab-line);
  padding-bottom:4px;
  margin-bottom:10px;
}
.page-about .ab-fact h3{
  font-family:var(--font-display);
  font-size:var(--fs-18);
  font-weight:700;
  margin:0 0 8px;
  color:var(--c-ink);
}
.page-about .ab-fact p{
  margin:0;
  font-size:var(--fs-14);
  line-height:1.75;
  color:var(--c-ink-soft);
}

/* ===== 02 文化主题带 ===== */
.page-about .ab-band{
  margin-top:clamp(40px,6vw,72px);
  background-color:var(--c-green);
  background-image:
    repeating-linear-gradient(135deg, rgba(217,164,65,.10) 0 1px, transparent 1px 22px),
    linear-gradient(160deg, var(--c-green-deep), var(--c-green));
  color:var(--c-surface);
  border-radius:var(--radius);
  border:1px solid rgba(217,164,65,.38);
  overflow:hidden;
}
.page-about .ab-band-inner{
  padding:clamp(26px,4.4vw,48px);
}
.page-about .ab-band .eyebrow{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:var(--fs-12);
  letter-spacing:.18em;
  color:var(--c-gold-glow);
}
.page-about .ab-band h2{
  font-family:var(--font-display);
  font-size:clamp(22px,3.4vw,34px);
  line-height:1.3;
  font-weight:900;
  margin:0 0 14px;
  color:#FFF9EF;
  max-width:18em;
}
.page-about .ab-band-lede{
  margin:0 0 24px;
  font-size:var(--fs-16);
  line-height:1.8;
  color:rgba(255,249,239,.88);
  max-width:48ch;
}
.page-about .ab-swatches{
  list-style:none;
  margin:0 0 22px;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about .ab-swatch{
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-areas:
    "chip name"
    "chip desc";
  align-items:start;
  gap:2px 14px;
  padding:14px 16px;
  background:rgba(15,35,56,.34);
  border:1px solid rgba(255,249,239,.16);
  border-radius:var(--radius);
}
.page-about .ab-swatch-chip{
  grid-area:chip;
  width:34px;
  height:34px;
  border-radius:2px;
  border:1px solid rgba(255,249,239,.4);
  align-self:center;
}
.page-about .ab-swatch--red .ab-swatch-chip{ background:var(--c-red); }
.page-about .ab-swatch--gold .ab-swatch-chip{ background:var(--c-gold); }
.page-about .ab-swatch--green .ab-swatch-chip{ background:var(--c-green-deep); }
.page-about .ab-swatch--blue .ab-swatch-chip{ background:var(--c-blue); }
.page-about .ab-swatch strong{
  grid-area:name;
  font-size:var(--fs-16);
  font-weight:700;
  color:var(--c-gold-glow);
  letter-spacing:.06em;
}
.page-about .ab-swatch span:last-child{
  grid-area:desc;
  font-size:var(--fs-14);
  line-height:1.7;
  color:rgba(255,249,239,.86);
}
.page-about .ab-band-note{
  margin:0;
  padding-top:18px;
  border-top:1px solid rgba(217,164,65,.34);
  font-size:var(--fs-14);
  line-height:1.8;
  color:rgba(255,249,239,.8);
  max-width:52ch;
}

/* ===== 03 版本时间轴 ===== */
.page-about .ab-timeline-figure{
  margin:0 0 clamp(22px,3vw,32px);
  border:1px solid var(--ab-line);
  background:var(--c-blue-deep);
  padding:8px;
  box-shadow:var(--sh-1);
}
.page-about .ab-timeline-figure img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  aspect-ratio:7 / 4;
}
.page-about .ab-timeline-figure .media-caption{
  color:rgba(255,249,239,.72);
  border-left-color:var(--c-gold);
  padding-left:10px;
  margin-top:8px;
}
.page-about .ab-timeline{
  list-style:none;
  margin:0;
  padding:0 0 0 18px;
  border-left:1px solid var(--ab-line);
}
.page-about .ab-tl-item{
  position:relative;
  margin-bottom:12px;
}
.page-about .ab-tl-item::before{
  content:"";
  position:absolute;
  left:-23px;
  top:20px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--c-gold);
  box-shadow:0 0 0 4px rgba(217,164,65,.18);
}
.page-about .ab-tl-item:last-child{
  margin-bottom:0;
}
.page-about .ab-tl-item details{
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  border-radius:var(--radius);
  box-shadow:var(--sh-1);
  overflow:hidden;
}
.page-about .ab-tl-item details[open]{
  border-color:var(--c-gold);
}
.page-about .ab-tl-item summary{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 44px 14px 16px;
  cursor:pointer;
  list-style:none;
  position:relative;
}
.page-about .ab-tl-item summary::-webkit-details-marker{
  display:none;
}
.page-about .ab-tl-year{
  font-size:var(--fs-14);
  font-weight:700;
  color:var(--c-gold-text);
  border:1px solid var(--ab-line);
  border-radius:2px;
  padding:3px 8px;
  white-space:nowrap;
}
.page-about .ab-tl-name{
  font-family:var(--font-display);
  font-size:var(--fs-16);
  font-weight:700;
  color:var(--c-ink);
  line-height:1.5;
}
.page-about .ab-tl-hint{
  position:absolute;
  right:16px;
  top:50%;
  width:12px;
  height:12px;
  margin-top:-6px;
}
.page-about .ab-tl-hint::before,
.page-about .ab-tl-hint::after{
  content:"";
  position:absolute;
  background:var(--c-red);
  border-radius:1px;
}
.page-about .ab-tl-hint::before{
  left:0; top:5px; width:12px; height:2px;
}
.page-about .ab-tl-hint::after{
  left:5px; top:0; width:2px; height:12px;
  transition:transform .2s ease, opacity .2s ease;
}
.page-about .ab-tl-item details[open] .ab-tl-hint::after{
  transform:scaleY(0);
  opacity:0;
}
.page-about .ab-tl-body{
  padding:0 16px 16px;
  border-top:1px solid var(--ab-line-soft);
  margin-top:0;
}
.page-about .ab-tl-body p{
  margin:14px 0 0;
  font-size:var(--fs-14);
  line-height:1.8;
  color:var(--c-ink-soft);
  max-width:52ch;
}

/* ===== 04 编辑与审核 ===== */
.page-about .ab-editorial-grid{
  display:grid;
  gap:clamp(20px,3vw,32px);
  align-items:start;
}
.page-about .ab-editorial-media{
  margin:0;
  border:1px solid var(--ab-line);
  background:var(--c-surface);
  padding:10px;
  box-shadow:var(--sh-1);
}
.page-about .ab-editorial-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  aspect-ratio:10 / 7;
}
.page-about .ab-steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-about .ab-steps li{
  position:relative;
  padding:14px 16px 14px 54px;
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  border-left:3px solid var(--c-red);
  border-radius:var(--radius);
}
.page-about .ab-step-num{
  position:absolute;
  left:14px;
  top:16px;
  font-size:var(--fs-12);
  font-weight:700;
  color:var(--c-red);
  letter-spacing:.06em;
}
.page-about .ab-steps h3{
  font-family:var(--font-display);
  font-size:var(--fs-16);
  font-weight:700;
  margin:0 0 6px;
  color:var(--c-ink);
}
.page-about .ab-steps p{
  margin:0;
  font-size:var(--fs-14);
  line-height:1.75;
  color:var(--c-ink-soft);
}
.page-about .ab-tag-block{
  margin-top:clamp(22px,3vw,32px);
  padding:18px;
  background:rgba(31,77,63,.06);
  border:1px dashed var(--ab-line);
  border-radius:var(--radius);
}
.page-about .ab-tag-title{
  margin:0 0 12px;
  font-size:var(--fs-14);
  line-height:1.7;
  color:var(--c-gold-text);
  font-weight:700;
}
.page-about .ab-tag-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.page-about .ab-tag-list .tag{
  font-size:var(--fs-12);
  letter-spacing:.04em;
  padding:5px 10px;
  border:1px solid var(--ab-line);
  border-radius:2px;
  background:var(--c-surface);
  color:var(--c-ink-soft);
}
.page-about .ab-tag-list .tag--red{
  color:var(--c-red);
  border-color:rgba(179,38,30,.42);
  background:rgba(179,38,30,.06);
}
.page-about .ab-tag-list .tag--cyan{
  color:#0B6E6A;
  border-color:rgba(0,168,160,.42);
  background:rgba(0,168,160,.08);
}
.page-about .ab-tag-list .tag--violet{
  color:var(--c-violet);
  border-color:rgba(109,74,166,.4);
  background:rgba(109,74,166,.07);
}

/* ===== 05 栏目共建 ===== */
.page-about .ab-coop-stats{
  list-style:none;
  margin:0 0 clamp(20px,3vw,28px);
  padding:0;
  display:grid;
  gap:10px;
}
.page-about .ab-coop-stats li{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:14px;
  padding:12px 16px;
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  border-radius:var(--radius);
  font-size:var(--fs-14);
  line-height:1.7;
  color:var(--c-ink-soft);
}
.page-about .ab-coop-num{
  font-size:clamp(20px,3vw,26px);
  font-weight:700;
  color:var(--c-red);
  letter-spacing:.02em;
}
.page-about .ab-coop-list{
  display:grid;
  gap:12px;
}
.page-about .ab-coop-item{
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  border-radius:var(--radius);
  box-shadow:var(--sh-1);
}
.page-about .ab-coop-item summary{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 44px 14px 16px;
  cursor:pointer;
  list-style:none;
  position:relative;
  flex-wrap:wrap;
}
.page-about .ab-coop-item summary::-webkit-details-marker{
  display:none;
}
.page-about .ab-coop-item .tag{
  font-size:var(--fs-12);
  padding:4px 9px;
  border:1px solid var(--ab-line);
  border-radius:2px;
  background:var(--c-paper);
  color:var(--c-ink-soft);
}
.page-about .ab-coop-item .tag--red{ color:var(--c-red); border-color:rgba(179,38,30,.42); }
.page-about .ab-coop-item .tag--violet{ color:var(--c-violet); border-color:rgba(109,74,166,.4); }
.page-about .ab-coop-item .tag--cyan{ color:#0B6E6A; border-color:rgba(0,168,160,.42); }
.page-about .ab-coop-title{
  font-family:var(--font-display);
  font-size:var(--fs-16);
  font-weight:700;
  color:var(--c-ink);
}
.page-about .ab-coop-hint{
  position:absolute;
  right:16px;
  top:50%;
  width:10px;
  height:10px;
  margin-top:-5px;
  border-right:2px solid var(--c-gold-text);
  border-bottom:2px solid var(--c-gold-text);
  transform:rotate(45deg);
  transition:transform .2s ease;
}
.page-about .ab-coop-item[open] .ab-coop-hint{
  transform:rotate(-135deg);
}
.page-about .ab-coop-item p{
  margin:0;
  padding:0 16px 16px;
  font-size:var(--fs-14);
  line-height:1.8;
  color:var(--c-ink-soft);
  max-width:54ch;
  border-top:1px solid var(--ab-line-soft);
  padding-top:14px;
}

/* ===== 06 服务理念 ===== */
.page-about .ab-principles{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:14px;
}
.page-about .ab-principle{
  padding:18px;
  background:var(--c-surface);
  border:1px solid var(--ab-line);
  border-top:3px solid var(--c-blue);
  border-radius:var(--radius);
  box-shadow:var(--sh-1);
  display:flex;
  flex-direction:column;
  gap:8px;
}
.page-about .ab-principle:nth-child(2){ border-top-color:var(--c-cyan); }
.page-about .ab-principle:nth-child(3){ border-top-color:var(--c-violet); }
.page-about .ab-principle:nth-child(4){ border-top-color:var(--c-gold); }
.page-about .ab-p-index{
  font-size:var(--fs-12);
  letter-spacing:.2em;
  color:var(--c-gold-text);
}
.page-about .ab-principle h3{
  font-family:var(--font-display);
  font-size:var(--fs-18);
  font-weight:700;
  margin:0;
  color:var(--c-ink);
  line-height:1.45;
}
.page-about .ab-principle p{
  margin:0;
  font-size:var(--fs-14);
  line-height:1.8;
  color:var(--c-ink-soft);
  flex:1 1 auto;
}
.page-about .ab-link{
  align-self:flex-start;
  margin-top:4px;
  font-size:var(--fs-14);
  font-weight:700;
  color:var(--c-red);
  text-decoration:none;
  border-bottom:1px solid rgba(179,38,30,.35);
  padding-bottom:2px;
  min-height:24px;
}
.page-about .ab-link:hover,
.page-about .ab-link:focus-visible{
  color:var(--c-red-deep);
  border-bottom-color:var(--c-red-deep);
}

/* ===== 结尾转化带 ===== */
.page-about .ab-cta{
  margin-top:clamp(40px,6vw,68px);
  background-color:var(--c-blue-deep);
  background-image:
    repeating-linear-gradient(90deg, rgba(217,164,65,.12) 0 1px, transparent 1px 64px),
    linear-gradient(145deg, var(--c-blue-deep), var(--c-green-deep));
  border-radius:var(--radius);
  border:1px solid rgba(217,164,65,.36);
  color:var(--c-surface);
}
.page-about .ab-cta-inner{
  padding:clamp(26px,4.4vw,48px);
}
.page-about .ab-cta h2{
  font-family:var(--font-display);
  font-size:clamp(22px,3.4vw,32px);
  line-height:1.32;
  font-weight:900;
  margin:0 0 12px;
  color:#FFF9EF;
  max-width:18em;
}
.page-about .ab-cta p{
  margin:0 0 22px;
  font-size:var(--fs-16);
  line-height:1.8;
  color:rgba(255,249,239,.84);
  max-width:46ch;
}
.page-about .ab-cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* ===== 中屏 ===== */
@media (min-width:720px){
  .page-about .ab-hero-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-about .ab-hero-stats li{
    grid-template-columns:1fr;
    align-items:start;
    gap:6px;
  }
  .page-about .ab-fact-row{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-about .ab-swatches{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-about .ab-coop-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-about .ab-coop-stats li{
    grid-template-columns:1fr;
    align-items:start;
    gap:4px;
  }
  .page-about .ab-principles{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-about .ab-origin-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
  .page-about .ab-editorial-grid{
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  }
}

/* ===== 桌面：左侧索引跟随 ===== */
@media (min-width:980px){
  .page-about .ab-hero-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
    align-items:end;
  }
  .page-about .ab-hero-stats{
    grid-template-columns:1fr;
    gap:10px;
  }
  .page-about .ab-hero-stats li{
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:14px;
  }
  .page-about .ab-body{
    display:grid;
    grid-template-columns:184px minmax(0,1fr);
    gap:clamp(32px,4vw,64px);
    align-items:start;
  }
  .page-about .ab-index{
    position:sticky;
    top:104px;
    margin-bottom:0;
    border-top:2px solid var(--c-red);
  }
  .page-about .ab-index ol{
    display:grid;
    gap:4px;
    overflow:visible;
    padding-bottom:0;
  }
  .page-about .ab-index a{
    display:flex;
    width:100%;
    border-color:transparent;
    background:transparent;
    padding:8px 10px;
    white-space:normal;
  }
  .page-about .ab-index a:hover,
  .page-about .ab-index a:focus-visible{
    border-color:var(--ab-line);
    background:var(--c-surface);
  }
  .page-about .ab-principles{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .ab-swatches{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-about .ab-band-lede,
  .page-about .ab-band-note{
    max-width:56ch;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-about .ab-tl-hint::after,
  .page-about .ab-coop-hint{
    transition:none;
  }
}
</｜｜DSML｜｜ invoke>
</｜｜DSML｜｜ calls>