/* Tallizen 共用產品卡樣式 — 首頁熱門商品 / 增高頁 / 場合頁 */
/* ==========================================================
   熱門商品 — PC 一批 8 個 (4 欄 x 2 排), 移動端一批 4 個 (2 欄 x 2 排)
   ========================================================== */
.tz-hot-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.tz-hot-card{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  text-decoration:none;
  background:#FFFFFF;
  border:1px solid #EFE7D8;
  border-radius:18px;
  box-shadow:0 4px 16px rgba(120,95,50,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.tz-hot-card:hover{
  transform:translateY(-5px);
  border-color:#E1D7C1;
  box-shadow:0 16px 32px rgba(120,95,50,.16);
}
.tz-hot-media{
  position:relative;
  display:block;
  width:100%;
  padding:12px 12px 0;
  background:linear-gradient(180deg,#FBF8F2 0%,#FFFFFF 100%);
}
.tz-hot-media img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  border-radius:12px;
  background:#FFFFFF;
}
.tz-hot-cm{
  position:absolute;
  top:20px;
  left:20px;
  z-index:2;
  display:inline-block;
  padding:3px 11px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.5px;
  color:#FFF8E7;
  background:linear-gradient(135deg,#B8860B 0%,#D9A520 100%);
  border-radius:999px;
  box-shadow:0 3px 10px rgba(184,134,11,.32);
}
.tz-hot-body{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px 16px 18px;
}
.tz-hot-cat{
  font-style:normal;
  font-size:11px;
  letter-spacing:.8px;
  color:#A08A5E;
}
.tz-hot-name{
  font-size:14.5px;
  font-weight:700;
  line-height:1.45;
  color:#2C2620;
  min-height:2.9em;
}
.tz-hot-price{
  display:block;
  font-size:17px;
  font-weight:800;
  color:#B8860B;
}
.tz-hot-price del{font-size:12.5px;font-weight:400;color:#9A9186;margin-right:6px}
.tz-hot-price ins{text-decoration:none}
.tz-hot-price .amount{font-size:17px}
.tz-hot-cta{
  display:block;
  margin-top:2px;
  padding:9px 0;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:1px;
  text-align:center;
  color:#4A4034;
  background:#F4EEE2;
  border-radius:10px;
  transition:background .22s ease, color .22s ease;
}
.tz-hot-card:hover .tz-hot-cta{background:#FFC92E;color:#2C2620}

/* 未展開的卡片先藏起來, 由 JS 逐批顯示 */
.tz-hot-card{display:none}
.tz-hot-card.is-on{display:flex}

.tz-hot-actions{
  display:flex;
  justify-content:center;
  margin-top:32px;
}
.tz-hot-more{
  display:inline-block;
  padding:14px 46px;
  font-size:15px;
  font-weight:800;
  letter-spacing:1.5px;
  color:#2C2620;
  background:#FFFFFF;
  border:2px solid #D9CBAE;
  border-radius:999px;
  cursor:pointer;
  transition:background .22s ease, border-color .22s ease, transform .22s ease;
}
.tz-hot-more:hover{
  background:#FFC92E;
  border-color:#FFC92E;
  transform:translateY(-2px);
}
.tz-hot-more.is-done{
  color:#FFF8E7;
  background:linear-gradient(135deg,#B8860B 0%,#D9A520 100%);
  border-color:transparent;
}

@media (max-width:1023px){
  .tz-hot-grid{grid-template-columns:repeat(4,1fr);gap:12px}
  .tz-hot-name{font-size:13px;min-height:2.9em}
  .tz-hot-body{padding:12px 12px 15px;gap:5px}
  .tz-hot-cta{padding:8px 0;font-size:11.5px}
}
@media (max-width:767px){
  .tz-hot-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .tz-hot-card{border-radius:13px}
  .tz-hot-media{padding:8px 8px 0}
  .tz-hot-media img{border-radius:9px}
  .tz-hot-cm{top:13px;left:13px;font-size:10px;padding:2px 8px}
  .tz-hot-body{padding:10px 10px 12px;gap:4px}
  .tz-hot-cat{font-size:9.5px;letter-spacing:.4px}
  .tz-hot-name{font-size:11.5px;line-height:1.4;min-height:2.8em}
  .tz-hot-price{font-size:14px}
  .tz-hot-price .amount{font-size:14px}
  .tz-hot-cta{padding:7px 0;font-size:10.5px;letter-spacing:.5px;border-radius:8px}
  .tz-hot-actions{margin-top:22px}
  .tz-hot-more{padding:12px 34px;font-size:13.5px;letter-spacing:1px}
}

/* ==========================================================
   產品列表容器 — 首頁熱門商品 / 高度頁 / 場合頁 共用
   ========================================================== */
.tz-pclist{
  max-width:1300px;
  margin:0 auto;
}
.tz-pclist .tz-hot-grid{
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.tz-pclist .tz-hot-card{width:auto;display:flex}
/* 首頁是靠 JS 加 .is-on 分批展開; 增高頁/場合頁是一次全部顯示,
   必須把 .tz-hot-card{display:none} 這條覆蓋掉, 否則整頁卡片都不見。 */

/* 空結果提示 (例如 3cm / 4cm 目前沒有現貨) */
.tz-pclist-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  padding:38px 24px;
  text-align:center;
  background:#FFFFFF;
  border:1px dashed #E3D9C4;
  border-radius:18px;
}
.tz-pclist-empty b{
  font-size:18px;
  font-weight:800;
  color:#0F2A28;
  letter-spacing:.5px;
}
.tz-pclist-empty p{
  margin:0;
  font-size:14.5px;
  line-height:1.8;
  color:#6B6154;
}
.tz-pclist-empty a{
  display:inline-block;
  padding:11px 30px;
  font-size:13.5px;
  font-weight:800;
  letter-spacing:1px;
  text-decoration:none;
  color:#FFF8E7;
  background:linear-gradient(135deg,#B8860B 0%,#D9A520 100%);
  border-radius:999px;
}
.tz-pclist-head{
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 20px;
  padding-bottom:14px;
  border-bottom:1px solid #EFE7D8;
}
.tz-pclist-head b{
  font-size:20px;
  font-weight:800;
  color:#0F2A28;
  letter-spacing:.5px;
}
.tz-pclist-head span{
  font-size:13px;
  color:#A08A5E;
  letter-spacing:1px;
}

.tz-pclist-sub{
  margin:34px 0 18px;
  padding-top:18px;
  font-size:15px;
  font-weight:800;
  letter-spacing:1.5px;
  color:#B8860B;
  border-top:1px solid #EFE7D8;
}
.tz-pclist-sub::before{
  content:'';
  display:inline-block;
  width:20px;
  height:3px;
  margin-right:10px;
  vertical-align:middle;
  border-radius:2px;
  background:#D9A520;
}

@media (max-width:1023px){
  .tz-pclist .tz-hot-grid{grid-template-columns:repeat(3,1fr);gap:12px}
  .tz-pclist-head b{font-size:18px}
  .tz-pclist-sub{margin:26px 0 14px;padding-top:14px;font-size:13.5px}
  .tz-pclist-empty{padding:30px 18px}
  .tz-pclist-empty b{font-size:16.5px}
  .tz-pclist-empty p{font-size:13.5px}
}
@media (max-width:767px){
  .tz-pclist .tz-hot-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .tz-pclist-head{margin-bottom:14px;padding-bottom:12px}
  .tz-pclist-head b{font-size:16.5px}
  .tz-pclist-head span{font-size:11.5px}
  .tz-pclist-sub{margin:22px 0 12px;padding-top:12px;font-size:12.5px}
  .tz-pclist-sub::before{width:16px;margin-right:8px}
  .tz-pclist-empty{padding:26px 16px;gap:11px}
  .tz-pclist-empty b{font-size:15px}
  .tz-pclist-empty p{font-size:12.5px;line-height:1.75}
  .tz-pclist-empty a{width:100%;padding:11px 0;text-align:center}
}