/* ============================================================
   关于我们 about.php —— 公司视角四区块（公司简介/工厂实力/资质荣誉/品牌理念）
   复用 css/service.css 基础风格；仅用 var(--*) + 中性 fallback。
   ============================================================ */
.absec { padding: 56px 0 64px; }
.absec.alt { background: var(--bg-soft, #f5f7fb); }
.ab-head { max-width: 720px; margin-bottom: 30px; }
.ab-head h2 { margin: 8px 0 0; font-size: clamp(24px, 3vw, 32px); color: var(--ink, #1a2230); }
.ab-lead { margin: 10px 0 0; color: var(--ink2, #5a6675); font-size: 15px; }

/* ---------- ① 公司简介 ---------- */
.ab-intro-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 30px; align-items: start; }
.ab-paras p { margin: 0 0 14px; color: var(--ink, #1a2230); font-size: 15.5px; line-height: 1.9; text-align: justify; }
.ab-side-card {
  padding: 22px 22px; border-radius: 16px;
  border: 1px solid var(--line, #e6e9ef);
  background: var(--bg-soft, #f5f7fb);
}
.ab-side-card.ink {
  background: color-mix(in srgb, var(--gold, #4da3ff) 8%, var(--bg-soft, #f5f7fb));
}
.ab-side-k { display: block; font-size: 13px; font-weight: 700; color: var(--gold, #4da3ff); letter-spacing: .06em; margin-bottom: 12px; }

.ab-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ab-tags li {
  padding: 7px 13px; border-radius: 999px; font-size: 13px; color: var(--ink, #1a2230);
  border: 1px solid var(--line, #e6e9ef); background: #fff;
}

.ab-stats {
  list-style: none; margin: 34px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.ab-stats li {
  text-align: center; padding: 24px 12px;
  border: 1px solid var(--line, #e6e9ef); border-radius: 16px; background: #fff;
}
.ab-stats b { display: block; font-size: clamp(26px, 3vw, 36px); color: var(--gold, #4da3ff); font-weight: 800; line-height: 1.1; }
.ab-stats b small { font-size: .45em; font-weight: 600; margin-left: 2px; }
.ab-stats span { display: block; margin-top: 8px; font-size: 13px; color: var(--ink2, #5a6675); }

/* ---------- ② 工厂实力 ---------- */
.ab-fac-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.ab-fac-card {
  margin: 0; border: 1px solid var(--line, #e6e9ef); border-radius: 16px; overflow: hidden; background: #fff;
  transition: transform .25s ease, box-shadow .25s ease;
}
.ab-fac-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(20,30,50,.10); }
.ab-fac-img { aspect-ratio: 4 / 3; overflow: hidden; background: var(--bg-soft, #eef1f6); }
.ab-fac-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ab-fac-card figcaption { padding: 14px 16px 16px; }
.ab-fac-card figcaption b { display: block; font-size: 15px; color: var(--ink, #1a2230); margin-bottom: 5px; }
.ab-fac-card figcaption span { font-size: 13px; color: var(--ink2, #5a6675); line-height: 1.5; }

.ab-matrix { margin-top: 26px; padding: 20px 22px; border-radius: 16px; border: 1px dashed var(--line, #d9e0ea); background: #fff; }
.ab-mx { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.ab-mx li {
  display: flex; flex-direction: column; gap: 4px; padding: 12px 14px;
  border-radius: 12px; background: var(--bg-soft, #f5f7fb);
}
.ab-mx li span { font-size: 13px; color: var(--ink2, #5a6675); }
.ab-mx li b { font-size: 18px; color: var(--gold, #4da3ff); font-weight: 800; }

/* ---------- ③ 资质荣誉 ---------- */
.ab-awards {
  list-style: none; margin: 0 0 26px; padding: 0;
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px;
}
.ab-awards li {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 20px 10px; border: 1px solid var(--line, #e6e9ef); border-radius: 16px; background: #fff;
  transition: transform .25s ease, box-shadow .25s ease;
}
.ab-awards li:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(20,30,50,.10); }
.ab-awards img {
  flex: 1 1 auto; min-height: 0; width: clamp(72px, 8vw, 104px);
  object-fit: contain; margin: auto 0;   /* 图标在剩余空间垂直居中 */
}
.ab-awards span { font-size: 13px; color: var(--ink2, #5a6675); margin-top: auto; }  /* 标签压底对齐 */
.ab-honor-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.ab-honor-tags .ab-side-k { margin: 0 6px 0 0; }

/* ---------- ④ 品牌理念 ---------- */
.ab-quote {
  margin: 0 0 28px; padding: 26px 30px;
  border-left: 4px solid var(--gold, #4da3ff); border-radius: 0 16px 16px 0;
  background: color-mix(in srgb, var(--gold, #4da3ff) 7%, transparent);
  font-size: clamp(16px, 2vw, 20px); line-height: 1.8; color: var(--ink, #1a2230); font-weight: 600;
}
.ab-vals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 30px; }
.ab-val {
  padding: 22px 22px; border: 1px solid var(--line, #e6e9ef); border-radius: 16px; background: #fff;
}
.ab-val b { display: block; font-size: 17px; color: var(--gold, #4da3ff); margin-bottom: 8px; }
.ab-val span { font-size: 13.5px; color: var(--ink2, #5a6675); line-height: 1.7; }

.ab-team { padding: 22px 22px; border-radius: 16px; border: 1px solid var(--line, #e6e9ef); background: #fff; }
.ab-team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 6px; }
.ab-member { text-align: center; padding: 18px 14px; border-radius: 14px; background: var(--bg-soft, #f5f7fb); }
.ab-ava {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%; margin-bottom: 10px;
  background: color-mix(in srgb, var(--gold, #4da3ff) 16%, transparent);
  color: var(--gold, #4da3ff); font-size: 22px; font-weight: 800;
}
.ab-member b { display: block; font-size: 14.5px; color: var(--ink, #1a2230); margin-bottom: 6px; }
.ab-member p { margin: 0; font-size: 12.5px; color: var(--ink2, #5a6675); line-height: 1.6; }

/* ---------- 响应式 ---------- */
@media (max-width: 1000px) {
  .ab-fac-grid { grid-template-columns: repeat(2, 1fr); }
  .ab-awards { grid-template-columns: repeat(3, 1fr); }
  .ab-mx { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .absec { padding: 40px 0 46px; }
  .ab-intro-grid { grid-template-columns: 1fr; gap: 20px; }
  .ab-stats { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .ab-fac-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .ab-vals { grid-template-columns: 1fr; }
  .ab-team-grid { grid-template-columns: 1fr; }
  .ab-awards { gap: 10px; }
  .ab-quote { padding: 20px 18px; }
}
@media (max-width: 480px) {
  .ab-fac-grid { grid-template-columns: 1fr; }
  .ab-awards { grid-template-columns: repeat(2, 1fr); }
}

/* ====================== 经典墨绿金（greengold）暗底适配 ======================
   约页四区块原按浅色语义写（--ink 当文字、--bg-soft/#fff 当浅底），
   在 greengold 深墨绿主题下会「深字压深底」看不清、白卡嵌深底显错位。
   仅对 <body class="theme-greengold"> 作用域覆盖，不影响其它主题（bluegold/apple_tech/classic）。 */
.theme-greengold .absec { background: transparent; }
.theme-greengold .absec.alt { background: var(--paper2); }

/* 标题 / 正文：深底用浅字，杜绝黑字隐没 */
.theme-greengold .ab-head .kicker { color: var(--gold); }
.theme-greengold .ab-head h2 { color: var(--text); }
.theme-greengold .ab-lead { color: var(--muted); }
.theme-greengold .ab-paras p { color: var(--text); }
.theme-greengold .ab-quote { color: var(--text); background: color-mix(in srgb, var(--gold) 8%, transparent); border-left-color: var(--gold); }

/* 强调字：香槟金 */
.theme-greengold .ab-side-k,
.theme-greengold .ab-stats b,
.theme-greengold .ab-mx li b,
.theme-greengold .ab-val b,
.theme-greengold .ab-ava { color: var(--gold); }

/* 次级文字：浅灰绿 */
.theme-greengold .ab-stats span,
.theme-greengold .ab-fac-card figcaption span,
.theme-greengold .ab-mx li span,
.theme-greengold .ab-awards span,
.theme-greengold .ab-val span,
.theme-greengold .ab-member p { color: var(--muted); }
.theme-greengold .ab-fac-card figcaption b,
.theme-greengold .ab-member b { color: var(--text); }

/* 卡片 / 面板：深墨绿底 + 浅线，统一沉浸 */
.theme-greengold .ab-side-card,
.theme-greengold .ab-stats li,
.theme-greengold .ab-fac-card,
.theme-greengold .ab-matrix,
.theme-greengold .ab-val,
.theme-greengold .ab-team { background: var(--ink2); border-color: var(--line); }
.theme-greengold .ab-side-card.ink { background: color-mix(in srgb, var(--gold) 10%, var(--ink2)); }
.theme-greengold .ab-mx li,
.theme-greengold .ab-member { background: var(--ink3, #14241C); }
.theme-greengold .ab-tags li { background: var(--ink2); border-color: var(--line); color: var(--text); }
.theme-greengold .ab-fac-img { background: var(--ink3, #14241C); }
.theme-greengold .ab-matrix { border-style: dashed; border-color: var(--line2); }
/* 资质荣誉图标框：原色 logo 需白底才能看清，墨绿金下用暖白小卡片 */
.theme-greengold .ab-awards li { background: #F7F6F2; border-color: #E7E4DD; box-shadow: 0 10px 26px rgba(0,0,0,.28); }