/* ===== 桌面背景 ===== */* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", -apple-system, sans-serif;
  background: #2b2b3a;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}
.desktop { padding: 20px; }

/* ===== 手机壳 ===== */
.phone {
  width: 390px;
  height: 780px;
  background: #f5f5f5;
  border-radius: 40px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5), inset 0 0 0 2px #1c1c28;
  position: relative;
  display: flex;
  flex-direction: column;
}

/* 状态栏 */
.status-bar {
  height: 34px;
  background: #1a1a2e;
  color: #fff;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 18px;
  flex-shrink: 0;
}

/* 内容区 */
.app {
  flex: 1;
  overflow-y: auto;
  background: #f5f5f5;
  position: relative;
}
.app::-webkit-scrollbar { width: 0; }

/* ===== 底部导航 ===== */
.tabbar {
  height: 60px;
  background: #fff;
  display: flex;
  flex-shrink: 0;
  border-top: 1px solid #eee;
}
.tab-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #999;
}
.tab-item.active { color: #e63946; }
.tab-icon { font-size: 20px; margin-bottom: 2px; height: 24px; display: flex; align-items: center; justify-content: center; }
.tab-icon svg { width: 23px; height: 23px; display: block; }
.tab-text { font-size: 10px; }

/* ===== 通用 ===== */
.page { min-height: 100%; padding-bottom: 20px; }
.card { background: #fff; border-radius: 12px; margin: 10px 12px; padding: 14px; }
.section-title { font-size: 15px; font-weight: 700; color: #1a1a2e; margin-bottom: 10px; }
.section-tip { font-size: 11px; color: #bbb; }

/* 搜索栏 */
.search-bar { background: #1a1a2e; padding: 10px 14px; position: sticky; top: 0; z-index: 10; }
.home-brand-bar { display: flex; align-items: baseline; gap: 8px; margin: 2px 4px 10px; }
.home-brand-logo-img { height: 32px; width: auto; display: block; }
.home-brand-sub { font-size: 9px; color: rgba(255,255,255,0.65); }
.search-input {
  background: #fff; border-radius: 20px; height: 34px;
  display: flex; align-items: center; padding: 0 14px; cursor: pointer;
}
.search-input .s-icon { font-size: 13px; margin-right: 8px; }
.search-input .s-ph { font-size: 12px; color: #bbb; }

/* 轮播 */
.banner-swiper { position: relative; margin: 10px 12px; border-radius: 12px; overflow: hidden; height: 140px; }
.banner-track { display: flex; transition: transform .4s ease; height: 100%; }
.banner-slide { min-width: 100%; position: relative; height: 100%; }
.banner-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.banner-title {
  position: absolute; bottom: 10px; left: 14px; color: #fff; font-size: 14px; font-weight: 600;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5); z-index: 2;
}
.banner-title.has-sub { bottom: 26px; }
.banner-sub {
  position: absolute; bottom: 8px; left: 14px; color: rgba(255,255,255,0.85); font-size: 10px;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5); z-index: 2;
}
.banner-play-badge {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 42px; height: 42px; border-radius: 50%; background: rgba(0,0,0,0.45);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 15px; border: 2px solid rgba(255,255,255,0.85); z-index: 2; cursor: pointer;
}
.banner-dots { position: absolute; bottom: 8px; right: 14px; display: flex; gap: 5px; }
.banner-dots span { width: 6px; height: 6px; border-radius: 3px; background: rgba(255,255,255,0.5); }
.banner-dots span.on { background: #fff; width: 14px; }

/* 分类宫格 */
.cat-grid { display: flex; flex-wrap: wrap; }
.cat-item { width: 25%; display: flex; flex-direction: column; align-items: center; margin-bottom: 10px; cursor: pointer; }
.cat-icon { width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg,#f8f9fa,#e9ecef); display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 6px; }
.cat-icon img { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; }
.cat-name { font-size: 11px; color: #333; }

/* 预约横幅 */
.appt-banner {
  margin: 10px 12px; background: linear-gradient(135deg,#1a1a2e,#16213e);
  border-radius: 12px; padding: 16px; display: flex; justify-content: space-between; align-items: center; cursor: pointer;
}
.appt-left { display: flex; flex-direction: column; }
.appt-title { color: #fff; font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.appt-desc { color: rgba(255,255,255,0.6); font-size: 10px; }
.appt-btn { background: linear-gradient(135deg,#e63946,#d62828); color: #fff; border-radius: 16px; padding: 8px 14px; font-size: 11px; white-space: nowrap; }

/* 商品网格 */
.grid { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 0 12px; }
.grid-item { width: 48.5%; margin-bottom: 10px; }
.prod-card { background: #fff; border-radius: 12px; overflow: hidden; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,0.05); }
.prod-card .p-img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; display: block; background: #fff; height: auto; }
.prod-card .p-info { padding: 10px; }
.prod-card .p-name { font-size: 12px; color: #333; line-height: 1.4; height: 34px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.prod-card .p-price-row { display: flex; align-items: baseline; margin-top: 6px; }
.prod-card .p-tier-tag { font-size: 10px; color: #8a6412; background: #faf0d8; border: 1px solid #ecd9a8; border-radius: 6px; padding: 1px 5px; margin-right: 5px; }
.prod-card .p-sale-tag { font-size: 10px; color: #fff; background: #e63946; border-radius: 6px; padding: 1px 6px; margin-right: 5px; font-weight: 700; }
.prod-card .p-price { color: #e63946; font-size: 15px; font-weight: 700; }
.prod-card .p-price em { font-style: normal; font-size: 10px; margin-right: 1px; }
.prod-card .p-op { color: #bbb; font-size: 10px; text-decoration: line-through; margin-left: 6px; }
.prod-card .p-sales { color: #bbb; font-size: 10px; margin-top: 3px; }
.prod-card .p-tag { position: relative; }
.prod-card .p-tag .tag-badge { position: absolute; top: 6px; left: 6px; background: linear-gradient(135deg,#e63946,#d62828); color: #fff; font-size: 9px; padding: 2px 8px; border-radius: 8px; }
.prod-card .prod-actions { display: flex; gap: 6px; margin-top: 8px; }
.prod-card .pa-cart, .prod-card .pa-buy { flex: 1; text-align: center; font-size: 11px; padding: 6px 0; border-radius: 14px; cursor: pointer; user-select: none; }
.prod-card .pa-cart { background: #fdeaea; color: #e63946; border: 1px solid #f3c1c1; }
.prod-card .pa-buy { background: linear-gradient(135deg,#e63946,#d62828); color: #fff; }

/* 案例卡片 */
.case-card { display: flex; background: #fff; border-radius: 12px; overflow: hidden; margin: 0 12px 10px; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,0.05); }
.case-card img { width: 130px; height: 96px; object-fit: cover; flex-shrink: 0; }
.case-info { padding: 10px; flex: 1; min-width: 0; }
.case-title { font-size: 13px; font-weight: 600; color: #1a1a2e; margin-bottom: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.case-meta { display: flex; gap: 8px; font-size: 10px; color: #999; margin-bottom: 5px; }
.case-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.case-tags span { font-size: 9px; color: #e63946; background: rgba(230,57,70,0.08); padding: 2px 8px; border-radius: 8px; }

/* 入口行 */
.entry-row {
  margin: 10px 12px; background: #fff; border-radius: 12px; padding: 14px;
  display: flex; justify-content: space-between; align-items: center; cursor: pointer;
}
.entry-left { display: flex; align-items: center; }
.entry-icon { font-size: 22px; margin-right: 10px; }
.entry-info { display: flex; flex-direction: column; }
.entry-title { font-size: 13px; font-weight: 600; color: #1a1a2e; }
.entry-desc { font-size: 10px; color: #bbb; margin-top: 2px; }
.entry-arrow { color: #ccc; font-size: 18px; }

/* 列表页顶部 */
.list-head { padding: 10px 14px 4px; display: flex; gap: 8px; overflow-x: auto; }
.list-head::-webkit-scrollbar { display: none; }
.chip { font-size: 11px; color: #666; background: #fff; border-radius: 14px; padding: 6px 12px; white-space: nowrap; cursor: pointer; border: 1px solid #eee; }
.chip.on { color: #e63946; border-color: #e63946; background: rgba(230,57,70,0.05); }

/* 详情页 */
.detail-swiper { height: 220px; background: #fff; }
.detail-swiper .banner-slide { display: flex; align-items: center; }
.detail-swiper img { width: 100%; height: 100%; object-fit: contain; }
.detail-info .d-price-row { display: flex; align-items: baseline; }
.detail-info .d-tier-tag { font-size: 11px; color: #8a6412; background: #faf0d8; border: 1px solid #ecd9a8; border-radius: 6px; padding: 2px 8px; margin-right: 6px; font-weight: 700; }
.detail-info .d-sale-tag { font-size: 11px; color: #fff; background: #e63946; border-radius: 6px; padding: 2px 8px; margin-right: 6px; font-weight: 700; }
.detail-info .d-tier-note { font-size: 11px; color: #8a6412; background: #faf6ea; border: 1px dashed #e5d3a3; border-radius: 8px; padding: 6px 10px; margin-top: 8px; }
.detail-info .d-price { color: #e63946; font-size: 22px; font-weight: 700; }
.detail-info .d-op { color: #bbb; font-size: 12px; text-decoration: line-through; margin-left: 8px; }
.detail-info .d-name { font-size: 15px; color: #333; margin-top: 8px; line-height: 1.5; }
.detail-info .d-meta { font-size: 10px; color: #999; margin-top: 6px; }
.detail-info .d-tags { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.detail-info .d-tags span { font-size: 10px; color: #e63946; background: rgba(230,57,70,0.08); padding: 3px 10px; border-radius: 10px; }
.detail-desc { font-size: 13px; color: #555; line-height: 1.8; white-space: pre-wrap; }
.detail-spec { margin-top: 10px; }
.detail-spec .spec-row { display: flex; align-items: center; margin-bottom: 10px; }
.detail-spec .spec-name { width: 60px; font-size: 12px; color: #666; flex-shrink: 0; }
.spec-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.spec-opt { font-size: 11px; color: #666; border: 1px solid #ddd; border-radius: 14px; padding: 5px 12px; cursor: pointer; }
.spec-opt.on { color: #e63946; border-color: #e63946; background: rgba(230,57,70,0.05); }

/* 底部操作条 */
.action-bar {
  position: sticky; bottom: 0; background: #fff; display: flex; align-items: center;
  padding: 10px 14px; border-top: 1px solid #eee; gap: 10px;
}
.action-bar .a-btn { flex: 1; text-align: center; border-radius: 22px; padding: 11px 0; font-size: 14px; cursor: pointer; }
.a-cart { background: linear-gradient(135deg,#1a1a2e,#16213e); color: #fff; }
.a-buy { background: linear-gradient(135deg,#e63946,#d62828); color: #fff; }
.a-call { flex: none !important; display: flex; flex-direction: column; align-items: center; font-size: 10px; color: #666; padding: 0 8px !important; }

/* 步骤 */
.steps { display: flex; }
.step { flex: 1; display: flex; flex-direction: column; align-items: center; position: relative; }
.step:not(:last-child)::after { content: ''; position: absolute; top: 22px; right: -10px; width: 20px; height: 3px; background: #e9ecef; }
.step .st-icon { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg,#f8f9fa,#e9ecef); display: flex; align-items: center; justify-content: center; font-size: 16px; margin-bottom: 6px; }
.step .st-title { font-size: 11px; font-weight: 600; color: #333; }
.step .st-desc { font-size: 9px; color: #999; text-align: center; margin-top: 2px; line-height: 1.4; white-space: pre-line; }

/* 类型宫格 */
.type-grid { display: flex; flex-wrap: wrap; }
.type-item { width: 20%; display: flex; flex-direction: column; align-items: center; margin-bottom: 8px; cursor: pointer; }
.type-item .t-icon { width: 38px; height: 38px; border-radius: 10px; background: linear-gradient(135deg,#f8f9fa,#e9ecef); display: flex; align-items: center; justify-content: center; font-size: 17px; margin-bottom: 5px; }
.type-item .t-name { font-size: 10px; color: #333; }

/* 文章 */
.article-card { display: flex; background: #fff; border-radius: 12px; margin: 10px 12px; overflow: hidden; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,0.05); }
.article-card img { width: 110px; height: 84px; object-fit: cover; flex-shrink: 0; }
.article-info { padding: 10px; flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; }
.article-title { font-size: 13px; font-weight: 600; color: #1a1a2e; line-height: 1.4; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.article-sum { font-size: 10px; color: #999; margin-top: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.article-meta { font-size: 10px; color: #bbb; margin-top: 6px; }

.article-detail { padding: 16px; }
.article-detail h1 { font-size: 18px; color: #1a1a2e; line-height: 1.5; margin-bottom: 8px; }
.article-detail .ad-meta { font-size: 11px; color: #bbb; margin-bottom: 12px; }
.article-detail img.ad-cover { width: 100%; border-radius: 10px; margin-bottom: 14px; }
.article-detail .ad-content { font-size: 14px; color: #444; line-height: 1.9; white-space: pre-wrap; }

/* 表单 */
.form-card { padding: 16px; }
.form-row { display: flex; align-items: center; margin-bottom: 12px; }
.form-row label { width: 68px; font-size: 13px; color: #666; flex-shrink: 0; }
.form-row input, .form-row select, .form-row textarea {
  flex: 1; border: 1px solid #e5e5e5; border-radius: 8px; padding: 10px; font-size: 13px; outline: none; min-width: 0;
}
.code-wrap { flex: 1; display: flex; align-items: center; gap: 8px; min-width: 0; }
.code-wrap input { flex: 1; min-width: 0; }
.code-btn { flex-shrink: 0; background: #e63946; color: #fff; font-size: 12px; border: none; border-radius: 6px; padding: 9px 10px; cursor: pointer; white-space: nowrap; }
.code-btn:disabled { opacity: .55; }
.form-row textarea { min-height: 70px; resize: none; }
.submit-btn { background: linear-gradient(135deg,#e63946,#d62828); color: #fff; text-align: center; border-radius: 24px; padding: 13px 0; font-size: 15px; cursor: pointer; margin-top: 6px; }

/* 我的 */
.profile-head { background: linear-gradient(135deg,#1a1a2e,#16213e); padding: 28px 20px 40px; color: #fff; }
.profile-name { font-size: 18px; font-weight: 700; }
.profile-sub { font-size: 11px; opacity: .6; margin-top: 4px; }
.menu-list { margin-top: -20px; }
.menu-item { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; }
.menu-item + .menu-item { border-top: 1px solid #f5f5f5; }
.menu-left { display: flex; align-items: center; font-size: 14px; color: #333; }
.menu-left .m-icon { font-size: 18px; margin-right: 12px; display: inline-flex; align-items: center; justify-content: center; width: 22px; color: #6b6b78; vertical-align: middle; }
.menu-left .m-icon svg { width: 21px; height: 21px; display: block; }
.menu-arrow { color: #ccc; font-size: 16px; }

/* 空态 */
.empty { text-align: center; color: #bbb; padding: 60px 0; font-size: 13px; }

/* 消息提示 */
.toast {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  background: rgba(0,0,0,0.75); color: #fff; padding: 10px 18px; border-radius: 8px;
  font-size: 13px; z-index: 99; display: none;
}

/* 返回按钮（非首页） */
.back-btn { position: sticky; top: 0; z-index: 20; background: #fff; height: 40px; display: flex; align-items: center; padding: 0 12px; border-bottom: 1px solid #f0f0f0; cursor: pointer; font-size: 14px; }
.back-btn .b-icon { margin-right: 6px; }

/* 与您分享 */
.section-header { display: flex; justify-content: space-between; align-items: center; margin: 6px 14px 8px; }
.section-header .section-title { font-size: 14px; font-weight: 600; color: #1a1a2e; }
.section-more { font-size: 11px; color: #999; cursor: pointer; }
.share-list { margin: 0 12px 10px; }
.share-item {
  display: flex; align-items: center; background: #fff; border-radius: 10px;
  padding: 11px 12px; margin-bottom: 8px; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,0.05);
}
.share-dot { font-size: 15px; margin-right: 8px; flex-shrink: 0; }
.share-title { flex: 1; font-size: 12px; color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.share-arrow { color: #bbb; font-size: 14px; margin-left: 6px; }
.kb-more {
  text-align: center; color: #d62828; font-size: 12px; padding: 12px 0 4px; cursor: pointer;
}

/* 案例详情（还原设计：大图 + 上浮信息卡） */
.case-hero-wrap { position: relative; }
.case-hero-img { width: 100%; height: auto; display: block; }
.case-sheet {
  position: relative; z-index: 3; margin: -22px 0 0; background: #fff;
  border-radius: 18px 18px 0 0; padding: 18px 16px 20px;
}
.cs-title-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
.cs-title { font-size: 17px; font-weight: 700; color: #1a1a2e; line-height: 1.35; flex: 1; }
.cs-price { color: #e63946; font-size: 17px; font-weight: 800; white-space: nowrap; }
.cs-info-grid { display: flex; flex-wrap: wrap; background: #f8f9fa; border-radius: 10px; padding: 12px 10px 4px; margin-bottom: 12px; }
.cs-info-item { width: 50%; display: flex; align-items: center; margin-bottom: 8px; }
.cs-info-label { font-size: 11px; color: #999; margin-right: 8px; flex-shrink: 0; }
.cs-info-value { font-size: 12px; color: #333; font-weight: 500; }
.cs-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.cs-tag { font-size: 10px; color: #e63946; background: rgba(230,57,70,0.08); padding: 3px 10px; border-radius: 10px; }
.cs-section-title { font-size: 14px; font-weight: 700; color: #1a1a2e; margin-bottom: 8px; }
.cs-desc { font-size: 13px; color: #555; line-height: 1.8; white-space: pre-wrap; }

/* 选材预约中心 */
.config-hero { position: relative; height: 170px; }
.config-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.config-hero-mask { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.55)); }
.config-hero-text { position: absolute; left: 16px; bottom: 16px; }
.ch-title { color: #fff; font-size: 19px; font-weight: 700; }
.ch-sub { color: rgba(255,255,255,0.85); font-size: 11px; margin-top: 4px; }
.config-list { margin: 0 12px; }
.config-item { display: flex; align-items: center; padding: 13px 4px; border-bottom: 1px solid #f2f2f2; cursor: pointer; }
.config-item:last-child { border-bottom: none; }
.ci-icon { font-size: 20px; margin-right: 10px; }
.ci-name { font-size: 13px; font-weight: 600; color: #1a1a2e; width: 60px; }
.ci-desc { flex: 1; font-size: 11px; color: #999; }
.ci-arrow { color: #ccc; font-size: 15px; }
.cc-stat { text-align: center; flex: 1; cursor: pointer; }
.cc-num { font-size: 17px; font-weight: 700; color: #1a1a2e; }
.cc-label { font-size: 11px; color: #666; margin-top: 2px; }
.cc-arrow { font-size: 9px; color: #aaa; margin-top: 3px; }

/* 选材配置 */
.cfg-title { padding: 14px 16px 2px; font-size: 17px; font-weight: 700; color: #1a1a2e; }
.cfg-group { margin: 10px 12px; background: #fff; border-radius: 12px; padding: 14px; box-shadow: 0 1px 6px rgba(0,0,0,0.05); }
.cfg-group-name { font-size: 14px; font-weight: 700; color: #1a1a2e; }
.cfg-group-desc { font-size: 10px; color: #999; margin: 3px 0 10px; }
.cfg-row { margin-bottom: 12px; }
.cfg-row:last-child { margin-bottom: 0; }
.cfg-label { font-size: 12px; color: #666; margin-bottom: 7px; }
.cfg-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.cfg-opt {
  display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #333;
  border: 1px solid #e5e5e5; border-radius: 16px; padding: 6px 12px; cursor: pointer; background: #fff;
}
.cfg-opt em { font-style: normal; font-size: 10px; color: #e63946; }
.cfg-opt.on { border-color: #e63946; color: #e63946; background: #fff5f5; font-weight: 600; }
.cfg-bottom-bar {
  position: sticky; bottom: 0; background: #fff; border-top: 1px solid #f0f0f0;
  padding: 10px 14px; display: flex; align-items: center; gap: 10px;
}
.cfg-total { flex: 1; display: flex; align-items: baseline; }
.ct-label { font-size: 11px; color: #666; }
.ct-price { font-size: 19px; font-weight: 800; color: #e63946; margin: 0 3px; }
.ct-unit { font-size: 10px; color: #999; }
.cfg-chosen { font-size: 10px; color: #999; white-space: nowrap; }
.cfg-submit { background: linear-gradient(135deg,#e63946,#d62828); color: #fff; font-size: 12px; border-radius: 18px; padding: 9px 16px; cursor: pointer; white-space: nowrap; }

/* 定制订单详情 */
.order-head { display: flex; gap: 12px; margin: 12px; padding: 16px; background: linear-gradient(135deg,#1a1a2e,#16213e); border-radius: 12px; }
.oh-icon { font-size: 30px; }
.oh-main { flex: 1; }
.oh-title { color: #fff; font-size: 15px; font-weight: 700; }
.oh-desc { color: rgba(255,255,255,0.7); font-size: 11px; margin: 4px 0 10px; }
.oh-progress { height: 6px; background: rgba(255,255,255,0.2); border-radius: 3px; overflow: hidden; }
.oh-bar { height: 100%; background: linear-gradient(90deg,#e63946,#ff7a59); border-radius: 3px; }
.oh-pct { color: rgba(255,255,255,0.75); font-size: 10px; margin-top: 6px; }
.order-info { padding: 0 12px; }
.oi-row { display: flex; padding: 8px 0; border-bottom: 1px dashed #f0f0f0; font-size: 12px; }
.oi-row:last-child { border-bottom: none; }
.oi-label { color: #999; width: 72px; flex-shrink: 0; }
.oi-value { color: #333; }
.order-timeline { padding: 4px 12px 4px 0; }
.ot-item { display: flex; gap: 12px; position: relative; padding-bottom: 16px; }
.ot-item::before { content: ''; position: absolute; left: 11px; top: 24px; bottom: 0; width: 2px; background: #eee; }
.ot-item:last-child::before { display: none; }
.ot-dot {
  width: 24px; height: 24px; border-radius: 50%; background: #e8f5e9; color: #2e7d32;
  display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0; z-index: 1;
}
.ot-item.active .ot-dot { background: #e63946; color: #fff; }
.ot-body { flex: 1; }
.ot-title { font-size: 13px; font-weight: 600; color: #1a1a2e; }
.ot-desc { font-size: 11px; color: #777; margin-top: 2px; }
.ot-time { font-size: 10px; color: #bbb; margin-top: 3px; }

/* 设计方案 */
.ds-head { padding: 14px 16px 2px; }
.ds-title { font-size: 17px; font-weight: 700; color: #1a1a2e; margin-right: 8px; }
.ds-sub { font-size: 11px; color: #999; }
.ds-hero { position: relative; height: 210px; margin: 10px 12px 0; border-radius: 14px; overflow: hidden; }
.ds-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ds-hero-mask { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.6)); }
.ds-hero-text { position: absolute; left: 14px; bottom: 14px; }
.ds-name { color: #fff; font-size: 17px; font-weight: 700; }
.ds-desc { color: rgba(255,255,255,0.85); font-size: 11px; margin-top: 4px; }
.ds-tags { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 0 0; }
.team-item { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px solid #f2f2f2; cursor: pointer; }
.team-item:last-child { border-bottom: none; }
.team-avatar { font-size: 28px; margin-right: 12px; }
.team-info { flex: 1; }
.team-name { font-size: 13px; font-weight: 600; color: #1a1a2e; }
.team-role { font-size: 11px; color: #999; margin-top: 2px; }
.team-call { font-size: 18px; }

/* 展厅实拍 */
.showroom-entry {
  display: flex; align-items: center; margin: 10px 12px; background: linear-gradient(135deg,#1a1a2e,#16213e);
  border-radius: 10px; padding: 12px 14px; cursor: pointer;
}
.se-left { flex: 1; display: flex; flex-direction: column; }
.se-title { color: #fff; font-size: 13px; font-weight: 600; }
.se-desc { color: rgba(255,255,255,0.6); font-size: 10px; margin-top: 3px; }
.se-arrow { color: rgba(255,255,255,0.7); font-size: 15px; }
.showroom-video { position: relative; height: 170px; border-radius: 12px; overflow: hidden; cursor: pointer; }
.showroom-video img { width: 100%; height: 100%; object-fit: cover; display: block; }
.showroom-video .banner-play-badge { width: 46px; height: 46px; font-size: 17px; }
.sv-text { position: absolute; left: 12px; bottom: 10px; }
.sv-title { color: #fff; font-size: 13px; font-weight: 600; text-shadow: 0 1px 4px rgba(0,0,0,0.5); }
.sv-sub { color: rgba(255,255,255,0.85); font-size: 10px; margin-top: 2px; text-shadow: 0 1px 4px rgba(0,0,0,0.5); }
.photo-grid { display: flex; flex-wrap: wrap; justify-content: space-between; }
.photo-item { width: 48.5%; margin-bottom: 8px; border-radius: 10px; overflow: hidden; }
.photo-item img { width: 100%; height: 110px; object-fit: cover; display: block; }

@media (max-width: 420px) {
  .desktop { padding: 0; }
  .phone { width: 100vw; height: 100vh; border-radius: 0; }
}

/* ===== 案例软文 / 空间 / 材料 ===== */
.cs-section-title { margin-top: 4px; }
.cs-spaces { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 4px 0 14px; }
.cs-space { position: relative; border-radius: 10px; overflow: hidden; }
.cs-space img { width: 100%; height: 130px; object-fit: cover; display: block; }
.cs-space-name { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 8px 6px; font-size: 11px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,0.65)); }
.material-list { margin: 4px 0 10px; background: #fff; border: 1px solid #f0f0f0; border-radius: 10px; overflow: hidden; }

.case-article { font-size: 14px; line-height: 1.9; color: #444; }
.case-article p { margin: 10px 0; }
.case-article .art-h2 {
  font-size: 16px; font-weight: 700; color: #1a1a2e;
  margin: 22px 0 10px; padding-left: 10px; border-left: 4px solid #d62828;
}
.case-article .art-highlight { color: #d62828; font-weight: 600; }
.case-article .art-quote {
  background: #f7f4ec; border-left: 4px solid #d62828; padding: 12px 14px;
  font-size: 13px; color: #555; line-height: 1.8; border-radius: 8px; margin: 12px 0;
}
.case-article .art-img-wrap { margin: 14px 0; }
.case-article .art-img-caption { font-size: 12px; color: #999; text-align: center; margin-top: 6px; }
.photo-item .photo-caption {
  font-size: 12px; color: #888; text-align: center; margin-top: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.material-list { display: flex; flex-direction: column; }
.material-row {
  display: flex; padding: 10px 0; border-bottom: 1px solid #f5f5f5; gap: 12px;
}
.material-row:last-child { border-bottom: none; }
.material-name { width: 84px; font-size: 13px; color: #999; flex-shrink: 0; }
.material-value { flex: 1; font-size: 13px; color: #333; line-height: 1.6; }
/* ===== 购物车 ===== */
.menu-badge { background: #e63946; color: #fff; font-size: 10px; min-width: 16px; height: 16px; line-height: 16px; border-radius: 8px; text-align: center; padding: 0 5px; margin-right: 4px; }
.cart-item { display: flex; gap: 10px; padding: 12px 16px; background: #fff; border-bottom: 1px solid #f2f2f2; }
.cart-img { width: 68px; height: 68px; border-radius: 8px; object-fit: contain; flex-shrink: 0; background: #fff; }
.cart-info { flex: 1; min-width: 0; }
.cart-name { font-size: 13px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cart-price { color: #e63946; font-weight: 700; font-size: 14px; margin: 4px 0; }
.cart-ops { display: flex; align-items: center; gap: 8px; }
.cq-btn { width: 22px; height: 22px; line-height: 20px; text-align: center; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; color: #333; cursor: pointer; user-select: none; }
.cq-num { min-width: 22px; text-align: center; font-size: 13px; }
.cart-del { font-size: 11px; color: #999; margin-left: auto; cursor: pointer; }
.cart-bar { position: fixed; left: 0; right: 0; bottom: 52px; background: #fff; border-top: 1px solid #eee; padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; }
.cb-total { font-size: 13px; color: #333; }
.cb-total b { color: #e63946; font-size: 17px; }
.cb-btn { background: linear-gradient(135deg,#1a1a2e,#16213e); color: #fff; border-radius: 18px; padding: 9px 22px; font-size: 13px; cursor: pointer; }
/* ===== 我的（按参考图改造） ===== */
.profile-head { background: linear-gradient(160deg,#1a1a2e 0%,#2b2440 60%,#3a2f52 100%); padding: 30px 16px 22px; }
.ph-top { display: flex; align-items: center; gap: 12px; }
.ph-avatar { width: 52px; height: 52px; border-radius: 50%; background: #4a4270; display: flex; align-items: center; justify-content: center; font-size: 26px; color: #fff; flex-shrink: 0; }
.ph-avatar svg { width: 28px; height: 28px; display: block; }
.ph-info { flex: 1; min-width: 0; }
.ph-name { color: #fff; font-size: 17px; font-weight: 700; }
.ph-welcome { color: rgba(255,255,255,0.75); font-size: 11px; margin-top: 4px; }
.ph-set { color: rgba(255,255,255,0.8); font-size: 18px; cursor: pointer; }
.order-card { margin-top: -14px; }
.oc-head { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px 6px; }
.oc-title { font-size: 15px; font-weight: 700; color: #1a1a2e; }
.oc-all { font-size: 11px; color: #999; cursor: pointer; }
.oc-grid { display: flex; padding: 6px 4px 12px; }
.oc-item { flex: 1; text-align: center; position: relative; padding: 6px 0; cursor: pointer; }
.oc-icon { display: flex; align-items: center; justify-content: center; height: 26px; color: #1a1a2e; }
.oc-icon svg { width: 24px; height: 24px; display: block; }
.oc-name { display: block; font-size: 11px; color: #333; margin-top: 4px; }
.oc-badge { position: absolute; top: 0; right: 22%; min-width: 16px; height: 16px; line-height: 16px; background: #e63946; color: #fff; border-radius: 8px; font-size: 10px; padding: 0 4px; }
.profile-foot { text-align: center; padding: 16px 0 22px; }
.pf-hotline { display: flex; justify-content: center; gap: 8px; font-size: 12px; color: #333; margin-bottom: 10px; }
.pf-hl-label { color: #999; }
.pf-hl-num { color: #1a1a2e; font-weight: 700; cursor: pointer; }
.pf-brand { font-size: 22px; font-weight: 800; letter-spacing: 4px; color: #1a1a2e; }
.pf-slogan { font-size: 10px; color: #999; margin-top: 4px; }
/* ===== 关于我们 ===== */
.about-hero { position: relative; height: 128px; overflow: hidden; }
.ab-name { color: #fff; font-size: 19px; font-weight: 700; margin-bottom: 6px; }
.ab-desc { color: rgba(255,255,255,0.85); font-size: 11px; }
.ab-p { font-size: 13px; color: #444; line-height: 1.75; margin-bottom: 10px; }
.ab-biz { display: flex; gap: 10px; padding: 11px 0; border-bottom: 1px solid #f5f5f5; }
.ab-biz:last-child { border-bottom: none; }
.ab-biz-icon { width: 38px; height: 38px; border-radius: 10px; background: #f3f1fa; display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0; }
.ab-biz-info { flex: 1; min-width: 0; }
.ab-biz-title { font-size: 14px; font-weight: 700; color: #1a1a2e; }
.ab-biz-desc { font-size: 11px; color: #777; margin-top: 4px; line-height: 1.6; }
.ab-stats { display: flex; padding: 8px 0 4px; }
.ab-stat { flex: 1; text-align: center; }
.ab-stat-num { font-size: 18px; font-weight: 800; color: #1a1a2e; }
.ab-stat-label { font-size: 10px; color: #999; margin-top: 3px; }
.ab-adv-grid { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 0; }
.ab-adv { width: calc(33.333% - 6px); background: #faf9fc; border-radius: 10px; padding: 10px 6px; text-align: center; }
.ab-adv-icon { font-size: 18px; }
.ab-adv-title { font-size: 11px; font-weight: 700; color: #333; margin-top: 4px; }
.ab-adv-desc { font-size: 9px; color: #999; margin-top: 2px; }
.ab-contact { display: flex; gap: 10px; padding: 11px 0; border-bottom: 1px solid #f5f5f5; align-items: center; cursor: pointer; }
.ab-contact:last-child { border-bottom: none; }
.ab-c-icon { font-size: 17px; }
.ab-c-label { font-size: 10px; color: #999; }
.ab-c-value { font-size: 13px; color: #333; margin-top: 2px; }
/* ===== 核心专利 ===== */
.ab-pat { padding: 4px 0; }
.ab-pat-item { display: flex; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid #f5f5f5; }
.ab-pat-item:last-child { border-bottom: none; }
.ab-pat-tag { flex-shrink: 0; font-size: 10px; color: #fff; background: linear-gradient(135deg,#c9a227,#e8c35a); border-radius: 4px; padding: 2px 7px; }
.ab-pat-info { flex: 1; min-width: 0; }
.ab-pat-name { font-size: 13px; font-weight: 600; color: #1a1a2e; }
.ab-pat-no { font-size: 10px; color: #999; margin-top: 3px; }
/* 文章内配图 */
.art-img { margin: 12px 0; }
.art-img img { width: 100%; border-radius: 10px; display: block; }
.art-img-cap { font-size: 12px; color: #999; text-align: center; margin-top: 6px; }
.ad-content p { line-height: 1.8; font-size: 14px; color: #444; margin: 8px 0; }
/* 与您分享：案例层叠卡片组 */
.case-stack { position: relative; padding: 0 12px 6px; }
.stack-item { position: relative; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 3px 10px rgba(0,0,0,.08); margin-bottom: -44px; }
.stack-item:last-child { margin-bottom: 0; }
.stack-item .case-card { border: none; padding: 0; background: transparent; box-shadow: none; }
.stack-item:nth-child(1) { z-index: 7; }
.stack-item:nth-child(2) { z-index: 6; }
.stack-item:nth-child(3) { z-index: 5; }
.stack-item:nth-child(4) { z-index: 4; }
.stack-item:nth-child(5) { z-index: 3; }
.stack-item:nth-child(6) { z-index: 2; }
.stack-item:nth-child(7) { z-index: 1; }

/* ===== 软件系统 ===== */
.sw-card { background: #fff; border-radius: 14px; padding: 16px; margin-bottom: 12px; box-shadow: 0 2px 10px rgba(0,0,0,.04); }
.sw-head { display: flex; align-items: center; margin-bottom: 10px; }
.sw-icon { width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg,#1a1a2e,#3a3a5e); color: #fff; font-size: 22px; display: flex; align-items: center; justify-content: center; margin-right: 12px; }
.sw-title-wrap { flex: 1; }
.sw-name { font-size: 16px; font-weight: 700; color: #1a1a2e; }
.sw-tagline { font-size: 11px; color: #e63946; margin-top: 2px; }
.sw-desc { font-size: 13px; color: #555; line-height: 1.7; margin-bottom: 10px; }
.sw-feats { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.sw-feat { font-size: 11px; color: #1a6fb0; background: #eaf3fb; border-radius: 10px; padding: 3px 10px; }
.sw-target { font-size: 12px; color: #888; margin-bottom: 8px; }
.sw-trial-note { font-size: 11px; color: #8a6412; background: #faf0d8; border-radius: 8px; padding: 6px 10px; }
.sw-form-card { padding: 16px; }
.sw-form-card .form-row { display: flex; align-items: center; margin-bottom: 12px; }
.sw-form-card .form-row label { width: 80px; flex-shrink: 0; font-size: 13px; color: #666; }
.sw-form-card .form-row input, .sw-form-card .form-row select, .sw-form-card .form-row textarea { flex: 1; padding: 10px 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; outline: none; }
.sw-form-card .form-row textarea { min-height: 64px; resize: none; }
.sw-submit { width: 100%; padding: 12px; margin-top: 6px; }
.sw-call { text-align: center; font-size: 12px; color: #999; margin-top: 12px; }
.sw-phone { color: #e63946; font-weight: 700; font-size: 14px; cursor: pointer; }

/* ===== 登录 / 身份 ===== */
.lg-card { padding: 18px 16px; }
.lg-cur { font-size: 13px; color: #555; background: #f0f7ff; border-radius: 8px; padding: 8px 12px; margin-bottom: 14px; }
.lg-label { font-size: 13px; color: #666; margin: 14px 0 10px; }
.lg-id-label { font-size: 13px; color: #555; font-weight: 600; margin: 4px 0 10px; }
.lg-ids { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lg-id { position: relative; display: flex; align-items: center; justify-content: center; border: 1.5px solid #e6e6ea; border-radius: 12px; padding: 14px 6px; cursor: pointer; transition: all .15s; background: #fbfbfc; }
.lg-id.on { border-color: #e63946; background: #fff5f5; box-shadow: 0 2px 10px rgba(230,57,70,.12); }
.lg-id-name { font-size: 15px; font-weight: 700; color: #1a1a2e; }
.lg-id.on .lg-id-name { color: #e63946; }
.lg-id-ck { position: absolute; top: 6px; right: 6px; width: 18px; height: 18px; border-radius: 50%; background: #e63946; color: #fff; font-size: 12px; line-height: 18px; text-align: center; opacity: 0; transition: opacity .15s; }
.lg-id.on .lg-id-ck { opacity: 1; }
.lg-submit { width: 100%; margin-top: 16px; }
.lg-logout { width: 100%; margin-top: 10px; color: #999; }

/* ===== 商品详情图 ===== */
.detail-imgs { margin-top: 12px; }
.detail-imgs img { width: 100%; display: block; border-radius: 8px; margin-bottom: 10px; }


/* ===== 全屏图片/视频预览 ===== */
.pv-lightbox{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;background:rgba(0,0,0,.96);display:flex;align-items:center;justify-content:center;}
.pv-lightbox img{max-width:94%;max-height:94%;object-fit:contain;border-radius:4px;cursor:zoom-out;}
.pv-lb-close{position:absolute;top:14px;right:18px;font-size:34px;color:#fff;cursor:pointer;z-index:2;line-height:1;}
.pv-lb-video{max-width:96%;max-height:96%;}
.cs-video-entry{position:relative;border-radius:10px;overflow:hidden;margin-top:10px;cursor:pointer;}
.cs-video-entry img{width:100%;height:auto;display:block;}
.cs-video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;}
.cs-video-label{position:absolute;left:0;right:0;bottom:0;padding:8px 10px;background:linear-gradient(transparent,rgba(0,0,0,.65));color:#fff;font-size:12px;text-align:center;}