/* ==========================================================================
   Domicase 前台自适应 + 图片规格补丁 v1.0
   适用：EGOHUI开发版 3.7.3 / 模板 domicase
   用法：上传为 /template/domicase/skin/css/domicase-fix.css
        在首页 / 列表页 / 详情页模板的 </head> 前加一行：
        <link href="{pboot:sitetplpath}/skin/css/domicase-fix.css" rel="stylesheet">
   说明：只做新增覆盖，不改原 style.css；删除本文件或注释掉引用即可完全回滚。
   本补丁只解决一件事：图片比例不统一导致的卡片高低错落与加载跳动。
   ========================================================================== */

/* ---------- 1. 图片自身锁定比例 ---------- */
/* 原模板只写 width:100%; height:auto，图片按各自原始比例撑开：
   698x669 渲染出 244px 高，779x791 渲染出 278px 高，
   同一行卡片因此高低错落，且加载完成瞬间撑开造成跳动（CLS）。
   这里给 img 自身设 aspect-ratio + object-fit，容器高度不再依赖原图比例。 */

/* 产品图：统一 1:1，contain 保留完整商品不留白边裁切 */
.product_item .item_img img,
.items_list .product_item .item_img img,
.side_product_item .item-img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  background-color: #fff;
}

/* 首页轮播：原图 1920x1139，锁同一比例，避免加载中高度塌陷 */
.slider_banner .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1920 / 1139;
  object-fit: cover;
  background-color: #f5f5f5;
}

/* 首页四个栏目宣传图：原图 1920/1300/1000 方图混用，统一 1:1 */
.index_promote .promote_item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background-color: #f5f5f5;
}

/* 新闻图：原图 800x450，统一 16:9 */
.index_news .news_item .item_img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background-color: #f5f5f5;
}

/* 容器高度交回内容，取消原模板固定 301.33px 造成的裁切 */
.product_item .item_img { height: auto; }
.index_news .news_item .item_img { height: auto; }

/* ---------- 2. 移动端细节 ---------- */
@media only screen and (max-width: 480px) {
  /* 轮播首图在手机上不要被压到 160px 以下 */
  .slider_banner .swiper-slide img { min-height: 180px; }

  /* 产品标题固定两行高度，避免长短标题把卡片撑得参差不齐 */
  .product_item .item_title { min-height: 3.2em; }
  .product_item .item_title a { max-width: 100%; }

  /* 关于我们区块背景固定附着在 iOS 上会错位 */
  .index_company_intr { background-attachment: scroll; padding: 60px 0; }

  /* 页脚版权字号过大 */
  .foot_bar { font-size: 14px; }
}

/* ---------- 3. 标题层级修正后的视觉保持 ---------- */
/* 询盘弹窗标题由 h1 改为 h3（避免与页面主标题重复），锁定成原来 h1 的显示效果 */
.ch_form_wrap .title,
.inquiry-form .title {
  font-size: 2em;
  font-weight: bold;
  line-height: 1.2;
  margin: 0.67em 0;
}

/* 页面主标题由 h2 改为 h1，锁定间距，避免 h1 默认外边距撑开版面 */
h1.page_title {
  margin: 0 0 15px;
  line-height: 1.4;
}
h1.intro_title {
  margin: 0;
  line-height: 1.4;
}

/* ---------- 4. 旧浏览器降级：不支持 aspect-ratio 时退回固定高 ---------- */
@supports not (aspect-ratio: 1 / 1) {
  .product_item .item_img { height: 301px; }
  .index_news .news_item .item_img { height: 180px; }
}