/* ============================================================
   Shifang Packaging — manufacturing.css
   生产制造页：工厂团队 / 制造优势 / 生产流程 / 可持续发展 / 客户评价轮播
   （头部、Banner 卡片、面包屑、团队成员、证书墙、公司新闻、询盘表单、CTA 等共用组件见 main.css）
   ============================================================ */

/* ---------- 0. Banner 背景图（图片由模板注入 --mfg-hero-img，未上传则无背景） ---------- */
.hero-card--mfg {
  background:
    linear-gradient(95deg, #fff 0%, #fff 46%, rgba(255, 255, 255, 0) 76%),
    var(--mfg-hero-img, none) right center / cover no-repeat;
}

@media (max-width: 1024px) {
  .hero-card--mfg {
    background:
      linear-gradient(95deg, #fff 0%, #fff 56%, rgba(255, 255, 255, 0) 88%),
      var(--mfg-hero-img, none) right center / cover no-repeat;
  }
}

@media (max-width: 720px) {
  .hero-card--mfg {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, .94) 0%, rgba(255, 255, 255, .8) 100%),
      var(--mfg-hero-img, none) center / cover no-repeat;
  }
}

/* ---------- 1. 工厂关键成员 ---------- */
.members { padding: 72px 0; }
.members .people {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 24px;
}
.members .person { width: auto; }
.members .person img {
  display: block;
  width: 100%;
  max-width: 176px;
  height: auto;
  aspect-ratio: 1 / 1;
  margin-inline: auto;
}

/* ---------- 2. 制造优势 ---------- */
.mfg-why { padding: 72px 0; background: var(--c-bg-alt); }
.mfg-why__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 44px 28px;
}
.mfg-why__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.mfg-why__ic {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  color: var(--c-teal);
  border: 1px solid var(--c-teal);
  border-radius: 50%;
}
.mfg-why__ic svg { width: 32px; height: 32px; }
.mfg-why__ic img { width: 32px; height: 32px; object-fit: contain; }
.mfg-why__item p { margin-top: 16px; font-size: var(--fs-sm); }

/* ---------- 3. 生产流程 ---------- */
.mfg-process { padding: 72px 0; }
.mfg-process__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px 28px;
}
.mfg-step__img {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
}
.mfg-step__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--t-base);
}
.mfg-step:hover .mfg-step__img img { transform: scale(1.03); }
.mfg-step h3 { margin-top: 16px; font-size: var(--fs-sm); font-weight: 600; text-align: center; }

/* ---------- 4. 可持续发展（多行，左图右文/左文右图交替） ---------- */
.mfg-sus { padding: 72px 0; }
.mfg-sus__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
.mfg-sus__grid + .mfg-sus__grid { margin-top: 72px; }
.mfg-sus__grid--flip .mfg-sus__img { order: 2; }
.mfg-sus__grid--flip .mfg-sus__text { order: 1; }
.mfg-sus__img img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
}
.mfg-sus__text h2 { font-size: var(--fs-h2); }
.mfg-sus__text p { margin-top: 16px; }
.mfg-sus__text .btn { margin-top: 24px; }

/* ---------- 5. 响应式（三端适配） ---------- */
@media (max-width: 1024px) {
  .mfg-why__grid,
  .mfg-process__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mfg-sus__grid { grid-template-columns: 1fr; }
  .mfg-sus__img,
  .mfg-sus__grid--flip .mfg-sus__img { order: 0; }
  .mfg-sus__grid--flip .mfg-sus__text { order: 0; }
  .mfg-sus__grid + .mfg-sus__grid { margin-top: 56px; }
  .members .people { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .members,
  .mfg-why,
  .mfg-process,
  .mfg-sus,
  .certs,
  .partner,
  .company-news { padding: 56px 0; }
}

@media (max-width: 720px) {
  .mfg-why__grid,
  .mfg-process__grid { grid-template-columns: 1fr; }
  .members .people { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .members .person img { max-width: 120px; }
}