/* ============================================================
   五量度 · about 页 Apple 流体视觉层（2026-10-25）
   依赖 home-apple.css 的 .ah 设计令牌与基础组件（body 同时挂 ah / about）。
   区块：首屏 / 公司简介 / 发展历程 / 办公环境 / 核心理念 / 团队 / 品牌 / 仪服通 / 荣誉 / FAQ
   ============================================================ */

/* ============ 首屏：竖版主图 + 玻璃地址卡 ============ */
.abpage .ah-stage-photo { aspect-ratio: 3 / 4; border-radius: 28px; }
.abpage .ah-glass { width: min(300px, 86%); }
.abpage .ah-glass-addr { margin: 10px 0 0; font-size: 12.5px; line-height: 1.7; color: var(--ah-ink-2); }
.abpage .ah-glass-addr b { color: var(--ah-ink); }
.abpage .ah-badge-live { left: auto; right: 16px; }

/* ============ 公司简介：文字 + 品牌标识卡 ============ */
.ab-profile { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.ab-profile-copy .ah-kicker { margin-bottom: 12px; }
.ab-profile-copy h2 { margin: 0; font-size: clamp(24px, 3vw, 36px); line-height: 1.24; color: var(--ah-ink); }
.ab-profile-copy p { margin: 16px 0 0; font-size: 15px; color: var(--ah-ink-2); }
.ab-profile-copy p:first-of-type { margin-top: 20px; }

.ab-logo-card {
  position: relative; padding: clamp(26px, 3vw, 40px); border-radius: 26px;
  background: #fff; border: 1px solid var(--ah-line); box-shadow: var(--ah-shadow-2);
  text-align: center; overflow: hidden;
}
.ab-logo-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(420px 220px at 50% -10%, rgba(22,166,199,.12), transparent 70%);
}
.ab-logo-card img {
  position: relative; display: block; margin: 0 auto; width: min(232px, 72%); height: auto;
  filter: drop-shadow(0 10px 24px rgba(13,60,86,.14));
}
.ab-logo-card .ab-logo-name { position: relative; margin: 18px 0 0; font-size: 19px; font-weight: 800; color: var(--ah-ink); letter-spacing: -.01em; }
.ab-logo-card .ab-logo-tag { position: relative; margin: 6px 0 0; font-size: 13px; color: var(--ah-ink-3); }
.ab-logo-card .ab-logo-since {
  position: relative; display: inline-flex; align-items: center; gap: 7px; margin-top: 16px;
  padding: 6px 14px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--ah-brand-deep);
  background: rgba(22,166,199,.08); border: 1px solid rgba(22,166,199,.22);
}
.ab-logo-card .ab-logo-since i { width: 6px; height: 6px; border-radius: 50%; background: var(--ah-brand); animation: ahPulse 2.4s ease-out infinite; }

/* 数字带：四数一组，进入视口 count-up（main.js 驱动） */
.ab-nums {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px;
  margin-top: clamp(28px, 3.4vw, 44px);
}
.ab-num {
  padding: 20px 16px 18px; border-radius: 20px; text-align: center;
  background: #fff; border: 1px solid var(--ah-line); box-shadow: 0 1px 2px rgba(10,30,55,.03);
  transition: transform .55s var(--ah-spring), box-shadow .45s, border-color .3s;
}
.ab-num:hover { transform: translateY(-4px); box-shadow: var(--ah-shadow-2); border-color: rgba(22,166,199,.3); }
.ab-num b { display: block; font-size: clamp(24px, 2.6vw, 32px); font-weight: 800; color: var(--ah-ink); letter-spacing: -.02em; line-height: 1.1; }
.ab-num span { display: block; margin-top: 7px; font-size: 12.5px; color: var(--ah-ink-3); }

/* ============ 发展历程：滚动激活时间线 ============ */
.ab-tl { position: relative; max-width: 920px; margin: 0 auto; padding: 8px 0; }
/* 渐入仅在 JS 就绪后启用（无 JS 时默认全部可见） */
.ab-tl--js .ab-tl-item { opacity: 0; transform: translateY(18px); transition: opacity .6s var(--ah-ease), transform .6s var(--ah-ease); }
.ab-tl--js .ab-tl-item.seen { opacity: 1; transform: none; }
.ab-tl-rail { position: absolute; left: 88px; top: 10px; bottom: 10px; width: 2px; background: var(--ah-line); border-radius: 2px; overflow: hidden; }
.ab-tl-rail i {
  display: block; width: 100%; height: var(--p, 0%);
  background: linear-gradient(180deg, var(--ah-brand), #3fbfb2);
  transition: height .2s linear;
}
.ab-tl-item { position: relative; display: grid; grid-template-columns: 88px 1fr; gap: 0 34px; padding: 22px 0; }
.ab-tl-year {
  font-size: clamp(21px, 2.2vw, 27px); font-weight: 800; color: var(--ah-ink-3);
  text-align: right; line-height: 1.2; padding-top: 2px; letter-spacing: -.02em;
  transition: color .45s ease;
}
.ab-tl-item.on .ab-tl-year { color: var(--ah-brand-deep); }
.ab-tl-node {
  position: absolute; left: 80px; top: 30px; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 2px solid var(--ah-line);
  transition: transform .55s var(--ah-spring-soft), border-color .4s, background .4s;
}
.ab-tl-node::after {
  content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--ah-brand);
  transform: scale(0); transition: transform .5s var(--ah-spring-soft);
}
.ab-tl-item.on .ab-tl-node { border-color: var(--ah-brand); transform: scale(1.15); }
.ab-tl-item.on .ab-tl-node::after { transform: scale(1); }
.ab-tl-body { min-width: 0; }
.ab-tl-body h3 { margin: 0; font-size: 18px; color: var(--ah-ink); letter-spacing: -.01em; }
.ab-tl-body h3 .yr { font-size: 12.5px; font-weight: 600; color: var(--ah-ink-3); margin-left: 8px; letter-spacing: .02em; }
.ab-tl-body p { margin: 7px 0 0; font-size: 14px; color: var(--ah-ink-2); line-height: 1.78; }
.ab-tl-body .ah-link { margin-top: 9px; font-size: 13px; }
.ab-tl-pic {
  display: block; width: min(300px, 100%); margin: 13px 0 0; border-radius: 16px; overflow: hidden;
  aspect-ratio: 4 / 3; background: #e7eef4; box-shadow: var(--ah-shadow-1);
}
.ab-tl-pic img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ah-ease); }
.ab-tl-pic:hover img { transform: scale(1.05); }
.ab-tl-pic:hover { box-shadow: var(--ah-shadow-2); }

/* ============ 办公环境：bento 网格 ============ */
.ab-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ab-bento-wide { grid-column: 1 / -1; }
.ab-cell {
  position: relative; display: block; overflow: hidden; border-radius: 20px;
  background: #e7eef4; box-shadow: var(--ah-shadow-1);
  transition: transform .6s var(--ah-spring), box-shadow .5s;
}
.ab-cell:hover { transform: translateY(-5px); box-shadow: var(--ah-shadow-2); }
.ab-cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ah-ease); }
.ab-cell:hover img { transform: scale(1.05); }
.ab-bento-wide { aspect-ratio: 16 / 8.4; }
.ab-bento-wide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,24,38,.05) 0%, rgba(6,24,38,0) 40%, rgba(6,24,38,.66) 100%); }
.ab-bento-wide .ab-cell-cap {
  position: absolute; z-index: 2; left: 22px; right: 22px; bottom: 18px; color: #fff;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px;
}
.ab-bento-wide .ab-cell-cap b { font-size: 17px; letter-spacing: -.01em; }
.ab-bento-wide .ab-cell-cap span { font-size: 12.5px; color: rgba(255,255,255,.82); }
.ab-bento-cell { aspect-ratio: 4 / 3; }
.ab-bento-cell::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,24,38,0) 52%, rgba(6,24,38,.58) 100%); }
.ab-bento-cell .ab-cell-cap { position: absolute; z-index: 2; left: 15px; right: 15px; bottom: 12px; color: #fff; font-size: 13.5px; font-weight: 600; }
.ab-office-note {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
  margin-top: 20px; padding: 16px 20px; border-radius: 16px;
  background: var(--ah-paper-2); border: 1px solid var(--ah-line-soft);
}
.ab-office-note p { margin: 0; font-size: 13.5px; color: var(--ah-ink-2); }

/* ============ 团队：照片卡 ============ */
.ab-team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ab-team {
  display: flex; flex-direction: column; overflow: hidden; border-radius: 20px;
  background: #fff; border: 1px solid var(--ah-line); box-shadow: var(--ah-shadow-1);
  transition: transform .6s var(--ah-spring), box-shadow .5s;
}
.ab-team:hover { transform: translateY(-6px); box-shadow: var(--ah-shadow-2); }
.ab-team-pic { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 3; background: #eef3f7; }
.ab-team-pic img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s var(--ah-ease); }
.ab-team:hover .ab-team-pic img { transform: scale(1.06); }
.ab-team-pic .ab-team-role {
  position: absolute; z-index: 2; left: 12px; top: 12px;
  font-size: 11.5px; font-weight: 600; color: #fff; padding: 4px 11px; border-radius: 999px;
  background: rgba(8,26,42,.55); border: 1px solid rgba(255,255,255,.24);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.ab-team-info { padding: 15px 17px 17px; display: flex; flex-direction: column; flex: 1 1 auto; }
.ab-team-info b { display: block; font-size: 15.5px; color: var(--ah-ink); letter-spacing: -.01em; }
.ab-team-info p { margin: 7px 0 0; font-size: 13px; color: var(--ah-ink-2); line-height: 1.7; }
.ab-team-info .ah-link { margin-top: 12px; font-size: 12.5px; }

/* ============ 品牌带：现场照片 + 真实 logo 走马灯 ============ */
.ab-brands { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(24px, 3.4vw, 52px); align-items: center; }
.ab-brands-fig { position: relative; margin: 0; border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 3; background: #e7eef4; box-shadow: var(--ah-shadow-2); }
.ab-brands-fig img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-brands-fig figcaption {
  position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 34px 18px 15px; color: #fff;
  font-size: 13px; background: linear-gradient(180deg, rgba(6,24,38,0), rgba(6,24,38,.72));
}
.ab-brands-side .ah-head { margin: 0 0 22px; text-align: left; }
.ab-brands-side .ah-head p { margin-left: 0; }

/* ============ 荣誉：三张入口卡 ============ */
.ab-honor-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ab-honor {
  display: flex; align-items: flex-start; gap: 15px; padding: 20px 20px 18px; border-radius: 20px;
  background: #fff; border: 1px solid var(--ah-line); box-shadow: 0 1px 2px rgba(10,30,55,.03);
  transition: transform .55s var(--ah-spring), box-shadow .45s, border-color .3s;
}
.ab-honor:hover { transform: translateY(-4px); box-shadow: var(--ah-shadow-2); border-color: rgba(22,166,199,.3); }
.ab-honor-ico {
  flex: 0 0 44px; width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center;
  background: linear-gradient(150deg, rgba(22,166,199,.14), rgba(22,166,199,.04)); color: var(--ah-brand-deep);
}
.ab-honor-ico svg { width: 21px; height: 21px; }
.ab-honor b { display: block; font-size: 15px; color: var(--ah-ink); }
.ab-honor > span:last-child { display: block; min-width: 0; }
.ab-honor p { margin: 5px 0 0; font-size: 13px; color: var(--ah-ink-2); line-height: 1.7; }
.ab-honor .ah-link { margin-top: 8px; font-size: 12.5px; }

/* ============ 响应式 ============ */
@media (max-width: 1080px) {
  .ab-profile { grid-template-columns: minmax(0, 1fr); gap: 34px; }
  .ab-logo-card { max-width: 520px; margin: 0 auto; }
  .ab-brands { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .ab-brands-fig { max-width: 640px; }
  .ab-tl { max-width: 640px; }
}
@media (max-width: 900px) {
  .ab-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-honor-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .abpage .ah-stage-photo { border-radius: 20px; }
  .ab-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ab-num { padding: 15px 10px 13px; border-radius: 15px; }
  .ab-tl { max-width: 100%; }
  .ab-tl-rail { left: 62px; }
  .ab-tl-item { grid-template-columns: 62px 1fr; gap: 0 20px; padding: 18px 0; }
  .ab-tl-node { left: 54px; top: 26px; width: 15px; height: 15px; }
  .ab-tl-year { font-size: 19px; }
  .ab-tl-body h3 { font-size: 16px; }
  .ab-bento { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .ab-bento-wide { aspect-ratio: 16 / 10; }
  .ab-bento-cell { aspect-ratio: 4 / 3; }
  .ab-team-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ab-team { border-radius: 16px; }
  .ab-tl-pic { width: 100%; }
  .ab-office-note { flex-direction: column; align-items: flex-start; }
}

/* ============ 无障碍：减弱动效 ============ */
@media (prefers-reduced-motion: reduce) {
  .ab-tl-rail i { transition: none; }
  .ab-tl--js .ab-tl-item { opacity: 1 !important; transform: none !important; }
  .ab-tl-node, .ab-tl-node::after, .ab-tl-year, .ab-cell, .ab-cell img, .ab-team, .ab-team-pic img,
  .ab-tl-pic img, .ab-num, .ab-honor { transition-duration: .001ms !important; }
  .ab-logo-card .ab-logo-since i { animation: none !important; }
}