/* ============================================================
   TEEZE · 商品展示区样式（Product Showcase）
   ============================================================ */
.tz-products {
  --tz-black: #000;
  --tz-white: #fff;
  --tz-yellow: #efa333;
  --tz-bg: #000000;
  --tz-body: #c8c8c8;
  --tz-muted: #8b8b8b;
  --tz-line: rgba(255, 255, 255, .13);
  --tz-raised: #151515;
  --tz-display: "Arial Narrow", "Helvetica Neue Condensed", "Helvetica Neue", Arial, sans-serif;
  --tz-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tz-mono: Consolas, "SFMono-Regular", "Liberation Mono", monospace;
  --tz-max: 1220px;
  --tz-gutter: clamp(18px, 3vw, 40px);
  --tz-section: clamp(72px, 9vw, 124px);
  --tz-pad-top: 0px;
  --tz-pad-bottom: 0px;
  --tz-ease: cubic-bezier(.16, 1, .3, 1);
  /* 遮罩层（暗处理）：透明度 0 = 无遮罩 */
  --tz-overlay-color: #000000;
  --tz-overlay-opacity: 93;
  --tz-overlay-stop: 66%;
  --tz-overlay-mid: 0%;
}
.tz-products, .tz-products *, .tz-products *::before, .tz-products *::after { box-sizing: border-box; }
.tz-products {
  background: var(--tz-bg);
  color: var(--tz-white);
  font-family: var(--tz-sans);
  line-height: 1.55;
  padding-block: calc(var(--tz-section) + var(--tz-pad-top)) calc(var(--tz-section) + var(--tz-pad-bottom));
}
.tz-products a { color: inherit; text-decoration: none; }
.tz-products .tz-container { width: min(100% - var(--tz-gutter) * 2, var(--tz-max)); margin: auto; }
.tz-products .tz-eyebrow, .tz-products .tz-label { margin: 0; color: var(--tz-yellow); font: 700 11px/1.3 var(--tz-mono); letter-spacing: .1em; text-transform: uppercase; }
.tz-products h2, .tz-products h3 { font-family: var(--tz-display); text-transform: uppercase; }
.tz-products h2 { margin: 16px 0 0; font-size: clamp(42px, 5vw, 70px); font-weight: 600; letter-spacing: -.03em; line-height: .96; }
.tz-products .tz-section-head { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: 40px; margin-bottom: 54px; }
.tz-products .tz-section-head > p { max-width: 460px; margin: 0; color: var(--tz-body); }
.tz-products .tz-product-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 300px; gap: 10px; }
.tz-products .tz-product { position: relative; grid-column: span 6; overflow: hidden; border: 1px solid var(--tz-line); background: var(--tz-raised); }
.tz-products .tz-product.tz-wide { grid-column: span 7; grid-row: span 2; }
.tz-products .tz-product.tz-tall { grid-column: span 5; grid-row: span 2; }
.tz-products .tz-product img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.72) brightness(.66); transition: transform .5s var(--tz-ease), filter .5s var(--tz-ease); }
.tz-products .tz-product:hover img { transform: scale(1.03); filter: saturate(.92) brightness(.78); }
.tz-products .tz-product:after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(0deg,
    var(--tz-overlay-color) 0%,
    var(--tz-overlay-color) var(--tz-overlay-mid),
    transparent var(--tz-overlay-stop));
  opacity: calc(var(--tz-overlay-opacity) / 100);
}
.tz-products .tz-num { position: absolute; z-index: 2; top: 20px; right: 20px; color: var(--tz-yellow); font: 700 11px var(--tz-mono); }
.tz-products .tz-product-copy { position: absolute; z-index: 2; inset: auto 0 0; padding: 28px; }
.tz-products .tz-product-copy h3 { margin: 9px 0 8px; font-size: clamp(27px, 3vw, 45px); line-height: 1; }
.tz-products .tz-product-copy > p:not(.tz-label) { max-width: 500px; margin-bottom: 18px; color: var(--tz-body); font-size: 14px; }
/* 整卡可点击：用 a 撑满整张卡，视觉不变，只加指针与焦点反馈（图片缩放 hover 已有，这里补文字下划线） */
.tz-products .tz-product-card {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.tz-products .tz-text-link { display: inline-flex; gap: 8px; color: var(--tz-yellow); font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.tz-products .tz-product-card:hover .tz-text-link { text-decoration: underline; text-underline-offset: 4px; }
.tz-products .tz-product-card:focus-visible { outline: 2px solid var(--tz-yellow); outline-offset: -4px; }
.tz-products .tz-reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s var(--tz-ease), transform .65s var(--tz-ease); }
.tz-products .tz-reveal.tz-visible { opacity: 1; transform: none; }
.tz-products .tz-ph { width: 100%; height: 100%; display: grid; place-items: center; color: var(--tz-muted); background: var(--tz-raised); }
@media (max-width: 1050px) {
  .tz-products .tz-product, .tz-products .tz-product.tz-wide, .tz-products .tz-product.tz-tall { grid-column: span 6; grid-row: span 1; }
  .tz-products .tz-product-grid { grid-auto-rows: 390px; }
}
@media (max-width: 767px) {
  .tz-products .tz-section-head { grid-template-columns: 1fr; gap: 22px; margin-bottom: 38px; }
  .tz-products .tz-product-grid { display: block; }
  .tz-products .tz-product { height: 460px; margin-bottom: 10px; }
  .tz-products .tz-product.tz-wide { height: 540px; }
}
@media (prefers-reduced-motion: reduce) {
  .tz-products .tz-reveal { opacity: 1; transform: none; transition: none; }
}
/* 设备可见性：PC / 移动端分别隐藏整块 */
@media (min-width: 768px) {
  .tz-products.tz-hide-pc { display: none !important; }
}
@media (max-width: 767px) {
  .tz-products.tz-hide-mobile { display: none !important; }
}