/* ==========================================================================
   Draperie — fabric curtains & window textiles theme
   ZanCMS / template/default/pc/skin/css/draperie.css
   Palette: graphite ink / slate / camel / copper / brass on linen and sand
   ========================================================================== */

/* ---------------------------------------------------------------- tokens */
:root{
  --dr-ink:#1a1b20;
  --dr-ink-2:#2c2f38;
  --dr-slate:#4a4f5c;
  --dr-camel:#b98a5a;
  --dr-camel-2:#a1744a;
  --dr-copper:#c1693a;
  --dr-copper-2:#a5542c;
  --dr-brass:#d8b46a;
  --dr-linen:#faf7f1;
  --dr-sand:#f0e9dd;
  --dr-sand-2:#e6dccb;
  --dr-white:#ffffff;
  --dr-line:#e0d5c4;
  --dr-line-2:#d3c5ae;
  --dr-muted:#7c7466;
  --dr-neg:#a03a2b;

  --dr-radius:14px;
  --dr-radius-lg:24px;
  --dr-wrap:1320px;
  --dr-shadow:0 26px 52px -34px rgba(26,27,32,.42);
  --dr-shadow-sm:0 12px 26px -20px rgba(26,27,32,.4);

  --dr-ff-display:"Palatino Linotype","Book Antiqua",Palatino,"Times New Roman",serif;
  --dr-ff-body:Calibri,Candara,"Segoe UI",system-ui,-apple-system,sans-serif;
  --dr-ff-mark:"Lucida Console","DejaVu Sans Mono",Monaco,monospace;
}

/* ------------------------------------------------------------------ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--dr-linen);color:var(--dr-ink);
  font-family:var(--dr-ff-body);font-size:16.5px;line-height:1.68;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.mh-noscroll{overflow:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--dr-copper)}
h1,h2,h3,h4,h5{margin:0 0 .5em;font-family:var(--dr-ff-display);font-weight:600;line-height:1.18;letter-spacing:-.005em;color:var(--dr-ink)}
h1{font-size:clamp(30px,4.1vw,54px)}
h2{font-size:clamp(24px,2.9vw,38px)}
h3{font-size:clamp(18px,1.7vw,23px)}
h4{font-size:16px;letter-spacing:.02em}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
figure{margin:0}
table{border-collapse:collapse;width:100%}
button{font:inherit;color:inherit}
input,textarea,select{font:inherit}
:focus-visible{outline:2px solid var(--dr-copper);outline-offset:2px}

.skip-link{
  position:fixed;left:12px;top:-64px;z-index:200;
  background:var(--dr-ink);color:#fff;padding:11px 20px;border-radius:0 0 var(--dr-radius) var(--dr-radius);
  font-family:var(--dr-ff-mark);font-size:12px;letter-spacing:.09em;text-transform:uppercase;
  transition:top .18s ease;
}
.skip-link:focus{top:0;color:#fff}
.mh-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* -------------------------------------------------------------- utilities */
.mh-wrap{width:100%;max-width:var(--dr-wrap);margin:0 auto;padding:0 32px}
.mh-sec{padding:74px 0}
.mh-sec-white{background:var(--dr-white)}
.mh-sec-linen{background:var(--dr-linen)}
.mh-sec-sand{background:var(--dr-sand)}
.mh-mt{margin-top:56px}
.mh-mb{margin-bottom:34px}
.mh-mt-sm{margin-top:22px}

.mh-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--dr-ff-mark);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--dr-camel-2);margin:0 0 13px;
}
.mh-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--dr-copper);flex:0 0 auto}
.mh-eyebrow-light{color:var(--dr-brass)}
.mh-eyebrow-light .dot{background:var(--dr-brass)}

.mh-head{max-width:820px}
.mh-head h2{margin-bottom:12px}
.mh-head p{color:var(--dr-slate);margin:0}
.mh-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:38px;flex-wrap:wrap}
.mh-head-row .mh-head{margin-bottom:0}
.mh-head::after{
  content:"";display:block;width:76px;height:0;margin-top:22px;
  border-top:2px solid var(--dr-camel);border-bottom:1px solid var(--dr-line-2);height:5px;
}
.mh-head-row .mh-head::after{margin-top:18px}

.mh-lead{color:var(--dr-slate);font-size:17.5px;max-width:74ch}
.mh-more{
  display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;
  font-family:var(--dr-ff-mark);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dr-ink);border-bottom:1px solid var(--dr-camel);padding-bottom:5px;
}
.mh-more i{transition:transform .22s ease}
.mh-more:hover{color:var(--dr-copper)}
.mh-more:hover i{transform:translateX(4px)}
.mh-more-light{color:var(--dr-linen);border-color:var(--dr-brass)}
.mh-more-light:hover{color:var(--dr-brass)}
.mh-section-actions{margin-top:36px;display:flex;justify-content:center}
.mh-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

.mh-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 26px;border:1px solid transparent;border-radius:var(--dr-radius);
  font-family:var(--dr-ff-mark);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;
  cursor:pointer;background:none;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
  text-align:center;
}
.mh-btn i{flex:0 0 auto}
.mh-btn:hover{transform:translateY(-1px)}
.mh-btn-ink,.mh-btn-forest{background:var(--dr-ink);color:#fff;border-color:var(--dr-ink)}
.mh-btn-ink:hover,.mh-btn-forest:hover{background:var(--dr-ink-2);color:#fff;border-color:var(--dr-ink-2)}
.mh-btn-copper,.mh-btn-gold{background:var(--dr-copper);color:#fff;border-color:var(--dr-copper)}
.mh-btn-copper:hover,.mh-btn-gold:hover{background:var(--dr-copper-2);color:#fff;border-color:var(--dr-copper-2)}
.mh-btn-line{background:transparent;color:var(--dr-ink);border-color:var(--dr-line-2)}
.mh-btn-line:hover{background:var(--dr-ink);color:#fff;border-color:var(--dr-ink)}
.mh-btn-outline{background:transparent;color:var(--dr-linen);border-color:rgba(250,247,241,.44)}
.mh-btn-outline:hover{background:var(--dr-linen);color:var(--dr-ink);border-color:var(--dr-linen)}
.mh-btn-lg{padding:17px 32px;font-size:13px}
.mh-btn-sm{padding:10px 18px;font-size:11.5px}
.mh-btn-block{width:100%}

.mh-tag{
  display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:999px;
  background:var(--dr-sand);border:1px solid var(--dr-line);
  font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dr-slate);
}
.mh-chip{
  display:inline-block;padding:6px 13px;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-slate);
}
.mh-tile-ico{
  display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;
  background:var(--dr-sand);color:var(--dr-camel-2);border:1px solid var(--dr-line);margin-bottom:16px;
}
.mh-tile-ico.ink{background:var(--dr-ink);color:var(--dr-brass);border-color:var(--dr-ink)}
.mh-tile-ico.sm{width:38px;height:38px;font-size:14px;margin:0;flex:0 0 auto}
.mh-num{font-family:var(--dr-ff-mark);font-size:12px;letter-spacing:.1em;color:var(--dr-camel-2)}

.mh-empty{
  text-align:center;padding:56px 26px;border:1px dashed var(--dr-line-2);border-radius:var(--dr-radius-lg);
  background:var(--dr-linen);
}
.mh-empty i{font-size:26px;color:var(--dr-camel);display:block;margin-bottom:14px}
.mh-empty strong{display:block;font-family:var(--dr-ff-display);font-size:19px;margin-bottom:8px}
.mh-empty p{color:var(--dr-muted);margin:0 auto;max-width:56ch}
.mh-empty .mh-actions{justify-content:center}

.mh-toolbar{
  background:var(--dr-sand);border:1px solid var(--dr-line);border-radius:var(--dr-radius);
  padding:15px 20px;margin-bottom:30px;
}
.mh-toolbar p{margin:0;display:flex;gap:11px;align-items:flex-start;color:var(--dr-slate);font-size:15px}
.mh-toolbar i{color:var(--dr-camel-2);margin-top:4px;flex:0 0 auto}
.mh-matrix-note{
  display:flex;gap:11px;align-items:flex-start;margin:22px 0 0;
  color:var(--dr-muted);font-size:14.5px;
}
.mh-matrix-note i{color:var(--dr-camel-2);margin-top:4px;flex:0 0 auto}

/* ------------------------------------------------------------------ header */
.mh-header{position:sticky;top:0;z-index:60;background:var(--dr-white);box-shadow:0 1px 0 var(--dr-line)}
.mh-topbar{
  background:var(--dr-ink);color:var(--dr-linen);
  transition:max-height .26s ease,opacity .2s ease;
  max-height:52px;overflow:hidden;
}
.mh-header.scrolled .mh-topbar{max-height:0;opacity:0}
.mh-topbar-in{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:42px;padding-top:5px;padding-bottom:5px;flex-wrap:nowrap;
}
.mh-topbar-left,.mh-topbar-right{display:flex;align-items:center;gap:18px;min-width:0;flex-wrap:nowrap}
.mh-topbar-left a,.mh-topbar-right a{
  display:inline-flex;align-items:center;gap:8px;min-width:0;
  font-family:var(--dr-ff-mark);font-size:11.5px;letter-spacing:.07em;color:var(--dr-linen);
}
.mh-topbar-left a>span,.mh-topbar-right a>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mh-topbar-left a:hover,.mh-topbar-right a:hover{color:var(--dr-brass)}
.mh-topbar-left i,.mh-topbar-right i{color:var(--dr-camel);flex:0 0 auto}
.mh-topbar-tag{
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dr-camel);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis;
}
.mh-topbar-note{color:var(--dr-sand-2)}
.mh-topbar-phone span{max-width:220px}
@media (max-width:900px){.mh-topbar-phone span{display:none}.mh-topbar-phone{width:34px;height:34px;justify-content:center;border:1px solid rgba(250,247,241,.28);border-radius:50%}}

.mh-bar-in{
  display:flex;align-items:center;gap:26px;
  min-height:96px;padding-top:12px;padding-bottom:12px;
  transition:min-height .24s ease;flex-wrap:nowrap;
}
.mh-header.scrolled .mh-bar-in{min-height:74px}
.mh-brand{display:inline-flex;align-items:center;gap:13px;min-width:0;flex:0 0 auto}
.mh-brand-img{max-height:42px;width:auto;object-fit:contain}
.mh-brand-fallback{display:inline-flex;align-items:center;gap:13px;min-width:0}
.mh-brand-mark{
  display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 auto;
  border-radius:50%;background:var(--dr-ink);color:var(--dr-brass);font-size:16px;
}
.mh-brand-txt{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.mh-brand-name{
  font-family:var(--dr-ff-display);font-size:23px;font-weight:600;letter-spacing:.01em;color:var(--dr-ink);
}
.mh-brand-tag{
  font-family:var(--dr-ff-mark);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dr-camel-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.mh-nav{display:flex;align-items:center;gap:20px;flex:1 1 auto;min-width:0}
.mh-nav-mobile{display:none}
/* overflow must stay visible: the absolute .mh-nav-sub is a descendant, so any
   clipping here would cut the desktop dropdown away. Long labels are already
   trimmed by .mh-idx-txt (max-width + ellipsis). */
.mh-idx{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;min-width:0;overflow:visible}
.mh-idx>li{position:relative;min-width:0}
.mh-idx>li>a{
  display:inline-flex;align-items:center;gap:7px;padding:10px 13px;border-bottom:2px solid transparent;
  font-family:var(--dr-ff-mark);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dr-ink);
  white-space:nowrap;
}
.mh-idx>li>a:hover,.mh-idx>li.on>a{border-bottom-color:var(--dr-copper);color:var(--dr-copper)}
.mh-idx-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
.mh-nav-tgl{
  display:none;position:absolute;right:0;top:50%;transform:translateY(-50%);
  width:30px;height:30px;border:0;background:transparent;color:var(--dr-slate);cursor:pointer;
}
.mh-nav-sub,.mh-nav-sub2{
  position:absolute;left:0;top:calc(100% + 2px);min-width:266px;padding:12px;
  background:var(--dr-white);border:1px solid var(--dr-line);border-radius:var(--dr-radius);
  box-shadow:var(--dr-shadow);opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:5;
}
.mh-idx>li:hover>.mh-nav-sub,.mh-idx>li:focus-within>.mh-nav-sub{opacity:1;visibility:visible;transform:none}
.mh-nav-sub2{left:100%;top:-12px;transform:translateX(8px)}
.mh-nav-sub li:hover>.mh-nav-sub2,.mh-nav-sub li:focus-within>.mh-nav-sub2{opacity:1;visibility:visible;transform:none}
.mh-nav-sub li{position:relative}
.mh-nav-sub>li>a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border-radius:9px;
  font-family:var(--dr-ff-body);font-size:14.5px;letter-spacing:0;text-transform:none;color:var(--dr-ink-2);
}
.mh-nav-sub>li>a:hover{background:var(--dr-sand);color:var(--dr-copper)}
.mh-nav-sub2>li>a{
  display:block;padding:8px 12px;border-radius:9px;font-family:var(--dr-ff-body);font-size:14px;
  color:var(--dr-slate);
}
.mh-nav-sub2>li>a:hover{background:var(--dr-sand);color:var(--dr-copper)}
.mh-nav-sec,.mh-nav-grid,.mh-nav-cta,.mh-nav-contact,.mh-nav-meta{display:none}

.mh-tools{display:flex;align-items:center;gap:10px;flex:0 0 auto;margin-left:auto}
.mh-tool-btn,.mh-burger{
  width:40px;height:40px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--dr-line);border-radius:50%;background:var(--dr-white);color:var(--dr-ink);cursor:pointer;
  position:relative;
}
.mh-tool-btn:hover,.mh-burger:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-badge{
  position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;
  background:var(--dr-copper);color:#fff;font-family:var(--dr-ff-mark);font-size:10px;line-height:19px;
  display:none;align-items:center;justify-content:center;
}
.mh-lang{position:relative}
.mh-lang-btn{gap:6px;border-radius:999px;width:auto;padding:0 12px}
.mh-lang-code{font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.mh-flag{width:16px;height:11px;object-fit:cover;border-radius:2px}
.mh-lang-menu{
  position:absolute;right:0;top:calc(100% + 8px);min-width:186px;padding:9px;
  background:var(--dr-white);border:1px solid var(--dr-line);border-radius:var(--dr-radius);
  box-shadow:var(--dr-shadow);opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:6;
}
.mh-lang.open .mh-lang-menu{opacity:1;visibility:visible;transform:none}
.mh-lang-menu a{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:9px;font-size:14px;color:var(--dr-ink-2)}
.mh-lang-menu a:hover{background:var(--dr-sand);color:var(--dr-copper)}
.mh-lang-menu a.on{background:var(--dr-sand);color:var(--dr-copper);font-weight:600}

.mh-searchslot{overflow:hidden;max-width:0;transition:max-width .28s ease}
.mh-header.mh-search-on .mh-searchslot{max-width:360px}
.mh-search{display:flex;align-items:center;border:1px solid var(--dr-line-2);border-radius:999px;background:var(--dr-linen);overflow:hidden}
.mh-search input{
  border:0;background:transparent;padding:11px 16px;min-width:0;flex:1 1 auto;color:var(--dr-ink);font-size:14.5px;
}
.mh-search input:focus{outline:0}
.mh-search button{
  border:0;background:var(--dr-ink);color:#fff;padding:0 16px;height:42px;cursor:pointer;
  display:inline-flex;align-items:center;gap:8px;
}
.mh-search button span{font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.mh-search button:hover{background:var(--dr-copper)}
.mh-burger{flex-direction:column;gap:4px;border-radius:50%}
.mh-burger span{display:block;width:17px;height:1.8px;background:var(--dr-ink);border-radius:2px}
/* the drawer is built only inside the <=1024px query and the JS closes it above
   that width, so the trigger must not be rendered on desktop (it was a dead button). */
@media (min-width:1025px){.mh-burger{display:none}}

/* ----------------------------------------------------------- header mobile */
@media (max-width:1180px){
  .mh-idx-txt{max-width:120px}
  .mh-cta-desktop span{display:none}
  .mh-cta-desktop{padding:0;width:40px;height:40px;border-radius:50%}
  .mh-bar-in{gap:16px}
}
@media (max-width:1024px){
  .mh-nav{
    position:fixed;top:0;left:0;bottom:0;width:min(360px,88vw);z-index:80;
    display:block;overflow-y:auto;overscroll-behavior:contain;
    background:var(--dr-white);border-right:1px solid var(--dr-line);
    padding:20px 22px 40px;gap:0;transform:translateX(-102%);transition:transform .3s ease;
    box-shadow:var(--dr-shadow);
  }
  .mh-nav.open{transform:none}
  .mh-nav-mobile{
    display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;
    padding-bottom:14px;border-bottom:1px solid var(--dr-line);
    font-family:var(--dr-ff-mark);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dr-muted);
  }
  .mh-nav-close{
    width:38px;height:38px;border:1px solid var(--dr-line);border-radius:50%;background:var(--dr-white);cursor:pointer;color:var(--dr-ink);
  }
  .mh-idx{display:block;overflow:visible}
  .mh-idx>li{border-bottom:1px solid var(--dr-line)}
  /* 展开箭头原来是 absolute 定位 + top:50%，而 li 里除了文字还包着展开后的子菜单，
     箭头于是落在整个 li 的垂直中线上（截图里飘到子项行旁边，甚至跑到抽屉右边缘）。
     改成行内 flex：文字占满剩余宽度，箭头 38px 与文字同行，子菜单 wrap 到下一整行； */
  .mh-idx>li,.mh-nav-sub>li{display:flex;flex-wrap:wrap;align-items:center}
  .mh-idx>li>a{padding:14px 0;border-bottom:0;font-family:var(--dr-ff-body);font-size:16px;letter-spacing:0;text-transform:none;white-space:normal;display:block;flex:1 1 auto;min-width:0}
  .mh-idx>li>a i{display:none}
  .mh-idx-txt{max-width:none;white-space:normal}
  /* 箭头已由按钮承担，二级项文字里的小箭头在手机端隐藏，避免两个箭头并排 */
  .mh-nav-sub>li>a i{display:none}
  .mh-nav-tgl{
    position:static;transform:none;flex:0 0 auto;width:38px;height:38px;margin-left:8px;
    display:inline-flex;align-items:center;justify-content:center;
  }
  .mh-idx>li.open>.mh-nav-tgl i,.mh-nav-sub li.open>.mh-nav-tgl i{transform:rotate(180deg)}
  .mh-nav-sub,.mh-nav-sub2{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;border-radius:0;padding:0 0 6px 12px;min-width:0;display:none;background:transparent;
    flex:1 1 100%;
  }
  .mh-idx>li.open>.mh-nav-sub{display:block}
  .mh-nav-sub li.open>.mh-nav-sub2{display:block}
  .mh-nav-sub>li{border-left:1px dashed var(--dr-line-2)}
  .mh-nav-sub>li>a,.mh-nav-sub2>li>a{padding:11px 12px;font-size:15px;flex:1 1 auto;min-width:0}
  .mh-nav-sub2{padding-left:14px}
  .mh-nav-sub2>li>a::before{content:"└ ";color:var(--dr-camel)}
  .mh-idx>li>a:hover,.mh-idx>li.on>a{border-bottom-color:transparent;color:var(--dr-copper)}
  .mh-nav-sec{
    display:block;margin:26px 0 11px;padding-top:18px;border-top:1px solid var(--dr-line);
    font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dr-muted);
  }
  .mh-nav-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
  .mh-nav-grid a{
    display:flex;align-items:center;gap:9px;padding:12px 13px;border:1px solid var(--dr-line);border-radius:var(--dr-radius);
    font-size:14.5px;color:var(--dr-ink-2);
  }
  .mh-nav-grid a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
  .mh-nav-grid i{color:var(--dr-camel-2)}
  .mh-nav-cta{display:block;margin-top:22px}
  .mh-nav-contact{display:flex;flex-direction:column;gap:11px;margin-top:18px}
  .mh-nav-contact a{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--dr-slate)}
  .mh-nav-contact i{color:var(--dr-camel-2);width:18px;text-align:center}
  .mh-nav-meta{display:block;margin-top:22px;padding-top:18px;border-top:1px dashed var(--dr-line-2)}
  .mh-strip-lang{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}
  .mh-strip-lang a{
    display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--dr-line);
    border-radius:999px;font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  }
  .mh-strip-lang a.on{border-color:var(--dr-copper);color:var(--dr-copper)}
  /* 手机端原来把搜索框 display:none 藏掉，JS 给 header 加 .mh-search-on 也没有可显示的元素，
     点放大镜毫无反应。改为把搜索框收在标题栏正下方，点击后从上方滑出。 */
  .mh-searchslot{
    display:block;position:absolute;left:0;right:0;top:100%;max-width:none;z-index:5;
    background:var(--dr-white);border-bottom:1px solid var(--dr-line);box-shadow:var(--dr-shadow);
    padding:14px 20px;overflow:visible;
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .22s ease,transform .22s ease,visibility .22s;
  }
  .mh-header.mh-search-on .mh-searchslot{opacity:1;visibility:visible;transform:none;max-width:none}
  /* 手机端顶部栏只留电话和邮箱：左侧的分类长标签、右侧的“View Quote List”入口都去掉
     （询盘清单入口在下方工具栏的剪贴板按钮上已经有了）。 */
  .mh-topbar-tag{display:none}
  .mh-topbar-right>a:not(.mh-topbar-phone){display:none}
  .mh-topbar-note{display:none}
}
@media (max-width:600px){
  .mh-topbar-in{min-height:38px}
  .mh-topbar-left a>span,.mh-topbar-right a>span{max-width:34vw}
  .mh-topbar-left,.mh-topbar-right{gap:12px}
  .mh-bar-in{min-height:76px;gap:10px;padding-top:9px;padding-bottom:9px}
  .mh-brand-name{font-size:19px}
  .mh-brand-tag{display:none}
  .mh-brand-mark{width:36px;height:36px;font-size:14px}
  .mh-brand-img{max-height:34px}
  .mh-lang{display:none}
}
@media (max-width:420px){
  /* 顶部栏只留电话和邮箱：窄屏不再把邮箱（.mh-topbar-left 的第 2 个链接）隐藏掉，
     并放开 34vw 的截断上限，邮箱地址能整条显示（真的放不下时才会省略号）。 */
  .mh-brand-name{font-size:17px}
  .mh-topbar-left a>span{max-width:none}
}

/* -------------------------------------------------------------------- hero */
.mh-hero{position:relative;overflow:hidden;background:var(--dr-white)}
.mh-hero-glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(1100px 460px at 78% 8%,rgba(216,180,106,.24),transparent 66%);
}
.mh-hero-in{position:relative;padding-top:70px;padding-bottom:64px}
.mh-hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:52px;align-items:start}
.mh-hero-copy h1{margin-bottom:18px}
/* 高亮行是 h1 内部的 <p class="hl">，全局 p{margin:0 0 1em} 会让它按 h1 的 54px 字号继承
   出 54px 下外边距，与 h1 的 margin-bottom 叠加后标题到正文之间出现约 74px 的空档。
   这里清零内层段落边距，间距只由 h1 的 margin-bottom 控制。 */
.mh-hero-copy h1>.hl{margin:0}
.mh-hero-copy .hl{color:var(--dr-copper)}
/* 后台“调试外观”的编辑按钮（b.ui_icon）默认按定位基准水平居中。基准若异常或元素盒比可见
   文字宽，按钮就会落到文字之外的空白处，鼠标从文字移向按钮时会先离开该元素，按钮中途消失。
   这里把标题里的可编辑元素固定为自身定位基准，并把按钮钉在元素左上角（紧贴文字起点）。 */
.mh-hero-copy h1 .zan-edit{position:relative}
.mh-hero-copy h1 .zan-edit.uiset b.ui_icon{left:0;margin-left:0}
.mh-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 34px}
.mh-ledger{border-top:1px solid var(--dr-line)}
.mh-ledger-row{display:grid;grid-template-columns:132px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--dr-line);align-items:baseline}
/* Desktop two-column hero: the media column is ~440px taller than the copy, so let the
   copy column stretch to the same height and have the ledger rows share the leftover
   height. The column then ends flush with the media column instead of leaving a blank
   block under the copy. Kept inside the two-column breakpoint so the stacked layout is
   untouched (a zero flex-basis would squeeze the rows there). */
@media (min-width:1025px){
  .mh-hero-grid{align-items:stretch}
  .mh-hero-copy{display:flex;flex-direction:column}
  .mh-hero-copy>.mh-ledger{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
  .mh-hero-copy>.mh-ledger>.mh-ledger-row{flex:1 1 0;min-height:70px;align-items:center}
}
.mh-ledger-row b{
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--dr-camel-2);font-weight:400;
}
.mh-ledger-row span{color:var(--dr-slate);font-size:15.5px}

.mh-hero-media{position:relative}
.mh-hero-photo{
  border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-sand);box-shadow:var(--dr-shadow);
  aspect-ratio:4/5;
}
.mh-hero-photo img{width:100%;height:100%;object-fit:cover}
.mh-hero-chips{display:flex;gap:12px;margin-top:-52px;margin-left:-26px;position:relative;z-index:2;width:calc(100% + 26px)}
.mh-swatch{
  width:82px;height:82px;flex:0 0 auto;border-radius:var(--dr-radius);border:3px solid var(--dr-white);
  box-shadow:var(--dr-shadow-sm);overflow:hidden;background:var(--dr-sand);
}
.mh-swatch img{width:100%;height:100%;object-fit:cover}
.mh-swatch:nth-child(2){transform:translateY(-14px)}
.mh-spec{
  background:var(--dr-linen);border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);
  padding:22px 24px;margin-top:34px;
}
.mh-spec-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--dr-line)}
.mh-spec-head b{font-family:var(--dr-ff-display);font-size:18px}
.mh-spec-head span{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dr-muted)}
.mh-spec-row{display:grid;grid-template-columns:1fr auto;gap:14px;padding:9px 0;border-bottom:1px dashed var(--dr-line-2);align-items:center}
.mh-spec-row:last-child{border-bottom:0}
.mh-spec-row strong{font-weight:600;font-size:15px;color:var(--dr-ink-2);display:flex;flex-direction:column;gap:3px}
.mh-spec-row strong em{font-style:normal;font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--dr-muted)}
.mh-spec-row span{font-family:var(--dr-ff-mark);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dr-camel-2);white-space:nowrap}

.mh-collrail{background:var(--dr-ink);color:var(--dr-linen);margin-top:8px}
.mh-collrail-in{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:0 32px}
.mh-collmark{padding:22px 18px;border-left:1px solid rgba(250,247,241,.14);display:flex;flex-direction:column;gap:5px;min-width:0}
.mh-collmark:first-child{border-left:0}
.mh-collmark b{font-family:var(--dr-ff-display);font-size:16px;font-weight:600;color:var(--dr-linen)}
.mh-collmark span{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-camel)}
.mh-collmark:hover b{color:var(--dr-brass)}

/* ---------------------------------------------------------------- promises */
.mh-promises{background:var(--dr-sand);border-top:1px solid var(--dr-line);border-bottom:1px solid var(--dr-line)}
.mh-promises .mh-wrap{padding-top:38px;padding-bottom:38px}
.mh-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.mh-fact{padding:6px 22px;border-left:1px solid var(--dr-line-2);min-width:0}
.mh-fact:first-child{border-left:0;padding-left:0}
/* icon and title share one line: both inline-level, so the block-level description
   below still starts on its own line. */
.mh-fact i{color:var(--dr-camel-2);font-size:17px;display:inline-block;margin:0 9px 0 0;vertical-align:-2px}
.mh-fact b{display:inline-block;font-family:var(--dr-ff-display);font-size:17px;margin-bottom:6px}
.mh-fact span{display:block;color:var(--dr-slate);font-size:14.5px;line-height:1.6}

/* ------------------------------------------------------------------ mosaic */
.mh-mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.mh-mtile{
  position:relative;border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);overflow:hidden;
  background:var(--dr-white);display:flex;flex-direction:column;min-width:0;transition:box-shadow .24s ease,transform .24s ease;
}
.mh-mtile:hover{box-shadow:var(--dr-shadow);transform:translateY(-3px)}
.mh-mtile-media{aspect-ratio:3/2;background:var(--dr-sand);overflow:hidden}
.mh-mtile-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.mh-mtile:hover .mh-mtile-media img{transform:scale(1.05)}
.mh-mtile-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1 1 auto}
.mh-mtile-body h3{margin:0;font-size:19px}
.mh-mtile-body h3 a:hover{color:var(--dr-copper)}
.mh-mtile-body p{margin:0;color:var(--dr-slate);font-size:14.5px;line-height:1.6}
.mh-mtile-n{
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.14em;color:var(--dr-camel-2);
}
.mh-mtile-wide{grid-column:span 2}
.mh-mtile-wide .mh-mtile-media{aspect-ratio:16/7}
.mh-mosaic>.mh-mtile:nth-child(-n+2){grid-column:span 2}
.mh-mosaic>.mh-mtile:nth-child(-n+2) .mh-mtile-media{aspect-ratio:16/7}
@media (max-width:900px){
  .mh-mosaic>.mh-mtile:nth-child(-n+2){grid-column:span 2}
}
@media (max-width:640px){
  .mh-mosaic>.mh-mtile:nth-child(-n+2){grid-column:span 1}
  .mh-mosaic>.mh-mtile:nth-child(-n+2) .mh-mtile-media{aspect-ratio:16/9}
}

/* ------------------------------------------------------------ light control */
.mh-lightwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-white)}
.mh-lighttable{min-width:760px;font-size:15px}
.mh-lighttable caption{
  caption-side:top;text-align:left;padding:18px 22px;color:var(--dr-muted);font-size:13.5px;
  border-bottom:1px solid var(--dr-line);
}
.mh-lighttable th,.mh-lighttable td{padding:15px 18px;text-align:left;border-bottom:1px solid var(--dr-line);vertical-align:middle}
.mh-lighttable thead th{
  font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--dr-muted);background:var(--dr-linen);font-weight:400;
}
.mh-lighttable tbody th{font-weight:600;font-size:15px;color:var(--dr-ink-2);width:20%}
.mh-lighttable tbody tr:last-child th,.mh-lighttable tbody tr:last-child td{border-bottom:0}
.mh-lighttable tbody tr:hover{background:var(--dr-linen)}
.mh-lightbar{display:flex;align-items:center;gap:10px;min-width:150px}
.mh-lightbar i{display:block;height:8px;border-radius:999px;background:var(--dr-camel)}
.mh-lightbar b{font-family:var(--dr-ff-mark);font-size:11.5px;letter-spacing:.06em;color:var(--dr-ink-2)}

/* -------------------------------------------------------------- product rail */
.mh-drail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-dcard{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-white);
  overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:box-shadow .24s ease,transform .24s ease;
}
.mh-dcard:hover{box-shadow:var(--dr-shadow);transform:translateY(-3px)}
/* the product shots uploaded to the CMS are square (960x960) while this frame was 3/4, so
   object-fit:cover sliced the left and right edges off every card - promo text included.
   Frame now matches the source ratio and the image is contained, so a product shot is
   never cropped again whatever ratio gets uploaded. */
.mh-dcard-media{position:relative;aspect-ratio:1/1;background:var(--dr-sand);overflow:hidden}
.mh-dcard-media img{width:100%;height:100%;object-fit:contain}
.mh-dcard-add{
  position:absolute;right:14px;bottom:14px;width:42px;height:42px;border-radius:50%;border:0;cursor:pointer;
  background:var(--dr-ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:var(--dr-shadow-sm);transition:background .2s ease;
}
.mh-dcard-add:hover{background:var(--dr-copper)}
.mh-dcard-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:11px;flex:1 1 auto}
.mh-dcard-body h3{margin:0;font-size:19px;line-height:1.3}
.mh-dcard-body h3 a:hover{color:var(--dr-copper)}
.mh-dcard-body p{margin:0;color:var(--dr-slate);font-size:14.5px}
.mh-dcard-spec{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:13px;border-top:1px solid var(--dr-line)}
.mh-dcard-spec div{display:flex;flex-direction:column;gap:3px;min-width:0}
.mh-dcard-spec b{font-family:var(--dr-ff-mark);font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted);font-weight:400}
.mh-dcard-spec span{font-size:14px;color:var(--dr-ink-2)}
.mh-dcard-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:13px;border-top:1px dashed var(--dr-line-2)}
.mh-dcard-foot a{font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-ink)}
.mh-dcard-foot a:hover{color:var(--dr-copper)}
.mh-dcard-foot button{
  border:0;background:none;cursor:pointer;font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--dr-copper);display:inline-flex;align-items:center;gap:7px;
}

/* ------------------------------------------------------------------- build */
.mh-build{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:1px solid var(--dr-line)}
.mh-buildstep{display:flex;align-items:baseline;gap:12px;padding:26px 22px 6px;border-left:1px solid var(--dr-line);min-width:0}
.mh-buildstep:first-child{border-left:0;padding-left:0}
.mh-build-n{
  display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;
  background:var(--dr-sand);border:1px solid var(--dr-line);color:var(--dr-camel-2);
  font-family:var(--dr-ff-mark);font-size:12px;flex:0 0 auto;
}
/* step number sits beside the step title: the body fills the rest of the row and baseline
   alignment keeps the badge on the title's first line even when the title wraps. */
.mh-build-body{flex:1 1 auto;min-width:0}
.mh-build-body h3{font-size:18px;margin-bottom:8px}
.mh-build-body p{margin:0;color:var(--dr-slate);font-size:14.5px;line-height:1.62}
/* 关于我们页的这组步骤落在 .mh-split 的窄主栏里（1440 下只有 764px），5 列时每列正文仅 85px，
   段落被挤成一词一行。窄容器内沿用站内既有的 3 列回退：3+2 两行，
   第一行下方补分隔线，第 4、5 个不再要下边框，列首（1、4）去掉左边框与左内距。 */
@media (min-width:1181px){
  .mh-split .mh-build{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mh-split .mh-buildstep{border-bottom:1px solid var(--dr-line);padding-bottom:22px}
  .mh-split .mh-buildstep:nth-child(n+4){border-bottom:0}
  .mh-split .mh-buildstep:nth-child(3n+1){border-left:0;padding-left:0}
}

/* ------------------------------------------------------------- hospitality */
.mh-hosband{position:relative;background:var(--dr-ink);color:var(--dr-linen);padding:70px 0;overflow:hidden}
.mh-hosband::before{
  content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(250,247,241,.05) 0 2px,transparent 2px 34px);
}
.mh-hosband-in{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:52px;align-items:center}
.mh-hosband h2{color:var(--dr-linen)}
.mh-hosband p{color:var(--dr-sand-2)}
.mh-hosband .mh-eyebrow{color:var(--dr-brass)}
.mh-hosband .mh-head::after{border-top-color:var(--dr-brass);border-bottom-color:rgba(250,247,241,.22)}
.mh-hoscells{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.mh-hoscell{padding:19px 0;border-top:1px solid rgba(250,247,241,.18);min-width:0}
.mh-hoscell b{display:block;font-family:var(--dr-ff-display);font-size:16.5px;color:var(--dr-brass);margin-bottom:5px}
.mh-hoscell span{display:block;color:var(--dr-sand-2);font-size:14.5px;line-height:1.6}
.mh-hosband .mh-actions{margin-top:30px}

/* ------------------------------------------------------------------ plates */
.mh-plates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-plate{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-white);
  display:flex;flex-direction:column;min-width:0;
}
.mh-plate figure{background:var(--dr-linen);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:18px}
.mh-plate figure img{width:100%;height:100%;object-fit:contain}
.mh-plate-body{display:flex;gap:14px;align-items:flex-start;padding:19px 21px;border-top:1px solid var(--dr-line)}
.mh-plate-body h3{margin:0 0 4px;font-size:17px;line-height:1.32}
.mh-plate-body time{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-muted)}

/* ------------------------------------------------------------------- rooms */
.mh-rooms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-room{position:relative;border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-ink);min-width:0;aspect-ratio:4/5}
/* the visual-editor upload wrapper holds the image, so it has to fill the 4:5 card for
   any uploaded ratio (otherwise a non-portrait upload would not cover the box). */
.mh-room>.zan-edit{position:absolute;inset:0}
.mh-room img{width:100%;height:100%;object-fit:cover;opacity:.88}
.mh-room-body{
  position:absolute;inset:auto 0 0;padding:26px 24px;color:#fff;
  background:linear-gradient(to top,rgba(26,27,32,.9),rgba(26,27,32,0));
}
.mh-room-body b{display:block;font-family:var(--dr-ff-display);font-size:21px;margin-bottom:6px;color:#fff}
.mh-room-body span{display:block;font-size:14.5px;color:var(--dr-sand);line-height:1.58}
.mh-room:hover img{opacity:1}

/* --------------------------------------------------------------------- faq */
.mh-split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px;align-items:start}
.mh-split>*{min-width:0}
.mh-faq{border-top:1px solid var(--dr-line)}
.mh-faq details{border-bottom:1px solid var(--dr-line)}
.mh-faq summary{
  display:flex;gap:16px;align-items:flex-start;padding:19px 0;cursor:pointer;list-style:none;
  font-family:var(--dr-ff-display);font-size:18px;color:var(--dr-ink);
}
.mh-faq summary::-webkit-details-marker{display:none}
.mh-faq summary .mh-num{flex:0 0 auto;padding-top:4px}
.mh-faq summary::after{content:"+";margin-left:auto;font-family:var(--dr-ff-mark);color:var(--dr-camel-2);font-size:18px;line-height:1}
.mh-faq details[open] summary::after{content:"–"}
.mh-faq details[open] summary{color:var(--dr-copper)}
.mh-faq-a{padding:0 0 22px 36px;color:var(--dr-slate)}
.mh-faq-a>*:last-child{margin-bottom:0}

/* ------------------------------------------------------------------ journal */
.mh-jgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-jcard{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-white);
  display:flex;flex-direction:column;min-width:0;
}
.mh-jcard figure{aspect-ratio:16/10;background:var(--dr-sand);overflow:hidden}
.mh-jcard figure img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.mh-jcard:hover figure img{transform:scale(1.04)}
.mh-jcard-body{padding:21px 22px 23px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto}
.mh-jcard-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted)}
.mh-jcard-meta b{color:var(--dr-camel-2);font-weight:400}
.mh-jcard-body h3{margin:0;font-size:19px;line-height:1.32}
.mh-jcard-body h3 a:hover{color:var(--dr-copper)}
.mh-jcard-body p{margin:0;color:var(--dr-slate);font-size:14.5px}
.mh-jcard .mh-more{margin-top:auto;align-self:flex-start}

/* ------------------------------------------------------------------ closing */
.mh-closing{background:var(--dr-ink);color:var(--dr-linen);padding:74px 0;position:relative;overflow:hidden}
.mh-closing::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg,rgba(25,26,31,.6) 0 18px,transparent 18px 46px),radial-gradient(700px 300px at 88% 20%,rgba(193,105,58,.22),transparent 70%);
}
.mh-closing-in{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center}
.mh-closing h2{color:var(--dr-linen)}
.mh-closing p{color:var(--dr-sand-2);margin:0}
.mh-cta-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}

/* ---------------------------------------------------------------- side rail */
.mh-side{display:flex;flex-direction:column;gap:22px}
.mh-side-card{border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:24px;background:var(--dr-white)}
.mh-side-card.dark{background:var(--dr-ink);border-color:var(--dr-ink);color:var(--dr-linen)}
.mh-side-card.dark h3{color:var(--dr-linen)}
.mh-side-card.dark p{color:var(--dr-sand-2)}
.mh-side-card h3{font-size:19px;margin-bottom:11px}
.mh-side-card p:last-child{margin-bottom:0}
.mh-side-list{display:flex;flex-direction:column}
.mh-side-list li{border-bottom:1px solid var(--dr-line)}
.mh-side-list li:last-child{border-bottom:0}
.mh-side-list a{display:flex;align-items:center;gap:10px;padding:11px 0;font-size:15px;color:var(--dr-ink-2)}
.mh-side-list a:hover{color:var(--dr-copper)}
.mh-side-list i{color:var(--dr-camel-2);font-size:11px;flex:0 0 auto}
.mh-side-card .mh-form-note{margin-top:14px}
.mh-side-card .mh-form-note a{display:inline-flex;align-items:center;gap:8px}
.mh-side-empty{margin:0;font-size:14.5px}
.mh-side-empty .mh-more{margin-top:0}

/* --------------------------------------------------------------- page heads */
.mh-pagehead{background:var(--dr-sand);border-bottom:1px solid var(--dr-line);padding:52px 0 46px}
.mh-pagehead::before{
  content:"";display:block;height:3px;background:var(--dr-ink);width:100%;margin:-52px 0 0;
}
.mh-pagehead-in{position:relative}
.mh-pagehead h1{margin-bottom:14px}
.mh-pagehead .mh-lead{margin-bottom:0}
.mh-crumb{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-bottom:20px;font-size:13.5px;color:var(--dr-muted)}
.mh-crumb a{color:var(--dr-slate)}
.mh-crumb a:hover{color:var(--dr-copper)}
.mh-crumb i{font-size:10px;color:var(--dr-camel)}
.mh-crumbbar{background:var(--dr-linen);border-bottom:1px solid var(--dr-line)}
.mh-crumbbar-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.mh-crumbbar .mh-crumb{margin-bottom:0}

/* 筛选条不再吸顶跟随滚动，随页面一起上移 */
.mh-filterbar{position:static;background:var(--dr-white);border-bottom:1px solid var(--dr-line);box-shadow:var(--dr-shadow-sm)}
.mh-filter-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:13px;padding-bottom:13px;flex-wrap:wrap}
.mh-chipbar{display:flex;gap:9px;flex-wrap:wrap;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.mh-chipbar::-webkit-scrollbar{display:none}
.mh-chipbar a{
  flex:0 0 auto;padding:8px 15px;border:1px solid var(--dr-line);border-radius:999px;white-space:nowrap;
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--dr-slate);
}
.mh-chipbar a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-chipbar a.active,.mh-chipbar a.on{background:var(--dr-ink);border-color:var(--dr-ink);color:#fff}
.mh-chipbar.dragging{cursor:grabbing}
.mh-sort{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-muted);flex:0 0 auto}

/* -------------------------------------------------------------- card grids */
.mh-pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-card{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-white);overflow:hidden;
  display:flex;flex-direction:column;min-width:0;transition:box-shadow .24s ease,transform .24s ease;
}
.mh-card:hover{box-shadow:var(--dr-shadow);transform:translateY(-3px)}
.mh-card-media{position:relative;aspect-ratio:1/1;background:var(--dr-sand);overflow:hidden}
.mh-card-media img{width:100%;height:100%;object-fit:cover}
.mh-card-cat{position:absolute;left:13px;top:13px;background:rgba(250,247,241,.94);backdrop-filter:blur(3px)}
.mh-card-add{
  position:absolute;right:13px;bottom:13px;width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;
  background:var(--dr-ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--dr-shadow-sm);
}
.mh-card-add:hover{background:var(--dr-copper)}
.mh-card-body{padding:19px 21px 21px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto}
.mh-card-body h3{margin:0;font-size:17.5px;line-height:1.35}
.mh-card-body h3 a:hover{color:var(--dr-copper)}
.mh-card-body p{margin:0;color:var(--dr-slate);font-size:14.5px}
.mh-card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:13px;border-top:1px dashed var(--dr-line-2)}
.mh-card-foot a{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase}
.mh-card-foot a:hover{color:var(--dr-copper)}
.mh-card-foot button{
  border:0;background:none;cursor:pointer;font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--dr-copper);display:inline-flex;align-items:center;gap:7px;
}

/* --------------------------------------------------------- product detail */
.mh-pdp{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:52px;align-items:start;padding-top:56px}
.mh-pdp>*{min-width:0}
.mh-gallery{min-width:0}
.mh-gallery-main{position:relative;border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-sand);aspect-ratio:4/3}
.mh-gallery-main img{width:100%;height:100%;object-fit:cover}
.mh-gallery-main .mh-tool-btn{position:absolute;right:16px;bottom:16px;background:rgba(250,247,241,.95)}
.mh-gallery-thumbs{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
.mh-gallery-thumbs button{
  width:88px;height:88px;border-radius:var(--dr-radius);overflow:hidden;border:2px solid transparent;
  background:var(--dr-sand);cursor:pointer;padding:0;
}
.mh-gallery-thumbs button.on{border-color:var(--dr-copper)}
.mh-gallery-thumbs img{width:100%;height:100%;object-fit:cover}
/* 说明条 .mh-toolbar 只有 margin-bottom，紧跟缩略图时上边距为 0，图和文字贴在一起；
   只在产品图集里补上间距，其余使用处（产品列表、证书页）保持原样。 */
.mh-gallery .mh-toolbar{margin-top:22px}
.mh-pdp-body{min-width:0}
.mh-pdp-body h1{margin:14px 0 16px;font-size:clamp(26px,2.8vw,38px)}
.mh-pdp-actions{display:flex;flex-wrap:wrap;gap:11px;margin:24px 0}
.mh-check-list{display:flex;flex-direction:column;gap:11px;margin:20px 0 0}
.mh-check-list li{display:flex;gap:11px;align-items:flex-start;color:var(--dr-slate);font-size:15px}
.mh-check-list i{color:var(--dr-camel-2);margin-top:4px;flex:0 0 auto}
.mh-check-list a:hover{color:var(--dr-brass)}
.mh-check-list-dark li{color:var(--dr-sand-2)}
.mh-check-list-dark i{color:var(--dr-brass)}
.mh-spec-table{margin-top:24px;border:1px solid var(--dr-line);border-radius:var(--dr-radius);overflow:hidden}
.mh-spec-table th,.mh-spec-table td{padding:12px 16px;text-align:left;font-size:14.5px;border-bottom:1px solid var(--dr-line)}
.mh-spec-table th{
  width:42%;background:var(--dr-linen);font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--dr-muted);font-weight:400;
}
.mh-spec-table tr:last-child th,.mh-spec-table tr:last-child td{border-bottom:0}
.mh-share{display:flex;align-items:center;flex-wrap:wrap;gap:11px;margin-top:26px;padding-top:20px;border-top:1px solid var(--dr-line)}
.mh-share>span{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted)}
.mh-share a{
  display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid var(--dr-line);border-radius:var(--dr-radius);
  font-size:13.5px;color:var(--dr-slate);
}
.mh-share a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-pdp-detail{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:48px;align-items:start;padding-top:64px;padding-bottom:74px}
.mh-pdp-detail>*{min-width:0}
.mh-doctable{border:1px solid var(--dr-line);border-radius:var(--dr-radius);overflow:hidden;margin-top:18px}
.mh-doctable th,.mh-doctable td{padding:13px 16px;text-align:left;font-size:14.5px;border-bottom:1px solid var(--dr-line)}
.mh-doctable thead th{background:var(--dr-linen);font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted);font-weight:400}
.mh-doctable tr:last-child td{border-bottom:0}
.mh-related{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.mh-zoom{
  position:fixed;inset:0;z-index:150;background:rgba(20,20,24,.94);display:none;align-items:center;justify-content:center;padding:40px;
}
.mh-zoom.on{display:flex}
.mh-zoom img{max-width:92vw;max-height:86vh;width:auto;object-fit:contain}
.mh-zoom button{
  position:absolute;right:26px;top:26px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(250,247,241,.4);
  background:transparent;color:#fff;cursor:pointer;
}

/* ------------------------------------------------------------ article pages */
.mh-artsplit{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:48px;align-items:start;padding:56px 0 74px}
.mh-artsplit>*{min-width:0}
.mh-article-body{font-size:16.5px;color:var(--dr-ink-2)}
.mh-article-body h2{margin-top:36px;font-size:26px}
.mh-article-body h3{margin-top:28px;font-size:21px}
.mh-article-body p{margin-bottom:1.1em}
.mh-article-body ul,.mh-article-body ol{margin:0 0 1.2em;padding-left:1.35em}
.mh-article-body ul{list-style:disc}
.mh-article-body ol{list-style:decimal}
.mh-article-body li{margin-bottom:.5em}
.mh-article-body a{color:var(--dr-copper);text-decoration:underline}
.mh-article-body blockquote{
  margin:0 0 1.3em;padding:6px 0 6px 22px;border-left:3px solid var(--dr-camel);color:var(--dr-slate);
  font-family:var(--dr-ff-display);font-size:18px;
}
.mh-article-body img{border-radius:var(--dr-radius);margin:1.2em 0}
.mh-hero-fig{border-radius:var(--dr-radius-lg);overflow:hidden;margin-bottom:30px;background:var(--dr-sand);aspect-ratio:16/9}
.mh-hero-fig img{width:100%;height:100%;object-fit:cover}
.mh-art-meta{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-bottom:22px;font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-muted)}
.mh-art-meta b{color:var(--dr-camel-2);font-weight:400}
.mh-toc{position:sticky;top:96px}
.mh-toc h4{margin-bottom:12px}
.mh-toc ol{display:flex;flex-direction:column;counter-reset:toc}
.mh-toc li{border-bottom:1px solid var(--dr-line)}
.mh-toc a{display:block;padding:10px 0;font-size:14.5px;color:var(--dr-slate)}
.mh-toc a:hover,.mh-toc a.on{color:var(--dr-copper)}
.mh-prenext{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:36px}
.mh-prenext a{
  display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--dr-line);
  border-radius:var(--dr-radius);background:var(--dr-linen);min-width:0;
}
.mh-prenext a:hover{border-color:var(--dr-camel)}
.mh-prenext small{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted)}
.mh-prenext strong{font-size:15.5px;color:var(--dr-ink);line-height:1.4}

.mh-artlist{display:flex;flex-direction:column;gap:18px}
.mh-artrow{
  display:grid;grid-template-columns:190px minmax(0,1fr);gap:24px;padding:20px;border:1px solid var(--dr-line);
  border-radius:var(--dr-radius-lg);background:var(--dr-white);min-width:0;align-items:start;
}
.mh-artrow:hover{border-color:var(--dr-camel)}
.mh-artrow-media{aspect-ratio:3/2;border-radius:var(--dr-radius);overflow:hidden;background:var(--dr-sand)}
.mh-artrow-media img{width:100%;height:100%;object-fit:cover}
.mh-artrow-body{min-width:0}
.mh-artrow-body h3{margin:4px 0 8px;font-size:20px;line-height:1.32}
.mh-artrow-body h3 a:hover{color:var(--dr-copper)}
.mh-artrow-body p{margin:0 0 10px;color:var(--dr-slate);font-size:15px}
.mh-artrow-meta{display:flex;flex-wrap:wrap;gap:16px;font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-muted)}
.mh-artrow-meta b{color:var(--dr-camel-2);font-weight:400}

.mh-tagcloud{display:flex;flex-wrap:wrap;gap:10px}
.mh-tagcloud a{
  padding:9px 16px;border:1px solid var(--dr-line);border-radius:999px;font-size:14px;color:var(--dr-slate);background:var(--dr-white);
}
.mh-tagcloud a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-tagcloud.lg a{font-size:15.5px;padding:11px 20px}

/* --------------------------------------------------------------- legal etc. */
.mh-legal{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:48px;align-items:start;padding:56px 0 74px}
.mh-legal>*{min-width:0}
.mh-contactsplit{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:start;padding:56px 0 74px}
.mh-contactsplit>*{min-width:0}
.mh-cards-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.mh-contact-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:24px}
/* 卡片改成两列栅格：图标与标题（EMAIL / TELEPHONE …）并排在同一行，
   联系方式另起一行横跨两列，不再让图标单独占一行。 */
.mh-contact-card{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:22px;background:var(--dr-linen);min-width:0;
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 9px;align-items:center;
}
.mh-contact-card i{color:var(--dr-camel-2);font-size:17px;display:block;margin:0}
.mh-contact-card b{display:block;font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dr-muted);margin:0;font-weight:400}
.mh-contact-card a,.mh-contact-card span{grid-column:1/-1;font-size:15.5px;color:var(--dr-ink-2);word-break:break-word}
.mh-catalogsplit{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:start;padding:56px 0 74px}
.mh-catalogsplit>*{min-width:0}
.mh-faqpage{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:48px;align-items:start;padding:56px 0 74px}
.mh-faqpage>*{min-width:0}
.mh-faqfilter{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:22px}
.mh-faq-chip{
  padding:8px 15px;border:1px solid var(--dr-line);border-radius:999px;background:var(--dr-white);cursor:pointer;
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--dr-slate);
}
.mh-faq-chip.on{background:var(--dr-ink);border-color:var(--dr-ink);color:#fff}
.mh-faqfilter input{
  flex:1 1 260px;min-width:0;padding:12px 15px;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);
  background:var(--dr-white);color:var(--dr-ink);font-size:15px;
}
.mh-faqfilter input:focus{outline:0;border-color:var(--dr-camel)}
.mh-faq details[hidden]{display:none}

/* ------------------------------------------------------------------- forms */
.mh-form{display:flex;flex-direction:column;gap:13px}
.mh-form-row{display:flex;flex-direction:column;gap:6px}
.mh-form-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.mh-form label,.mh-form-row label{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dr-muted)}
.mh-form input[type=text],.mh-form input[type=email],.mh-form input[type=number],.mh-form input[type=tel],.mh-form textarea,.mh-form select{
  width:100%;padding:13px 15px;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);
  background:var(--dr-white);color:var(--dr-ink);font-size:15px;transition:border-color .2s ease;
}
.mh-form input:focus,.mh-form textarea:focus,.mh-form select:focus{border-color:var(--dr-camel);outline:0}
.mh-form textarea{resize:vertical;min-height:110px}
.mh-form-vertify{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
.mh-captcha{border:1px solid var(--dr-line);border-radius:var(--dr-radius);width:120px;height:48px}
.mh-form-note{display:flex;gap:9px;align-items:flex-start;margin:14px 0 0;color:var(--dr-muted);font-size:13.5px}
.mh-form-note i{color:var(--dr-camel-2);margin-top:3px;flex:0 0 auto}
.mh-form-note a{color:var(--dr-slate);text-decoration:underline}
.mh-btn.is-busy{opacity:.6;pointer-events:none}
.mh-subform{display:flex;gap:10px;margin-top:12px}
.mh-subform input{flex:1 1 auto;min-width:0;padding:12px 14px;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);background:var(--dr-white)}
.mh-subform button{
  flex:0 0 auto;padding:0 20px;border:0;border-radius:var(--dr-radius);background:var(--dr-copper);color:#fff;cursor:pointer;
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
}
.mh-subform button:hover{background:var(--dr-copper-2)}
.mh-subform-note{display:flex;gap:8px;align-items:center;margin:11px 0 0;color:var(--dr-muted);font-size:13px}
.mh-subform-note i{color:var(--dr-camel-2)}

/* ------------------------------------------------------------------- modal */
.mh-modal{
  position:fixed;inset:0;z-index:120;background:rgba(20,20,24,.72);display:none;align-items:center;justify-content:center;padding:24px;
}
.mh-modal.on{display:flex}
.mh-modal-box{
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);width:min(980px,100%);max-height:90vh;
  background:var(--dr-white);border-radius:var(--dr-radius-lg);overflow:hidden;position:relative;box-shadow:var(--dr-shadow);
}
.mh-modal-close{
  position:absolute;right:14px;top:14px;z-index:2;width:40px;height:40px;border-radius:50%;border:1px solid var(--dr-line);
  background:var(--dr-white);cursor:pointer;color:var(--dr-ink);
}
.mh-modal-side{background:var(--dr-ink);color:var(--dr-linen);padding:36px 32px;overflow-y:auto}
.mh-modal-side h3{color:var(--dr-linen);font-size:25px}
.mh-modal-side p{color:var(--dr-sand-2)}
.mh-modal-list{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.mh-modal-list li{display:flex;gap:11px;align-items:flex-start;color:var(--dr-sand-2);font-size:14.5px}
.mh-modal-list i{color:var(--dr-brass);margin-top:4px;flex:0 0 auto}
.mh-modal-body{padding:36px 32px;overflow-y:auto}

/* ----------------------------------------------------------- toast / success */
.mh-toast{
  position:fixed;bottom:96px;left:50%;transform:translateX(-50%) translateY(14px);z-index:140;
  max-width:calc(100vw - 40px);background:var(--dr-ink);color:var(--dr-linen);border-radius:var(--dr-radius);
  padding:14px 20px;display:flex;align-items:center;gap:13px;opacity:0;transition:opacity .3s ease,transform .3s ease;
  box-shadow:var(--dr-shadow);font-size:14.5px;
}
.mh-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.mh-toast i{color:var(--dr-brass)}
.mh-toast strong{display:block;font-weight:600}
.mh-toast a{color:var(--dr-brass);text-decoration:underline}
.success-overlay{
  position:fixed;inset:0;z-index:145;background:rgba(20,20,24,.72);display:flex;align-items:center;justify-content:center;padding:24px;
}
.success-box{
  background:var(--dr-white);border-radius:var(--dr-radius-lg);padding:38px 32px;text-align:center;max-width:420px;width:100%;
  box-shadow:var(--dr-shadow);
}
.success-icon i{font-size:44px;color:var(--dr-camel);display:block;margin-bottom:16px}
.success-box h3{margin-bottom:8px}
.success-box p{color:var(--dr-slate)}

/* --------------------------------------------------------------- cookie bar */
.mh-cookiebar{
  position:fixed;left:0;right:0;bottom:0;z-index:130;background:var(--dr-ink);color:var(--dr-linen);
  transform:translateY(102%);transition:transform .34s ease;
}
.mh-cookiebar.on{transform:none}
.mh-cookie-in{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:18px;padding-bottom:18px;flex-wrap:wrap}
.mh-cookie-copy{min-width:0;max-width:78ch}
.mh-cookie-copy strong{display:block;font-family:var(--dr-ff-display);font-size:17px;margin-bottom:4px}
.mh-cookie-copy p{margin:0;color:var(--dr-sand-2);font-size:14px}
.mh-cookie-copy a{color:var(--dr-brass);text-decoration:underline}
.mh-cookie-actions{display:flex;gap:11px;flex:0 0 auto}
.mh-cookiebar .mh-btn-line{color:var(--dr-linen);border-color:rgba(250,247,241,.4)}
.mh-cookiebar .mh-btn-line:hover{background:var(--dr-linen);color:var(--dr-ink)}

/* ------------------------------------------------------------------ footer */
.mh-prefoot{background:var(--dr-sand);border-top:1px solid var(--dr-line)}
.mh-prefoot-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:40px;align-items:center;padding-top:48px;padding-bottom:48px}
.mh-prefoot h3{font-size:26px;margin-bottom:10px}
.mh-prefoot p{margin:0;color:var(--dr-slate)}
.mh-prefoot-actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}
.mh-footer{background:var(--dr-ink);color:var(--dr-sand-2);padding:62px 0 0}
.mh-foot-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,2.4fr) minmax(0,3.6fr);gap:40px;padding-bottom:48px}
.mh-foot-brand{min-width:0}
.mh-foot-brand img{max-height:40px;width:auto;margin-bottom:18px;filter:brightness(0) invert(1) opacity(.92)}
.mh-foot-brand p{font-size:14.5px;line-height:1.66;color:var(--dr-sand-2)}
.mh-foot-contact{display:flex;flex-direction:column;gap:13px;margin-top:20px}
.mh-foot-contact li{display:flex;gap:12px;align-items:flex-start;min-width:0}
.mh-foot-contact i{color:var(--dr-camel);margin-top:4px;flex:0 0 auto;width:16px;text-align:center}
.mh-foot-contact span{display:flex;flex-direction:column;gap:2px;min-width:0}
.mh-foot-contact small{font-family:var(--dr-ff-mark);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dr-muted)}
.mh-foot-contact a{color:var(--dr-sand);word-break:break-word}
.mh-foot-contact a:hover{color:var(--dr-brass)}
.mh-foot-col{min-width:0}
.mh-foot-col h4{color:var(--dr-linen);margin-bottom:16px;font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.15em;text-transform:uppercase;font-weight:400}
.mh-foot-col ul{display:flex;flex-direction:column;gap:10px}
.mh-foot-col a{color:var(--dr-sand-2);font-size:14.5px}
.mh-foot-col a:hover{color:var(--dr-brass)}
.mh-foot-col p{font-size:14.5px;color:var(--dr-sand-2)}
.mh-foot-bar{border-top:1px solid rgba(250,247,241,.16)}
.mh-foot-bar-in{display:flex;align-items:center;justify-content:space-between;gap:22px;padding-top:20px;padding-bottom:22px;flex-wrap:wrap}
.mh-copy{font-size:13.5px;color:var(--dr-muted)}
.mh-foot-chips{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.mh-foot-chips a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--dr-sand-2)}
.mh-foot-chips a:hover{color:var(--dr-brass)}
.mh-foot-chips a.on{color:var(--dr-brass)}

/* ------------------------------------------------------------------ floats */
.mh-wa{
  position:fixed;right:22px;bottom:104px;z-index:90;width:50px;height:50px;border-radius:50%;
  background:#25d366;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:22px;
  box-shadow:var(--dr-shadow);
}
.mh-wa:hover{color:#fff;transform:translateY(-2px)}
.mh-totop{
  position:fixed;right:22px;bottom:44px;z-index:90;width:46px;height:46px;border-radius:50%;
  border:1px solid var(--dr-line-2);background:var(--dr-white);color:var(--dr-ink);cursor:pointer;
  display:none;align-items:center;justify-content:center;box-shadow:var(--dr-shadow-sm);
}
.mh-totop.show{display:inline-flex}
.mh-totop:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-mobar{display:none}
body.mh-noscroll .mh-mobar,body.mh-noscroll .mh-wa,body.mh-noscroll .mh-totop{display:none}

/* ------------------------------------------------------- rich-text content */
.detail-content{min-width:0}
.detail-content>*:last-child{margin-bottom:0}
.detail-content h2{margin-top:32px;font-size:25px}
.detail-content h3{margin-top:26px;font-size:20px}
.detail-content ul,.detail-content ol{margin:0 0 1.2em;padding-left:1.35em}
.detail-content ul{list-style:disc}
.detail-content ol{list-style:decimal}
.detail-content li{margin-bottom:.45em}
.detail-content a{color:var(--dr-copper);text-decoration:underline}
.detail-content img{border-radius:var(--dr-radius);height:auto}
/* Rich text tables, three pieces: the table scrolls inside its own box (mandated by validate-master),
   the footer script wraps it in a scroll container, and <=600px it becomes labelled cards. */
.detail-content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--dr-line)}
.detail-content table th,.detail-content table td{padding:12px 15px;border-bottom:1px solid var(--dr-line);text-align:left;font-size:15px}
.detail-content table thead th{background:var(--dr-linen);font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted);font-weight:400}
.mh-tablewrap,.tablewrap{position:relative}
.mh-tablewrap-scroll,.tablewrap-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative}
.mh-tablewrap-scroll.is-scrollable{background:linear-gradient(to left,rgba(224,213,196,.55),transparent 44px)}
.mh-swipehint{
  display:none;gap:9px;align-items:center;margin:10px 0 0;color:var(--dr-muted);font-size:13px;
}
.mh-tablewrap.is-scrollable+.mh-swipehint,.tablewrap.is-scrollable+.mh-swipehint,
.mh-tablewrap-scroll.is-scrollable+.mh-swipehint,.tablewrap-scroll.is-scrollable+.mh-swipehint{display:flex}
.mh-swipehint i{color:var(--dr-camel-2)}

/* -------------------------------------------------------------- pagination */
.pagination{display:flex;flex-wrap:wrap;gap:9px;align-items:center;justify-content:center;margin-top:44px}
/* 分页标签结构是 <span><a>2</a></span>，内外两层都会被 .pagination a,.pagination span 命中，
   于是每个页码出现外圈 + 内圈两道边框。这里只给内层 a 画边框，外层 span 退化为纯包裹层。 */
.pagination>span{display:inline-flex;border:0;background:none;padding:0}
.pagination a{
  display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 13px;
  border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);background:var(--dr-white);color:var(--dr-ink-2);
  font-family:var(--dr-ff-mark);font-size:13px;
}
.pagination a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.pagination span.active a{border-color:var(--dr-copper);background:var(--dr-copper);color:#fff}
.pagination a:focus-visible{outline:2px solid var(--dr-camel);outline-offset:2px}
.pagination i.iconfont{font-style:normal;line-height:1}
.pagination i.icon-arrow5::before{content:"\2039";font-size:18px}
.pagination i.icon-arrow6::before{content:"\203A";font-size:18px}

/* ----------------------------------------------------------- review widget */
.mh-rev{margin-top:56px;padding-top:44px;border-top:1px solid var(--dr-line)}
.mh-rev-head h3{font-size:22px}
.mh-rev-list{display:flex;flex-direction:column;gap:18px;margin:22px 0}
.mh-rev-item{display:flex;gap:16px;padding:20px;border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-white);min-width:0}
.mh-rev-avatar img{border-radius:50%;width:48px;height:48px;object-fit:cover}
.mh-rev-body{min-width:0}
.mh-rev-meta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:8px;font-size:13.5px;color:var(--dr-muted)}
.mh-rev-meta strong{color:var(--dr-ink)}
.mh-rev-body p{margin:0;color:var(--dr-slate)}
.mh-rev-page{margin-top:22px}
.mh-rev-form{border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:26px;background:var(--dr-linen);margin-top:26px}
.mh-rev-form-head h3{font-size:20px;margin-bottom:6px}
.mh-rev-form-head p{color:var(--dr-slate);font-size:14.5px}
.mh-rev-rate{display:flex;align-items:center;gap:12px;margin:16px 0;font-size:14.5px;color:var(--dr-slate)}
.mh-stars{display:inline-flex;gap:3px;color:var(--dr-line-2)}
.mh-stars i.active{color:var(--dr-brass)}
.mh-stars-pick a{cursor:pointer;color:var(--dr-line-2)}
.mh-stars-pick a i.active{color:var(--dr-brass)}
.mh-rev-msg{margin:12px 0 0;font-size:14px}
.mh-rev-msg.ok{color:#2c7a4b}
.mh-rev-msg.err{color:var(--dr-neg)}

/* ------------------------------------------------------- search & results */
.mh-searchpage{padding:52px 0 74px}
.mh-searchpanel{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-linen);
  padding:26px;margin-bottom:38px;display:flex;gap:16px;flex-wrap:wrap;align-items:center;
}
.mh-searchpanel form{display:flex;gap:12px;flex:1 1 320px;min-width:0}
.mh-searchpanel input{
  flex:1 1 auto;min-width:0;padding:14px 17px;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);
  background:var(--dr-white);font-size:15.5px;color:var(--dr-ink);
}
.mh-searchpanel input:focus{outline:0;border-color:var(--dr-camel)}
.mh-searchpanel button{
  border:0;border-radius:var(--dr-radius);background:var(--dr-ink);color:#fff;padding:0 22px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
}
.mh-searchpanel button:hover{background:var(--dr-copper)}
.mh-results{display:flex;flex-direction:column;gap:16px}
.mh-result{
  display:grid;grid-template-columns:170px minmax(0,1fr) auto;gap:22px;align-items:center;
  padding:20px;border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);background:var(--dr-white);min-width:0;
}
.mh-result:hover{border-color:var(--dr-camel)}
.mh-result-media{aspect-ratio:3/2;border-radius:var(--dr-radius);overflow:hidden;background:var(--dr-sand)}
.mh-result-media img{width:100%;height:100%;object-fit:cover}
.mh-result-body{min-width:0}
.mh-result-body h3{margin:5px 0 8px;font-size:19px;line-height:1.33}
.mh-result-body h3 a:hover{color:var(--dr-copper)}
.mh-result-body p{margin:0;color:var(--dr-slate);font-size:14.5px}
.mh-result-meta{font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dr-camel-2)}
.mh-result-cta{align-self:flex-start;display:flex;flex-direction:column;gap:9px;align-items:flex-end}
.mh-result-noimg{grid-template-columns:minmax(0,1fr) auto}
.mh-result-noimg .mh-result-media{display:none}
.mh-result-cta .mh-btn{white-space:nowrap}
@media (max-width:900px){
  .mh-result{grid-template-columns:140px minmax(0,1fr);align-items:start}
  .mh-result-cta{grid-column:2;align-items:flex-start;flex-direction:row;flex-wrap:wrap}
  .mh-result-noimg{grid-template-columns:minmax(0,1fr)}
  .mh-result-noimg .mh-result-cta{grid-column:1}
}
@media (max-width:600px){
  .mh-result{grid-template-columns:minmax(0,1fr);gap:14px}
  .mh-result-media{aspect-ratio:16/9}
  .mh-result-cta{grid-column:1}
}

/* -------------------------------------------------- media grid & catalog form */
.mh-mediagrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:30px 0}
.mh-mediagrid figure{border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-sand);aspect-ratio:4/3;margin:0}
.mh-mediagrid img{width:100%;height:100%;object-fit:cover}
.mh-catalog-form{border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:26px;background:var(--dr-linen)}
.mh-catalog-form h3{font-size:21px;margin-bottom:8px}
.mh-catalog-form p{color:var(--dr-slate);font-size:14.5px}
@media (max-width:640px){
  .mh-mediagrid{grid-template-columns:1fr}
}

/* -------------------------------------------------------------- motion / a11y */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
[data-reveal].on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ------------------------------------------------------------- breakpoints */
@media (max-width:1180px){
  .mh-hero-grid{gap:40px}
  .mh-collrail-in{grid-template-columns:repeat(3,minmax(0,1fr));padding:0 24px}
  .mh-collmark{border-bottom:1px solid rgba(250,247,241,.14)}
  .mh-collmark:nth-child(3n+1){border-left:0}
  .mh-build{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mh-buildstep{border-bottom:1px solid var(--dr-line);padding-bottom:22px}
  .mh-buildstep:nth-child(3n+1){border-left:0;padding-left:0}
  .mh-related{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1024px){
  .mh-sec{padding:60px 0}
  .mh-hero-grid{grid-template-columns:1fr;gap:38px}
  .mh-hero-photo{aspect-ratio:16/9}
  .mh-hero-chips{margin-left:0;width:100%;justify-content:flex-start}
  .mh-mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-mtile-wide{grid-column:span 2}
  .mh-drail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-jgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-rooms{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 0}
  .mh-fact:nth-child(2n+1){border-left:0;padding-left:0}
  .mh-fact:nth-child(n+3){padding-top:22px;border-top:1px solid var(--dr-line-2)}
  .mh-hosband-in,.mh-closing-in,.mh-prefoot-in{grid-template-columns:1fr;gap:32px}
  .mh-cta-actions,.mh-prefoot-actions{justify-content:flex-start}
  .mh-split,.mh-artsplit,.mh-legal,.mh-contactsplit,.mh-catalogsplit,.mh-faqpage{grid-template-columns:1fr;gap:36px}
  .mh-pdp,.mh-pdp-detail{grid-template-columns:1fr;gap:36px}
  .mh-related{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-artrow{grid-template-columns:160px minmax(0,1fr)}
  .mh-foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
  .mh-toc{position:static}
  .mh-modal-box{grid-template-columns:1fr;max-height:92vh}
  .mh-modal-side{padding:28px 24px}
  .mh-modal-body{padding:28px 24px}
  .mh-filterbar{top:0}
}
@media (max-width:900px){
  .mh-wrap{width:auto;margin:0 20px;padding:0}
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .mh-mobar{
    display:grid;grid-template-columns:1fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:100;
    background:var(--dr-white);border-top:1px solid var(--dr-line);
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  }
  .mh-mobar .mh-btn{padding:13px 12px;font-size:11px}
  .mh-wa{bottom:calc(150px + env(safe-area-inset-bottom));right:16px;width:46px;height:46px;font-size:20px}
  .mh-totop{bottom:calc(90px + env(safe-area-inset-bottom));right:16px;width:42px;height:42px}
  .mh-toast{bottom:calc(96px + env(safe-area-inset-bottom))}
  .mh-cookie-in{padding-bottom:calc(18px + env(safe-area-inset-bottom))}
  .mh-collrail-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-collmark:nth-child(3n+1){border-left:1px solid rgba(250,247,241,.14)}
  .mh-collmark:nth-child(2n+1){border-left:0}
  .mh-build{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-buildstep:nth-child(3n+1){border-left:1px solid var(--dr-line);padding-left:22px}
  .mh-buildstep:nth-child(2n+1){border-left:0;padding-left:0}
  .mh-lighttable{min-width:0}
  .mh-lighttable thead{display:none}
  .mh-lighttable tr{display:block;border-bottom:1px solid var(--dr-line);padding:6px 0}
  .mh-lighttable tr:last-child{border-bottom:0}
  .mh-lighttable th,.mh-lighttable td{display:block;border-bottom:0;padding:6px 18px}
  .mh-lighttable tbody th{width:auto;font-family:var(--dr-ff-display);font-size:17px;padding-top:14px}
  .mh-lighttable td::before{
    content:attr(data-label) " · ";color:var(--dr-muted);
    font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  }
  .detail-content table td,.detail-content table th{white-space:nowrap;font-size:13.5px;padding:9px 12px}
  .mh-filterbar{position:static}
  .mh-pagehead{padding:40px 0 34px}
  .mh-pagehead::before{margin:-40px 0 0}
  .mh-hero-in{padding-top:44px;padding-bottom:46px}
  .mh-pdp,.mh-pdp-detail,.mh-artsplit,.mh-legal,.mh-contactsplit,.mh-catalogsplit,.mh-faqpage{padding-top:40px;padding-bottom:56px}
  .mh-sec{padding:52px 0}
  .mh-plates,.mh-rooms,.mh-jgrid,.mh-related,.mh-sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-quote-grid{grid-template-columns:1fr!important}
}
@media (max-width:640px){
  body{font-size:16px}
  .mh-split>*,.mh-artsplit>*,.mh-faqpage>*,.mh-pdp>*,.mh-pdp-detail>*,.mh-legal>*,.mh-quotepage>*,.mh-contactsplit>*,.mh-catalogsplit>*,.mh-hosband-in>*,.mh-closing-in>*,.mh-prefoot-in>*,.mh-foot-grid>*,.detail-content{min-width:0}
  .mh-mosaic,.mh-drail,.mh-pgrid,.mh-sgrid,.mh-jgrid,.mh-plates,.mh-rooms,.mh-related,.mh-build,.mh-cards-2,.mh-cards-3,.mh-contact-cards,.mh-hoscells,.mh-facts,.mh-foot-grid,.mh-prenext,.mh-cat-index,.mh-picklist{grid-template-columns:1fr}
  .mh-mtile-wide{grid-column:span 1}
  .mh-mtile-wide .mh-mtile-media{aspect-ratio:16/9}
  .mh-fact{border-left:0!important;padding-left:0!important}
  .mh-fact+.mh-fact{padding-top:20px;border-top:1px solid var(--dr-line-2)}
  .mh-buildstep{border-left:0!important;padding-left:0!important}
  .mh-artrow{grid-template-columns:1fr;gap:16px}
  .mh-artrow-media{aspect-ratio:16/9}
  .mh-form-2,.mh-form-vertify{grid-template-columns:1fr}
  .mh-ledger-row{grid-template-columns:1fr;gap:4px}
  .mh-spec-row{grid-template-columns:1fr;gap:5px}
  .mh-spec-row span{white-space:normal}
  .mh-dcard-spec{grid-template-columns:1fr}
  .mh-gallery-thumbs button{width:72px;height:72px}
  .mh-prefoot h3{font-size:22px}
  .mh-head-row{gap:20px}
  .mh-head-row .mh-more{width:100%}
  .mh-modal{padding:0}
  .mh-modal-box{width:100%;max-height:100vh;border-radius:0;height:100%}
  .mh-cookie-in{gap:16px}
  .mh-cookie-actions{width:100%}
  .mh-cookie-actions .mh-btn{flex:1 1 0}
  .mh-lighttable td{padding:6px 14px}
  .mh-lightbar{min-width:0}
  .mh-quote-grid{grid-template-columns:1fr}
  .mh-qtable thead,.mh-qtable thead tr{display:block}
  .mh-qtable .mh-qrow-img,.mh-qtable .mh-qrow-title,.mh-qtable .mh-qrow-qty,.mh-qtable .mh-qrow-del{display:block;border:0;padding:0}
}

/* phone: rich-text tables with a header row become stacked, labelled cards */
@media (max-width:600px){
  table.table-stack{border:0;display:block;overflow:visible}
  table.table-stack thead{display:none}
  table.table-stack tbody,table.table-stack tr,table.table-stack td{display:block;width:100%}
  table.table-stack tr{
    border:1px solid var(--dr-line);border-radius:var(--dr-radius);background:var(--dr-white);
    padding:6px 4px;margin-bottom:13px;
  }
  table.table-stack tr:last-child{margin-bottom:0}
  table.table-stack td{
    display:flex;flex-direction:column;gap:3px;border:0;border-bottom:1px dashed var(--dr-line-2);
    padding:10px 14px;white-space:normal!important;font-size:14.5px;
  }
  table.table-stack td:last-child{border-bottom:0}
  table.table-stack td::before{
    content:attr(data-label);color:var(--dr-muted);
    font-family:var(--dr-ff-mark);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  }
  table.table-stack td:first-child{
    border-bottom:1px solid var(--dr-line);color:var(--dr-ink);
    font-family:var(--dr-ff-display);font-size:17px;padding-bottom:12px;
  }
  table.table-stack td:first-child::before{display:none}
  .mh-matrix td:first-child::before{display:none}
}

/* ------------------------------------------------ quote list (product rows) */
.mh-qsteps{background:var(--dr-sand);border-bottom:1px solid var(--dr-line)}
.mh-qsteps-in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding-top:18px;padding-bottom:18px}
.mh-qstep{display:flex;align-items:center;gap:12px;padding:0 22px;border-left:1px solid var(--dr-line-2);color:var(--dr-slate);font-size:14.5px;min-width:0}
.mh-qstep:first-child{border-left:0;padding-left:0}
.mh-qstep.on{color:var(--dr-ink);font-weight:600}
.mh-qstep.on .mh-num{background:var(--dr-ink);color:#fff;border-color:var(--dr-ink)}
.mh-qstep .mh-num{
  display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;
  border:1px solid var(--dr-line-2);flex:0 0 auto;
}
.mh-quote-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:44px;align-items:start}
.mh-quote-grid>*{min-width:0}
.mh-qtable{border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);overflow:hidden}
.mh-qtable th,.mh-qtable td{padding:15px 16px;text-align:left;border-bottom:1px solid var(--dr-line);vertical-align:middle}
.mh-qtable thead th{background:var(--dr-linen);font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted);font-weight:400}
.mh-qtable tr:last-child td{border-bottom:0}
.mh-qrow-img{width:96px}
.mh-qrow-img img{border-radius:var(--dr-radius);width:76px;height:76px;object-fit:cover}
.mh-noimg{
  display:inline-flex;align-items:center;justify-content:center;width:76px;height:76px;border-radius:var(--dr-radius);
  background:var(--dr-sand);color:var(--dr-camel-2);
}
.mh-qrow-title h3{margin:0 0 5px;font-size:17px}
.mh-qrow-title h3 a:hover{color:var(--dr-copper)}
.mh-qrow-title small{color:var(--dr-muted);font-size:13px}
.mh-qty{display:inline-flex;align-items:center;border:1px solid var(--dr-line-2);border-radius:var(--dr-radius);overflow:hidden;background:var(--dr-white)}
.mh-qty button{width:38px;height:40px;border:0;background:transparent;cursor:pointer;color:var(--dr-ink)}
.mh-qty button:hover{background:var(--dr-sand);color:var(--dr-copper)}
.mh-qty input{width:52px;height:40px;border:0;border-left:1px solid var(--dr-line);border-right:1px solid var(--dr-line);text-align:center;font-size:15px;background:var(--dr-white);color:var(--dr-ink)}
.mh-qty input::-webkit-outer-spin-button,.mh-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.mh-qdel{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--dr-line);background:var(--dr-white);cursor:pointer;
  color:var(--dr-slate);
}
.mh-qdel:hover{border-color:var(--dr-neg);color:var(--dr-neg)}
.mh-quote-form{border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:26px;background:var(--dr-linen);position:sticky;top:96px}
.mh-quote-count{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;padding-bottom:14px;
  border-bottom:1px solid var(--dr-line);
  font-family:var(--dr-ff-mark);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-muted);
}
.mh-quote-count b{font-family:var(--dr-ff-display);font-size:22px;color:var(--dr-ink);letter-spacing:0}
.mh-quote-more{margin:22px 0 0}
@media (max-width:900px){
  .mh-qsteps-in{grid-template-columns:1fr;gap:10px}
  .mh-qstep{border-left:0;padding:0}
  .mh-quote-form{position:static}
}
@media (max-width:640px){
  .mh-qtable thead{display:none}
  .mh-qtable,.mh-qtable tbody{display:block}
  .mh-qtable tbody tr{
    display:grid;grid-template-columns:70px minmax(0,1fr) auto;grid-template-areas:"img title del" "img qty del";
    gap:8px 12px;align-items:center;padding:16px;border-bottom:1px solid var(--dr-line);
  }
  .mh-qrow-img{grid-area:img;width:auto}
  .mh-qrow-img img,.mh-qrow-img .mh-noimg{width:70px;height:70px}
  .mh-qrow-title{grid-area:title}
  .mh-qrow-qty{grid-area:qty;justify-self:start}
  .mh-qrow-del{grid-area:del;justify-self:end;align-self:center}
  .mh-qty input{width:44px}
}

/* ------------------------------------------------- inner-page supplements */
.mh-bar{background:var(--dr-white)}
.mh-topbar-chips{display:flex;align-items:center;gap:16px;min-width:0;overflow:hidden}
.mh-hero-chips-mini{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.mh-spec-rows{display:block}

.mh-cards-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.mh-cards-3>*{min-width:0}
/* 原来固定 aspect-ratio(4/5)，而站点占位插画 dr-window.svg 是 5:4 的横版，
   再叠加 {zan:uiupload} 包裹层切断了 height:100% 链路，图片只铺满框的上半部分，
   下方留出约 300px 空白。改成让图片按自身比例撑开容器：不裁切也不留白。 */
.mh-figure{border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-sand);margin:0}
.mh-figure img{display:block;width:100%;height:auto}
.mh-figure.tall,.mh-figure.wide{aspect-ratio:auto}

/* 图标与标题并排一行：图标占第一列，紧跟其后的 h3 占第二列，段落等其余内容整行排下去 */
.mh-tilecol{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);padding:24px 26px;background:var(--dr-white);min-width:0;
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 13px;align-items:center;
}
.mh-tilecol>*{grid-column:1/-1}
.mh-tilecol>.mh-tile-ico{grid-column:1;grid-row:1;margin:0}
.mh-tilecol>.mh-tile-ico+h3{grid-column:2;grid-row:1;margin:0}
.mh-tilecol p{margin:0;color:var(--dr-slate);font-size:15px}
.mh-tilecol-dark{background:var(--dr-ink);border-color:var(--dr-ink);color:var(--dr-linen)}
.mh-tilecol-dark h3{color:var(--dr-linen)}
.mh-tilecol-dark p{color:var(--dr-sand-2)}

.mh-linkbtn,.mh-artrow-quote,.mh-result-quote{
  border:0;background:none;cursor:pointer;padding:0;
  font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dr-copper);
  display:inline-flex;align-items:center;gap:7px;
}
.mh-linkbtn:hover,.mh-artrow-quote:hover,.mh-result-quote:hover{color:var(--dr-copper-2)}

.mh-sgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.mh-scard{
  border:1px solid var(--dr-line);border-radius:var(--dr-radius-lg);overflow:hidden;background:var(--dr-white);
  display:flex;flex-direction:column;min-width:0;transition:box-shadow .24s ease,transform .24s ease;
}
.mh-scard:hover{box-shadow:var(--dr-shadow);transform:translateY(-3px)}
.mh-scard-media{position:relative;aspect-ratio:16/10;background:var(--dr-sand);overflow:hidden}
.mh-scard-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.mh-scard:hover .mh-scard-media img{transform:scale(1.04)}
.mh-scard-n{
  position:absolute;left:14px;top:14px;padding:5px 11px;border-radius:999px;
  background:rgba(26,27,32,.86);color:var(--dr-brass);
  font-family:var(--dr-ff-mark);font-size:10.5px;letter-spacing:.12em;
}
.mh-scard-body{padding:22px 23px 24px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto}
.mh-scard-body h3{margin:0;font-size:19.5px;line-height:1.32}
.mh-scard-body h3 a:hover{color:var(--dr-copper)}
.mh-scard-body p{margin:0;color:var(--dr-slate);font-size:14.5px}
.mh-scard-list{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.mh-scard-list li{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--dr-slate);min-width:0}
.mh-scard-list i{color:var(--dr-camel-2);margin-top:4px;flex:0 0 auto;font-size:10px}
.mh-scard .mh-more{margin-top:auto;align-self:flex-start}

.mh-cat-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px;margin-top:24px}
.mh-cat-index a{
  display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;
  border-bottom:1px solid var(--dr-line);font-size:15.5px;color:var(--dr-ink-2);min-width:0;
}
.mh-cat-index a:hover{color:var(--dr-copper)}
.mh-cat-index i{color:var(--dr-camel-2);flex:0 0 auto;font-size:11px}
.mh-cat-index span{min-width:0}

.mh-quotepage{min-width:0}
.mh-matrix{min-width:0}
/* picklist 只出现在侧栏（约 400px 宽、减去卡片内边距仅剩 ~350px），原来排两列时每格正文
   只剩 ~80px，长标题被压成七八行、卡片高矮悬殊。改为单列整行 + 标题两行截断，行高一致。 */
.mh-picklist{display:grid;grid-template-columns:1fr;gap:10px}
.mh-picklist a{
  display:flex;align-items:center;gap:12px;padding:11px 15px;border:1px solid var(--dr-line);
  border-radius:var(--dr-radius);background:var(--dr-white);min-width:0;font-size:14.5px;
}
.mh-picklist a:hover{border-color:var(--dr-camel);color:var(--dr-copper)}
.mh-picklist img{width:44px;height:44px;border-radius:9px;object-fit:cover;flex:0 0 auto}
.mh-picklist a>span{
  min-width:0;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
/* 深色卡片里的 picklist 原来沿用白底、文字却继承深色卡的浅色（--dr-linen），白底浅字几乎看不见。
   改成深色卡内用半透明底 + 浅色文字 + 铜色图标。 */
.mh-side-card.dark .mh-picklist a{
  background:rgba(250,247,241,.06);border-color:rgba(250,247,241,.2);color:var(--dr-linen);
}
.mh-side-card.dark .mh-picklist a>i{color:var(--dr-camel)}
.mh-side-card.dark .mh-picklist a:hover{background:rgba(250,247,241,.13);border-color:var(--dr-camel);color:#fff}

/* .mh-sgrid 的基础规则（repeat(3,…)，见上方）排在本文件靠后的位置，把前面 @media 里
   ≤1024 / ≤900 / ≤640 的折叠声明都盖掉了，手机端仍是三列、标题被挤成一词一行。
   在基础规则之后重新声明断点，手机上按 2 列 → 1 列收。 */
@media (max-width:1024px){
  .mh-sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .mh-cards-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .mh-sgrid,.mh-cards-3,.mh-cat-index,.mh-picklist{grid-template-columns:1fr}
}