@charset "UTF-8";
/* ==========================================================================
   盛塑邦塑化 · 版面编排与响应式
   文件：css/pages.css —— 各页面区块组合 / 断点适配
   ========================================================================== */

/* ==========================================================================
   一、首页
   ========================================================================== */

/* 品牌资源 */
.brandsec { background: var(--paper); padding-block: clamp(48px, 6vw, 88px); }
.brandsec .sec-head { margin-bottom: clamp(24px, 3vw, 44px); }

/* 产品矩阵 */
.prodsec { padding-block: clamp(52px, 6.4vw, 96px); }
.prodsec .sec-head { margin-bottom: clamp(24px, 2.8vw, 40px); }

/* 物流配送 */
.logisec { padding-block: clamp(48px, 5vw, 72px); }
.logisec .sec-head { margin-bottom: clamp(24px, 2.6vw, 40px); }
.logisec__body { display: flex; flex-direction: column; gap: clamp(28px, 3vw, 44px); }

/* 应用领域 */
.appsec { padding-block: clamp(52px, 6.4vw, 96px); }

/* 仓储 */
.whsec { background: var(--paper); padding: 0 0 72px; }
.wh__banner { height: clamp(280px, 23.6vw, 340px); border-radius: 0; }
.wh__overlay { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; }
.wh__overlay .wrap { display: flex; align-items: center; justify-content: space-between; gap: 40px; width: 100%; }
.wh__copy { position: static; transform: none; }
.wh__stats { position: static; transform: none; margin-left: auto; }
.wh__cards-wrap { padding-top: 32px; }

/* ==========================================================================
   二、产品中心
   ========================================================================== */
.catalog__head { padding-top: 56px; }

/* ==========================================================================
   三、新闻中心
   ========================================================================== */
.newshead { padding-top: 56px; }
.newsfeat { padding-bottom: 56px; }

/* ==========================================================================
   四、关于我们
   ========================================================================== */
.aboutintro { padding-block: clamp(48px, 5.6vw, 80px); }
.aboutcap { padding-block: clamp(48px, 5.6vw, 80px); }
.aboutvisit { padding-block: clamp(44px, 5vw, 72px); }

/* ==========================================================================
   五、联系我们
   ========================================================================== */
.contactbody { padding-block: clamp(44px, 4.6vw, 64px); }

/* ==========================================================================
   六、响应式
   ========================================================================== */

/* —— 1240：收紧栅格 —— */
@media (max-width: 1240px) {
  :root { --pad-x: clamp(76px, 5.55vw, 80px); }
  .rail { left: 0; }
  .apps { grid-template-columns: minmax(0, 1fr) 400px; }
  .intro { grid-template-columns: minmax(0, 1fr) 340px; }
  .cbody { grid-template-columns: minmax(0, 1fr) 400px; }
  .visit { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .gtable__head,
  .grow { grid-template-columns: 170px minmax(0, 1fr) 140px 80px 60px; }
  .rrow { grid-template-columns: 130px 80px minmax(100px, 1fr) 260px; }
}

/* —— 1080：双栏改单栏 —— */
@media (max-width: 1080px) {
  .sec-head { flex-direction: column; gap: 16px; }
  .sec-head__aside { margin-top: 0; white-space: normal; }

  /* 单栏：标题 → 大图 → 行业列表，避免 order 把标题挤到大图下方 */
  .apps { display: flex; flex-direction: column; align-items: stretch; gap: 26px; }
  .apps__left { display: contents; }
  .apps .sec-head { order: 1; }
  /* 竖版场景图（480/600）由 .apps__shots 自身控制比例，此处只限宽居中 */
  .apps__media { order: 2; width: 100%; max-width: 520px; margin-inline: auto; }
  .alist { order: 3; }

  .intro { grid-template-columns: minmax(0, 1fr); }
  .stats { flex-direction: row; flex-wrap: wrap; }
  .stat { flex: 1 1 180px; }

  .visit { grid-template-columns: minmax(0, 1fr); }
  .visit__media { aspect-ratio: 16 / 9; }

  .cbody { grid-template-columns: minmax(0, 1fr); }
  .qrcard { align-items: flex-start; }
  .qrcard__head,
  .qrnote { max-width: 460px; }

  .cap { grid-template-columns: repeat(2, 1fr); gap: 24px 28px; }

  .catalog { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-block: 40px 64px; }
  .catalog__aside { flex-direction: column; }
  .matlist { flex-direction: row; overflow-x: auto; scrollbar-width: none; }
  .matlist::-webkit-scrollbar { display: none; }
  .mat {
    flex: none;
    grid-template-columns: auto auto;
    gap: 8px;
    height: auto;
    padding: 12px 16px;
    min-width: 116px;
    white-space: nowrap;
  }
  .mat span { display: none; }
  .assist { display: none; }

  .bgrid { grid-template-columns: repeat(3, 1fr); }
  .brandcards { grid-template-columns: repeat(3, 1fr); }
  .feature { grid-template-columns: minmax(0, 1fr); }
  .feature__media { aspect-ratio: 16 / 9; }

  .wh__overlay .wrap { flex-direction: column; align-items: flex-start; justify-content: center; gap: 22px; }
  .wh__stats { margin-left: 0; }
  .wh__cards { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .wcard:nth-child(even) { margin-top: 0; }

  .cta__inner { flex-direction: column; align-items: flex-start; }
}

/* —— 900：移动端导航 / 悬浮条改为底栏 —— */
@media (max-width: 900px) {
  :root { --nav-h: 68px; --pad-x: clamp(20px, 5.55vw, 80px); }

  .topbar { display: none; }

  .nav__menu,
  .nav__cta { display: none; }
  .nav__burger { display: flex; }
  .brand__logo { width: 142px; height: 40px; }

  .hero { height: clamp(520px, 92vh, 660px); }
  .hero__inner { align-items: flex-end; padding-block: 0 118px; }
  .hero__desc { font-size: 14px; }
  .hero__params { display: none; }
  .hero__dots { bottom: 26px; }

  .rrow { grid-template-columns: 1fr auto; gap: 8px 16px; padding-block: 16px; }
  .rrow__region { grid-column: 1; grid-row: 1; }
  .rrow__h { grid-column: 2; grid-row: 1; text-align: right; font-size: 20px; }
  .rrow__bar { grid-column: 1 / -1; grid-row: 2; }
  .rrow__note { grid-column: 1 / -1; grid-row: 3; font-size: 10px; }

  .steps { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  .pgrid .prow { flex-direction: column; }
  .pcard--lead { min-height: 0; flex: 0 0 auto; }
  .pcol { flex: 1 1 auto; }
  .pcard--row { flex: 0 0 auto; }
  .pcard--wide { flex-direction: column; }

  .rail {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    transform: none;
    flex-direction: row;
    gap: 1px;
    padding: 1px;
    padding-bottom: max(1px, env(safe-area-inset-bottom));
    border-radius: 0;
    box-shadow: 0 -10px 30px -20px rgba(6, 26, 56, 0.7);
  }
  .rail__item { flex: 1; height: 62px; border-radius: 0 !important; }
  .rail__item:last-child { display: none; }
  .rail__item svg { width: 20px; height: 20px; }
  .rail__item i { font-size: 11px; }
  .rail__tip { display: none; }
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }

  .footer { padding-block: 52px; }
  .footer__main { gap: 32px; }
  .footer__brand { width: 100%; }
  .footer__col { width: 45%; }
  .footer__col--wide { width: 100%; }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: 8px; }

  .catalog__head { padding-top: 40px; }
  .newshead { padding-top: 40px; }
}

/* —— 760：卡片与表格重排 —— */
@media (max-width: 760px) {
  body { font-size: 13px; }

  .hero { height: clamp(500px, 88vh, 620px); }
  .hero__title { font-size: clamp(28px, 8vw, 40px); }
  .hero__eyebrow { font-size: 10px; gap: 8px; flex-wrap: wrap; }
  .hero__actions { gap: 16px; }
  .hero__actions .btn { padding: 14px 22px; }
  .hero__dot { width: 30px; }

  .mband__inner { height: 56px; gap: 18px; }

  .bgrid { grid-template-columns: repeat(2, 1fr); }
  .bcell { padding: 18px; }
  .bcell b { font-size: 15px; }

  .pcard,
  .pcard--row { padding: 22px; }
  .pcard--lead { min-height: 0; }
  .pcard--lead .pname { font-size: 38px; }
  .pdesc { font-size: 13px; }
  .pmeta { flex-wrap: wrap; gap: 14px 0; padding-top: 18px; }
  .pmeta__item + .pmeta__item { margin-left: 18px; padding-left: 18px; }
  .pmeta__v { font-size: 14px; }

  .ruler { border-inline: 0; }
  .steps { grid-template-columns: 1fr; gap: 20px; }

  .arow {
    grid-template-columns: 64px minmax(0, 1fr) 16px;
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 2px;
    height: auto;
    padding: 14px 16px;
  }
  .arow:hover { padding-left: 16px; }
  .arow__thumb { grid-column: 1; grid-row: 1 / span 2; width: 64px; height: 46px; }
  .arow__no { display: none; }
  .arow__name { grid-column: 2; grid-row: 1; font-size: 15px; }
  .arow__tags { grid-column: 2; grid-row: 2; font-size: 11px; }
  .arow__arrow { grid-column: 3; grid-row: 1 / span 2; }

  .apps__media { max-width: 420px; }

  .wh__cards { grid-template-columns: repeat(2, 1fr); }
  .whsec { padding-bottom: 48px; }
  .wcard { height: 168px; padding: 16px; }
  .wcard__city { font-size: 19px; }

  .cta__inner { padding-block: 48px; }
  .cta__tel { font-size: 22px; }

  .brandcards { grid-template-columns: repeat(2, 1fr); }
  .bcard { height: 88px; padding: 13px 14px; gap: 8px; }
  .bcard__logo { height: 21px; }
  .bcard .bcard__mark { font-size: 15px; line-height: 21px; }
  .panel__head { flex-direction: column; align-items: flex-start; gap: 8px; }

  .search__box { height: 48px; padding-inline: 13px; gap: 10px; }
  .search__input { font-size: 13px; }
  .search__input::placeholder { font-size: 12px; }
  .search__hint { display: none; }
  .search__panel { max-height: 320px; }
  .sres { grid-template-columns: 56px minmax(0, 1fr) 12px; gap: 10px; padding: 10px 12px; }
  .sres__main { font-size: 12.5px; }

  .gtable { border: 0; }
  .gtable__head { display: none; }
  .glist { display: flex; flex-direction: column; gap: 10px; background: transparent; }
  .grow {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-auto-rows: auto;
    gap: 4px 12px;
    height: auto;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-top: 1px solid var(--line);
    border-radius: var(--radius);
  }
  .grow__name { grid-column: 1; grid-row: 1; font-size: 14px; }
  .grow__stock { grid-column: 2; grid-row: 1; }
  .grow__prop { grid-column: 1 / -1; grid-row: 2; }
  .grow__app { grid-column: 1; grid-row: 3; font-size: 10px; }
  .grow__doc { grid-column: 2; grid-row: 3; }

  .gradebar { height: auto; padding-block: 10px; flex-wrap: wrap; gap: 4px 12px; }

  .nrow {
    grid-template-columns: 96px minmax(0, 1fr) 15px;
    grid-template-rows: auto auto;
    height: auto;
    padding-block: 16px;
    row-gap: 2px;
  }
  .nrow__date { grid-column: 1; grid-row: 1; font-size: 10px; }
  .nrow__cat { grid-column: 1; grid-row: 2; font-size: 10px; }
  .nrow__title { grid-column: 2; grid-row: 1 / span 2; font-size: 13px; line-height: 1.6; }
  .nrow__arrow { grid-column: 3; grid-row: 1 / span 2; }

  .stats { flex-direction: column; }
  .cap { grid-template-columns: 1fr; }

  .crow { padding: 18px; }
  .crow__val { font-size: 16px; }
  .crow__val--tel { font-size: 19px; }
  .qrcard { padding: 24px; }
  .qrtile { width: 100%; max-width: 260px; height: auto; aspect-ratio: 1; }

  .footer__word { margin-top: 32px; }
  .footer__col { width: 100%; }
}

/* —— 520：进一步压缩 —— */
@media (max-width: 520px) {
  .wrap { padding-inline: 18px; }
  .sec-head { gap: 12px; }
  .pcard--lead .pname { font-size: 34px; }
  .pname { font-size: 24px; }
  .wh__cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .wh__stats { gap: 20px; flex-wrap: wrap; }
  .wh__stat b { font-size: 18px; }
  .bgrid { grid-template-columns: 1fr 1fr; }
  .brandcards { grid-template-columns: 1fr 1fr; }
  .arow__tags { display: none; }
  .arow { grid-template-columns: 56px minmax(0, 1fr) 16px; grid-template-rows: auto; }
  .arow__thumb { grid-row: 1; width: 56px; height: 40px; }
  .hero__actions .tlink { font-size: 12px; }
  .catalog { padding-block: 28px 48px; }
}

/* —— 横屏手机：首屏别过高 —— */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { height: 460px; }
  .hero__inner { padding-block: 0 80px; }
}

/* —— 大屏：内容居中留白 —— */
@media (min-width: 1600px) {
  .hero__media img { object-position: 70% center; }
}