/**
 * Successful Case page styles
 * From kaliebo-case.html — for page-case.php
 */

/* ================================================================
   SUCCESSFUL CASE PAGE — 客户合影 + 客户好评
   ================================================================ */
/* 客户合影（照片墙） */
.case-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}   /* 一排 4 个 */
.case-item{
  position:relative;
  aspect-ratio:4/3;
  background:#C9D4DD;
  border:1px solid var(--line-dark);
  overflow:hidden;
}
.case-item img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}
.case-item:hover img{transform:scale(1.05);}
.case-item .case-ph{
  position:absolute; inset:0;
  display:none; align-items:center; justify-content:center;
  text-align:center;
  color:var(--steel); font-size:12.5px; letter-spacing:.04em;
  border:1px dashed rgba(14,28,41,0.25); margin:10px;
}
.case-item.noimg .case-ph{display:flex;}
.case-item:not(.noimg) .case-ph{display:none;}
@media (max-width:1200px){ .case-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:860px){ .case-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .case-grid{grid-template-columns:1fr;} }

/* 客户好评（评价卡） */
.rev-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.rev-card{
  display:flex; flex-direction:column;
  background:var(--paper);
  border:1px solid var(--line-dark);
  padding:26px 24px 22px;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.rev-card:hover{
  border-color:var(--rust);
  box-shadow:0 18px 36px -22px rgba(14,28,41,0.32);
  transform:translateY(-4px);
}
.rev-mark{
  font-family:'Barlow Condensed',sans-serif;
  font-size:54px; line-height:.68;
  color:var(--rust); opacity:.32;
  margin-bottom:12px;
}
.rev-text{font-size:15px; color:#26374A; line-height:1.62; flex:1;}
.rev-foot{
  display:flex; align-items:center; gap:12px;
  margin-top:20px; padding-top:16px;
  border-top:1px solid var(--line-dark);
}
.rev-ava{
  position:relative; flex:0 0 auto;
  width:44px; height:44px; border-radius:50%;
  background:#C9D4DD; overflow:hidden;
}
.rev-ava img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
.rev-ava .rev-ph{
  position:absolute; inset:0;
  display:none; align-items:center; justify-content:center;
  font-size:9px; color:var(--steel); text-align:center;
}
.rev-ava.noimg .rev-ph{display:flex;}
.rev-ava:not(.noimg) .rev-ph{display:none;}
.rev-who b{display:block; font-size:14px; font-weight:600; line-height:1.3;}
.rev-who span{display:block; font-size:12.5px; color:var(--steel); margin-top:3px;}
@media (max-width:980px){ .rev-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:620px){ .rev-grid{grid-template-columns:1fr;} }

/* ================================================================
   CUSTOMER REVIEWS — 真实好评截图墙（横版 / 竖版原比例展示，不裁切）
   ================================================================ */
/* 两排横向滚动条带（上：横版评价截图 / 下：竖版聊天截图） */
.revrow + .revrow{margin-top:26px;}
.rev-row-label{
  display:block; margin-bottom:10px;
  font-size:11.5px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase;
  color:var(--steel);
}
.revshot{
  display:block;
  background:#fff;
  border:1px solid var(--line-dark);
  padding:6px;
  height:auto;
  align-self:flex-start;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.revshot:hover{
  border-color:var(--rust);
  box-shadow:0 16px 32px -20px rgba(14,28,41,0.32);
}
.revshot img{display:block; width:100%; max-width:100%; height:auto;}
/* 一屏显示数量：横版 3 张 / 竖版 6 张。flex-basis 锁宽，避免大图把卡片撑开 */
.hscroll > .hitem.revshot{min-width:0; box-sizing:border-box;}
.revshot.land{flex:0 0 calc((100% - 32px) / 3); width:calc((100% - 32px) / 3);}
.revshot.port{flex:0 0 calc((100% - 80px) / 6); width:calc((100% - 80px) / 6);}
@media (max-width:1200px){
  .revshot.land{flex-basis:calc((100% - 32px) / 2); width:calc((100% - 32px) / 2);}
  .revshot.port{flex-basis:calc((100% - 64px) / 5); width:calc((100% - 64px) / 5);}
}
@media (max-width:860px){
  .revshot.land{flex-basis:calc((100% - 16px) / 1.6); width:calc((100% - 16px) / 1.6);}
  .revshot.port{flex-basis:calc((100% - 48px) / 4); width:calc((100% - 48px) / 4);}
}
@media (max-width:620px){
  .revshot.land{flex:0 0 100%; flex-basis:100%; width:100%;}
  .revshot.port{flex-basis:calc((100% - 16px) / 2); width:calc((100% - 16px) / 2);}
}

/* 好评条带：卡片按图片原高，不要被同行最高的一张撑出空白背景 */
#reviews .hscroll{align-items:flex-start;}
.revshot:not(.noimg){aspect-ratio:auto; background:#fff;}
.revshot.noimg{position:relative; background:#F4F7FA; border-style:dashed;}
.revshot.noimg.land{aspect-ratio:16/10;}
.revshot.noimg.port{aspect-ratio:9/16;}
.revshot .rev-ph{
  display:none; position:absolute; inset:0;
  align-items:center; justify-content:center;
  text-align:center; padding:10px;
  font-size:12px; line-height:1.5; color:var(--steel);
  letter-spacing:.03em;
}
.revshot.noimg .rev-ph{display:flex;}
.revshot:not(.noimg) .rev-ph{display:none;}

/* 注：好评区已改为两排横向滚动条带，旧的 masonry(.revwall) 规则已移除 */