/* ========================================================================
   layout-fluid.css -- 宽度 / 布局 / 间距规则提取
   来源: site.css + public-fix.css
   仅包含: 宽度、布局、间距相关的规则。排除颜色、字体、阴影、动画。
   ======================================================================== */



/* ========================================================================
   1. CSS Custom Properties (布局/宽度变量)
   ======================================================================== */

/* --- 初始 :root (site.css:1) -- 仅含布局/间距变量 --- */
:root {
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
}

/* --- :root 第二块 (site.css:2880) 页面背景块 --- */
:root{
  --bg-page:#f4f8fe;
  --panel-blue:#ffffff;
  --panel-soft-blue:#f7fbff;
  --ink:#10223a;
  --muted-2:#667892;
  --line-soft:rgba(20,54,102,.10);
}

/* --- 前台变量 (site.css:5382) --- */
.public-body {
  --front-shell-max: 1600px;
  --front-shell-pad: 80px;
  --front-card-radius: 26px;
  --front-card-border: rgba(20, 54, 102, 0.08);
  --front-card-shadow: 0 20px 44px rgba(8, 17, 31, 0.06);
  --front-card-shadow-hover: 0 28px 56px rgba(8, 17, 31, 0.10);
  --front-card-bg: #ffffff;
  --front-card-copy: #5f738c;
  --front-card-title: #173154;
}

/* --- site-gutter 流体变量 (public-fix.css:1721) --- */
.public-body {
  --site-gutter: clamp(32px, 4vw, 120px);
}

@media (max-width: 768px) {
  .public-body {
    --site-gutter: 24px;
  }
}

@media (max-width: 480px) {
  .public-body {
    --site-gutter: 16px;
  }
}

/* --- front-shell-pad 响应式 (site.css:5731,5763) --- */
@media (max-width: 1180px) {
  .public-body {
    --front-shell-pad: 36px;
  }
}

@media (max-width: 780px) {
  .public-body {
    --front-shell-pad: 24px;
  }
}

/* --- inner-page-banner 变量 (site.css:5832 附近) --- */
.inner-page-banner-card {
  min-height: var(--page-hero-height, 520px);
  height: var(--page-hero-height, 520px);
}

.inner-page-banner-grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, var(--page-hero-panel-width, 360px));
  min-height: var(--page-hero-height, 520px);
}

.inner-page-banner-copy {
  max-width: min(var(--page-hero-copy-max, 896px), 100%);
  padding-top: var(--page-hero-pad-top, 0px);
  padding-bottom: var(--page-hero-pad-bottom, 0px);
}

.inner-page-banner-copy h1 {
  max-width: min(var(--page-hero-title-width, 1000px), 100%);
  font-size: clamp(32px, 2.6vw, var(--page-hero-title-size, 40px)) !important;
}

.inner-page-banner-copy .hero-text {
  max-width: min(var(--page-hero-text-width, 700px), 100%);
}

.inner-page-panel-card {
  width: min(100%, var(--page-hero-panel-width, 360px));
}

.inner-page-banner-metrics {
  max-width: 860px;
}

/* --- v713 banner 变量覆盖 (site.css:6111) --- */
.inner-page-banner-card {
  min-height: var(--page-hero-height, 520px);
  height: var(--page-hero-height, 520px);
}
.inner-page-banner-grid {
  grid-template-columns: minmax(0,1.18fr) minmax(300px,var(--page-hero-panel-width,340px));
}
.inner-page-banner-copy {
  max-width: min(var(--page-hero-copy-max,1080px), 100%);
}
.inner-page-banner-copy h1 {
  max-width: min(var(--page-hero-title-width,1060px), 100%) !important;
  font-size: clamp(32px, 2.6vw, var(--page-hero-title-size,40px)) !important;
}
.inner-page-banner-copy .hero-text {
  max-width: min(var(--page-hero-text-width,760px), 100%) !important;
}
.inner-page-panel-card {
  width: min(100%, var(--page-hero-panel-width,340px));
}
.inner-page-banner-metrics {
  max-width: 940px;
}

/* --- inner-page-banner 最新覆盖 (site.css:6304) --- */
.inner-page-banner-grid {
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, var(--page-hero-panel-width, 320px));
}
.inner-page-banner-copy {
  max-width: min(var(--page-hero-copy-max, 960px), 100%);
}
.inner-page-banner-copy h1 {
  max-width: min(var(--page-hero-title-width, 1000px), 100%) !important;
  font-size: clamp(32px, 2.6vw, var(--page-hero-title-size, 42px)) !important;
}
.inner-page-banner-copy .hero-text {
  max-width: min(var(--page-hero-text-width, 700px), 100%) !important;
}
.inner-page-panel-card {
  width: min(100%, var(--page-hero-panel-width, 320px));
}

/* --- 内页Hero 9805 附近 (site.css:9805) --- */
.inner-page-banner-card {
  min-height: var(--page-hero-height, 420px);
}
.inner-page-banner-grid {
  grid-template-columns: 1.1fr 0.9fr;
  gap: 32px;
  width: 100%;
  padding: 48px 0;
}
.inner-page-banner-copy .hero-text {
  max-width: 540px !important;
}



/* ========================================================================
   2. Body/HTML 基础宽度设置 + box-sizing
   ======================================================================== */

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
}

main { overflow: clip; }

img { max-width: 100%; display: block; }

/* --- body 重置 (site.css:2888) --- */
body {
  background: var(--bg-page);
  color: var(--ink);
}

/* --- ROUND59 body (site.css:3297) --- */
body {
  background: linear-gradient(180deg, #fbfdff 0%, #ffffff 240px);
}



/* ========================================================================
   3. Shell / Container / Wrapper 宽度规则
   ======================================================================== */

/* --- 主 shell 容器 (site.css:33) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}

.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}

@media (max-width: 1100px) {
  .shell, .hero-slide-shell {
    width: min(100%, calc(100% - 28px));
    max-width: none;
  }
}

/* --- page-hero 基本 (site.css:180) --- */
.page-hero {
  padding: 78px 0;
}
.page-hero.compact {
  padding: 54px 0;
}
.page-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 36px;
  align-items: center;
}
.page-hero .hero-text {
  max-width: 660px;
}

/* --- v58 shell 覆盖 (site.css:756) --- */
@media (max-width: 1680px) {
  .shell {
    width: min(1600px, calc(100% - 52px));
  }
}
@media (max-width: 1200px) {
  .shell {
    width: min(100%, calc(100% - 28px));
  }
}

/* --- v59 shell + padding (site.css:847) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
@media (max-width: 1680px) {
  .shell {
    width: min(2100px, calc(100% - 56px));
    max-width: 2100px;
  }
}
@media (max-width: 1200px) {
  .shell, .hero-slide-shell {
    width: min(100%, calc(100% - 28px));
  }
}

/* --- v510 shell (site.css:922) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
@media (max-width: 1680px) {
  .shell {
    width: min(2100px, calc(100% - 56px));
    max-width: 2100px;
  }
  .hero-slide-shell {
    width: min(2360px, calc(100% - 56px));
    max-width: var(--front-shell-max);
  }
}
@media (max-width: 1200px) {
  .shell, .hero-slide-shell {
    width: min(100%, calc(100% - 28px));
  }
}

/* --- v513 shell (site.css:1158) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
@media (max-width: 1024px) {
  .shell {
    width: min(100%, calc(100% - 32px));
    max-width: none;
  }
}

/* --- v518 shell (site.css:1283) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}
.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
}

/* --- v519 shell !important (site.css:1411) --- */
.shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad))) !important;
  max-width: var(--front-shell-max) !important;
}
.hero-slide-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad))) !important;
  max-width: var(--front-shell-max) !important;
}
@media (max-width: 1200px) {
  .shell, .hero-slide-shell {
    width: min(100%, calc(100% - 28px)) !important;
    max-width: none !important;
  }
}

/* --- public-body .shell 治理 (public-fix.css:12  + site.css:1743) --- */
.public-body .shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad)));
  max-width: var(--front-shell-max);
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}

@media (max-width: 900px) {
  .public-body .shell {
    padding-left: 16px;
    padding-right: 16px;
  }
}

.public-body .public-main .shell {
  width: 100% !important;
  max-width: none !important;
}

.public-body .public-main .shell .shell {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* --- public-body 容器: public-main、header、footer (public-fix.css:1726) --- */
.public-body .public-main {
  width: calc(100vw - var(--site-gutter) - var(--site-gutter));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

/* width/max-width controlled by public-fix.css */

/* --- 内部页面容器填充 (public-fix.css:1755) --- */
.public-body .public-main .public-page-shell,
.public-body .public-main .jhero,
.public-body .public-main .jtrust,
.public-body .public-main .jsec,
.public-body .public-main .jshell,
.public-body .public-main .home-panel,
.public-body .public-main .svc-hero-panel,
.public-body .public-main .product-detail-v30-section {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* --- 前台 shell 响应式 pad 调整 (site.css:5768) --- */
@media (max-width: 780px) {
  .public-body .shell,
  .public-body .hero-slide-shell {
    width: min(100%, calc(100% - var(--front-shell-pad)));
    max-width: none;
  }
}

/* --- header shell 最大宽度 (site.css:3332) --- */
.header-blueprint-shell {
  max-width: var(--front-shell-max);
}

/* --- 首页板块 shell 最大宽度 (site.css:3489) --- */
.home-capability-strip .shell,
.home-brand-wall .shell,
.home-services-reference .shell,
.home-procurement-hub .shell,
.market-insights-home .shell,
.home-bottom-inquiry-section .shell {
  max-width: var(--front-shell-max);
}

/* --- header 宽屏 (site.css:8510) --- */
@media (min-width: 1240px) {
  .site-header-blueprint .header-blueprint-shell {
    width: calc(100% - 64px) !important;
    max-width: var(--front-shell-max) !important;
    margin: 0 auto !important;
    padding: 12px 0 !important;
  }
}

/* --- section-card-shell (site.css:4840) --- */
.section-card-shell {
  width: 100%;
  padding: 0 60px;
  margin: 0 0 40px;
  box-sizing: border-box;
}

.section-card {
  max-width: var(--front-shell-max);
  width: 100%;
  margin: 0 auto;
}

/* --- 通用 section .shell (site.css:5955) --- */
.products-filter-clean-section .shell,
.insights-archive-section-v6 .shell,
.article-detail-section-v6 .shell,
.section .shell {
  max-width: var(--front-shell-max);
}

/* --- 产品归档 v24 shell (site.css:8008,8283) --- */
.product-detail-v24-shell {
  max-width: var(--front-shell-max);
  margin: 0 auto;
}

.product-detail-v24-shell {
  max-width: var(--front-shell-max) !important;
}

.product-detail-v24-section > .shell.product-detail-v24-shell,
.product-detail-v24-shell {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad))) !important;
  max-width: var(--front-shell-max) !important;
}

.product-detail-v24-section > .shell.product-breadcrumb-v20,
.product-breadcrumb-v20 {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad))) !important;
  max-width: var(--front-shell-max) !important;
}

@media (max-width: 1180px) {
  .product-detail-v24-section > .shell.product-detail-v24-shell,
  .product-detail-v24-shell,
  .product-detail-v24-section > .shell.product-breadcrumb-v20,
  .product-breadcrumb-v20 {
    width: min(100%, calc(100% - 28px)) !important;
    max-width: none !important;
  }
}

/* --- 最新 product-detail-v24 shell (site.css:8668) --- */
.product-detail-v24-section > .shell.product-detail-v24-shell,
.product-detail-v24-shell,
.product-detail-v24-section > .shell.product-breadcrumb-v20,
.product-breadcrumb-v20 {
  width: min(var(--front-shell-max), calc(100% - var(--front-shell-pad))) !important;
  max-width: var(--front-shell-max) !important;
}

/* --- header blueprint 搜索建议 (site.css:6139) --- */
.header-blueprint-top .header-search-blueprint {
  width: 100%;
  max-width: 860px;
}

/* --- 搜索建议面板 (site.css:8657) --- */
.header-search-suggest-panel {
  width: min(640px, calc(100vw - 48px)) !important;
  max-width: min(640px, calc(100vw - 48px)) !important;
}

/* --- 搜索 input 全宽 (site.css:9993) --- */
.site-header-blueprint .header-search-blueprint input {
  width: 100% !important;
  min-width: 0 !important;
}

/* --- 820 shell (site.css:353) --- */
@media (max-width: 820px) {
  .shell {
    width: min(100% - 28px, 1200px);
  }
}

/* --- 760 shell (site.css:589) --- */
@media (max-width: 760px) {
  .shell {
    width: min(100% - 24px, 100%);
  }
}



/* ========================================================================
   4. Section 宽度 / 间距规则
   ======================================================================== */

/* --- 基础 section (site.css:36) --- */
.section {
  padding: 72px 0;
}

/* --- 首页全宽板块 (site.css:3497) --- */
.home-capability-strip,
.home-brand-wall,
.home-services-reference,
.home-procurement-hub,
.market-insights-home,
.home-bottom-inquiry-section {
  position: relative;
}

/* --- dynamic-section 间距 (site.css:4038) --- */
.dynamic-section-fusion .shell {
  padding: 40px 0;
}

@media (max-width: 1200px) {
  .dynamic-section .shell {
    padding: 32px 0;
  }
}

/* --- public-body dynamic-section 治理 (public-fix.css:11) --- */
.public-body .dynamic-section {
  padding-top: 48px;
  padding-bottom: 48px;
}
.public-body .dynamic-section + .dynamic-section {
  padding-top: 0;
}

/* --- public-body 布局元素全宽 (site.css:5400) --- */
.public-body .form-layout,
.public-body .article-layout,
.public-body .product-detail-grid,
.public-body .detail-panels,
.public-body .products-topline,
.public-body .showcase-stack,
.public-body .service-summary-grid,
.public-body .insights-layout,
.public-body .story-grid {
  width: 100%;
  max-width: 100%;
}

/* --- 卡片全宽 (site.css:5617) --- */
.public-body .product-highlight-card,
.public-body .dynamic-image-card,
.public-body .post-grid-card,
.public-body .location-card,
.public-body .team-card,
.public-body .certificate-card,
.public-body .video-card,
.public-body .mini-product-card,
.public-body .filter-select-card,
.public-body .datasheet-brief-card {
  width: 100%;
}

/* --- filters-section 内部全宽 (site.css:5686) --- */
.public-body .filters-section .shell > .filter-bar,
.public-body .filters-section .shell > .products-topline,
.public-body .filters-section .shell > .breadcrumb-row {
  width: 100%;
}

/* --- 公共 body 内网格宽度 (site.css:5699) --- */
.public-body .post-grid,
.public-body .product-grid,
.public-body .card-grid-3,
.public-body .service-highlight-grid,
.public-body .industry-highlight-grid,
.public-body .quality-highlight-grid,
.public-body .product-highlight-grid,
.public-body .certificate-grid,
.public-body .video-showcase-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.public-body .logo-grid,
.public-body .card-grid-4,
.public-body .dynamic-image-card-grid,
.public-body .brand-showcase-grid,
.public-body .team-grid,
.public-body .location-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.public-body .card-grid-2,
.public-body .tag-grid,
.public-body .process-grid,
.public-body .detail-panels,
.public-body .showcase-stack,
.public-body .logo-ribbon-grid,
.public-body .media-statement-grid,
.public-body .service-summary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* --- 网格 1180 响应式 (site.css:5744) --- */
@media (max-width: 1180px) {
  .public-body .post-grid,
  .public-body .product-grid,
  .public-body .card-grid-3,
  .public-body .card-grid-4,
  .public-body .logo-grid,
  .public-body .dynamic-image-card-grid,
  .public-body .service-highlight-grid,
  .public-body .industry-highlight-grid,
  .public-body .quality-highlight-grid,
  .public-body .product-highlight-grid,
  .public-body .brand-showcase-grid,
  .public-body .video-showcase-grid,
  .public-body .team-grid,
  .public-body .location-grid,
  .public-body .certificate-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --- 网格 780 响应式 (site.css:5774) --- */
@media (max-width: 780px) {
  .public-body .post-grid,
  .public-body .product-grid,
  .public-body .card-grid-2,
  .public-body .card-grid-3,
  .public-body .card-grid-4,
  .public-body .logo-grid,
  .public-body .tag-grid,
  .public-body .dynamic-image-card-grid,
  .public-body .service-highlight-grid,
  .public-body .industry-highlight-grid,
  .public-body .quality-highlight-grid,
  .public-body .product-highlight-grid,
  .public-body .brand-showcase-grid,
  .public-body .video-showcase-grid,
  .public-body .team-grid,
  .public-body .location-grid,
  .public-body .certificate-grid,
  .public-body .process-grid,
  .public-body .detail-panels,
  .public-body .showcase-stack,
  .public-body .logo-ribbon-grid,
  .public-body .media-statement-grid,
  .public-body .service-summary-grid,
  .public-body .post-grid,
  .public-body .product-grid {
    grid-template-columns: 1fr;
  }
}

/* --- CTA 区域 padding (public-fix.css:43) --- */
.public-body .dynamic-section .cta-band,
.public-body .dynamic-section .dynamic-cta-band {
  padding: 28px 32px;
}

/* --- value-strip 卡片 padding (public-fix.css:51) --- */
.public-body .dynamic-section .value-strip-card {
  padding: 24px 28px;
}

/* --- 首页 entry-cards padding (public-fix.css:54) --- */
.public-body .dynamic-section-home-entry-cards .value-strip-points article {
  padding: 14px 16px !important;
}

/* --- section-head 间距 (public-fix.css:60) --- */
.public-body .home-category-stream-section .section-head,
.public-body .insights-section .section-head {
  margin-bottom: 14px;
}
.public-body .dynamic-section .section-head {
  margin-bottom: 18px;
}

/* --- 分类网格 (public-fix.css:69) --- */
.public-body .category-visual-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 1200px) {
  .public-body .category-visual-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .public-body .category-visual-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- 品牌 logo 墙 (public-fix.css:82) --- */
.public-body .brand-logo-wall-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 16px;
  align-items: center;
}

/* --- 能力卡片网格 (public-fix.css:108) --- */
.public-body .capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
@media (max-width: 980px) {
  .public-body .capability-grid { grid-template-columns: 1fr; }
}

/* --- CTA 横幅 (public-fix.css:132) --- */
.public-body .cta-banner-visual {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 32px 36px;
}
@media (max-width: 760px) {
  .public-body .cta-banner-visual { grid-template-columns: 1fr; }
}

/* --- hero 搜索条 (public-fix.css:174) --- */
.public-body .hero-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  max-width: 560px;
  margin: 8px 0 0;
  padding: 6px;
}

/* --- 流程步骤 (public-fix.css:206) --- */
.public-body .process-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
@media (max-width: 1100px) {
  .public-body .process-steps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .public-body .process-steps-grid { grid-template-columns: 1fr; }
}

/* --- 关于我们分类网格 (public-fix.css:1060 附近) --- */
.public-body .about-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
@media (max-width: 1100px) {
  .public-body .about-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .public-body .about-category-grid { grid-template-columns: 1fr; }
}

/* --- 标题 max-width 解除 (public-fix.css:23) --- */
.public-body .dynamic-section .section-head h2 {
  max-width: none;
}
.public-body .dynamic-section-buyer-panels .value-strip-copy h2,
.public-body .dynamic-section-clean-strip .value-strip-copy h2,
.public-body .dynamic-section-compact-callout .value-strip-copy h2 {
  max-width: none !important;
}
.public-body .dynamic-section-home-entry-cards .value-strip-copy h2 {
  max-width: none !important;
}



/* ========================================================================
   5. Product Detail 页面宽度/布局规则
   ======================================================================== */

/* --- product-detail-grid (site.css:216) --- */
.product-detail-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 24px;
}
.product-gallery-card {
  padding: 22px;
}
.product-gallery-main {
  overflow: hidden;
}
.product-gallery-main img {
  width: 100%;
}
.product-gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-top: 16px;
}
.product-summary-card {
  position: sticky;
  top: 104px;
  align-self: start;
}
.spec-grid-mini {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}

/* --- product-detail-grid-v2 (site.css:466) --- */
.product-hero-v2 {
  padding-top: 42px;
}
.product-detail-grid-v2 {
  grid-template-columns: 1.08fr .92fr;
  gap: 28px;
}

@media (max-width: 820px) {
  .product-detail-grid-v2 { grid-template-columns: 1fr; }
}

/* --- product-detail-grid-balanced (site.css:1822) --- */
.product-detail-grid-balanced {
  grid-template-columns: minmax(320px, .78fr) minmax(420px, 1.22fr);
  align-items: start;
}
.product-gallery-main-square {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
  padding: 22px;
}
.product-gallery-card-v54 .product-gallery-main-square img {
  width: 100%;
  height: 100%;
  max-width: 520px;
  max-height: 520px;
}
.product-gallery-thumbs-square {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.product-gallery-thumbs-square .thumb {
  width: 100%;
}

@media (max-width: 1180px) {
  .product-detail-grid-balanced { grid-template-columns: 1fr; }
  .product-gallery-main-square { padding: 16px; }
}

/* --- product-detail-grid-balanced 更新 (site.css:2364) --- */
.product-detail-grid-balanced {
  gap: 20px;
}
.product-gallery-card-compact {
  padding: 16px;
}
.product-gallery-main-square {
  padding: 10px;
}
.product-gallery-card-v54 .product-gallery-main-square img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
}
.product-gallery-thumbs-square {
  grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
  gap: 12px;
}
.product-summary-card-v2 {
  padding: 24px;
}

@media (max-width: 980px) {
  .product-gallery-main-square { padding: 8px; }
  .product-gallery-thumbs-square { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* --- product-detail-grid-balanced v517 (site.css:2613) --- */
.product-detail-grid-balanced {
  grid-template-columns: minmax(260px,.62fr) minmax(420px,1.38fr);
  gap: 18px;
}
.product-gallery-main-square {
  padding: 14px;
  max-width: 430px;
}
.product-gallery-card-v54 .product-gallery-main-square img {
  max-width: 380px;
  max-height: 380px;
}

@media (max-width: 980px) {
  .product-detail-grid-balanced,
  .merged-info-grid,
  .related-products-grid { grid-template-columns: 1fr; }
  .product-gallery-main-square { max-width: 360px; }
}

/* --- product-detail-grid-balanced v517 再更新 (site.css:2684) --- */
.product-gallery-card-v54 .product-gallery-main-square img {
  max-width: 320px;
  max-height: 320px;
}
.product-gallery-main-square {
  max-width: 360px;
  padding: 10px;
}
.product-detail-grid-balanced {
  grid-template-columns: minmax(240px,.5fr) minmax(420px,1.5fr);
}

/* --- product-detail-shell (site.css:2766) --- */
.product-detail-shell .product-gallery-card {
  max-width: 540px;
}
.product-gallery-main.square {
  max-height: 460px;
}
.product-detail-shell {
  grid-template-columns: minmax(280px,0.9fr) minmax(360px,1.1fr);
}
.merged-info-grid {
  display: grid;
  grid-template-columns: 1.25fr .95fr;
  gap: 16px;
  align-items: start;
}
.related-products-grid {
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 18px;
}

@media (max-width: 1280px) {
  .related-products-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .product-detail-shell,
  .merged-info-grid,
  .related-products-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .product-detail-shell,
  .merged-info-grid,
  .related-products-grid { grid-template-columns: 1fr; }
}

/* --- product-detail-grid-balanced v18 (site.css:6952) --- */
.product-detail-grid-balanced {
  grid-template-columns: minmax(380px,520px) minmax(0,1fr);
  gap: 28px;
  align-items: start;
}
.product-summary-card-stacked {
  padding: 28px;
}
.product-support-strip {
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}
.product-inline-inquiry-shell-v6 {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
  gap: 26px;
  align-items: start;
}

@media (max-width: 1180px) {
  .product-detail-grid-balanced,
  .product-inline-inquiry-shell-v6 { grid-template-columns: 1fr; }
  .product-support-strip { grid-template-columns: 1fr; }
}

/* --- v24 product-detail-hero (site.css:7248) --- */
.product-detail-v24-section {
  padding-top: 18px;
  padding-bottom: 44px;
}
.product-detail-v24-shell {
  display: grid;
  gap: 22px;
}
.product-detail-v24-hero {
  display: grid;
  grid-template-columns: 320px minmax(0,1fr) 240px;
  gap: 20px;
  align-items: start;
  padding: 24px;
}
.product-detail-v24-main-image {
  height: 320px;
}
.product-detail-v24-thumbs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}
.product-v24-specgrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}

.product-detail-v24-copy h1 {
  max-width: 16ch;
}
.product-v24-desc {
  max-width: 66ch;
}

/* --- v24 product-detail-hero 覆盖 (site.css:8284) --- */
.product-detail-v24-hero {
  grid-template-columns: 260px minmax(0,1fr) 240px !important;
  gap: 20px !important;
  padding: 24px !important;
}
.product-v24-specgrid {
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 10px !important;
}

/* --- v27 attributes layout (site.css:8304) --- */
.product-v27-attributes-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
  gap: 20px;
  align-items: start;
}
.product-v27-attribute-card {
  padding: 20px;
}
.product-v27-section-head p {
  max-width: 720px;
}

/* --- v24 hero 最新覆盖 (site.css:8460) --- */
.product-detail-v24-hero {
  grid-template-columns: 320px minmax(0,1fr) 280px !important;
  gap: 24px !important;
}
.product-detail-v24-main-image {
  height: 330px !important;
}
.product-v24-specgrid {
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
}
.product-v27-attributes-layout {
  grid-template-columns: minmax(0,1.7fr) minmax(320px,.65fr) !important;
}
.product-v27-attribute-table {
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
}
.product-v24-dual {
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
}
.related-products-v24-grid {
  grid-template-columns: repeat(6, minmax(0,1fr)) !important;
}

@media (max-width: 1180px) {
  .product-detail-v24-hero { grid-template-columns: 280px minmax(0,1fr) !important; }
  .product-v27-attributes-layout { grid-template-columns: 1fr !important; }
  .product-v27-attribute-table { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .related-products-v24-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
}

@media (max-width: 900px) {
  .product-detail-v24-hero,
  .product-v24-specgrid,
  .product-v27-attribute-table,
  .product-v24-dual,
  .related-products-v24-grid { grid-template-columns: 1fr !important; }
}

/* --- v27.6 hero (site.css:8675) --- */
.product-detail-v24-hero {
  grid-template-columns: 320px minmax(0,1fr) 280px !important;
  align-items: stretch !important;
  min-height: 445px !important;
}
.product-v24-specgrid {
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
}

/* --- product-detail-grid balanced v27(area) (site.css:2663) --- */
.product-detail-grid > *,
.detail-panels > * {
  min-width: 0;
}

/* --- public-body product-detail-grid 行/列 (site.css:5679) --- */
.public-body .product-detail-grid,
.public-body .article-layout,
.public-body .form-layout,
.public-body .detail-panels {
  gap: 24px;
}

.public-body .article-layout,
.public-body .product-detail-grid,
.public-body .form-layout,
.public-body .detail-panels.wider-left {
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
}

@media (max-width: 1180px) {
  .public-body .article-layout,
  .public-body .product-detail-grid,
  .public-body .form-layout,
  .public-body .detail-panels.wider-left,
  .public-body .market-insights-layout {
    grid-template-columns: 1fr;
  }
}

/* --- product-detail-grid 内子元素 (site.css:5601) --- */
.public-body .product-detail-grid > *,
.public-body .detail-panels > * {
  min-width: 0;
}

/* --- product gallery images (site.css:5271) --- */
.product-gallery-main img,
.product-gallery-main-square img {
  width: 100%;
  max-height: 420px;
  padding: 14px;
}

@media (max-width: 760px) {
  .product-gallery-main img,
  .product-gallery-main-square img {
    max-height: 300px;
  }
}

/* --- 产品归档 v24 外壳 (site.css:7215) --- */
.product-archive-v24-shell {
  display: grid;
  grid-template-columns: 280px minmax(0,1fr);
  gap: 22px;
  align-items: start;
}
.product-card-grid-v24 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
}

/* --- 产品 banner v24 (site.css:7209) --- */
.products-banner-section-v24 .products-hero-v24-grid {
  grid-template-columns: minmax(0,1fr) 320px;
  gap: 24px;
  align-items: center;
}

.products-banner-section-v24 .inner-page-banner-copy h1 {
  max-width: 12ch;
}
.products-banner-section-v24 .inner-page-banner-copy .hero-text {
  max-width: 54ch;
}

/* --- v20 product detail hero (site.css:7205) --- */
@media (max-width: 1180px) {
  .product-detail-v20-hero { grid-template-columns: 320px minmax(0,1fr); }
  .product-detail-v20-side { grid-column: 1/-1; grid-template-columns: 1fr 1fr; }
  .product-v20-inquiry-section { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .product-detail-v20-hero { grid-template-columns: 1fr; }
  .product-detail-v20-main-image { height: 300px; }
  .product-v20-keyfact,
  .product-v20-spec-table .spec-row { grid-template-columns: 1fr; }
  .product-v20-dual { grid-template-columns: 1fr; }
}



/* ========================================================================
   6. 响应式 / Mobile 宽度调整
   ======================================================================== */

/* --- 1180px 广泛响应 (site.css:343) --- */
@media (max-width: 1180px) {
  .card-grid-5, .card-grid-4, .card-grid-3, .product-grid, .post-grid, .process-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .product-detail-grid, .page-hero-grid, .hero-slide, .form-layout, .article-layout,
  .detail-panels, .detail-panels.wider-left, .footer-grid, .intro-grid, .story-grid,
  .admin-grid-two, .dual-grid {
    grid-template-columns: 1fr;
  }
  .kpi-grid {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
  .filter-bar {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .admin-layout {
    grid-template-columns: 1fr;
  }
}

/* --- 820px 响应 (site.css:353) --- */
@media (max-width: 820px) {
  .hero-stats, .product-grid, .post-grid, .card-grid-3, .card-grid-4, .card-grid-5,
  .process-grid, .logo-grid, .tag-grid, .quote-box, .spec-grid-mini,
  .form-grid.two, .form-grid.three, .form-grid.four, .filter-bar, .kpi-grid, .compact-kpi {
    grid-template-columns: 1fr;
  }
  .footer-bottom, .cta-band, .products-topline, .section-head, .admin-topbar {
    flex-direction: column;
    align-items: start;
  }
  .hero-slider {
    padding-top: 52px;
  }
  .admin-main {
    padding: 20px;
  }
}

/* --- 760px 响应 (site.css:589) --- */
@media (max-width: 760px) {
  .hero-stats, .intro-band-points, .card-grid-4, .card-grid-3, .card-grid-2,
  .logo-grid-compact, .tag-grid, .product-grid, .archive-grid-v54, .media-grid-v54,
  .trust-strip-v54 .trust-strip, .portfolio-grid-v54 {
    grid-template-columns: 1fr;
  }
  .filter-bar, .filter-bar-v54 {
    grid-template-columns: 1fr;
  }
  .footer-grid {
    grid-template-columns: 1fr;
  }
}

/* --- 580px 通用响应 (site.css:580) --- */
@media (max-width: 580px) {
  .hero-slide { grid-template-columns: 1fr; min-height: auto; }
  .hero-slide-visual.full-bleed-visual img { width: 100%; min-height: 320px; }
  .trust-strip-v54 .trust-strip, .portfolio-grid-v54,
  .archive-grid-v54, .media-grid-v54 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .intro-band-grid, .dual-grid, .page-hero-grid,
  .product-detail-grid, .detail-panels, .detail-panels.wider-left {
    grid-template-columns: 1fr;
  }
}

/* --- 1100px 通用响应 (site.css:671,746) --- */
@media (max-width: 1100px) {
  .archive-layout-v55, .support-strip-grid, .page-card-grid,
  .banner-card-grid, .media-grid-v54 {
    grid-template-columns: 1fr;
  }
  .archive-sidebar-v55 { position: static; }
  .archive-grid-v55 { grid-template-columns: 1fr; }
  .compact-stats-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .inner-hero-metrics { grid-template-columns: 1fr; }
}

/* --- 1024px 响应 (site.css:1118,1160) --- */
@media (max-width: 1024px) {
  .shell { width: min(100%, calc(100% - 32px)); max-width: none; }
  .header-inner-v511, .service-card-grid-v511, .trust-strip-points,
  .category-browser-wrap-v511, .filter-primary-row-v511,
  .filter-select-grid-v511, .archive-grid-v511, .category-admin-groups {
    grid-template-columns: 1fr;
  }
  .header-search-v511 { min-width: 0; width: 100%; }
}

/* --- 1200px 网格响应 (site.css:2976) --- */
@media (max-width: 1200px) {
  .capability-strip-grid,
  .post-grid-home-insights { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .service-reference-grid { grid-template-columns: 1fr; }
  .procurement-hub-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 760px) {
  .capability-strip-grid,
  .procurement-hub-grid,
  .post-grid-home-insights { grid-template-columns: 1fr; }
}

/* --- 1600/1400 响应 (site.css:1108,1111) --- */
@media (max-width: 1600px) {
  .archive-grid-v511 { grid-template-columns: repeat(5, minmax(0,1fr)); }
}

@media (max-width: 1400px) {
  .header-inner-v511 { grid-template-columns: auto 1fr; }
  .site-nav-v511 { grid-column: 1 / -1; }
  .trust-strip-v511 { grid-template-columns: 1fr; }
  .trust-strip-points { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .category-browser-wrap-v511, .filter-select-grid-v511,
  .category-admin-groups, .archive-grid-v511 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

/* --- 860px 移动端 header (public-fix.css:1628) --- */
@media (max-width: 860px) {
  .header-blueprint-top {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
  }
  .header-search-blueprint {
    max-width: none;
  }
}

/* --- 600px 品牌展示 (site.css:4830) --- */
@media (max-width: 600px) {
  .brand-showcase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --- 980px product 浮动导航 (site.css:9637) --- */
@media (max-width: 980px) {
  .product-side-floatnav {
    overflow-x: auto;
    padding: 12px 0;
  }
}

/* --- v715 inner-banner 1180 响应 (site.css:6119) --- */
@media (max-width: 1180px) {
  .inner-page-banner-grid {
    grid-template-columns: minmax(0,1fr) minmax(280px,320px);
  }
}

@media (max-width: 900px) {
  .inner-page-banner-grid {
    grid-template-columns: 1fr;
    padding: 24px 18px 22px;
    gap: 18px;
  }
  .inner-page-banner-copy h1 {
    max-width: 100% !important;
  }
  .inner-page-banner-side {
    justify-content: flex-start;
  }
  .inner-page-banner-metrics {
    grid-template-columns: 1fr;
  }
}

/* --- 720px banner 紧凑 (site.css:6056) --- */
@media (max-width: 720px) {
  .inner-page-banner-section { padding-top: 14px; }
  .inner-page-banner-card { min-height: var(--page-hero-height-mobile, 440px); }
  .inner-page-banner-grid { padding: 24px 18px 22px; gap: 18px; }

  .inner-page-banner-copy,
  .inner-page-banner-copy .hero-text,
  .inner-page-banner-copy h1,
  .inner-page-banner-metrics {
    width: 100%;
    max-width: 100%;
  }
  .inner-page-banner-copy h1 { max-width: 100%; }
  .inner-page-banner-side { justify-content: flex-start; }
  .inner-page-banner-metrics { grid-template-columns: 1fr; }
}

/* --- 980px 内页banner (site.css:6038) --- */
@media (max-width: 980px) {
  .inner-page-banner-card { min-height: auto; height: auto; }
  .inner-page-banner-grid {
    grid-template-columns: 1fr;
    min-height: auto;
    height: auto;
    padding-bottom: 32px;
  }
  .inner-page-banner-copy,
  .inner-page-banner-copy .hero-text,
  .inner-page-banner-copy h1,
  .inner-page-banner-metrics {
    width: 100%;
    max-width: 100%;
  }
  .inner-page-banner-copy h1 { max-width: 100%; }
  .inner-page-banner-side { justify-content: flex-start; }
  .inner-page-banner-metrics { grid-template-columns: 1fr; }
}



/* ========================================================================
   7. overflow-x / box-sizing 全局规则
   ======================================================================== */

* { box-sizing: border-box; }

main { overflow: clip; }

/* --- overflow-x auto 滚动容器 --- */
.mini-product-slider-clean {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.comparison-table-wrap {
  overflow-x: auto;
}

.related-products-v24-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 6px;
}

@media (max-width: 980px) {
  .product-side-floatnav {
    overflow-x: auto;
    padding: 12px 0;
  }
}

/* --- 文章相关产品行 (public-fix.css:1246) --- */
.article-v30-related-products-row {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 8px;
}
.article-v30-related-product-card {
  flex: 0 0 180px;
}

/* --- post-slider (site.css:382) --- */
.post-slider-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 1fr);
  gap: 22px;
  overflow: auto;
  padding-bottom: 8px;
  scroll-snap-type: x mandatory;
}