/* ===== product 页面基础样式（响应式） ===== */

/* 覆盖 style.css 中 group_1 的固定宽度 */
.group_1 {
  width: 100%;
  max-width: 15.6rem;
}

/* box_1 保留作为背景容器的备用 */
.box_1 {
  height: 4.97rem;
  background: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/16df227c87564aeaae09aae311d30073_mergeImage.png) 100% no-repeat;
  background-size: 100% 100%;
}

.box_32 {
  width: 100%;
  max-width: 19.2rem;
  margin: 0 auto 0.01rem;
  padding: 0 5%;
  box-sizing: border-box;
}

/* 主布局：左侧边栏 + 右侧网格 */
.section_1 {
  width: 100%;
  max-width: 15.6rem;
  margin: 0.3rem auto;
  align-items: flex-start;
  display: flex;
  gap: 0.6rem;
}

/* ===== 左侧边栏 ===== */
.box_3 {
  background-color: rgba(255, 255, 255, 0.008);
  border-radius: 0.2rem;
  width: 26%;
  max-width: 4.2rem;
  min-width: 2.4rem;
  flex-shrink: 0;
  border: 0.01rem solid rgba(217, 196, 118, 0.2);
  box-sizing: border-box;
  padding: 0.3rem;
}

.group_5 {
  width: 100%;
}

.text_11 {
  overflow-wrap: break-word;
  color: rgba(217, 196, 118, 1);
  font-size: 0.26rem;
  font-weight: normal;
  line-height: 0.32rem;
}

.image-wrapper_1 {
  background-color: rgba(217, 196, 118, 1);
  border-radius: 50%;
  height: 0.44rem;
  width: 0.44rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.thumbnail_2 {
  width: 0.14rem;
  height: 0.14rem;
}

.box_5 {
  width: 100%;
  border: 0.01rem solid rgba(217, 196, 118, 0.2);
  margin: 0.2rem auto;
}

.group_6 {
  width: 100%;
  margin: 0;
}
.group_6 a {
  align-items: center;
  gap: 0.1rem;
}
.text_12 {
  width: 3.1rem;
  min-width: 0;
  color: rgba(217, 196, 118, 1);
  font-size: 0.2rem;
  font-family: AlibabaPuHuiTi_2_65_Medium;
  font-weight: normal;
  text-align: left;
  line-height: 0.3rem;
  opacity: 0.5;
}

.thumbnail_3 {
  width: 0.14rem;
  height: 0.14rem;
  flex-shrink: 0;
}

/* ===== 右侧产品网格 ===== */
.grid_2 {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.list-items_1-0 {
  background: url(../images/product_list_bg.jpg) no-repeat center/cover;
  border-radius: 0.2rem;
  width: calc(50% - 0.3rem);
  aspect-ratio: 5.1 / 5.4;
  border: 0.01rem solid rgba(51, 50, 48, 1);
  margin: 0 0.6rem 0.6rem 0;
  box-sizing: border-box;
}
.list-items_1-0:nth-child(2n) {
  margin-right: 0;
}
.list-items_1-0 a {
  padding: 0.3rem;
  height: 100%;
  box-sizing: border-box;
}

.text_21-0 {
  overflow-wrap: break-word;
  color: rgba(217, 196, 118, 1);
  font-size: 0.26rem;
  font-weight: normal;
  text-align: center;
  line-height: 0.32rem;
  margin: 0.1rem auto;
  width: 100%;
}

.text_22-0 {
  color: rgba(217, 196, 118, 1);
  font-size: 0.16rem;
  height: 0.24rem;
  line-height: 0.24rem;
  margin: 0.2rem auto;
  width: 100%;
  text-align: center;
  font-weight: lighter;
  opacity: 0.5;
  font-family: AlibabaPuHuiTi_2_65_Medium;
}

.image-wrapper_1-0 {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  height: 3.6rem;
}
.image-wrapper_1-0 > .image_2-3 {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.image-wrapper_2-0 {
  background-color: rgba(217, 196, 118, 1);
  border-radius: 50%;
  height: 0.7rem;
  width: 0.7rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: ease-in-out 0.3s;
  opacity: 0;
}

.label_1-0 {
  width: 0.21rem;
  height: 0.21rem;
  margin: 0.25rem 0 0 0.25rem;
}

.list-items_1-0:hover .image-wrapper_2-0 {
  opacity: 1;
  transition: ease-in-out 0.3s;
}


/* ==============================================
          产品分类右侧面包屑（可能存在的其他样式）
   ============================================== */
.group_4 {
  width: 15.62rem;
  height: 0.78rem;
  margin: 2.89rem 0 0 1.79rem;
}
.thumbnail_1 {
  width: 0.14rem;
  height: 0.14rem;
  margin: 0.63rem 0 0 10.23rem;
}
.text-wrapper_12 {
  width: 2.9rem;
  height: 0.2rem;
  margin: 0.39rem 0 0.71rem 1.8rem;
}
.text_10 {
  width: 2.9rem;
  height: 0.2rem;
  overflow-wrap: break-word;
  color: rgba(255, 255, 255, 1);
  font-size: 0.2rem;
  font-family: AlibabaPuHuiTi_2_65_Medium;
  font-weight: normal;
  text-align: justifyLeft;
  white-space: nowrap;
  line-height: 0.32rem;
}

/* ============================================== */

/* ===== ≤1200px：缩小间距和字号 ===== */
@media screen and (max-width: 1200px) {
  .box_32 { padding: 0 4%; }
  .section_1 { gap: 0.4rem; margin-top: 0.2rem; }

  .box_3 {
    width: 28%;
    min-width: 2rem;
    padding: 0.2rem;
  }
  .text_11 { font-size: 0.22rem; }
  .text_12 { font-size: 0.16rem; line-height: 0.26rem; }

  .list-items_1-0 {
    width: calc(50% - 0.2rem);
    margin: 0 0.4rem 0.4rem 0;
  }
  .list-items_1-0:nth-child(2n) { margin-right: 0; }
  .list-items_1-0 a { padding: 0.2rem; }
  .text_21-0 { font-size: 0.22rem; }
  .text_22-0 { font-size: 0.14rem; margin: 0.12rem auto; }
}

/* ===== ≤1024px：进一步缩小 ===== */
@media screen and (max-width: 1024px) {
  .section_1 { gap: 0.3rem; }
  .box_3 {
    width: 30%;
    min-width: 1.8rem;
    padding: 0.16rem;
  }
  .text_11 { font-size: 0.2rem; line-height: 0.26rem; }
  .text_12 { font-size: 0.15rem; line-height: 0.24rem; }
  .box_5 { margin: 0.14rem auto; }

  .list-items_1-0 {
    width: calc(50% - 0.15rem);
    margin: 0 0.3rem 0.3rem 0;
  }
  .list-items_1-0:nth-child(2n) { margin-right: 0; }
  .list-items_1-0 a { padding: 0.16rem; }
  .text_21-0 { font-size: 0.2rem; }
  .text_22-0 { font-size: 0.12rem; margin: 0.08rem auto; }
}

/* ===== ≤768px：边栏移至顶部，产品卡片 2 列 ===== */
@media screen and (max-width: 768px) {
  .box_32 { padding: 0 4%; }

  /* 边栏 + 网格变为上下堆叠 */
  .section_1 {
    flex-direction: column;
    gap: 0.2rem;
    margin-top: 0.16rem;
  }

  /* 边栏变为横向可滚动分类标签 */
  .box_3 {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.12rem;
    padding: 0.16rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 0.16rem;
  }
  .box_3::-webkit-scrollbar { display: none; }

  /* 分类项变为横向排列的小卡片 */
  .group_5 {
    flex-shrink: 0;
    width: auto;
  }
  .group_5 a {
    gap: 0.08rem;
    padding: 0.08rem 0.16rem;
    background: rgba(217, 196, 118, 0.1);
    border-radius: 0.08rem;
    border: 0.01rem solid rgba(217, 196, 118, 0.3);
    box-sizing: border-box;
  }
  .text_11 {
    font-size: 0.18rem;
    width: 3.1rem;
  }
  .image-wrapper_1 {
    height: 0.32rem;
    width: 0.32rem;
  }
  .thumbnail_2 {
    width: 0.1rem;
    height: 0.1rem;
  }

  .box_5 {
    display: none; /* 隐藏分割线 */
  }

  .group_6 {
    flex-shrink: 0;
    width: auto;
  }
  .group_6 a {
    gap: 0.06rem;
    padding: 0.08rem 0.16rem;
    background: rgba(217, 196, 118, 0.06);
    border-radius: 0.08rem;
    border: 0.01rem solid rgba(217, 196, 118, 0.15);
  }
  .text_12 {
    font-size: 0.15rem;
    line-height: 0.22rem;
  }
  .thumbnail_3 {
    width: 0.1rem;
    height: 0.1rem;
  }

  /* 产品卡片 2 列 */
  .grid_2 {
    width: 100%;
  }
  .list-items_1-0 {
    width: calc(50% - 0.12rem);
    margin: 0 0.24rem 0.24rem 0;
  }
  .list-items_1-0:nth-child(2n) { margin-right: 0; }
  .list-items_1-0 a { padding: 0.14rem; }
  .text_21-0 { font-size: 0.18rem; line-height: 0.24rem; }
  .text_22-0 {
    font-size: 0.16rem;
    height: auto;
    line-height: 0.2rem;
    margin: 0.06rem auto;
  }

  /* 产品单列，保持竖排 */
  .list-items_1-0 {
    width: 100%;
    margin: 0 0 0.2rem 0 !important;
    aspect-ratio: auto;
  }
  .list-items_1-0 a {
    padding: 0.16rem;
    gap: 0.08rem;
  }
}

