/* ============================================================
   TEEZE · 定制轮毂垫片 · 公共样式（tz-spacer-process 命名空间）
   ============================================================ */
.tz-spacer-process {
  --tz-black:#000; --tz-white:#fff; --tz-yellow:#efa333; --tz-yellow2:#f6b650;
  --tz-bg:#000; --tz-surface:#080808; --tz-body:#c8c8c8; --tz-muted:#8b8b8b;
  --tz-line:rgba(255,255,255,.13); --tz-line-soft:rgba(255,255,255,.07);
  --tz-display:"Arial Narrow","Helvetica Neue Condensed","Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  --tz-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --tz-mono:Consolas,"SFMono-Regular","Liberation Mono",Menlo,monospace;
  --tz-serif:Georgia,"Times New Roman","Songti SC",serif;
  --tz-max:1240px; --tz-gutter:clamp(20px,4vw,48px);
  --tz-section:clamp(76px,10vw,140px); --tz-ease:cubic-bezier(.16,1,.3,1);
}
.tz-spacer-process, .tz-spacer-process *, .tz-spacer-process *::before, .tz-spacer-process *::after { box-sizing:border-box; }
.tz-spacer-process {
  position:relative; display:block; overflow:hidden;
  background:var(--tz-bg); color:var(--tz-white);
  font-family:var(--tz-sans); line-height:1.75;
  border-top:1px solid var(--tz-line);
  padding-top:var(--tz-pad-top,0px); padding-bottom:var(--tz-pad-bottom,0px);
}
.tz-spacer-process a { color:inherit; text-decoration:none; }
.tz-spacer-process img { display:block; max-width:100%; }
.tz-spacer-process h1,.tz-spacer-process h2,.tz-spacer-process h3,.tz-spacer-process h4,.tz-spacer-process p,.tz-spacer-process figure,.tz-spacer-process blockquote { margin:0; }
.tz-spacer-process .tz-spacer-process-inner { position:relative; max-width:var(--tz-max); margin:0 auto; padding:var(--tz-section) var(--tz-gutter); }
.tz-spacer-process .tz-ff-display { font-family:var(--tz-display); }
.tz-spacer-process .tz-ff-sans    { font-family:var(--tz-sans); }
.tz-spacer-process .tz-ff-mono    { font-family:var(--tz-mono); }
.tz-spacer-process .tz-ff-serif   { font-family:var(--tz-serif); }
.tz-spacer-process .tz-align-left { text-align:left; }
.tz-spacer-process .tz-align-center { text-align:center; }
.tz-spacer-process .tz-align-right { text-align:right; }
.tz-spacer-process .tz-align-center h1, .tz-spacer-process .tz-align-center h2 { margin-left:auto; margin-right:auto; }
.tz-spacer-process .tz-hl { color:var(--tz-accent, var(--tz-yellow)); }
.tz-spacer-process .tz-reveal { opacity:0; transform:translateY(18px); transition:opacity .65s var(--tz-ease),transform .65s var(--tz-ease); }
.tz-spacer-process .tz-reveal.tz-visible { opacity:1; transform:none; }
.tz-spacer-process .tz-spacer-process-head { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; margin-bottom:clamp(36px,5vw,64px); }
.tz-spacer-process .tz-spacer-process-index { font-family:var(--tz-mono); letter-spacing:.2em; color:var(--tz-index-color,var(--tz-muted)); font-weight:var(--tz-index-weight,700); font-size:var(--tz-index-size,11px); line-height:1; }
.tz-spacer-process .tz-spacer-process-rule { position:relative; height:1px; background:var(--tz-line); }
.tz-spacer-process .tz-spacer-process-rule::before { content:""; position:absolute; left:0; top:0; width:56px; height:1px; background:var(--tz-accent,var(--tz-yellow)); }
.tz-spacer-process .tz-spacer-process-label { font-family:var(--tz-mono); letter-spacing:.22em; text-transform:uppercase; color:var(--tz-label-color,var(--tz-muted)); font-weight:var(--tz-label-weight,700); font-size:var(--tz-label-size,10px); line-height:1; }
@media (max-width:640px) { .tz-spacer-process .tz-spacer-process-head { grid-template-columns:auto 1fr; } .tz-spacer-process .tz-spacer-process-label { display:none; } }
.tz-spacer-process .tz-ph { position:relative; display:grid; place-items:center; overflow:hidden; background:repeating-linear-gradient(45deg,rgba(255,255,255,.022) 0 10px,transparent 10px 20px),var(--tz-surface); border:1px dashed rgba(255,255,255,.2); }
.tz-spacer-process .tz-ph::before, .tz-spacer-process .tz-ph::after { content:""; position:absolute; width:14px; height:14px; pointer-events:none; border:1px solid rgba(255,255,255,.28); }
.tz-spacer-process .tz-ph::before { top:10px; left:10px; border-right:0; border-bottom:0; }
.tz-spacer-process .tz-ph::after { bottom:10px; right:10px; border-left:0; border-top:0; }
.tz-spacer-process .tz-ph span { font:600 10px/1.7 var(--tz-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--tz-muted); text-align:center; padding:0 22px; }
.tz-spacer-process .tz-ph span b { display:block; color:rgba(255,255,255,.82); font-size:12px; letter-spacing:.06em; margin-bottom:4px; font-weight:600; }
.tz-spacer-process .tz-ph--vid .tz-ph-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:54px; height:54px; border:1px solid rgba(255,255,255,.32); border-radius:50%; }
.tz-spacer-process .tz-ph--vid .tz-ph-play::before { content:""; position:absolute; top:50%; left:54%; transform:translate(-50%,-50%); width:0; height:0; border-left:11px solid rgba(255,255,255,.6); border-top:7px solid transparent; border-bottom:7px solid transparent; }
.tz-spacer-process .tz-ph--vid span { position:absolute; bottom:16px; left:0; right:0; }
.tz-spacer-process .tz-ph--16x9 { aspect-ratio:16/9; }
.tz-spacer-process .tz-ph--4x3 { aspect-ratio:4/3; }
.tz-spacer-process .tz-ph--1x1 { aspect-ratio:1/1; }
.tz-spacer-process .tz-ph--3x4 { aspect-ratio:3/4; }
.tz-spacer-process .tz-ph--cover { position:absolute; inset:0; height:100%; border:0; }
@media (min-width:768px) { .tz-spacer-process.tz-hide-pc { display:none !important; } }
@media (max-width:767px) { .tz-spacer-process.tz-hide-mobile { display:none !important; } }
@media (prefers-reduced-motion:reduce) { .tz-spacer-process .tz-reveal { opacity:1; transform:none; transition:none; } }

.tz-spacer-process .tz-spacer-process-title { margin:0; max-width:54ch; }
.tz-spacer-process .tz-spacer-process-title .tz-title-line { display:block; white-space:nowrap; color:var(--tz-line-color,var(--tz-white)); font-weight:var(--tz-line-weight,700); font-size:var(--tz-line-size,clamp(32px,5.4vw,62px)); line-height:var(--tz-line-height,1.06); letter-spacing:var(--tz-line-spacing,.01em); }
.tz-spacer-process .tz-spacer-process-steps { display:grid; gap:1px; background:var(--tz-line); border:1px solid var(--tz-line); margin-top:clamp(30px,4vw,52px); }
.tz-spacer-process .tz-spacer-process-step { position:relative; background:var(--tz-bg); padding:clamp(24px,2.6vw,34px); transition:background .3s ease; }
.tz-spacer-process .tz-spacer-process-step::before { content:""; position:absolute; top:0; left:0; width:0; height:2px; background:var(--tz-accent); transition:width .45s var(--tz-ease); }
.tz-spacer-process .tz-spacer-process-step:hover { background:var(--tz-surface); }
.tz-spacer-process .tz-spacer-process-step:hover::before { width:100%; }
.tz-spacer-process .tz-spacer-process-step-no { font-family:var(--tz-display); font-size:clamp(30px,3.4vw,44px); font-weight:700; line-height:1; color:var(--tz-muted); transition:color .3s ease; }
.tz-spacer-process .tz-spacer-process-step:hover .tz-spacer-process-step-no { color:var(--tz-accent); }
.tz-spacer-process .tz-spacer-process-step h3 { margin:16px 0 12px; color:var(--tz-ctitle-color,var(--tz-white)); font-weight:var(--tz-ctitle-weight,700); font-size:var(--tz-ctitle-size,clamp(19px,2vw,25px)); line-height:1.25; font-family:var(--tz-display); }
.tz-spacer-process .tz-spacer-process-step-p { font-size:15px; line-height:1.8; color:var(--tz-cbody-color,var(--tz-white)); font-weight:var(--tz-cbody-weight,400); }
.tz-spacer-process .tz-spacer-process-step-media { margin-top:18px; }
.tz-spacer-process .tz-spacer-process-step-media img, .tz-spacer-process .tz-spacer-process-step-media .tz-ph, .tz-spacer-process .tz-spacer-process-step-media spz-video { width:100%; }
.tz-spacer-process .tz-spacer-process-figcap { margin-top:8px; font:500 11px/1.7 var(--tz-mono); letter-spacing:.08em; color:var(--tz-muted); }
.tz-spacer-process .tz-spacer-process-check { margin-top:clamp(40px,5vw,72px); border:1px solid var(--tz-line); }
.tz-spacer-process .tz-spacer-process-check-hd { padding:18px clamp(20px,2.4vw,30px); border-bottom:1px solid var(--tz-line); font:700 10px/1 var(--tz-mono); letter-spacing:.22em; text-transform:uppercase; color:var(--tz-muted); }
.tz-spacer-process .tz-spacer-process-check-grid { display:grid; gap:1px; background:var(--tz-line); }
.tz-spacer-process .tz-spacer-process-check-cell { background:var(--tz-bg); padding:clamp(22px,2.6vw,30px); transition:background .3s ease; }
.tz-spacer-process .tz-spacer-process-check-cell:hover { background:var(--tz-surface); }
.tz-spacer-process .tz-spacer-process-check-cell b { display:block; color:var(--tz-tval-color,var(--tz-white)); font-weight:var(--tz-tval-weight,700); font-size:var(--tz-tval-size,clamp(18px,1.9vw,23px)); line-height:1.2; font-family:var(--tz-display); transition:color .25s ease; }
.tz-spacer-process .tz-spacer-process-check-cell:hover b { color:var(--tz-accent); }
.tz-spacer-process .tz-spacer-process-check-cell span { display:block; margin-top:10px; color:var(--tz-tcap-color,var(--tz-muted)); font-weight:var(--tz-tcap-weight,600); font-size:var(--tz-tcap-size,10px); letter-spacing:.16em; text-transform:uppercase; font-family:var(--tz-mono); }
@media (min-width:760px) { .tz-spacer-process .tz-spacer-process-steps { grid-template-columns:1fr 1fr; } }
@media (min-width:1180px) { .tz-spacer-process .tz-spacer-process-steps { grid-template-columns:repeat(4,1fr); } }
@media (min-width:640px) { .tz-spacer-process .tz-spacer-process-check-grid { grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px) { .tz-spacer-process .tz-spacer-process-check-grid { grid-template-columns:repeat(5,1fr); } }
.tz-spacer-process-bg { position:absolute; top:0; left:0; right:0; height:var(--tz-bg-height,100%); z-index:0; pointer-events:none; }
.tz-spacer-process-bg img { width:100%; height:100%; object-fit:cover; display:block; }
.tz-spacer-process-bg-overlay { position:absolute; inset:0; background:linear-gradient(0deg,var(--tz-bg-overlay-color,#000) 0%,var(--tz-bg-overlay-color,#000) var(--tz-bg-overlay-mid,0%),transparent var(--tz-bg-overlay-stop,60%)); opacity:calc(var(--tz-bg-overlay-opacity,0) / 100); }