.desktop-contact {
  position: fixed;
  z-index: 50;
  right: 18px;
  top: 50%;
  transform: translateY(-42%);
  width: 170px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 22px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 18px 50px rgba(13,45,66,.18);
  backdrop-filter: blur(14px);
  display: grid;
  gap: 9px;
}
.desktop-contact a {
  height: 52px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  gap: 11px;
  border: 1px solid #d8e2e8;
  border-radius: 16px;
  color: #17384e;
  font-size: 14px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(0,16,28,.17);
}
.desktop-contact i {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  border-radius: 50%;
  background: #eef4f7;
  font-size: 13px;
  font-style: normal;
}
.desktop-contact .customer { background:linear-gradient(135deg,#f7c84a,#edb52a); border-color:#e8b127; color:#173044; }
.desktop-contact .agent { background:#17384e; border-color:#17384e; color:#fff; }
.desktop-contact .whatsapp,
.desktop-contact .telegram,
.desktop-contact .dingtalk { background:#fff; border-color:#d8e2e8; color:#17384e; }
.desktop-contact .whatsapp i { color:#15945c; }
.desktop-contact .telegram i { color:#218fbe; }
.desktop-contact .dingtalk i { color:#286fd1; }
.mobile-contact { display:none; }
@media (max-width:1180px) {
  .desktop-contact { display:none; }
  .mobile-contact { display:block; position:fixed; z-index:60; right:18px; top:92px; }
  .mobile-contact summary { width:58px; height:58px; padding:0; display:grid; place-items:center; list-style:none; cursor:pointer; border:2px solid rgba(218,241,255,.95); border-radius:50%; background:linear-gradient(145deg,#285a8e,#173f70); color:#bfe7ff; box-shadow:0 12px 30px rgba(11,45,67,.3),inset 0 0 0 5px rgba(130,205,247,.13); outline:none; }
  .mobile-contact summary::-webkit-details-marker { display:none; }
  .mobile-contact summary i { width:30px; height:30px; display:grid; place-items:center; color:#c7ebff; font-size:0; font-style:normal; }
  .mobile-contact summary i::before { content:'☰'; font-size:28px; font-weight:400; line-height:1; text-shadow:0 1px 5px rgba(176,225,255,.35); }
  .mobile-contact summary span { display:none; }
  .mobile-contact[open] summary { background:linear-gradient(145deg,#3473ac,#1d4c7c); color:#d8f2ff; transform:none; }
  .mobile-contact > div { position:absolute; right:0; top:72px; width:276px; padding:66px 12px 12px; display:grid; grid-template-columns:1fr 1fr; gap:8px; overflow:hidden; border:1px solid rgba(23,56,78,.12); border-radius:24px; background:rgba(255,255,255,.97); box-shadow:0 24px 60px rgba(13,45,66,.28); }
  .mobile-contact > div::before { content:'专属服务中心'; position:absolute; inset:0 0 auto; height:54px; padding:0 18px; display:flex; align-items:center; background:linear-gradient(135deg,#173f59,#0b293d); color:#fff; font-size:16px; font-weight:900; letter-spacing:.04em; }
  .mobile-contact > div::after { content:'在线'; position:absolute; right:16px; top:18px; padding-left:12px; color:#cfe9dc; font-size:11px; }
  .mobile-contact:not([open]) > div { display:none; }
  .mobile-contact > div a { min-height:48px; padding:0 11px; display:flex; align-items:center; justify-content:center; border:1px solid #e0e8ed; border-radius:13px; background:#f7fafb; color:#17384e; font-size:12px; font-weight:800; text-align:center; text-decoration:none; }
  .mobile-contact .customer { background:linear-gradient(135deg,#f8d260,#efb72d); border-color:#edb52a; color:#173044; }
  .mobile-contact .agent { background:#eaf1f4; border-color:#d6e2e8; color:#17384e; }
  .mobile-contact .whatsapp { color:#147c50; }
  .mobile-contact .telegram { color:#217ca5; }
  .mobile-contact .dingtalk { grid-column:1/-1; color:#2864ad; }
  .mobile-contact > div::after { background:radial-gradient(circle at 3px 50%,#38c77b 0 3px,transparent 4px); }

  .mobile-contact > .product-guide {
    top:72px;
    width:min(232px,calc(100vw - 72px));
    max-height:none;
    padding:0 8px 8px;
    display:grid;
    grid-template-columns:1fr;
    gap:5px;
    overflow:hidden;
    border-radius:17px;
  }
  .mobile-contact > .product-guide::before,
  .mobile-contact > .product-guide::after { content:none; }
  .product-guide header {
    position:sticky;
    z-index:2;
    top:0;
    margin:0 -9px 2px;
    padding:10px 13px 9px;
    display:grid;
    background:linear-gradient(135deg,#173f59,#0b293d);
    color:#fff;
  }
  .product-guide header small { color:#f4be30; font-size:6px; font-weight:900; letter-spacing:.16em; }
  .product-guide header strong { margin-top:2px; font-size:14px; }
  .product-guide header em { margin-top:1px; color:#b9cbd6; font-size:8px; font-style:normal; }
  .mobile-contact .guide-card {
    min-height:0;
    padding:8px;
    display:grid;
    grid-template-columns:28px 1fr 8px;
    align-items:start;
    gap:7px;
    text-align:left;
    background:#f7fafb;
  }
  .mobile-contact .guide-card > b { width:25px; height:25px; display:grid; place-items:center; border-radius:7px; background:#173f59; color:#f4be30; font-size:8px; }
  .mobile-contact .guide-card > span { display:grid; gap:3px; }
  .mobile-contact .guide-card > span strong { color:#17384e; font-size:11px; }
  .mobile-contact .guide-card > span small { display:block; max-width:155px; overflow:hidden; color:#788f9d; font-size:8px; font-weight:500; line-height:1.35; white-space:nowrap; text-overflow:ellipsis; }
  .mobile-contact .guide-card > i { align-self:center; color:#d5a51f; font-size:15px; font-style:normal; }
  .mobile-contact .guide-service { min-height:34px; background:linear-gradient(135deg,#f5c443,#e9ad20); border:0; color:#173044; font-size:10px; }
  .mobile-contact .guide-service span { margin-left:6px; font-size:15px; }
}

@media (max-width:1180px) {
  .mobile-contact {
    top: 7px;
    right: 18px;
    z-index: 61;
  }

  .mobile-contact summary {
    width: 50px;
    height: 50px;
    border-width: 2px;
    box-shadow: 0 7px 18px rgba(11,45,67,.22), inset 0 0 0 4px rgba(130,205,247,.13);
  }

  .mobile-contact summary i::before {
    font-size: 24px;
  }
}

@media (max-width:380px) {
  .mobile-contact { right: 14px; }
  .mobile-contact summary { width: 46px; height: 46px; }
}