/* ============================================================
   TEEZE · 案例画廊样式（Build Gallery）
   ============================================================ */
.tz-builds {
  --tz-black: #000;
  --tz-yellow: #efa333;
  --tz-bg: #000000;
  --tz-body: #c8c8c8;
  --tz-line: rgba(255, 255, 255, .13);
  --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);
  /* 图片效果：100 = 原图，不做任何处理 */
  --tz-img-brightness: 100;
  --tz-img-saturate: 100;
  --tz-img-opacity: 100;
  /* 遮罩层：透明度 0 = 无遮罩，直接展示原图 */
  --tz-overlay-color: #000000;
  --tz-overlay-opacity: 0;
  --tz-overlay-stop: 62%;
  --tz-overlay-mid: 0%;
}
.tz-builds, .tz-builds *, .tz-builds *::before, .tz-builds *::after { box-sizing: border-box; }
.tz-builds {
  background: var(--tz-bg);
  color: var(--tz-white, #fff);
  font-family: var(--tz-sans);
  line-height: 1.55;
  padding-top: calc(var(--tz-section) + var(--tz-pad-top));
  padding-bottom: var(--tz-pad-bottom);
}
.tz-builds .tz-container { width: min(100% - var(--tz-gutter) * 2, var(--tz-max)); margin: auto; }
.tz-builds .tz-eyebrow { margin: 0; color: var(--tz-yellow); font: 700 11px/1.3 var(--tz-mono); letter-spacing: .1em; text-transform: uppercase; }
.tz-builds h2, .tz-builds h3 { font-family: var(--tz-display); text-transform: uppercase; }
.tz-builds h2 { margin: 16px 0 0; font-size: clamp(42px, 5vw, 70px); font-weight: 600; letter-spacing: -.03em; line-height: .96; }
.tz-builds .tz-section-head { display: grid; grid-template-columns: 1.35fr .65fr; align-items: end; gap: 40px; margin-bottom: 54px; }
.tz-builds .tz-section-head > p { max-width: 460px; margin: 0; color: var(--tz-body); }
.tz-builds .tz-build-track { display: grid; grid-template-columns: repeat(3, minmax(70vw, 1fr)); gap: 10px; overflow-x: auto; padding: 0 var(--tz-gutter) 32px; scroll-snap-type: x mandatory; }
.tz-builds .tz-build { position: relative; height: min(68vw, 680px); min-height: 470px; overflow: hidden; scroll-snap-align: start; }
.tz-builds .tz-build img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  filter: saturate(calc(var(--tz-img-saturate) / 100)) brightness(calc(var(--tz-img-brightness) / 100));
  opacity: calc(var(--tz-img-opacity) / 100);
}
.tz-builds .tz-build .tz-ph { width: 100%; height: 100%; display: grid; place-items: center; color: var(--tz-body); background: var(--tz-bg); }
/* 遮罩层：默认 opacity 0（完全不显示）；开启后支持「底部渐变」与「全图均匀」两种形态 */
.tz-builds .tz-build: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-builds .tz-badge { position: absolute; z-index: 2; top: 22px; left: 22px; padding: 7px 9px; background: rgba(0, 0, 0, .75); border: 1px solid var(--tz-line); font: 700 9px var(--tz-mono); letter-spacing: .1em; }
.tz-builds .tz-build-copy { position: absolute; z-index: 2; left: 28px; bottom: 26px; max-width: 520px; }
.tz-builds .tz-build-copy span { color: var(--tz-yellow); font: 700 10px var(--tz-mono); letter-spacing: .08em; }
.tz-builds .tz-build h3 { margin: 7px 0; font-size: clamp(33px, 4vw, 58px); line-height: .95; }
.tz-builds .tz-build p { margin: 0; color: var(--tz-body); }
/* 整卡可点击：用 a 撑满整张卡，视觉不变，只加指针与焦点反馈（光标继承给内部文字） */
.tz-builds .tz-build-card {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
/* 卡片链接文字（对齐 04 商品卡的 .tz-text-link 视觉，改用模块自身的 mono 字体） */
.tz-builds .tz-build-link {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 14px;
  color: var(--tz-yellow);
  font: 700 11px var(--tz-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
}
.tz-builds .tz-build-card:hover .tz-build-link { text-decoration: underline; text-underline-offset: 4px; }
.tz-builds .tz-build-card:focus-visible { outline: 2px solid var(--tz-yellow); outline-offset: -4px; }
.tz-builds .tz-reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s var(--tz-ease), transform .65s var(--tz-ease); }
.tz-builds .tz-reveal.tz-visible { opacity: 1; transform: none; }
@media (max-width: 767px) {
  .tz-builds .tz-section-head { grid-template-columns: 1fr; gap: 22px; margin-bottom: 38px; }
  .tz-builds .tz-build-track { display: block; overflow: visible; }
  .tz-builds .tz-build { height: 520px; min-height: 0; margin-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .tz-builds .tz-reveal { opacity: 1; transform: none; transition: none; }
}
/* 设备可见性：PC / 移动端分别隐藏整块 */
@media (min-width: 768px) {
  .tz-builds.tz-hide-pc { display: none !important; }
}
@media (max-width: 767px) {
  .tz-builds.tz-hide-mobile { display: none !important; }
}
