@keyframes cmin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cmdot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.cm-in{animation:cmin .45s cubic-bezier(.2,.7,.2,1) both}
.cm-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;animation:cmdot 1.2s ease-in-out infinite}
.cm-dot:nth-child(2){animation-delay:.15s}.cm-dot:nth-child(3){animation-delay:.3s}
.cm-chip{cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.cm-chip:hover{transform:translateY(-1px)}
.cm-scroll{scrollbar-width:thin}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.lift{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.lift:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(7,49,109,.12)}
@media (prefers-reduced-motion: reduce){.cm-in,.cm-dot{animation:none}}
@keyframes au{0%{opacity:0;transform:translateX(-10px)}6%,82%{opacity:1;transform:none}92%,100%{opacity:0;transform:none}}
.au{opacity:0;animation:au 6s ease-out infinite}
@keyframes bar{0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)}}
.bar{transform-origin:bottom;animation:bar 3.2s ease-in-out infinite}
@keyframes conv{0%{transform:translateX(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(var(--d));opacity:0}}
.conv{animation:conv 3s ease-in infinite}
@keyframes flowp{0%{left:0%}100%{left:100%}}
.flowp{position:absolute;top:-3px;width:8px;height:8px;border-radius:50%;background:#1C9DE0;box-shadow:0 0 10px #1C9DE0;animation:flowp 2.6s linear infinite}
@media (prefers-reduced-motion: reduce){.au{animation:none;opacity:1}.bar,.conv,.flowp{animation:none}}

@keyframes flt{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.flt{animation:flt 8s ease-in-out infinite}
.flt:first-child{animation-duration:10s}
@media (prefers-reduced-motion: reduce){.flt{animation:none}}
/* ---------- chat demo (lo arma public/js/automatizacion.js) ---------- */
.cm-bot{align-self:flex-start;max-width:86%;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.cm-bot-text{padding:11px 14px;border-radius:16px 16px 16px 4px;background:#FFFFFF;border:1px solid #E3E9F2;font-size:15px;line-height:1.5;color:#0B1730}
.cm-me{align-self:flex-end;max-width:80%;padding:11px 14px;border-radius:16px 16px 4px 16px;background:linear-gradient(135deg,#0558B0,#0277D0);font-size:15px;line-height:1.5;color:#FFFFFF}
.cm-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:500}
.cm-tag.data{background:#E6F1FC;color:#0558B0}.cm-tag.task{background:#E3F4EA;color:#1E6E40}.cm-tag.human{background:#FFF1E0;color:#9A4B00}
.cm-typing{align-self:flex-start;display:inline-flex;gap:5px;padding:13px 14px;border-radius:16px;background:#FFFFFF;border:1px solid #E3E9F2;color:#8A96A8}
.cm-chips{display:flex;flex-wrap:wrap;gap:8px;padding:4px 18px 12px;align-items:center;font-size:13px;color:#5F6A7D}
.cm-chip{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid #C9DCF3;background:#FFFFFF;color:#0558B0;font-family:inherit;font-size:13.5px;font-weight:500}
.cm-chip:disabled{opacity:.5;cursor:default}
/* ---------- móvil ---------- */
@media (max-width:600px){
  #automatizacion>div{padding:56px 20px 72px!important;gap:40px!important}
  #demo{height:560px!important}
  #mensajeria>div,#crm>div{padding:72px 20px!important;gap:40px!important}
  #mensajeria article{padding:26px!important}
  #crm .flt[style*="left: -28px"]{left:8px!important;bottom:-8px!important}
  #crm .flt[style*="right: -18px"]{right:8px!important;top:-10px!important}
  section>div[style*="padding: 112px 24px"]{padding:72px 20px!important}
  section[style*="padding: 0 24px 112px"]{padding:0 20px 72px!important}
  section[style*="padding: 0 24px 112px"]>div{padding:32px 24px!important}
}