/* =========================================================
   元夕科技 · 官网扩展组件样式
   （专属优惠专区 / 客户经理弹窗 / 悬浮咨询按钮）
   ========================================================= */

/* ---------- 专属优惠专区 ---------- */
.deal{
  background:linear-gradient(180deg,#fff 0%,var(--bg) 100%);
  position:relative;overflow:hidden;
}
.deal .container{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.deal-left .deal-sub{display:flex;align-items:center;gap:8px;color:var(--primary);font-weight:700;font-size:13px;letter-spacing:2px;margin-bottom:12px}
.deal-left h2{font-size:30px;font-weight:800;color:var(--blue-800);line-height:1.35}
.deal-left h2 .grad{background:linear-gradient(90deg,var(--primary),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.deal-left>p{color:var(--ink-2);margin-top:12px;font-size:14.5px}
.deal-list{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.deal-item{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;transition:.2s}
.deal-item:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.deal-item .di{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,rgba(13,93,240,.12),rgba(0,183,230,.16));display:grid;place-items:center;flex-shrink:0}
.deal-item .di svg{width:19px;height:19px;stroke:var(--primary);fill:none;stroke-width:2}
.deal-item b{display:block;font-size:14px;color:var(--ink)}
.deal-item span{font-size:12px;color:var(--ink-3)}
.deal-cta{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}

/* 客户经理卡片 */
.manager-card{
  background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-lg);
  padding:26px;position:relative;overflow:hidden;
}
.manager-card::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--primary),var(--cyan))}
.manager-card .m-head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.manager-card .m-avatar{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--cyan));color:#fff;display:grid;place-items:center;font-size:20px;font-weight:800}
.manager-card .m-head b{font-size:16px;color:var(--blue-800);display:block}
.manager-card .m-head span{font-size:12.5px;color:var(--ink-3)}
.manager-card .m-badge{display:inline-block;margin-left:8px;background:var(--cyan-soft);color:#0a7aa6;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px}
.m-qr{display:flex;flex-direction:column;align-items:center;padding:18px;background:var(--bg);border:1px dashed var(--line);border-radius:14px}
.m-qr img{width:190px;height:190px;border-radius:10px;background:#fff;padding:6px}
.m-qr span{font-size:12.5px;color:var(--ink-2);margin-top:10px}
.m-qr span b{color:var(--primary)}
.m-info{display:grid;gap:10px;margin-top:16px}
.m-row{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-2)}
.m-row svg{width:17px;height:17px;stroke:var(--primary);fill:none;stroke-width:2;flex-shrink:0}
.m-row b{color:var(--ink);font-weight:700}
.m-row .copy-btn{margin-left:auto;padding:4px 12px;border-radius:7px;border:1px solid var(--primary);background:#fff;color:var(--primary);font-size:12px;font-weight:600;cursor:pointer;transition:.18s}
.m-row .copy-btn:hover{background:var(--cyan-soft)}

/* ---------- 客户经理弹窗 ---------- */
.cm-mask{
  position:fixed;inset:0;background:rgba(4,20,45,.55);z-index:300;
  display:none;align-items:center;justify-content:center;padding:20px;
  backdrop-filter:blur(3px);
}
.cm-mask.open{display:flex}
.cm-modal{
  background:#fff;border-radius:20px;width:100%;max-width:640px;
  box-shadow:0 34px 90px rgba(4,20,45,.35);overflow:hidden;
  animation:cmPop .32s cubic-bezier(.2,.9,.3,1.2);
  max-height:92vh;overflow-y:auto;
}
@keyframes cmPop{from{opacity:0;transform:scale(.94) translateY(14px)}to{opacity:1;transform:none}}
.cm-head{
  background:linear-gradient(135deg,var(--blue-800),var(--blue-950));
  color:#fff;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;position:relative;
}
.cm-head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,var(--primary),var(--cyan))}
.cm-head h3{font-size:18px;font-weight:800}
.cm-head p{font-size:12.5px;color:#b9c8e2;margin-top:4px}
.cm-head .x{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.12);border:none;color:#fff;font-size:16px;cursor:pointer;transition:.18s}
.cm-head .x:hover{background:rgba(255,255,255,.28)}
.cm-body{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:26px 28px}
.cm-qr{display:flex;flex-direction:column;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:20px;text-align:center}
.cm-qr img{width:210px;height:210px;border-radius:12px;background:#fff;padding:8px;box-shadow:0 8px 24px rgba(13,42,99,.12)}
.cm-qr .tip{font-size:12.5px;color:var(--ink-2);margin-top:14px;line-height:1.8}
.cm-qr .tip b{color:var(--primary)}
.cm-info{display:flex;flex-direction:column;gap:14px}
.cm-line{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}
.cm-line svg{width:20px;height:20px;stroke:var(--primary);fill:none;stroke-width:2;flex-shrink:0;margin-top:2px}
.cm-line .lbl{font-size:12px;color:var(--ink-3);display:block}
.cm-line .val{font-size:14.5px;font-weight:700;color:var(--ink)}
.cm-line .val.tel{color:var(--primary);font-size:17px;letter-spacing:.5px}
.cm-info .btn{margin-top:6px}
.cm-foot{padding:0 28px 26px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:var(--ink-3)}
.cm-foot svg{width:14px;height:14px;stroke:var(--ok);fill:none;stroke-width:2}

/* ---------- 悬浮咨询按钮 ---------- */
.cm-float{
  position:fixed;right:22px;bottom:40px;z-index:90;
  display:flex;align-items:center;gap:9px;
  background:linear-gradient(135deg,var(--primary),var(--cyan));color:#fff;
  padding:13px 18px;border-radius:40px;border:none;cursor:pointer;
  font-size:14px;font-weight:700;box-shadow:0 12px 30px rgba(13,93,240,.38);
  transition:transform .2s,box-shadow .2s;
}
.cm-float:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(13,93,240,.48)}
.cm-float svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2}
.cm-float .pulse-ring{position:absolute;inset:0;border-radius:40px;box-shadow:0 0 0 0 rgba(0,183,230,.5);animation:ring 2.4s infinite}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(0,183,230,.45)}70%{box-shadow:0 0 0 16px rgba(0,183,230,0)}100%{box-shadow:0 0 0 0 rgba(0,183,230,0)}}

/* 二维码小标签 */
.wechat-tag{display:inline-flex;align-items:center;gap:5px;color:var(--ok);font-size:12.5px;font-weight:600}
.wechat-tag svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2}

/* 响应式 */
@media (max-width:880px){
  .deal .container{grid-template-columns:1fr}
  .deal-list{grid-template-columns:1fr}
  .cm-body{grid-template-columns:1fr;padding:20px}
  .cm-modal{max-width:440px}
}
@media (max-width:560px){
  .deal-left h2{font-size:24px}
  .manager-card{padding:20px}
}