/* ==========================================================================
   案例展示（cases.html · 原站 key=alzs）页面专属样式
   --------------------------------------------------------------------------
   几何数值全部取自 _source/measure/alzs.json 的原站实测（1440 视口，画布左界 = 页面 x120）：
   · 正文区 847px：卡片列表容器在画布 (2,38)，尺寸 1217x809（原站 smv_con_8_12）
   · 卡片外框 278x213（原站为 276px 内容 + 1px 透明边框），
     图片盒 276x168 位于卡片内 (1,1)，图片按原比例居中裁切（溢出部分被图片盒裁掉）
   · 卡片列距 304px、行距 252px（原站靠 margin 26px 产生）
   · 标题 16px/28px #404040 居中，位于卡片内 (11,174)
   · 分页三件套 67/30/67 × 32px、圆角 3px、禁用项 50% 透明，左上角在画布 (513.5,562)
   ========================================================================== */

/* ---------- 正文区 ---------- */
.sec-cases { height: 847px; }
.case-list { position: absolute; left: 2px; top: 38px; width: 1217px; height: 809px; }

/* ---------- 案例卡片 ---------- */
.case-item { position: absolute; width: 278px; height: 213px; background: #fff; overflow: hidden; }
.case-link { display: block; width: 100%; height: 100%; }

/* 图片盒：276x168，居中裁切超大图片（原站 .w-list-pic，JS 按 cover 规则算好尺寸与负边距） */
.case-pic { position: absolute; left: 1px; top: 1px; width: 276px; height: 168px; overflow: hidden; }
.case-pic img { position: absolute; display: block; }

/* 标题：与原站 .w-list-title 完全一致的字体与裁切方式 */
.case-ttl {
  position: absolute; width: 256px; height: 28px; margin: 0; padding: 0; overflow: hidden;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
  font: 400 16px/28px Tahoma; color: #404040; text-align: center;
}
.case-ttl:hover { color: #e43939; text-decoration: underline; }   /* 原站 .w-list-title:hover */

/* 摘要：原站节点带 .w-hide（display:none），卡片高度 213px 内没有它的位置，
   故复刻版同样保留文案但不渲染，保证与原站逐像素一致 */
.case-desc { display: none; }

/* ---------- 分页（原站 xn-pager Style1_Item0） ----------
   容器宽 194px 居中原站 1217px 列表区 → 左边界 = 122 + (1217-194)/2 = 633.5（画布 513.5） */
.pager-case {
  width: 194px; text-align: left;
  font: 400 12px/30px Arial, "Lucida Grande", "Microsoft Yahei", "Hiragino Sans GB", "Hiragino Sans GB W3", SimSun, STHeiti;
}
.pager-case .pg { position: absolute; top: 0; width: 67px; height: 30px; margin: 0; }
.pager-case .pg.p1 { left: 0; }
.pager-case .pg.p2 { left: 77px; width: 30px; }
.pager-case .pg.p3 { left: 117px; }
.pager-case .pg a {
  display: block; width: 100%; height: 32px; margin: 0; line-height: 30px; text-align: center;
  border: 1px solid #ddd; border-radius: 3px; background: #fff; color: #666; font-size: 12px;
}
.pager-case .pg.cur a { background: #eee; border-color: #ccc; }   /* 当前页 */
.pager-case .pg.flip { opacity: .5; }                             /* 禁用：上一页 / 下一页 */