/* ============================================================
   宋盟汇 · 交易与分销（宋钱包 / 邀请分销 / 支付方式）
   依赖 base.css 设计令牌，页面级独立样式
   ============================================================ */

/* ---------- 通用页面容器 ---------- */
.cm-page {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 22px 16px 64px;
}
.cm-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 18px;
  margin-top: 18px;
}
.cm-card {
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-sm);
  padding: 20px;
}
.cm-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.cm-card-head h3 {
  margin: 0;
  font-family: var(--f-serif);
  font-size: 18px;
  color: var(--c-ink);
  letter-spacing: 0.02em;
}
.cm-card-head .cm-sub {
  font-size: 12px;
  color: var(--c-gray);
}
.cm-empty {
  padding: 32px 16px;
  text-align: center;
  color: var(--c-gray);
  font-size: 13px;
}

/* ---------- 钱包主视觉 ---------- */
.sw-hero {
  position: relative;
  overflow: hidden;
  border-radius: var(--r-xl);
  background: var(--grad-hero);
  color: #F4EBD6;
  padding: 26px 26px 22px;
  box-shadow: var(--sh-lg);
}
.sw-hero::before {
  content: '';
  position: absolute;
  right: -60px;
  top: -90px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 169, 98, 0.30), rgba(201, 169, 98, 0) 68%);
}
.sw-hero::after {
  content: '宋';
  position: absolute;
  right: 22px;
  bottom: -24px;
  font-family: var(--f-xiaowei);
  font-size: 120px;
  color: rgba(201, 169, 98, 0.14);
  line-height: 1;
}
.sw-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  position: relative;
  z-index: 1;
}
.sw-hero-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--f-serif);
  font-size: 19px;
  letter-spacing: 0.06em;
}
.sw-hero-badge {
  font-size: 11px;
  padding: 3px 9px;
  border-radius: var(--r-full);
  border: 1px solid rgba(201, 169, 98, 0.5);
  color: var(--c-gold-light);
}
.sw-hero-sub {
  position: relative;
  z-index: 1;
  margin: 16px 0 4px;
  font-size: 12px;
  color: rgba(244, 235, 214, 0.66);
  letter-spacing: 0.08em;
}
.sw-balance {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--f-serif);
}
.sw-balance .sym {
  font-size: 20px;
  color: var(--c-gold-light);
}
.sw-balance .num {
  font-size: 42px;
  line-height: 1;
  color: #F7EFD9;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.sw-balance .unit {
  font-size: 12px;
  color: rgba(244, 235, 214, 0.7);
}
.sw-hero-stats {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 28px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(201, 169, 98, 0.24);
  flex-wrap: wrap;
}
.sw-hero-stats div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sw-hero-stats strong {
  font-size: 17px;
  color: #F2E6CC;
}
.sw-hero-stats span {
  font-size: 11px;
  color: rgba(244, 235, 214, 0.6);
  letter-spacing: 0.06em;
}
.sw-rate {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 18px;
  padding: 6px 12px;
  border-radius: var(--r-full);
  background: rgba(201, 169, 98, 0.14);
  border: 1px solid rgba(201, 169, 98, 0.36);
  font-size: 12px;
  color: var(--c-gold-light);
}

/* ---------- 充值面板 ---------- */
.sw-amounts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.sw-amounts button {
  border: 1px solid var(--c-line);
  background: var(--c-cream);
  border-radius: var(--r-md);
  padding: 13px 6px;
  font-family: var(--f-serif);
  font-size: 18px;
  color: var(--c-ink);
  cursor: pointer;
  transition: var(--t-fast);
}
.sw-amounts button small {
  display: block;
  font-size: 11px;
  color: var(--c-gray);
  margin-top: 2px;
  font-family: var(--f-sans);
}
.sw-amounts button.active {
  border-color: var(--c-gold);
  background: var(--c-gold-soft);
  box-shadow: var(--sh-gold);
}
.sw-field {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  padding: 0 12px;
  background: #fff;
  margin-bottom: 12px;
}
.sw-field span {
  color: var(--c-gray);
  font-size: 14px;
}
.sw-field input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  padding: 13px 0;
  font-size: 18px;
  font-family: var(--f-serif);
  color: var(--c-ink);
  background: transparent;
}
.sw-tip {
  font-size: 12px;
  color: var(--c-gray);
  line-height: 1.7;
  margin: 10px 0 0;
}
.sw-qr {
  margin-top: 12px;
  padding: 16px;
  border: 1px dashed var(--c-gold);
  border-radius: var(--r-md);
  background: var(--c-gold-soft);
  text-align: center;
  font-size: 13px;
  color: var(--c-charcoal);
}
.sw-qr code {
  display: block;
  margin-top: 8px;
  font-size: 11px;
  color: var(--c-gray);
  word-break: break-all;
}

/* ---------- 流水 ---------- */
.sw-ledger {
  display: flex;
  flex-direction: column;
}
.sw-entry {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 2px;
  border-bottom: 1px dashed var(--c-line);
}
.sw-entry:last-child { border-bottom: 0; }
.sw-entry-ic {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 13px;
  font-family: var(--f-xiaowei);
  background: var(--c-gold-soft);
  color: var(--c-gold-dark);
  flex: none;
}
.sw-entry-ic.out { background: #F7EEEE; color: var(--c-red); }
.sw-entry-main { flex: 1; min-width: 0; }
.sw-entry-title {
  font-size: 13.5px;
  color: var(--c-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sw-entry-sub {
  margin-top: 3px;
  font-size: 11px;
  color: var(--c-gray);
}
.sw-entry-amt {
  font-family: var(--f-serif);
  font-size: 16px;
  color: var(--c-jade);
  flex: none;
}
.sw-entry-amt.out { color: var(--c-ink); }

/* ---------- 提现 ---------- */
.sw-form .field { margin-bottom: 12px; }
.sw-withdraw-actions {
  display: flex;
  gap: 10px;
  align-items: center;
}
.sw-withdraw-actions .btn { flex: 1; }

/* ---------- 支付弹层补充 ---------- */
.pay-wallet {
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px solid var(--c-gold);
  border-radius: var(--r-md);
  background: linear-gradient(135deg, #FFFDF7, var(--c-gold-soft));
}
.pay-wallet-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  color: var(--c-ink);
  font-family: var(--f-serif);
}
.pay-wallet-h strong {
  color: var(--c-gold-dark);
  font-size: 16px;
}
.pay-wallet-sub {
  margin-top: 4px;
  font-size: 12px;
  color: var(--c-gray);
}
.pay-or {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 0 10px;
  color: var(--c-gray);
  font-size: 12px;
}
.pay-or::before, .pay-or::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--c-line);
}

/* ---------- 分销 ---------- */
.sd-hero {
  position: relative;
  overflow: hidden;
  border-radius: var(--r-xl);
  background: var(--grad-hero);
  color: #F4EBD6;
  padding: 24px 26px;
  box-shadow: var(--sh-lg);
}
.sd-hero::after {
  content: '邀';
  position: absolute;
  right: 18px;
  top: -16px;
  font-family: var(--f-xiaowei);
  font-size: 110px;
  color: rgba(201, 169, 98, 0.13);
  line-height: 1;
}
.sd-hero h2 {
  margin: 0;
  font-family: var(--f-serif);
  font-size: 20px;
  letter-spacing: 0.05em;
  position: relative;
  z-index: 1;
}
.sd-hero p {
  margin: 8px 0 0;
  font-size: 12.5px;
  line-height: 1.8;
  color: rgba(244, 235, 214, 0.72);
  max-width: 640px;
  position: relative;
  z-index: 1;
}
.sd-code-box {
  position: relative;
  z-index: 1;
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.sd-code {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: var(--r-md);
  border: 1px dashed rgba(201, 169, 98, 0.7);
  background: rgba(201, 169, 98, 0.12);
  font-family: var(--f-serif);
  letter-spacing: 0.16em;
  font-size: 18px;
  color: var(--c-gold-light);
}
.sd-code small {
  font-size: 11px;
  letter-spacing: 0.04em;
  color: rgba(244, 235, 214, 0.6);
  font-family: var(--f-sans);
}
.sd-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.sd-stat {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(201, 169, 98, 0.26);
  border-radius: var(--r-md);
  padding: 12px;
  position: relative;
  z-index: 1;
}
.sd-stat strong {
  display: block;
  font-size: 19px;
  color: #F2E6CC;
  font-family: var(--f-serif);
}
.sd-stat span {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  color: rgba(244, 235, 214, 0.62);
}
.sd-tiers {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sd-tier {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-cream);
}
.sd-tier-badge {
  width: 44px;
  height: 44px;
  flex: none;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-family: var(--f-xiaowei);
  font-size: 18px;
  background: var(--grad-gold);
  color: #3B2E16;
  box-shadow: var(--sh-gold);
}
.sd-tier-main { flex: 1; min-width: 0; }
.sd-tier-main strong {
  font-size: 14px;
  color: var(--c-ink);
  font-family: var(--f-serif);
}
.sd-tier-main p {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--c-gray);
}
.sd-tier-rate {
  font-family: var(--f-serif);
  font-size: 22px;
  color: var(--c-gold-dark);
  flex: none;
}
.sd-comm {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 2px;
  border-bottom: 1px dashed var(--c-line);
}
.sd-comm:last-child { border-bottom: 0; }
.sd-comm-main { flex: 1; min-width: 0; }
.sd-comm-main b {
  font-weight: 600;
  font-size: 13px;
  color: var(--c-ink);
}
.sd-comm-main p {
  margin: 3px 0 0;
  font-size: 11px;
  color: var(--c-gray);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sd-comm-amt {
  font-family: var(--f-serif);
  font-size: 16px;
  color: var(--c-gold-dark);
  flex: none;
}
.cm-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--r-full);
  font-size: 11px;
  background: var(--c-gold-soft);
  color: var(--c-gold-dark);
}
.cm-status.ok { background: var(--c-jade-soft); color: var(--c-jade); }
.cm-status.bad { background: #F7EEEE; color: var(--c-red); }
.sd-team-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 2px;
  border-bottom: 1px dashed var(--c-line);
}
.sd-team-row:last-child { border-bottom: 0; }
.sd-team-av {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--c-gold-soft);
  color: var(--c-gold-dark);
  font-family: var(--f-xiaowei);
  flex: none;
}
.sd-team-main { flex: 1; min-width: 0; }
.sd-team-main strong { font-size: 13px; color: var(--c-ink); }
.sd-team-main span { display: block; font-size: 11px; color: var(--c-gray); margin-top: 2px; }

/* ---------- 响应式 ---------- */
@media (max-width: 860px) {
  .cm-grid { grid-template-columns: 1fr; }
  .sd-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .cm-page { padding: 14px 12px 48px; }
  .sw-hero, .sd-hero { padding: 20px 18px; border-radius: var(--r-lg); }
  .sw-balance .num { font-size: 34px; }
  .sw-hero-stats { gap: 18px; }
  .sw-amounts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .sw-amounts button { font-size: 16px; padding: 11px 4px; }
  .cm-card { padding: 16px; }
  .sd-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sd-code { font-size: 15px; padding: 9px 12px; }
}

/* 会员专属服务通道 */
.ms-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.ms-row { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 12px; background: #FBF8F0; border: 1px solid rgba(0, 0, 0, 0.05); }
.ms-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ms-row-main strong { font-size: 0.78rem; color: var(--c-ink, #1B1E23); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ms-row-main small { font-size: 0.66rem; color: var(--c-gray, #8A8478); }
.ms-reply { margin: 4px 0 0; font-size: 0.7rem; line-height: 1.6; color: #1E6B4E; background: #F0F7F2; border-radius: 8px; padding: 6px 8px; }
.ms-status { flex: none; font-size: 0.62rem; padding: 2px 8px; border-radius: 999px; background: #FCF3E3; color: #B0761C; }
.ms-status.done { background: #F0F6F1; color: #1E8A5B; }

/* 宗亲会交流 */
.assoc-talk { padding-bottom: 8px; }
.assoc-post-list { display: flex; flex-direction: column; gap: 10px; }
.assoc-post { padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid rgba(0, 0, 0, 0.06); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03); }
.ap-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.ap-head strong { font-size: 0.8rem; color: #1B1E23; }
.ap-pin { font-size: 0.6rem; color: #8A6E2A; background: #FBF3DE; border-radius: 999px; padding: 1px 7px; }
.ap-time { margin-left: auto; font-size: 0.64rem; color: #9A9585; }
.ap-content { margin: 0; font-size: 0.76rem; line-height: 1.7; color: #4A463D; }
.assoc-talk-form { display: flex; gap: 8px; align-items: flex-end; margin-top: 12px; }
.assoc-talk-form textarea { flex: 1; margin: 0; }
.assoc-talk-form .btn { flex: none; height: 38px; }

/* 企业入驻签约 */
.ent-agree { display: flex; align-items: center; flex-wrap: wrap; gap: 2px; font-size: 0.74rem; color: #5F5950; margin: 4px 0 2px; }
.ent-agree input { width: 16px; height: 16px; margin-right: 4px; }
.ent-agree-link { border: none; background: none; padding: 0; color: #8A6E2A; font-size: 0.74rem; cursor: pointer; text-decoration: underline; }
.ent-terms { font-size: 0.74rem; line-height: 1.8; color: #4A463D; background: #FBF8F0; border-radius: 12px; padding: 12px 14px; max-height: 320px; overflow: auto; }
.ent-terms p { margin: 0 0 8px; }
.ent-contract-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.ent-contract-head strong { font-size: 0.9rem; color: #1B1E23; }
.apg-contract { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed rgba(0, 0, 0, 0.08); font-size: 0.7rem; color: #8A6E2A; }

/* ===== 企业入驻长表单弹窗（桌面双列 / 移动单列） ===== */
.modal-ent {
  max-width: 700px;
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  overflow: hidden;
}
.modal-ent .modal-head { flex: 0 0 auto; background: var(--c-surface, #fff); }
.modal-ent .modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 18px 24px 8px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 18px;
  align-content: start;
}
.modal-ent .modal-foot {
  flex: 0 0 auto;
  align-items: center;
  flex-wrap: wrap;
  background: var(--c-surface, #fff);
}
.modal-ent .modal-foot .btn { flex: none; min-width: 110px; }
.modal-ent .ent-foot-tip { margin-right: auto; font-size: 0.68rem; color: var(--c-gray, #8A8478); }
.modal-ent .ent-form-group { grid-column: 1 / -1; margin: 10px 0 4px; }
.modal-ent .ent-form-group:first-child { margin-top: 0; }
.modal-ent .ent-apply-form .field { margin: 0 0 10px; min-width: 0; }
.modal-ent .ent-apply-form .field .field-label { font-size: 0.72rem; }
.modal-ent .ent-apply-form .field .input,
.modal-ent .ent-apply-form .field .textarea { width: 100%; box-sizing: border-box; }
.modal-ent .ent-apply-form .field .row { display: flex; gap: 8px; }
.modal-ent .ent-apply-form .field .row .input { flex: 1; min-width: 0; }
.modal-ent .ent-apply-form .field.full { grid-column: 1 / -1; }
.modal-ent .ent-apply-form .field:has(textarea),
.modal-ent .ent-apply-form .field:has(.row) { grid-column: 1 / -1; }
.modal-ent .ent-agree { grid-column: 1 / -1; margin: 2px 0 10px; }

@media (max-width: 640px) {
  .modal-ent { max-width: none; width: 100%; max-height: 94vh; border-radius: 14px; }
  .modal-ent .modal-body { grid-template-columns: 1fr; padding: 14px 16px 6px; }
  .modal-ent .modal-foot { padding: 10px 16px; gap: 8px; }
  .modal-ent .modal-foot .btn { flex: 1 1 0; min-width: 0; }
  .modal-ent .ent-foot-tip { width: 100%; margin: 0 0 2px; text-align: center; }
}

/* 弹窗布局兜底：防止其他样式把弹窗挤成横排 */
.modal { display: block; }
.modal.modal-ent { display: flex; flex-direction: column; }

/* ===== 企业主页升级 ===== */
.ent-hero.has-banner::before { background: linear-gradient(165deg, rgba(8, 10, 9, 0.18) 0%, rgba(8, 10, 9, 0.72) 100%); }
.ent-hero-actions { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
.ent-hero-actions .btn-primary { background: #E8D5A8; border-color: #E8D5A8; color: #3E2E12; }
.ent-hero-actions .btn-ghost { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.3); color: #F6F1E2; }
.ent-notice { background: #FBF6E7; border-bottom: 1px solid #EDE7D7; }
.ent-notice-inner { display: flex; align-items: center; gap: 10px; padding: 10px 0; font-size: 0.74rem; color: #6B5A32; }
.ent-notice-tag { flex: none; font-size: 0.62rem; padding: 2px 8px; border-radius: 999px; background: #1E6B4E; color: #F6F1E2; }
.ent-promise-row { display: flex; flex-wrap: wrap; gap: 8px; }
.ent-promise { font-size: 0.72rem; padding: 5px 12px; border-radius: 999px; background: #F0F6F1; color: #1E6B4E; border: 1px solid #DBE9DF; }
.ent-album { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ent-album-item { border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 3; background: #F2EEE2; }
.ent-album-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) { .ent-album { grid-template-columns: repeat(2, 1fr); } }

/* ===== 宗亲会入会申请 ===== */
.assoc-join-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid #EDE7D7; }
.ajc-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ajc-main strong { font-size: 0.82rem; color: #1D1B16; }
.ajc-main small { font-size: 0.7rem; color: #8A8478; }
.assoc-join-state { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; border-radius: 12px; background: #FBF8F0; border: 1px solid #EDE7D7; }
.assoc-join-state strong { font-size: 0.8rem; color: #1D1B16; }
.assoc-join-state span { font-size: 0.7rem; color: #8A8478; }
.assoc-join-state.pending { background: #FCF3E3; border-color: #EEDFBF; }
.assoc-join-state.done { background: #F0F6F1; border-color: #DBE9DF; }
.assoc-join-state.rejected { background: #FBEDEF; border-color: #EFD4D8; }

/* 宗亲会主页运营数据条 */
.assoc-stat-band {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  border-radius: 16px; overflow: hidden; background: #EDE7D7;
  border: 1px solid #EDE7D7; box-shadow: 0 10px 28px rgba(30, 27, 20, 0.05);
}
.asb-item {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  padding: 16px 10px; background: #FFFDF8;
}
.asb-item strong {
  font-family: var(--f-serif, serif); font-size: 1.18rem; color: #1A1913;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.asb-item span { font-size: 0.68rem; color: #8A8478; letter-spacing: 0.04em; }
@media (max-width: 560px) {
  .assoc-stat-band { grid-template-columns: repeat(2, 1fr); }
}

/* ===== 演示实拍图：商品 / 内容 / 活动封面 ===== */
.product-thumb .thumb-img,
.sxc-thumb .sxc-img,
.shopx-detail-hero .sdh-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 42%; z-index: 0;
}
.sxc-thumb { position: relative; overflow: hidden; }
.sxc-thumb .sxc-badge { z-index: 2; }
.shopx-detail-hero.has-img::after,
.shopx-detail-hero .sdh-img { pointer-events: none; }
.shopx-desc-p {
  margin: 0 0 10px; font-size: 0.86rem; line-height: 1.9;
  color: var(--c-gray-1, #555); text-align: justify;
}
.h5x-card-cover {
  height: 156px; margin: -14px -14px 12px; overflow: hidden;
  border-radius: 15px 15px 0 0; background: #1A1712;
}
.h5x-card-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.activity-card .ac-thumb {
  flex: 0 0 104px; width: 104px; overflow: hidden; background: #1A1712;
}
.activity-card .ac-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.act-hero.has-img .act-hero-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.act-hero.has-img::before { z-index: 1; }
.act-hero.has-img .act-hero-inner { z-index: 2; }
.hp-promo-card.has-img .hp-promo-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.hp-promo-card.has-img::before { z-index: 1; }
.hp-promo-card.has-img::after { z-index: 1; }
@media (max-width: 640px) {
  .activity-card .ac-thumb { flex: 0 0 84px; width: 84px; }
  .h5x-card-cover { height: 138px; }
}