@media screen and (max-width: 768px) {
  .logo img {
    max-width: 100px;
  }
  .logo {
    width: 75%;
  }
  .hero {
    padding: 0;
  }
  .hero-swiper .hc-nav {
    display: none;
  }
  .home.why-section .why-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .why-grid .why-icon {
    width: 50px;
  }
  .why-item {
    padding: 20px 10px;
  }
  .cat-section .sec-title {
    font-size: 26px;
  }
  .cat-card .card-link {
    padding: 7px 9px;
  }
  .cat-card .card-link {
    font-size: 12px;
  }
  .card-body h3 {
    font-size: 14px;
  }
  .blog-section .sec-title {
    font-size: 26px;
  }
  .post-grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .nav .has-sub {
    position: relative;
    width: 100%;
    min-width: 0;
  }
  .nav .has-sub > a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding-right: 76px; /* 给右端箭头留位 */
    border-bottom: 1px solid var(--line);
  }
  /* 子菜单：max-height 动画（收起无空白；不要用 grid 0fr，6 个直接子元素只压首行会留白） */
  .nav .has-sub .sub {
    position: static;
    display: block;
    width: 100%;
    min-width: 0;
    max-height: 0;
    box-shadow: none;
    overflow: hidden;
    background: var(--bg-gray);
    margin: 0;
    padding: 0;
    opacity: 0;
    transition: max-height 0.32s ease, opacity 0.26s ease, padding 0.32s ease;
  }
  .nav .has-sub .sub a {
    border-bottom: none;
    font-size: 15px;
    padding: 11px 24px 11px 40px;
    width: auto;
    box-sizing: border-box;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  .nav .has-sub:hover .sub {
    max-height: 0;
    opacity: 0;
  } /* 移动端禁 hover 展开 */
  .nav .has-sub.expanded .sub {
    max-height: 480px;
    opacity: 1;
    padding: 6px 0;
  }
  /* 箭头：绝对定位固定在 Products 行右端 */
  .nav .nav-arrow {
    position: absolute;
    right: 0;
    top: 0;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    margin: 0;
    font-size: 17px;
  }
  .nav .nav-cta {
    width: 50%;
  }
  .about-hero-copy h1 {
    font-size: 26px;
  }
  .about-hero-copy {
    max-width: 100%;
    padding: 20px 0;
  }
  .about-hero {
    min-height: 500px;
  }
  .mfg-split {
    grid-template-columns: none;
  }
  .steps-grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .about-why .why-icon img {
    max-width: 50px;
  }
  .why-item h3 {
    font-size: 16px;
  }
  .why-item p {
    font-size: 14px;
  }
  .shop-main .product-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quote-btn {
    font-size: 11px;
  }
  .pd-gallery {
    width: 100%;
  }
  .pd-gallery .main {
    width: 100%;
  }
  .pd-feat {
    text-align: center;
    justify-content: center;
    flex-wrap: wrap;
  }
  .rel-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .svc-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .svc-caps {
    grid-template-columns: repeat(1, 1fr);
  }
  .svc-whys {
    grid-template-columns: repeat(2, 1fr);
  }
  .svc-why-ic img {
    max-width: 50px;
  }
  .blog-layout2 .blog-side {
    display: none;
  }
  .blog-grid3 {
    grid-template-columns: repeat(1, 1fr);
  }
  .blog-layout2 {
    gap: 0;
    grid-template-columns: 1fr;
  }
  .contact-layout {
    display: block;
  }
}