/* ===== 微信咨询弹窗 =====
   样式仿自云众猫 / 数字云官网 common.css 的 .wx-mask / .wx-pop，
   交互由 assets/js/wx-modal.js 统一注入与绑定。 */
.wx-mask {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(4, 10, 28, .62);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    display: grid; place-items: center;
    opacity: 0; pointer-events: none;
    transition: opacity .3s;
}
.wx-mask.show { opacity: 1; pointer-events: auto; }

.wx-pop {
    position: relative;
    background: #fff;
    border-radius: 20px;
    padding: 34px 38px 30px;
    text-align: center;
    max-width: 340px;
    width: calc(100% - 48px);
    box-shadow: 0 40px 100px rgba(2, 8, 30, .5);
    transform: translateY(16px) scale(.96);
    transition: transform .35s cubic-bezier(.2, .9, .3, 1.2);
}
.wx-mask.show .wx-pop { transform: translateY(0) scale(1); }

.wx-pop h4 {
    font-size: 19px; font-weight: 800; color: #0d1830;
    margin: 0 0 18px; line-height: 1.4;
}
.wx-qr {
    background: linear-gradient(135deg, #0052d1, #3d8bff);
    border-radius: 16px; padding: 14px;
    display: inline-block;
}
.wx-qr img {
    display: block; width: 220px; height: 220px;
    border-radius: 8px; background: #fff;
}
.wx-pop p {
    margin: 16px 0 0;
    font-size: 13.5px; line-height: 1.8; color: #5b6b8c;
}
.wx-close {
    position: absolute; top: 10px; right: 12px;
    width: 32px; height: 32px;
    border: none; background: transparent;
    font-size: 22px; color: #93a3c4;
    cursor: pointer; border-radius: 50%;
    transition: .2s;
}
.wx-close:hover { background: #eef3fc; color: #0d1830; }

/* 与云众猫弹窗一致的底部蓝色咨询热线按钮 */
.wx-tel {
    display: inline-flex; align-items: center; gap: 8px;
    margin-top: 16px; padding: 11px 22px;
    border-radius: 999px;
    background: linear-gradient(120deg, #0052d1, #3d8bff);
    color: #fff; font-weight: 800; font-size: 15.5px;
    letter-spacing: .5px; text-decoration: none;
    box-shadow: 0 8px 20px rgba(0, 82, 209, .3);
    transition: .25s;
}
.wx-tel:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0, 82, 209, .4); }
.wx-tel svg { flex-shrink: 0; }

@media (max-width: 480px) {
    .wx-pop { padding: 28px 24px 26px; }
    .wx-qr img { width: 190px; height: 190px; }
}
