/* =========================================================
   工厂车间栏目专用样式  factory.css
   仅作用于带 .factory-nohover 的容器（见 factory.html），
   产品中心(pro.html，无此 class)完全不受影响。

   本文件做三件事：
   1) 去掉产品卡片鼠标移上去的蓝色切换(li-hover)效果；
   2) 网格改为「一行三个」（产品中心仍是一行四个）；
   3) 卡片高度跟随内容，消除图片下方多余的大白块
      （原设计 .li-normal 是绝对定位+固定高度，横图填不满就留白）。

   选择器都带两个类 .Product-center.factory-nohover，优先级高于 inside.css
   （含其响应式媒体查询），无需 !important 即可覆盖。
   ========================================================= */

/* ---- 1. 去掉 hover 切换效果 ---- */
.Product-center.factory-nohover .center-li:hover .li-normal { display: block; }
.Product-center.factory-nohover .center-li:hover .li-hover  { display: none; }
.Product-center.factory-nohover .center-li .li-normal,
.Product-center.factory-nohover .center-li .li-hover        { transition: none; }

/* ---- 2. 一行三个：把卡片容器 .clear 改成三列栅格 ---- */
.Product-center.factory-nohover .clear{
    display: grid;
    grid-template-columns: repeat(3, 1fr);  /* 三等分：一行三个 */
    gap: 25px;                               /* 卡片间距（横竖都是 25px）*/
    align-items: start;                      /* 每张卡按自身内容高度，不被拉伸留白 */
}
/* .clear 是 clearfix 类，自带 :before/:after(content:" ")；grid 下它们会各占一个
   空格子，导致第一格空出来。grid 布局无需清浮动，直接隐藏这两个伪元素。 */
.Product-center.factory-nohover .clear::before,
.Product-center.factory-nohover .clear::after{ display: none; }

/* ---- 3. 卡片与图片：去掉固定高度/绝对定位，高度跟随内容 ---- */
.Product-center.factory-nohover .center-li{
    width: auto;      /* 宽度交给栅格，取消固定 360px */
    height: auto;     /* 取消固定高度 */
    float: none;      /* 栅格布局下不需要浮动 */
    margin: 0;        /* 间距由 gap 统一控制 */
}
.Product-center.factory-nohover .li-normal{
    position: static; /* 由绝对定位改回正常流，卡片高度 = 图片 + 标题 */
    width: 100%;
    height: auto;
}
.Product-center.factory-nohover .li-normal img{
    width: 100%;      /* 图片铺满卡片宽度 */
    height: auto;     /* 高度按原比例，不再被固定高度撑出白块 */
    max-width: none;
}