/* Hero Banner */
.zs-hero-about {
  position: relative;
  width: 100%;
  height: 26.25rem; /* 420px / 16 (原高度 840px 减半) */
  display: flex;
  align-items: center;
}

.zs-hero-about-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.zs-hero-about-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.zs-hero-about-content {
  position: relative;
  padding-left: 8%;
  color: #fff;
  max-width: 50%;
}

.zs-hero-about-content h1 {
  font-size: 3.5rem; /* 56px */
  font-weight: 700;
  margin-bottom: 1.25rem;
  line-height: 1.2;
}

.zs-hero-about-content p {
  font-size: 1.5rem; /* 24px */
  margin-bottom: 2.5rem;
  line-height: 1.4;
}

/* About Intro Section */
.zs-about-intro {
  display: flex;
  background: var(--color-bg-soft);
  max-width: 120rem; /* 设置最大宽度限制，避免变成通栏 */
  margin: 0 auto; /* 居中对齐 */
}

.zs-about-intro-text {
  background: transparent; /* 去除红色背景 */
  color: var(--color-text-strong);
  padding: 5rem 4%;
  flex: 0 0 41.666667%; /* col-5 */
}

.zs-about-intro-text h2 {
  font-size: 3.5rem; /* 增大标题字号从 2.5rem 到 3.5rem */
  margin-bottom: 1.5rem;
  color: var(--color-text-strong); /* 文字颜色改为深色 */
}

.zs-about-intro-text p {
  font-size: 1.125rem;
  line-height: 1.6;
  margin-bottom: 1.25rem;
  color: var(--color-text-muted); /* 描述文字颜色改为深灰 */
}

.zs-about-intro-text strong {
  font-weight: 700;
}

/* Stats Section */
.zs-about-stats {
  flex: 0 0 58.333333%; /* col-7 */
  padding: 0; /* 去除内边距 */
  display: flex;
  align-items: stretch;
}

.zs-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0; /* 移除列表之间的间隙 */
  width: 100%;
}

.zs-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; /* 内容居中显示 */
  text-align: center;
  border: 1px solid var(--color-border); /* 添加边框 */
  padding: 3rem 1.5rem; /* 添加一些内边距让内容好看些 */
}

.zs-stat-icon {
  width: 4rem; /* 缩小图标 */
  height: 4rem;
  background-color: transparent; /* 移除白色背景 */
  border-radius: 0; /* 移除圆角 */
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: 100%; /* 放大背景图 */
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: none; /* 移除阴影 */
}

.zs-stat-item span {
  font-size: 0.75rem; /* 从 0.875rem (14px) 减小到 0.75rem (12px) */
  font-weight: 700;
  color: var(--color-text-strong);
  text-transform: uppercase;
  line-height: 1.4;
  white-space: normal; /* 允许换行以适应手机端双列 */
}

/* Linear thin icons */
.zs-icon-handshake { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-13h2v6h-2zm0 8h2v2h-2z"/></svg>'); }
.zs-icon-people { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>'); }
.zs-icon-buildings { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><rect x="4" y="2" width="16" height="20" rx="2" ry="2"/><path d="M9 22v-4h6v4"/><path d="M8 6h.01"/><path d="M16 6h.01"/><path d="M12 6h.01"/><path d="M12 10h.01"/><path d="M12 14h.01"/><path d="M16 10h.01"/><path d="M16 14h.01"/><path d="M8 10h.01"/><path d="M8 14h.01"/></svg>'); }
.zs-icon-cockade { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="8" r="7"/><polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"/></svg>'); }
.zs-icon-factory { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M2 20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8l-7 5V8l-7 5V4a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z"/></svg>'); }
.zs-icon-chart { background-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 24 24" fill="none" stroke="%233F5AB6" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/><line x1="2" y1="22" x2="22" y2="22"/></svg>'); }

/* History Link Block */
.zs-about-history {
  text-align: center;
  padding: 0;
  margin-top: 3%; /* 与上方区块隔开 3% */
}

.zs-about-bme {
  text-align: center;
  padding: 0;
}

.zs-btn-page-link {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff; /* 改为白色底色 */
  padding: 3rem 1.5rem;
  color: var(--color-primary); /* 默认红字 */
  text-decoration: none;
  font-size: 1.125rem; /* 字号减小到 18px (原为 1.5rem) */
  font-weight: 400; /* 取消加粗 */
  transition: background-color 0.3s, color 0.3s;
  position: relative;
  text-transform: uppercase;
}

.zs-btn-page-link:hover {
  background-color: #fff; /* 鼠标经过不要红色背景，保持白色 */
  color: var(--color-text-strong);
}

.zs-btn-page-link span {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
}

/* Pillars Section */
.zs-about-pillars {
  padding: 5rem 7%;
  background-color: var(--color-bg-soft); /* 外层灰色背景 */
}

.zs-about-pillars-inner {
  background-color: #fff; /* 内部白色背景 */
  padding: 4rem 4rem; /* 增加左右内边距 */
  max-width: 90rem; /* 从 75rem 加宽到 90rem */
  margin: 0 auto;
}

.zs-about-pillars h2 {
  font-size: 3.5rem; /* 增大标题字号从 2.5rem 到 3.5rem */
  color: var(--color-text-strong);
  margin-bottom: 4rem;
  text-align: left; /* 标题靠左 */
  font-weight: 700;
}

.zs-pillars-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem 2rem;
}

.zs-pillar-item {
  display: flex;
  flex-direction: row; /* 左右布局 */
  align-items: center; /* 上下居中对齐 */
  text-align: left; /* 文字靠左对齐 */
  gap: 1.5rem;
}

.zs-pillar-icon-wrap {
  width: 7.5rem; /* 120px */
  height: 7.5rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%; /* 将图标外框设为圆形 */
  overflow: hidden; /* 确保内部图片被裁剪成圆形 */
  box-shadow: 0 10px 24px rgba(31, 43, 77, 0.08);
}

.zs-pillar-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Pull existing PNG icons back into the new blue palette without touching HTML. */
.zs-pillar-item:nth-child(1) img {
  filter: hue-rotate(118deg) saturate(1.55) brightness(0.95);
}

.zs-pillar-item:nth-child(2) img {
  filter: sepia(0.18) saturate(1.4) hue-rotate(168deg) brightness(1.02);
}

.zs-pillar-item:nth-child(3) img {
  filter: sepia(0.36) saturate(2.4) hue-rotate(176deg) brightness(0.78);
}

.zs-pillar-item:nth-child(4) img {
  filter: sepia(0.48) saturate(2.1) hue-rotate(176deg) brightness(0.96);
}

.zs-pillar-item dl {
  margin: 0;
  padding-top: 0; /* 居中后不再需要额外的顶部 padding */
}

.zs-pillar-item dt {
  font-size: 1.125rem; /* 18px */
  font-weight: 700;
  color: var(--color-text-strong); /* 标题文字深色 */
  margin-bottom: 0.5rem;
}

.zs-pillar-item dd {
  font-size: 1rem; /* 16px */
  line-height: 1.6;
  color: var(--color-text-muted); /* 描述文字深灰 */
  margin: 0;
}

/* Responsive */
@media (max-width: 63.9375rem) {
  .zs-hero-about {
    height: 26.25rem; /* 420px (原 315px 再增加三分之一 105px) */
  }

  .zs-hero-about-content {
    max-width: 100%;
    padding-right: 8%;
  }

  .zs-hero-about-content h1 {
    font-size: 2.5rem;
  }

  .zs-hero-about-content p {
    font-size: 1.125rem;
  }

  .zs-about-intro {
    flex-direction: column;
  }

  .zs-about-intro-text,
  .zs-about-stats {
    flex: 1 1 100%;
    padding: 0;
  }

  .zs-about-intro-text {
    padding: 3rem 1.5rem;
  }

  .zs-stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
  }

  .zs-about-pillars-inner {
    padding: 2rem 1.5rem;
  }

  .zs-about-pillars h2 {
    font-size: 2rem;
    margin-bottom: 2rem;
  }

  .zs-pillars-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

@media (max-width: 48rem) { /* Additional breakpoint for mobile phones */
  .zs-stats-grid {
    grid-template-columns: repeat(2, 1fr); /* Keep 2 columns on mobile as requested */
  }
  
  .zs-stat-item {
    padding: 2rem 0.5rem; /* Reduce padding significantly to fit 2 columns better */
  }
  
  .zs-stat-item span {
    font-size: 0.7rem; /* Make text slightly smaller on mobile to prevent overflow */
  }
}
