/* ========================================
   关于我们页面 - 1:1 Figma 还原 (node 1:602)
   ======================================== */

/* 页面 Hero Banner */
.page-hero {
  position: relative;
  height: 252px;
  overflow: hidden;
}

.page-hero-bg {
  position: absolute;
  inset: 0;
}

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

.page-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(21,93,252,0.3), rgba(25,60,184,0.3));
}

.page-hero-content {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: calc(var(--container-padding) + 32px);
}

.page-hero-title {
  font-size: 48px;
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin-bottom: 16px;
}

.page-hero-subtitle {
  font-size: 20px;
  color: #dbeafe;
  line-height: 1.4;
}

/* 公司简介 */
.about-intro {
  padding: 80px 0;
  background: var(--white);
}

.about-intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}

.about-intro-heading {
  font-size: 30px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 24px;
}

.about-intro-text p,
.about-intro-text .about-intro-body p {
  font-size: 16px;
  color: var(--text-gray);
  line-height: 1.625;
  margin-bottom: 16px;
}

.about-intro-text p:last-of-type,
.about-intro-text .about-intro-body p:last-of-type {
  margin-bottom: 32px;
}

.about-intro-stats {
  display: flex;
  gap: 24px;
  margin-top: 40px;
}

.about-stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.about-stat-num {
  font-size: 30px;
  font-weight: 700;
  color: var(--primary);
}

.about-stat-label {
  font-size: 16px;
  color: var(--text-gray);
}

.about-intro-img {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1);
}

.about-intro-img img {
  width: 100%;
  height: 100%;
  min-height: 282px;
  object-fit: cover;
}

/* 企业文化 */
.about-culture {
  padding: 80px 0;
  background: var(--bg-gray);
}

.about-culture-heading {
  font-size: 30px;
  font-weight: 700;
  color: var(--text-dark);
  margin-bottom: 40px;
}

.about-culture-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 20px;
  height: 640px;
}

.culture-item {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
}

.culture-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.culture-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 40%);
  pointer-events: none;
}

.culture-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px 28px;
  color: var(--white);
}

.culture-item-large .culture-caption {
  padding: 28px 32px;
}

.culture-caption h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 6px;
}

.culture-item-large .culture-caption h3 {
  font-size: 24px;
  margin-bottom: 8px;
}

.culture-item-large .culture-caption p {
  font-size: 18px;
}

.culture-caption p {
  font-size: 16px;
}

/* 左侧大图占满整高 + 右侧三图等分 */
.culture-item-large {
  grid-column: 1;
  grid-row: 1 / -1;
}

.culture-items-right {
  display: contents;
}

.culture-items-right .culture-item {
  min-height: 0;
}

.culture-items-right .culture-item .culture-caption {
  padding: 20px 24px;
}

.culture-items-right .culture-caption h3 {
  font-size: 18px;
  margin-bottom: 4px;
}

.culture-items-right .culture-caption p {
  font-size: 15px;
}

/* 资质荣誉 */
.about-qualifications {
  padding: 80px 0;
  background: var(--white);
}

.about-qualifications .section-title {
  margin-bottom: 16px;
}

.about-qualifications .section-desc {
  margin-bottom: 64px;
}

.qualifications-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

.qual-card {
  background: var(--white);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
}

.qual-img {
  height: 373px;
  overflow: hidden;
}

.qual-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.qual-card h3 {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  padding: 24px;
  color: var(--text-dark);
  line-height: 1.5;
}

/* ========== 响应式 - Tablet ========== */
@media (max-width: 1200px) {
  .about-intro-stats {
    flex-wrap: wrap;
    gap: 20px;
  }

  .qualifications-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .qual-img {
    height: 300px;
  }
}

/* ========== 响应式 - Mobile ========== */
@media (max-width: 768px) {
  .page-hero {
    height: 200px;
  }

  .page-hero-content {
    padding-left: 16px;
  }

  .page-hero-title {
    font-size: 32px;
  }

  .page-hero-subtitle {
    font-size: 16px;
  }

  .about-intro {
    padding: 48px 0;
  }

  .about-intro-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .about-intro-heading {
    font-size: 24px;
  }

  .about-intro-stats {
    margin-top: 24px;
    flex-direction: column;
    gap: 16px;
  }

  .about-stat-num {
    font-size: 28px;
  }

  .about-intro-img img {
    min-height: 220px;
  }

  .about-culture {
    padding: 48px 0;
  }

  .about-culture-heading {
    font-size: 24px;
    margin-bottom: 32px;
  }

  .about-culture-grid {
    grid-template-columns: 1fr;
    grid-template-rows: 280px 160px 160px 160px;
    height: auto;
    gap: 16px;
  }

  .culture-item-large {
    grid-column: 1;
    grid-row: auto;
  }

  .about-qualifications {
    padding: 48px 0;
  }

  .about-qualifications .section-desc {
    margin-bottom: 40px;
  }

  .qualifications-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .qual-img {
    height: 280px;
  }

  .qual-card h3 {
    font-size: 16px;
    padding: 16px;
  }
}
