/* ================= 内页侧边栏重构 ================= */
.pro-left .kk{ border-radius: 8px; overflow: hidden; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.06);}
.pro-left .kk .top{
  height: 56px; line-height: 56px; background: linear-gradient(90deg,#669934 0%,#7fb33f 100%);
  padding: 0 20px;
}
.pro-left .kk .top i{ color: #fff; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 1px;}

/* 维修服务导航 */
.pro-left .sideMenu ul{ background: #fff; padding: 6px 0;}
.pro-left .sideMenu ul li a{
  display: block; position: relative; height: 48px; line-height: 48px;
  padding: 0 20px 0 34px; font-size: 15px; color: #555;
  border-left: 3px solid transparent; transition: all .22s;
}
.pro-left .sideMenu ul li a .ar{
  position: absolute; left: 18px; top: 50%; margin-top: -3px;
  width: 6px; height: 6px; border-radius: 50%; background: #cfd8c4; transition: all .22s;
}
.pro-left .sideMenu ul li a i{ font-style: normal;}
.pro-left .sideMenu ul li a:hover{ background: #f6f9f2; color: #669934; padding-left: 38px;}
.pro-left .sideMenu ul li a:hover .ar{ background: #669934;}
.pro-left .sideMenu ul li.hover a{
  background: #669934; color: #fff; font-weight: bold; border-left-color: #3f6618;
}
.pro-left .sideMenu ul li.hover a .ar{ background: #ffd451; width: 8px; height: 8px; margin-top: -4px;}
.pro-left .sideMenu ul li.hover a:hover{ background: #5c8a2e; color: #fff;}

/* 联系我们卡片 */
.pro-left .phoneus{
  margin-top: 18px; background: #fff; border-radius: 8px; padding: 18px 20px;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.pro-left .phoneus h6{
  font-size: 17px; color: #2f3a2a; font-weight: bold; padding-bottom: 12px;
  border-bottom: 1px solid #f0f0f0; margin-bottom: 12px;
}
.pro-left .phoneus .cname{ font-size: 14px; color: #666; line-height: 22px;}
.pro-left .phoneus .ctel{ margin: 8px 0 10px;}
.pro-left .phoneus .ctel b{ font-size: 24px; color: #e0652a; line-height: 30px;}
.pro-left .phoneus .crow{ font-size: 13px; color: #888; line-height: 22px;}
.pro-left .phoneus .cbtns{ display: flex; gap: 10px; margin-top: 14px;}
.pro-left .phoneus .cbtns a{
  flex: 1; height: 38px; line-height: 38px; text-align: center; border-radius: 5px;
  font-size: 14px; transition: all .22s;
}
.pro-left .phoneus .cbtns .btn1{ background: #669934; color: #fff;}
.pro-left .phoneus .cbtns .btn1:hover{ background: #4f7825;}
.pro-left .phoneus .cbtns .btn2{ background: #f2f6ec; color: #669934; border: 1px solid #dce8cd;}
.pro-left .phoneus .cbtns .btn2:hover{ background: #e6efd9;}

/* 扫码咨询 */
.pro-left .side-qr{ text-align: center;}
.pro-left .side-qr .qr-box{
  width: 150px; height: 150px; margin: 4px auto 10px; padding: 8px;
  border: 1px solid #eee; border-radius: 8px; background: #fff;
}
.pro-left .side-qr .qr-box img{ width: 100%; height: 100%; object-fit: contain;}
.pro-left .side-qr .qr-tip{ font-size: 13px; color: #888; line-height: 22px;}
.pro-left .side-qr .qr-phone{ margin-top: 8px; font-size: 13px; color: #888; line-height: 20px;}
.pro-left .side-qr .qr-phone b{ font-size: 20px; color: #e0652a; line-height: 28px;}

/* 侧栏标签云 */
.pro-left .side-tags{ margin-top: 18px; background: #fff; border-radius: 8px; padding: 16px 18px; box-shadow: 0 2px 12px rgba(0,0,0,.06);}
.pro-left .side-tags h6{
  font-size: 16px; color: #2f3a2a; font-weight: bold; padding-bottom: 10px;
  border-bottom: 1px solid #f0f0f0; margin-bottom: 12px;
}
.pro-left .side-tags .tag-cloud{ margin-top: 2px;}

/* ===== 标签云：14 色轮换 · 亮色版（同一套规则在 home-pro.css 也有一份，供首页使用） ===== */
.tag-cloud{ display: flex; flex-wrap: wrap; gap: 8px;}
.tag-cloud .tag-item{
  display: inline-block; padding: 5px 12px; font-size: 13px; line-height: 1.5;
  border-radius: 4px; border: 1px solid transparent; text-decoration: none;
  font-weight: 500; transition: all .22s;
}
.tag-cloud .tag-item:hover{ filter: saturate(1.25) brightness(1.04); box-shadow: 0 4px 12px rgba(0,0,0,.14); transform: translateY(-2px);}
.tag-cloud .tag-item:nth-child(14n+1){ background: #d9f2c4; color: #3f6b17; border-color: #bde3a0;}
.tag-cloud .tag-item:nth-child(14n+2){ background: #cbe6ff; color: #1f5ba8; border-color: #a8d2f7;}
.tag-cloud .tag-item:nth-child(14n+3){ background: #ffdcc4; color: #b4530f; border-color: #f7bd94;}
.tag-cloud .tag-item:nth-child(14n+4){ background: #e6d7fb; color: #5f3ba0; border-color: #cdb3f2;}
.tag-cloud .tag-item:nth-child(14n+5){ background: #ffd3e0; color: #ad2450; border-color: #f7a9c2;}
.tag-cloud .tag-item:nth-child(14n+6){ background: #c8f0f4; color: #0f7480; border-color: #9fe0e8;}
.tag-cloud .tag-item:nth-child(14n+7){ background: #ffe9b0; color: #8a5b06; border-color: #f5d282;}
.tag-cloud .tag-item:nth-child(14n+8){ background: #dde3f5; color: #414d78; border-color: #bcc8e8;}
.tag-cloud .tag-item:nth-child(14n+9){ background: #cdf0d4; color: #237a37; border-color: #a3e0b0;}
.tag-cloud .tag-item:nth-child(14n+10){ background: #ffd6ec; color: #94256c; border-color: #f5abd7;}
.tag-cloud .tag-item:nth-child(14n+11){ background: #d4e9ff; color: #15508a; border-color: #a9cef5;}
.tag-cloud .tag-item:nth-child(14n+12){ background: #f2e6c8; color: #7d5c1f; border-color: #e4cf9c;}
.tag-cloud .tag-item:nth-child(14n+13){ background: #c8f0e1; color: #146b50; border-color: #9ee0c9;}
.tag-cloud .tag-item:nth-child(14n+14){ background: #ded2f8; color: #4d3d8c; border-color: #bfaef0;}

/* 微信悬浮跳动图标 */
.wx-float{
  position: fixed; right: 22px; bottom: 130px; z-index: 9998;
  width: 62px; height: 62px; border-radius: 50%;
  background: #22ac38; box-shadow: 0 6px 18px rgba(34,172,56,.4);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  animation: wxBounce 1.6s ease-in-out infinite; text-decoration: none;
}
.wx-float-icon{
  width: 26px; height: 22px; background: #fff;
  -webkit-mask: none; border-radius: 3px; position: relative;
}
.wx-float-icon:before,
.wx-float-icon:after{
  content: ""; position: absolute; background: #22ac38; border-radius: 50%;
}
.wx-float-icon:before{ width: 8px; height: 8px; left: 4px; top: 6px;}
.wx-float-icon:after{ width: 7px; height: 7px; right: 4px; top: 7px;}
.wx-float-text{ display: block; font-size: 11px; color: #fff; line-height: 16px; margin-top: 2px;}
.wx-float-dot{
  position: absolute; top: -2px; right: -2px; width: 12px; height: 12px;
  border-radius: 50%; background: #ff3b30; border: 2px solid #fff;
  animation: wxPulse 1.2s ease-in-out infinite;
}
@keyframes wxBounce{
  0%,100%{ transform: translateY(0);}
  50%{ transform: translateY(-8px);}
}
@keyframes wxPulse{
  0%{ box-shadow: 0 0 0 0 rgba(255,59,48,.7);}
  70%{ box-shadow: 0 0 0 10px rgba(255,59,48,0);}
  100%{ box-shadow: 0 0 0 0 rgba(255,59,48,0);}
}
.wx-float:hover{ background: #1b9230;}

@media (max-width: 768px){
  .wx-float{ right: 12px; bottom: 90px; width: 52px; height: 52px;}
}
