/* ALION 奥联滤科 · 全站公共组件样式（左侧快捷条 + 客服弹窗）
   原本内联在每页 <style> 中，2026-10-23 抽成公共文件以便浏览器缓存 */

/* ===== 左侧常驻快捷条 ===== */
.albar{font-family:inherit}
.albar-rail{position:fixed;left:0;bottom:34px;z-index:9992;width:64px;background:#E60012;border-radius:0 12px 12px 0;box-shadow:4px 4px 20px rgba(230,0,18,.28)}
.albar-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:64px;cursor:pointer;color:#fff;border:0;background:none;width:100%;padding:0;transition:background .18s;border-bottom:1px solid rgba(255,255,255,.18)}
.albar-item:last-child{border-bottom:0}
.albar-item:hover{background:#C20010}
.albar-item svg{display:block;margin-bottom:3px}
.albar-item span{font-size:11px;line-height:1;letter-spacing:1px}
.albar-item b{position:absolute;left:70px;top:50%;transform:translateY(-50%) scale(.9);transform-origin:left center;background:#2B2B2B;color:#fff;font-size:13px;font-weight:500;white-space:nowrap;padding:8px 14px;border-radius:8px;opacity:0;visibility:hidden;transition:all .18s;pointer-events:none}
.albar-item b::before{content:"";position:absolute;left:-5px;top:50%;margin-top:-5px;border:5px solid transparent;border-right-color:#2B2B2B}
.albar-item:hover b{opacity:1;visibility:visible;transform:translateY(-50%) scale(1)}
.albar-dot{position:absolute;left:12px;top:11px;width:8px;height:8px;border-radius:50%;background:#FFD400;box-shadow:0 0 0 2px #E60012}
@keyframes alPulse{0%,100%{box-shadow:4px 4px 20px rgba(230,0,18,.28)}50%{box-shadow:0 0 0 8px rgba(230,0,18,.16),4px 4px 20px rgba(230,0,18,.28)}}
.albar-rail.albar-attn{animation:alPulse 1.6s ease-in-out 3}

/* ===== 留言板：初始=3电话+型号+电话+提交；移入再展开描述与称呼 ===== */
.almsg{position:fixed;left:76px;bottom:44px;z-index:9993;width:218px;background:#fff;border-radius:12px;box-shadow:0 16px 44px rgba(43,43,43,.22);overflow:hidden;font-family:inherit;transition:width .22s ease}
.almsg:hover{width:332px}
.almsg.almsg-hide{opacity:0;visibility:hidden;transform:translateY(10px)}
.almsg.almsg-drop{overflow-y:auto}
.almsg-head{background:#E60012;padding:7px 12px;display:flex;align-items:center;justify-content:space-between;white-space:nowrap}
.almsg-head b{color:#fff;font-size:14.5px;letter-spacing:.5px}
.almsg-head i{font-style:normal;color:rgba(255,255,255,.9);font-size:11px;margin-left:6px}
.almsg-x{border:0;background:rgba(255,255,255,.18);color:#fff;width:21px;height:21px;border-radius:50%;font-size:14px;line-height:1;cursor:pointer;padding:0;flex:0 0 21px}
.almsg-x:hover{background:rgba(255,255,255,.32)}
.almsg-tels{padding:3px 12px 2px}
.almsg-tels a{display:flex;align-items:center;gap:7px;padding:3px 0;border-bottom:1px dashed #F0F1F3;color:#E60012;font-weight:700;font-size:12px;text-decoration:none;letter-spacing:.3px;white-space:nowrap}
.almsg-tels a:last-of-type{border-bottom:0}
.almsg-tels a:hover{color:#C20010}
.almsg-tels svg{flex:0 0 13px}
/* 移入/下拉时才出现的：需求描述 + 称呼 */
.almsg-body{max-height:0;opacity:0;overflow:hidden;transition:max-height .3s ease,opacity .22s ease}
.almsg:hover .almsg-body,.almsg.almsg-drop .almsg-body{max-height:230px;opacity:1}
.almsg-form{padding:4px 12px 9px}
.almsg-form textarea,.almsg-form input{width:100%;box-sizing:border-box;border:1px solid #E7E9EC;border-radius:8px;padding:6.5px 10px;font-size:12.5px;color:#2B2B2B;margin-bottom:6px;outline:none;font-family:inherit;resize:none;background:#FBFBFC}
.almsg-form textarea{height:58px}
.almsg-form textarea:focus,.almsg-form input:focus{border-color:#E60012;background:#fff}
.almsg-sub{width:100%;border:0;background:#E60012;color:#fff;font-size:14px;font-weight:700;letter-spacing:8px;text-indent:8px;padding:7px 0;border-radius:8px;cursor:pointer;transition:background .18s}
.almsg-sub:hover{background:#C20010}
.almsg-note{font-size:10.5px;color:#B8BEC7;text-align:center;margin-top:5px}
.almsg-err{font-size:12px;color:#E60012;margin:-1px 0 7px;display:none}
.almsg-ok,.almsg-fb{display:none;padding:2px 4px 6px;text-align:center}
.almsg-ico{width:48px;height:48px;line-height:48px;border-radius:50%;color:#fff;font-size:25px;margin:0 auto 12px}
.almsg-ok .almsg-ico{background:#16a34a}
.almsg-ok b,.almsg-fb b{display:block;font-size:15px;color:#2B2B2B;margin-bottom:8px}
.almsg-ok p,.almsg-fb p{font-size:12.5px;color:#555;margin:0 0 14px;line-height:1.85}
.almsg-act{display:block;background:#E60012;color:#fff;text-decoration:none;border-radius:8px;padding:10px 0;font-size:14px;font-weight:700}

/* ===== 微信二维码弹层 ===== */
.alqr{position:fixed;left:76px;bottom:44px;z-index:9993;width:230px;background:#fff;border-radius:12px;box-shadow:0 16px 44px rgba(43,43,43,.22);padding:16px;text-align:center;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .24s;font-family:inherit}
.alqr.alqr-show{opacity:1;visibility:visible;transform:translateY(0)}
.alqr b{display:block;font-size:14.5px;color:#2B2B2B;margin-bottom:3px}
.alqr span{display:block;font-size:12px;color:#888;margin-bottom:11px}
.alqr img{width:100%;border-radius:8px;display:block}
.alqr i{display:block;font-size:12px;color:#E60012;font-style:normal;font-weight:700;margin-top:10px}
.altel{position:fixed;left:76px;bottom:34px;z-index:9993;width:224px;background:#fff;border-radius:12px;box-shadow:0 16px 44px rgba(43,43,43,.22);padding:16px 14px;text-align:center;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .24s;font-family:inherit}
.altel.altel-show{opacity:1;visibility:visible;transform:translateY(0)}
.altel b{display:block;font-size:14.5px;color:#2B2B2B;margin-bottom:2px}
.altel em{display:block;font-size:11.5px;color:#999;font-style:normal;margin-bottom:4px}
.altel a{display:block;padding:9px 0;border-top:1px solid #F0F1F3;font-size:15px;font-weight:800;color:#2B2B2B;text-decoration:none;letter-spacing:.3px;font-family:inherit;white-space:nowrap}
.altel a:first-of-type{border-top:0}
.altel a:hover{color:#E60012}
.altel i{display:block;font-size:11px;color:#B8BEC7;font-style:normal;margin-top:8px}

/* ===== 遮罩（手机端）===== */
.almask{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:9989;opacity:0;visibility:hidden;transition:all .2s}
.almask.almask-show{opacity:1;visibility:visible}

/* ===== 手机端 ===== */
@media (max-width:820px){
  .albar-rail{left:0;right:0;bottom:0;width:auto;border-radius:12px 12px 0 0;display:flex;box-shadow:0 -4px 20px rgba(230,0,18,.22)}
  .albar-item{height:56px;flex:1;border-bottom:0;border-right:1px solid rgba(255,255,255,.18)}
  .albar-item:last-child{border-right:0}
  .albar-item b{display:none}
  .albar-dot{left:calc(50% + 10px);top:9px;width:7px;height:7px}
  .almsg{left:12px;right:12px;bottom:12px;width:auto !important;max-height:82vh;overflow-y:auto}
  .almsg .almsg-body{max-height:460px;opacity:1}
  .alqr{left:50%;bottom:auto;top:50%;width:250px;transform:translate(-50%,-50%)}
  .alqr.alqr-show{transform:translate(-50%,-50%)}
  .altel{left:50%;bottom:auto;top:50%;transform:translate(-50%,-50%);width:250px}
  .altel.altel-show{transform:translate(-50%,-50%)}
  body{padding-bottom:56px}
}

.alsp-mask{position:fixed;inset:0;background:rgba(20,22,26,.45);opacity:0;visibility:hidden;transition:all .22s;z-index:9988}
.alsp-mask.alsp-mask-on{opacity:1;visibility:visible}
.alsp{position:fixed;z-index:9990;width:400px;max-width:calc(100vw - 20px);background:#fff;border-radius:14px;box-shadow:0 14px 50px rgba(20,22,26,.28);opacity:0;visibility:hidden;transform:translateY(8px);transition:all .2s;font-family:inherit}
.alsp.alsp-on{opacity:1;visibility:visible;transform:translateY(0)}
.alsp.alsp-modal{top:50% !important;right:auto !important;left:50% !important;transform:translate(-50%,-50%) !important}
.alsp-x{position:absolute;top:10px;right:12px;width:30px;height:30px;border:0;background:#F2F4F6;border-radius:50%;font-size:14px;color:#666;cursor:pointer;z-index:2;line-height:1}
.alsp-x:hover{background:#FDEBEC;color:#E60012}
.alsp-form{padding:20px 22px 16px}
.alsp-h{font-size:16px;font-weight:800;color:#2B2B2B;margin-bottom:14px}
.alsp-h b{color:#E60012}
.alsp-l{font-size:12px;color:#888;font-weight:700;margin:11px 0 7px}
.alsp-slide{display:flex;align-items:center;gap:10px}
.alsp-slide input[type=range]{flex:1;-webkit-appearance:none;height:5px;border-radius:3px;background:linear-gradient(90deg,#E60012 var(--p,30%),#E7E9EC var(--p,30%));outline:none}
.alsp-slide input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid #E60012;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.alsp-slide input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid #E60012;cursor:pointer}
.alsp-slide b{min-width:64px;text-align:right;font-size:14.5px;color:#E60012;font-weight:800;font-variant-numeric:tabular-nums}
.alsp-opts{display:flex;flex-wrap:wrap;gap:6px}
.alsp-o{position:relative;cursor:pointer}
.alsp-o input{position:absolute;opacity:0;pointer-events:none}
.alsp-o span{display:block;padding:6.5px 11px;border:1.5px solid #E7E9EC;border-radius:8px;font-size:12.5px;color:#555;background:#fff;transition:all .15s;white-space:nowrap}
.alsp-o span:hover{border-color:#F3AEB4;color:#E60012}
.alsp-o input:checked+span{border-color:#E60012;background:#FDEBEC;color:#E60012;font-weight:700}
.alsp-go{display:block;width:100%;margin-top:16px;padding:12px;border:0;border-radius:9px;background:#E60012;color:#fff;font-size:15px;font-weight:800;cursor:pointer;transition:background .15s;font-family:inherit}
.alsp-go:hover{background:#C20010}
.alsp-tip{margin-top:9px;font-size:11px;color:#A5AAB2;text-align:center}
/* 结果态 */
.alsp.alsp-modal .alsp-form,.alsp.alsp-modal .alsp-res{width:400px;max-width:calc(100vw - 20px)}
.alsp-res{padding:24px 24px 18px;background:#2B2B2B;color:#fff;border-radius:14px}
.alsp.alsp-modal .alsp-res{border-radius:14px}
.alsp-rh{font-size:12px;letter-spacing:2px;color:#9BA1AA;margin-bottom:12px;font-weight:600}
.alsp-mat{font-size:27px;font-weight:900;line-height:1.2;margin-bottom:4px}
.alsp-code{font-size:12px;color:#9BA1AA;margin-bottom:14px}
.alsp-why{font-size:13px;line-height:1.8;color:#C8CDD4;padding-top:13px;border-top:1px solid rgba(255,255,255,.12)}
.alsp-why b{color:#fff}
.alsp-warn{margin-top:12px;padding:10px 13px;border-radius:8px;font-size:12px;line-height:1.65;background:rgba(230,0,18,.14);border-left:3px solid #E60012;color:#FFB3B8}
.alsp-act{margin-top:15px;display:flex;gap:9px}
.alsp-act a{flex:1;text-align:center;padding:11px 10px;border-radius:9px;font-size:13.5px;font-weight:700;text-decoration:none}
.alsp-act .a1{background:#E60012;color:#fff}
.alsp-act .a1:hover{background:#C20010}
.alsp-act .a2{background:rgba(255,255,255,.1);color:#fff}
.alsp-act .a2:hover{background:rgba(255,255,255,.18)}
.alsp-again{margin-top:12px;text-align:center;font-size:12.5px;color:#9BA1AA;cursor:pointer}
.alsp-again:hover{color:#fff}
@media(max-width:900px){
  .alsp{left:50% !important;right:auto !important;top:50% !important;transform:translate(-50%,-50%) !important;width:calc(100vw - 24px)}
  .alsp.alsp-on{transform:translate(-50%,-50%) !important}
  .alsp-form{padding:18px 16px 14px}
  .alsp-o span{padding:6px 9px;font-size:12px}
}