/* ============================================================
   节点21 · 52qlx 礼品 B2B 平台 组件层 mall.css
   仅 class 选择器 + tokens.css 变量（守「禁内联样式 / 禁编造配色」）
   配色全部 var(--mall-*)，圆角 12-16px，阴影克制，过渡 150ms
   ============================================================ */

/* ---------- 基础 ---------- */
* { box-sizing: border-box; }
body {
  background: var(--mall-bg);
  color: var(--mall-ink);
  font-family: var(--mall-font-sans);
  font-size: 15px;
  line-height: 1.65;
  margin: 0;
}
a { color: var(--mall-primary); text-decoration: none; transition: color var(--mall-transition); }
a:hover { color: var(--mall-primary-hover); }
h1,h2,h3,h4 { font-family: var(--mall-font-serif); color: var(--mall-ink); }
.mall-container { max-width: var(--mall-container); margin: 0 auto; padding: 0 24px; }
.mall-section { padding: var(--mall-section-gap) 0; }
.mall-section-deep { padding: var(--mall-section-gap-deep) 0; }
.mall-section-dark { background: var(--mall-primary); color: #F8F5EE; }
.mall-section-dark h1,.mall-section-dark h2,.mall-section-dark h3 { color: #F8F5EE; }
.mall-kicker {
  display:inline-block; font-family: var(--mall-font-sans); font-size: 12px;
  font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  color: var(--mall-gold); margin-bottom: 12px;
}
.mall-h2 { font-size: 36px; font-weight: 700; line-height: 1.2; margin: 0 0 12px; }
.mall-sub { color: var(--mall-ink-soft); font-size: 16px; max-width: 640px; }
.mall-section-head { margin-bottom: 48px; }
.text-gold { color: var(--mall-gold) !important; }
.text-cta { color: var(--mall-cta) !important; }
/* utility（替代内联样式，守「禁内联样式」） */
.mall-bg-white { background:#fff; }
.mall-bg-alt { background: var(--mall-bg-alt); }
.mall-text-center { text-align:center; }
.mall-mt-32 { margin-top:32px; }
.mall-mb-24 { margin-bottom:24px; }
.mall-mt-48 { margin-top:48px; }
.mall-pt-32 { padding-top:32px; }
.mall-pb-0 { padding-bottom:0; }
.mall-hidden { display:none !important; }
.mall-h2-md { font-size: 30px; }
.mall-select-inline { width:auto; display:inline-block; }
.mall-i-lg { font-size:36px; }
.mall-i-xl { font-size:56px; }
.mall-h-120 { height:120px; }
.mall-btn-block { width:100%; justify-content:center; }
.mall-grid-3 { grid-template-columns: repeat(3,1fr); }
.mall-grid-4 { grid-template-columns: repeat(4,1fr); }
.mall-result-success { background:#eaf5ee; border:1px solid var(--mall-primary-tint); color: var(--mall-primary); border-radius: var(--mall-radius-sm); padding:14px; font-size:14px; }
.mall-container-narrow { max-width:960px; }
.mall-pad-96 { padding:96px 24px; }
.mall-empty-title { font-size:20px; color:var(--mall-ink); }
.mall-btn-gap { margin:0 4px; }
.mall-wh-full { width:100%; height:100%; }
.mall-h-full { height:100%; }

/* ---------- 按钮 ---------- */
.mall-btn {
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding: 14px 28px; border-radius: var(--mall-radius-pill);
  font-weight: 600; font-size: 15px; border: 1.5px solid transparent;
  transition: all var(--mall-transition); text-decoration:none; line-height:1;
}
.mall-btn-cta { background: var(--mall-cta); color: #fff; }
.mall-btn-cta:hover { background: var(--mall-cta-hover); color:#fff; transform: translateY(-2px); }
.mall-btn-primary { background: var(--mall-primary); color: #F8F5EE; }
.mall-btn-primary:hover { background: var(--mall-primary-hover); color:var(--mall-bg); transform: translateY(-2px); }
.mall-btn-outline { background: transparent; color: var(--mall-primary); border-color: var(--mall-primary); }
.mall-btn-outline:hover { background: var(--mall-primary); color:var(--mall-bg); }
.mall-btn-gold { background: var(--mall-gold); color: #1A1A1A; }
.mall-btn-gold:hover { background: var(--mall-gold-light); color:#1A1A1A; transform: translateY(-2px); }
.mall-btn-ghost { background: rgba(255,255,255,.12); color:var(--mall-bg); border-color: rgba(255,255,255,.4); }
.mall-btn-ghost:hover { background: rgba(255,255,255,.22); color:#fff; }
.mall-btn-sm { padding: 8px 16px; font-size: 13px; }
.mall-btn-lg { padding: 16px 36px; font-size: 16px; }

/* ---------- 顶栏 ---------- */
.mall-header { background: #fff; border-bottom: 1px solid var(--mall-border); z-index: 1030; }
.mall-header-inner {
  max-width: var(--mall-container-wide); margin:0 auto; padding: 0 24px;
  height: 68px; display:flex; align-items:center; gap: 28px;
}
.mall-logo { display:flex; align-items:center; gap:10px; color: var(--mall-primary); flex-shrink:0; }
.mall-logo-mark {
  width:38px; height:38px; border-radius:10px; background: var(--mall-primary); color:var(--mall-bg);
  font-family: var(--mall-font-serif); font-size:22px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.mall-logo-img { height:40px; width:auto; display:block; }
.mall-logo-text b { display:block; font-family: var(--mall-font-serif); font-size:16px; font-weight:700; color: var(--mall-primary); line-height:1.1; letter-spacing:.01em; }
.mall-logo-text small { display:block; font-size:11px; color: var(--mall-gold); letter-spacing:.15em; }
.mall-nav { display:flex; align-items:center; gap: 26px; }
.mall-nav > a, .mall-mega-trigger {
  font-size:14px; font-weight:500; color: var(--mall-ink); cursor:pointer; position:relative;
  padding: 6px 0; transition: color var(--mall-transition);
}
.mall-nav > a:hover, .mall-mega-trigger:hover { color: var(--mall-primary); }
.mall-mega-trigger::after {
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px;
  background: var(--mall-gold); transform: scaleX(0); transition: transform var(--mall-transition);
}
.mall-mega-trigger:hover::after { transform: scaleX(1); }
.mall-search { flex:1; max-width: 320px; display:flex; align-items:center; gap:0;
  background: var(--mall-bg-alt); border-radius: var(--mall-radius-pill); padding: 4px 4px 4px 16px; }
.mall-search input { flex:1; border:none; background:transparent; outline:none; font-size:14px; color: var(--mall-ink); }
.mall-search button { border:none; background: var(--mall-primary); color:var(--mall-bg); width:34px; height:34px;
  border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.mall-user { display:flex; align-items:center; gap:14px; margin-left:auto; }
.mall-user-ppt { display:flex; align-items:center; gap:4px; font-size:14px; color: var(--mall-ink); position:relative; }
.mall-badge {
  display:inline-flex; min-width:18px; height:18px; padding:0 5px; align-items:center; justify-content:center;
  background: var(--mall-cta); color:#fff; font-size:11px; font-weight:600; border-radius:9px;
}
.mall-badge[data-empty="1"] { display:none; }
.mall-user-name { font-size:14px; font-weight:600; color: var(--mall-primary); }
.mall-user-logout { font-size:13px; color: var(--mall-ink-soft); }
.mall-btn-login { font-size:14px; font-weight:600; color: var(--mall-primary); }
.mall-btn-ppt {
  display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:600;
  background: var(--mall-cta); color:#fff; padding: 9px 18px; border-radius: var(--mall-radius-pill);
}
.mall-btn-ppt:hover { background: var(--mall-cta-hover); color:#fff; }

/* 汉堡按钮（桌面隐藏，<992 显示，触发 offcanvas drawer） */
.mall-nav-toggle { display:none; width:44px; height:44px; border:none; background:transparent; color: var(--mall-primary);
  font-size:24px; align-items:center; justify-content:center; cursor:pointer; border-radius: var(--mall-radius-sm); transition: background var(--mall-transition); }
.mall-nav-toggle:hover { background: var(--mall-bg-alt); }

/* 移动端导航抽屉（Bootstrap offcanvas，配色守 tokens） */
.mall-drawer { max-width:340px; }
.mall-drawer .offcanvas-header { border-bottom:1px solid var(--mall-border); }
.mall-drawer .offcanvas-title { font-family: var(--mall-font-serif); font-size:18px; color: var(--mall-primary); }
.mall-drawer .offcanvas-title b { font-weight:700; }
.mall-drawer .btn-close:focus { box-shadow:none; }
.mall-drawer-search { display:flex; gap:8px; margin-bottom:20px; }
.mall-drawer-search input { flex:1; min-width:0; border:1px solid var(--mall-border); border-radius: var(--mall-radius-pill); padding:10px 16px; font-size:14px; background:var(--mall-bg-alt); color:var(--mall-ink); }
.mall-drawer-search input:focus { outline:none; border-color: var(--mall-primary); }
.mall-drawer-search button { border:none; background: var(--mall-primary); color:var(--mall-bg); width:42px; height:42px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.mall-drawer-nav, .mall-drawer-user { display:flex; flex-direction:column; gap:2px; }
.mall-drawer-nav a, .mall-drawer-user a { padding:12px 14px; font-size:15px; color: var(--mall-ink); border-radius: var(--mall-radius-sm); display:flex; align-items:center; gap:10px; transition: background var(--mall-transition); }
.mall-drawer-nav a:hover, .mall-drawer-user a:hover { background: var(--mall-bg-alt); color: var(--mall-primary); }
.mall-drawer-nav a i, .mall-drawer-user a i { color: var(--mall-gold); }
.mall-drawer-user { margin-top:20px; padding-top:20px; border-top:1px solid var(--mall-border); }
.mall-drawer-user .mall-btn { justify-content:center; }

/* mega-menu 面板 */
.mall-mega {
  position:absolute; left:0; right:0; top:100%; background:#fff;
  border-top: 1px solid var(--mall-border); box-shadow: var(--mall-shadow-hover);
  max-height: 70vh; overflow:auto;
}
.mall-mega[hidden] { display:none; }
.mall-mega-inner { max-width: var(--mall-container-wide); margin:0 auto; padding: 28px 24px; display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px 32px; }
.mall-mega-l1 { font-family: var(--mall-font-serif); font-weight:700; font-size:16px; color: var(--mall-primary); margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid var(--mall-border-soft); }
.mall-mega-l2 { font-size:13px; font-weight:600; color: var(--mall-ink); margin-top:8px; }
.mall-mega-l3 { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:4px; }
.mall-mega-l3 a { font-size:13px; color: var(--mall-ink-soft); }
.mall-mega-l3 a:hover { color: var(--mall-gold); }
.mall-mega-l2 a { color: var(--mall-primary); }

/* 企业采购 下拉（顶栏，trigger 复用 .mall-mega-trigger 样式；菜单主题化，守 tokens 禁内联） */
.mall-nav-menu {
  border: 1px solid var(--mall-border); border-radius: var(--mall-radius);
  box-shadow: var(--mall-shadow-hover); background: var(--mall-card);
  padding: 8px; min-width: 230px; margin-top: 8px;
}
.mall-nav-menu .dropdown-item {
  border-radius: var(--mall-radius-sm); color: var(--mall-ink);
  font-size: 14px; padding: 10px 14px; display: flex; align-items: center; gap: 6px;
}
.mall-nav-menu .dropdown-item:hover, .mall-nav-menu .dropdown-item:focus {
  background: var(--mall-bg-alt); color: var(--mall-primary);
}
.mall-nav-cur { color: var(--mall-gold); font-size: 12px; font-weight: 600; }
.mall-drawer-sub { font-size: 12px; font-weight: 600; color: var(--mall-gold);
  letter-spacing: .12em; margin: 14px 4px 4px; }

/* 公告条 */
.mall-topbar { background: var(--mall-primary-950); color: rgba(248,245,238,.78); font-size:12px; }
.mall-topbar-inner { max-width: var(--mall-container-wide); margin:0 auto; padding: 7px 24px; display:flex; gap:28px; flex-wrap:wrap; }
.mall-topbar i { color: var(--mall-gold); margin-right:4px; }

/* ---------- 首屏 Hero ---------- */
.mall-hero {
  background: linear-gradient(135deg, var(--mall-primary-900) 0%, var(--mall-primary) 60%, var(--mall-primary-700) 100%);
  color: #F8F5EE; position:relative; overflow:hidden; min-height: 62vh; display:flex; align-items:center;
}
.mall-hero::before {
  content:""; position:absolute; right:-10%; top:-20%; width:60%; height:140%;
  background: radial-gradient(circle, rgba(200,162,74,.22) 0%, transparent 60%);
}
.mall-hero-inner { max-width: var(--mall-container); margin:0 auto; padding: 96px 24px; position:relative; z-index:1; }
.mall-hero-kicker { color: var(--mall-gold); font-size:13px; letter-spacing:.25em; text-transform:uppercase; font-weight:600; margin-bottom:18px; }
.mall-hero h1 { font-size: 60px; font-weight:700; line-height:1.1; color:var(--mall-bg); margin:0 0 20px; max-width: 760px; }
.mall-hero p { font-size:18px; color: rgba(248,245,238,.82); max-width:560px; margin:0 0 32px; }
.mall-hero-actions { display:flex; gap:16px; flex-wrap:wrap; }
.mall-hero-stats { display:flex; gap:48px; margin-top:56px; flex-wrap:wrap; }
.mall-hero-stat-n { font-family: var(--mall-font-serif); font-size:40px; font-weight:700; color: var(--mall-gold); line-height:1; }
.mall-hero-stat-l { font-size:13px; color: rgba(248,245,238,.7); margin-top:6px; }

/* ---------- 融合首屏 v4（抠图溶入绿底 · 红 logo 聚焦）2026-08-05 ---------- */
/* v4：天空已抠（hero-ski.png）；滑雪者 mask 羽化溶入绿底（中清晰=logo 聚焦、四周淡）；左做生意 + 右品牌去框绿渐变文字；顶对齐 */
.mall-hero-fused { position:relative; overflow:hidden; min-height:90vh; display:flex; align-items:stretch; background:var(--mall-primary-950); }
/* 绿底带深度（不平板）：中右略亮托滑雪者，四周渐深 */
.mall-hero-fused-bg { position:absolute; inset:0;
  background: radial-gradient(ellipse 72% 92% at 70% 42%, #2c5644 0%, var(--mall-primary-900) 46%, var(--mall-primary-950) 100%); }
/* 滑雪者抠图：右侧大；mask 让中心(含红logo)清晰、四周羽化溶入绿 = 自然融入 + 红 logo 聚焦 */
.mall-hero-fused-skier { position:absolute; right:14%; top:-26%; height:120%; width:auto; z-index:1; object-fit:contain;
  -webkit-mask-image: radial-gradient(ellipse 60% 72% at 46% 50%, #000 60%, rgba(0,0,0,.4) 82%, transparent 98%);
  mask-image: radial-gradient(ellipse 60% 72% at 46% 50%, #000 60%, rgba(0,0,0,.4) 82%, transparent 98%); }
.mall-hero-fused-grid { position:relative; z-index:2; width:100%; max-width:var(--mall-container-wide); margin:0 auto; padding:78px 32px; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:40px; align-items:flex-start; }
/* 左：做生意 */
.mall-hero-fused-text { min-width:0; padding-top:6px; }
.mall-hero-fused-kicker { color:var(--mall-gold); font-size:15px; letter-spacing:.22em; text-transform:uppercase; font-weight:700; margin-bottom:18px; }
.mall-hero-fused-text h1 { font-family:var(--mall-font-serif); font-size:50px; font-weight:700; line-height:1.18; color:var(--mall-bg); margin:0 0 16px; max-width:540px; }
.mall-hero-fused-accent { color:var(--mall-gold-pale); font-size:17px; font-weight:600; letter-spacing:.03em; margin:0 0 14px; }
.mall-hero-fused-sub { font-size:16px; color:rgba(248,245,238,.92); max-width:480px; margin:0 0 26px; line-height:1.75; }
.mall-hero-fused-actions { display:flex; gap:16px; flex-wrap:wrap; }
.mall-hero-fused-stats { display:flex; gap:34px; margin-top:34px; flex-wrap:wrap; max-width:560px; }
.mall-hero-fused-stat-n { font-family:var(--mall-font-serif); font-size:32px; font-weight:700; color:var(--mall-gold); line-height:1; }
.mall-hero-fused-stat-l { font-size:12px; color:rgba(248,245,238,.82); margin-top:6px; }
/* 右：品牌去框，绿渐变文字（与左绿呼应）；右上，让出滑雪者主体 */
.mall-hero-fused-brand { min-width:0; max-width:380px; margin:6px 0 0 auto; padding:0; text-align:right; }
.mall-hero-fused-brand-kicker { color:var(--mall-gold); font-size:13px; letter-spacing:.22em; text-transform:uppercase; font-weight:700; margin-bottom:12px; }
.mall-hero-fused-brand-tag { font-family:var(--mall-font-serif); font-size:28px; font-weight:700; line-height:1.24; margin-bottom:12px;
  background:linear-gradient(135deg, var(--mall-gold-pale) 0%, var(--mall-gold) 32%, var(--mall-primary-tint) 76%, var(--mall-primary) 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent; }
.mall-hero-fused-brand-foot { font-size:13px; color:rgba(248,245,238,.82); line-height:1.6; }
/* 移动端：单列；滑雪者作淡背景（底出），品牌在上、做生意在下；守 992/576 断点 */
@media (max-width:991.98px) {
  .mall-hero-fused { min-height:86vh; }
  .mall-hero-fused-bg { background: radial-gradient(ellipse 90% 60% at 50% 26%, #2c5644 0%, var(--mall-primary-900) 50%, var(--mall-primary-950) 100%); }
  .mall-hero-fused-skier { right:-22%; top:auto; bottom:-6%; height:78%; opacity:.8;
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 34%); mask-image: linear-gradient(to bottom, transparent, #000 34%); }
  .mall-hero-fused-grid { grid-template-columns:1fr; gap:0; padding:0 20px 48px; }
  .mall-hero-fused-brand { order:-1; max-width:none; margin:96px 0 22px; text-align:left; }
  .mall-hero-fused-brand-tag { font-size:24px; }
  .mall-hero-fused-text h1 { font-size:34px; }
}
@media (max-width:575.98px) {
  .mall-hero-fused-text h1 { font-size:27px; }
  .mall-hero-fused-accent { font-size:15px; }
  .mall-hero-fused-sub { font-size:14px; }
  .mall-hero-fused-kicker { font-size:12px; letter-spacing:.16em; }
  .mall-hero-fused-brand-tag { font-size:21px; }
  .mall-hero-fused-stats { gap:20px; margin-top:30px; }
  .mall-hero-fused-stat-n { font-size:25px; }
}

/* ---------- 价格档 ---------- */
.mall-price-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
.mall-price-card {
  background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius);
  padding: 24px; text-align:left; transition: all var(--mall-transition); display:block;
}
.mall-price-card:hover { border-color: var(--mall-gold); transform: translateY(-4px); box-shadow: var(--mall-shadow-hover); }
.mall-price-card-i { width:40px; height:40px; border-radius:10px; background: var(--mall-bg-alt); color: var(--mall-primary);
  display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:14px; }
.mall-price-card-t { font-family: var(--mall-font-serif); font-size:20px; font-weight:700; color: var(--mall-ink); }
.mall-price-card-s { font-size:13px; color: var(--mall-ink-soft); margin-top:4px; }

/* ---------- 品牌墙 ---------- */
.mall-brand-wall { display:grid; grid-template-columns: repeat(6,1fr); gap:16px; }
.mall-brand-chip {
  background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius);
  padding: 20px 12px; text-align:center; transition: all var(--mall-transition); display:block;
}
.mall-brand-chip:hover { border-color: var(--mall-gold); transform: translateY(-2px); }
.mall-brand-chip-n { font-family: var(--mall-font-serif); font-size:16px; font-weight:600; color: var(--mall-primary); }
.mall-brand-chip-c { font-size:12px; color: var(--mall-ink-soft); margin-top:4px; }

/* ---------- 品牌楼层 ---------- */
.mall-floor { margin-bottom: 64px; }
.mall-floor-head { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:24px; border-bottom:2px solid var(--mall-primary); padding-bottom:12px; }
.mall-floor-title { font-family: var(--mall-font-serif); font-size:28px; font-weight:700; color: var(--mall-primary); }
.mall-floor-title small { font-size:14px; color: var(--mall-gold); margin-left:10px; font-family: var(--mall-font-sans); }
.mall-floor-more { font-size:14px; color: var(--mall-primary); font-weight:600; }

/* ---------- 产品卡 ---------- */
.mall-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:20px; }
.mall-grid-5 { grid-template-columns: repeat(5,1fr); }
.mall-card {
  background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius);
  overflow:hidden; transition: all var(--mall-transition); display:flex; flex-direction:column; position:relative;
}
.mall-card:hover { transform: translateY(-4px); box-shadow: var(--mall-shadow-hover); border-color: var(--mall-gold); }
.mall-card-img { aspect-ratio: 1/1; background: var(--mall-bg-alt); overflow:hidden; position:relative; }
.mall-card-img img { width:100%; height:100%; object-fit:cover; transition: transform var(--mall-transition); }
.mall-card:hover .mall-card-img img { transform: scale(1.04); }
.mall-card-noimg { width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  color: var(--mall-ink-soft); font-size:13px; background: var(--mall-bg-alt); }
.mall-card-body { padding: 14px 16px 16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.mall-card-brand { font-size:12px; color: var(--mall-gold); font-weight:600; letter-spacing:.05em; }
.mall-card-name { font-size:14px; font-weight:500; color: var(--mall-ink); line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:39px; }
.mall-card-code { font-size:11px; color: var(--mall-ink-soft); }
.mall-card-foot { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:8px; }
.mall-card-price { font-family: var(--mall-font-serif); font-size:18px; font-weight:700; color: var(--mall-cta); }
.mall-card-price small { font-size:12px; font-weight:400; }
.mall-card-add {
  width:32px; height:32px; border-radius:50%; border:none; cursor:pointer;
  background: var(--mall-primary); color:var(--mall-bg); display:flex; align-items:center; justify-content:center;
  font-size:16px; transition: all var(--mall-transition);
}
.mall-card-add:hover { background: var(--mall-cta); transform: scale(1.08); }
.mall-card-add[data-added="1"] { background: var(--mall-gold); }
.mall-card-tag { position:absolute; top:10px; left:10px; background: var(--mall-cta); color:#fff;
  font-size:11px; font-weight:600; padding:3px 8px; border-radius: var(--mall-radius-sm); z-index:1; }

/* ---------- 定制流程 ---------- */
.mall-steps { display:grid; grid-template-columns: repeat(4,1fr); gap:24px; position:relative; }
.mall-step { text-align:center; position:relative; }
.mall-step-n { font-family: var(--mall-font-serif); font-size:48px; font-weight:700; color: var(--mall-gold); line-height:1; opacity:.85; }
.mall-step-t { font-size:18px; font-weight:600; color: var(--mall-ink); margin-top:12px; }
.mall-step-s { font-size:13px; color: var(--mall-ink-soft); margin-top:6px; }

/* ---------- 服务承诺 ---------- */
.mall-promise { display:grid; grid-template-columns: repeat(4,1fr); gap:24px; }
.mall-promise-item { text-align:center; padding: 28px 16px; border:1px solid var(--mall-border); border-radius: var(--mall-radius); background:#fff; }
.mall-promise-i { width:52px; height:52px; border-radius:14px; background: var(--mall-bg-alt); color: var(--mall-primary);
  display:flex; align-items:center; justify-content:center; font-size:24px; margin:0 auto 14px; }
.mall-promise-t { font-size:16px; font-weight:600; color: var(--mall-ink); }
.mall-promise-s { font-size:13px; color: var(--mall-ink-soft); margin-top:4px; }

/* ---------- 询价 CTA ---------- */
.mall-cta-band { background: var(--mall-primary); color:var(--mall-bg); border-radius: var(--mall-radius-lg); padding: 56px; text-align:center; }
.mall-cta-band h2 { color:var(--mall-bg); font-size:32px; margin:0 0 12px; }
.mall-cta-band p { color: rgba(248,245,238,.8); margin:0 0 24px; }

/* ---------- footer ---------- */
.mall-footer { background: var(--mall-primary-950); color: rgba(248,245,238,.75); padding: 64px 0 28px; margin-top: 80px; }
.mall-footer-inner { max-width: var(--mall-container); margin:0 auto; padding:0 24px; }
.mall-footer-brand b { font-family: var(--mall-font-serif); font-size:20px; color:var(--mall-bg); }
.mall-footer-desc { font-size:13px; margin-top:10px; line-height:1.7; }
.mall-footer-h { font-size:14px; font-weight:600; color:var(--mall-bg); margin-bottom:12px; }
.mall-footer-links { list-style:none; padding:0; margin:0; }
.mall-footer-links li { margin-bottom:8px; }
.mall-footer-links a { font-size:13px; color: rgba(248,245,238,.7); }
.mall-footer-links a:hover { color: var(--mall-gold); }
.mall-footer-line { font-size:13px; margin:0 0 6px; }
.mall-footer-copy { border-top:1px solid rgba(248,245,238,.12); margin-top:40px; padding-top:24px; font-size:12px; color: rgba(248,245,238,.55); }

/* ---------- catalog 列表页 ---------- */
.mall-catalog-layout { display:grid; grid-template-columns: 240px 1fr; gap: 32px; align-items:start; }
.mall-filter { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding: 20px; position:sticky; top:90px; z-index:20; }   /* z-index:20 抬过产品网格列，免类目 flyout 被遮盖→级联不到4级 */
.mall-filter-h { font-size:13px; font-weight:600; color: var(--mall-ink); margin: 16px 0 8px; padding-bottom:6px; border-bottom:1px solid var(--mall-border-soft); }
.mall-filter-h:first-child { margin-top:0; }
/* 移动端筛选器折叠面板（<992 顶部「筛选条件」条 toggle；桌面隐藏 toggle 条，内容常态展开） */
.mall-filter-mobile-bar { display:none; cursor:pointer; }
.mall-filter-caret { transition: transform var(--mall-transition); }
.mall-filter-list { list-style:none; padding:0; margin:0; }
.mall-filter-list li { margin-bottom:6px; }
.mall-filter-list a, .mall-filter-list label { font-size:13px; color: var(--mall-ink-soft); cursor:pointer; display:flex; align-items:center; gap:6px; }
.mall-filter-list a:hover, .mall-filter-list input:checked + span { color: var(--mall-primary); }
/* 类目悬停级联树（一级→悬停→二级 flyout→…→四级，离开收起；纯 CSS） */
.mall-cat-tree, .mall-cat-sub { list-style:none; padding:0; margin:0; }
.mall-cat-tree > .mall-cat-node > a { padding:8px 10px; font-size:13px; font-weight:500; color: var(--mall-ink); }
.mall-cat-node { position:relative; }
.mall-cat-node > a { display:block; padding:6px 10px; font-size:13px; color: var(--mall-ink-soft); border-radius:6px; text-decoration:none; transition: all var(--mall-transition); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mall-cat-node:hover > a { background: var(--mall-bg-alt); color: var(--mall-primary); }
.mall-cat-has-sub > a::after { content:"›"; float:right; color: var(--mall-border); font-size:14px; margin-left:6px; }
.mall-cat-has-sub:hover > a::after { color: var(--mall-gold); }
.mall-cat-sub { display:none; position:absolute; left:100%; top:0; min-width:180px; background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); box-shadow: var(--mall-shadow-hover); padding:6px; z-index:50; }   /* 不加 overflow/max-height：一轴 auto 会让另一轴 visible→auto，裁掉嵌套 flyout，级联断在2级 */
.mall-cat-node:hover > .mall-cat-sub { display:block; }   /* 级联展开：悬停显下一级，离开自动收起 */
.mall-filter-active { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.mall-chip { background: var(--mall-bg-alt); border-radius: var(--mall-radius-pill); padding:5px 12px; font-size:12px; color: var(--mall-ink); display:inline-flex; align-items:center; gap:6px; }
.mall-toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.mall-result-n { font-size:14px; color: var(--mall-ink-soft); }
.mall-empty { padding: 80px 24px; text-align:center; color: var(--mall-ink-soft); }
.mall-empty i { font-size:48px; color: var(--mall-border); }

/* ---------- 商品详情 ---------- */
.mall-crumb { font-size:13px; color: var(--mall-ink-soft); padding: 20px 0; }
.mall-crumb a { color: var(--mall-ink-soft); }
.mall-crumb a:hover { color: var(--mall-primary); }
.mall-pd-layout { display:grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.mall-gallery-main { aspect-ratio:1/1; background: var(--mall-bg-alt); border-radius: var(--mall-radius-lg); overflow:hidden; }
.mall-gallery-main img { width:100%; height:100%; object-fit:contain; }
.mall-gallery-thumbs { display:flex; gap:10px; margin-top:12px; }
.mall-gallery-thumbs img { width:72px; height:72px; object-fit:cover; border-radius: var(--mall-radius-sm); border:2px solid transparent; cursor:pointer; }
.mall-gallery-thumbs img.active { border-color: var(--mall-gold); }
.mall-pd-brand { color: var(--mall-gold); font-weight:600; font-size:14px; }
.mall-pd-name { font-family: var(--mall-font-serif); font-size:30px; font-weight:700; margin:8px 0 6px; line-height:1.25; }
.mall-pd-code { font-size:13px; color: var(--mall-ink-soft); }
.mall-pd-price-row { display:flex; align-items:baseline; gap:14px; margin:20px 0; padding:16px 0; border-top:1px solid var(--mall-border); border-bottom:1px solid var(--mall-border); }
.mall-pd-price { font-family: var(--mall-font-serif); font-size:34px; font-weight:700; color: var(--mall-cta); }
.mall-pd-strike { font-size:15px; color: var(--mall-price-strike); text-decoration:line-through; }
.mall-pd-disc { background: var(--mall-cta); color:#fff; font-size:12px; font-weight:600; padding:3px 8px; border-radius: var(--mall-radius-sm); }
.mall-pd-actions { display:flex; gap:12px; margin:24px 0; }
.mall-pd-ladder { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:20px; margin:24px 0; }
.mall-pd-ladder-t { font-size:14px; font-weight:600; margin-bottom:12px; }
.mall-pd-ladder-row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--mall-border-soft); font-size:14px; }
.mall-pd-ladder-row:last-child { border-bottom:none; }
.mall-pd-ladder-p { font-weight:600; color: var(--mall-cta); font-family: var(--mall-font-serif); }
.mall-pd-links { display:flex; gap:16px; flex-wrap:wrap; }
.mall-pd-ec { color: var(--mall-primary); font-weight:600; text-decoration:none; transition: color var(--mall-transition); }
.mall-pd-ec:hover { color: var(--mall-cta); }
.mall-pd-ec .mall-pd-st { color: var(--mall-ink-soft); font-weight:400; font-size:11px; }
.mall-pd-nolink { color: var(--mall-ink-soft); font-size:13px; }
/* 详情参数段（产品参数 k-v + 主要卖点 + 69码） */
.mall-pd-detail { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:24px; margin:24px 0; }
.mall-pd-detail-title { font-size:18px; font-weight:700; color: var(--mall-primary); margin:0 0 16px; font-family: var(--mall-font-serif); }
.mall-pd-detail-title i { color: var(--mall-gold); margin-right:6px; }
.mall-pd-detail-sec { margin-bottom:20px; }
.mall-pd-detail-sec:last-child { margin-bottom:0; }
.mall-pd-detail-h { font-size:13px; font-weight:600; color: var(--mall-gold); letter-spacing:.05em; margin-bottom:10px; padding-bottom:6px; border-bottom:1px solid var(--mall-border-soft); }
.mall-pd-params-grid { display:grid; grid-template-columns: 140px 1fr; gap:6px 16px; }
.mall-pd-param-k { font-size:13px; color: var(--mall-ink-soft); }
.mall-pd-param-v { font-size:13px; color: var(--mall-ink); word-break:break-all; }
.mall-pd-param-full { grid-column: 1 / -1; }
.mall-pd-points { list-style:none; padding:0; margin:0; }
.mall-pd-points li { font-size:13px; color: var(--mall-ink); padding:5px 0 5px 16px; position:relative; line-height:1.6; }
.mall-pd-points li::before { content:""; position:absolute; left:2px; top:13px; width:5px; height:5px; border-radius:50%; background: var(--mall-gold); }
.mall-pd-detail-row { display:flex; gap:16px; padding:10px 0 0; border-top:1px solid var(--mall-border-soft); font-size:13px; }
.mall-pd-params { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:24px; margin-top:24px; }
.mall-pd-params h3 { font-size:18px; margin-bottom:14px; }
.mall-pd-params-row { display:flex; padding:8px 0; border-bottom:1px solid var(--mall-border-soft); font-size:14px; }
.mall-pd-params-k { width:120px; color: var(--mall-ink-soft); flex-shrink:0; }
.mall-pd-related { margin-top:64px; }

/* ---------- 我的方案 PPT ---------- */
.mall-proj-layout { display:grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items:start; }
.mall-proj-head { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:20px 24px; margin-bottom:20px; display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.mall-proj-head input { border:1px solid var(--mall-border); border-radius: var(--mall-radius-sm); padding:8px 12px; font-size:14px; }
.mall-proj-head input.proj-name { font-family: var(--mall-font-serif); font-weight:600; min-width:220px; }
.mall-proj-list { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); }
.mall-proj-item { display:flex; gap:14px; align-items:center; padding:14px 18px; border-bottom:1px solid var(--mall-border-soft); cursor:grab; }
.mall-proj-item:last-child { border-bottom:none; }
.mall-proj-item.dragging { opacity:.5; }
.mall-proj-item-grip { color: var(--mall-border); font-size:18px; min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; cursor:grab; }
.mall-proj-item-thumb { width:56px; height:56px; border-radius: var(--mall-radius-sm); background: var(--mall-bg-alt); overflow:hidden; flex-shrink:0; }
.mall-proj-item-thumb img { width:100%; height:100%; object-fit:cover; }
.mall-proj-item-info { flex:1; min-width:0; }
.mall-proj-item-name { font-size:14px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mall-proj-item-meta { font-size:12px; color: var(--mall-ink-soft); }
.mall-proj-item-price { font-family: var(--mall-font-serif); font-weight:700; color: var(--mall-cta); font-size:15px; }
.mall-proj-qty { width:56px; text-align:center; }
.mall-proj-del { background:none; border:none; color: var(--mall-ink-soft); cursor:pointer; font-size:16px; padding:4px; }
.mall-proj-del:hover { color: var(--mall-cta); }
.mall-proj-empty { padding:60px 24px; text-align:center; color: var(--mall-ink-soft); }
.mall-proj-foot { display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding:16px 4px; }
.mall-proj-total { font-size:16px; }
.mall-proj-total b { font-family: var(--mall-font-serif); color: var(--mall-cta); font-size:22px; }
/* 预览 */
.mall-prev-panel { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:20px; position:sticky; top:90px; }
.mall-prev-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.mall-prev-templates { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.mall-tpl-chip { border:1px solid var(--mall-border); border-radius: var(--mall-radius-pill); padding:6px 14px; font-size:12px; cursor:pointer; color: var(--mall-ink-soft); transition: all var(--mall-transition); }
.mall-tpl-chip[data-on="1"] { background: var(--mall-primary); color:var(--mall-bg); border-color: var(--mall-primary); }
.mall-prev-stage { background: var(--mall-bg-alt); border-radius: var(--mall-radius); padding:24px; min-height:300px; display:flex; align-items:center; justify-content:center; }
.mall-prev-thumbs { display:flex; gap:8px; margin-top:12px; overflow-x:auto; }
.mall-prev-thumb { width:60px; height:38px; border-radius:6px; overflow:hidden; border:2px solid transparent; cursor:pointer; flex-shrink:0; background:var(--mall-bg); position:relative; }
.mall-prev-thumb img { width:100%; height:100%; object-fit:cover; }
.mall-prev-thumb[data-on="1"] { border-color: var(--mall-gold); }
.mall-prev-thumb-cover { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:9px; color:var(--mall-primary); background:var(--mall-bg); text-align:center; }

/* 幻灯片预览画布（16:9，近似 node15 客版版式） */
.slide-canvas {
  width:100%; aspect-ratio:16/9; background: var(--slide-bg,#F8F5EE); color: var(--slide-text,#1A1A1A);
  border:1px solid var(--slide-accent,#C8A24A); border-radius: var(--mall-radius-sm);
  display:grid; grid-template-columns: 55% 45%; position:relative; overflow:hidden; box-shadow: var(--mall-shadow);
}
.slide-canvas .sf-left { padding:18px; display:flex; flex-direction:column; gap:10px; }
.slide-canvas .sf-main { width:100%; flex:1; object-fit:contain; background:#fff; border-radius:6px; }
.slide-canvas .sf-noimg { flex:1; display:flex; align-items:center; justify-content:center; background:#fff; border-radius:6px; color:var(--mall-ink-soft); font-size:12px; }
.slide-canvas .sf-thumbs { display:flex; gap:6px; }
.slide-canvas .sf-thumbs img { width:48px; height:48px; object-fit:cover; border-radius:4px; }
.slide-canvas .sf-right { padding:18px 18px 18px 8px; display:flex; flex-direction:column; gap:4px; overflow:hidden; }
.slide-canvas .sf-brand { font-size:11px; font-weight:700; color: var(--slide-accent,#C8A24A); letter-spacing:.1em; margin-bottom:4px; }
.slide-canvas .sf-row { display:flex; gap:6px; font-size:10px; line-height:1.4; align-items:baseline; }
.slide-canvas .sf-k { color: var(--mall-ink-soft); flex-shrink:0; }
.slide-canvas .sf-v { color: var(--slide-text,#1A1A1A); word-break:break-all; }
.slide-canvas .sf-row-strong .sf-v { font-family: var(--mall-font-serif); font-size:13px; font-weight:700; }
.slide-canvas .sf-watermark { position:absolute; bottom:8px; right:12px; font-size:9px; color: var(--slide-accent,#C8A24A); opacity:.7; }
.slide-canvas .sf-empty { color: var(--mall-ink-soft); font-size:11px; }
/* 封面预览 */
.slide-cover { width:100%; aspect-ratio:16/9; background: var(--slide-primary,#1E3D2F); color:var(--mall-bg); border-radius: var(--mall-radius-sm); display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow: var(--mall-shadow); }
.slide-cover .sc-kicker { color: var(--slide-accent,#C8A24A); font-size:11px; letter-spacing:.2em; }
.slide-cover .sc-title { font-family: var(--mall-font-serif); font-size:24px; font-weight:700; margin:10px 0 6px; }
.slide-cover .sc-meta { font-size:12px; opacity:.8; }
.slide-cover .sc-line { width:48px; height:2px; background: var(--slide-accent,#C8A24A); margin-top:14px; }

/* ---------- 登录 ---------- */
.mall-auth { max-width:420px; margin:64px auto; background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius-lg); padding:40px; }
.mall-auth h1 { font-size:26px; margin:0 0 6px; }
.mall-auth-sub { color: var(--mall-ink-soft); font-size:14px; margin-bottom:28px; }
.mall-field { margin-bottom:18px; }
.mall-field label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.mall-field input { width:100%; border:1px solid var(--mall-border); border-radius: var(--mall-radius-sm); padding:12px 14px; font-size:14px; }
.mall-field input:focus { outline:none; border-color: var(--mall-primary); }
.mall-err { background:#fdecee; color: var(--mall-cta); padding:10px 14px; border-radius: var(--mall-radius-sm); font-size:13px; margin-bottom:16px; }
.mall-auth-hint { margin-top:18px; padding:14px; background: var(--mall-bg-alt); border-radius: var(--mall-radius-sm); font-size:12px; color: var(--mall-ink-soft); }
/* 双 tab 登录 */
.mall-tabs { display:flex; gap:4px; margin:8px 0 20px; border-bottom:1px solid var(--mall-border); }
.mall-tab { padding:10px 14px; font-size:14px; font-weight:600; color: var(--mall-ink-soft); cursor:pointer; border-bottom:2px solid transparent; transition: all var(--mall-transition); }
.mall-tab.mall-tab-on { color: var(--mall-primary); border-bottom-color: var(--mall-gold); }
.mall-tab-pane { margin-top:8px; }
.mall-field-row { display:flex; gap:10px; align-items:center; }
.mall-field-row input { flex:1; }

/* ---------- account ---------- */
.mall-acct-card { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:24px; margin-bottom:20px; }
.mall-acct-card h3 { font-size:18px; margin-bottom:14px; }
.mall-export-item { display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid var(--mall-border-soft); font-size:14px; }
.mall-export-item:last-child { border-bottom:none; }
.mall-admin-tbl { width:100%; border-collapse:collapse; font-size:14px; }
.mall-admin-tbl th { text-align:left; padding:10px 8px; border-bottom:2px solid var(--mall-border); color: var(--mall-ink-soft); font-weight:600; font-size:13px; }
.mall-admin-tbl td { padding:10px 8px; border-bottom:1px solid var(--mall-border-soft); }
.mall-admin-phone { font-family: var(--mall-font-serif); font-weight:600; color: var(--mall-primary); }
.mall-admin-time { color: var(--mall-ink-soft); font-size:13px; }
.mall-admin-link { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color: var(--mall-gold); }
/* dashboard sections */
.mall-admin-section { margin-bottom:40px; }
.mall-admin-h { font-size:18px; font-weight:700; color: var(--mall-primary); margin:0 0 16px; font-family: var(--mall-font-serif); }
.mall-admin-sub-h { font-size:14px; font-weight:600; color: var(--mall-ink); margin:0 0 10px; }
.mall-stat-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; margin-bottom:8px; }
.mall-stat-card { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:20px; text-align:center; }
.mall-stat-n { font-family: var(--mall-font-serif); font-size:32px; font-weight:700; color: var(--mall-gold); line-height:1; }
.mall-stat-l { font-size:13px; color: var(--mall-ink-soft); margin-top:6px; }
.mall-svc-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:16px; }
.mall-svc-card { background:#fff; border:1px solid var(--mall-border); border-radius: var(--mall-radius); padding:20px; display:flex; flex-direction:column; gap:8px; }
.mall-svc-head { display:flex; justify-content:space-between; align-items:center; }
.mall-svc-name { font-family: var(--mall-font-serif); font-size:16px; font-weight:600; color: var(--mall-primary); }
.mall-svc-desc { font-size:13px; color: var(--mall-ink-soft); }
.mall-svc-port { font-size:12px; color: var(--mall-border); font-family: monospace; }
.mall-svc-badge { font-size:11px; font-weight:600; padding:2px 10px; border-radius: var(--mall-radius-pill); }
.mall-svc-on { background: var(--mall-primary); color:var(--mall-bg); }
.mall-svc-off { background: var(--mall-bg-alt); color: var(--mall-ink-soft); }
@media (max-width: 992px) { .mall-stat-grid, .mall-svc-grid { grid-template-columns: repeat(2,1fr); } }
/* admin 侧边栏+工作区布局 */
.mall-admin-layout { display:grid; grid-template-columns: 200px 1fr; gap:24px; align-items:start; }
.mall-admin-sidebar { background:#fff; border:1px solid var(--mall-border); border-radius:var(--mall-radius); padding:12px; position:sticky; top:90px; }
.mall-admin-nav { display:block; padding:10px 14px; font-size:14px; font-weight:500; color:var(--mall-ink-soft); border-radius:8px; cursor:pointer; transition:all var(--mall-transition); margin-bottom:4px; }
.mall-admin-nav:hover { background:var(--mall-bg-alt); color:var(--mall-primary); }
.mall-admin-nav.on { background:var(--mall-primary); color:var(--mall-bg); }
.mall-admin-nav i { margin-right:6px; }
.mall-admin-panel { min-height:400px; }
.mall-admin-breadcrumb { padding:8px 0; font-size:13px; border-bottom:1px solid var(--mall-border-soft); margin-bottom:12px; }
.mall-admin-crumb { color:var(--mall-primary); cursor:pointer; text-decoration:none; }
.mall-admin-crumb:hover { text-decoration:underline; }
.mall-admin-crumb-current { font-size:13px; color:var(--mall-ink-soft); }
.mall-admin-fileitem { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:6px; font-size:13px; color:var(--mall-ink); text-decoration:none; transition:background var(--mall-transition); }
.mall-admin-fileitem:hover { background:var(--mall-bg-alt); }
.mall-admin-fileitem-dir { cursor:pointer; color:var(--mall-primary); font-weight:500; }
.mall-admin-fileitem small { color:var(--mall-ink-soft); margin-left:auto; }
.mall-admin-form { max-width:400px; }
.mall-admin-form .mall-field { margin-bottom:14px; }
.mall-admin-form .mall-field input, .mall-admin-form .mall-field select { width:100%; padding:10px 14px; font-size:14px; border:1px solid var(--mall-border); border-radius:var(--mall-radius-sm); }
.mall-admin-form .mall-field input:focus, .mall-admin-form .mall-field select:focus { border-color:var(--mall-primary); outline:none; }
.mall-admin-sub-head-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.mall-admin-actions { display:flex; gap:6px; }
.mall-tag-blacklist { font-size:11px; font-weight:600; padding:2px 8px; border-radius:var(--mall-radius-pill); background:var(--mall-cta); color:#fff; }
.mall-tag-active { font-size:11px; font-weight:600; padding:2px 8px; border-radius:var(--mall-radius-pill); background:var(--mall-primary); color:var(--mall-bg); }
@media (max-width: 992px) { .mall-admin-layout { grid-template-columns:1fr; } .mall-admin-sidebar { position:static; } .mall-admin-sidebar { display:flex; gap:8px; flex-wrap:wrap; } .mall-admin-nav { display:inline-block; } .mall-admin-tbl { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; } }

/* ---------- toast ---------- */
.mall-toast-wrap { position:fixed; top:88px; right:24px; z-index:2000; display:flex; flex-direction:column; gap:10px; }
.mall-toast { background:#fff; border:1px solid var(--mall-border); border-left:4px solid var(--mall-primary); border-radius: var(--mall-radius-sm); padding:14px 18px; box-shadow: var(--mall-shadow-deep); min-width:260px; font-size:14px; animation: mallToastIn .2s ease; }
.mall-toast.ok { border-left-color: var(--mall-primary); }
.mall-toast.err { border-left-color: var(--mall-cta); }
.mall-toast.gold { border-left-color: var(--mall-gold); }
@keyframes mallToastIn { from { transform: translateX(20px); opacity:0; } to { transform: none; opacity:1; } }

/* ---------- 响应式 ---------- */
@media (max-width: 992px) {
  /* 顶栏：nav/search 移入 drawer，留汉堡按钮；压缩到 56px 省屏 */
  .mall-nav, .mall-search { display:none; }
  .mall-nav-toggle { display:inline-flex; }
  .mall-header-inner { height:56px; gap:10px; padding:0 16px; }
  .mall-logo-text small { display:none; }
  .mall-user { gap:10px; }
  .mall-user-ppt span:not(.mall-badge), .mall-user-name, .mall-user-logout, .mall-user-admin, .mall-btn-login, .mall-btn-ppt { display:none; }
  .mall-price-grid, .mall-brand-wall, .mall-steps, .mall-promise { grid-template-columns: repeat(2,1fr); }
  .mall-grid, .mall-grid-5 { grid-template-columns: repeat(2,1fr); }
  .mall-catalog-layout, .mall-pd-layout, .mall-proj-layout { grid-template-columns: minmax(0,1fr); }
  .mall-filter, .mall-prev-panel { position:static; }
  .mall-filter-mobile-bar { display:flex; justify-content:space-between; align-items:center; padding:10px 12px; margin:-20px -20px 16px; background:var(--mall-bg-alt); border-radius:var(--mall-radius-sm); font-size:14px; font-weight:600; color:var(--mall-primary); }
  .mall-filter-body { display:none; }
  .mall-filter.open .mall-filter-body { display:block; }
  .mall-filter.open .mall-filter-caret { transform:rotate(180deg); }
  .mall-cat-sub { position:static; display:block; box-shadow:none; border:none; padding-left:10px; max-height:none; }   /* 移动端类目树 inline 展开（块2 改为点击展开） */
  .mall-hero h1 { font-size:38px; }
  .mall-mega-inner { grid-template-columns: 1fr; }
}
.mall-loading { display:inline-block; width:16px; height:16px; border:2px solid var(--mall-border); border-top-color: var(--mall-primary); border-radius:50%; animation: mallSpin .7s linear infinite; }
@keyframes mallSpin { to { transform: rotate(360deg); } }
.mall-spin-btn .mall-loading { width:14px; height:14px; border-color: rgba(255,255,255,.4); border-top-color:#fff; vertical-align:middle; }

/* ---------- 块4：登录框 + 详情参数网格 小屏(<576) ---------- */
@media (max-width: 576px) {
  .mall-auth { max-width:100%; margin:32px 16px; padding:28px 20px; }
  .mall-pd-params-grid { grid-template-columns: 1fr; }
  .mall-grid, .mall-grid-5 { grid-template-columns: 1fr; }
  .mall-price-grid, .mall-brand-wall, .mall-steps, .mall-promise { grid-template-columns: 1fr; }
  .mall-stat-grid { grid-template-columns: repeat(2,1fr); }
  .mall-svc-grid { grid-template-columns: 1fr; }
  .mall-hero h1 { font-size:28px; }
  .mall-hero p { font-size:16px; }
  .mall-hero-inner { padding:56px 16px; }
  .mall-section { padding:64px 0; }
  .mall-section-deep { padding:80px 0; }
  .mall-section-head { margin-bottom:32px; }
  .mall-container { padding:0 16px; }
  .mall-h2 { font-size:26px; }
  .mall-h2-md { font-size:24px; }
}
