/* ============================================================
   about.css · 关于我们专属样式
   ============================================================ */

/* ---------- 题头：左右分栏 ---------- */
.ab-hero{
  padding:calc(var(--header-h) + 46px) 0 70px;
  background:linear-gradient(120deg,var(--blue-50) 0%,var(--white) 60%);
}
.ab-hero-row{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}
.ab-hero-text h1{margin:8px 0 18px}
.ab-hero-lead{color:var(--gray-600);font-size:15.5px;line-height:1.9;max-width:520px;margin-bottom:28px}
.ab-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.ab-hero-media img{
  border-radius:var(--radius-l);box-shadow:var(--shadow-m);
  width:100%;height:400px;object-fit:cover;
}

/* ---------- 机构介绍 zigzag ---------- */
.ab-intro{padding:80px 0;background:var(--white)}
.ab-zig{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-bottom:70px}
.ab-zig:last-child{margin-bottom:0}
.zig-flip .ab-zig-media{order:2}
.ab-zig-media img{
  border-radius:var(--radius-l);box-shadow:var(--shadow-s);
  width:100%;height:340px;object-fit:cover;
}
.ab-zig-text h2{margin-bottom:16px}
.ab-zig-text p{color:var(--gray-600);font-size:14.5px;margin-bottom:14px;line-height:1.9}
.ab-bullets{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.ab-bullets li{
  font-size:14px;color:var(--gray-700);padding-left:20px;position:relative;
}
.ab-bullets li::before{
  content:"";position:absolute;left:0;top:9px;width:8px;height:8px;
  border-radius:50%;background:var(--blue-400);
}

/* ---------- 团队图墙 ---------- */
.ab-team{padding:80px 0;background:var(--gray-50)}
.team-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.tw-item{
  background:var(--white);border-radius:var(--radius-m);overflow:hidden;
  box-shadow:var(--shadow-s);transition:transform var(--trans),box-shadow var(--trans);
}
.tw-item:hover{transform:translateY(-6px);box-shadow:var(--shadow-m)}.tw-item img {width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.tw-item figcaption{padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.tw-item strong{font-size:15px;color:var(--gray-900)}
.tw-item span{font-size:12.5px;color:var(--gray-500)}
.team-wall .tw-item:nth-child(2){transition-delay:.08s}
.team-wall .tw-item:nth-child(3){transition-delay:.16s}

/* ---------- 发展历程时间轴 ---------- */
.ab-history{padding:80px 0;background:var(--white)}
.timeline{
  list-style:none;position:relative;
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
  margin-top:36px;
}
.timeline::before{
  content:"";position:absolute;top:14px;left:4%;right:4%;height:2px;
  background:var(--blue-200);
}
.timeline li{position:relative;padding-top:44px}
.timeline li::before{
  content:"";position:absolute;top:8px;left:0;
  width:14px;height:14px;border-radius:50%;
  background:var(--blue-500);border:3px solid var(--blue-100);
}
.timeline em{
  font-style:normal;font-size:12px;font-weight:700;color:var(--blue-600);
  letter-spacing:1px;
}
.timeline h3{font-size:16px;margin:8px 0 8px}
.timeline p{font-size:13px;color:var(--gray-500);line-height:1.8}

/* ---------- 服务承诺 ---------- */
.ab-promise{padding:80px 0;background:var(--blue-50)}
.promise-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.p-card{
  background:var(--white);border-radius:var(--radius-m);
  padding:26px 24px;box-shadow:var(--shadow-s);
  border-top:3px solid var(--blue-400);
}
.p-card strong{font-size:18px;color:var(--gray-900)}
.p-card p{font-size:13.5px;color:var(--gray-600);margin-top:10px;line-height:1.8}

/* ---------- 合规说明色带 ---------- */
.ab-compliance{padding:0 0 90px;background:var(--white)}
.comp-box{
  background:var(--gray-900);color:var(--gray-300);
  border-radius:var(--radius-l);padding:48px 52px;
}
.comp-box h2{color:#fff;margin-bottom:16px;font-size:22px}
.comp-box p{font-size:14px;line-height:2;max-width:820px}
.comp-links{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}

/* ---------- 响应式 ---------- */
@media (max-width:1024px){
  .ab-hero-row,.ab-zig{grid-template-columns:1fr;gap:30px}
  .zig-flip .ab-zig-media{order:0}
  .team-wall{grid-template-columns:1fr 1fr}
  .timeline{grid-template-columns:1fr 1fr;gap:28px}
  .timeline::before{display:none}
  .timeline li::before{top:16px}
  .promise-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .team-wall{grid-template-columns:1fr}
  .timeline,.promise-grid{grid-template-columns:1fr}
  .ab-hero-media img,.ab-zig-media img{height:240px}
  .comp-box{padding:30px 22px}
}

/* ---------- 本地服务半径 ---------- */
.ab-radius{padding:50px 0;background:var(--gray-50)}
.radius-box{
  background:var(--white);border-radius:var(--radius-m);
  padding:36px 40px;box-shadow:var(--shadow-s);
}
.radius-box h2{font-size:19px;margin-bottom:14px}
.radius-box p{font-size:14px;color:var(--gray-600);line-height:2;margin-bottom:10px}

/* ---------- 团队分工三线 ---------- */
.ab-roles{padding:50px 0;background:var(--white)}
.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.role{
  background:var(--gray-50);border-radius:var(--radius-m);
  padding:26px 24px;border-top:3px solid var(--blue-400);
}
.role h3{font-size:15.5px;margin-bottom:10px}
.role p{font-size:13px;color:var(--gray-600);line-height:1.9}

@media (max-width:920px){
  .role-grid{grid-template-columns:1fr}
}