/* ===== 显示/隐藏控制（不依赖媒体查询加载） ===== */
.pc-only { display: revert; }
.mobile-only { display: none; }

@media (max-width: 768px) {
    .pc-only { display: none !important; }
    .mobile-only { display: revert !important; }
}

/* ===== 页面Banner ===== */
.page-banner {
  width: 100%;
  height: 16vw;
  overflow: hidden;
}

.page-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ===== 面包屑 ===== */
.breadcrumb-section {
  padding: 1.5vw 0;
  background-color: #fff;
}

.breadcrumb {
  font-size: 0.875vw;
  color: var(--text-gray);
  text-align: right;
}

.breadcrumb a {
  color: var(--text-gray);
  transition: color 0.3s ease;
}

.breadcrumb a:hover {
  color: var(--primary-color);
}

.breadcrumb .separator {
  color: var(--text-light);
}

.breadcrumb .current {
  color: var(--primary-color);
}

/* ===== 产品详情 ===== */
.product-detail-section {
  padding: 3vw 0;
  background-color: #fff;
}

.product-layout {
  display: grid;
  grid-template-columns: 18vw 1fr;
  gap: 3vw;
  align-items: start;
}

/* ===== 左侧分类 ===== */
.product-sidebar {
  border-radius: 0.5vw;
  padding: 0 1.5vw 2vw 1.5vw;
  position: sticky;
  top: calc(var(--header-height) + 2vw);
}

.sidebar-title {
  font-size: 1.25vw;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 1.5vw;
}

.category-list {
  list-style: none;
  padding: 0;
}

.category-group {
  margin-bottom: 0.375vw;
}

.category-l1 {
  cursor: pointer;
  padding: 0.595vw 1vw;
  border-radius: 0.375vw;
  font-size: 0.9375vw;
  color: var(--text-dark);
  font-weight: 500;
  transition: all 0.3s ease;
  background-color: #f2ece7;
  border-radius: 8888.5vw;
}

.category-l1:hover {
  background-color: rgba(139, 105, 20, 0.08);
}

.category-l1.active-l1 {
  background-color: #4e5140;
  color: #fff;
}

/* 二级列表 */
.l2-list {
  margin-top: 0.25vw;
}

.category-l2 {
  cursor: pointer;
  padding: 0.5vw 1vw;
  border-radius: 0.25vw;
  font-size: 0.875vw;
  color: var(--text-gray);
  margin-bottom: 0.125vw;
}

.category-l2:hover {
  color: var(--primary-color);
  background-color: rgba(139, 105, 20, 0.06);
   border-radius: 8888.25vw;
}

.category-l2.active-l2 {
  color: var(--text-dark);
  font-weight: 500;
  background-color: transparent;
  border: 0.0625vw solid #000;
  border-radius: 8888.25vw;
  background-image: url('../../../images/product-img/arrow-4.png');
  background-repeat: no-repeat;
  background-position: right 0.75vw center;
  background-size: 0.4vw auto;
}

/* 三级列表 */
.l3-list {
  margin: 0.125vw 0 0.25vw 0.5vw;
  border-left: 0.125vw solid #ece5db;
  padding-left: 0.5vw;
}

.category-l3 {
  position: relative;
  padding: 0.375vw 0.5vw;
  border-radius: 0.25vw;
  font-size: 0.8125vw;
  color: var(--text-gray);
  transition: all 0.25s ease;
}

.category-l3 a {
  display: block;
  color: inherit;
  text-decoration: none;
}

.category-l3:hover {
  color: var(--primary-color);
}

.category-l3.active-l3 {
  color: var(--primary-color);
  font-weight: 500;
}

.category-l3.active-l3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0.25vw;
  height: 0.75vw;
  background-color: var(--primary-color);
  border-radius: 0.125vw;
}

.detail-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4vw;
  align-items: start;
}

/* ===== 左侧图片 ===== */
.detail-gallery {
  position: sticky;
  top: calc(var(--header-height) + 2vw);
}

.main-image {
  width: 100%;
  aspect-ratio: 1;
  background-color: var(--bg-cream);
  border-radius: 0.5vw;
  overflow: hidden;
  margin-bottom: 1vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.main-image img {
  width: 30.2vw;
  height: 22.4vw;
  object-fit: contain;
  transition: transform 0.4s ease;
}

.main-image img:hover {
  transform: scale(1.02);
}

.thumbnail-list {
  display: flex;
  gap: 1vw;
}

.thumb-item {
  width: 5vw;
  height: 5vw;
  background-color: var(--bg-cream);
  border-radius: 0.375vw;
  overflow: hidden;
  cursor: pointer;
  border: 0.125vw solid transparent;
  transition: all 0.3s ease;
}

.thumb-item.active {
  border-color: var(--primary-color);
}

.thumb-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ===== 右侧信息 ===== */
.product-title {
  font-size: 1.5vw;
  color: var(--text-dark);
}

.product-price {
  font-size: 1.6vw;
  color: #dca14d;
  display: block;
}

.product-subtitle {
  font-size: 0.9375vw;
  color: #000;
  margin-bottom: 1.5vw;
}

.info-card {
  background-color: #e3a045;
  border-radius: 5555.5vw;
  padding: .2vw .9vw;
  display: flex;
  align-items: center;
  gap: 1vw;
  margin-bottom: 1.5vw;
  width: max-content;
}

.info-card-img {
  width: .8vw;
  height: auto;
}

.info-card-text {
  font-size: 0.8375vw;
  color: #fff;
  line-height: 1.6;
}

.product-specs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75vw;
  margin-bottom: 1.5vw;
}

.spec-text {
  font-size: 0.9375vw;
  color: var(--text-dark);
  line-height: 1.8;
  white-space: normal;
  word-break: break-word;
}

.spec-item {
  display: flex;
  font-size: 0.9375vw;
}

.spec-label {
  color: var(--text-gray);
  width: 4vw;
}

.spec-value {
  color: var(--text-dark);
  font-weight: 500;
}

.contact-card {
  background-color: #e3a045;
  border-radius: 5555.5vw;
  padding: .2vw .9vw;
  display: flex;
  align-items: center;
  gap: 1vw;
  margin-bottom: 1.5vw;
  width: max-content;
}

.contact-card-img {
  width: .8vw;
  height: auto;
}

.contact-card-text {
  font-size: 0.8375vw;
  color: #fff;
  line-height: 1.6;
}

.contact-wrapper {
  display: grid;
  grid-template-columns: .5fr 1fr;
  gap: 1.5vw;
}

.consult-label {
  font-size: 0.9375vw;
  color: var(--text-dark);
  margin-bottom: 0.75vw;
}

.consult-qr {
  width: 8vw;
  height: 8vw;
  border-radius: 0.375vw;
}

.phone-label {
  font-size: 0.9375vw;
  color: var(--text-dark);
}

.phone-number {
  font-size: 1.5vw;
  color: var(--primary-color);
  font-weight: 600;
}

/* ===== 产品详情描述 ===== */
.product-desc-section {
  padding: 3vw 0 0;
  background-color: #fff;
}

.desc-content {
  margin: 0;
}

.desc-content p {
  font-size: 1vw;
  color: var(--text-dark);
  line-height: 2;
  margin-bottom: 1.5vw;
}

.desc-content h3 {
  font-size: 1.25vw;
  font-weight: 600;
  color: var(--text-dark);
  margin: 2vw 0 1vw;
}

.desc-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2vw;
  margin: 2vw 0;
}

.desc-img-item {
  border-radius: 0.5vw;
  overflow: hidden;
  background-color: var(--bg-cream);
}

.desc-img-item img {
  width: 100%;
  height: 22vw;
  object-fit: contain;
}