@charset "utf-8";
/* ============================================================
   卓信企业 关于卓信页  zhuoxinnet-about.css
   Adam20260914 · 适配 zhuoxinnet-common.css（头部 / 底部 / 变量）
   说明：
     1) 仅作用于 /about/（zhuoxinnet-about.html），不污染全站
     2) 全部颜色 / 圆角 / 阴影取自 zhuoxinnet-common.css 的 :root 变量
     3) 旧版 .zx-ab-* 规则完整保留，新增区块排在末尾，向后兼容
   ============================================================ */

/* ============ 01. 页面容器 ============ */
.zx-ab{background:#f5f8fb;padding:0 0 48px}
.zx-ab .wrap{max-width:var(--maxw,1240px);margin:0 auto;padding:0 24px}

/* 首屏区：浅蓝渐变，与头部白底衔接 */
.zx-ab-top{
  background:linear-gradient(180deg,#eef4fb 0%,#f5f8fb 100%);
  border-bottom:1px solid var(--line);padding:22px 0 30px;margin-bottom:32px;
}

/* ============ 02. 面包屑 ============ */
.zx-ab-crumb{font-size:13px;color:var(--mute);margin-bottom:16px}
.zx-ab-crumb a{color:var(--sub)}
.zx-ab-crumb a:hover{color:var(--brand)}
.zx-ab-crumb span{margin:0 6px;color:#c4ccd6}

/* ============ 03. 品牌介绍 ============ */
.zx-ab-intro{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 28px;margin-bottom:32px;
}
.zx-ab-intro h1{
  font-size:26px;color:var(--ink);margin:0 0 6px;font-weight:700;
}
.zx-ab-intro .en{
  font-size:13px;color:var(--mute);letter-spacing:.08em;margin:0 0 18px;text-transform:uppercase;
}
.zx-ab-intro p{
  font-size:14.5px;color:var(--sub);line-height:2;margin:0 0 12px;
}
.zx-ab-intro p:last-child{margin-bottom:0}
.zx-ab-intro b,.zx-ab-intro strong{color:var(--ink)}

/* 首屏「一句话定义」 */
.zx-ab-lead{
  font-size:16px !important;color:var(--ink) !important;line-height:1.9 !important;
  padding-left:14px;border-left:3px solid var(--brand);margin-bottom:18px !important;
}

/* 首屏图文：左文右图 */
.zx-ab-hero{
  display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start;
}
.zx-ab-hero .pic{
  border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff;
}
.zx-ab-hero .pic img{width:100%;height:auto;display:block}
.zx-ab-hero .pic figcaption{
  padding:8px 12px;font-size:12.5px;color:var(--mute);background:#fafcfe;border-top:1px solid var(--line);
}

/* 牌照归属提示条 */
.zx-ab-license{
  margin-top:18px;padding:12px 16px;background:var(--accent-soft);
  border-left:3px solid var(--brand);border-radius:0 8px 8px 0;
  font-size:13px;color:var(--sub);line-height:1.9;
}
.zx-ab-license a{color:var(--brand);font-weight:600}

/* ============ 04. 本页导航（锚点） ============ */
.zx-ab-toc{
  display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;
}
.zx-ab-toc a{
  font-size:13px;color:var(--sub);background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:5px 14px;
}
.zx-ab-toc a:hover{border-color:var(--brand);color:var(--brand);text-decoration:none}
.zx-ab-toc a.on{background:var(--brand);border-color:var(--brand);color:#fff}

/* ============ 05. 主体信息一览（表格，便于逐项核对） ============ */
.zx-ab-entity{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:32px;
}
.zx-ab-table{width:100%;border-collapse:collapse;font-size:13.5px}
.zx-ab-table th,.zx-ab-table td{
  text-align:left;vertical-align:top;padding:11px 12px;
  border-bottom:1px solid #eef2f7;line-height:1.85;
}
.zx-ab-table tr:last-child th,.zx-ab-table tr:last-child td{border-bottom:0}
.zx-ab-table th{
  width:132px;color:var(--mute);font-weight:500;background:#fafcfe;white-space:nowrap;
}
.zx-ab-table td{color:var(--sub)}
.zx-ab-table td b{color:var(--ink)}
.zx-ab-table a{color:var(--brand)}
.zx-ab-table th{vertical-align:top}
.zx-ab-entity .tip{
  margin-top:14px;font-size:12.5px;color:var(--mute);line-height:1.8;
}

/* ============ 06. 数据条 ============ */
.zx-ab-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:36px;
}
.zx-ab-stats li{
  background:linear-gradient(135deg,var(--brand-3),var(--brand));
  border-radius:12px;padding:20px 14px;text-align:center;color:#fff;
}
.zx-ab-stats b{
  display:block;font-size:28px;font-weight:700;line-height:1.2;margin-bottom:4px;
}
.zx-ab-stats b i{font-size:14px;font-weight:500;font-style:normal;color:#cfe0f3}
.zx-ab-stats span{font-size:12.5px;color:#a9d4ff}

/* ============ 07. 通用区块标题 ============ */
.zx-ab-hd{text-align:center;margin-bottom:24px}
.zx-ab-hd h2{
  font-size:24px;color:var(--ink);margin:0 0 6px;position:relative;
  display:inline-block;padding-bottom:10px;
}
.zx-ab-hd h2::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:40px;height:3px;background:var(--brand);border-radius:2px;
}
.zx-ab-hd p{font-size:13.5px;color:var(--sub);margin:0}

/* 左对齐标题（用于说明类区块） */
.zx-ab-hd.left{text-align:left}
.zx-ab-hd.left h2::after{left:0;transform:none}

/* ============ 08. 名称与主体说明（消歧区块） ============ */
.zx-ab-clarify{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:32px;
}
.zx-ab-clarify-list{counter-reset:zx-cl;margin:0}
.zx-ab-clarify-list > li{
  position:relative;padding:0 0 0 44px;margin-bottom:18px;font-size:13.5px;
  color:var(--sub);line-height:1.95;
}
.zx-ab-clarify-list > li:last-child{margin-bottom:0}
.zx-ab-clarify-list > li::before{
  counter-increment:zx-cl;content:counter(zx-cl);
  position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:8px;
  background:var(--accent-soft);color:var(--brand);font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.zx-ab-clarify-list > li > b{
  display:block;color:var(--ink);font-size:14.5px;margin-bottom:3px;
}
.zx-ab-clarify-list a{color:var(--brand);font-weight:600}

/* 核验清单 */
.zx-ab-verify{
  margin-top:20px;padding:16px 18px;background:#fafcfe;border:1px dashed var(--line);border-radius:10px;
}
.zx-ab-verify h3{font-size:14.5px;color:var(--ink);margin:0 0 10px}
.zx-ab-verify ul{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px}
.zx-ab-verify li{
  position:relative;padding-left:18px;font-size:13px;color:var(--sub);line-height:1.85;
}
.zx-ab-verify li::before{
  content:"";position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:2px;background:var(--brand);
}
.zx-ab-verify a{color:var(--brand)}

/* ============ 09. 分支机构（卡片网格） ============ */
.zx-ab-branch{margin-bottom:36px}
.zx-ab-city{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.zx-ab-city li{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:16px 18px;transition:.25s;position:relative;overflow:hidden;
}
.zx-ab-city li::before{
  content:"";position:absolute;left:0;top:0;width:3px;height:100%;
  background:var(--brand);opacity:0;transition:.25s;
}
.zx-ab-city li:hover{
  border-color:var(--brand);box-shadow:0 8px 20px rgba(11,74,143,.10);
  transform:translateY(-3px);
}
.zx-ab-city li:hover::before{opacity:1}
.zx-ab-city .cname{
  font-size:16px;font-weight:700;color:var(--ink);margin:0 0 8px;
  display:flex;align-items:center;gap:8px;
}
.zx-ab-city .cname em{
  font-size:11.5px;font-weight:500;font-style:normal;color:#fff;
  background:var(--brand);border-radius:4px;padding:2px 7px;
}
.zx-ab-city .cname em.ovs{background:var(--accent)}
.zx-ab-city dl{margin:0;font-size:13px;line-height:1.85;color:var(--sub)}
.zx-ab-city dt{color:var(--mute);font-size:12.5px;float:left;width:38px;clear:left}
.zx-ab-city dd{margin:0 0 2px 42px;word-break:break-all}
.zx-ab-city dd a{color:var(--brand)}
.zx-ab-city dd a:hover{text-decoration:underline}
.zx-ab-city .map-link{
  display:inline-block;margin-top:6px;font-size:12.5px;color:var(--accent);font-weight:600;
}
.zx-ab-city address{font-style:normal}

/* ============ 10. 海外办公室 ============ */
.zx-ab-overseas{margin-bottom:36px}
.zx-ab-ovs-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;
}
.zx-ab-ovs-list li{
  background:#fff;border:1px dashed var(--line);border-radius:12px;
  padding:15px 18px;font-size:13.5px;color:var(--sub);line-height:1.8;
}
.zx-ab-ovs-list b{display:block;color:var(--ink);font-size:15px;margin-bottom:5px}
.zx-ab-ovs-list span{display:block;font-size:12.5px;color:var(--mute)}

/* ============ 11. 注册区域 ============ */
.zx-ab-area{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:36px;position:relative;overflow:hidden;
}
.zx-ab-area ul{
  display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:16px;
}
.zx-ab-area li{
  font-size:13.5px;color:#42525f;background:var(--accent-soft);
  border-radius:16px;padding:5px 15px;
}
.zx-ab-area .tip{
  margin-top:14px;text-align:center;font-size:12.5px;color:var(--mute);
}
/* 底纹装饰图（旧版 aboutBg_3_2.png 复用） */
.zx-ab-area .deco{
  position:absolute;right:-40px;bottom:-40px;width:260px;opacity:.10;pointer-events:none;
}

/* ============ 12. 综合服务 ============ */
.zx-ab-svc{margin-bottom:36px}
.zx-ab-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.zx-ab-svc-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 20px;transition:.25s;
}
.zx-ab-svc-card:hover{
  border-color:var(--brand);box-shadow:0 10px 24px rgba(11,74,143,.10);transform:translateY(-3px);
}
.zx-ab-svc-card .no{
  width:30px;height:30px;border-radius:8px;background:var(--accent-soft);
  color:var(--brand);font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;margin-bottom:12px;
}
.zx-ab-svc-card h3{font-size:16px;color:var(--ink);margin:0 0 8px}
.zx-ab-svc-card p{font-size:13px;color:var(--sub);line-height:1.85;margin:0}
/* 服务图标：复用旧版 yewu-*.png */
.zx-ab-svc-card .ico{
  width:44px;height:44px;object-fit:contain;margin-bottom:10px;
  filter:none;
}
.zx-ab-svc-card .more{
  display:inline-block;margin-top:10px;font-size:12.5px;color:var(--accent);font-weight:600;
}

/* ============ 13. 在线服务 / 掌上卓信 ============ */
.zx-ab-online{
  display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;margin-bottom:36px;
}
.zx-ab-online .qr{
  width:160px;height:160px;background:var(--accent-soft);border-radius:10px;
  display:flex;align-items:center;justify-content:center;padding:8px;
}
.zx-ab-online .qr img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}
.zx-ab-online .txt h3{font-size:18px;color:var(--ink);margin:0 0 10px}
.zx-ab-online .txt p{font-size:13.5px;color:var(--sub);line-height:1.95;margin:0 0 8px}
.zx-ab-online .txt b{color:var(--brand)}
.zx-ab-online .deco{width:100%;max-width:220px;margin-top:6px}

/* ============ 14. 行业优势 ============ */
.zx-ab-adv{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px}
.zx-ab-adv li{
  background:linear-gradient(135deg,var(--brand),var(--accent));
  border-radius:12px;padding:22px 20px;color:#fff;text-align:center;
}
.zx-ab-adv b{display:block;font-size:17px;margin-bottom:6px}
.zx-ab-adv span{font-size:12.5px;color:#d6e6f8;line-height:1.7}

/* 图文版优势（复用旧版 superiority*.png / about-youshi-*.jpg） */
.zx-ab-adv-pic{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px}
.zx-ab-adv-pic li{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;transition:.25s;
}
.zx-ab-adv-pic li:hover{border-color:var(--brand);box-shadow:0 10px 24px rgba(11,74,143,.10)}
.zx-ab-adv-pic .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--accent-soft)}
.zx-ab-adv-pic .thumb img{width:100%;height:100%;object-fit:cover}
.zx-ab-adv-pic .bd{padding:16px 18px 18px;position:relative}
.zx-ab-adv-pic .ico{width:40px;height:40px;object-fit:contain;margin-bottom:8px}
.zx-ab-adv-pic h3{font-size:15.5px;color:var(--ink);margin:0 0 6px}
.zx-ab-adv-pic p{font-size:13px;color:var(--sub);line-height:1.85;margin:0}

/* ============ 15. 荣誉 / 足迹 图集 ============ */
.zx-ab-gal{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:36px;
}
.zx-ab-gal-tabs{
  display:flex;justify-content:center;gap:10px;margin-bottom:20px;flex-wrap:wrap;
}
.zx-ab-gal-tabs button{
  font:inherit;font-size:13.5px;color:var(--sub);cursor:pointer;
  background:#f4f7fb;border:1px solid var(--line);border-radius:20px;padding:6px 20px;
}
.zx-ab-gal-tabs button.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.zx-ab-gal-panel{display:none}
.zx-ab-gal-panel.on{display:block}
.zx-gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.zx-gal-grid li{
  position:relative;border:1px solid var(--line);border-radius:8px;overflow:hidden;
  background:#fafcfe;cursor:zoom-in;
}
.zx-gal-grid img{
  width:100%;height:150px;object-fit:cover;transition:transform .3s;
}
.zx-gal-grid li:hover img{transform:scale(1.04)}
.zx-gal-grid li::after{
  content:"";position:absolute;inset:0;background:rgba(11,74,143,.06);opacity:0;transition:.25s;
}
.zx-gal-grid li:hover::after{opacity:1}
.zx-ab-gal-hint{text-align:center;font-size:12.5px;color:var(--mute);margin-top:14px}

/* 灯箱 */
.zx-lightbox{
  position:fixed;inset:0;z-index:100000;background:rgba(9,16,26,.88);
  display:none;align-items:center;justify-content:center;padding:24px;
}
.zx-lightbox.show{display:flex}
.zx-lightbox img{
  max-width:92vw;max-height:86vh;width:auto;height:auto;border-radius:8px;background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
}
.zx-lightbox .lb-close,.zx-lightbox .lb-prev,.zx-lightbox .lb-next{
  position:absolute;background:rgba(255,255,255,.14);color:#fff;border:0;
  width:44px;height:44px;border-radius:50%;font-size:22px;line-height:1;cursor:pointer;
}
.zx-lightbox .lb-close{top:20px;right:20px;font-size:20px}
.zx-lightbox .lb-prev{left:18px;top:50%;transform:translateY(-50%)}
.zx-lightbox .lb-next{right:18px;top:50%;transform:translateY(-50%)}
.zx-lightbox .lb-close:hover,.zx-lightbox .lb-prev:hover,.zx-lightbox .lb-next:hover{background:rgba(255,255,255,.3)}
.zx-lightbox .lb-count{
  position:absolute;left:0;right:0;bottom:18px;text-align:center;color:#cfe0f3;font-size:13px;
}

/* ============ 16. 发展历程 ============ */
.zx-ab-hist{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:36px;
}
.zx-ab-hist ul{position:relative;padding-left:22px;margin-top:16px}
.zx-ab-hist ul::before{
  content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--line);
}
.zx-ab-hist li{position:relative;margin-bottom:14px;font-size:13.5px;color:var(--sub);line-height:1.8}
.zx-ab-hist li:last-child{margin-bottom:0}
.zx-ab-hist li::before{
  content:"";position:absolute;left:-21px;top:8px;width:8px;height:8px;
  border-radius:50%;background:var(--brand);box-shadow:0 0 0 3px #fff;
}
.zx-ab-hist li b{color:var(--brand);font-weight:700;margin-right:8px}

/* ============ 17. 常见问题 ============ */
.zx-ab-faq{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 24px;margin-bottom:36px;
}
.zx-ab-faq details{
  border-bottom:1px solid #eef2f7;padding:2px 0;
}
.zx-ab-faq details:last-of-type{border-bottom:0}
.zx-ab-faq summary{
  cursor:pointer;list-style:none;position:relative;
  padding:14px 34px 14px 0;font-size:14.5px;font-weight:600;color:var(--ink);line-height:1.7;
}
.zx-ab-faq summary::-webkit-details-marker{display:none}
.zx-ab-faq summary::after{
  content:"";position:absolute;right:8px;top:22px;width:8px;height:8px;
  border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);
  transform:rotate(45deg);transition:transform .2s;
}
.zx-ab-faq details[open] summary::after{transform:rotate(-135deg)}
.zx-ab-faq details[open] summary{color:var(--brand)}
.zx-ab-faq .ans{
  padding:0 34px 16px 0;font-size:13.5px;color:var(--sub);line-height:1.95;
}
.zx-ab-faq .ans b{color:var(--ink)}
.zx-ab-faq .ans a{color:var(--brand)}

/* ============ 18. 声明 / 引用说明 ============ */
.zx-ab-note{
  background:#fff;border:1px solid var(--line);border-left:4px solid #c90000;
  border-radius:0 10px 10px 0;padding:16px 20px;margin-bottom:16px;
  font-size:13px;color:var(--sub);line-height:1.9;
}
.zx-ab-cite{
  background:#fafcfe;border:1px solid var(--line);border-radius:10px;
  padding:16px 20px;font-size:13px;color:var(--sub);line-height:1.9;
}
.zx-ab-cite h3{font-size:14px;color:var(--ink);margin:0 0 8px}
.zx-ab-cite a{color:var(--brand)}
.zx-ab-meta{
  margin-top:14px;text-align:center;font-size:12.5px;color:var(--mute);line-height:1.9;
}

/* ============ 19. 响应式 ============ */
@media (max-width:1200px){
  .zx-ab-city,.zx-ab-svc-grid,.zx-ab-ovs-list,.zx-ab-adv,.zx-ab-adv-pic{grid-template-columns:repeat(2,1fr)}
  .zx-gal-grid{grid-template-columns:repeat(3,1fr)}
  .zx-ab-hero{grid-template-columns:1fr 320px}
}
@media (max-width:980px){
  .zx-ab .wrap{padding:0 18px}
  .zx-ab-intro{padding:24px 20px}
  .zx-ab-intro h1{font-size:22px}
  .zx-ab-stats{grid-template-columns:repeat(2,1fr)}
  .zx-ab-online{grid-template-columns:1fr;justify-items:center;text-align:center}
  .zx-ab-adv{grid-template-columns:1fr}
  .zx-ab-hero{grid-template-columns:1fr}
  .zx-ab-hero .pic{max-width:520px}
  .zx-ab-verify ul{grid-template-columns:1fr}
}
@media (max-width:640px){
  .zx-ab{padding:0 0 32px}
  .zx-ab-top{padding:16px 0 22px}
  .zx-ab-city,.zx-ab-svc-grid,.zx-ab-ovs-list,.zx-ab-adv-pic{grid-template-columns:1fr}
  .zx-ab-stats b{font-size:24px}
  .zx-ab-hd h2{font-size:20px}
  .zx-ab-online .qr{width:140px;height:140px}
  .zx-gal-grid{grid-template-columns:repeat(2,1fr)}
  .zx-gal-grid img{height:120px}
  .zx-ab-table th{width:96px;white-space:normal}
  .zx-ab-clarify-list > li{padding-left:38px}
}

/* ============ 20. 打印（便于客户/合作方留档核对） ============ */
@media print{
  .zx-ab-toc,.zx-ab-gal-tabs,.zx-ab-gal-hint,.zx-lightbox{display:none !important}
  .zx-ab-gal-panel{display:block !important}
  .zx-ab{background:#fff;padding:0}
  .zx-ab-stats li,.zx-ab-adv li{background:#f2f5f9 !important;color:#16202c !important}
  .zx-ab-stats span,.zx-ab-stats b i,.zx-ab-adv span{color:#5b6b7d !important}
  a{text-decoration:none}
}