/* ---- 本地字体：把 woff2/ttf 放进 assets/fonts/ 即生效，不依赖任何外网 CDN ---- */
@font-face{font-family:"AshionSerifSCVar";font-style:normal;font-weight:100 900;font-display:swap;src:local("Noto Serif SC");}
@font-face{font-family:"AshionSerifSC";font-style:normal;font-weight:400;font-display:swap;src:local("Noto Serif SC"),local("Noto Serif SC Regular"),local("Source Han Serif SC");}
@font-face{font-family:"AshionSerifSC";font-style:normal;font-weight:600;font-display:swap;src:local("Noto Serif SC SemiBold"),local("Source Han Serif SC");}

/* =========================================================
   ASHION JEWELRY — Light Luxury B2B Site
   Palette: ivory / champagne gold / ink  (no dark theme)
   ========================================================= */

:root{
  --ivory:#FCFAF6;
  --paper:#FFFFFF;
  --cream:#F6F1E7;
  --cream-2:#F1EADC;
  --line:#EAE3D6;
  --line-2:#E0D7C5;
  --ink:#191917;
  --ink-2:#57524A;
  --ink-3:#8C867B;
  --gold:#B08D57;
  --gold-l:#D9C3A0;
  --gold-d:#8A6A3C;
  --gold-soft:rgba(176,141,87,.10);
  --r-s:8px; --r-m:14px; --r-l:22px;
  --shadow-1:0 2px 10px rgba(26,26,24,.04);
  --shadow-2:0 18px 46px -20px rgba(138,106,60,.30);
  --shadow-3:0 34px 80px -34px rgba(138,106,60,.42);
  --ease:cubic-bezier(.16,.84,.30,1);
  --nav-h:76px;
  --max:1320px;
  --serif:"AshionSerifSCVar","AshionSerifSC","Cormorant Garamond","Noto Serif SC","Source Han Serif SC","Songti SC",Georgia,serif;
  --sans:"Inter","Noto Sans","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  /* 数字专用字族：无衬线 + 等高 + 等宽数字，避免衬线字体默认的旧式数字（lowercase figures） */
  --num:"Inter","Helvetica Neue",Arial,"Segoe UI",system-ui,sans-serif;
  --ar:"Cairo","Tajawal","Noto Naskh Arabic",system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{
  margin:0;background:var(--ivory);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:clip;
}
body.is-locked{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
ul{margin:0;padding:0;list-style:none}
table{border-collapse:collapse;width:100%}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}

/* ===== 条款 / 隐私政策等长文页 ===== */
.legal{max-width:74ch}
.legal h2{
  font-family:var(--sans);font-size:1.02rem;font-weight:700;letter-spacing:.01em;
  color:var(--ink);margin:36px 0 10px;line-height:1.5;
}
.legal h2:first-child{margin-top:0}
.legal p{margin:0 0 14px;color:var(--ink-2);font-size:15px;line-height:1.9}
.legal ul{margin:0 0 14px;padding-inline-start:20px}
.legal li{list-style:disc;color:var(--ink-2);font-size:15px;line-height:1.9;margin-bottom:6px}
.legal strong{color:var(--ink);font-weight:600}
.legal a{color:var(--gold-d);text-decoration:underline;text-underline-offset:3px}
@media (max-width:640px){
  .legal h2{margin-top:28px}
  .legal p,.legal li{font-size:14.5px}
}

/* ---------- typography ---------- */
.eyebrow{
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-d);font-weight:600;display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--gold-l);display:inline-block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.14;margin:0;letter-spacing:-.005em;color:var(--ink);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
h1{font-size:clamp(2.6rem,5.4vw,4.6rem)}
h2{font-size:clamp(2rem,3.4vw,3.05rem)}
h3{font-size:clamp(1.25rem,1.7vw,1.6rem)}
.lead{font-size:clamp(1rem,1.15vw,1.13rem);color:var(--ink-2);line-height:1.85;max-width:62ch}
.muted{color:var(--ink-3)}
.gold{color:var(--gold-d)}
.serif{font-family:var(--serif)}
.num{
  font-family:var(--num);font-weight:600;letter-spacing:-.01em;
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1,"tnum" 1;
}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:clamp(20px,4vw,48px);min-width:0}
h1,h2,h3,h4,p,li,td,th,.step h4,.step p,.card h3,.card p,.quote p,.pcard__name,.cat h3{overflow-wrap:break-word}
.section{padding-block:clamp(72px,9vw,132px);position:relative}
.section--cream{background:var(--cream)}
.section--paper{background:var(--paper)}
.hairline{height:1px;background:linear-gradient(90deg,transparent,var(--line-2) 12%,var(--line-2) 88%,transparent)}

.sec-head{display:flex;flex-direction:column;gap:16px;margin-bottom:clamp(36px,4.6vw,64px);max-width:820px}
.sec-head.center{margin-inline:auto;text-align:center;align-items:center}
.sec-head.center .eyebrow::before{display:none}
.sec-head.center .eyebrow::after{content:"";width:26px;height:1px;background:var(--gold-l);display:inline-block}

/* ---------- buttons ---------- */
.btn{
  --bg:var(--gold);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;border-radius:999px;font-size:14px;font-weight:600;letter-spacing:.04em;
  background:var(--bg);color:#fff;position:relative;overflow:hidden;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),background .4s ease;
  box-shadow:0 12px 26px -14px rgba(138,106,60,.65);
}
.btn:hover{transform:translateY(-3px);box-shadow:0 20px 34px -16px rgba(138,106,60,.7);background:var(--gold-d)}
.btn:active{transform:translateY(-1px)}
.btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line-2);box-shadow:none}
.btn--ghost:hover{background:var(--paper);border-color:var(--gold-l);color:var(--gold-d);box-shadow:var(--shadow-2)}
.btn--sm{padding:11px 22px;font-size:13px}
.btn--block{width:100%}
/* 禁用态（如购物车为空时的「提交订单」） */
.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}
.btn:disabled:hover{background:var(--bg);transform:none;box-shadow:none}
.btn .ar-row{display:inline-flex}

.link-more{
  display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:600;letter-spacing:.06em;
  color:var(--gold-d);text-transform:uppercase;padding-bottom:4px;position:relative;
}
.link-more::after{content:"";position:absolute;inset-inline-start:0;bottom:0;height:1px;width:100%;background:var(--gold-l);transform-origin:left;transition:transform .6s var(--ease)}
.link-more:hover::after{transform:scaleX(.4)}
.link-more svg{transition:transform .5s var(--ease)}
.link-more:hover svg{transform:translateX(5px)}
[dir="rtl"] .link-more:hover svg{transform:translateX(-5px)}

/* ---------- 区块底部主按钮（查看更多） ----------
   原来是一行小号文字链接，在 4 列大图下面显得太弱；
   改成胶囊按钮 + 右侧金色箭头托盘，hover 抬起、箭头右移。 */
.sec-foot{margin-top:clamp(30px,3.6vw,46px)}
.cta-more{
  display:inline-flex;align-items:center;gap:14px;
  padding:14px 16px 14px 30px;
  background:var(--paper);border:1px solid var(--line-2);border-radius:999px;
  font-size:14.5px;font-weight:600;letter-spacing:.06em;color:var(--ink);
  box-shadow:var(--shadow-1);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .45s ease,color .45s ease;
}
.cta-more__ar{
  width:32px;height:32px;border-radius:999px;flex:0 0 auto;
  display:grid;place-items:center;
  background:var(--gold-soft);color:var(--gold-d);
  transition:background .45s var(--ease),color .45s var(--ease),transform .5s var(--ease);
}
.cta-more:hover{
  transform:translateY(-3px);border-color:var(--gold);color:var(--gold-d);
  box-shadow:var(--shadow-2);
}
.cta-more:hover .cta-more__ar{background:var(--gold);color:#fff;transform:translateX(4px)}
[dir="rtl"] .cta-more:hover .cta-more__ar{transform:translateX(-4px)}

/* ---------- scroll progress ---------- */
.progress{position:fixed;top:0;inset-inline-start:0;height:2px;width:0;z-index:100;background:linear-gradient(90deg,var(--gold-l),var(--gold-d));transition:width .12s linear;pointer-events:none}

/* ---------- header ---------- */
.header{
  position:fixed;inset-inline:0;top:0;z-index:80;height:var(--nav-h);
  display:flex;align-items:center;transition:background .5s ease,box-shadow .5s ease,border-color .5s ease;
  border-bottom:1px solid transparent;
}
.header::before{content:"";position:absolute;inset:0;backdrop-filter:blur(0px);transition:backdrop-filter .5s ease}
.header.is-stuck{background:rgba(253,251,247,.86);border-bottom-color:var(--line)}
.header.is-stuck::before{backdrop-filter:blur(14px)}
.header__inner{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:clamp(20px,4vw,48px);display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.brand img{height:40px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(14px,2vw,30px);margin-inline-start:auto}
.nav a{
  position:relative;font-size:14px;font-weight:500;color:var(--ink-2);padding-block:6px;letter-spacing:.02em;
  transition:color .35s ease;
}
.nav a::after{content:"";position:absolute;inset-inline-start:0;bottom:0;height:1px;width:0;background:var(--gold);transition:width .45s var(--ease)}
.nav a:hover{color:var(--ink)}
.nav a:hover::after,.nav a.is-active::after{width:100%}
.nav a.is-active{color:var(--gold-d);font-weight:600}

.tools{display:flex;align-items:center;gap:6px;margin-inline-start:6px}
.icon-btn{
  width:42px;height:42px;border-radius:999px;display:grid;place-items:center;color:var(--ink);
  border:1px solid transparent;transition:background .35s ease,border-color .35s ease,transform .35s var(--ease);position:relative;
}
.icon-btn:hover{background:var(--paper);border-color:var(--line);transform:translateY(-2px)}
.cart-count{
  position:absolute;top:4px;inset-inline-end:2px;min-width:18px;height:18px;border-radius:999px;
  background:var(--gold);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;padding-inline:4px;
  transform:scale(0);transition:transform .4s var(--ease);
}
.cart-count.is-on{transform:scale(1)}

/* language switcher */
.lang{position:relative}
.lang__btn{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.7);font-size:13px;font-weight:600;transition:.35s var(--ease)}
.lang__btn:hover{border-color:var(--gold-l);background:#fff}
.lang__btn .code{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-d)}
.lang__panel{
  position:absolute;top:calc(100% + 10px);inset-inline-end:0;min-width:210px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-m);box-shadow:var(--shadow-3);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:.4s var(--ease);z-index:90;
}
.lang.is-open .lang__panel{opacity:1;visibility:visible;transform:translateY(0)}
.lang__panel li{list-style:none}
.lang__panel button{
  width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r-s);
  font-size:14px;text-align:start;transition:background .25s ease;
}
.lang__panel button:hover{background:var(--cream)}
.lang__panel button .tick{margin-inline-start:auto;color:var(--gold-d);opacity:0}
.lang__panel button.is-active{background:var(--gold-soft);font-weight:600}
.lang__panel button.is-active .tick{opacity:1}
.lang__panel button .loc{font-size:12px;color:var(--ink-3)}

.burger{display:none;width:42px;height:42px;border-radius:999px;place-items:center;border:1px solid var(--line)}
.burger span{display:block;width:18px;height:1.5px;background:var(--ink);margin:3px 0;transition:.35s var(--ease)}

/* mobile drawer */
.drawer{
  position:fixed;inset:0;z-index:95;background:var(--ivory);padding:110px 28px 40px;
  transform:translateY(-100%);transition:transform .7s var(--ease);overflow-y:auto;
}
.drawer.is-open{transform:translateY(0)}
.drawer a{display:block;font-family:var(--serif);font-size:1.9rem;padding:12px 0;border-bottom:1px solid var(--line)}
.drawer .lang__panel{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;margin-top:20px;background:transparent;border:0}

/* ---------- hero ---------- */
.hero{position:relative;height:100svh;min-height:660px;overflow:hidden;background:var(--cream)}
.hero__slides{position:absolute;inset:0;transform:translate3d(calc(var(--mx,0) * 12px), calc(var(--my,0) * 10px), 0);transition:transform .9s var(--ease)}
.hero__slide{position:absolute;inset:0;opacity:0;transition:opacity 1.4s var(--ease)}
.hero__slide.is-on{opacity:1}
.hero__slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 9s linear}
.hero__slide.is-on img{transform:scale(1)}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(253,251,247,.92) 0%,rgba(253,251,247,.62) 42%,rgba(253,251,247,.18) 72%,rgba(253,251,247,.35) 100%)}
[dir="rtl"] .hero__scrim{background:linear-gradient(270deg,rgba(253,251,247,.92) 0%,rgba(253,251,247,.62) 42%,rgba(253,251,247,.18) 72%,rgba(253,251,247,.35) 100%)}
.hero__content{position:relative;height:100%;display:flex;align-items:center}
.hero__inner{max-width:730px}
.hero__tag{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.78);border:1px solid var(--line);padding:8px 18px;border-radius:999px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);font-weight:600;margin-bottom:26px}
.hero h1{margin-bottom:22px}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line span{display:block;transform:translateY(105%);transition:transform 1.1s var(--ease)}
.hero__slide.is-on ~ * .line span,.hero.is-ready h1 .line span{transform:translateY(0)}
.hero__swap{display:grid;overflow:hidden;margin-bottom:24px}
.hero__swap p{
  grid-area:1/1;margin:0;font-family:var(--serif);font-size:clamp(1.4rem,2.7vw,2.3rem);line-height:1.25;color:var(--gold-d);
  opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);
}
.hero__swap p.is-on{opacity:1;transform:translateY(0)}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero__dots{position:absolute;bottom:38px;inset-inline-start:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:3}
[dir="rtl"] .hero__dots{transform:translateX(50%)}
.hero__dots button{width:30px;height:3px;border-radius:999px;background:rgba(138,106,60,.28);transition:.5s var(--ease)}
.hero__dots button.is-on{background:var(--gold);width:52px}
.hero__scroll{position:absolute;bottom:36px;inset-inline-end:clamp(20px,4vw,48px);display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);z-index:3}
.hero__scroll i{display:block;width:1px;height:44px;background:linear-gradient(var(--gold-l),transparent);animation:drop 2.2s infinite var(--ease)}

/* 手机端首屏修正 --------------------------------------------------------
   原来首屏高度锁死在 92svh 并且垂直居中：手机上一屏装不下这么多内容，
   居中会把顶部（那句 "广州 · 2000年创立…" 的标语）顶到固定导航条底下，
   文字被半透明导航条压住看不清。
   改成：高度跟着内容走（不再裁切），从导航条下方开始往下排。 */
@media (max-width:760px){
  .hero{height:auto;min-height:92svh;padding-top:calc(var(--nav-h) + 18px);padding-bottom:88px}
  .hero__content{height:auto;align-items:flex-start}
  .hero__tag{
    display:inline-block;text-align:center;border-radius:14px;max-width:100%;
    font-size:10.5px;letter-spacing:.09em;line-height:1.6;padding:7px 15px;margin-bottom:20px;
  }
  .hero h1{font-size:clamp(1.95rem,8.4vw,2.55rem);margin-bottom:16px}
  .hero__swap{margin-bottom:16px}
  .hero__cta{margin-top:26px;gap:11px}
  .hero__cta .btn{flex:1 1 100%;justify-content:center}
  .hero__dots{bottom:24px}
  .hero__scroll{display:none}
}
@keyframes drop{0%{transform:scaleY(.2);transform-origin:top;opacity:0}40%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);transform-origin:bottom;opacity:0}}

/* ---------- strength strip：数据横条 ----------
   不做"每格一个边框"的表格，改成上下两条细线夹出来的一条数据带，
   格与格之间只用一段短竖线分隔 —— 留白多，读起来轻。 */
.stats{
  display:grid;grid-template-columns:repeat(7,minmax(0,1fr));
  border-block:1px solid var(--line);
}
.stat{
  position:relative;min-width:0;text-align:center;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  padding:clamp(24px,2.4vw,34px) 12px;
  transition:background .5s var(--ease);
}
.stat + .stat::before{
  content:"";position:absolute;inset-inline-start:0;top:50%;
  width:1px;height:42px;transform:translateY(-50%);background:var(--line-2);
}
.stat:hover{background:linear-gradient(180deg,rgba(246,241,231,0),rgba(246,241,231,.9))}
/* 7 格里最长的是 "500+ / 200+"，字号必须按最长那格定，短的数字才不会显空、长的不会顶格 */
.stat .num{
  font-family:var(--num);font-size:clamp(1.3rem,1.65vw,1.52rem);font-weight:600;color:var(--gold-d);
  display:block;line-height:1.1;letter-spacing:-.03em;white-space:nowrap;
  font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;
  transition:color .45s var(--ease),transform .55s var(--ease);
}
.stat:hover .num{color:var(--gold);transform:translateY(-3px)}
.stat .k{font-size:12.5px;font-weight:600;letter-spacing:.11em;color:var(--ink-2);display:block;line-height:1.45;transition:color .45s var(--ease)}
.stat:hover .k{color:var(--ink)}
/* 工厂页的 4 格数据条仍带一行小字说明，样式保留 */
.stat .sub{font-size:12px;color:var(--ink-3);margin-top:2px;display:block;line-height:1.55;min-height:2.6em;max-width:17ch;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;letter-spacing:.01em}
.stats--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.stats--4 .stat{padding:clamp(30px,3vw,42px) 24px}
@media (max-width:1200px){
  .stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .stat{padding:30px 16px}
  .stat + .stat::before{display:none}   /* 换行后短竖线会落在行首，去掉 */
}
@media (max-width:900px){
  .stats--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:680px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat{padding:26px 12px;gap:10px}
  .stat .sub{max-width:18ch}
}
@media (max-width:480px){
  .stats--4{grid-template-columns:minmax(0,1fr)}
}

/* ---------- tables ---------- */
.tbl{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden}
.tbl tr{border-bottom:1px solid var(--line)}
.tbl tr:last-child{border-bottom:0}
.tbl th,.tbl td{padding:15px 18px;font-size:14.5px;vertical-align:middle;overflow-wrap:anywhere}
.tbl th{width:1%;white-space:nowrap;text-align:center;font-weight:600;color:var(--gold-d);font-size:14px;letter-spacing:.03em;background:var(--cream)}
.tbl td{text-align:start;color:var(--ink-2)}
@media (max-width:560px){
  .tbl th{white-space:normal;width:auto;font-size:13px}
  .tbl th,.tbl td{padding:13px 14px;font-size:14px}
}
.tbl td strong{color:var(--ink);font-weight:600}

/* ---------- strength cards（能力卡） ----------
   和上面的数据条刻意区分开：这里是左对齐的悬浮卡片，
   鼠标移上去整卡抬起、阴影加深、顶部一条金线从中间展开。 */
.specs{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.5vw,20px);
  margin-top:clamp(22px,2.6vw,34px);
}
/* 选择器写成 .specs .spec 而不是 .spec：卡片带 [data-reveal]，
   入场动画用的是 transition:opacity/transform，权重比单个 .spec 高，
   不提高优先级的话「悬停上浮」和「悬停时不再延迟」都会被吃掉。 */
.specs .spec{
  position:relative;overflow:hidden;min-width:0;
  display:flex;flex-direction:column;justify-content:center;gap:10px;
  padding:clamp(24px,2.3vw,32px) clamp(22px,2.2vw,30px);
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-m);
  transition:opacity .9s var(--ease),transform .55s var(--ease),box-shadow .55s var(--ease),border-color .45s ease;
  transition-delay:var(--d,0ms);
}
.spec::before{
  content:"";position:absolute;inset-inline:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--gold-l),var(--gold),var(--gold-l));
  transform:scaleX(0);transform-origin:center;transition:transform .65s var(--ease);
}
.specs .spec:hover{transform:translateY(-6px);box-shadow:var(--shadow-2);border-color:var(--gold-l);transition-delay:0s}
.spec:hover::before{transform:scaleX(1)}
.spec__k{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-d);line-height:1.4}
.spec__v{font-family:var(--num);font-size:clamp(1.05rem,1.25vw,1.18rem);font-weight:500;color:var(--ink);line-height:1.5;letter-spacing:-.003em;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;text-wrap:balance}
@media (max-width:1000px){
  .specs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .specs{grid-template-columns:minmax(0,1fr)}
}

/* ---------- category grid ---------- */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px)}
.cat{
  position:relative;border-radius:var(--r-l);overflow:hidden;background:var(--paper);border:1px solid var(--line);
  aspect-ratio:1/1.12;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding:22px;isolation:isolate;
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .5s ease;
}
.cat:hover{transform:translateY(-8px);box-shadow:var(--shadow-3);border-color:var(--gold-l)}

/* ---------- category CTA tile ---------- */
.cat--cta{justify-content:center;align-items:center;text-align:center;background:var(--cream);border:1px dashed var(--gold-l);gap:10px}
.cat--cta .cat__cta-ic{width:52px;height:52px;border-radius:999px;background:var(--paper);border:1px solid var(--gold-l);color:var(--gold-d);display:grid;place-items:center;transition:.6s var(--ease)}
.cat--cta h3{font-family:var(--serif);font-size:1.14rem;font-weight:500}
.cat--cta .meta{font-size:12px;color:var(--ink-3);letter-spacing:.04em}
.cat--cta:hover .cat__cta-ic{background:var(--gold);border-color:var(--gold);color:#fff;transform:translateX(4px)}

.cat__img{position:absolute;inset:0;z-index:-2}
.cat__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter 1.2s var(--ease);filter:saturate(.9)}
.cat:hover .cat__img img{transform:scale(1.08)}
.cat::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(253,251,247,.86) 62%,rgba(253,251,247,.96));}
.cat h3{font-size:1.32rem}
.cat .meta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-d);margin-top:6px;display:block}
.cat .go{position:absolute;top:18px;inset-inline-end:18px;width:36px;height:36px;border-radius:999px;background:rgba(255,255,255,.9);display:grid;place-items:center;color:var(--gold-d);opacity:0;transform:translateY(-6px);transition:.5s var(--ease);box-shadow:var(--shadow-1)}
.cat:hover .go{opacity:1;transform:translateY(0)}

/* ---------- service cards ---------- */
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:clamp(16px,2vw,26px)}
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(26px,2.6vw,38px);
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .5s ease;position:relative;overflow:hidden;
}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-2);border-color:var(--gold-l)}
.card .ic{
  width:52px;height:52px;border-radius:14px;background:var(--gold-soft);display:grid;place-items:center;color:var(--gold-d);margin-bottom:20px;
}
.card h3{margin-bottom:12px}
.card p{margin:0;color:var(--ink-2);font-size:15px}
.card__no{position:absolute;top:22px;inset-inline-end:26px;font-family:var(--serif);font-size:2.4rem;color:var(--gold-l);opacity:.5;line-height:1;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* ---------- product grid ---------- */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px)}
.pcard{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;position:relative;
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .5s ease;display:flex;flex-direction:column;
}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-2);border-color:var(--gold-l)}
/* 商品图用 4:3 横图：一屏能多看到几排，滚动距离更短 */
.pcard__media{position:relative;aspect-ratio:1/1;overflow:hidden;background:var(--cream)}
.pcard__media img{width:100%;height:100%;object-fit:contain;transition:transform 1.1s var(--ease),opacity .6s ease}
.pcard__media img.alt{position:absolute;inset:0;opacity:0}
.pcard:hover .pcard__media img.base{opacity:0}
.pcard:hover .pcard__media img.alt{opacity:1;transform:scale(1.06)}
.pcard:hover .pcard__media img.base{transform:scale(1.05)}
.tag{
  position:absolute;top:10px;inset-inline-start:10px;background:rgba(255,255,255,.94);border:1px solid var(--line);
  font-size:9px;letter-spacing:.14em;text-transform:uppercase;padding:4px 8px;border-radius:999px;color:var(--gold-d);font-weight:600;
}
.pcard__body{padding:12px 14px 13px;display:flex;flex-direction:column;gap:4px;flex:1}
.pcard__cat{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.pcard__name{font-family:var(--serif);font-size:1.04rem;line-height:1.3}
.pcard__price{display:flex;align-items:baseline;gap:8px;margin-top:0}
.pcard__price b{font-family:var(--num);font-size:1rem;color:var(--gold-d);font-weight:600;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.pcard__price span{font-size:12px;color:var(--ink-3)}
.pcard__foot{margin-top:auto;padding-top:9px;display:flex;align-items:center;gap:8px}
.qty{display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;flex:0 0 auto}
.qty button{width:32px;height:34px;display:grid;place-items:center;color:var(--ink-2);transition:background .3s ease}
.qty button:hover{background:var(--cream)}
.qty input{width:44px;height:34px;border:0;background:transparent;text-align:center;font:600 14px var(--sans);color:var(--ink);-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.add{width:auto;min-width:64px;height:34px;flex:0 0 auto;padding:0 14px;border-radius:999px;background:var(--ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;transition:.4s var(--ease)}
.add svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.add:hover{background:var(--gold-d)}
.add.is-added{background:var(--gold);box-shadow:0 0 0 3px rgba(176,141,87,.22)}
.add.is-added{background:var(--gold)}

/* 商品卡内的数量控件与购物车按钮：和手机端同比例（36px 高），
   购物车按钮吃掉整行剩余宽度，看起来更饱满；窄屏放不下时自动换行，不会被裁切 */
.pcard__foot{flex-wrap:wrap}
.pcard .qty button{width:32px;height:36px;font-size:15px}
.pcard .qty input{width:38px;height:36px;font-size:13px}
.pcard .add{width:auto;min-width:44px;height:36px;flex:1 1 auto;padding:0 14px}
.pcard .add svg{width:16px;height:16px}
.moq-note{font-size:11px;color:var(--ink-3);letter-spacing:.02em}

/* ---------- catalog layout ---------- */
.pagehead{padding-top:calc(var(--nav-h) + clamp(48px,6vw,88px));padding-bottom:clamp(28px,3vw,44px);background:var(--cream)}
.pagehead .lead{margin-top:14px}
/* 页面导语的第二句单独成行：比挤在同一段里断在半截好读得多 */
.pagehead .lead--sub{margin-top:8px}
.crumb{font-size:12px;color:var(--ink-3);letter-spacing:.08em;display:flex;gap:8px;align-items:center;text-transform:uppercase}
.crumb a:hover{color:var(--gold-d)}

.catalog{display:grid;grid-template-columns:272px 1fr;gap:clamp(20px,2.6vw,40px);align-items:start}
.filters{position:sticky;top:calc(var(--nav-h) + 20px);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:26px 22px}
.fgroup{padding-block:18px;border-bottom:1px solid var(--line)}
.fgroup:first-of-type{padding-top:0}
.fgroup:last-of-type{border-bottom:0;padding-bottom:0}
.fgroup h4{font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);margin-bottom:14px;font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  border:1px solid var(--line);background:var(--ivory);border-radius:999px;padding:8px 14px;font-size:13px;color:var(--ink-2);
  transition:.35s var(--ease);
}
.chip:hover{border-color:var(--gold-l);color:var(--ink)}
.chip.is-on{background:var(--gold);border-color:var(--gold);color:#fff;font-weight:600}
.catbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.catbar .count{font-size:13px;color:var(--ink-3);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.catbar .count b{color:var(--ink);font-weight:600}
/* 排序下拉：原生 <select> 的弹出菜单是系统样式（白底蓝高亮），
   改不了，所以自己做一个 —— 和站内米色/金色体系一致。 */
.sortbox{position:relative;z-index:20;flex:0 0 auto;min-width:186px}
.sortbox__btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  height:38px;padding:0 14px 0 16px;
  border:1px solid var(--line);border-radius:999px;background:var(--paper);
  font-size:13px;color:var(--ink);cursor:pointer;
  transition:border-color .4s ease,box-shadow .4s ease,background .4s ease;
}
.sortbox__btn:hover{border-color:var(--gold-l)}
.sortbox.is-open .sortbox__btn{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft)}
.sortbox__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sortbox__chev{flex:0 0 auto;color:var(--ink-3);transition:transform .4s var(--ease),color .4s ease}
.sortbox.is-open .sortbox__chev{transform:rotate(180deg);color:var(--gold-d)}
.sortbox__panel{
  position:absolute;top:calc(100% + 8px);inset-inline-end:0;z-index:40;
  min-width:100%;margin:0;padding:6px;list-style:none;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-m);
  box-shadow:var(--shadow-3);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s;
}
.sortbox.is-open .sortbox__panel{opacity:1;visibility:visible;transform:translateY(0)}
.sortbox__panel button{
  display:flex;align-items:center;gap:8px;width:100%;
  padding:9px 12px;border-radius:9px;font-size:13px;color:var(--ink-2);
  white-space:nowrap;text-align:start;
  transition:background .3s ease,color .3s ease;
}
.sortbox__panel button:hover{background:var(--cream);color:var(--ink)}
.sortbox__panel button.is-on{background:var(--gold-soft);color:var(--gold-d);font-weight:600}
.sortbox__panel button.is-on::after{content:"✓";margin-inline-start:auto;font-size:12px;color:var(--gold)}
.catbar__tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.search{position:relative;display:flex;align-items:center}
.search input{border:1px solid var(--line);background:var(--paper);border-radius:999px;height:38px;padding:0 38px 0 38px;font-size:13px;width:min(300px,52vw);transition:.35s var(--ease);color:var(--ink)}
.search input:focus{outline:0;border-color:var(--gold-l);background:#fff;box-shadow:0 0 0 3px rgba(176,141,87,.12)}
.search input::placeholder{color:var(--ink-3)}
.search__icon{position:absolute;inset-inline-start:13px;top:50%;transform:translateY(-50%);display:grid;place-items:center;pointer-events:none;color:var(--ink-3)}
.search__icon svg{width:16px;height:16px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.search__icon svg circle{r:6.6}
.search__clear{position:absolute;inset-inline-end:8px;width:24px;height:24px;border-radius:999px;display:grid;place-items:center;font-size:12px;color:var(--ink-3);background:transparent;transition:.3s ease}
.search__clear:hover{background:var(--cream);color:var(--ink)}
@media (max-width:560px){
  .catbar__tools{width:100%}
  .search{flex:1 1 100%}
  .search input{width:100%}
  .sortbox{flex:1 1 100%;min-width:0}
}
.pager{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:44px}
.pager button{min-width:40px;height:40px;border-radius:999px;border:1px solid var(--line);background:var(--paper);font-size:13px;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;transition:.35s var(--ease)}
.pager button:hover{border-color:var(--gold-l);color:var(--gold-d)}
.pager button.is-on{background:var(--gold);border-color:var(--gold);color:#fff;font-weight:600}
.pager button[disabled]{opacity:.32;cursor:not-allowed}
.pager button[disabled]:hover{border-color:var(--line);color:inherit}
.pager .muted{user-select:none}

/* ---------- process steps ---------- */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,1.8vw,22px);position:relative}
.step{position:relative;padding-top:34px}
.step::before{content:"";position:absolute;top:46px;inset-inline-start:0;width:100%;height:1px;background:var(--line-2)}
.step:first-child::before{inset-inline-start:22%;width:78%}
.step:last-child::before{width:22%}
.step__no{
  position:relative;width:46px;height:46px;border-radius:999px;background:var(--paper);border:1px solid var(--gold-l);
  display:grid;place-items:center;font-family:var(--serif);font-size:1.15rem;color:var(--gold-d);z-index:2;
  transition:.6s var(--ease);
}
.step:hover .step__no{background:var(--gold);border-color:var(--gold);color:#fff;transform:translateY(-4px)}
.step h4{margin:18px 0 8px;font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.01em}
.step p{margin:0;font-size:13.5px;color:var(--ink-2)}
.steps--4{grid-template-columns:repeat(4,1fr)}
.steps--3{grid-template-columns:repeat(3,1fr)}

/* ---------- process cards ---------- */
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.pstep{border:1px solid var(--line);border-radius:var(--r-l);background:var(--paper);overflow:hidden;display:flex;flex-direction:column;transition:.6s var(--ease)}
.pstep:hover{transform:translateY(-5px);box-shadow:var(--shadow-2);border-color:var(--gold-l)}
.pstep__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--cream)}
.pstep__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.pstep:hover .pstep__media img{transform:scale(1.05)}
.pstep__no{position:absolute;top:12px;inset-inline-start:12px;width:38px;height:38px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--gold-d);border:1px solid var(--gold-l);display:grid;place-items:center;font-family:var(--num);font-weight:600;font-size:1rem;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;box-shadow:0 6px 18px -10px rgba(138,106,60,.5)}
.pstep__body{padding:20px 22px 24px}
.pstep__body h4{font-size:1.12rem;font-weight:500;margin-bottom:7px}
.pstep__body p{font-size:13.5px;color:var(--ink-2);line-height:1.65}
@media (max-width:1000px){.process{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.process{grid-template-columns:1fr}}

/* ---------- craft ---------- */
.craft{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.craft__item{border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:var(--paper);transition:.7s var(--ease)}
.craft__item:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.craft__item img{width:100%;aspect-ratio:4/3;object-fit:cover}
.craft__body{padding:22px 24px 26px}
.craft__body h3{margin-bottom:8px}
.craft__body p{margin:0;color:var(--ink-2);font-size:14.5px}
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(16px,3vw,40px);align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(28px,3.6vw,52px)}
.vs__side{text-align:center}
.vs__side .num{font-size:clamp(1.8rem,2.6vw,2.4rem);display:block;margin-bottom:6px}
.vs__side.good .num{color:var(--gold-d)}
.vs__side.bad .num{color:var(--ink-3)}
.vs__mid{font-family:var(--serif);font-size:1.3rem;color:var(--gold-l)}

/* ---------- split feature ---------- */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(28px,5vw,84px);align-items:start}
.split__media,.split__body{min-width:0}
.pcard,.card,.quote,.craft__item,.step,.panel{min-width:0}
.split--rev .split__media{order:2}
.split__media{position:relative;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--line);background:var(--cream)}
.split__media > img{width:100%;aspect-ratio:4/3.2;object-fit:cover;transition:transform 1.4s var(--ease)}
.split__media:hover img{transform:scale(1.04)}
.split__media .badge{
  position:absolute;bottom:18px;inset-inline-start:18px;background:rgba(255,255,255,.94);border:1px solid var(--line);
  border-radius:var(--r-s);padding:12px 18px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-d);font-weight:600;
}
.split__body ul{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.split__body li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2);font-size:15px}
.split__body li svg{flex:0 0 auto;margin-top:4px;color:var(--gold)}

/* ---------- testimonials ---------- */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(24px,2.6vw,36px);transition:.7s var(--ease);display:flex;flex-direction:column;gap:18px}
.quote:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.quote .stars{color:var(--gold);letter-spacing:2px;font-size:13px}
.quote p{margin:0;font-family:var(--serif);font-size:1.16rem;line-height:1.6;color:var(--ink);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.quote .who{display:flex;align-items:center;gap:12px;margin-top:auto}
.quote .who .av{width:42px;height:42px;border-radius:999px;background:var(--cream-2);display:grid;place-items:center;font-family:var(--serif);color:var(--gold-d);font-weight:600}
.quote .who b{font-size:14px;font-weight:600}
.quote .who span{display:block;font-size:12px;color:var(--ink-3)}

.marquee{margin-top:56px;overflow:hidden;position:relative;padding-block:26px;border-block:1px solid var(--line);background:var(--paper)}
.marquee__track{display:flex;gap:64px;width:max-content;animation:slide 34s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{font-family:var(--serif);font-size:1.4rem;color:var(--ink-3);letter-spacing:.08em;white-space:nowrap;opacity:.75}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- timeline ---------- */
.timeline{position:relative;padding-inline-start:34px}
.timeline::before{content:"";position:absolute;inset-inline-start:8px;top:8px;bottom:8px;width:1px;background:var(--line-2)}
.tl{position:relative;padding-block:18px}
.tl::before{content:"";position:absolute;inset-inline-start:-30px;top:26px;width:11px;height:11px;border-radius:999px;background:var(--paper);border:2px solid var(--gold);box-shadow:0 0 0 5px var(--ivory)}
.tl .y{font-family:var(--num);font-weight:600;font-size:1.45rem;color:var(--gold-d);line-height:1;letter-spacing:.01em;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.tl p{margin:6px 0 0;color:var(--ink-2)}

/* ---------- gallery（门店实景） ----------
   原来三列、每张才 280px 左右，说明文字 12.5px 还压在照片上，
   随着以后换成真照片会更看不清。现在：两列大图（宽度约翻倍），
   说明文字单独一条放在图片下方，白底深字，任何照片都不会影响阅读。
   注意 figure 默认有 1em 40px 的外边距，不清掉会白白吃掉每张图 80px 宽度。 */
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.gallery .g{
  margin:0;border-radius:var(--r-l);overflow:hidden;position:relative;
  background:var(--paper);border:1px solid var(--line);
  /* 入场淡入用 opacity/transform，必须写进这里，否则会被覆盖成"瞬间出现"；
     transition-delay 继承 data-reveal 的错落节奏 */
  transition:opacity .9s var(--ease),transform .9s var(--ease),box-shadow .55s var(--ease),border-color .45s ease;
  transition-delay:var(--d,0ms);
}
.gallery .g:hover{box-shadow:var(--shadow-2);border-color:var(--gold-l);transition-delay:0s}
.gallery .g img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform 1.3s var(--ease)}
.gallery .g:hover img{transform:scale(1.06)}
.gallery .g.tall{grid-row:span 2}
.gallery .g.tall img{aspect-ratio:auto;height:100%}
.gcap{
  padding:clamp(14px,1.3vw,18px) clamp(18px,1.8vw,24px);
  font-size:clamp(14px,1.05vw,16px);font-weight:600;color:var(--ink);
  letter-spacing:.01em;line-height:1.4;
  background:var(--paper);border-top:1px solid var(--line);
}
@media (max-width:760px){
  .gallery{grid-template-columns:minmax(0,1fr)}
}

/* ---------- map ---------- */
.map{position:relative;border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:var(--cream)}
.map img{width:100%;aspect-ratio:16/8;object-fit:cover}
.map iframe{width:100%;height:450px;border:0;display:block}
.map .pin{position:absolute;top:50%;inset-inline-start:50%;transform:translate(-50%,-50%);text-align:center}
.map .pin b{display:block;background:var(--gold);color:#fff;font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:7px 14px;border-radius:999px;box-shadow:var(--shadow-2);white-space:nowrap}

/* ---------- order ---------- */
.order{display:grid;grid-template-columns:1fr 380px;gap:clamp(24px,3vw,44px);align-items:start}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(24px,2.6vw,36px)}
.panel + .panel{margin-top:clamp(16px,2vw,24px)}
.panel h3{display:flex;align-items:center;gap:14px}
.panel h3 .n{width:34px;height:34px;border-radius:999px;background:var(--gold-soft);color:var(--gold-d);display:grid;place-items:center;font-family:var(--num);font-weight:600;font-size:1rem;flex:0 0 auto;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.field{margin-top:20px}
.field label{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px;font-weight:600}
.field input,.field textarea,.field select{
  width:100%;border:1px solid var(--line);background:var(--ivory);border-radius:var(--r-s);padding:13px 16px;font-size:14.5px;color:var(--ink);
  transition:.35s ease;font-family:inherit;
}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--gold-l);background:#fff;outline:none;box-shadow:0 0 0 4px rgba(176,141,87,.10)}
.field textarea{min-height:110px;resize:vertical}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.radio{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:var(--r-s);padding:14px 16px;background:var(--ivory);cursor:pointer;transition:.35s ease;margin-top:10px}
.radio:hover{border-color:var(--gold-l)}
.radio.is-on{border-color:var(--gold);background:var(--gold-soft)}
.radio input{accent-color:var(--gold);width:18px;height:18px}
.radio b{font-size:14.5px;font-weight:600}
.radio span{display:block;font-size:12.5px;color:var(--ink-3)}

.summary{position:sticky;top:calc(var(--nav-h) + 20px)}
.summary .row{display:flex;justify-content:space-between;gap:12px;padding-block:10px;border-bottom:1px dashed var(--line);font-size:14px}
.summary .row:last-of-type{border-bottom:0}
.summary .row b{font-weight:600}
.summary .row.total{font-size:1.05rem;padding-top:16px}
.summary .row.total b{color:var(--gold-d);font-family:var(--num);font-weight:600;font-size:1.5rem;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.sline{display:flex;gap:12px;align-items:center;padding-block:12px;border-bottom:1px solid var(--line)}
.sline img{width:52px;height:52px;border-radius:10px;object-fit:cover;border:1px solid var(--line)}
.sline .t{flex:1;min-width:0}
.sline .t b{display:block;font-family:var(--serif);font-size:14.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sline .t span{font-size:12px;color:var(--ink-3)}
.op-box{margin-top:18px;border:1px dashed var(--gold-l);background:var(--gold-soft);border-radius:var(--r-m);padding:18px;text-align:center}
.op-box .code{font-family:var(--sans);font-weight:700;letter-spacing:.12em;color:var(--gold-d);font-size:1.05rem}
.op-box small{display:block;color:var(--ink-2);font-size:12.5px;margin-top:6px}
.notice{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-m);padding:20px 24px;margin-top:22px}
.notice li{display:flex;gap:10px;font-size:14px;color:var(--ink-2);padding-block:6px}
.notice li::before{content:"";flex:0 0 auto;width:6px;height:6px;border-radius:999px;background:var(--gold);margin-top:9px}

/* ---------- contact / cta band ---------- */
.band{background:var(--cream);border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(32px,4.4vw,64px);display:grid;grid-template-columns:1.2fr auto;gap:32px;align-items:center}
.band h2{margin-bottom:12px}
.contact-list{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 26px;margin-top:26px}
.contact-list .ci{border-top:1px solid var(--line-2);padding-top:14px}
.contact-list .ci .k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-d);font-weight:700;display:block;margin-bottom:6px}
.contact-list .ci .v{font-size:15px;color:var(--ink-2)}
.socials{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.socials a{width:42px;height:42px;border-radius:999px;border:1px solid var(--line);display:grid;place-items:center;background:var(--paper);transition:.4s var(--ease)}
.socials a:hover{background:var(--gold);border-color:var(--gold);color:#fff;transform:translateY(-3px)}

/* ---------- footer ---------- */
.footer{background:var(--cream);border-top:1px solid var(--line);padding-top:clamp(48px,5vw,80px);margin-top:0}
.footer__grid{
  display:grid;grid-template-columns:1.45fr .85fr 1.35fr;
  gap:clamp(28px,3.4vw,56px);padding-bottom:40px;align-items:start;
}
.fcol{min-width:0}
.footer__logo{height:44px;width:auto;margin-bottom:18px;display:block}
.footer__desc{font-size:13.8px;line-height:1.78;color:var(--ink-2);max-width:44ch;margin-bottom:26px}
.footer h4{
  font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-d);font-weight:700;margin-bottom:16px;
}
.footer h4::after{content:"";display:block;width:26px;height:1px;background:var(--gold-l);margin-top:9px}
.fcol--brand h4{margin-bottom:14px}
.footer a,.footer p{font-size:14px;color:var(--ink-2)}
.footer a:hover{color:var(--gold-d)}
.footer li{padding-block:6px}

/* nav list: tidy, one baseline rhythm */
.flist{list-style:none;margin:0;padding:0}
.flist li{padding:0;margin:0;border-bottom:1px solid var(--line)}
.flist li:last-child{border-bottom:0}
.flist a{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:14.2px;line-height:1.5;transition:color .35s var(--ease),padding-inline-start .35s var(--ease)}
.flist a:hover{padding-inline-start:4px}
.flist .dot{flex:0 0 auto;width:5px;height:5px;border-radius:999px;background:var(--gold-l);transition:.35s var(--ease)}
.flist a:hover .dot{background:var(--gold-d)}

/* contact rows: icon + label + value, all baselines aligned */
.fcontact{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.fcontact li{display:flex;align-items:flex-start;gap:12px;padding:8px 0}
.fcontact .fi{
  flex:0 0 30px;width:30px;height:30px;border-radius:9px;background:var(--paper);
  border:1px solid var(--line);display:grid;place-items:center;color:var(--gold-d);margin-top:1px;
}
.fcontact .fb{display:flex;flex-direction:column;gap:3px;min-width:0}
.fcontact em{font-style:normal;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.fcontact b{font-weight:500;font-size:14.2px;line-height:1.55;color:var(--ink);overflow-wrap:anywhere}
.fcontact b a{font-size:14.2px}

.socials{display:flex;gap:8px;flex-wrap:wrap}
.socials a{
  width:36px;height:36px;border-radius:999px;display:grid;place-items:center;
  background:var(--paper);border:1px solid var(--line);color:var(--ink-2);transition:.4s var(--ease);
}
/* 7 个图标统一 18px，避免 WhatsApp 那个 24px 的比别的大一圈 */
.socials a svg{width:18px;height:18px;display:block}
.socials a:hover{background:var(--gold);border-color:var(--gold);color:#fff;transform:translateY(-2px)}

.footer__bottom{
  border-top:1px solid var(--line);padding-block:20px;
  display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  font-size:12.8px;color:var(--ink-3);
}
.flegal{display:flex;align-items:center;gap:10px}
.flegal i{font-style:normal;color:var(--line-2)}
.footer__bottom a:hover{color:var(--gold-d)}

@media (max-width:1000px){
  .footer__grid{grid-template-columns:1fr 1fr;gap:32px 28px}
  .fcol--brand{grid-column:1/-1}
  .footer__desc{max-width:none}
}
@media (max-width:560px){
  .footer__grid{grid-template-columns:1fr;gap:28px}
  .footer__bottom{justify-content:flex-start}
}


/* ---------- cart drawer ---------- */
.cart-mask{position:fixed;inset:0;z-index:96;background:rgba(25,25,23,.34);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.55s var(--ease)}
.cart-mask.is-on{opacity:1;visibility:visible}
.cdrawer{
  position:fixed;top:0;inset-inline-end:0;height:100dvh;width:min(440px,100vw);z-index:97;
  background:var(--ivory);border-inline-start:1px solid var(--line);display:flex;flex-direction:column;
  transform:translateX(110%);transition:transform .6s var(--ease);box-shadow:-30px 0 70px -40px rgba(138,106,60,.45);
}
[dir="rtl"] .cdrawer{transform:translateX(-110%);box-shadow:30px 0 70px -40px rgba(138,106,60,.45)}
.cdrawer.is-open{transform:translateX(0)}
.cdrawer__head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 24px 18px;border-bottom:1px solid var(--line)}
.cdrawer__head h3{font-size:1.35rem}
.cdrawer__x{width:36px;height:36px;border-radius:999px;display:grid;place-items:center;color:var(--ink-2);border:1px solid var(--line);transition:.35s var(--ease);flex:0 0 auto}
.cdrawer__x:hover{background:var(--paper);color:var(--gold-d);border-color:var(--gold-l)}
.cdrawer__body{flex:1;overflow-y:auto;padding:8px 24px;overscroll-behavior:contain}
.citem{display:grid;grid-template-columns:74px 1fr auto;gap:14px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}
.citem img{width:74px;height:82px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:var(--paper)}
.citem__t{min-width:0}
.citem__t b{display:block;font-family:var(--serif);font-size:1.05rem;font-weight:500;line-height:1.35}
.citem .sku{display:block;font-size:11.5px;letter-spacing:.06em;color:var(--ink-3);margin:4px 0 10px}
.citem__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.citem__amt{font-size:15px;white-space:nowrap;padding-top:2px;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.citem .rm{font-size:11.5px;color:var(--ink-3);text-decoration:underline;text-underline-offset:3px;transition:color .3s ease}
.citem .rm:hover{color:#B4472F}
.cdrawer__empty{padding:56px 0;text-align:center;display:flex;flex-direction:column;align-items:center}
.cdrawer__empty p{margin:0 0 6px;font-family:var(--serif);font-size:1.2rem}
.cdrawer__foot{padding:18px 24px 24px;border-top:1px solid var(--line);background:var(--paper);display:flex;flex-direction:column;gap:10px}
.csum{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.csum b{font-family:var(--num);font-weight:600;font-size:1.5rem;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.cnote{font-size:11.5px;color:var(--ink-3);line-height:1.6;margin:2px 0 0}
@media (max-width:520px){
  .cdrawer{width:100vw}
  .cdrawer__head{padding:18px 18px 14px}
  .cdrawer__body{padding-inline:18px}
  .cdrawer__foot{padding:16px 18px 20px}
}

/* ---------- showroom slider ---------- */
.sslider{position:relative;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--line);background:var(--cream)}
.sslider__stage{position:relative;height:100%;min-height:240px}
.sslider:not([style*="height"]) .sslider__stage{aspect-ratio:4/3;height:auto}
.sslide{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.04);transition:opacity .9s var(--ease),transform 1.6s var(--ease);pointer-events:none}
.sslide.is-on{opacity:1;transform:scale(1);pointer-events:auto}
.sslide img{width:100%;height:100%;object-fit:cover;display:block}
.sslider__nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:999px;background:rgba(255,255,255,.9);color:var(--ink);display:grid;place-items:center;font-size:20px;line-height:1;border:1px solid var(--line);box-shadow:0 8px 22px -14px rgba(138,106,60,.6);transition:.35s var(--ease);opacity:0}
.sslider:hover .sslider__nav{opacity:1}
.sslider__nav.prev{inset-inline-start:12px}
.sslider__nav.next{inset-inline-end:12px}
.sslider__nav:hover{background:var(--gold);color:#fff;border-color:var(--gold)}
.sslider__dots{position:absolute;bottom:14px;inset-inline-start:0;width:100%;display:flex;justify-content:center;gap:8px}
.sslider__dots button{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid rgba(138,106,60,.35);transition:.4s var(--ease)}
.sslider__dots button.is-on{width:22px;background:var(--gold)}
.split__media .sslider .badge{bottom:16px;inset-inline-start:auto}
@media (max-width:900px){.sslider__nav{opacity:1}}

/* ---------- floating buttons ---------- */
.fabs{position:fixed;bottom:26px;inset-inline-end:26px;z-index:70;display:flex;flex-direction:column;gap:12px}
.fab{
  width:56px;height:56px;border-radius:999px;display:grid;place-items:center;color:#fff;background:var(--gold);
  box-shadow:0 16px 34px -14px rgba(138,106,60,.7);transition:.45s var(--ease);position:relative;
}
.fab:hover{transform:translateY(-4px) scale(1.04)}
.fab.wa{background:#1FAE63;box-shadow:0 16px 34px -14px rgba(31,174,99,.6)}
.fab__label{
  position:absolute;inset-inline-end:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(8px);
  background:var(--ink);color:#fff;font-size:12px;padding:7px 13px;border-radius:999px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:.4s var(--ease);
}
.fab:hover .fab__label{opacity:1;transform:translateY(-50%) translateX(0)}

/* ---------- reveal animations ---------- */
[data-reveal]{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0ms);will-change:opacity,transform}
[data-reveal="fade"]{transform:none}
[data-reveal="left"]{transform:translateX(-40px)}
[data-reveal="right"]{transform:translateX(40px)}
[dir="rtl"] [data-reveal="left"]{transform:translateX(40px)}
[dir="rtl"] [data-reveal="right"]{transform:translateX(-40px)}
[data-reveal].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ---------- page transition ---------- */
.page-fade{animation:pageIn .8s var(--ease) both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .cats{grid-template-columns:repeat(2,1fr)}
  .pgrid{grid-template-columns:repeat(3,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:1024px){
  .nav{display:none}
  .burger{display:grid}
  .tools{margin-inline-start:auto}
  .catalog{grid-template-columns:1fr}
  .filters{position:static}
  .order{grid-template-columns:1fr}
  .summary{position:static}
  .steps{grid-template-columns:repeat(2,1fr)}
  .step::before{display:none}
  .split{grid-template-columns:1fr}
  .split--rev .split__media{order:0}
  .cards-3,.craft,.quotes{grid-template-columns:1fr 1fr}
  .band{grid-template-columns:1fr}
}
@media (max-width:860px){
  .header__inner{gap:12px}
  .brand img{height:32px}
  .lang__btn .label{display:none}
  .lang__btn{padding:8px 11px;gap:6px}
  .icon-btn,.burger{width:38px;height:38px}
  .tools{gap:2px}
  .lang__panel{min-width:180px}
}
@media (max-width:720px){
  :root{--nav-h:66px}
  .cats,.pgrid,.cards-3,.craft,.quotes,.steps,.steps--4,.steps--3{grid-template-columns:1fr 1fr}
  .gallery .g.tall{grid-row:auto}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* 只有奇数格时才让最后一格通栏（7 格 → 收尾补齐）；
     首页现在是 8 格，无条件通栏会把第 7 格单丢在左边、第 8 格挤到下一行。 */
  .stats:not(.stats--4)>:last-child:nth-child(odd){grid-column:span 2}
  .contact-list,.grid-2,.footer__grid{grid-template-columns:1fr}
  .vs{grid-template-columns:1fr;gap:18px}
  .vs__mid{transform:rotate(90deg)}
  .fabs{bottom:18px;inset-inline-end:18px}
  .fab{width:50px;height:50px}
  .tbl th,.tbl td{padding:14px 16px;font-size:14px}
  .hero__scroll{display:none}
}
@media (max-width:520px){
  .pgrid,.cats,.cards-3,.craft,.quotes{grid-template-columns:1fr}
}

/* ---------- custom dimensions ---------- */
.dims{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:clamp(14px,1.8vw,22px)}
.dim{display:flex;align-items:flex-start;gap:16px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--r-l);background:var(--paper);transition:.55s var(--ease)}
.dim:hover{transform:translateY(-4px);border-color:var(--gold-l);box-shadow:var(--shadow-1)}
.dim__ico{flex:0 0 52px;width:52px;height:52px;border-radius:14px;background:var(--cream);border:1px solid var(--line);display:grid;place-items:center;transition:.55s var(--ease)}
.dim:hover .dim__ico{background:#fff;border-color:var(--gold-l)}
.dim__ico img{width:30px;height:30px;display:block}
.dim__t{min-width:0}
.dim__t h4{font-family:var(--serif);font-size:1.16rem;font-weight:500;color:var(--ink);margin-bottom:6px;line-height:1.3}
.dim__t p{font-size:13.5px;color:var(--ink-2);line-height:1.68}
@media (max-width:1000px){.dims{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.dims{grid-template-columns:1fr}.dim{padding:18px 20px}.dim__ico{flex-basis:46px;width:46px;height:46px}}

/* ---------- custom process flow ---------- */
.flow{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(10px,1.4vw,20px);justify-items:center;padding-top:8px}
.flowrail{position:absolute;top:44px;inset-inline-start:10%;inset-inline-end:10%;height:1px;background:linear-gradient(90deg,transparent,var(--line-2) 12%,var(--line-2) 88%,transparent);z-index:0}
.fnode{position:relative;z-index:1;width:100%;max-width:230px;text-align:center;display:flex;flex-direction:column;align-items:center}
.fnode__no{width:52px;height:52px;border-radius:999px;background:var(--paper);border:1px solid var(--gold-l);color:var(--gold-d);font-family:var(--serif);font-size:1.25rem;display:grid;place-items:center;margin-bottom:16px;transition:.55s var(--ease);box-shadow:0 0 0 6px var(--cream)}
.fnode:hover .fnode__no{transform:translateY(-3px);box-shadow:0 0 0 6px rgba(176,141,87,.16)}
.fnode h4{font-size:1.02rem;font-weight:600;color:var(--ink);margin-bottom:7px;line-height:1.4}
.fnode p{font-size:12.8px;color:var(--ink-3);line-height:1.6;max-width:20ch;margin-inline:auto}
.fnode--last .fnode__no{background:var(--gold);border-color:var(--gold);color:#fff;box-shadow:0 0 0 6px rgba(176,141,87,.18)}
@media (max-width:900px){
  .flow{grid-template-columns:repeat(2,1fr);gap:26px 18px;justify-content:center}
  .flowrail{display:none}
  .fnode--last{grid-column:1/-1;justify-self:center}
}
@media (max-width:560px){
  .flow{grid-template-columns:1fr;gap:22px}
  .fnode{max-width:100%;flex-direction:row;text-align:start;align-items:flex-start;gap:14px}
  .fnode__no{margin-bottom:0;flex:0 0 46px;width:46px;height:46px;font-size:1.1rem}
  .fnode p{max-width:none}
}


/* ---------- 数字统一 ----------
   衬线字体的数字（尤其 Cormorant）又细又飘，中文里显得扭曲；
   正文里所有阿拉伯数字自动套一层 .num-wrapped，用无衬线等宽数字。 */
.num-wrapped{
  font-family:var(--num);
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1,"tnum" 1;
  letter-spacing:.005em;
}
/* 首屏大标题：更轻、更透气，中文用思源宋体不再回退到系统宋体 */
.hero h1{font-weight:400;letter-spacing:.012em}
.hero__swap p{font-weight:400;letter-spacing:.01em}


/* ================= 首屏排版优化 ================= */
/* 标题：用系统自带的楷体（无需下载），比宋体更有书写感和艺术性；
   字重放轻、字距拉开、行距放宽，去掉"公文感"。 */
.hero h1{
  font-family:"Kaiti SC","KaiTi","STKaiti","楷体","Noto Serif SC","Songti SC",serif;
  font-weight:400;
  letter-spacing:.05em;
  line-height:1.34;
  text-wrap:balance;
}
/* 导语：限制行长让它在手机上自然分成两行，且两行长度均衡；
   不会出现"确认"被拆到下一行那种硬断。 */
.hero .lead{
  max-width:34ch;
  line-height:1.95;
  letter-spacing:.012em;
  text-wrap:balance;
  line-break:strict;
}
@media (max-width:760px){
  .hero .lead{max-width:100%;line-height:1.9}
}


/* ---- 纯文字 LOGO（ASHION，ON 用金色）---- */
.brand__word{
  display:inline-block;
  font-family:var(--serif);
  font-size:1.42rem;
  font-weight:500;
  letter-spacing:.18em;
  color:var(--ink);
  white-space:nowrap;
  line-height:1;
  text-indent:.18em;
}
.brand__word em{font-style:normal;color:var(--gold-d)}
.brand__word--footer{font-size:1.55rem;letter-spacing:.2em;text-indent:.2em}
[dir="rtl"] .brand__word{letter-spacing:.08em;text-indent:0;direction:ltr}


/* ---- 核心服务 区块背景图（图放 assets/img/bg-services.jpg 即生效）----
   白卡片不动，只在整块后面铺一张低调的底图；上面盖一层米色薄雾，
   保证九宫格文字依然清晰。 */
.section:has(.specs){
  background-image:
    linear-gradient(180deg, rgba(250,247,241,.55) 0%, rgba(250,247,241,.42) 45%, rgba(250,247,241,.60) 100%),
    url("../img/bg-services.jpg");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}
/* 遮罩别压得太死，留一点质感 */
@media (min-resolution: 1.5dppx){
  .section:has(.specs){ background-size: cover, cover; }
}


/* ---- 核心服务 区块背景（横纹拉丝，与上方竖纹区分）---- */
#svcTop{
  background-image:
    linear-gradient(180deg, rgba(250,247,241,.62) 0%, rgba(250,247,241,.50) 45%, rgba(250,247,241,.66) 100%),
    url("../img/bg-core.jpg");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
}


/* ================= 首屏大标题：中英文各走各的 =================
   用 unicode-range 把中文单独指到一个字体（楷体），
   拉丁字母则继续用 Cormorant Garamond 的高对比衬线——
   互不干扰，英文不会再掉进等宽回退字体。 */
@font-face{
  font-family:"HeroCJK";
  src: local("Kaiti SC"), local("KaiTi"), local("STKaiti"), local("楷体"),
       local("Noto Serif SC"), local("Source Han Serif SC"), local("Songti SC");
  unicode-range: U+2E80-9FFF, U+3000-303F, U+FF00-FFEF, U+FE30-FE4F;
  font-display: swap;
}
.hero h1{
  font-family:"Cormorant Garamond","HeroCJK",Georgia,serif;
  font-weight:400;
  line-height:1.13;
  letter-spacing:-.006em;
  text-wrap:balance;
}
/* 中文才需要的那点疏朗 */
html[lang^="zh"] .hero h1{
  letter-spacing:.05em;
  line-height:1.34;
}
/* 首屏副标（150,000+ Styles in Stock…）英文也收紧一点 */
.hero__swap p{letter-spacing:-.004em}
html[lang^="zh"] .hero__swap p{letter-spacing:.04em}
/* 导语英文不再拉那么开 */
html:not([lang^="zh"]) .hero .lead{letter-spacing:-.002em;max-width:38ch}


/* ===== 首屏标题：每行不换行、按宽度自动缩放 ===== */
.hero h1{max-width:min(880px,66vw)}
.hero h1 .line span{white-space:nowrap;display:block}
@media (max-width:760px){
  .hero h1{max-width:100%}
}


/* ===== 首屏金色副标：更显眼 + 不断档轮播 ===== */
.hero__swap{min-height:2.6em}
.hero__swap p{
  white-space:nowrap;
  font-size:clamp(1.45rem,2.9vw,2.5rem);
  font-weight:500;
  color:var(--gold-d);
  letter-spacing:.005em;
  transition:opacity .45s var(--ease), transform .45s var(--ease);
  transition-delay:0s;
}
.hero__swap p.is-on{transition-delay:0s}
/* swapfit: 由 JS 逐条缩放到一行 */


/* ===== hero-read：首屏文字与金色背景的对比度 =====
   不用描边（中文笔画细，描边会糊）。改用三件事：
   1) 文字区域的白雾加浓，把背景"压平"
   2) 字色加深一档
   3) 极淡白色光晕当作"隔离层"，和背景分开 */
.hero__scrim{
  background:linear-gradient(90deg,
    rgba(253,251,247,.97) 0%,
    rgba(253,251,247,.88) 38%,
    rgba(253,251,247,.46) 64%,
    rgba(253,251,247,.26) 82%,
    rgba(253,251,247,.38) 100%);
}
[dir="rtl"] .hero__scrim{
  background:linear-gradient(270deg,
    rgba(253,251,247,.97) 0%,
    rgba(253,251,247,.88) 38%,
    rgba(253,251,247,.46) 64%,
    rgba(253,251,247,.26) 82%,
    rgba(253,251,247,.38) 100%);
}
.hero h1{
  color:#17130d;
  text-shadow:0 1px 2px rgba(255,255,255,.65), 0 0 30px rgba(255,255,255,.45);
}
.hero .lead{
  color:#453b2d;
  text-shadow:0 1px 1px rgba(255,255,255,.55);
}
.hero__swap p{
  color:#7d5f2c;
  text-shadow:0 1px 2px rgba(255,255,255,.85), 0 0 22px rgba(255,255,255,.7);
}


/* ===== spec-hover-strong：能力卡悬停要更明显 ===== */
.specs .spec{
  transition:transform .45s cubic-bezier(.22,.61,.36,1),
             box-shadow .45s cubic-bezier(.22,.61,.36,1),
             border-color .3s ease, background .3s ease;
}
.specs .spec:hover{
  transform:translateY(-10px) scale(1.015);
  box-shadow:0 26px 56px -20px rgba(122,92,40,.34), 0 0 0 1px rgba(176,141,87,.35);
  border-color:var(--gold);
  background:#fffdf9;
}
.specs .spec:hover h3{color:var(--gold-d)}
.specs .spec .ic,
.specs .spec svg{transition:transform .45s cubic-bezier(.22,.61,.36,1), color .3s ease}
.specs .spec:hover .ic{transform:scale(1.12) rotate(-4deg)}


/* ===== stats-4col：8 个数据格排成 4 × 2，右下不再落单 ===== */
.stats{
  grid-template-columns:repeat(4,minmax(0,1fr));
  row-gap:0;
}
.stats .stat:nth-child(4n+1)::before{display:none}
.stats .stat:nth-child(n+5){border-top:1px solid var(--line)}
@media (max-width:900px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats .stat:nth-child(2n+1)::before{display:none}
  .stats .stat:nth-child(n+3){border-top:1px solid var(--line)}
}

/* ===== 能力卡悬停：明显到不可能忽略 ===== */
.specs .spec{
  transition:transform .42s cubic-bezier(.2,.7,.3,1),
             box-shadow .42s cubic-bezier(.2,.7,.3,1),
             border-color .3s ease, background .42s ease;
}
.specs .spec:hover{
  transform:translateY(-14px) scale(1.02);
  border-color:var(--gold);
  background:linear-gradient(165deg,#fffdf8 0%,#f8f0e1 100%);
  box-shadow:0 30px 60px -22px rgba(120,88,36,.42),
             0 0 0 1px rgba(176,141,87,.55),
             0 0 34px -6px rgba(176,141,87,.30);
}
.specs .spec:hover .spec__k{color:#8a5f22;letter-spacing:.16em}
.specs .spec:hover .spec__v{color:#12100c;transform:translateY(-1px)}
.specs .spec .spec__v{transition:color .3s ease, transform .42s var(--ease)}


/* ===== hover-contrast-v2：悬停底色必须跟米白背景拉开 ===== */

/* 数据格：悬停 → 纯白实底 + 金内框 + 数字变金并放大 */
.stats .stat{transition:background .4s ease, box-shadow .4s ease, transform .4s ease}
.stats .stat:hover{
  background:#ffffff;
  box-shadow:inset 0 0 0 1px rgba(176,141,87,.45), 0 12px 26px -14px rgba(120,88,36,.35);
  z-index:2;
}
.stats .stat:hover .num{
  color:var(--gold-d);
  transform:translateY(-2px) scale(1.06);
}
.stats .stat .num{transition:color .35s ease, transform .35s cubic-bezier(.2,.7,.3,1)}
.stats .stat:hover .k{color:var(--ink)}

/* 能力卡：悬停 → 深墨实底，金色文字（跟米白底形成强反差） */
.specs .spec:hover{
  background:#1d1913;
  border-color:var(--gold);
  box-shadow:0 32px 64px -24px rgba(28,22,12,.55), 0 0 0 1px rgba(176,141,87,.6);
}
.specs .spec:hover .spec__k{color:#d9b877;letter-spacing:.16em}
.specs .spec:hover .spec__v{color:#f7f1e4}
.specs .spec .spec__k,
.specs .spec .spec__v{transition:color .35s ease}


/* ===== hover-warm-v3：悬停改为暖金实底（不用黑色），并在标题上加金点 ===== */
.specs .spec:hover{
  background:linear-gradient(160deg,#fdf7ea 0%,#f3e5c9 100%);
  border-color:var(--gold);
  box-shadow:0 28px 56px -22px rgba(120,88,36,.38),
             0 0 0 1px rgba(176,141,87,.55);
}
.specs .spec:hover .spec__k{color:#7d5316}
.specs .spec:hover .spec__v{color:#14110b}

/* 小标题放大、加金点，解决"字太小看不清" */
.specs .spec__k{
  font-size:clamp(13.5px,1.02vw,15px);
  font-weight:700;
  letter-spacing:.11em;
  line-height:1.5;
  display:flex;
  align-items:center;
  gap:8px;
}
.specs .spec__k::before{
  content:"";
  width:6px;height:6px;border-radius:50%;
  background:var(--gold);
  flex:0 0 6px;
}
/* 正文也略提一档，层级更清楚 */
.specs .spec__v{font-size:clamp(1.06rem,1.3vw,1.22rem)}


/* ===== seam-soft：纹理块的上边缘做 160px 渐入，消除硬切 ===== */
.section:has(.specs){
  background-image:
    linear-gradient(180deg,
      rgba(253,251,247,1) 0px,
      rgba(253,251,247,.88) 60px,
      rgba(253,251,247,.52) 170px,
      rgba(250,247,241,.44) 48%,
      rgba(250,247,241,.62) 100%),
    url("../img/bg-services.jpg");
  background-size:100% 100%, cover;
  background-position:center, center;
}
#svcTop{
  background-image:
    linear-gradient(180deg,
      rgba(253,251,247,1) 0px,
      rgba(253,251,247,.88) 60px,
      rgba(253,251,247,.58) 170px,
      rgba(250,247,241,.50) 48%,
      rgba(250,247,241,.68) 100%),
    url("../img/bg-core.jpg");
  background-size:100% 100%, cover;
  background-position:center, center;
}


/* ---- 全球客户板块：点阵世界地图（很淡），上边缘渐入 ---- */
#tsvTop{
  background-image:
    linear-gradient(180deg,
      rgba(253,251,247,1) 0px,
      rgba(253,251,247,.90) 60px,
      rgba(250,247,241,.62) 170px,
      rgba(250,247,241,.55) 48%,
      rgba(250,247,241,.72) 100%),
    url("../img/bg-clients.jpg");
  background-size:100% 100%, cover;
  background-position:center, center;
  background-repeat:no-repeat, no-repeat;
}


/* ---- 首页各板块背景：按内容各配一张，全部做上边缘渐入 ---- */
#catTop{
  background-image:
    linear-gradient(180deg, rgba(253,251,247,1) 0px, rgba(253,251,247,.90) 60px,
      rgba(250,247,241,.70) 170px, rgba(250,247,241,.66) 48%, rgba(250,247,241,.80) 100%),
    url('../img/bg-cat.jpg');
  background-size:100% 100%, cover; background-position:center, center; background-repeat:no-repeat, no-repeat;
}
#bsvTop{
  background-image:
    linear-gradient(180deg, rgba(253,251,247,1) 0px, rgba(253,251,247,.92) 60px,
      rgba(250,247,241,.78) 170px, rgba(250,247,241,.72) 48%, rgba(250,247,241,.86) 100%),
    url('../img/bg-satin.jpg');
  background-size:100% 100%, cover; background-position:center, center; background-repeat:no-repeat, no-repeat;
}
#ortvTop{
  background-image:
    linear-gradient(180deg, rgba(253,251,247,1) 0px, rgba(253,251,247,.90) 60px,
      rgba(250,247,241,.70) 170px, rgba(250,247,241,.64) 48%, rgba(250,247,241,.78) 100%),
    url('../img/bg-core.jpg');
  background-size:100% 100%, cover; background-position:center, center; background-repeat:no-repeat, no-repeat;
}


/* ===== 微信二维码弹窗 ===== */
.fab[data-wx]{cursor:pointer}
.wxmodal{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  background:rgba(28,24,18,.55);
  backdrop-filter:blur(6px);
  animation:wxFade .25s ease;
}
.wxmodal[hidden]{display:none}
@keyframes wxFade{from{opacity:0}to{opacity:1}}
.wxmodal__box{
  position:relative;background:#fff;border-radius:18px;
  padding:clamp(22px,3vw,34px);width:min(340px,86vw);text-align:center;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.5);
  animation:wxPop .3s cubic-bezier(.2,.8,.3,1);
}
@keyframes wxPop{from{transform:translateY(14px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.wxmodal__qr img{width:100%;height:auto;display:block;border-radius:10px}
.wxmodal__t{margin:16px 0 0;font-size:15px;color:var(--ink);letter-spacing:.02em}
.wxmodal__x{
  position:absolute;top:10px;inset-inline-end:12px;width:30px;height:30px;
  border-radius:999px;background:transparent;color:var(--ink-3);font-size:18px;line-height:1;
  cursor:pointer;transition:.25s ease;
}
.wxmodal__x:hover{background:var(--cream);color:var(--ink)}


/* ===== 微信弹窗 v2：有头部、有层次、有提示 ===== */
.wxmodal__box{
  width:min(360px,88vw);
  background:linear-gradient(180deg,#fff 0%,#fdfaf4 100%);
  border-radius:22px;
  padding:26px 24px 20px;
  box-shadow:0 50px 100px -34px rgba(30,22,10,.55), 0 0 0 1px rgba(176,141,87,.18);
  text-align:center;
}
.wxmodal__hd{
  display:flex;align-items:center;gap:12px;text-align:start;
  padding-bottom:16px;margin-bottom:18px;
  border-bottom:1px solid rgba(176,141,87,.22);
}
.wxmodal__ic{
  width:40px;height:40px;border-radius:12px;flex:0 0 40px;
  background:linear-gradient(145deg,#e8d6b4,#c9a86a);
  color:#3a2c15;display:grid;place-items:center;
  box-shadow:0 6px 14px -6px rgba(160,120,50,.6);
}
.wxmodal__tt{display:flex;flex-direction:column;gap:5px;min-width:0}
.wxmodal__tt b{font-family:var(--serif);font-size:1.06rem;font-weight:600;color:var(--ink);letter-spacing:.02em;line-height:1.2}
.wxmodal__tt i{font-style:normal;font-size:11.5px;color:var(--ink-3);letter-spacing:.01em;line-height:1.4}
.wxmodal__qr{
  padding:10px;border-radius:16px;background:#fff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06), 0 10px 26px -14px rgba(30,22,10,.28);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s ease;
}
.wxmodal__qr:hover{transform:translateY(-3px) scale(1.015);box-shadow:inset 0 0 0 1px rgba(176,141,87,.35), 0 18px 34px -16px rgba(30,22,10,.34)}
.wxmodal__qr img{width:100%;display:block;border-radius:9px}
.wxmodal__ft{margin:16px 0 0;font-size:11.5px;color:var(--ink-3);letter-spacing:.02em;line-height:1.6}
.wxmodal__x{
  position:absolute;top:14px;inset-inline-end:14px;width:30px;height:30px;border-radius:50%;
  background:rgba(0,0,0,.04);color:var(--ink-2);font-size:16px;line-height:1;cursor:pointer;
  transition:background .25s ease, transform .25s ease, color .25s ease;
}
.wxmodal__x:hover{background:rgba(0,0,0,.1);color:var(--ink);transform:rotate(90deg)}


/* ===== 子页面页头背景：每页按内容配一张，与首页同一套语言 ===== */
.pagehead{
  background-size:cover, cover;
  background-position:center, center;
  background-repeat:no-repeat, no-repeat;
}
#phFactory{background-image:linear-gradient(100deg,rgba(253,251,247,.95) 0%,rgba(253,251,247,.80) 42%,rgba(253,251,247,.42) 100%),url('../img/bg-core.jpg')}
#phStore{background-image:linear-gradient(100deg,rgba(253,251,247,.96) 0%,rgba(253,251,247,.82) 42%,rgba(253,251,247,.46) 100%),url('../img/bg-satin.jpg')}
#phCustom{background-image:linear-gradient(100deg,rgba(253,251,247,.96) 0%,rgba(253,251,247,.84) 42%,rgba(253,251,247,.50) 100%),url('../img/bg-cat.jpg')}
#phOrder{background-image:linear-gradient(100deg,rgba(253,251,247,.96) 0%,rgba(253,251,247,.82) 42%,rgba(253,251,247,.44) 100%),url('../img/bg-services.jpg')}
#phAbout{background-image:linear-gradient(100deg,rgba(253,251,247,.96) 0%,rgba(253,251,247,.84) 42%,rgba(253,251,247,.40) 100%),url('../img/bg-clients.jpg')}


/* ===== reset-strong：重置按钮做成整行突出按钮 ===== */
#resetFilters{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;height:46px;padding:0 16px;
  border:1px solid rgba(176,141,87,.55);
  border-radius:12px;
  background:linear-gradient(180deg,#fffdf8 0%,#f8f0e1 100%);
  color:var(--gold-d);
  font-size:13.5px;font-weight:600;letter-spacing:.06em;
  transition:background .3s ease, border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
#resetFilters:hover{
  background:linear-gradient(180deg,#f8f0e1 0%,#f1e2c6 100%);
  border-color:var(--gold);
  box-shadow:0 10px 22px -12px rgba(120,88,36,.45);
  transform:translateY(-1px);
}
#resetFilters::before{content:"⟲";font-size:15px;line-height:1}


/* ===== band-depth：下单引导块做出凹凸层次与互动 ===== */
.band{
  background:linear-gradient(160deg,#fffdf8 0%,#f7eedd 100%);
  border:1px solid rgba(176,141,87,.32);
  border-radius:20px;
  padding:clamp(26px,3.2vw,50px);
  box-shadow:0 26px 60px -30px rgba(120,88,36,.38),
             inset 0 1px 0 rgba(255,255,255,.95),
             inset 0 -18px 40px -30px rgba(160,120,50,.25);
  transition:transform .45s cubic-bezier(.2,.7,.3,1),
             box-shadow .45s ease, border-color .35s ease;
}
.band:hover{
  transform:translateY(-5px);
  border-color:rgba(176,141,87,.58);
  box-shadow:0 36px 78px -32px rgba(120,88,36,.48),
             inset 0 1px 0 rgba(255,255,255,1),
             inset 0 -18px 40px -30px rgba(160,120,50,.32);
}
.band h2{line-height:1.34;letter-spacing:.012em;margin-bottom:14px}
.band .eyebrow{color:var(--gold-d)}
.band .lead{max-width:46ch}


/* ===== band-fit：下单引导块标题压到一行放得下 =====
   这块的标题是两句、各占一行，字号必须比全站 h2 小一档，
   否则每句还会再折一次，就变成四行。 */
.band{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(24px,3vw,56px);
  flex-wrap:wrap;
}
.band > div:first-child{
  flex:1 1 560px;
  min-width:0;
}
.band h2{
  font-size:clamp(1.24rem,2.05vw,2rem);
  line-height:1.42;
  letter-spacing:.012em;
  margin-bottom:12px;
  text-wrap:balance;
  hyphens:none;
  overflow-wrap:normal;
}
.band .lead{
  font-size:clamp(.92rem,.98vw,1rem);
  max-width:52ch;
}
/* 引导块右侧的按钮组：桌面靠右，手机拉通居中 */
.band__cta{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:240px;
  flex:0 0 auto;
}
@media (max-width:900px){
  .band{flex-direction:column;align-items:flex-start}
  .band > div:first-child{flex:1 1 auto;width:100%}
  .band h2{font-size:clamp(1.18rem,4.6vw,1.7rem)}
  /* 手机端原本会被 align-items:flex-start 压成一小截靠左；
     现在整组拉通、两颗按钮等宽居中显示 */
  .band__cta{width:100%;min-width:0;margin-top:6px}
  .band__cta .btn{width:100%;padding-block:16px}
}


/* ===== 工具条吸顶 + 筛选抽屉（方案 B） ===== */
.catbar{
  position:sticky;
  top:calc(var(--nav-h) + 0px);
  z-index:60;
  background:linear-gradient(180deg,var(--paper) 72%,rgba(255,255,255,.92) 100%);
  backdrop-filter:blur(10px);
  padding-top:10px;
  margin-top:-10px;
}
.catbar::after{
  content:"";position:absolute;inset-inline:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(176,141,87,.35),transparent);
}
.fbtn{
  display:inline-flex;align-items:center;gap:8px;
  height:38px;padding:0 16px;border-radius:999px;
  border:1px solid var(--line);background:var(--paper);color:var(--ink);
  font-size:13px;cursor:pointer;position:relative;
  transition:border-color .35s ease, box-shadow .35s ease, background .35s ease;
}
.fbtn:hover{border-color:var(--gold);background:#fffdf8;box-shadow:0 8px 20px -12px rgba(120,88,36,.4)}
.fbtn__n{
  position:absolute;top:-6px;inset-inline-end:-6px;min-width:18px;height:18px;
  border-radius:999px;background:var(--gold);color:#fff;font-size:11px;font-style:normal;
  display:grid;place-items:center;padding:0 5px;font-family:var(--num);
}
.fback{
  position:fixed;inset:0;z-index:800;background:rgba(28,24,18,.42);
  backdrop-filter:blur(3px);animation:fadeIn .25s ease;
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.filters.is-drawer{
  position:fixed;top:0;inset-inline-end:0;bottom:0;z-index:810;
  width:min(380px,92vw);max-width:none;margin:0;
  background:var(--paper);padding:72px 22px 32px;
  overflow-y:auto;overscroll-behavior:contain;
  border:0;border-radius:0;box-shadow:-30px 0 70px -30px rgba(30,22,10,.5);
  animation:fSlide .3s cubic-bezier(.2,.8,.3,1);
}
@keyframes fSlide{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
[dir="rtl"] .filters.is-drawer{animation-name:fSlideRtl}
@keyframes fSlideRtl{from{transform:translateX(-24px);opacity:.6}to{transform:none;opacity:1}}
.filters__close{
  position:absolute;top:18px;inset-inline-end:18px;width:32px;height:32px;border-radius:50%;
  background:rgba(0,0,0,.05);color:var(--ink-2);font-size:17px;line-height:1;cursor:pointer;
  display:none;place-items:center;
}
.filters.is-drawer .filters__close{display:grid}
@media (max-width:1024px){
  .filters.is-drawer{width:min(420px,94vw)}
}


/* ===== catbar-sticky-fix：确保工具条吸顶生效 ===== */
.catalog .catbar{
  position:sticky !important;
  top:var(--nav-h) !important;
  z-index:60;
}
@media (max-width:1024px){
  .catalog .catbar{top:var(--nav-h) !important}
}


/* ===== catbar-pill：吸顶工具条做成浮起的圆角卡片 ===== */
.catalog .catbar{
  top:calc(var(--nav-h) + 12px) !important;
  margin:0 0 26px;
  padding:13px 18px;
  border-radius:18px;
  border:1px solid rgba(176,141,87,.26);
  background:rgba(255,253,248,.90);
  backdrop-filter:blur(16px) saturate(1.15);
  -webkit-backdrop-filter:blur(16px) saturate(1.15);
  box-shadow:0 12px 34px -20px rgba(120,88,36,.42),
             inset 0 1px 0 rgba(255,255,255,.95);
  transition:box-shadow .45s var(--ease), border-color .45s ease,
             background .45s ease, padding .35s ease;
}
.catalog .catbar::after{display:none}
.catalog .catbar:hover{
  border-color:rgba(176,141,87,.5);
  box-shadow:0 18px 44px -22px rgba(120,88,36,.55),
             inset 0 1px 0 rgba(255,255,255,1);
}
/* 吸住时收一点内边距、加重投影，形成"贴上来"的层次 */
.catalog .catbar.is-stuck{
  padding:9px 16px;
  background:rgba(255,252,246,.96);
  box-shadow:0 20px 46px -24px rgba(120,88,36,.62),
             inset 0 1px 0 rgba(255,255,255,1);
}
/* 数量做成小胶囊 */
.catalog .catbar .count{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px;border-radius:999px;
  background:rgba(176,141,87,.10);
  color:var(--ink-2);font-size:12.5px;letter-spacing:.01em;
  transition:background .35s ease,color .35s ease;
}
.catalog .catbar:hover .count{background:rgba(176,141,87,.16);color:var(--ink)}
.catalog .catbar .count b{color:var(--gold-d)}
/* 角标 hidden 要真的隐藏（否则会显示一个空金点） */
.fbtn__n[hidden]{display:none !important}
/* 搜索框/排序/筛选：统一高度并带轻微上浮 */
.catalog .catbar .search input,
.catalog .catbar .sortbox__btn,
.catalog .catbar .fbtn{height:40px}
.catalog .catbar .sortbox__btn:hover,
.catalog .catbar .fbtn:hover{transform:translateY(-1px)}
.catalog .catbar .search input:focus{background:#fff}


/* ===== catbar-seal：堵住导航与工具条之间的漏字缝 =====
   之前 top 留了 12px 空隙、背景又是半透明，
   下方滚动的内容就从缝里透出来（价格串成一条横线）。 */
.catalog .catbar{
  top:var(--nav-h) !important;
  margin-top:0;
  background:#fffdf9;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:0 10px 28px -18px rgba(120,88,36,.40),
             inset 0 1px 0 rgba(255,255,255,.9);
}
.catalog .catbar.is-stuck{
  background:#fffdf9;
  box-shadow:0 16px 38px -20px rgba(120,88,36,.52),
             inset 0 1px 0 rgba(255,255,255,1);
}
/* 圆角卡片两侧的空白带用一层同色底遮住，避免卡片外露出内容 */
.catalog .catbar::before{
  content:"";position:absolute;inset-inline:-6px;top:-1px;bottom:-8px;
  background:#fffdf9;border-radius:20px;z-index:-1;
}
@media (max-width:1024px){
  .catalog .catbar{top:var(--nav-h) !important}
}


/* ===== filters-resp：筛选面板响应式 ===== */
/* 桌面：面板不再吸顶（内容比屏幕高时底部会被切掉），
   改为随页面滚动，完整可见；要随时筛选用顶部吸顶的「筛选」抽屉。 */
@media (min-width:1025px){
  .filters{position:static;top:auto}
}
/* 窄屏：单列，内嵌面板隐藏，只用抽屉 */
@media (max-width:1024px){
  .catalog{grid-template-columns:minmax(0,1fr);gap:16px}
  .filters{display:none}
  .filters.is-drawer{display:block}
}
/* 抽屉本身：占满屏幕高度、可滚、留出安全区 */
.filters.is-drawer{
  top:0;bottom:0;
  height:100dvh;
  max-height:100dvh;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding-bottom:calc(34px + env(safe-area-inset-bottom,0px));
}
@media (max-width:1024px){
  .filters.is-drawer{width:min(430px,100vw);padding-inline:20px}
}


/* ===== filters-sticky-fit：左栏钉住 + 整屏放得下 ===== */
/* 先把面板压紧，常规电脑屏幕就能完整显示 */
@media (min-width:1025px){
  .catalog .filters{
    position:sticky;
    top:calc(var(--nav-h) + 18px);
    max-height:calc(100dvh - var(--nav-h) - 36px);
    overflow-y:auto;
    overscroll-behavior:auto;          /* 滚到头自动交还给页面，不会卡死 */
    padding:20px 18px;
    scrollbar-width:thin;
    scrollbar-color:rgba(176,141,87,.35) transparent;
  }
  .catalog .filters::-webkit-scrollbar{width:6px}
  .catalog .filters::-webkit-scrollbar-thumb{background:rgba(176,141,87,.3);border-radius:999px}
  .catalog .filters::-webkit-scrollbar-track{background:transparent}

  /* 分组与选项一律收紧一档 */
  .catalog .fgroup{padding-block:13px}
  .catalog .fgroup h4{font-size:10.5px;letter-spacing:.14em;margin-bottom:10px}
  .catalog .chips{gap:6px}
  .catalog .chip{padding:6px 12px;font-size:12.5px}
  #resetFilters{height:40px;font-size:13px;border-radius:10px}
}
/* 屏幕很矮时（笔记本 768 高）再收一档 */
@media (min-width:1025px) and (max-height:820px){
  .catalog .fgroup{padding-block:10px}
  .catalog .chip{padding:5px 11px;font-size:12px}
  .catalog .fgroup h4{margin-bottom:8px}
}


/* ===== catbar-outline-seal：用一圈同色外描边把工具条包住 =====
   圆角 + 两侧留白会让下方滚动的内容从缝里透出来（切语言后更明显）。
   外描边沿圆角走一圈，等于给卡片垫了一张更大的同色底纸。 */
.catalog .catbar{
  outline:14px solid #fffdf9;
  outline-offset:0;
  margin-inline:-14px;      /* 抵消描边占的宽度，保持内容对齐 */
  padding-inline:32px;
}
.catalog .catbar::before{display:none}   /* 旧的兜底层不再需要 */
.catalog .catbar.is-stuck{outline-color:#fffdf9}
/* 工具条内部元素重新对齐 */
.catalog .catbar__tools{margin-inline-end:0}
@media (max-width:1024px){
  .catalog .catbar{outline-width:10px;margin-inline:-10px;padding-inline:26px}
}


/* ===== filters-slimport：藏滚动条 + 继续收紧，保证整块放得下 ===== */
@media (min-width:1025px){
  .catalog .filters{
    scrollbar-width:none;          /* Firefox */
    -ms-overflow-style:none;
    padding:18px 16px 20px;
  }
  .catalog .filters::-webkit-scrollbar{width:0;height:0;display:none}

  /* 再收一档：分组、标题、选项 */
  .catalog .fgroup{padding-block:11px}
  .catalog .fgroup h4{font-size:10px;letter-spacing:.12em;margin-bottom:9px}
  .catalog .chips{gap:5px}
  .catalog .chip{padding:5px 10px;font-size:12px;line-height:1.5}
  #resetFilters{height:36px;font-size:12.5px;border-radius:9px}
  .catalog .filters > p{
    font-size:11px !important;
    line-height:1.5 !important;
    margin-top:12px !important;
  }
}


/* ===== 顶部翻页按钮 ===== */
.catalog .catnav__b{
  width:26px;height:26px;border-radius:50%;
  border:1px solid rgba(176,141,87,.32);
  background:#fff;
  color:var(--gold-d);
  font-size:15px;line-height:1;
  display:grid;place-items:center;
  cursor:pointer;flex:0 0 auto;
  transition:background .25s ease,border-color .25s ease,transform .25s ease,color .25s ease;
}
.catalog .catnav__b:hover:not(:disabled){
  background:var(--gold-d);border-color:var(--gold-d);color:#fff;
  transform:translateY(-1px);
}
.catalog .catnav__b:disabled{
  opacity:.32;cursor:not-allowed;background:transparent;
}
.catalog .catbar .count{margin-inline:2px}


/* ===== 桌面端：隐藏"筛选"按钮（左栏常驻可见，不需要抽屉） ===== */
@media (min-width:1025px){
  .catalog .fbtn{display:none !important}
}

/* ===== 工具条一行排布，切语言也不换行 ===== */
.catalog .catbar{flex-wrap:nowrap;align-items:center}
@media (min-width:1025px){
  .catalog .catbar{gap:10px}
  .catalog .catbar__tools{flex:1 1 auto;min-width:0;flex-wrap:nowrap;gap:10px}
  .catalog .catbar .search{flex:1 1 auto;min-width:120px}
  .catalog .catbar .search input{width:100%;min-width:0}
  .catalog .catbar .sortbox{flex:0 1 190px;min-width:150px}
  .catalog .catbar .sortbox__btn{width:100%}
  .catalog .catbar .count,
  .catalog .catnav__b{flex:0 0 auto}
  .catalog .catbar .count{white-space:nowrap}
}
/* 窄屏（1024 以下）才允许换行 */
@media (max-width:1024px){
  .catalog .catbar{flex-wrap:wrap}
}


/* ===== 手机端工具条：刻意分排，不再随机换行 =====
   第 1 排：搜索框（占满整行）
   第 2 排：排序（占大部分） + 筛选按钮 */
@media (max-width:1024px){
  .catalog .catbar{
    display:flex;flex-wrap:wrap;gap:9px;
    padding:11px 14px;
  }
  .catalog .catbar > .catnav__b,
  .catalog .catbar > .count{flex:0 0 auto}
  .catalog .catbar > .count{
    flex:1 1 auto;text-align:center;white-space:nowrap;
    font-size:12px;
  }
  .catalog .catbar__tools{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"search search" "sort fbtn";
    gap:9px;
    width:100%;
    margin:0;
  }
  .catalog .catbar .search{grid-area:search;width:100%}
  .catalog .catbar .search input{width:100%}
  .catalog .catbar .sortbox{grid-area:sort;width:100%;min-width:0}
  .catalog .catbar .sortbox__btn{width:100%}
  .catalog .catbar .fbtn{grid-area:fbtn;flex:0 0 auto}
}
@media (max-width:420px){
  .catalog .catbar .fbtn span[data-i18n]{display:none}   /* 极窄屏只留图标 */
  .catalog .catbar .fbtn{padding:0 12px}
}


/* ===== 手机端第三排：排序与筛选各占一半 ===== */
@media (max-width:1024px){
  .catalog .catbar__tools{
    grid-template-columns:1fr 1fr;     /* 五五开 */
  }
  .catalog .catbar .sortbox,
  .catalog .catbar .fbtn{
    width:100%;
    height:44px;                        /* 触控最小舒适高度 */
    min-width:0;
  }
  .catalog .catbar .sortbox__btn{
    width:100%;height:44px;
  }
  .catalog .catbar .fbtn{
    justify-content:center;
    gap:8px;
    font-size:13.5px;
    padding:0 10px;
  }
  .catalog .catbar .fbtn svg{flex:0 0 auto}
}
/* 只有极窄（<360px）才隐藏文字，此时按钮仍占满半屏 */
@media (max-width:359px){
  .catalog .catbar .fbtn span[data-i18n]{display:none}
}


/* ===== 手机端产品卡压缩：一屏看到更多款式 ===== */
@media (max-width:760px){
  /* 吸顶工具条占位，别让第一排被压住 */
  .catalog{padding-top:2px}
  .catalog .pgrid{
    gap:10px;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  /* 商品卡统一 1:1：图片是原比例整张放的，不裁切产品；水印保持原样 */
  .catalog .pcard__media{aspect-ratio:1/1}
  .catalog .pcard__body{padding:9px 10px 10px;gap:3px}
  .catalog .pcard__cat{font-size:9px;letter-spacing:.08em}
  .catalog .pcard__name{font-size:.92rem;line-height:1.25;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .catalog .pcard__price b{font-size:.92rem}
  .catalog .pcard__foot{padding-top:7px;gap:6px}
  /* 数量控件与加号一起缩小，但加号仍保证 34px 可点 */
  .catalog .pcard .qty{border-radius:999px}
  .catalog .pcard .qty button{width:24px;height:30px}
  .catalog .pcard .qty input{width:30px;height:30px;font-size:12px}
  .catalog .pcard .add{width:auto;min-width:58px;height:30px;flex-basis:auto;padding:0 12px}
  .catalog .pcard .tag{top:8px;inset-inline-start:8px;font-size:8px;padding:3px 7px}
}
@media (max-width:420px){
  .catalog .pcard__name{-webkit-line-clamp:2;font-size:.88rem}
  .catalog .pcard .qty button{width:22px}
  .catalog .pcard .qty input{width:26px}
}


/* ===== 手机/竖屏平板：3 列，一屏看到更多 ===== */
@media (max-width:900px){
  .catalog .pgrid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    align-items:start;
  }
  /* 与桌面一致用 4:3 取景：商品图底部常有烧进图里的水印，统一取景把它挡在框外 */
  .catalog .pcard__media{aspect-ratio:1/1}
  .catalog .pcard__body{padding:7px 8px 8px;gap:2px}
  .catalog .pcard__cat{font-size:8px;letter-spacing:.05em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .catalog .pcard__name{font-size:.8rem;line-height:1.22;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .catalog .pcard__price b{font-size:.82rem}
  .catalog .pcard__foot{padding-top:6px;gap:4px}
  .catalog .pcard .qty button{width:26px;height:30px;font-size:14px}
  .catalog .pcard .qty input{width:24px;height:30px;font-size:11px}
  .catalog .pcard .add{width:auto;min-width:52px;height:28px;flex-basis:auto;padding:0 10px}
  .catalog .pcard .add svg{width:12px;height:12px}
  .catalog .pcard .tag{top:6px;inset-inline-start:6px;font-size:7px;padding:2px 5px}
}
/* 真正的手机（竖屏窄屏）回到 2 列，保证可点 */
@media (max-width:520px){
  .catalog .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .catalog .pcard__body{padding:9px 10px 10px;gap:3px}
  .catalog .pcard__name{font-size:.9rem}
  .catalog .pcard__price b{font-size:.9rem}
  /* 手机端：数量控件和加购按钮【并排】而不是上下叠。
     上下叠时两点只隔 6px，点「+」很容易落到下面的购物车按钮上；
     并排后中间只可能横向误触，概率低得多。 */
  .catalog .pcard__foot{flex-wrap:nowrap;gap:8px}
  .catalog .pcard .qty{flex:0 1 auto;min-width:0;display:flex;align-items:center}
  .catalog .pcard .qty button{width:32px;height:36px;font-size:16px}
  .catalog .pcard .qty input{width:32px;height:36px;font-size:13px}
  .catalog .pcard .add{flex:1 1 auto;width:auto;min-width:44px;height:36px;padding:0}
  .catalog .pcard .add svg{width:15px;height:15px}
}
/* 极窄屏（≤400px）：再收一档，保证 −、数字、+、购物车四个都完整显示不被裁切 */
@media (max-width:400px){
  .catalog .pcard__foot{gap:6px}
  .catalog .pcard .qty button{width:28px}
  .catalog .pcard .qty input{width:28px;font-size:12px}
  .catalog .pcard .add{min-width:40px}
}


/* ---- 工厂数据板块：点阵世界地图做底 ---- */



/* ===== 工厂数据：代码绘制的数据图形底（SVG），不用照片 =====
   .section--cream 用了 background 简写会重置图片，
   这里用 background-color:transparent + !important 把它压住。 */

#fstatTop .stats{border-block-color:rgba(176,141,87,.28)}


/* ===== 工厂数据：内嵌 SVG 数据图形 ===== */
#fstatTop{position:relative;overflow:hidden}
#fstatTop > .fstat-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
#fstatTop > .wrap{position:relative;z-index:1}


/* ===== 工厂页：收紧工艺展示与出口资质之间的巨大留白 ===== */
#fcraftTop{padding-bottom:clamp(30px,3.4vw,54px) !important}
#fcertTop{padding-top:clamp(26px,3vw,48px) !important}

/* 出口资质：把那张大占位卡压小，右边内容加厚 */
#fcertTop .split{gap:clamp(24px,3vw,48px);align-items:center}


#fcertTop .split__text ul{display:grid;gap:10px;margin:18px 0 22px}
#fcertTop .split__text li{font-size:14.5px;line-height:1.6}


/* ===== 出口资质：尺寸恢复 + 代码底图 ===== */
#fcertTop{position:relative;overflow:hidden}
#fcertTop > .fcert-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
#fcertTop > .wrap{position:relative;z-index:1}

#fcertTop .split__media{
  max-width:none;
  min-height:340px;
  display:grid;
  place-items:center;
  border-radius:18px;
}
#fcertTop .split__media img{
  max-height:none;
  height:100%;
  width:100%;
  object-fit:contain;
  padding:26px;
}


/* ===== 出口资质：图文间距与对齐 ===== */
#fcertTop .split{
  gap:clamp(48px,5.5vw,96px);
  align-items:center !important;
}
#fcertTop .split__text{
  padding-inline-start:4px;
  max-width:520px;
}
#fcertTop .split__text h2{margin-bottom:10px}
#fcertTop .split__text ul{
  gap:14px !important;
  margin:20px 0 26px !important;
}
#fcertTop .split__text li{
  display:flex;align-items:flex-start;gap:10px;
  font-size:14.5px;line-height:1.55;
}
#fcertTop .split__text li svg{margin-top:2px;flex:0 0 auto}
#fcertTop .split__text .btn{align-self:flex-start}
/* 装饰图形淡一点，别跟文字抢 */
#fcertTop > .fcert-art{opacity:.62}


/* 资质图片改为铺满卡片（照片不是插图，不需要留白）*/
#fcertTop .split__media img{
  object-fit:cover !important;
  padding:0 !important;
  border-radius:18px;
}
#fcertTop .split__media{overflow:hidden}


/* 数据底图再淡一档，避免和分隔线重色 */
#fstatTop > .fstat-art{opacity:.75}
#fstatTop .stats{border-block-color:rgba(176,141,87,.18) !important}


/* ===== 工厂数据：实拍虚化底图 + 放大的数字 ===== */
#fstatTop .fstat-art{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  opacity:.55;
  filter:saturate(.75) brightness(1.12);
  z-index:0;pointer-events:none;
}
#fstatTop > .wrap{position:relative;z-index:1}

/* 数字放大 + 颜色压深，和底图彻底分开 */
#fstatTop .stat .num{
  font-size:clamp(2.1rem,3.4vw,3rem);
  color:#6b4a1e;
  font-weight:500;
  letter-spacing:-.01em;
}
#fstatTop .stat .k{
  font-size:15.5px;
  font-weight:600;
  color:#3a2f22;
  margin-top:2px;
}
#fstatTop .stat .sub{
  font-size:13.5px;
  color:#6d6353;
  margin-top:4px;
}
#fstatTop .stats{border-block-color:rgba(107,74,30,.22) !important}


/* ===== 工厂数据底图 v3：SVG 斜线款 ===== */
#fstatTop .fstat-art{
  object-fit:none !important;
  filter:none !important;
  opacity:.95 !important;
  width:100%;height:100%;
}


/* ===== 工厂简介：正文重排，告别"密密麻麻" ===== */

/* 第一段做导语：字号大一点、颜色实一点 */

/* 第二段做补充：缩进一档 + 上方细分隔线 */

/* 标题与正文之间留白更从容 */


@media (max-width:1024px){
  
}


/* ===== 工厂简介排版（用真实类名 .split__body）===== */


#fintroTop .split__body h2{margin-bottom:18px}

/* 第一段：导语 */
#fintroTop .split__body p.lead:nth-of-type(1){
  font-size:16.5px;
  line-height:2.0;
  letter-spacing:.012em;
  color:var(--ink);
  max-width:42ch;
  margin-top:0;
}

/* 第二段：补充，带分隔线 */
#fintroTop .split__body p.lead:nth-of-type(2){
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(176,141,87,.22);
  font-size:15px;
  line-height:1.95;
  letter-spacing:.01em;
  color:var(--ink-2);
  max-width:42ch;
}



@media (max-width:1024px){
  #fintroTop .split__body p.lead:nth-of-type(1),
  #fintroTop .split__body p.lead:nth-of-type(2){max-width:none}
}


/* ===== 工厂简介：句子成行 ===== */
#fintroTop .split__body p.lead .sent{
  display:block;
  margin-bottom:12px;
  line-height:1.85;
}
#fintroTop .split__body p.lead .sent:last-child{margin-bottom:0}
#fintroTop .split__body p.lead:nth-of-type(1){
  font-size:15.5px !important;
  max-width:40ch !important;
  letter-spacing:.01em;
}


/* ===== 工厂简介：要点列表排版 ===== */
#fintroTop .facts{
  margin:26px 0 0;
  display:grid;
  gap:0;
  border-top:1px solid rgba(176,141,87,.22);
}
#fintroTop .facts > div{
  display:grid;
  grid-template-columns:104px 1fr;
  gap:16px;
  align-items:baseline;
  padding:14px 0;
  border-bottom:1px solid rgba(176,141,87,.14);
}
#fintroTop .facts dt{
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold-d);
  font-weight:700;
  white-space:nowrap;
}
#fintroTop .facts dd{
  margin:0;
  font-size:14.5px;
  line-height:1.7;
  color:var(--ink);
}
#fintroTop .split__body p.lead{
  font-size:15.5px !important;
  line-height:1.95 !important;
  color:var(--ink-2);
  max-width:46ch !important;
}
#fintroTop .split__body p.lead .sent{display:inline;margin:0}
@media (max-width:640px){
  #fintroTop .facts > div{grid-template-columns:1fr;gap:4px}
}


/* ===== 工厂简介：正文栏加宽，减少行数并与图片高度对齐 ===== */

#fintroTop .split__body{max-width:none;width:100%}
#fintroTop .split__body p.lead{
  max-width:none !important;
  font-size:15.5px !important;
  line-height:1.95 !important;
  max-width:62ch !important;
}
#fintroTop .facts{margin-top:22px}
#fintroTop .facts > div{grid-template-columns:112px 1fr;padding:13px 0}
#fintroTop .facts dd{max-width:58ch}


/* ===== 工厂简介：左右两栏上下齐平 ===== */
#fintroTop .split{
  align-items:stretch;          /* 两栏等高 */
  gap:clamp(36px,4vw,72px);
}
/* 图片栏撑满，等比裁切，不拉伸变形 */
#fintroTop .split__media{
  height:100%;
  min-height:320px;
  overflow:hidden;
  border-radius:20px;
}
#fintroTop .split__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
/* 文字栏：内容不足时也不留空 */
#fintroTop .split__body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:none;
  width:100%;
}
@media (max-width:1024px){
  #fintroTop .split__media{height:auto;min-height:260px}
  #fintroTop .split__media img{height:260px}
}


/* ===== 工厂简介要点：标签按文字宽度自适应，不再重叠 ===== */
#fintroTop .facts > div{
  grid-template-columns: max-content minmax(0, 1fr) !important;
  column-gap: clamp(16px, 2vw, 28px) !important;
  row-gap: 6px;
}
#fintroTop .facts dt{
  white-space: nowrap;
  min-width: 104px;      /* 中文时保持整齐的起始位 */
}
#fintroTop .facts dd{
  min-width: 0;
  overflow-wrap: anywhere;
}
@media (max-width:640px){
  #fintroTop .facts > div{grid-template-columns:1fr !important;row-gap:4px}
  #fintroTop .facts dt{min-width:0}
}


/* 工厂简介收尾段：文风与要点区分开 */
#fintroTop .split__body p.lead--note{
  margin-top:20px !important;
  padding-top:18px;
  border-top:1px solid rgba(176,141,87,.18);
  font-size:14.5px !important;
  line-height:1.9 !important;
  color:var(--ink-2) !important;
  max-width:58ch !important;
}


/* ===== 工厂简介要点：整块用一个网格，右侧全部对齐同一条竖线 ===== */
#fintroTop .facts{
  display:grid !important;
  grid-template-columns:max-content minmax(0,1fr) !important;
  column-gap:clamp(24px,3vw,44px) !important;
  row-gap:0;
  align-items:start;
}
/* 外层 div 不参与布局，让 dt/dd 直接成为网格项 */
#fintroTop .facts > div{display:contents !important}

#fintroTop .facts dt{
  padding:15px 0;
  border-bottom:1px solid rgba(176,141,87,.14);
  white-space:nowrap;
  min-width:0;
}
#fintroTop .facts dd{
  padding:15px 0;
  border-bottom:1px solid rgba(176,141,87,.14);
  margin:0;
  min-width:0;
  overflow-wrap:anywhere;
}
#fintroTop .facts > div:last-child dt,
#fintroTop .facts > div:last-child dd{border-bottom:0}

@media (max-width:640px){
  #fintroTop .facts{grid-template-columns:1fr !important;column-gap:0}
  #fintroTop .facts dt{padding-bottom:2px;border-bottom:0}
  #fintroTop .facts dd{padding-top:0}
}


/* ===== 门店相册：一行三张，降低总高度 ===== */
.gallery{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:clamp(14px,1.6vw,22px) !important;
}
.gallery .g.tall{grid-row:span 1 !important}
.gallery .g.tall img{aspect-ratio:4/3 !important;height:auto !important}
.gallery .g img{aspect-ratio:4/3 !important}
.gallery .gcap{
  padding:clamp(11px,1vw,15px) clamp(12px,1.2vw,16px) !important;
  font-size:clamp(12.5px,.95vw,14px) !important;
}
@media (max-width:900px){
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}
@media (max-width:560px){
  .gallery{grid-template-columns:1fr !important}
}


/* ===== 门店页：代码绘制底图 ===== */
section:has(> .sh-art){position:relative;overflow:hidden}
.sh-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
section:has(> .sh-art) > .wrap{position:relative;z-index:1}
.sh-art--info{opacity:.9}
.sh-art--gal{opacity:.8}


.sh-art--gal{opacity:1 !important}


/* 门店介绍底图：再抬一档存在感 */
.sh-art--gal{
  opacity:1 !important;
  filter:none !important;
}
section:has(> .sh-art--gal){background:#faf7f1}


/* ===== 定制服务：图文对齐 + 要点列表 ===== */
#cusrvTop .split{align-items:stretch;gap:clamp(36px,4vw,72px)}
#cusrvTop .split__media{
  height:100%;min-height:340px;overflow:hidden;border-radius:20px;
}
#cusrvTop .split__media img{width:100%;height:100%;object-fit:cover;display:block}
#cusrvTop .split__body{
  display:flex;flex-direction:column;justify-content:center;max-width:none;width:100%;
}
#cusrvTop .split__body p.lead{
  max-width:52ch !important;font-size:15.5px !important;line-height:1.95 !important;
}

/* 要点：整块一个网格，右侧对齐同一条线 */
#cusrvTop .facts{
  display:grid !important;
  grid-template-columns:max-content minmax(0,1fr) !important;
  column-gap:clamp(24px,3vw,44px) !important;row-gap:0;
  margin:26px 0 0;border-top:1px solid rgba(176,141,87,.22);
}
#cusrvTop .facts > div{display:contents !important}
#cusrvTop .facts dt{
  padding:15px 0;border-bottom:1px solid rgba(176,141,87,.14);
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-d);font-weight:700;white-space:nowrap;
}
#cusrvTop .facts dd{
  padding:15px 0;border-bottom:1px solid rgba(176,141,87,.14);
  margin:0;font-size:14.5px;line-height:1.7;color:var(--ink);min-width:0;overflow-wrap:anywhere;
}
#cusrvTop .facts > div:last-child dt,
#cusrvTop .facts > div:last-child dd{border-bottom:0}
#cusrvTop .split__body .btn{margin-top:24px;align-self:flex-start}
@media (max-width:1024px){
  #cusrvTop .split__media{height:auto;min-height:260px}
  #cusrvTop .split__media img{height:260px}
  #cusrvTop .split__body p.lead{max-width:none !important}
}
@media (max-width:640px){
  #cusrvTop .facts{grid-template-columns:1fr !important;column-gap:0}
  #cusrvTop .facts dt{padding-bottom:2px;border-bottom:0}
  #cusrvTop .facts dd{padding-top:0}
}


/* ===== 定制维度 v2：底图 + 明显的悬停互动 ===== */
section:has(> .dim-art){position:relative;overflow:hidden}
.dim-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
section:has(> .dim-art) > .wrap{position:relative;z-index:1}

/* 卡片：更厚实、更有层次 */
.dims{gap:clamp(16px,2vw,26px) !important}
.dim{
  position:relative;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:18px !important;
  padding:26px 26px 24px !important;
  overflow:hidden;
  transition:transform .45s cubic-bezier(.2,.7,.3,1),
             box-shadow .45s cubic-bezier(.2,.7,.3,1),
             border-color .3s ease, background .45s ease;
}
/* 顶部金线：悬停时从左展开 */
.dim::before{
  content:"";position:absolute;inset-inline:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--gold-l),var(--gold),var(--gold-l));
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.dim:hover{
  transform:translateY(-8px);
  border-color:var(--gold);
  background:linear-gradient(160deg,#fffdf8 0%,#f8f0e1 100%);
  box-shadow:0 24px 48px -22px rgba(120,88,36,.40), 0 0 0 1px rgba(176,141,87,.35);
}
.dim:hover::before{transform:scaleX(1)}
/* 图标块：悬停时翻成金色实底 */
.dim__ico{
  flex:0 0 56px !important;width:56px !important;height:56px !important;
  border-radius:16px !important;
  transition:background .4s ease, transform .45s cubic-bezier(.2,.7,.3,1), border-color .3s ease, box-shadow .4s ease;
}
.dim:hover .dim__ico{
  background:linear-gradient(145deg,#e8d6b4,#c9a86a) !important;
  border-color:rgba(176,141,87,.6) !important;
  transform:rotate(-6deg) scale(1.06);
  box-shadow:0 10px 22px -10px rgba(160,120,50,.65);
}
.dim:hover .dim__ico img{filter:brightness(0) saturate(100%) invert(18%) sepia(30%) saturate(900%) hue-rotate(2deg)}
.dim__t h4{transition:color .3s ease;margin-bottom:6px}
.dim:hover .dim__t h4{color:var(--gold-d)}
.dim__t p{transition:color .3s ease}
.dim:hover .dim__t p{color:var(--ink)}
@media (max-width:900px){
  .dims{grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width:560px){
  .dims{grid-template-columns:1fr !important}
  .dim{padding:20px !important}
}


/* ===== 核心规则：图文等高 + 表格重排 + 底图 ===== */
section:has(> .rule-art){position:relative;overflow:hidden}
.rule-art{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}
section:has(> .rule-art) > .wrap{position:relative;z-index:1}

#curulesTop .split{align-items:stretch;gap:clamp(36px,4vw,72px)}
#curulesTop .split__media{height:100%;min-height:360px;overflow:hidden;border-radius:20px}
#curulesTop .split__media img{width:100%;height:100%;object-fit:cover;display:block}
#curulesTop .split__body{display:flex;flex-direction:column;justify-content:center;max-width:none;width:100%}

/* 表格：去掉生硬的等分行，改为带悬停的行 */








@media (max-width:1024px){
  #curulesTop .split__media{height:auto;min-height:260px}
  #curulesTop .split__media img{height:260px}
}
@media (max-width:640px){
  
  
  
}


/* ===== 定制流程：让五步"活"起来 ===== */
/* 连接线改成可生长的金线 */
.step::before{
  background:linear-gradient(90deg,rgba(176,141,87,.18),rgba(176,141,87,.30),rgba(176,141,87,.18));
  transform-origin:left;
  transform:scaleX(1);
  transition:transform .5s ease, background .45s ease;
}
/* 若入场类没触发，兜底：hover 时点亮这一段 */
.step:hover::before{transform:scaleX(1);background:linear-gradient(90deg,var(--gold-l),var(--gold),var(--gold-l))}

/* 序号圆：默认带光晕，悬停放大翻金 */
.step__no{
  position:relative;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),
             background .4s ease, border-color .4s ease, color .4s ease, box-shadow .5s ease;
}
.step:hover .step__no{
  background:linear-gradient(145deg,#e8d6b4,#c9a86a);
  border-color:var(--gold);
  color:#2b1f0c;
  transform:translateY(-6px) scale(1.14);
  box-shadow:0 16px 30px -14px rgba(160,120,50,.75), 0 0 0 6px rgba(176,141,87,.12);
}
/* 悬停时向外扩散的脉冲圈 */
.step__no::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:1px solid var(--gold);
  opacity:0;transform:scale(.8);
  transition:opacity .5s ease, transform .6s cubic-bezier(.2,.7,.3,1);
  pointer-events:none;
}
.step:hover .step__no::after{opacity:.55;transform:scale(1.35)}

/* 标题与说明跟随点亮 */
.step h4{transition:color .3s ease, transform .4s cubic-bezier(.2,.7,.3,1)}
.step:hover h4{color:var(--gold-d);transform:translateY(-1px)}
.step p{transition:color .3s ease}
.step:hover p{color:var(--ink)}

/* 整步可点击区域的手感 */
.step{cursor:default}
@media (max-width:768px){
  .step::before{display:none}
}


/* ===== 核心规则表格：整表一个网格，跨行对齐，绝不溢出 ===== */









@media (max-width:640px){
  
  
  
}


/* ===== 核心规则表格：原生 table + 固定列宽（最稳，绝不溢出） ===== */
#curulesTop .tbl{
  display:table !important;
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  margin-top:22px !important;
  border-top:1px solid rgba(176,141,87,.22) !important;
}
#curulesTop .tbl tr{display:table-row !important}
#curulesTop .tbl th,
#curulesTop .tbl td{
  display:table-cell !important;
  vertical-align:top !important;
  padding:15px 0 !important;
  border:0 !important;
  border-bottom:1px solid rgba(176,141,87,.14) !important;
  background:transparent !important;
  text-align:start !important;
  white-space:normal !important;
  overflow-wrap:anywhere;
  word-break:break-word;
}
#curulesTop .tbl th{
  width:32% !important;
  padding-inline-end:22px !important;
  font-size:11.5px;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:var(--gold-d);
  font-weight:700;
  line-height:1.6;
}
#curulesTop .tbl td{
  width:68% !important;
  font-size:14.5px;
  line-height:1.7;
  color:var(--ink);
}
#curulesTop .tbl td strong{color:#3a2f22;font-weight:600}
#curulesTop .tbl th:hover,
#curulesTop .tbl td:hover{background:rgba(176,141,87,.06) !important}

@media (max-width:640px){
  #curulesTop .tbl{display:block !important}
  #curulesTop .tbl tr{display:block !important;border-bottom:1px solid rgba(176,141,87,.14)}
  #curulesTop .tbl th,
  #curulesTop .tbl td{display:block !important;width:auto !important;border-bottom:0 !important}
  #curulesTop .tbl th{padding-bottom:2px !important}
  #curulesTop .tbl td{padding-top:0 !important}
}


/* ===== fnode-live-v2：定制流程五步的悬停互动（覆盖原有弱效果） ===== */
.flow .fnode{cursor:default}
.flow .fnode__no{
  position:relative;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),
             background .4s ease, border-color .4s ease, color .4s ease, box-shadow .5s ease;
  will-change:transform;
}
.flow .fnode:hover .fnode__no{
  background:linear-gradient(145deg,#e8d6b4,#c9a86a) !important;
  border-color:var(--gold) !important;
  color:#2b1f0c !important;
  transform:translateY(-7px) scale(1.16) !important;
  box-shadow:0 18px 34px -14px rgba(160,120,50,.8), 0 0 0 7px rgba(176,141,87,.12) !important;
}
.flow .fnode__no::after{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:1px solid var(--gold);opacity:0;transform:scale(.85);
  transition:opacity .5s ease, transform .7s cubic-bezier(.2,.7,.3,1);
  pointer-events:none;
}
.flow .fnode:hover .fnode__no::after{opacity:.6;transform:scale(1.45)}
.flow .fnode h4{transition:color .3s ease, transform .4s cubic-bezier(.2,.7,.3,1)}
.flow .fnode:hover h4{color:var(--gold-d);transform:translateY(-1px)}
.flow .fnode p{transition:color .3s ease}
.flow .fnode:hover p{color:var(--ink)}


/* ===== flow-mobile-v1：手机端五步改成竖排列表 ===== */
@media (max-width:700px){
  .flow{
    grid-template-columns:1fr !important;
    gap:0 !important;
    justify-items:stretch !important;
    padding-top:0 !important;
  }
  .flowrail{display:none !important}

  .fnode{
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) !important;
    grid-template-areas:"no title" "no desc";
    align-items:start !important;
    justify-items:start !important;
    text-align:start !important;
    max-width:none !important;
    width:100% !important;
    padding:18px 0 !important;
    border-bottom:1px solid rgba(176,141,87,.16);
  }
  .fnode:last-child{border-bottom:0}

  .fnode__no{
    grid-area:no;
    width:46px !important;height:46px !important;
    margin:0 !important;
    font-size:1.05rem !important;
    box-shadow:0 0 0 4px var(--cream) !important;
  }
  .fnode h4{
    grid-area:title;
    margin:2px 0 0 14px !important;
    font-size:15.5px !important;
    line-height:1.35 !important;
    text-align:start;
  }
  .fnode p{
    grid-area:desc;
    margin:7px 0 0 14px !important;
    padding:0 !important;
    max-width:none !important;
    font-size:13px !important;
    line-height:1.7 !important;
    text-align:start;
    color:var(--ink-2);
  }
  /* 手机端触摸：按下时点亮 */
  .fnode:active .fnode__no{
    background:linear-gradient(145deg,#e8d6b4,#c9a86a) !important;
    border-color:var(--gold) !important;
    color:#2b1f0c !important;
  }
}


/* ===== cases-v2：客户案例的副标题与卡片 ===== */
/* 副标题：做成"流程句"的样子，字号提上来 */
#caseTop .sec-head .lead{
  font-size:clamp(16px,1.5vw,19px) !important;
  color:var(--ink-2) !important;
  letter-spacing:.02em;
  line-height:1.8;
  max-width:52ch;
  margin-top:6px;
}
#caseTop .sec-head .lead strong{color:var(--gold-d);font-weight:600}

/* 卡片：更大的图、更明显的互动 */
.craft{gap:clamp(18px,2.2vw,30px) !important}
.craft__item{
  border-radius:20px !important;
  overflow:hidden;
  background:var(--paper);
  border:1px solid var(--line);
  transition:transform .5s cubic-bezier(.2,.7,.3,1),
             box-shadow .5s cubic-bezier(.2,.7,.3,1),
             border-color .3s ease;
}
.craft__item img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  display:block;
  transition:transform 1.1s cubic-bezier(.2,.7,.3,1);
}
.craft__item:hover{
  transform:translateY(-8px);
  border-color:var(--gold);
  box-shadow:0 28px 54px -24px rgba(120,88,36,.42);
}
.craft__item:hover img{transform:scale(1.06)}
.craft__body{padding:clamp(16px,1.6vw,22px) !important}
.craft__body h3{
  font-size:clamp(15px,1.25vw,17px) !important;
  line-height:1.45;
  transition:color .3s ease;
}
.craft__item:hover .craft__body h3{color:var(--gold-d)}
.craft__body .muted{
  font-size:12.5px !important;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--gold-d) !important;
  opacity:.75;
  margin-top:8px;
}


/* ===== 客户案例副标题：三段可交互流程 ===== */
#caseTop .lead.cf{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:10px 12px;
  max-width:none !important;
  margin-top:10px;
}
#caseTop .cf__step{
  display:inline-flex;align-items:center;
  padding:9px 18px;border-radius:999px;
  border:1px solid rgba(176,141,87,.35);
  background:rgba(255,253,248,.7);
  color:var(--ink);
  font-size:clamp(14px,1.15vw,16px);
  letter-spacing:.02em;
  line-height:1.2;
  cursor:default;
  transition:background .35s ease, border-color .35s ease, color .35s ease,
             transform .4s cubic-bezier(.2,.7,.3,1), box-shadow .4s ease;
}
#caseTop .cf__step:hover{
  background:linear-gradient(145deg,#f3e3c4,#e4cd9e);
  border-color:var(--gold);
  color:#3a2b12;
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 14px 26px -14px rgba(160,120,50,.7);
}
/* 最后一个词固定高亮，形成“终点”感 */
#caseTop .cf__step:last-child{
  background:linear-gradient(145deg,#2b241a,#15110b);
  border-color:#2b241a;
  color:#f2e5cd;
}
#caseTop .cf__step:last-child:hover{
  background:linear-gradient(145deg,#3a3021,#221c12);
  color:#fff;
}
#caseTop .cf__ar{
  color:var(--gold);
  font-size:clamp(15px,1.3vw,18px);
  line-height:1;
  animation:cfArrow 1.6s ease-in-out infinite;
}
@keyframes cfArrow{
  0%,100%{transform:translateX(0);opacity:.45}
  50%{transform:translateX(5px);opacity:1}
}
@media (max-width:640px){
  #caseTop .cf__step{padding:7px 14px;font-size:13.5px}
}


/* ===== cf-nowrap：三颗胶囊强制一行 ===== */
#caseTop .lead.cf{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:2px;
  scrollbar-width:none;
}
#caseTop .lead.cf::-webkit-scrollbar{display:none}
#caseTop .cf__step{
  flex:0 0 auto;
  white-space:nowrap;
  padding:8px 14px;
  font-size:clamp(12.5px,.95vw,15px);
}
#caseTop .cf__ar{flex:0 0 auto;font-size:14px}
@media (max-width:520px){
  #caseTop .cf__step{padding:7px 11px;font-size:12px}
  #caseTop .cf__ar{font-size:12px}
  #caseTop .lead.cf{gap:6px}
}


/* ===== 来图定制 CTA：代码绘制底图（图纸感） ===== */
.band--art{position:relative;overflow:hidden}
.band-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
  border-radius:20px;
}
.band--art > div{position:relative;z-index:1}


/* ===== 采购订单整页底图 ===== */
section.section--order{
  position:relative;
  overflow:hidden;
  padding-top:clamp(32px,4vw,52px);
}
.order-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
section.section--order > .wrap{position:relative;z-index:1}


/* ===== header-fit-v1：窄屏页头右侧不挤出屏幕，汉堡永远可见可点 ===== */
@media (max-width:1024px){
  .header__inner{gap:10px;min-width:0}
  .tools{
    margin-inline-start:auto !important;
    gap:4px !important;
    flex:0 0 auto;
    min-width:0;
  }
  .tools > *{flex:0 0 auto}
  .lang__btn{padding:7px 10px !important;max-width:176px;white-space:nowrap}
  .lang__btn .label{
    display:inline-block !important;
    max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .lang__btn .code{white-space:nowrap;flex:0 0 auto}
  .icon-btn,.burger{width:38px !important;height:38px !important}
  .burger{
    position:relative;
    z-index:5;
    pointer-events:auto !important;
    cursor:pointer;
  }
}
@media (max-width:600px){
  .lang__btn .label{display:none !important}
  .lang__btn{padding:8px 11px !important}
}


/* ===== 抽屉：关闭按钮 + 不再自动展开语言面板 ===== */
.drawer__x{
  position:absolute;top:22px;inset-inline-end:22px;
  width:42px;height:42px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--paper);border:1px solid var(--line);
  color:var(--ink-2);font-size:20px;line-height:1;cursor:pointer;
  transition:background .3s ease,color .3s ease,transform .3s ease,border-color .3s ease;
}
.drawer__x:hover,.drawer__x:active{
  background:var(--gold-d);border-color:var(--gold-d);color:#fff;transform:rotate(90deg);
}
/* 抽屉里不再重复展示整块语言列表（页头已有语言切换） */
.drawer .lang__panel{display:none !important}


/* ===== drawer-ux-v2：抽屉重排 ===== */
.drawer{
  padding:0 26px 44px !important;
  background:linear-gradient(180deg,#fdfbf6 0%,#f7f2e8 100%) !important;
}
.drawer__bar{
  position:sticky;top:0;z-index:3;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 0 16px;
  background:linear-gradient(180deg,#fdfbf6 72%,rgba(253,251,246,0));
  border-bottom:1px solid rgba(176,141,87,.18);
  margin-bottom:6px;
}
.drawer__tt{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-d);font-weight:700;
}
.drawer__x{
  width:44px;height:44px;border-radius:999px;
  display:grid;place-items:center;
  background:var(--paper);border:1px solid rgba(176,141,87,.42);
  color:var(--ink);font-size:15px;cursor:pointer;
  transition:background .3s ease,color .3s ease,border-color .3s ease,
             transform .38s cubic-bezier(.2,.7,.3,1);
}
.drawer__x:hover,.drawer__x:active{
  background:var(--gold-d);border-color:var(--gold-d);color:#fff;transform:rotate(90deg);
}
.drawer a{
  position:relative;
  display:flex !important;align-items:center;justify-content:space-between;
  font-size:1.72rem !important;
  padding:18px 2px !important;
  border-bottom:1px solid rgba(176,141,87,.14) !important;
  color:var(--ink);
  transition:padding-inline-start .35s cubic-bezier(.2,.7,.3,1),
             color .3s ease;
}
.drawer a::after{
  content:"\2192";
  font-family:var(--num);
  font-size:1rem;
  color:var(--gold);
  opacity:.25;
  transition:opacity .3s ease, transform .35s cubic-bezier(.2,.7,.3,1);
}
.drawer a:hover,.drawer a:active{
  padding-inline-start:14px !important;
  color:var(--gold-d);
}
.drawer a:hover::after,.drawer a:active::after{opacity:1;transform:translateX(5px)}
.drawer .lang__panel{display:none !important}


/* ===== drawer-lux-v3：手机菜单重做（居中、留白、淡入） ===== */
.drawer{
  padding:0 30px 48px !important;
  background:#fbf8f2 !important;
  display:flex;
  flex-direction:column;
}

/* 顶栏：只留一颗居右的关闭键 */
.drawer__bar{
  position:sticky;top:0;z-index:3;
  display:flex;align-items:center;justify-content:flex-end;
  padding:18px 0 14px;
  background:linear-gradient(180deg,#fbf8f2 74%,rgba(251,248,242,0));
  border:0 !important;
  margin-bottom:14px;
}
.drawer__tt{display:none}

.drawer__x{
  width:40px;height:40px;border-radius:999px;
  display:grid;place-items:center;
  background:transparent;
  border:1px solid rgba(176,141,87,.45);
  color:var(--ink);
  font-size:14px;line-height:1;
  cursor:pointer;
  transition:background .3s ease,color .3s ease,border-color .3s ease,
             transform .4s cubic-bezier(.2,.7,.3,1);
}
.drawer__x:hover,.drawer__x:active{
  background:var(--gold-d);border-color:var(--gold-d);color:#fff;transform:rotate(90deg);
}

/* 导航：居中、大字、少装饰 */
.drawer a{
  display:block !important;
  text-align:center !important;
  font-family:var(--serif) !important;
  font-size:clamp(1.5rem,5.6vw,1.95rem) !important;
  line-height:1.2 !important;
  letter-spacing:.06em;
  color:var(--ink) !important;
  padding:19px 0 !important;
  border:0 !important;
  border-bottom:1px solid rgba(176,141,87,.13) !important;
  transition:color .3s ease, letter-spacing .4s cubic-bezier(.2,.7,.3,1),
             opacity .5s ease, transform .5s cubic-bezier(.2,.7,.3,1);
  opacity:0;
  transform:translateY(10px);
}
.drawer a::after{display:none !important}
.drawer a:last-of-type{border-bottom:0 !important}

/* 打开时逐条淡入 */
.drawer.is-open a{opacity:1;transform:none}
.drawer.is-open a:nth-of-type(1){transition-delay:.06s}
.drawer.is-open a:nth-of-type(2){transition-delay:.10s}
.drawer.is-open a:nth-of-type(3){transition-delay:.14s}
.drawer.is-open a:nth-of-type(4){transition-delay:.18s}
.drawer.is-open a:nth-of-type(5){transition-delay:.22s}
.drawer.is-open a:nth-of-type(6){transition-delay:.26s}
.drawer.is-open a:nth-of-type(7){transition-delay:.30s}

/* 按下/悬停：字色变金、字距张开 */
.drawer a:hover,.drawer a:active{
  color:var(--gold-d) !important;
  letter-spacing:.14em;
}

/* 抽屉里不重复语言列表 */
.drawer .lang__panel{display:none !important}


/* ===== drawer-ink-v4：深墨底 + 米金字的手机菜单 ===== */
.drawer{
  background:#171310 !important;
  padding:0 26px 40px !important;
  display:flex !important;
  flex-direction:column;
  background-image:
    radial-gradient(circle at 50% -10%, rgba(200,164,104,.20), transparent 62%),
    linear-gradient(180deg,#1b1611 0%,#100d0a 100%) !important;
}

/* 顶部品牌字 */
.drawer::before{
  content:"ASHION";
  display:block;
  text-align:center;
  font-family:var(--serif);
  font-size:.82rem;
  letter-spacing:.46em;
  text-indent:.46em;
  color:#c8a468;
  padding:26px 0 2px;
}

/* 关闭键 */
.drawer__bar{
  position:static !important;
  background:transparent !important;
  border:0 !important;
  padding:8px 0 0 !important;
  margin:0 !important;
  display:flex !important;
  justify-content:flex-end;
}
.drawer__x{
  width:40px !important;height:40px !important;
  border-radius:999px !important;
  background:transparent !important;
  border:1px solid rgba(200,164,104,.42) !important;
  color:#e6d8bf !important;
  font-size:14px !important;
}
.drawer__x:hover,.drawer__x:active{
  background:#c8a468 !important;
  border-color:#c8a468 !important;
  color:#171310 !important;
  transform:rotate(90deg);
}

/* 导航 */
.drawer a{
  display:block !important;
  text-align:center !important;
  font-family:var(--serif) !important;
  font-size:clamp(1.28rem,4.8vw,1.58rem) !important;
  line-height:1.25 !important;
  letter-spacing:.09em;
  color:#f2e8d6 !important;
  padding:17px 0 !important;
  border:0 !important;
  border-bottom:1px solid rgba(200,164,104,.16) !important;
  background:transparent !important;
}
.drawer a:last-of-type{border-bottom:0 !important}
.drawer a:hover,.drawer a:active{
  color:#d9b877 !important;
  letter-spacing:.17em;
}

/* 底部联系方式 */
.drawer::after{
  content:"+86 13025125325  ·  ashion5325@gmail.com";
  display:block;
  margin-top:auto;
  padding-top:26px;
  text-align:center;
  font-family:var(--num);
  font-size:11.5px;
  letter-spacing:.08em;
  color:rgba(230,216,191,.5);
  border-top:1px solid rgba(200,164,104,.16);
}

.drawer .lang__panel{display:none !important}


/* ===== drawer-grid-v5：浅底 + 卡片网格菜单 ===== */
.drawer{
  background:#f8f4ec !important;
  background-image:none !important;
  padding:0 22px 34px !important;
  display:block !important;
}

/* 品牌字（浅色，金色） */
.drawer::before{
  content:"ASHION";
  display:block;
  text-align:center;
  font-family:var(--serif);
  font-size:.8rem;
  letter-spacing:.44em;
  text-indent:.44em;
  color:#b08d57;
  padding:22px 0 0;
}

/* 关闭键：浅底深字 */
.drawer__bar{
  position:absolute !important;
  top:14px;inset-inline-end:16px;
  padding:0 !important;margin:0 !important;
  background:transparent !important;border:0 !important;
  display:block !important;
}
.drawer__x{
  width:38px !important;height:38px !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(176,141,87,.35) !important;
  color:#3a2f22 !important;
  font-size:14px !important;
  box-shadow:0 6px 16px -10px rgba(120,88,36,.5);
  transition:background .3s ease,color .3s ease,border-color .3s ease,
             transform .38s cubic-bezier(.2,.7,.3,1);
}
.drawer__x:hover,.drawer__x:active{
  background:#b08d57 !important;border-color:#b08d57 !important;
  color:#fff !important;transform:rotate(90deg);
}

/* 菜单：两列卡片网格 */
.drawer{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:10px;
  align-content:start;
}
.drawer::before,
.drawer__bar{grid-column:1 / -1}

.drawer a{
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  text-align:start !important;
  font-family:var(--sans) !important;
  font-size:14.5px !important;
  font-weight:600 !important;
  line-height:1.3 !important;
  letter-spacing:.01em;
  color:#2b241a !important;
  background:#fffdf8 !important;
  border:1px solid rgba(176,141,87,.24) !important;
  border-radius:12px;
  padding:15px 12px 15px 14px !important;
  box-shadow:0 8px 20px -16px rgba(120,88,36,.5);
  transition:transform .32s cubic-bezier(.2,.7,.3,1),
             box-shadow .32s ease, border-color .3s ease, background .3s ease,
             color .3s ease;
}
/* 每张卡右上角的序号 */
.drawer a::before{
  content:counter(dnav, decimal-leading-zero);
  position:absolute;
  top:8px;inset-inline-end:10px;
  font-family:var(--num);
  font-size:10px;
  letter-spacing:.06em;
  color:rgba(176,141,87,.55);
  transition:color .3s ease;
}
.drawer a:nth-of-type(1){counter-increment:none}
.drawer{counter-reset:dnav}
.drawer a{counter-increment:dnav}

/* 卡片右下角小箭头 */
.drawer a::after{
  content:"\2192" !important;
  display:block !important;
  font-family:var(--num);
  font-size:13px;
  color:rgba(176,141,87,.5);
  transition:transform .32s cubic-bezier(.2,.7,.3,1), color .3s ease;
}

.drawer a:hover,.drawer a:active{
  background:#fff8ec !important;
  border-color:#b08d57 !important;
  color:#7d5316 !important;
  transform:translateY(-2px);
  box-shadow:0 16px 30px -18px rgba(120,88,36,.6);
}
.drawer a:hover::after,.drawer a:active::after{
  transform:translateX(3px);color:#b08d57;
}
.drawer a:hover::before{color:#b08d57}

/* 底部联系方式 */
.drawer::after{
  content:"+86 13025125325";
  grid-column:1 / -1;
  margin-top:14px;
  padding-top:16px;
  text-align:center;
  font-family:var(--num);
  font-size:12px;
  letter-spacing:.08em;
  color:rgba(58,47,34,.55);
  border-top:1px solid rgba(176,141,87,.2);
}

.drawer .lang__panel{display:none !important}


/* ===== drawer-small-v6：小屏友好（320~430px）+ 去掉电话 ===== */
/* 关闭键回到正常文档流，不再压住第一张卡片 */
.drawer__bar{
  position:static !important;
  grid-column:1 / -1;
  display:flex !important;
  justify-content:flex-end;
  padding:0 0 4px !important;
  margin:0 0 6px !important;
}

/* 去掉底部电话号码 */
.drawer::after{display:none !important;content:none !important}

/* 常规手机：卡片再大一点 */
.drawer{gap:12px !important}
.drawer a{
  font-size:16px !important;
  padding:19px 14px 19px 16px !important;
  min-height:58px !important;
}
.drawer a::before{font-size:11px !important;top:9px !important}
.drawer a::after{font-size:14px !important}

/* 小屏（iPhone SE / 4S 这一档）：改单列、放大到舒适尺寸 */
@media (max-width:440px){
  .drawer{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:0 18px 28px !important;
  }
  .drawer a{
    font-size:17.5px !important;
    padding:21px 16px 21px 18px !important;
    min-height:62px !important;
    border-radius:14px !important;
  }
  .drawer a::before{font-size:11.5px !important}
  .drawer a::after{font-size:15px !important}
  .drawer__x{width:44px !important;height:44px !important;font-size:16px !important}
  .drawer::before{font-size:.86rem !important;padding-top:20px !important}
}

/* 超小屏（<360px）：进一步放大点击区 */
@media (max-width:360px){
  .drawer a{font-size:18px !important;min-height:66px !important}
  .drawer{gap:9px !important}
}


/* ===== drawer-plain-v7：单列居中列表（按确认的样式） ===== */
.drawer{
  display:block !important;
  grid-template-columns:none !important;
  background:#faf7f1 !important;
  background-image:none !important;
  padding:0 24px 34px !important;
}

/* 品牌字 */
.drawer::before{
  content:"ASHION";
  display:block;
  text-align:center;
  font-family:var(--serif);
  font-size:.82rem;
  letter-spacing:.42em;
  text-indent:.42em;
  color:#b08d57;
  padding:20px 0 0;
}

/* 关闭键：独占一行，右对齐 */
.drawer__bar{
  position:static !important;
  display:flex !important;
  justify-content:flex-end;
  padding:6px 0 10px !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
}
.drawer__x{
  width:42px !important;height:42px !important;
  border-radius:999px !important;
  background:#fff !important;
  border:1px solid rgba(176,141,87,.4) !important;
  color:#3a2f22 !important;
  font-size:15px !important;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .38s cubic-bezier(.2,.7,.3,1);
}
.drawer__x:hover,.drawer__x:active{
  background:#b08d57 !important;border-color:#b08d57 !important;
  color:#fff !important;transform:rotate(90deg);
}

/* 导航：单列、居中、大字号、无卡片 */
.drawer a{
  display:block !important;
  text-align:center !important;
  font-family:var(--serif) !important;
  font-size:clamp(1.28rem,5.4vw,1.55rem) !important;
  font-weight:500 !important;
  line-height:1.25 !important;
  letter-spacing:.05em;
  color:#241d14 !important;
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid rgba(176,141,87,.28) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:20px 0 !important;
  min-height:0 !important;
  transition:color .3s ease, letter-spacing .35s cubic-bezier(.2,.7,.3,1);
}
.drawer a::before{display:none !important;content:none !important}
.drawer a::after{display:none !important;content:none !important}
.drawer a:last-of-type{border-bottom:0 !important}

.drawer a:hover,.drawer a:active{
  color:#8a6420 !important;
  letter-spacing:.1em;
}

/* 小屏：字号再大一点，行更高 */
@media (max-width:440px){
  .drawer{padding:0 18px 30px !important}
  .drawer a{
    font-size:1.42rem !important;
    padding:22px 0 !important;
  }
  .drawer__x{width:46px !important;height:46px !important;font-size:16px !important}
}
@media (max-width:360px){
  .drawer a{font-size:1.5rem !important;padding:24px 0 !important}
}

.drawer::after{display:none !important;content:none !important}
.drawer .lang__panel{display:none !important}


/* ===== cat-photo-v1：实拍图不再被白雾糊住 ===== */
/* 只在底部做渐隐（文字压在那里），上半部分完全清透 */
.cat::after{
  background:linear-gradient(180deg,
    rgba(255,255,255,0) 0%,
    rgba(253,251,247,0) 46%,
    rgba(253,251,247,.62) 72%,
    rgba(253,251,247,.94) 100%) !important;
}
/* 图片本身：恢复正常色彩与对比 */
.cat__img img{
  filter:saturate(1.02) contrast(1.04) !important;
}
.cat:hover .cat__img img{
  filter:saturate(1.06) contrast(1.06) !important;
}
/* 标题离底边近一点，别被渐隐吃掉 */
.cat h3{position:relative;z-index:2}
.cat .meta{position:relative;z-index:2}


/* ===== numwrapped-fix-v1：数字包裹不能制造空隙 ===== */
.num-wrapped{
  display:inline !important;
  margin:0 !important;
  padding:0 !important;
  letter-spacing:0 !important;
  word-spacing:0 !important;
  text-indent:0 !important;
}
/* 说明性正文（下单须知等）不需要数字特殊字体，直接不包 */
.notice, .notice li, .notice p{font-variant-numeric:normal}


/* ===== 提交订单：主按钮独占一行，联系降级为小字链接 ===== */
.submit-row{display:flex;flex-direction:column;gap:14px;margin-top:22px}
.btn--submit{
  width:100%;
  padding:17px 20px;
  font-size:15.5px;
  letter-spacing:.06em;
}
.ask-link{
  display:inline-flex;align-items:center;gap:7px;
  align-self:center;
  font-size:12.5px;
  color:var(--ink-3);
  letter-spacing:.01em;
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color .3s ease,border-color .3s ease;
}
.ask-link:hover{color:var(--gold-d);border-bottom-color:rgba(176,141,87,.5)}
.ask-link svg{flex:0 0 auto;opacity:.75}
@media (max-width:560px){
  .btn--submit{width:100%;padding:16px 18px;font-size:15px}
  .ask-link{font-size:12px}
}


/* ===== about-facts-v1：公司简介五点对齐（8 语言通用） ===== */
#aboutIntro .split{align-items:stretch;gap:clamp(36px,4vw,72px)}
#aboutIntro .split__media{height:100%;min-height:340px;overflow:hidden;border-radius:20px}
#aboutIntro .split__media img{width:100%;height:100%;object-fit:cover;display:block}
#aboutIntro .split__body{display:flex;flex-direction:column;justify-content:center;max-width:none;width:100%}

#aboutIntro .split__body p.lead{
  font-size:15.5px !important;line-height:1.95 !important;
  max-width:62ch !important;color:var(--ink-2) !important;
}

#aboutIntro .facts{
  display:grid !important;
  grid-template-columns:max-content minmax(0,1fr) !important;
  column-gap:clamp(24px,3vw,44px) !important;
  row-gap:0;margin:24px 0 0;
  border-top:1px solid rgba(176,141,87,.22);
}
#aboutIntro .facts > div{display:contents !important}
#aboutIntro .facts dt{
  padding:14px 0;border-bottom:1px solid rgba(176,141,87,.14);
  font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold-d);font-weight:700;white-space:nowrap;
}
#aboutIntro .facts dd{
  padding:14px 0;border-bottom:1px solid rgba(176,141,87,.14);
  margin:0;font-size:14.5px;line-height:1.7;color:var(--ink);
  min-width:0;overflow-wrap:anywhere;
}
#aboutIntro .facts > div:last-child dt,
#aboutIntro .facts > div:last-child dd{border-bottom:0}

#aboutIntro p.lead--note{
  margin-top:18px !important;padding-top:16px;
  border-top:1px solid rgba(176,141,87,.18);
  font-size:14.5px !important;color:var(--ink-2) !important;
}

@media (max-width:1024px){
  #aboutIntro .split__media{height:auto;min-height:260px}
  #aboutIntro .split__media img{height:260px}
}
@media (max-width:640px){
  #aboutIntro .facts{grid-template-columns:1fr !important;column-gap:0}
  #aboutIntro .facts dt{padding-bottom:2px;border-bottom:0}
  #aboutIntro .facts dd{padding-top:0}
}


/* ===== timeline-live-v1：发展历程的滚动互动 ===== */
.timeline{position:relative}
/* 竖轴：一条灰色底轴 + 一条按滚动进度生长的金色轴 */
.timeline::before{
  content:"";
  position:absolute;
  inset-inline-start:0;top:0;bottom:0;width:2px;
  background:rgba(176,141,87,.16);
  border-radius:2px;
}
.timeline::after{
  content:"";
  position:absolute;
  inset-inline-start:0;top:0;width:2px;
  height:calc(var(--prog,0) * 100%);
  background:linear-gradient(180deg,#e6d2ab,#b08d57);
  border-radius:2px;
  transition:height .25s linear;
  box-shadow:0 0 14px rgba(176,141,87,.45);
}
.tl{padding-inline-start:26px}

/* 节点圆点 */
.tl::before{
  transition:background .35s ease, border-color .35s ease,
             transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s ease;
}
/* 当前视口中心的那一条 */
.tl.is-active::before{
  background:#b08d57;
  border-color:#b08d57;
  transform:scale(1.45);
  box-shadow:0 0 0 6px rgba(176,141,87,.16);
}
/* 悬停 / 按压 */
.tl:hover::before,
.tl:active::before{
  background:#b08d57;
  border-color:#b08d57;
  transform:scale(1.3);
  box-shadow:0 0 0 5px rgba(176,141,87,.14);
}

/* 年份与正文 */
.tl .y{
  display:inline-block;
  transition:color .3s ease, transform .45s cubic-bezier(.2,.7,.3,1),
             letter-spacing .45s cubic-bezier(.2,.7,.3,1);
}
.tl.is-active .y,
.tl:hover .y{
  color:#7d5316;
  transform:translateY(-3px);
  letter-spacing:.06em;
}
.tl p{transition:color .3s ease}
.tl.is-active p,
.tl:hover p{color:var(--ink)}

/* 条目整体轻微右移，形成“读到这一条”的反馈 */
.tl{transition:transform .45s cubic-bezier(.2,.7,.3,1)}
.tl.is-active{transform:translateX(4px)}
.tl:hover{transform:translateX(4px)}

@media (max-width:720px){
  .tl{padding-inline-start:22px}
  .tl.is-active,
  .tl:hover{transform:none}
  .tl.is-active .y{transform:translateY(-2px)}
}


/* ===== 关于我们：发展历程 / 核心优势 的代码底图 ===== */
#abTimeline, #abStrength{position:relative;overflow:hidden}
.ab-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
#abTimeline > .wrap, #abStrength > .wrap{position:relative;z-index:1}
.ab-art--time{opacity:.95}
.ab-art--str{opacity:.95}


/* ===== cards-live-v1：核心优势卡片的互动 ===== */
#abStrength .card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border-radius:16px !important;
  padding:28px 26px 26px !important;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),
             box-shadow .5s cubic-bezier(.2,.7,.3,1),
             border-color .35s ease, background .45s ease;
  --mx:50%;
  --my:0%;
}
/* 跟随鼠标 / 手指的高光 */
#abStrength .card::after{
  content:"";
  position:absolute;inset:0;z-index:-1;
  background:radial-gradient(220px circle at var(--mx) var(--my),
              rgba(200,164,104,.20), transparent 68%);
  opacity:0;
  transition:opacity .4s ease;
  pointer-events:none;
}
#abStrength .card:hover::after,
#abStrength .card.is-touch::after{opacity:1}

/* 顶部金线：悬停从左展开 */
#abStrength .card::before{
  content:"";
  position:absolute;top:0;inset-inline:0;height:2px;z-index:2;
  background:linear-gradient(90deg,var(--gold-l),var(--gold),var(--gold-l));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .55s cubic-bezier(.2,.7,.3,1);
}
#abStrength .card:hover::before,
#abStrength .card.is-touch::before{transform:scaleX(1)}

#abStrength .card:hover{
  transform:translateY(-10px);
  border-color:var(--gold) !important;
  box-shadow:0 30px 56px -26px rgba(120,88,36,.45);
}

/* 图标块：翻金 + 旋转放大 */
#abStrength .card .ic{
  transition:background .4s ease,border-color .35s ease,color .35s ease,
             transform .5s cubic-bezier(.2,.7,.3,1),box-shadow .45s ease;
}
#abStrength .card:hover .ic,
#abStrength .card.is-touch .ic{
  background:linear-gradient(145deg,#e8d6b4,#c9a86a) !important;
  border-color:rgba(176,141,87,.55) !important;
  color:#2b1f0c !important;
  transform:rotate(-6deg) scale(1.08);
  box-shadow:0 12px 24px -12px rgba(160,120,50,.7);
}

#abStrength .card h3{transition:color .3s ease,transform .4s cubic-bezier(.2,.7,.3,1)}
#abStrength .card:hover h3{color:var(--gold-d);transform:translateY(-1px)}
#abStrength .card p{transition:color .3s ease}
#abStrength .card:hover p{color:var(--ink)}

/* 入场：逐张淡入上浮 */
#abStrength .card{opacity:0;transform:translateY(14px)}
#abStrength .card.live{opacity:1;transform:none}
#abStrength .card.live:nth-child(1){transition-delay:.05s}
#abStrength .card.live:nth-child(2){transition-delay:.10s}
#abStrength .card.live:nth-child(3){transition-delay:.15s}
#abStrength .card.live:nth-child(4){transition-delay:.20s}
#abStrength .card.live:nth-child(5){transition-delay:.25s}
#abStrength .card.live:nth-child(6){transition-delay:.30s}

/* 手机：按下即点亮 */
@media (hover:none){
  #abStrength .card:active{
    transform:translateY(-4px);
    border-color:var(--gold) !important;
    box-shadow:0 18px 34px -22px rgba(120,88,36,.5);
  }
}


/* ===== partners-live-v1：合作企业板块 ===== */
#abPartners{position:relative;overflow:hidden}
.pt-art{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;pointer-events:none;display:block;
}
#abPartners > .wrap{position:relative;z-index:1}

/* 评价卡：光斑跟随 + 上浮 + 星标闪动 */
#abPartners .quote{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  --mx:50%;--my:0%;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),
             box-shadow .5s cubic-bezier(.2,.7,.3,1),
             border-color .35s ease, background .45s ease;
}
#abPartners .quote::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(240px circle at var(--mx) var(--my),
              rgba(200,164,104,.22), transparent 70%);
  opacity:0;transition:opacity .4s ease;pointer-events:none;
}
#abPartners .quote:hover::after,
#abPartners .quote.is-touch::after{opacity:1}
#abPartners .quote:hover{
  transform:translateY(-8px);
  border-color:var(--gold) !important;
  box-shadow:0 26px 50px -24px rgba(120,88,36,.42);
}
#abPartners .quote .stars{
  display:inline-block;
  transition:letter-spacing .5s cubic-bezier(.2,.7,.3,1), color .3s ease, transform .4s ease;
}
#abPartners .quote:hover .stars{
  letter-spacing:4px;color:#c8a468;transform:translateY(-1px);
}
#abPartners .quote p{transition:color .3s ease}
#abPartners .quote:hover p{color:var(--ink)}
#abPartners .quote .av{
  transition:background .4s ease,color .4s ease,transform .45s cubic-bezier(.2,.7,.3,1);
}
#abPartners .quote:hover .av{
  background:linear-gradient(145deg,#e8d6b4,#c9a86a);
  color:#2b1f0c;
  transform:scale(1.1);
}

/* 合作伙伴跑马灯：悬停变亮 + 缓慢停下 */
#abPartners .marquee{
  position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
#abPartners .marquee__track span{
  transition:color .35s ease, opacity .35s ease, letter-spacing .45s cubic-bezier(.2,.7,.3,1);
  opacity:.55;
}
#abPartners .marquee:hover .marquee__track span{
  opacity:.9;letter-spacing:.22em;
}
#abPartners .marquee:hover .marquee__track{
  animation-play-state:paused;
}

@media (hover:none){
  #abPartners .quote:active{
    transform:translateY(-3px);
    border-color:var(--gold) !important;
  }
}


/* ===== avatar-photo-v1：评价卡人像 ===== */
img.av{
  object-fit:cover;
  object-position:center 30%;
  border-radius:999px;
  display:block;
  background:var(--cream);
  filter:saturate(.96) contrast(1.02);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s ease, filter .35s ease;
}
.quote:hover img.av{
  transform:scale(1.08);
  filter:saturate(1.05) contrast(1.05);
  box-shadow:0 8px 18px -8px rgba(120,88,36,.6);
}


/* ===== burger-lux-v1：汉堡按钮重做 ===== */
.burger{
  width:42px !important;
  height:42px !important;
  border:0 !important;
  background:transparent !important;
  border-radius:999px !important;
  display:grid !important;
  place-items:center;
  padding:0 !important;
  cursor:pointer;
  position:relative;
  transition:background .35s ease, transform .4s cubic-bezier(.2,.7,.3,1);
}
/* 悬停/按下时的浅金底 */
.burger::before{
  content:"";
  position:absolute;inset:0;
  border-radius:999px;
  background:rgba(176,141,87,.14);
  opacity:0;
  transform:scale(.8);
  transition:opacity .35s ease, transform .4s cubic-bezier(.2,.7,.3,1);
}
.burger:hover::before,
.burger:active::before{opacity:1;transform:scale(1)}

.burger span{
  display:block;
  width:19px;
  height:1.8px;
  border-radius:2px;
  background:var(--ink);
  position:relative;
  transition:transform .45s cubic-bezier(.2,.7,.3,1),
             opacity .3s ease,
             width .35s cubic-bezier(.2,.7,.3,1),
             background .3s ease;
}
.burger span + span{margin-top:4.5px}
/* 三线长度错落，看起来更讲究 */
.burger span:nth-child(1){width:19px}
.burger span:nth-child(2){width:14px}
.burger span:nth-child(3){width:19px}

.burger:hover span{background:var(--gold-d)}
.burger:hover span:nth-child(2){width:19px}

/* 打开时变 ✕ */
.burger[aria-expanded="true"] span:nth-child(1){
  transform:translateY(6.3px) rotate(45deg);
  width:19px;
  background:var(--gold-d);
}
.burger[aria-expanded="true"] span:nth-child(2){
  opacity:0;
  transform:scaleX(.4);
}
.burger[aria-expanded="true"] span:nth-child(3){
  transform:translateY(-6.3px) rotate(-45deg);
  width:19px;
  background:var(--gold-d);
}

@media (max-width:600px){
  .burger{width:40px !important;height:40px !important}
  .burger span{width:18px}
  .burger span:nth-child(2){width:13px}
}


/* ===== burger-solid-v2：实心金色汉堡按钮，醒目 ===== */
.burger{
  width:44px !important;
  height:44px !important;
  display:grid !important;
  place-items:center;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:linear-gradient(150deg,#c9a86a 0%,#a9834a 100%) !important;
  box-shadow:0 8px 20px -8px rgba(150,112,50,.75),
             inset 0 1px 0 rgba(255,255,255,.35);
  cursor:pointer;
  outline:none !important;
  -webkit-tap-highlight-color:transparent;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),
             box-shadow .35s ease, filter .3s ease;
}
.burger::before{display:none !important;content:none !important}

.burger:hover,.burger:active{
  transform:translateY(-1px) scale(1.05);
  box-shadow:0 12px 26px -10px rgba(150,112,50,.9),
             inset 0 1px 0 rgba(255,255,255,.45);
  filter:brightness(1.06);
}
.burger:focus-visible{
  box-shadow:0 0 0 3px rgba(176,141,87,.35),
             0 8px 20px -8px rgba(150,112,50,.75);
}

.burger span{
  display:block;
  height:2px !important;
  border-radius:2px;
  background:#fff !important;
  transition:transform .45s cubic-bezier(.2,.7,.3,1),
             opacity .28s ease, width .35s cubic-bezier(.2,.7,.3,1);
}
.burger span:nth-child(1){width:18px !important}
.burger span:nth-child(2){width:13px !important}
.burger span:nth-child(3){width:18px !important}
.burger span + span{margin-top:4px}

.burger:hover span:nth-child(2),
.burger:active span:nth-child(2){width:18px !important}

/* 打开时变 ✕ */
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);width:18px !important}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.3)}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);width:18px !important}

@media (max-width:600px){
  .burger{width:42px !important;height:42px !important}
}


/* ===== burger-ink-v3：墨色实心汉堡按钮 ===== */
.burger{
  width:42px !important;
  height:42px !important;
  display:grid !important;
  place-items:center;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#1d1913 !important;
  box-shadow:0 6px 16px -8px rgba(0,0,0,.55);
  cursor:pointer;
  outline:none !important;
  -webkit-tap-highlight-color:transparent;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),
             box-shadow .35s ease, background .3s ease;
}
.burger::before{display:none !important;content:none !important}

.burger:hover,.burger:active{
  background:#2a231a !important;
  transform:translateY(-1px) scale(1.04);
  box-shadow:0 10px 22px -10px rgba(0,0,0,.7);
}
.burger:focus-visible{
  box-shadow:0 0 0 3px rgba(176,141,87,.45), 0 6px 16px -8px rgba(0,0,0,.55);
}

.burger span{
  display:block;
  height:1.8px !important;
  border-radius:2px;
  background:#f4ead8 !important;
  transition:transform .45s cubic-bezier(.2,.7,.3,1),
             opacity .28s ease, width .35s cubic-bezier(.2,.7,.3,1);
}
.burger span:nth-child(1){width:17px !important}
.burger span:nth-child(2){width:12px !important}
.burger span:nth-child(3){width:17px !important}
.burger span + span{margin-top:4px}

.burger:hover span:nth-child(2),
.burger:active span:nth-child(2){width:17px !important}

/* 打开时变 ✕ */
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(5.8px) rotate(45deg);width:17px !important}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.3)}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.8px) rotate(-45deg);width:17px !important}


/* ===== burger-pill-v4：带文字的胶囊菜单按钮 ===== */
.burger{
  width:auto !important;
  height:40px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:0 16px !important;
  border-radius:999px !important;
  background:#fffdf8 !important;
  border:1px solid rgba(176,141,87,.42) !important;
  box-shadow:0 8px 18px -12px rgba(120,88,36,.55);
  color:#241d14;
  cursor:pointer;
  outline:none !important;
  -webkit-tap-highlight-color:transparent;
  transition:transform .32s cubic-bezier(.2,.7,.3,1),
             box-shadow .32s ease, background .3s ease, border-color .3s ease;
}
.burger::before{display:none !important;content:none !important}

.burger:hover,.burger:active{
  background:#fff !important;
  border-color:rgba(176,141,87,.75) !important;
  transform:translateY(-1px);
  box-shadow:0 12px 24px -14px rgba(120,88,36,.7);
}
.burger:focus-visible{
  box-shadow:0 0 0 3px rgba(176,141,87,.3), 0 8px 18px -12px rgba(120,88,36,.55);
}

/* 三条杠 */
.burger__bars{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3.6px;
  width:16px;
}
.burger__bars > span{
  display:block;
  width:100%;
  height:1.7px;
  border-radius:2px;
  background:currentColor;
  transition:transform .42s cubic-bezier(.2,.7,.3,1),
             opacity .26s ease, width .32s ease;
}
.burger__bars > span:nth-child(2){width:70%}
.burger:hover .burger__bars > span:nth-child(2){width:100%}

/* 文字 */
.burger__lb{
  font-style:normal;
  font-family:var(--sans);
  font-size:11px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1;
  color:inherit;
  transition:color .3s ease;
}
.burger:hover .burger__lb{color:#8a6420}

/* 打开时：杠变 ✕，文字变 Close */
.burger[aria-expanded="true"]{background:#fdf7ec !important;border-color:rgba(176,141,87,.75) !important}
.burger[aria-expanded="true"] .burger__bars > span:nth-child(1){transform:translateY(5.3px) rotate(45deg);width:100%}
.burger[aria-expanded="true"] .burger__bars > span:nth-child(2){opacity:0;transform:scaleX(.2)}
.burger[aria-expanded="true"] .burger__bars > span:nth-child(3){transform:translateY(-5.3px) rotate(-45deg);width:100%}
.burger[aria-expanded="true"] .burger__lb{color:#8a6420}

@media (max-width:600px){
  .burger{height:38px !important;padding:0 13px !important;gap:7px}
  .burger__lb{font-size:10.5px;letter-spacing:.1em}
}
@media (max-width:380px){
  .burger__lb{display:none}
  .burger{width:40px !important;padding:0 !important}
}


/* ===== burger-clean-v5：白底胶囊，只放三条杠 ===== */
.burger__lb{display:none !important}

.burger{
  width:56px !important;
  height:38px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:0 !important;
  border-radius:999px !important;
  background:#fffdf8 !important;
  border:1px solid rgba(176,141,87,.42) !important;
  box-shadow:0 6px 16px -12px rgba(120,88,36,.5);
  color:#241d14;
  cursor:pointer;
  outline:none !important;
  -webkit-tap-highlight-color:transparent;
  transition:transform .32s cubic-bezier(.2,.7,.3,1),
             box-shadow .32s ease, background .3s ease, border-color .3s ease;
}
.burger:hover,.burger:active{
  background:#fff !important;
  border-color:rgba(176,141,87,.8) !important;
  transform:translateY(-1px);
  box-shadow:0 10px 20px -14px rgba(120,88,36,.7);
}
.burger:focus-visible{
  box-shadow:0 0 0 3px rgba(176,141,87,.3);
}
.burger[aria-expanded="true"]{
  background:#fdf7ec !important;
  border-color:rgba(176,141,87,.8) !important;
}

/* 三条杠：居中、等距、18px 宽 */
.burger__bars{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:4px;
  width:18px;
}
.burger__bars > span{
  display:block;
  width:18px;
  height:1.8px;
  border-radius:2px;
  background:currentColor;
  transition:transform .42s cubic-bezier(.2,.7,.3,1),
             opacity .26s ease, width .32s ease;
}
/* 中间那条略短，收着更精致 */
.burger__bars > span:nth-child(2){width:12px}
.burger:hover .burger__bars > span:nth-child(2){width:18px}

/* 打开变 ✕ */
.burger[aria-expanded="true"] .burger__bars > span:nth-child(1){transform:translateY(5.8px) rotate(45deg);width:18px}
.burger[aria-expanded="true"] .burger__bars > span:nth-child(2){opacity:0;transform:scaleX(.2)}
.burger[aria-expanded="true"] .burger__bars > span:nth-child(3){transform:translateY(-5.8px) rotate(-45deg);width:18px}

@media (max-width:600px){
  .burger{width:54px !important;height:36px !important}
}


/* ===== burger-desktop-hide：电脑端不显示菜单按钮 ===== */
/* 桌面才藏汉堡按钮。原来写的是 861px，但导航栏到 1024px 才收起，
   861–1024 之间就出现「导航隐藏 + 汉堡也隐藏」= 完全没有导航的断层。 */
@media (min-width:1025px){
  .burger{display:none !important}
}


/* ===== header-stack-fix：毛玻璃层不再盖住 Logo ===== */
.header::before{
  z-index:0 !important;
}
.header__inner{
  position:relative;
  z-index:2;
}
.header .brand{
  position:relative;
  z-index:3;
  opacity:1 !important;
  visibility:visible !important;
}
.header .brand__word,
.header.is-stuck .brand__word{
  color:var(--ink) !important;
  opacity:1 !important;
}

/* ===== RTL 排版修正 =====
   标题用的是衬线字族（Cormorant / 思源宋体），这些字体没有阿拉伯字形，
   阿拉伯语界面会回退到系统字体、字距也被拉开。这里给 RTL 的标题单独指定 Cairo，
   并把字距归零，避免连写字母被撑开。 */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] .pcard__name,
[dir="rtl"] .sec-head h2{
  font-family:var(--ar);
  letter-spacing:0;
}
