/* ============================================================
   佳为科技 · 烫金材料 B2B — V4 轻奢展厅风（参考蔚来 NIO）
   基调：浅米灰展厅 × 极细字重 × 素金点缀 × 大呼吸留白
   约束：无外部字体/CDN（墙内可用）、移动优先（微信内浏览）
   ============================================================ */

:root {
  /* V4 色板（变量名沿用旧版，值已全部重映射 → 旧页面自动翻装） */
  --bg:       #f7f6f3;   /* 展厅米灰底 */
  --ink:      #2c2a26;   /* 主深字 */
  --ink-2:    #fdfcfa;   /* 白卡 */
  --ink-3:    #f1eee7;   /* 浅卡分层 */
  --paper:    #fdfcfa;   /* 白纸区 */
  --paper-2:  #efece4;   /* 纸面阴影层 */
  --gold:     #b09a5e;   /* 素金 */
  --gold-hi:  #c9b57e;   /* 素金亮 */
  --gold-lo:  #8f7a42;   /* 素金深 */
  --copper:   #a3865a;   /* 辅铜 */
  --tx-dark:  #2c2a26;
  --tx-dim:   #8e8a82;
  --tx-light: #2c2a26;   /* 旧「深底浅字」→ 全站浅底深字 */
  --tx-fade:  #8e8a82;
  --line-d:   #e7e4dd;
  --line-l:   #e7e4dd;

  --f-display: "PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --f-body: "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --f-kai: "Kaiti SC","KaiTi","STKaiti",serif;

  --w: min(92vw, 1160px);
  --r: 22px;              /* 大圆角 */
  --shadow: 0 24px 60px rgba(60,50,20,.09);
  --shadow-s: 0 8px 26px rgba(60,50,20,.07);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--f-body);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.9;
  font-size: 15.5px;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
}

/* 素金字（旧 .foil 沿用：改为素金 + 极缓光泽） */
.foil {
  background: linear-gradient(100deg, var(--gold-lo), var(--gold) 40%, #d8c48c 55%, var(--gold) 70%, var(--gold-lo));
  background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: foilSheen 9s ease-in-out infinite;
}
@keyframes foilSheen { 0%,100%{background-position:0% 0} 50%{background-position:100% 0} }

.grain::before { content:none; }   /* V4 取消颗粒叠层，追求干净 */

.wrap { width: var(--w); margin: 0 auto; }

/* ---------- 导航 ---------- */
.nav {
  position: sticky; top:0; z-index: 50;
  background: rgba(247,246,243,.86); backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line-d);
}
.nav-in { width: var(--w); margin:0 auto; display:flex; align-items:center; justify-content:space-between; height:66px; }
.logo { display:flex; align-items:center; gap:.65rem; text-decoration:none; color:var(--ink); }
.logo-mark { width:46px; height:29px; display:block; }
.logo-txt { display:block; font-family:var(--f-kai); font-size:1.22rem; letter-spacing:.24em; font-weight:400; color:var(--ink); }
.logo small { display:block; font-family:var(--f-body); font-size:.56rem; letter-spacing:.44em; color:var(--tx-dim); font-weight:300; }
.nav-links { display:none; gap:2rem; list-style:none; }
.nav-links a { color:var(--ink); text-decoration:none; font-size:.9rem; letter-spacing:.14em; font-weight:300; padding:.3rem 0; border-bottom:1px solid transparent; transition:.3s; }
.nav-links a:hover, .nav-links a.on { color:var(--gold-lo); border-bottom-color:var(--gold); }
.burger { background:none; border:1px solid var(--line-d); border-radius:10px; color:var(--ink); width:42px; height:42px; font-size:1.05rem; cursor:pointer; }
@media (min-width: 768px) { .nav-links{display:flex} .burger{display:none} }
.m-menu { display:none; border-top:1px solid var(--line-d); background:var(--ink-2); }
.m-menu.open { display:block; }
.m-menu a { display:block; padding:.95rem 4vw; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line-d); letter-spacing:.14em; font-weight:300; }
.m-menu a.on { color:var(--gold-lo); }

/* ---------- Hero ---------- */
.hero { position:relative; overflow:hidden; padding:4.6rem 0 4.2rem; }
.hero::after { content:none; }
.hero-grid { display:grid; grid-template-columns:1fr; gap:2.4rem; align-items:center; }
@media (min-width:960px){ .hero-grid{ grid-template-columns:1.02fr .98fr; } }
.hero-kicker { font-size:.76rem; letter-spacing:.58em; color:var(--tx-dim); margin-bottom:1.2rem; }
.hero h1 { font-weight:200; font-size:clamp(1.9rem, 5.6vw, 3.1rem); line-height:1.42; letter-spacing:.1em; }
.hero h1 b { font-weight:500; }
.hero-sub { margin-top:1.3rem; max-width:32em; color:var(--tx-dim); font-size:.98rem; letter-spacing:.06em; }
.hero-cta { margin-top:2.2rem; display:flex; gap:.9rem; flex-wrap:wrap; }

/* hero 产品图：白卡舞台 + 浮动动画 */
.hero-stage {
  background:linear-gradient(175deg,#fdfcfa,#efece4);
  border-radius:26px; box-shadow:var(--shadow);
  padding:1.6rem; position:relative;
}
.hero-stage img { width:100%; display:block; border-radius:16px; animation:floaty 7s ease-in-out infinite; }
@keyframes floaty { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
.hero-stage .cap { position:absolute; left:0; right:0; bottom:.7rem; text-align:center; font-size:.64rem; letter-spacing:.5em; color:var(--tx-dim); }

.btn {
  display:inline-block; text-decoration:none; letter-spacing:.26em; font-size:.9rem; font-weight:300;
  padding:.85rem 2.3rem; border-radius:99px; transition:.35s; border:1px solid transparent;
}
.btn-gold { background:var(--ink); color:#fff; }
.btn-gold:hover { background:#000; transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.16); }
.btn-line { border-color:#cfc9bc; color:var(--ink); }
.btn-line:hover { border-color:var(--gold); color:var(--gold-lo); transform:translateY(-2px); }

/* 数据条：极细数字 */
.stats { display:grid; grid-template-columns:repeat(2,1fr); gap:0; margin-top:3rem; border-top:1px solid var(--line-d); border-bottom:1px solid var(--line-d); background:none; border-left:none; border-right:none; }
.stat { background:transparent; padding:1.9rem .8rem; text-align:center; }
.stat b { display:block; font-family:var(--f-display); font-weight:100; font-size:2.4rem; letter-spacing:.02em; color:var(--ink); }
.stat b.foil { -webkit-text-fill-color:currentColor; background:none; animation:none; }
.stat span { font-size:.72rem; color:var(--tx-dim); letter-spacing:.4em; }
@media (min-width:768px){ .stats{grid-template-columns:repeat(4,1fr)} }

/* ---------- 区块 ---------- */
.sec { position:relative; padding:4.6rem 0; }
.sec-paper { background:var(--paper); }
.sec-head { margin-bottom:2.6rem; text-align:center; }
.sec-num { font-size:.68rem; letter-spacing:.52em; color:var(--gold-lo); }
.sec h2 { font-weight:200; font-size:clamp(1.5rem,4.2vw,2.2rem); letter-spacing:.18em; margin-top:.4rem; }
.sec h2 b { font-weight:500; }
.sec-sub { margin:.7rem auto 0; color:var(--tx-dim); max-width:38em; font-size:.9rem; letter-spacing:.08em; }

/* 卡片 */
.grid { display:grid; gap:1.1rem; }
.g2 { grid-template-columns:1fr; } .g3 { grid-template-columns:1fr; } .g4 { grid-template-columns:repeat(2,1fr); }
@media (min-width:768px){ .g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)} }

.card {
  border:1px solid var(--line-d); background:var(--ink-2); border-radius:var(--r);
  padding:1.9rem 1.7rem; position:relative; transition:.4s cubic-bezier(.2,.7,.3,1);
  box-shadow:var(--shadow-s);
}
.card:hover { transform:translateY(-7px); box-shadow:var(--shadow); border-color:rgba(176,154,94,.55); }
.card h3 { font-weight:500; font-size:1.05rem; letter-spacing:.14em; margin-bottom:.5rem; }
.card p { font-size:.86rem; color:var(--tx-dim); font-weight:300; }
.card .tag { position:absolute; top:1.3rem; right:1.4rem; font-size:.64rem; letter-spacing:.3em; color:var(--gold-lo); }
.card-dark { background:var(--ink-2); border-color:var(--line-d); }
.card-dark h3 { color:var(--ink); }
.card-dark p { color:var(--tx-dim); }
.card-dark:hover { box-shadow:var(--shadow); }

/* 品牌墙：白卡格 */
.brandwall { display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; background:none; border:none; }
@media (min-width:768px){ .brandwall{grid-template-columns:repeat(5,1fr)} }
.brand {
  background:var(--ink-2); border:1px solid var(--line-d); border-radius:16px;
  aspect-ratio:16/10; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.2rem;
  transition:.35s; position:relative; overflow:hidden; box-shadow:var(--shadow-s);
}
.brand:hover { transform:translateY(-5px); box-shadow:var(--shadow); border-color:rgba(176,154,94,.5); }
.brand b { font-family:Didot,Georgia,serif; font-size:1.06rem; letter-spacing:.14em; font-weight:600; }
.brand b.foil { -webkit-text-fill-color:currentColor; background:none; animation:none; color:var(--gold-lo); }
.brand span { font-size:.66rem; letter-spacing:.26em; color:var(--tx-dim); }
.brand em, .brand .src { font-style:normal; font-size:.58rem; color:var(--copper); letter-spacing:.22em; position:absolute; bottom:.6rem; }

/* 步骤 */
.steps { counter-reset:s; }
.step { position:relative; padding:1.5rem 1.4rem 1.5rem 4.6rem; border:1px solid var(--line-d); background:var(--ink-2); border-radius:18px; box-shadow:var(--shadow-s); }
.step + .step { margin-top:.8rem; }
.step::before {
  counter-increment:s; content:"0" counter(s);
  position:absolute; left:1.4rem; top:1.4rem;
  font-family:Didot,Georgia,serif; font-size:1.5rem; color:var(--gold); font-weight:400;
}
.step h3 { font-size:.98rem; font-weight:500; letter-spacing:.1em; color:var(--ink) !important; }
.step p { font-size:.85rem; color:var(--tx-dim) !important; }

/* 表格 */
.tbl { width:100%; border-collapse:separate; border-spacing:0; font-size:.88rem; background:var(--ink-2); border-radius:16px; overflow:hidden; box-shadow:var(--shadow-s); border:1px solid var(--line-d); color:var(--ink) !important; }
.tbl th, .tbl td { border-bottom:1px solid var(--line-d); padding:.85rem 1rem; text-align:left; vertical-align:top; }
.tbl tr:last-child td { border-bottom:none; }
.tbl th { background:var(--ink-3); letter-spacing:.14em; white-space:nowrap; font-weight:500; }
.tbl-scroll { overflow-x:auto; }

/* 微信 CTA：白卡大圆角 */
.wx-band { background:none; border:none; padding:4.2rem 0; text-align:center; position:relative; }
.wx-band .wrap { background:var(--ink-2); border:1px solid var(--line-d); border-radius:28px; box-shadow:var(--shadow); padding:3.4rem 6vw; }
.wx-band h2 { font-weight:200; font-size:clamp(1.35rem,3.8vw,1.9rem); letter-spacing:.16em; }
.wx-band p { color:var(--tx-dim); margin:.8rem auto 1.7rem; max-width:30em; font-size:.9rem; letter-spacing:.08em; }

/* 页脚 */
footer { padding:3rem 0 2.4rem; border-top:1px solid var(--line-d); font-size:.84rem; color:var(--tx-dim); background:var(--paper); }
.foot-grid { display:grid; gap:2rem; grid-template-columns:1fr; }
@media (min-width:768px){ .foot-grid{grid-template-columns:2fr 1fr 1fr} }
footer h4 { color:var(--ink); letter-spacing:.2em; margin-bottom:.8rem; font-size:.92rem; font-weight:500; }
footer h4.foil { -webkit-text-fill-color:currentColor; background:none; animation:none; }
footer a { color:var(--tx-dim); text-decoration:none; display:block; padding:.18rem 0; font-weight:300; }
footer a:hover { color:var(--gold-lo); }
.foot-note { margin-top:2.2rem; padding-top:1.2rem; border-top:1px solid var(--line-d); font-size:.72rem; letter-spacing:.1em; display:flex; flex-wrap:wrap; gap:.6rem 2rem; }

/* 内页头 */
.page-head { padding:3.8rem 0 2.8rem; border-bottom:1px solid var(--line-d); position:relative; overflow:hidden; text-align:center; }
.page-head h1 { font-weight:200; font-size:clamp(1.7rem,5.2vw,2.5rem); letter-spacing:.16em; }
.page-head p { color:var(--tx-dim); margin:.8rem auto 0; max-width:40em; font-size:.92rem; letter-spacing:.06em; }
.crumb { font-size:.68rem; letter-spacing:.34em; color:var(--tx-dim); margin-bottom:1rem; }
.crumb a { color:var(--tx-dim); text-decoration:none; }
.crumb a:hover { color:var(--gold-lo); }

/* 进场动画：柔和上浮 + 交错延迟 */
.rv { opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.2,.7,.3,1), transform .9s cubic-bezier(.2,.7,.3,1); }
.rv.in { opacity:1; transform:none; }
.grid > .rv:nth-child(2) { transition-delay:.08s; }
.grid > .rv:nth-child(3) { transition-delay:.16s; }
.grid > .rv:nth-child(4) { transition-delay:.24s; }
.grid > .rv:nth-child(5) { transition-delay:.3s; }
.grid > .rv:nth-child(6) { transition-delay:.36s; }
.grid > .rv:nth-child(7) { transition-delay:.42s; }
.grid > .rv:nth-child(8) { transition-delay:.48s; }

/* 视差 */
.plx { will-change:transform; }

/* 占位图框 */
.ph {
  aspect-ratio:4/3; border:1px dashed rgba(176,154,94,.5); border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  color:var(--tx-dim); font-size:.74rem; letter-spacing:.34em;
  background:repeating-linear-gradient(45deg, transparent 0 16px, rgba(176,154,94,.06) 16px 32px);
}
.qr-box { width:190px; height:190px; margin:0 auto; border:1px solid var(--line-d); border-radius:18px; display:flex; align-items:center; justify-content:center; background:var(--ink-3); color:var(--tx-dim); font-size:.72rem; letter-spacing:.3em; }

/* ---------- 品牌跑马灯（浅底版） ---------- */
.marquee { overflow:hidden; border-top:1px solid var(--line-d); border-bottom:1px solid var(--line-d); background:var(--paper); padding:1rem 0; }
.marquee-track { display:flex; gap:3.4rem; width:max-content; animation:marq 40s linear infinite; }
.marquee:hover .marquee-track { animation-play-state:paused; }
.marquee span { font-family:Didot,Georgia,serif; font-size:.95rem; letter-spacing:.2em; color:var(--tx-dim); white-space:nowrap; font-weight:300; }
.marquee span b { color:var(--gold-lo); font-weight:600; }
@keyframes marq { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ---------- 电化铝结构（浅色精修版） ---------- */
.stack-wrap { display:grid; gap:2.2rem; align-items:start; }
@media (min-width:900px){ .stack-wrap{grid-template-columns:1.12fr .88fr} }
.stack { display:flex; flex-direction:column; gap:5px; }
.stack .layer {
  position:relative; border-radius:12px; padding:.8rem 1.15rem; overflow:hidden;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  transition:margin .8s cubic-bezier(.2,.8,.2,1), box-shadow .4s;
  border:1px solid rgba(0,0,0,.1); box-shadow:0 3px 10px rgba(60,50,20,.06);
}
.stack .layer small { opacity:0; transition:opacity .5s .35s; font-size:.74rem; letter-spacing:.05em; text-align:right; }
.stack.open .layer { margin-bottom:13px; }
.stack.open .layer small { opacity:.92; }
.stack .layer b { font-size:.9rem; letter-spacing:.14em; white-space:nowrap; font-weight:500; }
.l-pet { background:linear-gradient(120deg,#aab6c2,#d6dee6 55%,#bcc7d1); color:#39434d; }
.l-rel { background:linear-gradient(120deg,#e9e3d5,#f6f1e6); color:#5c5442; }
.l-col { background:linear-gradient(120deg,#b09a5e,#e2d3a2 45%,#c9b57e); color:#3d3315; }
.l-alu { background:linear-gradient(120deg,#c4ccd3,#f2f6fa 42%,#d4dce3 62%,#eef3f8); color:#39424b; }
.l-glu { background:linear-gradient(120deg,#d9cba3,#ece2c4); color:#57492a; }
.stack-note { font-size:.8rem; color:var(--tx-dim); margin-top:1.1rem; letter-spacing:.05em; }
.stack-side h3 { font-size:1.1rem; letter-spacing:.16em; margin-bottom:.7rem; font-weight:500; }
.stack-side p { font-size:.88rem; color:var(--tx-dim); margin-bottom:1rem; }
.stack-toggle { background:none; border:1px solid var(--gold); border-radius:99px; color:var(--gold-lo); padding:.55rem 1.6rem; letter-spacing:.24em; cursor:pointer; font-size:.82rem; transition:.3s; }
.stack-toggle:hover { background:var(--gold); color:#fff; }

/* 烫印演示：保留深色小舞台当点缀 */
.press-demo { position:relative; height:225px; border:1px solid var(--line-d); border-radius:18px; background:linear-gradient(180deg,#26221b,#2e2921); overflow:hidden; box-shadow:var(--shadow-s); }
.pd-head { position:absolute; left:50%; top:0; width:120px; height:62px; margin-left:-60px; background:linear-gradient(180deg,#3d3831,#4f4940); border:1px solid #5c554a; border-top:none; border-radius:0 0 8px 8px; animation:pdHead 4.5s ease-in-out infinite; }
.pd-head::after { content:"烫头"; position:absolute; inset:auto 0 8px; text-align:center; font-size:.66rem; letter-spacing:.34em; color:#a99e8a; }
@keyframes pdHead { 0%,12%{transform:translateY(-6px)} 30%,46%{transform:translateY(62px)} 62%,100%{transform:translateY(-6px)} }
.pd-foil { position:absolute; left:-10%; right:-10%; top:126px; height:11px; background:linear-gradient(90deg,#8f7a42,#d8c48c 30%,#b09a5e 55%,#d8c48c 80%,#8f7a42); animation:pdFoil 4.5s ease-in-out infinite; }
@keyframes pdFoil { 0%,58%{transform:translateX(0)} 80%,100%{transform:translateX(90px)} }
.pd-sub { position:absolute; left:0; right:0; bottom:0; height:56px; background:linear-gradient(180deg,#f3eddc,#e2d8c0); }
.pd-sub::after { content:"承印材料"; position:absolute; right:12px; bottom:8px; font-size:.66rem; letter-spacing:.34em; color:#8a7d60; }
.pd-mark { position:absolute; left:50%; bottom:56px; width:96px; height:25px; margin-left:-48px; background:linear-gradient(120deg,#8f7a42,#d8c48c 45%,#b09a5e); clip-path:polygon(6% 100%,0 34%,12% 34%,12% 0,26% 0,26% 34%,40% 34%,40% 12%,58% 12%,58% 34%,74% 34%,74% 0,88% 0,88% 34%,100% 34%,94% 100%); animation:pdMark 4.5s ease-in-out infinite; }
@keyframes pdMark { 0%,44%{opacity:0} 50%,86%{opacity:1} 96%,100%{opacity:0} }
.pd-cap { position:absolute; left:14px; top:11px; font-size:.68rem; letter-spacing:.3em; color:#a99e8a; }
.pd-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:.6rem; margin-top:.7rem; background:none; border:none; }
.pd-steps div { background:var(--ink-2); border:1px solid var(--line-d); border-radius:12px; padding:.65rem .4rem; text-align:center; font-size:.72rem; letter-spacing:.2em; color:var(--tx-dim); }
.pd-steps b { display:block; color:var(--gold-lo); font-family:Didot,Georgia,serif; font-size:.92rem; margin-bottom:.1rem; }

/* ---------- 生产工艺 / 分条 ---------- */
.flow { display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem; background:none; border:none; }
@media (min-width:768px){ .flow{grid-template-columns:repeat(6,1fr)} }
.flow > div { background:var(--ink-2); border:1px solid var(--line-d); border-radius:16px; padding:1.2rem .7rem 1.05rem; text-align:center; box-shadow:var(--shadow-s); transition:.35s; }
.flow > div:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.flow em { font-style:normal; display:block; font-size:.62rem; color:var(--gold-lo); letter-spacing:.34em; margin-bottom:.3rem; font-family:Didot,Georgia,serif; }
.flow b { display:block; font-size:.98rem; margin-bottom:.25rem; letter-spacing:.1em; font-weight:500; }
.flow span { display:block; font-size:.72rem; color:var(--tx-dim); line-height:1.6; }

.slit-visual { margin:1.4rem 0 .6rem; }
.slit-label { font-size:.7rem; letter-spacing:.3em; color:var(--tx-dim); margin-bottom:.45rem; }
.slit-master { height:30px; border-radius:8px; background:linear-gradient(90deg,#8f7a42,#e2d3a2 45%,#b09a5e 75%,#9d8850); box-shadow:var(--shadow-s); }
.slit-arrow { text-align:center; color:var(--gold-lo); font-size:.95rem; padding:.35rem 0; }
.slit-cuts { display:flex; gap:7px; }
.slit-cuts i { height:30px; border-radius:8px; background:linear-gradient(90deg,#9d8850,#e2d3a2 55%,#b09a5e); box-shadow:var(--shadow-s); }

/* ---------- 色卡 ---------- */
.swatch-group { margin-bottom:1.7rem; }
.swatch-group h3 { font-size:.95rem; letter-spacing:.24em; margin-bottom:.75rem; font-weight:500; color:var(--gold-lo) !important; }
.swatches { display:grid; grid-template-columns:repeat(auto-fill,minmax(98px,1fr)); gap:.75rem; }
.sw { border:1px solid var(--line-d); background:var(--ink-2); border-radius:12px; padding:.5rem; box-shadow:var(--shadow-s); transition:.3s; }
.sw:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
.sw i { display:block; height:46px; border-radius:8px; }
.sw span { display:block; font-size:.72rem; letter-spacing:.1em; color:var(--tx-dim); margin-top:.4rem; text-align:center; }
.sw-liangjin i { background:linear-gradient(120deg,#8c6d1c,#f3dc8f 40%,#c9a227 65%,#f8ecc2); }
.sw-yajin i   { background:linear-gradient(120deg,#a8894a,#d9c08a 55%,#b89a5e); }
.sw-xiangbin i{ background:linear-gradient(120deg,#b39d6d,#ecdcb4 45%,#cdb888); }
.sw-meigui i  { background:linear-gradient(120deg,#a86a52,#e8b8a0 45%,#c98d72); }
.sw-gutong i  { background:linear-gradient(120deg,#6e4a26,#b98a52 50%,#8a5f34); }
.sw-liangyin i{ background:linear-gradient(120deg,#8f979e,#f2f6f9 45%,#b6bec5); }
.sw-yayin i   { background:linear-gradient(120deg,#9aa0a5,#cdd3d7 55%,#aab0b5); }
.sw-lasi i    { background:repeating-linear-gradient(90deg,#c3cad0 0 2px,#e9eef2 2px 4px); }
.sw-hong i { background:linear-gradient(120deg,#7e1c1c,#c8452e 55%,#9c2a22); }
.sw-lan i  { background:linear-gradient(120deg,#1d3a6e,#3f6fb5 55%,#28518f); }
.sw-lv i   { background:linear-gradient(120deg,#1d5c38,#3f9668 55%,#2a7048); }
.sw-hei i  { background:linear-gradient(120deg,#17181a,#3a3d42 55%,#232528); }
.sw-bai i  { background:linear-gradient(120deg,#dcdcd8,#fbfbf8 55%,#e9e9e4); border:1px solid #d8d5cc; }
.sw-caihong i { background:linear-gradient(115deg,#e66,#fc6 20%,#6d6 40%,#6cc 60%,#66e 80%,#c6e); }
.sw-suidian i { background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 2px) 0 0/10px 10px, linear-gradient(120deg,#9fb3c8,#e6ecf4 50%,#b8c6d6); }
.sw-sumian i  { background:linear-gradient(105deg,#aab4be 0%,#e8eef4 30%,#b6c1cc 50%,#f0f5fa 72%,#a8b2bc); }
.sw-zhuguang i{ background:linear-gradient(120deg,#d8cfd8,#f6f0ea 40%,#cfd8d4 65%,#f2ece6); }

/* ---------- 品牌产地分组 ---------- */
.brand-region { margin-bottom:2.2rem; }
.brand-region h3 { letter-spacing:.3em; font-size:.88rem; color:var(--gold-lo); margin-bottom:.8rem; display:flex; align-items:center; gap:.9rem; font-weight:500; }
.brand-region h3::after { content:""; flex:1; height:1px; background:var(--line-d); }

/* ---------- 生成图卡（V4 新增） ---------- */
.imgcard { border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow); border:1px solid var(--line-d); background:var(--ink-2); }
.imgcard img { width:100%; display:block; }
.imgcard .cap { padding:.85rem 1.2rem; font-size:.76rem; letter-spacing:.2em; color:var(--tx-dim); text-align:center; }

/* ============ v6：结构图缩小/烫模纹路转移/四种烫印方式/品牌字标 ============ */

/* 结构区：左图右层标 */
.struct-grid { display:grid; gap:1.8rem; align-items:center; }
@media (min-width:900px){ .struct-grid{ grid-template-columns:.9fr 1.1fr; } }

/* 品牌字标（直接以文字商标呈现） */
.brand b { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:1.35rem; letter-spacing:.06em; font-weight:800; color:#33302a; }
.brand b.foil { -webkit-text-fill-color:currentColor; background:none; animation:none; color:#33302a; }
.brand:hover b { color:var(--gold-lo); }

/* 分条设备 spec chips */
.slit-specs { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.slit-specs span { border:1px solid var(--line-d); background:var(--ink-2); border-radius:99px; padding:.32rem 1rem; font-size:.76rem; letter-spacing:.1em; color:var(--tx-dim); }

/* 烫头模具纹路 */
.pd-die {
  position:absolute; left:12px; right:12px; bottom:-13px; height:13px;
  background:linear-gradient(120deg,#8f7a42,#d8c48c 45%,#b09a5e);
  clip-path:polygon(6% 100%,0 34%,12% 34%,12% 0,26% 0,26% 34%,40% 34%,40% 12%,58% 12%,58% 34%,74% 34%,74% 0,88% 0,88% 34%,100% 34%,94% 100%);
  animation:pdDie 4.5s ease-in-out infinite;
}
@keyframes pdDie { 0%,46%{opacity:1} 52%,90%{opacity:0} 96%,100%{opacity:1} }

/* 四种烫印方式卡 */
.modes { display:grid; grid-template-columns:1fr; gap:1rem; margin-top:2.2rem; }
@media (min-width:768px){ .modes{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1080px){ .modes{ grid-template-columns:repeat(4,1fr); } }
.mode { background:var(--ink-2); border:1px solid var(--line-d); border-radius:18px; padding:1.1rem 1.1rem 1.25rem; box-shadow:var(--shadow-s); transition:.35s; }
.mode:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.mode h4 { font-size:.98rem; font-weight:500; letter-spacing:.14em; margin:.75rem 0 .2rem; }
.mode h4 i { font-style:normal; font-size:.62rem; color:var(--gold-lo); letter-spacing:.26em; margin-left:.4rem; }
.mode p { font-size:.76rem; color:var(--tx-dim); line-height:1.7; }
.mstage { position:relative; height:86px; border-radius:12px; background:linear-gradient(180deg,#efece3,#e6e1d4); overflow:hidden; border:1px solid rgba(0,0,0,.05); }

/* 热烫 mini：加热版压下转移 */
.mh-head { position:absolute; left:50%; top:-4px; width:56px; height:26px; margin-left:-28px; background:#4f4940; border-radius:0 0 5px 5px; animation:mhHead 3.6s ease-in-out infinite; }
.mh-head::after { content:""; position:absolute; left:8px; right:8px; bottom:-7px; height:7px; background:linear-gradient(120deg,#8f7a42,#d8c48c,#b09a5e); clip-path:polygon(0 30%,15% 30%,15% 0,35% 0,35% 30%,65% 30%,65% 0,85% 0,85% 30%,100% 30%,92% 100%,8% 100%); animation:mhDie 3.6s ease-in-out infinite; }
@keyframes mhHead { 0%,14%{transform:translateY(0)} 34%,48%{transform:translateY(34px)} 66%,100%{transform:translateY(0)} }
@keyframes mhDie { 0%,48%{opacity:1} 54%,92%{opacity:0} 97%,100%{opacity:1} }
.mh-mark { position:absolute; left:50%; bottom:22px; width:40px; height:9px; margin-left:-20px; background:linear-gradient(120deg,#a8862f,#e2c26e); clip-path:polygon(0 30%,15% 30%,15% 0,35% 0,35% 30%,65% 30%,65% 0,85% 0,85% 30%,100% 30%,92% 100%,8% 100%); animation:mhMark 3.6s ease-in-out infinite; }
@keyframes mhMark { 0%,46%{opacity:0} 52%,90%{opacity:1} 96%,100%{opacity:0} }
.mh-paper { position:absolute; left:0; right:0; bottom:0; height:22px; background:#faf6ea; border-top:1px solid #e2dbc8; }
.mh-note { position:absolute; left:8px; top:6px; font-size:.56rem; letter-spacing:.2em; color:#a89c82; }

/* 冷烫 mini：胶→箔压合→UV固化 */
.mc-paper { position:absolute; left:0; right:0; bottom:0; height:22px; background:#faf6ea; border-top:1px solid #e2dbc8; }
.mc-glue { position:absolute; left:50%; bottom:22px; width:40px; height:9px; margin-left:-20px; border-radius:2px; background:rgba(120,160,220,.55); animation:mcGlue 4.2s linear infinite; }
@keyframes mcGlue { 0%,8%{opacity:0} 12%,38%{opacity:1} 42%,100%{opacity:0} }
.mc-foil { position:absolute; left:-30%; width:60%; top:28px; height:8px; border-radius:2px; background:linear-gradient(90deg,#8f7a42,#d8c48c,#b09a5e); animation:mcFoil 4.2s linear infinite; }
@keyframes mcFoil { 0%,12%{transform:translateX(0)} 34%,56%{transform:translateX(120%)} 58%,100%{transform:translateX(260%)} }
.mc-mark { position:absolute; left:50%; bottom:22px; width:40px; height:9px; margin-left:-20px; border-radius:2px; background:linear-gradient(120deg,#a8862f,#e2c26e); animation:mcMark 4.2s linear infinite; }
@keyframes mcMark { 0%,40%{opacity:0} 46%,92%{opacity:1} 97%,100%{opacity:0} }
.mc-uv { position:absolute; left:50%; top:6px; width:34px; height:12px; margin-left:-17px; border-radius:99px; background:rgba(150,110,255,.35); box-shadow:0 0 14px 5px rgba(150,110,255,.35); animation:mcUV 4.2s linear infinite; }
@keyframes mcUV { 0%,52%{opacity:0} 58%,72%{opacity:1} 78%,100%{opacity:0} }

/* 数码烫 mini：碳粉打印→热辊→变金 */
.md-paper { position:absolute; left:0; right:0; bottom:0; height:22px; background:#faf6ea; border-top:1px solid #e2dbc8; }
.md-ink { position:absolute; left:24%; bottom:22px; width:52%; height:9px; border-radius:2px; background:#3a3733; clip-path:inset(0 100% 0 0); animation:mdInk 4.4s linear infinite; }
@keyframes mdInk { 0%,6%{clip-path:inset(0 100% 0 0)} 30%{clip-path:inset(0 0 0 0)} 100%{clip-path:inset(0 0 0 0)} }
.md-gold { position:absolute; left:24%; bottom:22px; width:52%; height:9px; border-radius:2px; background:linear-gradient(120deg,#a8862f,#e2c26e); clip-path:inset(0 100% 0 0); animation:mdGold 4.4s linear infinite; }
@keyframes mdGold { 0%,40%{clip-path:inset(0 100% 0 0)} 68%{clip-path:inset(0 0 0 0)} 94%,100%{clip-path:inset(0 0 0 0)} }
.md-roller { position:absolute; top:24px; left:-20%; width:16px; height:16px; border-radius:50%; background:linear-gradient(135deg,#6b645a,#8a8478); animation:mdRoll 4.4s linear infinite; }
@keyframes mdRoll { 0%,38%{transform:translateX(0) rotate(0)} 70%{transform:translateX(560%) rotate(360deg)} 71%,100%{transform:translateX(600%) rotate(360deg);opacity:0} }

/* 布料烫 mini：平板压烫 T 恤 */
.mt-cloth { position:absolute; left:50%; bottom:10px; width:64px; height:30px; margin-left:-32px; border-radius:6px 6px 3px 3px; background:#dfe6ea; }
.mt-plate { position:absolute; left:50%; top:-8px; width:74px; height:20px; margin-left:-37px; border-radius:4px; background:#4f4940; animation:mtPlate 4.6s ease-in-out infinite; }
@keyframes mtPlate { 0%,12%{transform:translateY(0)} 30%,60%{transform:translateY(40px)} 78%,100%{transform:translateY(0)} }
.mt-mark { position:absolute; left:50%; bottom:18px; width:34px; height:10px; margin-left:-17px; background:linear-gradient(120deg,#a8862f,#e2c26e); border-radius:2px; animation:mtMark 4.6s ease-in-out infinite; }
@keyframes mtMark { 0%,58%{opacity:0} 66%,94%{opacity:1} 98%,100%{opacity:0} }
.mt-steam { position:absolute; left:50%; top:26px; width:3px; height:10px; margin-left:24px; border-radius:2px; background:rgba(160,150,130,.5); animation:mtSteam 4.6s ease-in-out infinite; }
@keyframes mtSteam { 0%,28%{opacity:0} 36%,56%{opacity:1;transform:translateY(-6px)} 64%,100%{opacity:0} }

/* ============ v7：技术资讯 / 合规 / 参数表 ============ */
.article { max-width:760px; margin:0 auto; }
.article h2 { font-size:1.25rem; font-weight:500; letter-spacing:.1em; margin:2.4rem 0 .8rem; text-align:left; }
.article h3 { font-size:1.02rem; font-weight:500; letter-spacing:.08em; margin:1.6rem 0 .5rem; }
.article p { font-size:.95rem; color:#55524b; margin-bottom:1rem; }
.article ul, .article ol { margin:0 0 1rem 1.4rem; font-size:.95rem; color:#55524b; }
.article li { margin-bottom:.45rem; }
.article blockquote { border-left:3px solid var(--gold); background:var(--ink-3); border-radius:0 12px 12px 0; padding:1rem 1.3rem; margin:1.4rem 0; font-size:.92rem; color:var(--ink); }
.article .meta { font-size:.74rem; letter-spacing:.24em; color:var(--tx-dim); margin-bottom:2rem; }
.news-card { display:flex; flex-direction:column; }
.news-card .nc-tag { font-size:.64rem; letter-spacing:.3em; color:var(--gold-lo); margin-bottom:.5rem; }
.news-card h3 { font-size:1.08rem; }
.news-card p { flex:1; }
.news-card .nc-more { margin-top:.9rem; color:var(--gold-lo); font-size:.84rem; letter-spacing:.1em; text-decoration:none; }
.cert-grid { display:grid; grid-template-columns:1fr; gap:1rem; }
@media(min-width:768px){ .cert-grid { grid-template-columns:repeat(3,1fr); } }
.cert { background:var(--ink-2); border:1px solid var(--line-d); border-radius:18px; padding:1.6rem 1.5rem; box-shadow:var(--shadow-s); text-align:center; }
.cert em { font-style:normal; display:block; font-size:.62rem; letter-spacing:.4em; color:var(--gold-lo); margin-bottom:.5rem; font-family:Didot,Georgia,serif; }
.cert h3 { font-weight:500; letter-spacing:.12em; font-size:1rem; margin-bottom:.4rem; }
.cert p { font-size:.8rem; color:var(--tx-dim); }

/* ============ v8：转移物理版动画（箔层留下·PET移走·带上现缺口） ============ */
.ms2 { position:relative; height:104px; border-radius:12px; background:linear-gradient(180deg,#efece3,#e6e1d4); overflow:hidden; border:1px solid rgba(0,0,0,.05); }
.ms2 .paper2 { position:absolute; left:0; right:0; bottom:0; height:24px; background:#faf6ea; border-top:1px solid #e2dbc8; }
.ms2 .cap2 { position:absolute; left:8px; top:6px; font-size:.56rem; letter-spacing:.22em; color:#a89c82; z-index:6; }

/* 箔带（金）与被用掉的透明缺口 */
.belt { position:absolute; left:-12%; right:-12%; height:9px; background:linear-gradient(90deg,#9d8850,#e2d3a2 40%,#b09a5e 70%,#d8c48c); z-index:2; }
.belt .gap { position:absolute; left:46%; width:44px; height:100%; margin-left:-22px; background:#e9e4d7; opacity:0; border-radius:1px; }

/* —— 热烫：模纹常驻 → 压合 → 金层转移留纸 · 带上现缺口 → 带前移 —— */
.h2-belt { top:52px; animation:h2Belt 5.2s ease-in-out infinite; }
.h2-belt .gap { animation:h2Gap 5.2s ease-in-out infinite; }
@keyframes h2Belt { 0%,72%{transform:translateX(0)} 88%,100%{transform:translateX(52px)} }
@keyframes h2Gap { 0%,49%{opacity:0} 53%,97%{opacity:1} 99%,100%{opacity:0} }
.h2-head { position:absolute; left:50%; top:-8px; width:58px; height:28px; margin-left:-29px; background:#4f4940; border-radius:0 0 5px 5px; z-index:4; animation:h2Head 5.2s ease-in-out infinite; }
.h2-head::after { content:""; position:absolute; left:9px; right:9px; bottom:-6px; height:6px; background:linear-gradient(120deg,#6b5c3e,#8a7952); clip-path:polygon(0 30%,15% 30%,15% 0,35% 0,35% 30%,65% 30%,65% 0,85% 0,85% 30%,100% 30%,92% 100%,8% 100%); }
@keyframes h2Head { 0%,10%{transform:translateY(0)} 22%,46%{transform:translateY(40px)} 58%,100%{transform:translateY(0)} }
.h2-mark { position:absolute; left:50%; bottom:16px; width:44px; height:9px; margin-left:-22px; background:linear-gradient(120deg,#a8862f,#e2c26e); clip-path:polygon(0 30%,15% 30%,15% 0,35% 0,35% 30%,65% 30%,65% 0,85% 0,85% 30%,100% 30%,92% 100%,8% 100%); opacity:0; animation:h2Mark 5.2s ease-in-out infinite; z-index:1; }
@keyframes h2Mark { 0%,49%{opacity:0} 53%,96%{opacity:1} 99%,100%{opacity:0} }

/* —— 冷烫：印UV胶 → 箔带贴合 → UV固化 → 揭离（胶处金留下·带上缺口） —— */
.c2-glue { position:absolute; left:50%; bottom:16px; width:44px; height:9px; margin-left:-22px; border-radius:2px; background:rgba(120,160,220,.5); opacity:0; animation:c2Glue 5.6s linear infinite; z-index:1; }
@keyframes c2Glue { 0%,5%{opacity:0} 9%,44%{opacity:1} 47%,100%{opacity:0} }
.c2-belt { top:34px; animation:c2Belt 5.6s ease-in-out infinite; }
.c2-belt .gap { animation:c2Gap 5.6s linear infinite; }
@keyframes c2Belt { 0%,14%{transform:translateY(0) translateX(0)} 22%,52%{transform:translateY(30px) translateX(0)} 60%,68%{transform:translateY(0) translateX(0)} 82%,100%{transform:translateY(0) translateX(52px)} }
@keyframes c2Gap { 0%,45%{opacity:0} 49%,97%{opacity:1} 99%,100%{opacity:0} }
.c2-uv { position:absolute; left:50%; top:8px; width:36px; height:12px; margin-left:-18px; border-radius:99px; background:rgba(150,110,255,.4); box-shadow:0 0 16px 6px rgba(150,110,255,.4); opacity:0; animation:c2UV 5.6s linear infinite; z-index:5; }
@keyframes c2UV { 0%,26%{opacity:0} 30%,44%{opacity:1} 48%,100%{opacity:0} }
.c2-mark { position:absolute; left:50%; bottom:16px; width:44px; height:9px; margin-left:-22px; border-radius:2px; background:linear-gradient(120deg,#a8862f,#e2c26e); opacity:0; animation:c2Mark 5.6s linear infinite; z-index:1; }
@keyframes c2Mark { 0%,46%{opacity:0} 50%,96%{opacity:1} 99%,100%{opacity:0} }

/* —— 数码烫：碳粉打印 → 箔带贴合热辊压 → 揭离（碳粉处变金·带上缺口） —— */
.d2-ink { position:absolute; left:50%; bottom:16px; width:52px; height:9px; margin-left:-26px; border-radius:2px; background:#3a3733; clip-path:inset(0 100% 0 0); animation:d2Ink 5.6s linear infinite; z-index:1; }
@keyframes d2Ink { 0%,4%{clip-path:inset(0 100% 0 0)} 18%,100%{clip-path:inset(0 0 0 0)} }
.d2-belt { top:34px; animation:d2Belt 5.6s ease-in-out infinite; }
.d2-belt .gap { width:52px; margin-left:-26px; animation:d2Gap 5.6s linear infinite; }
@keyframes d2Belt { 0%,20%{transform:translateY(0) translateX(0)} 27%,55%{transform:translateY(30px) translateX(0)} 62%,70%{transform:translateY(0) translateX(0)} 84%,100%{transform:translateY(0) translateX(56px)} }
@keyframes d2Gap { 0%,48%{opacity:0} 52%,97%{opacity:1} 99%,100%{opacity:0} }
.d2-roller { position:absolute; top:56px; left:14%; width:15px; height:15px; border-radius:50%; background:linear-gradient(135deg,#6b645a,#8a8478); opacity:0; animation:d2Roll 5.6s linear infinite; z-index:5; }
@keyframes d2Roll { 0%,28%{opacity:0;transform:translateX(0) rotate(0)} 32%{opacity:1} 52%{opacity:1;transform:translateX(340%) rotate(300deg)} 56%,100%{opacity:0;transform:translateX(380%) rotate(360deg)} }
.d2-mark { position:absolute; left:50%; bottom:16px; width:52px; height:9px; margin-left:-26px; border-radius:2px; background:linear-gradient(120deg,#a8862f,#e2c26e); opacity:0; animation:d2Mark 5.6s linear infinite; z-index:2; }
@keyframes d2Mark { 0%,50%{opacity:0} 54%,96%{opacity:1} 99%,100%{opacity:0} }

/* —— 布料烫：烫画膜落布 → 平板压烫 → 揭膜（图转移到布·膜变透明） —— */
.t2-cloth { position:absolute; left:50%; bottom:10px; width:66px; height:30px; margin-left:-33px; border-radius:6px 6px 3px 3px; background:#dfe6ea; }
.t2-film { position:absolute; left:50%; bottom:26px; width:48px; height:14px; margin-left:-24px; border:1px solid rgba(120,110,90,.45); border-radius:2px; background:rgba(255,255,255,.35); z-index:3; animation:t2Film 5.6s ease-in-out infinite; }
.t2-film i { position:absolute; inset:2px 6px; background:linear-gradient(120deg,#a8862f,#e2c26e); border-radius:1px; animation:t2Print 5.6s linear infinite; }
@keyframes t2Film { 0%,6%{transform:translateY(-34px);opacity:1} 14%,58%{transform:translateY(0);opacity:1} 68%,84%{transform:translateY(-34px);opacity:1} 92%,100%{transform:translateY(-34px);opacity:0} }
@keyframes t2Print { 0%,55%{opacity:1} 60%,100%{opacity:0} }
.t2-plate { position:absolute; left:50%; top:-10px; width:76px; height:20px; margin-left:-38px; border-radius:4px; background:#4f4940; z-index:4; animation:t2Plate 5.6s ease-in-out infinite; }
@keyframes t2Plate { 0%,16%{transform:translateY(0)} 26%,50%{transform:translateY(44px)} 60%,100%{transform:translateY(0)} }
.t2-mark { position:absolute; left:50%; bottom:32px; width:36px; height:8px; margin-left:-18px; background:linear-gradient(120deg,#a8862f,#e2c26e); border-radius:1px; opacity:0; animation:t2Mark 5.6s linear infinite; z-index:2; }
@keyframes t2Mark { 0%,58%{opacity:0} 64%,96%{opacity:1} 99%,100%{opacity:0} }

/* ============ 涂布生产线动画（放卷→涂离型→涂色→真空镀铝→涂胶→收卷） ============ */
.coat-wrap { overflow-x:auto; }
.coatline { position:relative; min-width:680px; height:210px; border-radius:18px; background:linear-gradient(180deg,#f4f1e8,#eae5d7); border:1px solid var(--line-d); box-shadow:var(--shadow-s); }
.cl-roller { position:absolute; top:64px; width:44px; height:44px; border-radius:50%; border:3px solid #8a8072; background:
  conic-gradient(#c9c2b2 0 25%, #a99f8c 25% 50%, #c9c2b2 50% 75%, #a99f8c 75% 100%); animation:clSpin 5s linear infinite; }
.cl-roller.L { left:3%; }
.cl-roller.R { right:3%; border-color:#9d8850; background:conic-gradient(#e2d3a2 0 25%, #b09a5e 25% 50%, #e2d3a2 50% 75%, #b09a5e 75% 100%); }
@keyframes clSpin { to { transform:rotate(360deg); } }
.cl-belt { position:absolute; left:calc(3% + 44px); right:calc(3% + 44px); top:82px; height:9px;
  background:linear-gradient(90deg,
    rgba(170,180,195,.5) 0 15%,
    #efe8d5 15% 33%,
    #d9b64a 33% 53%,
    #eef1f4 53% 60%, #cfa93e 60% 74%,
    #b0894a 74% 100%); }
.cl-belt::after { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg, rgba(255,255,255,.45) 0 10px, transparent 10px 26px); animation:clFlow 1.3s linear infinite; }
@keyframes clFlow { to { background-position:26px 0; } }
.cl-st { position:absolute; top:36px; width:34px; height:30px; margin-left:-17px; background:#6b6355; border-radius:5px 5px 2px 2px; z-index:2; }
.cl-st::after { content:""; position:absolute; left:50%; bottom:-9px; width:5px; height:9px; margin-left:-2.5px; background:inherit; animation:clDrip 1.6s ease-in-out infinite; }
@keyframes clDrip { 0%,100%{transform:scaleY(.5);opacity:.5} 50%{transform:scaleY(1);opacity:1} }
.cl-st.gold { background:#b09a5e; }
.cl-vac { position:absolute; top:58px; width:88px; height:56px; margin-left:-44px; background:rgba(90,98,110,.92); border-radius:8px; z-index:3; }
.cl-vac::before { content:"真空镀铝"; position:absolute; left:0; right:0; top:6px; text-align:center; font-size:.56rem; letter-spacing:.2em; color:#dfe5ec; }
.cl-vac::after { content:""; position:absolute; left:12px; right:12px; bottom:12px; height:10px; background:linear-gradient(90deg,#dfe5ec,#f6f9fc,#c8d0da); border-radius:2px; animation:clSpark 1.8s ease-in-out infinite; }
@keyframes clSpark { 0%,100%{opacity:.35} 50%{opacity:1} }
.cl-lab { position:absolute; bottom:14px; font-size:.62rem; letter-spacing:.14em; color:#8a7f6a; transform:translateX(-50%); white-space:nowrap; }
.cl-lab i { font-style:normal; display:block; text-align:center; font-family:Didot,Georgia,serif; color:#a3865a; font-size:.58rem; letter-spacing:.3em; }

/* ============ v9：可读性大修 + 箔带双层（PET膜可见）+ 动画质感 ============ */

/* —— 1) 全站字体对比度提升 —— */
:root { --tx-dim:#67624f; --tx-fade:#67624f; }
body { color:#221f1a; }
.hero h1 { font-weight:300; }
.hero h1 b, .sec h2 b, .page-head h1 b { font-weight:600; }
.sec h2, .page-head h1 { font-weight:300; }
.stat b { font-weight:200; }
.hero-sub, .sec-sub, .stack-note { color:#5f5a4d; }
.card p, .mode p, .flow span, .cert p { color:#5a5548; }
.mode p { font-size:.78rem; }
.cl-lab { color:#665c46; font-weight:500; }
.cl-lab i { color:#8a6f3e; }
.ms2 .cap2 { color:#6f6348; font-weight:600; letter-spacing:.18em; }
footer, footer a { color:#67624f; }
.brand span { color:#67624f; }
.marquee span { color:#6b665a; }
.step p, .article p, .article ul, .article ol { color:#4f4b41; }
.tbl td { color:#3a362e !important; }
.news-card p { color:#5a5548; }

/* —— 2) 箔带双层：上 4px = PET 载体膜（可见淡蓝白）· 下 10px = 金层 —— */
.belt {
  height:14px; border-radius:2px;
  background:
    linear-gradient(180deg, rgba(210,226,240,.95), rgba(238,246,252,.8)) top / 100% 4px no-repeat,
    linear-gradient(90deg,#9d8850,#e2d3a2 40%,#b09a5e 70%,#d8c48c) bottom / 100% 10px no-repeat;
  box-shadow:0 2px 6px rgba(60,50,20,.22);
}
.belt::before {
  content:"PET 膜＋箔层"; position:absolute; left:8px; top:-14px;
  font-size:8.5px; letter-spacing:.14em; color:#7d8b99; font-weight:600; white-space:nowrap;
}
/* 缺口 = 金层被转走、PET 膜仍在（半透明膜质感） */
.belt .gap {
  top:4px; height:10px;
  background:rgba(224,236,246,.55);
  border:1px dashed rgba(135,150,165,.7); border-radius:1px;
}
.belt .gap::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 25%, rgba(255,255,255,.9) 42%, transparent 58%);
}

/* —— 3) 动画质感 —— */
.ms2 { background:linear-gradient(180deg,#f3efe4,#e7e1d1); box-shadow:inset 0 2px 12px rgba(60,50,20,.07); }
.ms2 .paper2 { background:linear-gradient(180deg,#fefbf2,#f4eedd); box-shadow:0 -2px 8px rgba(60,50,20,.06); }
.h2-head, .t2-plate { background:linear-gradient(180deg,#5c554a,#38332c); box-shadow:0 4px 10px rgba(0,0,0,.3); }
.h2-head { border-radius:0 0 6px 6px; }
.h2-head::before { content:""; position:absolute; left:6px; right:6px; bottom:-1px; height:2px; border-radius:2px; background:#ff9c5a; opacity:0; animation:h2Heat 5.2s ease-in-out infinite; }
@keyframes h2Heat { 0%,12%{opacity:0} 24%,48%{opacity:.95} 60%,100%{opacity:0} }
.h2-mark, .c2-mark, .d2-mark, .t2-mark { box-shadow:0 1px 4px rgba(120,90,20,.4); }
.c2-glue { box-shadow:0 1px 3px rgba(80,110,160,.3); }
.d2-roller { border:1px solid #57534a; box-shadow:0 2px 6px rgba(0,0,0,.35); }
.t2-film { background:rgba(220,234,246,.5); border:1px solid rgba(145,160,178,.75); }
.t2-film::after { content:""; position:absolute; inset:0; background:linear-gradient(115deg, transparent 28%, rgba(255,255,255,.85) 45%, transparent 60%); }
.t2-film i { box-shadow:0 1px 3px rgba(120,90,20,.35); }
.t2-cloth { background:linear-gradient(180deg,#e4ebef,#d6dfe5); box-shadow:inset 0 1px 4px rgba(0,0,0,.06); }
/* v9.1：belt 标签位置修正（避免被舞台裁切） */
.belt::before { left:15%; }

/* ============ v10：缺口对准金箔位置 + 冷烫/数码烫物理修正 ============ */
/* 缺口一律居中（与纸面金图同一坐标）——揭离时缺口正对留下的金层 */
.belt .gap { left:50%; margin-left:-22px; }
.d2-belt .gap { margin-left:-26px; }
/* 数码烫：底胶（半透明）而非黑碳粉 */
.d2-ink { background:rgba(112,128,152,.55); }
/* 揭离节奏：先原位揭起（缺口正对金图·停一拍）→ 再随带移走 */
@keyframes h2Belt { 0%,72%{transform:translateX(0)} 88%,100%{transform:translateX(64px)} }
@keyframes c2Belt { 0%,14%{transform:translate(0,0)} 22%,52%{transform:translate(0,30px)} 60%,76%{transform:translate(0,0)} 88%,100%{transform:translate(64px,0)} }
@keyframes d2Belt { 0%,20%{transform:translate(0,0)} 27%,55%{transform:translate(0,30px)} 62%,78%{transform:translate(0,0)} 90%,100%{transform:translate(64px,0)} }

/* ============ v14：首页应用六卡（带图一目了然） ============ */
.appcard { padding:0; overflow:hidden; display:block; text-decoration:none; color:var(--ink); }
.appcard .ac-img { aspect-ratio:16/10; overflow:hidden; }
.appcard .ac-img img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.7,.3,1); }
.appcard:hover .ac-img img { transform:scale(1.05); }
.appcard h3 { margin:1rem 1.3rem .15rem; }
.appcard p { margin:0 1.3rem 1.15rem; font-size:.8rem; }
.appcard .credit { display:block; margin:-.8rem 1.3rem .9rem; font-size:.56rem; color:#a09a8c; letter-spacing:.03em; }

/* ============ v15：logo 放大 / 工艺详解链接 / stats 文字格 ============ */
.logo-mark { width:56px; height:35px; }
.logo-txt { font-size:1.45rem; font-weight:500; letter-spacing:.26em; }
.logo small { font-size:.6rem; letter-spacing:.5em; margin-top:.1rem; }
.mode-more { display:inline-block; margin-top:.55rem; color:var(--gold-lo); text-decoration:none; font-size:.78rem; letter-spacing:.14em; border-bottom:1px solid rgba(176,154,94,.4); }
.mode-more:hover { color:var(--ink); border-bottom-color:var(--ink); }
.stat i.stxt { font-style:normal; display:block; font-weight:200; font-size:1.9rem; letter-spacing:.1em; color:var(--ink); line-height:1.35; padding-top:.3rem; }
/* process 页锚点滚动留白 */
.proc-sec { scroll-margin-top:90px; }
.proc-sec h2 { text-align:left; }
.proc-kv { display:flex; flex-wrap:wrap; gap:.5rem; margin:.9rem 0 1.1rem; }
.proc-kv span { border:1px solid var(--line-d); background:var(--ink-2); border-radius:99px; padding:.3rem .95rem; font-size:.76rem; letter-spacing:.08em; color:#5a5548; }

/* ============ v17：工艺剧场「一支箔的旅程」四幕动画 ============ */
.theater { position:relative; border-radius:24px; overflow:hidden; background:linear-gradient(180deg,#f4f0e5,#eae4d4); border:1px solid var(--line-d); box-shadow:var(--shadow); }
.theater svg { width:100%; display:block; }
.th-caption { text-align:center; font-size:.92rem; letter-spacing:.1em; color:#4f4b41; padding:1rem 1.2rem 1.3rem; min-height:3.4em; }
.th-caption b { color:var(--ink); font-weight:600; }
.th-dots { position:absolute; left:0; right:0; bottom:4.6rem; display:flex; justify-content:center; gap:.6rem; }
.th-dot { width:34px; height:4px; border-radius:2px; background:rgba(140,125,90,.25); cursor:pointer; transition:.3s; }
.th-dot.on { background:var(--gold); }
/* 场景显隐：仅当前幕可见，切幕时内部动画重启 */
.scn { opacity:0; visibility:hidden; transition:opacity .6s; }
.theater.act1 .s1, .theater.act2 .s2, .theater.act3 .s3, .theater.act4 .s4 { opacity:1; visibility:visible; }

/* —— 幕1：五层叠合 —— */
.act1 .s1 .ly1 { animation:thSlide .8s .1s cubic-bezier(.2,.7,.3,1) both; }
.act1 .s1 .ly2 { animation:thSlide .8s .55s cubic-bezier(.2,.7,.3,1) both; }
.act1 .s1 .ly3 { animation:thSlide .8s 1.0s cubic-bezier(.2,.7,.3,1) both; }
.act1 .s1 .ly4 { animation:thSlide .8s 1.45s cubic-bezier(.2,.7,.3,1) both; }
.act1 .s1 .ly5 { animation:thSlide .8s 1.9s cubic-bezier(.2,.7,.3,1) both; }
.act1 .s1 .lb  { animation:thFade .6s 2.6s both; }
@keyframes thSlide { from { transform:translateX(620px); opacity:0; } to { transform:none; opacity:1; } }
@keyframes thFade { from { opacity:0; } to { opacity:1; } }

/* —— 幕2：收卷走带 —— */
.act2 .s2 .roll { transform-origin:255px 205px; animation:thSpin 6s linear infinite; }
@keyframes thSpin { to { transform:rotate(360deg); } }
.act2 .s2 .beltflow { stroke-dasharray:14 18; animation:thFlow 1s linear infinite; }
@keyframes thFlow { to { stroke-dashoffset:-32; } }
.act2 .s2 .lb { animation:thFade .6s .8s both; }

/* —— 幕3：烫印转移剖面 —— */
.act3 .s3 .die   { animation:thDie 5.4s ease-in-out infinite; }
@keyframes thDie { 0%,8%{transform:translateY(0)} 20%,42%{transform:translateY(74px)} 54%,100%{transform:translateY(0)} }
.act3 .s3 .gold-stay { opacity:0; animation:thStay 5.4s linear infinite; }
@keyframes thStay { 0%,40%{opacity:0} 46%,96%{opacity:1} 99%,100%{opacity:0} }
.act3 .s3 .gold-gone { opacity:1; animation:thGone 5.4s linear infinite; }
@keyframes thGone { 0%,42%{opacity:1} 47%,97%{opacity:0} 100%{opacity:1} }
.act3 .s3 .gapwin { opacity:0; animation:thGap 5.4s linear infinite; }
@keyframes thGap { 0%,44%{opacity:0} 49%,97%{opacity:1} 100%{opacity:0} }
.act3 .s3 .beltmove { animation:thBelt 5.4s ease-in-out infinite; }
@keyframes thBelt { 0%,62%{transform:translateX(0)} 80%,100%{transform:translateX(96px)} }
.act3 .s3 .lb { animation:thFade .6s .5s both; }

/* —— 幕4：成品 + 分支 —— */
.act4 .s4 .mark4 { animation:thPop .7s .2s cubic-bezier(.2,.7,.3,1) both; transform-origin:480px 235px; }
@keyframes thPop { from { transform:scale(.6); opacity:0; } to { transform:scale(1); opacity:1; } }
.act4 .s4 .shine { animation:thShine 2.6s 1s ease-in-out infinite; }
@keyframes thShine { 0%{transform:translateX(-260px)} 55%,100%{transform:translateX(560px)} }
.act4 .s4 .lb { animation:thFade .6s .9s both; }
.th-links { position:absolute; left:0; right:0; bottom:8.2rem; display:flex; justify-content:center; gap:.7rem; opacity:0; pointer-events:none; transition:.5s .6s; flex-wrap:wrap; }
.theater.act4 .th-links { opacity:1; pointer-events:auto; }
.th-links a { border:1px solid var(--gold); border-radius:99px; color:var(--gold-lo); text-decoration:none; font-size:.8rem; letter-spacing:.18em; padding:.42rem 1.15rem; background:rgba(253,252,250,.85); transition:.25s; }
.th-links a:hover { background:var(--gold); color:#fff; }

/* v18: hero 实拍图授权署名 */
.hero-stage .pic-credit { position:absolute; right:1.1rem; top:.85rem; font-size:.56rem; color:#a09a8c; letter-spacing:.04em; background:rgba(255,255,255,.72); padding:.15rem .45rem; border-radius:6px; }

/* v20: 首页应用预览 10 卡时末排孤儿卡置中（仅 3 栏断点） */
@media (min-width:768px){
  .grid.g3 > a.appcard:last-child:nth-child(3n+1){ grid-column:2; }
}

/* v21: 应用详解 信息化排版（数据砖/对照表/清单/流程/标准胶囊） */
.dt-cols { display:grid; gap:1.5rem; margin-bottom:1.6rem; }
@media (min-width:900px){ .dt-cols{ grid-template-columns:1fr 1fr; } }
.dt-h { font-size:.76rem; letter-spacing:.32em; color:#8a8471; margin:0 0 .85rem; font-weight:600; }
.dt-h i { font-style:normal; color:var(--gold); margin-right:.5rem; }
.pchips { display:grid; grid-template-columns:repeat(2,1fr); gap:.7rem; }
.pchip { background:var(--card,#fff); border-radius:14px; padding:.9rem 1rem .8rem; box-shadow:0 6px 22px rgba(60,50,30,.06); }
.pchip b { display:block; font-size:1.12rem; font-weight:600; letter-spacing:.02em; color:#8a7440; line-height:1.25; }
.pchip span { display:block; font-size:.7rem; letter-spacing:.1em; color:var(--tx-dim); margin-top:.3rem; }
.pchip small { display:block; font-size:.64rem; color:#a49a80; margin-top:.15rem; line-height:1.5; }
.cklist, .pitlist { list-style:none; margin:0; padding:0; }
.cklist li { position:relative; padding-left:1.4rem; margin-bottom:.65rem; font-size:.86rem; line-height:1.75; color:var(--tx-dim); }
.cklist li::before { content:"—"; position:absolute; left:0; color:var(--gold); font-weight:600; }
.pitlist li { position:relative; padding-left:1.7rem; margin-bottom:.8rem; font-size:.86rem; line-height:1.7; color:var(--tx-dim); }
.pitlist li::before { content:"!"; position:absolute; left:0; top:.2rem; width:1.05rem; height:1.05rem; border-radius:50%; background:#efe6d2; color:#8a7440; font-size:.68rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
.pitlist li b { color:var(--ink); font-weight:600; margin-right:.35rem; }
.wsteps { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; margin-bottom:1.6rem; }
.wsteps b { background:var(--card,#fff); border-radius:999px; padding:.5rem 1.15rem; font-size:.8rem; font-weight:500; letter-spacing:.05em; color:var(--ink); box-shadow:0 5px 18px rgba(60,50,30,.07); }
.wsteps i { font-style:normal; color:var(--gold); font-size:.9rem; }
.stdchips { display:flex; flex-wrap:wrap; gap:.5rem; }
.stdchips span { font-size:.67rem; letter-spacing:.04em; padding:.32rem .85rem; border-radius:999px; background:#f0ece2; color:#7d7663; }
.dt-note { margin-top:1.1rem; font-size:.72rem; color:#a49a80; }

/* v22: LOGO E案 中英双语 lockup（墨字中文 + 金字距英文 + 细分隔线） */
.logo { gap:.8rem; }
.logo-sep { width:1px; height:2.1rem; background:#d8d2c2; flex:none; }
.logo-txt { font-size:1.5rem; font-weight:600; letter-spacing:.22em; color:var(--ink); background:none; -webkit-background-clip:initial; background-clip:initial; -webkit-text-fill-color:currentColor; }
.logo small { font-family:var(--f-body); font-size:.58rem; letter-spacing:.32em; color:#8a7440; font-weight:500; margin-top:.2rem; }
footer .foot-grid h4.foil { background:none; -webkit-text-fill-color:currentColor; color:var(--ink); font-weight:600; }
@media (max-width:520px){
  .logo-mark { width:44px; height:28px; }
  .logo-sep { height:1.7rem; }
  .logo-txt { font-size:1.18rem; letter-spacing:.16em; }
  .logo small { font-size:.5rem; letter-spacing:.22em; }
}

/* WeChat QR (contact page) */
.qr-box.qr-live { background:#fff; padding:10px; width:210px; height:210px; }
.qr-box.qr-live img { width:100%; height:100%; object-fit:contain; display:block; }
