/* Плавающие кнопки на лендингах: звонок, чат-бот, Max.
   Деловой вид: глубокие цвета сайта, белая обводка, подпись-плашка. Внимание привлекают
   появление по очереди, волны у главной кнопки, движение иконок и периодический показ подписи. */
.lp-widgets{position:fixed;right:24px;bottom:24px;z-index:8999;display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none}
.lp-widgets.lp-w-raise{bottom:104px}

.lp-w{--c1:#013f54;--c2:#0a5c75;--glow:rgba(1,63,84,.45);pointer-events:auto;position:relative;display:flex;align-items:center;justify-content:flex-end;text-decoration:none;color:#fff;-webkit-tap-highlight-color:transparent;
 opacity:0;transform:translateX(26px) scale(.7);animation:lp-w-in .6s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:calc(.9s + var(--i,0) * .16s)}
.lp-w-call{--c1:#00a98f;--c2:#007f6c;--glow:rgba(0,169,143,.5)}
.lp-w-chat{--c1:#0b5a73;--c2:#013f54;--glow:rgba(11,90,115,.45)}
.lp-w-max{--c1:#471aff;--c2:#471aff;--glow:rgba(71,26,255,.38)}
.lp-w-max .lp-w-ico{background:#fff;border-color:#fff;box-shadow:0 0 0 1px rgba(71,26,255,.16),0 10px 24px -6px var(--glow),0 3px 8px rgba(16,24,40,.14)}
.lp-w-max:hover .lp-w-ico{box-shadow:0 0 0 1px rgba(71,26,255,.22),0 16px 30px -8px var(--glow),0 4px 10px rgba(16,24,40,.18)}
.lp-w-ico img{display:block;width:34px;height:34px;transform-origin:50% 60%}
@keyframes lp-w-in{to{opacity:1;transform:none}}

.lp-w-ico{position:relative;flex:none;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:linear-gradient(145deg,var(--c1),var(--c2));border:3px solid #fff;box-sizing:border-box;
 box-shadow:0 10px 24px -6px var(--glow),0 3px 8px rgba(16,24,40,.18);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
.lp-w-ico svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform-origin:50% 50%}
.lp-w:hover .lp-w-ico{transform:translateY(-3px) scale(1.06);box-shadow:0 16px 30px -8px var(--glow),0 4px 10px rgba(16,24,40,.2)}
.lp-w:active .lp-w-ico{transform:scale(.94)}
.lp-w:focus-visible{outline:none}
.lp-w:focus-visible .lp-w-ico{outline:3px solid rgba(0,191,165,.6);outline-offset:3px}

/* подпись-плашка слева от кнопки */
.lp-w-tip{position:absolute;right:calc(100% + 14px);top:50%;white-space:nowrap;background:#fff;color:#0f2a33;font:600 15px/1 var(--t-text-font,Arial),sans-serif;letter-spacing:.01em;padding:11px 15px;border-radius:10px;
 box-shadow:0 10px 26px -8px rgba(1,63,84,.35),0 2px 6px rgba(16,24,40,.12);border-left:3px solid var(--c1);opacity:0;visibility:hidden;transform:translate(10px,-50%);transition:opacity .25s ease,transform .3s cubic-bezier(.2,1.2,.4,1),visibility .25s;pointer-events:none}
.lp-w-tip::after{content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;background:#fff;transform:translateY(-50%) rotate(45deg);border-radius:2px;box-shadow:3px -3px 6px -3px rgba(16,24,40,.12)}
.lp-w:hover .lp-w-tip,.lp-w:focus-visible .lp-w-tip,.lp-w.lp-w-peek .lp-w-tip{opacity:1;visibility:visible;transform:translate(0,-50%)}

/* главная (верхняя) кнопка: две расходящиеся волны */
.lp-widgets .lp-w:first-child .lp-w-ico::before,.lp-widgets .lp-w:first-child .lp-w-ico::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--c1);opacity:0;animation:lp-w-wave 3.5s cubic-bezier(.2,.6,.3,1) infinite;animation-delay:1.8s;pointer-events:none}
.lp-widgets .lp-w:first-child .lp-w-ico::after{animation-delay:2.25s}
@keyframes lp-w-wave{0%{transform:scale(1);opacity:.75}55%{transform:scale(1.75);opacity:0}100%{transform:scale(1.75);opacity:0}}

/* иконки двигаются по-своему */
.lp-w-call svg{animation:lp-w-ring 3.5s ease-in-out infinite;animation-delay:1.8s}
@keyframes lp-w-ring{0%,62%,100%{transform:rotate(0)}66%{transform:rotate(-16deg)}70%{transform:rotate(14deg)}74%{transform:rotate(-12deg)}78%{transform:rotate(10deg)}82%{transform:rotate(-6deg)}86%{transform:rotate(0)}}
.lp-w-chat .lp-w-d1,.lp-w-chat .lp-w-d2,.lp-w-chat .lp-w-d3{stroke-width:3.2;animation:lp-w-dot 1.6s ease-in-out infinite}
.lp-w-chat .lp-w-d2{animation-delay:.2s}.lp-w-chat .lp-w-d3{animation-delay:.4s}
@keyframes lp-w-dot{0%,60%,100%{opacity:.35}30%{opacity:1}}
.lp-w-chat .lp-w-ico{animation:lp-w-bob 4.2s ease-in-out infinite;animation-delay:2.4s}
@keyframes lp-w-bob{0%,78%,100%{transform:none}84%{transform:translateY(-5px)}90%{transform:translateY(0)}94%{transform:translateY(-2px)}}
.lp-w-max img{animation:lp-w-nod 4.6s ease-in-out infinite;animation-delay:3s}
@keyframes lp-w-nod{0%,70%,100%{transform:none}75%{transform:rotate(-12deg) scale(1.08)}81%{transform:rotate(8deg) scale(1.04)}87%{transform:rotate(-3deg)}92%{transform:none}}
.lp-w:hover .lp-w-ico{animation-play-state:paused}

@media(max-width:768px){
 .lp-widgets{right:14px;bottom:calc(88px + env(safe-area-inset-bottom));gap:11px}
 .lp-widgets.lp-w-raise{bottom:calc(158px + env(safe-area-inset-bottom))}
 .lp-w-ico{width:54px;height:54px}
 .lp-w-ico svg{width:24px;height:24px}
 .lp-w-ico img{width:31px;height:31px}
 .lp-w-tip{font-size:14px;padding:9px 12px}
 .lp-w:hover .lp-w-tip{opacity:0;visibility:hidden}
 .lp-w.lp-w-peek .lp-w-tip{opacity:1;visibility:visible}
}
@media(prefers-reduced-motion:reduce){
 .lp-w{animation:none;opacity:1;transform:none}
 .lp-w-ico,.lp-w svg,.lp-w img,.lp-w-chat path,.lp-w-ico::before,.lp-w-ico::after{animation:none!important}
 .lp-w-ico{transition:none}
}
@media print{.lp-widgets{display:none}}