/* ==========================================================================
   台宝泵业 · 微信咨询弹窗（全站 CTA 统一收口到「加微信」）
   配套脚本：/taibao2026/js/wx-modal.js
   定位：作用在 body 末尾动态注入的 .wxm 节点上，独立文件便于单独更新
   ========================================================================== */
.wxm{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px}
.wxm[hidden]{display:none}
.wxm__mask{
  position:absolute;inset:0;background:rgba(7,17,32,.66);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  animation:wxmFade .18s ease-out;
}
.wxm__card{
  position:relative;z-index:1;width:min(580px,100%);max-height:calc(100vh - 48px);overflow-y:auto;
  background:#fff;border-radius:20px;
  box-shadow:0 40px 90px -30px rgba(7,17,32,.62);
  animation:wxmIn .24s cubic-bezier(.2,.8,.3,1);
}
@keyframes wxmFade{from{opacity:0}to{opacity:1}}
@keyframes wxmIn{from{opacity:0;transform:translateY(16px) scale(.982)}to{opacity:1;transform:none}}

.wxm__close{
  position:absolute;right:13px;top:13px;z-index:2;width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  border:0;border-radius:10px;cursor:pointer;
  background:rgba(14,23,38,.06);color:#8B95A7;
  transition:background-color .2s,color .2s;
}
.wxm__close:hover{background:rgba(14,23,38,.12);color:#0E1726}
.wxm__close svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}

.wxm__head{
  padding:26px 28px 20px;
  background:linear-gradient(180deg,#F2F7FF 0%,#FAFCFF 62%,#fff 100%);
  border-bottom:1px solid #E7EAF0;
}
.wxm__eyebrow{
  display:inline-flex;align-items:center;gap:7px;
  font-size:11.5px;font-weight:600;letter-spacing:.1em;color:#0B5CFF;
}
.wxm__eyebrow::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:#0B5CFF;box-shadow:0 0 0 3px rgba(11,92,255,.12);
}
.wxm__head h3{margin-top:11px;font-size:22px;line-height:1.35;font-weight:700;color:#0E1726;letter-spacing:-.01em}
.wxm__head p{margin-top:9px;font-size:13.5px;line-height:1.75;color:#5A6474}
.wxm__head p b{color:#0E1726;font-weight:600;white-space:nowrap}

.wxm__body{display:grid;grid-template-columns:198px 1fr;gap:26px;padding:24px 28px 6px}
.wxm__qr{text-align:center}
.wxm__qr img{
  width:198px;height:198px;margin:0 auto;padding:8px;box-sizing:border-box;
  object-fit:contain;border:1px solid #E7EAF0;border-radius:14px;background:#fff;
  box-shadow:0 10px 26px -16px rgba(11,34,80,.32);
}
.wxm__qr span{display:block;margin-top:9px;font-size:11.5px;line-height:1.6;color:#8B95A7}
/* 二维码下方的电话：扫不上时的兜底入口 */
.wxm__qrtel{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  margin-top:10px;padding:7px 14px;border:1px solid #E7EAF0;border-radius:10px;
  background:#F6F8FC;color:#0E1726;font-weight:700;
  transition:background-color .2s,border-color .2s,color .2s;
}
.wxm__qrtel:hover{border-color:#2E78FF;background:#EEF4FF;color:#0846C4}
.wxm__qrtel svg{width:14px;height:14px;fill:#0B5CFF}
.wxm__qrtel b{font-size:16px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.wxm__qr em{display:block;margin-top:7px;font-style:normal;font-size:11px;line-height:1.55;color:#8B95A7}
.wxm__steps{counter-reset:wxm;margin:0;padding:0;list-style:none}
.wxm__steps li{
  position:relative;padding-left:30px;margin-bottom:15px;
  font-size:13px;line-height:1.65;color:#5A6474;
}
.wxm__steps li:last-child{margin-bottom:0}
.wxm__steps li::before{
  counter-increment:wxm;content:counter(wxm);
  position:absolute;left:0;top:1px;width:20px;height:20px;
  display:flex;align-items:center;justify-content:center;
  border-radius:6px;background:#EEF4FF;color:#0846C4;
  font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;
}
.wxm__steps b{display:block;margin-bottom:1px;font-size:13.5px;font-weight:600;color:#0E1726}
.wxm__steps em{color:#0B5CFF;font-weight:600;font-style:normal}

.wxm__foot{display:flex;align-items:center;gap:10px;padding:18px 28px 14px}
.wxm__copy{
  flex:1;display:flex;align-items:center;justify-content:space-between;gap:14px;
  height:48px;padding:0 16px;border:1px dashed #D8DFEA;border-radius:12px;
  background:#FBFCFE;cursor:pointer;text-align:left;font:inherit;color:#5A6474;
  transition:background-color .2s,border-color .2s;
}
.wxm__copy:hover{border-color:#2E78FF;background:#F6FAFF}
.wxm__copy small{display:block;font-size:11px;line-height:1.4;color:#8B95A7}
.wxm__copy b{display:block;font-size:15px;line-height:1.3;font-weight:700;color:#0E1726;letter-spacing:.03em;font-variant-numeric:tabular-nums}
.wxm__copy i{font-style:normal;font-size:12px;font-weight:600;color:#0B5CFF;white-space:nowrap}
.wxm__tel{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  height:48px;padding:0 20px;border-radius:12px;
  background:#0B5CFF;color:#fff;font-size:14px;font-weight:600;
  white-space:nowrap;transition:background-color .2s;
}
.wxm__tel:hover{background:#0846C4;color:#fff}
.wxm__tel svg{width:15px;height:15px;fill:currentColor}
/* 从「电话沟通」这类 tel: 入口进来时，拨号键成为主行动 */
.wxm__tel[data-emphasis="1"]{flex:1 1 auto;background:#0B5CFF;box-shadow:0 8px 20px -8px rgba(11,92,255,.5)}
.wxm__foot:has(.wxm__tel[data-emphasis="1"]) .wxm__copy{flex:0 1 auto;background:#F4F7FC;border-color:#E7EAF0}
.wxm__tip{padding:0 28px 22px;margin:0;font-size:11.5px;line-height:1.65;color:#8B95A7}

@media(max-width:640px){
  .wxm{padding:0;align-items:flex-end}
  .wxm__card{width:100%;max-height:94vh;border-radius:20px 20px 0 0}
  .wxm__head{padding:22px 20px 16px}
  .wxm__head h3{font-size:19px}
  .wxm__head p{font-size:13px}
  .wxm__body{grid-template-columns:1fr;gap:16px;padding:20px 20px 4px}
  .wxm__qr img{width:168px;height:168px}
  .wxm__qrtel{width:100%;max-width:260px}
  .wxm__steps li{font-size:12.5px}
  .wxm__foot{flex-direction:column;padding:16px 20px 12px}
  .wxm__copy,.wxm__tel{width:100%;justify-content:center}
  .wxm__copy{justify-content:space-between}
  .wxm__tip{padding:0 20px 26px;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .wxm__mask,.wxm__card{animation:none}
}