:root {
    --primary: #245bc8;
    --primary-dark: #1a4499;
    --primary-light: #e8f0ff;
    --text-main: #1a1a2e;
    --text-muted: #555;
    --text-light: #888;
    --bg-light: #f9fafc;
    --bg-white: #ffffff;
    --border: #e5e9f0;
    --shadow: 0 4px 20px rgba(0,0,0,0.08);
    --shadow-hover: 0 8px 30px rgba(0,0,0,0.14);
    --radius: 8px;
    --transition: all 0.3s ease;
  }
  * { box-sizing: border-box; }
  body { margin:0; font-family:'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; color:var(--text-main); line-height:1.7; background:#fff; }

  .about-page { width:100%; max-width:100%; margin:0 auto; overflow-x:hidden; }

  .section-title { text-align:center; font-size:clamp(24px,3vw,32px); font-weight:800; margin-bottom:12px; color:var(--text-main); }
  .section-subtitle { text-align:center; font-size:16px; color:var(--text-muted); margin:0 auto 48px; max-width:600px; }
  
  /* ═══ ABOUT US ═══ */
  .contact-page {padding-bottom: 0px;}
  .about-top { display:flex; align-items:stretch; gap:60px; margin-bottom:60px; flex-wrap:wrap; }
  .about-top__text, .about-top__media { flex:1 1 320px; min-width:0; }
  .about-top__text { display:flex; flex-direction:column; justify-content:center; }
  .about-top__title { font-size:clamp(24px,3vw,34px); font-weight:800; line-height:1.3; margin:0 0 20px 0; color:var(--primary); }
  .about-top__desc,.about-top__services,.about-top__compliance { font-size:15px; margin:0 0 16px 0; color:var(--text-muted); }
  .about-top__services strong { color:var(--text-main); }
  .about-top__compliance { padding-top:16px; border-top:0px solid var(--border); }

  /* 视频封面 */
  .about-top__media { display:flex; align-items:center; }
  .video-trigger {
    width:100%; position:relative; border-radius:var(--radius); overflow:hidden;
    box-shadow:var(--shadow); cursor:pointer; display:block;
  }
  .video-trigger img { width:100%; aspect-ratio:4/2; object-fit:cover; display:block; transition:var(--transition); }
  .video-trigger:hover img { transform:scale(1.03); }
  .video-trigger__play {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:72px; height:72px; background:rgba(36,91,200,0.9); border-radius:50%;
    display:flex; align-items:center; justify-content:center; transition:var(--transition);
  }
  .video-trigger__play svg { width:28px; height:28px; color:#fff; margin-left:4px; }
  .video-trigger:hover .video-trigger__play { transform:translate(-50%,-50%) scale(1.15); background:var(--primary); }

  /* ═══ WHY CHOOSE US ═══ */
  .why-section { margin-bottom:70px; }
  .why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; width:100%; }
  .why-card { background:var(--bg-light); padding:32px 24px; border-radius:var(--radius); text-align:center; transition:var(--transition); display:flex; flex-direction:column; align-items:center; }
  .why-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
  .why-card__icon { width:52px; height:52px; margin-bottom:18px; color:var(--primary); }
  .why-card__icon svg { width:100%; height:100%; stroke:currentColor; fill:none; }
  .why-card__title { font-size:17px; font-weight:700; margin:0 0 10px 0; }
  .why-card__text { font-size:14px; color:var(--text-muted); margin:0; line-height:1.65; }

  /* ═══ FACTORY ═══ */
  .factory-section { margin-bottom:70px; }
  .factory-section__inner { display:flex; align-items:center; gap:50px; flex-wrap:wrap; }
  .factory-section__stats { flex:1 1 300px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .factory-stat { text-align:center; padding:24px 16px; background:var(--bg-light); border-radius:var(--radius); transition:var(--transition); }
  .factory-stat:hover { background:var(--primary-light); }
  .factory-stat__value { font-size:22px; font-weight:800; color:var(--text-main); margin-bottom:6px; }
  .factory-stat__label { font-size:12px; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.5px; }
  .factory-section__image { flex:1 1 300px; display:flex; align-items:center; }
  .factory-section__image img { width:100%; aspect-ratio:4/1.73; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow); cursor:zoom-in; display:block; }

 /* ═══ FLOW ═══ */
.flow-section { margin-bottom:70px; }
.flow-section__steps {
  display:flex;
  justify-content:center;
  align-items:flex-start;
  gap:0;
  width:100%;
  max-width:1100px;
  margin:0 auto;
}
.flow-step {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  flex:1;
  min-width:0;
  text-align:center;
}
.flow-step__icon {
  width:72px;
  height:72px;
  background:var(--primary);
  border-radius:50%;
  display:flex;
  justify-content:center;
  align-items:center;
  color:#fff;
  flex-shrink:0;
  transition:var(--transition);
}
.flow-step:hover .flow-step__icon {
  background:var(--primary-dark);
  transform:scale(1.1);
}
.flow-step__label {
  font-size:13px;
  font-weight:600;
  color:var(--text-main);
  line-height:1.3;
}
.flow-step__tip {
  font-size:11px;
  color:var(--text-light);
  line-height:1.2;
}
.flow-arrow {
  font-size:22px;
  color:var(--primary);
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:40px;
}

/* ===== 核心：智能区分描边 / 填充 SVG ===== */

/* 描边型（灯泡、放大镜） */
.flow-step__icon svg {
  width:36px;
  height:36px;
  stroke:#ffffff;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* 填充型（卷线轴、衣服、剪刀、缝纫机、纸箱） */
.flow-step__icon svg[viewBox*="1024"],
.flow-step__icon svg[viewBox*="1225"] {
  width:44px !important;
  height:44px !important;
  fill:#ffffff !important;
  stroke:none !important;
}

/* ✅ 剪刀单独微调（更居中、更稳重） */
.flow-section__steps .flow-step:nth-child(4) svg {
  width:46px !important;
  height:46px !important;
  transform:translateY(-1px);
}

/* ✅ 衣服 + 剪刀统一视觉权重 */
.flow-section__steps .flow-step:nth-child(3) svg,
.flow-section__steps .flow-step:nth-child(4) svg {
  width:46px !important;
  height:46px !important;
}

/* ✅ hover 统一光晕（只写一次） */
.flow-step:hover .flow-step__icon svg {
  filter: drop-shadow(0 0 6px rgba(255,255,255,0.6));
}
  /* ═══ SMART ═══ */
  .smart-section { margin-bottom:70px; }
  .smart-facility-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; width:100%; }
  .smart-card { background:var(--bg-white); border-radius:var(--radius); overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.06); transition:var(--transition); display:flex; flex-direction:column; }
  .smart-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-hover); }
  .smart-card__image { width:100%; aspect-ratio:4/3; overflow:hidden; }
  .smart-card__image img { width:100%; height:100%; object-fit:cover; cursor:zoom-in; transition:transform 0.5s; display:block; }
  .smart-card:hover .smart-card__image img { transform:scale(1.05); }
  .smart-card__body { padding:20px 18px; flex:1; }
  .smart-card__title { font-size:15px; font-weight:700; margin:0 0 8px 0; }
  .smart-card__text { font-size:13px; color:var(--text-muted); margin:0; line-height:1.6; }

  /* ═══ CERTIFICATES ═══ */
  .cert-section { margin-bottom:70px; }
  .cert-category { margin-bottom:50px; }
  .cert-category:last-child { margin-bottom:0; }
  .cert-category__title { font-size:18px; font-weight:700; color:var(--text-main); margin-bottom:28px; display:flex; align-items:center; justify-content:center; gap:10px; text-align:center; }
  .cert-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:36px 40px; width:100%; max-width:960px; margin:0 auto; justify-items:center; }
  .cert-grid--4 { grid-template-columns:repeat(4,1fr); max-width:800px; }
  .cert-grid--3 { grid-template-columns:repeat(3,1fr); max-width:600px; }
  .cert-grid--2 { grid-template-columns:repeat(2,1fr); max-width:400px; }
  .cert-item { text-align:center; width:100%; max-width:140px; display:flex; flex-direction:column; align-items:center; }
  .cert-item__seal { width:88px; height:88px; margin:0 auto 14px; border-radius:50%; overflow:hidden; background:var(--bg-light); border:2px solid var(--border); display:flex; align-items:center; justify-content:center; transition:var(--transition); cursor:zoom-in; }
  .cert-item__seal:hover { transform:scale(1.08); box-shadow:var(--shadow); }
  .cert-item__seal img { width:100%; height:100%; object-fit:contain; padding:0; display:block; }
  .cert-item__name { font-size:14px; font-weight:700; color:var(--text-main); margin-bottom:4px; }
  .cert-item__desc { font-size:12px; color:var(--text-light); line-height:1.4; display:none; }

  /* ═══ CLIENTS ═══ */
  .clients-section { margin-bottom:70px; }
  .partner-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:32px 40px; max-width:900px; margin:0 auto; align-items:center; }
  .partner-item { display:flex; align-items:center; justify-content:center; height:80px; padding:12px; background:var(--bg-light); border-radius:var(--radius); transition:var(--transition); border:1px solid var(--border); }
  .partner-item:hover { box-shadow:var(--shadow); border-color:var(--primary); transform:translateY(-2px); }
  .partner-item img { max-width:100%; max-height:100%; object-fit:contain; filter:grayscale(100%); opacity:0.6; transition:var(--transition); }
  .partner-item:hover img { filter:grayscale(0%); opacity:1; }

  /* ═══ QUALITY ═══ */
  .quality-section { margin-bottom:70px; }
  .quality-section__inner { display:flex; align-items:center; gap:50px; flex-wrap:wrap; }
  .quality-card { flex:1 1 350px; background:var(--bg-light); padding:36px 32px; border-radius:var(--radius); }
  .quality-list { list-style:none; padding:0; margin:0 0 20px 0; }
  .quality-list li { display:flex; align-items:flex-start; gap:10px; margin-bottom:14px; font-size:14px; font-weight:600; }
  .quality-list__check { color:var(--primary); font-weight:700; font-size:16px; flex-shrink:0; margin-top:1px; }
  .quality-card__text { font-size:13px; color:var(--text-muted); margin:0; padding-top:16px; border-top:1px dashed var(--border); }
  .quality-image { flex:1 1 350px; display:flex; align-items:center; justify-content:center; }
  .quality-image img { width:100%; max-width:520px; aspect-ratio:4/2.2; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow); cursor:zoom-in; display:block; }

  /* ═══ FAQ ═══ */
  .faq-section { margin-bottom:70px; }
  .faq-item { border-bottom:1px solid var(--border); }
  .faq-question { width:100%; display:flex; justify-content:space-between; align-items:center; padding:20px 0; background:none; border:none; font-size:16px; font-weight:600; color:var(--text-main); cursor:pointer; text-align:left; }
  .faq-answer { max-height:0; overflow:hidden; transition:max-height 0.35s ease; }
  .faq-answer p { padding-bottom:20px; margin:0; font-size:14px; color:var(--text-muted); line-height:1.7; }

  /* ═══ CTA ═══ */
  .cta-section { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:#fff; padding:clamp(36px,5vw,56px) clamp(24px,4vw,40px); border-radius:12px; text-align:center; margin-bottom:40px; width:100%; }
  .cta-section h3 { font-size:clamp(22px,3vw,28px); font-weight:800; margin:0 0 12px 0; }
  .cta-section p { font-size:16px; opacity:0.9; margin:0 auto 28px; max-width:500px; }
  .cta-buttons { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }
  .btn { display:inline-flex; align-items:center; gap:8px; padding:14px 32px; border-radius:var(--radius); font-size:15px; font-weight:600; text-decoration:none; cursor:pointer; transition:var(--transition); border:none; }
  .btn-primary { background:#fff; color:var(--primary); }
  .btn-primary:hover { background:#f0f0f0; transform:translateY(-2px); }
  .btn-secondary { background:transparent; color:#fff; border:2px solid rgba(255,255,255,0.5); }
  .btn-secondary:hover { border-color:#fff; background:rgba(255,255,255,0.1); }

  /* ═══ LIGHTBOX ═══ */
  .lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.88); z-index:9999; justify-content:center; align-items:center; opacity:0; transition:opacity 0.3s; }
  .lightbox.active { display:flex; opacity:1; }
  .lightbox__image { max-width:90vw; max-height:85vh; border-radius:6px; box-shadow:0 10px 60px rgba(0,0,0,0.5); }
  .lightbox__video { max-width:90vw; max-height:85vh; border-radius:6px; outline:none; }
  .lightbox__close { position:absolute; top:20px; right:30px; font-size:42px; color:#fff; cursor:pointer; line-height:1; width:44px; height:44px; display:flex; align-items:center; justify-content:center; }
  .lightbox__arrow { position:absolute; top:50%; transform:translateY(-50%); font-size:36px; color:#fff; cursor:pointer; width:52px; height:52px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.1); border-radius:50%; transition:var(--transition); }
  .lightbox__arrow:hover { background:rgba(255,255,255,0.25); }
  .lightbox__arrow--prev { left:20px; }
  .lightbox__arrow--next { right:20px; }

  /* ═══ RESPONSIVE ═══ */
  @media (max-width:1024px) {
    .why-grid { grid-template-columns:repeat(2,1fr); }
    .smart-facility-grid { grid-template-columns:repeat(2,1fr); }
    .factory-section__stats { grid-template-columns:repeat(3,1fr); }
    .flow-section__steps { flex-wrap:wrap; row-gap:30px; }
    .flow-arrow { display:none; }
    .partner-grid { grid-template-columns:repeat(4,1fr); }
  }
  @media (max-width:768px) {
    .about-page { padding:40px 4%; }
    .about-top { gap:30px; }
    .flow-section__steps { flex-direction:column; align-items:stretch; gap:0; }
    .flow-step { flex-direction:row; width:100%; text-align:left; gap:16px; padding:16px 0; border-bottom:1px solid var(--border); }
    .flow-step__icon { width:56px; height:56px; }
    .factory-section__stats { grid-template-columns:repeat(2,1fr); }
    .why-grid { grid-template-columns:1fr; }
    .smart-facility-grid { grid-template-columns:1fr; }
    .cert-grid,.cert-grid--4,.cert-grid--3,.cert-grid--2 { grid-template-columns:repeat(2,1fr); max-width:400px; }
    .quality-section__inner { gap:30px; }
    .partner-grid { grid-template-columns:repeat(3,1fr); gap:20px; }
  }
  @media (max-width:480px) {
    .factory-section__stats { grid-template-columns:1fr; }
    .partner-grid { grid-template-columns:repeat(2,1fr); }
  }