/* ============================================================
   老兵 CMS 适配层
   只补 CMS 标签输出结构与原设计 DOM 之间的差异，不改原有样式
   ============================================================ */

/* ---- 顶部导航：只有带子栏目的项才显示下拉箭头 ----
   原站靠 <em></em> 画三角箭头，而 {cms:columnmenu/} 在没有子栏目时
   输出空字符串。所以「有没有下拉」只能靠 :has 判断。
   下面这条规则让无子栏目的项不显示箭头；footer 里还有一段 JS 兜底。 */
.header_nav li:not(:has(ul)) span em {
  display: none;
}

/* ---- 顶部导航下拉：columnmenu 输出的 <ul class="sub-menu"> ---- */
.header_nav li > ul.sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  /* 关键：一级菜单的 ul 是 display:flex（横排），子菜单会继承，
     导致二级菜单项横向排列并撑到 1000px 以上。这里必须显式改回 block。 */
  display: block;
  /* 宽度按内容走：固定 min-width:100% 会让 40 字符的分类名跑到白底外面。
     封顶 320px 后允许换行，靠右的菜单也不会顶出屏幕。 */
  width: -moz-max-content;
  width: max-content;
  max-width: 320px;
  min-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
  opacity: 0;
  visibility: hidden;
  transform: translateY(0);
  transition: all .3s;
  z-index: 10;
}
.header_nav li:hover > ul.sub-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(-10px);
}
.header_nav li > ul.sub-menu > li {
  display: block;
  float: none;
  width: auto;
  flex: none;
  line-height: 1.45;
}
.header_nav li > ul.sub-menu a {
  display: block;
  padding: 10px 18px 10px 15px;
  color: #333;
  font-weight: bold;
  font-size: 14px;
  line-height: 20px;
  /* 长分类名换行，不硬撑宽度（原来写 nowrap 会跑出白底） */
  white-space: normal;
  word-break: break-word;
  transition: all ease .3s;
}
.header_nav li > ul.sub-menu a:hover {
  color: #e51b27;
  opacity: .75;
}

/* 二级菜单里的三级列表（原设计里是向右展开的 dl，这里用 ul 模拟） */
.header_nav li > ul.sub-menu li > ul {
  position: absolute;
  left: 100%;
  top: 0;
  min-width: 100%;
  width: max-content;
  max-width: 320px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
  opacity: 0;
  visibility: hidden;
  transition: all .3s;
}
.header_nav li > ul.sub-menu li:hover > ul {
  visibility: visible;
  opacity: 1;
}

/* ---- 左侧产品分类树 ----
   原样式已覆盖 .pro_list1_l dl dd ul li a（灰字、缩进 40px），
   这里只把 columnmenu 输出的 ul 拉回无项目符号、贴边。 */
.pro_list1_l dl dd > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ---- 内容图统一比例 ----
   原设计的产品图都是 750×750 方图，网格靠这个保持整齐。
   后台上传的图比例不一时，卡片高度会被撑得高低不齐（就是"变形"的来源）。
   这里统一成 1:1：产品图 white 底、contain 不裁切；新闻图 cover 铺满。 */
.ind3 .list li .img img,
.pro_list1_r .list ul li a .img img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #fff;
}
.new_list1 .list ul li a .img img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.ind6 .pro-swiper1 .swiper-slide img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #fff;
}

/* ---- CMS 分页标记输出 ---- */
.page_list ul li a,
.page_list ul li strong {
  display: inline-block;
  min-width: 34px;
  text-align: center;
}