@charset "utf-8";
/* ==========================================================================
   xunweld / site.css —— 站点定制层（叠加在 templates/site-scaffold/base.css 之上）
   断点沿用模板实测值：移动 ≤767 / 平板 768–1024 / 桌面 ≥1025
   只做三件事：
     1) 页头：用原站横幅图当 logo（比骨架文字 logo 宽，故需收紧平板档）
     2) 内容站组件：文章 / 产品卡 / 图库 / 联系卡 / 流程图
     3) Hero 高度按本站主视觉图（900×320）调整
   ========================================================================== */

/* ---------------------------------------------------------------- 1. 页头 */
.site-header__inner { gap: var(--s4); }
.site-logo { flex-direction: row; align-items: center; gap: var(--s3); }
.site-logo__img { height: 46px; width: auto; display: block; }
.site-logo__slogan { display: none; }   /* 横幅图里已含公司名，副标题桌面端不重复 */

.lang-switch {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 5px 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-pill);
  font-size: var(--fs-tiny); color: var(--c-text-muted);
  white-space: nowrap;
}
.lang-switch:hover { border-color: var(--c-primary); color: var(--c-primary); }

/* 平板档：logo 是图片，必须收紧，否则 768 宽塞不下（骨架原提示见 base.css 第 14 节） */
@media (min-width: 768px) and (max-width: 1024px) {
  .site-logo__img { height: 30px; }
  .site-header__extra { display: none; }        /* 图片 logo 更宽，平板档去掉热线块 */
  .site-nav__link { padding: 0 7px; font-size: 13px; }
  .lang-switch { padding: 4px 9px; }
}

/* 移动档：汉堡按钮 + 语言切换常驻页头 */
@media (max-width: 767px) {
  .site-logo__img { height: 24px; }
  .site-header__inner { gap: var(--s2); }
  .lang-switch { padding: 4px 9px; }
}

/* ---------------------------------------------------------------- 2. Hero */
/* 本站主视觉是 900×320 横幅：把背景钉在下缘，可裁掉图上自带的一行英文标题 */
.hero__slide {
  min-height: 420px;
  background-position: center bottom;
}
.hero__slide::after { background: rgba(0, 0, 0, 0.52); }
@media (min-width: 768px) and (max-width: 1024px) { .hero__slide { min-height: 340px; } }
@media (max-width: 767px) { .hero__slide { min-height: 260px; } }

/* ---------------------------------------------------------------- 3. 文章排版 */
.article { max-width: 980px; margin: 0 auto; }
.article p { font-size: var(--fs-body); line-height: var(--lh-loose); color: var(--c-text); }
.article h2 { text-align: center; margin-bottom: var(--s7); }
.article__h3 {
  font-size: var(--fs-h5); margin: var(--s7) 0 var(--s3);
  padding-left: var(--s4); border-left: 4px solid var(--c-primary);
}
.attach-list { max-width: 980px; margin: 0 auto var(--s5); }
.attach-list li { padding: var(--s3) 0; border-bottom: 1px dashed var(--c-border); font-size: var(--fs-small); }
.attach-list li::before { content: "\f1c1"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--c-primary); margin-right: var(--s2); }
.empty-note {
  font-size: var(--fs-small); color: var(--c-text-muted);
  border-left: 3px solid var(--c-border); padding: var(--s2) 0 var(--s2) var(--s4);
  margin: 0 0 var(--s5);
}
.model-list { max-width: 980px; margin: 0 auto var(--s6); }
.model-list li { display: inline-block; margin: 0 var(--s3) var(--s3) 0; padding: 4px 12px; background: var(--c-bg-alt); font-size: var(--fs-small); }

/* 流程图 */
.process-figure { margin: 0; text-align: center; }
.process-figure img { max-width: 100%; height: auto; border: 1px solid var(--c-border); }
.process-figure figcaption { margin-top: var(--s3); font-size: var(--fs-small); color: var(--c-text-muted); }

/* ---------------------------------------------------------------- 4. 卡片补充 */
.card__media--contain { aspect-ratio: 3 / 4; background: var(--c-bg-alt); display: flex; align-items: center; justify-content: center; }
.card__media--contain img { width: 100%; height: 100%; object-fit: contain; }
.card:hover .card__media--contain img { transform: none; }
.card__models { margin: var(--s3) 0 0; font-size: var(--fs-tiny); color: var(--c-text-muted); }

/* 产品展示 / 产品应用 图库 */
.showcase { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s5); }
.showcase__item {
  margin: 0; background: var(--c-bg); border: 1px solid var(--c-border);
  aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center;
  padding: var(--s3);
}
.showcase__item img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.showcase--app { grid-template-columns: repeat(4, 1fr); }
@media (min-width: 768px) and (max-width: 1024px) { .showcase { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px) { .showcase { grid-template-columns: repeat(2, 1fr); gap: var(--s3); } }

/* ---------------------------------------------------------------- 5. 产品型号卡 */
.product-group__title {
  font-size: var(--fs-h4); margin: 0 0 var(--s6);
  padding-bottom: var(--s3); border-bottom: 2px solid var(--c-primary);
}
.product-group__title--sub { border-bottom-color: var(--c-border); }
.product-sub {
  font-size: var(--fs-h6); margin: var(--s7) 0 var(--s4);
  padding-left: var(--s3); border-left: 3px solid var(--c-primary);
}
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s5); margin-bottom: var(--s7); }
@media (min-width: 768px) and (max-width: 1024px) { .product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .product-grid { grid-template-columns: 1fr; } }
.product-card {
  display: flex; flex-direction: column; height: 100%;
  padding: var(--s5); border: 1px solid var(--c-border); background: var(--c-bg);
  transition: box-shadow var(--transition), border-color var(--transition);
}
.product-card:hover { border-color: var(--c-primary); box-shadow: var(--shadow-card); }
.product-card__name { font-size: var(--fs-h6); color: var(--c-primary); margin: 0 0 var(--s3); word-break: break-word; }
.product-card__app { flex: 1 1 auto; margin: 0 0 var(--s4); font-size: var(--fs-small); color: var(--c-text); }
.product-card__app--none { flex: 1 1 auto; }
.product-card__pdf { margin: 0; }
.btn--sm { padding: 6px var(--s4); font-size: var(--fs-tiny); }
.is-missing { color: var(--c-text-disabled); font-size: var(--fs-tiny); font-style: italic; }

/* ---------------------------------------------------------------- 6. 联系卡（三套联系方式并列） */
.contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s6); }
@media (min-width: 768px) and (max-width: 1024px) { .contact-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .contact-cards { grid-template-columns: 1fr; } }
.contact-card { padding: var(--s6); border: 1px solid var(--c-border); border-top: 3px solid var(--c-primary); background: var(--c-bg); }
.contact-card__title { font-size: var(--fs-h6); margin: 0 0 var(--s4); }
.contact-card__list li { padding: var(--s2) 0; font-size: var(--fs-small); border-bottom: 1px dashed var(--c-border); }
.contact-card__list li:last-child { border-bottom: 0; }
.contact-card__src { margin: var(--s4) 0 0; font-size: var(--fs-tiny); color: var(--c-text-muted); }

/* 页脚备案图标 */
.site-footer__list img { vertical-align: -4px; }