{"id":48,"date":"2023-08-04T04:55:25","date_gmt":"2023-08-04T04:55:25","guid":{"rendered":"https:\/\/vchat.com.mx\/?page_id=48"},"modified":"2026-10-22T20:22:56","modified_gmt":"2026-10-23T02:22:56","slug":"inicio","status":"publish","type":"page","link":"https:\/\/vchat.com.mx\/pt\/","title":{"rendered":"Vchat \u2013 Chat AI Multim\u00eddia"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"48\" class=\"elementor elementor-48\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3aabf02 e-con-full e-flex e-con e-parent\" data-id=\"3aabf02\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4000fc0 elementor-widget elementor-widget-html\" data-id=\"4000fc0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!--\nVCHAT HOME V8.1 \u2014 Motion Edition + Partners + Agency Hub \u00b7 Elementor HTML Widget\nSIN HEADER \/ SIN FOOTER. Pensado para convivir con header sticky externo.\nPega todo este bloque en UN solo widget HTML de Elementor.\n-->\n<div id=\"vch8\" class=\"vc8\">\n<style>\n@property --vc8a{syntax:\"<angle>\";inherits:false;initial-value:0deg}\n#vch8{\n  --ink:#0b1433;--ink-2:#182244;--text:#5f6a88;--muted:#8993ad;--line:#e5e9f4;--soft:#f7f8ff;\n  --violet:#6754f6;--violet-2:#8d62ff;--blue:#3d8cff;--cyan:#2fc8f2;--green:#19a873;\n  --grad:linear-gradient(135deg,#7656f8 0%,#5a66f6 50%,#31baf2 100%);\n  --gradLoop:linear-gradient(100deg,#7656f8,#5a66f6,#31baf2,#8d62ff,#7656f8);\n  --grad-soft:linear-gradient(135deg,rgba(118,86,248,.12),rgba(49,186,242,.10));\n  --shadow:0 26px 70px rgba(28,38,84,.11);--shadow-sm:0 12px 34px rgba(28,38,84,.08);\n  --ease:cubic-bezier(.22,.8,.2,1);--max:1240px;\n  position:relative;isolation:isolate;width:100%;overflow:hidden;margin-top:0!important;padding-top:0!important;\n  background-color:#fff;\n  background-image:radial-gradient(circle at 7% 2%,rgba(123,86,248,.13),transparent 27rem),radial-gradient(circle at 94% 9%,rgba(47,200,242,.12),transparent 28rem),linear-gradient(rgba(103,84,246,.032) 1px,transparent 1px),linear-gradient(90deg,rgba(103,84,246,.032) 1px,transparent 1px);\n  background-size:auto,auto,48px 48px,48px 48px;background-position:center,center,-1px -1px,-1px -1px;\n  color:var(--ink)!important;font-family:Inter,Manrope,\"SF Pro Display\",\"Segoe UI\",Arial,sans-serif;\n  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;\n}\n#vch8 *,#vch8 *::before,#vch8 *::after{box-sizing:border-box}\n#vch8 img{display:block;max-width:100%;height:auto}\n#vch8 a{color:inherit;text-decoration:none}\n#vch8 h1,#vch8 h2,#vch8 h3,#vch8 p{font-family:inherit!important;text-transform:none!important}\n#vch8 a:focus-visible,#vch8 button:focus-visible{outline:2px solid var(--violet)!important;outline-offset:3px}\n#vch8 .vc8-wrap{position:relative;z-index:1;width:min(calc(100% - 40px),var(--max));margin:0 auto}\n#vch8 .vc8-section{position:relative;padding:84px 0;scroll-margin-top:118px}\n#vch8 .vc8-center{text-align:center}\n\n\/* ---------- Botones: blindaje contra estilos del tema ---------- *\/\n#vch8 button,#vch8 button:hover,#vch8 button:focus,#vch8 button:active{\n  font-family:inherit!important;text-transform:none!important;letter-spacing:normal!important;text-decoration:none!important;\n  -webkit-appearance:none!important;appearance:none!important;cursor:pointer;\n}\n\n\/* ---------- Reveal (desenfoque breve) ---------- *\/\n#vch8 [data-r]{--rt:opacity .7s var(--ease) var(--d,0ms),transform .85s var(--ease) var(--d,0ms),filter .28s ease-out var(--d,0ms)}\n:where(#vch8.vc8-js [data-r]){transition:var(--rt)}\n#vch8.vc8-js [data-r]{opacity:0;transform:translateY(24px);filter:blur(3px)}\n#vch8.vc8-js [data-r].is-in{opacity:1;transform:none;filter:none}\n\n#vch8 .vc8-progress{position:fixed;left:0;top:0;z-index:99999;width:100%;height:3px;transform:scaleX(0);transform-origin:0 50%;background:var(--gradLoop);background-size:200% 100%;animation:vc8Grad 6s linear infinite;pointer-events:none}\n\n\/* ---------- Tipograf\u00eda ---------- *\/\n#vch8 .vc8-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--violet)!important;font-size:12px!important;font-weight:900!important;letter-spacing:.16em!important;text-transform:uppercase!important;margin:0 0 14px!important}\n#vch8 .vc8-kicker::before{content:\"\";width:22px;height:2px;border-radius:99px;background:var(--grad)}\n#vch8 .vc8-title{margin:0!important;color:var(--ink)!important;font-size:clamp(34px,4.3vw,56px)!important;line-height:1!important;letter-spacing:-.052em!important;font-weight:880!important}\n#vch8 .vc8-title--sm{font-size:clamp(30px,3.5vw,46px)!important}\n#vch8 .vc8-copy{margin:18px 0 0!important;color:var(--text)!important;font-size:17px!important;line-height:1.65!important}\n#vch8 .vc8-center .vc8-copy{max-width:760px;margin-left:auto!important;margin-right:auto!important}\n#vch8 .vc8-grad{background:var(--gradLoop);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;animation:vc8Grad 7s linear infinite}\n\n\/* ---------- Botones ---------- *\/\n#vch8 .vc8-btn{position:relative;overflow:hidden;isolation:isolate;min-height:52px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:14px;border:0;font-size:15px!important;font-weight:850!important;line-height:1!important;white-space:nowrap;transform:translate3d(var(--bx,0px),var(--by,0px),0);transition:transform .4s var(--ease),box-shadow .4s var(--ease),background .3s}\n#vch8 .vc8-btn--primary{background:var(--grad)!important;color:#fff!important;box-shadow:0 12px 28px rgba(91,92,245,.24)}\n#vch8 .vc8-btn--primary::after{content:\"\";position:absolute;top:-40%;left:-60%;width:34%;height:180%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transition:left .8s var(--ease)}\n#vch8 .vc8-btn--primary:hover{box-shadow:0 18px 40px rgba(91,92,245,.34)}\n#vch8 .vc8-btn--primary:hover::after{left:125%}\n#vch8 .vc8-btn--secondary{background:#fff!important;color:var(--ink)!important;border:1px solid var(--line)!important;box-shadow:0 8px 22px rgba(28,38,84,.06)}\n#vch8 .vc8-btn--secondary:hover{border-color:rgba(103,84,246,.28)!important}\n#vch8 .vc8-btn--tertiary{background:rgba(103,84,246,.07)!important;color:#5849dd!important;border:1px solid rgba(103,84,246,.14)!important;box-shadow:none!important}\n#vch8 .vc8-mini-btn{min-height:40px;padding:0 13px;display:inline-flex;align-items:center;justify-content:center;border-radius:11px;border:1px solid var(--line);background:#fff!important;color:var(--ink)!important;font-size:12px!important;font-weight:830!important;white-space:nowrap;transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}\n#vch8 .vc8-mini-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(28,38,84,.08)}\n#vch8 .vc8-mini-btn--primary{border-color:transparent!important;background:var(--grad)!important;color:#fff!important;box-shadow:0 8px 20px rgba(91,92,245,.17)}\n#vch8 .vc8-mini-btn--violet{border-color:rgba(103,84,246,.16)!important;background:rgba(103,84,246,.07)!important;color:#5849dd!important}\n#vch8 .vc8-chip{display:inline-flex;margin-top:14px;padding:7px 9px;border-radius:999px;background:#f2f4ff;color:#6254e7!important;font-size:11px!important;font-weight:850!important}\n\n\/* =========================================================\n   HERO\n========================================================= *\/\n#vch8 .vc8-hero{position:relative;padding:96px 0 34px}\n#vch8 .vc8-hero::before{content:\"\";position:absolute;left:-8%;top:4%;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(118,86,248,.16),transparent 68%);animation:vc8Drift 14s ease-in-out infinite alternate;pointer-events:none}\n#vch8 .vc8-hero::after{content:\"\";position:absolute;right:-10%;bottom:-14%;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(47,200,242,.14),transparent 68%);animation:vc8Drift 17s ease-in-out infinite alternate-reverse;pointer-events:none}\n#vch8 .vc8-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center}\n#vch8 .vc8-badge{display:inline-flex;align-items:center;gap:9px;padding:9px 13px;margin-bottom:20px;background:#fff;border:1px solid rgba(103,84,246,.16);border-radius:999px;box-shadow:0 10px 24px rgba(28,38,84,.06);color:#4e5878!important;font-size:13px!important;font-weight:800!important}\n#vch8 .vc8-badge i{position:relative;width:8px;height:8px;border-radius:50%;background:var(--grad);display:inline-block}\n#vch8 .vc8-badge i::after{content:\"\";position:absolute;inset:-5px;border-radius:50%;border:1px solid rgba(103,84,246,.5);animation:vc8Halo 2.2s ease-out infinite}\n#vch8 .vc8-hero h2{margin:0!important;color:var(--ink)!important;font-size:clamp(46px,6.2vw,84px)!important;line-height:.93!important;letter-spacing:-.066em!important;font-weight:900!important;max-width:760px}\n#vch8 .vc8-w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .03em .1em 0;margin-bottom:-.1em}\n#vch8 .vc8-w>span{display:inline-block}\n#vch8.vc8-js .vc8-w>span{transform:translateY(110%) rotate(4deg);transition:transform 1.05s var(--ease);transition-delay:calc(var(--i,0)*65ms + 100ms)}\n#vch8.vc8-js.vc8-ready .vc8-w>span{transform:none}\n#vch8 .vc8-hola{position:relative}\n#vch8 .vc8-hola::after{content:\"\";position:absolute;left:.05em;right:.1em;bottom:.02em;height:.07em;border-radius:99px;background:var(--grad);transform:scaleX(0);transform-origin:0 50%;transition:transform .9s var(--ease) 1.1s}\n#vch8.vc8-ready .vc8-hola::after{transform:scaleX(1)}\n#vch8 .vc8-hero-lead{margin:24px 0 0!important;color:var(--text)!important;font-size:clamp(17px,1.6vw,20px)!important;line-height:1.6!important;max-width:640px}\n#vch8 .vc8-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}\n#vch8 .vc8-note{margin-top:12px;color:var(--muted)!important;font-size:12px!important;font-weight:650!important}\n#vch8 .vc8-login-note{margin-top:6px;color:var(--muted)!important;font-size:12px!important}\n#vch8 .vc8-login-note a{color:#5b4de2!important;font-weight:850!important}\n#vch8 .vc8-trust{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:24px;padding-top:20px;border-top:1px dashed rgba(103,84,246,.18)}\n#vch8 .vc8-trust>span{color:var(--muted)!important;font-size:11px!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;margin-right:4px}\n#vch8 .vc8-ch{display:inline-flex;align-items:center;gap:7px;padding:7px 11px 7px 8px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink-2)!important;font-size:12px!important;font-weight:750!important;box-shadow:0 6px 16px rgba(28,38,84,.04);transition:transform .3s var(--ease),border-color .3s}\n#vch8 .vc8-ch:hover{transform:translateY(-2px);border-color:rgba(103,84,246,.3)}\n#vch8 .vc8-ch img,#vch8 .vc8-ch svg{width:16px;height:16px}\n\n\/* Visual del hero *\/\n#vch8 .vc8-stage{position:relative;padding:22px 0 22px 34px}\n#vch8 .vc8-visual{position:relative;padding:12px;border-radius:28px;background:#fff;box-shadow:0 40px 90px rgba(28,38,84,.16);transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .8s var(--ease)}\n#vch8 .vc8-visual::before{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--vc8a),rgba(118,86,248,.65),rgba(49,186,242,.55),rgba(141,98,255,.25),rgba(118,86,248,.65));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:vc8Ang 6s linear infinite}\n#vch8 .vc8-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 12px}\n#vch8 .vc8-bar i{width:9px;height:9px;border-radius:50%;background:#ff8fa3}\n#vch8 .vc8-bar i:nth-child(2){background:#ffd166}\n#vch8 .vc8-bar i:nth-child(3){background:#4cd6a5}\n#vch8 .vc8-bar span{margin-left:10px;flex:1;max-width:260px;height:22px;border-radius:7px;background:#f3f5fc;color:#8993ad!important;font-size:10.5px!important;font-weight:700!important;display:flex;align-items:center;padding:0 10px}\n#vch8 .vc8-visual-img{position:relative;overflow:hidden;border-radius:16px}\n#vch8 .vc8-visual-img img{width:100%}\n#vch8 .vc8-visual-img::after{content:\"\";position:absolute;left:0;right:0;top:0;height:30%;background:linear-gradient(180deg,transparent,rgba(118,86,248,.10) 70%,rgba(49,186,242,.25) 98%,transparent);animation:vc8Scan 6s cubic-bezier(.45,0,.55,1) infinite;pointer-events:none}\n\n\/* Canales entrando *\/\n#vch8 .vc8-feed{position:absolute;left:-6px;top:18%;z-index:4;display:grid;gap:9px}\n#vch8 .vc8-in{display:flex;align-items:center;gap:9px;width:max-content;padding:8px 13px 8px 8px;border-radius:14px;background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:0 14px 30px rgba(28,38,84,.12);backdrop-filter:blur(8px);font-size:12px!important;font-weight:800!important;color:var(--ink)!important;opacity:0;transform:translateX(-22px) scale(.96);animation:vc8In 8s var(--ease) infinite;animation-delay:calc(var(--i)*2s)}\n#vch8 .vc8-in b{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--c)}\n#vch8 .vc8-in b img{width:16px;height:16px}\n#vch8 .vc8-in small{display:block;color:var(--muted)!important;font-size:10px!important;font-weight:650!important}\n#vch8 .vc8-in em{margin-left:4px;width:7px;height:7px;border-radius:50%;background:#19a873;box-shadow:0 0 0 0 rgba(25,168,115,.6);animation:vc8Ping 1.6s ease-out infinite}\n\n\/* Tarjetas flotantes *\/\n#vch8 .vc8-float{position:absolute;z-index:5;padding:13px 14px;border-radius:16px;background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:0 20px 44px rgba(28,38,84,.14);backdrop-filter:blur(10px)}\n#vch8 .vc8-float small{display:block;color:var(--muted)!important;font-size:9.5px!important;font-weight:850!important;letter-spacing:.1em;text-transform:uppercase}\n#vch8 .vc8-float strong{display:block;margin-top:3px;color:var(--ink)!important;font-size:13px!important;font-weight:850!important}\n#vch8 .vc8-float--ai{right:-14px;top:6px;width:212px;animation:vc8Bob 6s ease-in-out infinite}\n#vch8 .vc8-toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;padding:8px 10px;border-radius:11px;background:#f6f7ff}\n#vch8 .vc8-toggle span{font-size:11.5px!important;font-weight:800!important;color:var(--ink-2)!important}\n#vch8 .vc8-sw{position:relative;width:38px;height:22px;border-radius:99px;background:#d9ddef;transition:background .4s}\n#vch8 .vc8-sw::after{content:\"\";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:transform .45s var(--ease)}\n#vch8 .vc8-float--ai.on .vc8-sw{background:var(--grad)}\n#vch8 .vc8-float--ai.on .vc8-sw::after{transform:translateX(16px)}\n#vch8 .vc8-ai-state{display:block;margin-top:7px;color:var(--text)!important;font-size:11px!important;line-height:1.4!important}\n#vch8 .vc8-float--crm{right:8%;bottom:-6px;width:236px;animation:vc8Bob 7s ease-in-out infinite reverse}\n#vch8 .vc8-pipe{display:flex;align-items:center;gap:5px;margin-top:10px}\n#vch8 .vc8-pipe i{flex:1;height:6px;border-radius:99px;background:#eceff9;position:relative;overflow:hidden}\n#vch8 .vc8-pipe i::after{content:\"\";position:absolute;inset:0;background:var(--grad);transform:scaleX(0);transform-origin:0 50%;animation:vc8Pipe 6s var(--ease) infinite;animation-delay:calc(var(--i)*.9s)}\n#vch8 .vc8-pipe-l{display:flex;justify-content:space-between;margin-top:6px;color:var(--muted)!important;font-size:9.5px!important;font-weight:750!important}\n\n\/* =========================================================\n   PILARES\n========================================================= *\/\n#vch8 .vc8-pillars-sec{padding:20px 0 52px}\n#vch8 .vc8-pillars{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:14px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-sm);backdrop-filter:blur(10px)}\n#vch8 .vc8-pillar{position:relative;min-height:112px;padding:18px 18px 16px;border-radius:16px;background:rgba(250,251,255,.9);border:1px solid transparent;overflow:hidden;transition:border-color .5s,background .5s,box-shadow .5s,transform .5s var(--ease)}\n#vch8 .vc8-pillar b{display:flex;align-items:center;gap:9px;margin:0 0 7px;color:var(--ink)!important;font-size:15px!important;font-weight:850!important}\n#vch8 .vc8-pillar b i{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--grad-soft);color:var(--violet)!important;font-style:normal;font-size:11px!important;font-weight:900!important;transition:background .5s,color .5s}\n#vch8 .vc8-pillar span{display:block;color:var(--text)!important;font-size:13px!important;line-height:1.5!important}\n#vch8 .vc8-pillar::after{content:\"\";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--grad);transform:scaleX(0);transform-origin:0 50%}\n#vch8 .vc8-pillar.on{background:#fff;border-color:rgba(103,84,246,.24);box-shadow:0 14px 34px rgba(28,38,84,.09);transform:translateY(-3px)}\n#vch8 .vc8-pillar.on b i{background:var(--grad);color:#fff!important}\n#vch8 .vc8-pillar.on::after{animation:vc8Fill 2.4s linear forwards}\n\n#vch8 .vc8-cta-strip{margin-top:16px;padding:17px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid rgba(103,84,246,.13);border-radius:18px;background:radial-gradient(circle at 90% 20%,rgba(47,200,242,.10),transparent 15rem),linear-gradient(135deg,rgba(255,255,255,.96),rgba(247,248,255,.94));box-shadow:0 12px 32px rgba(28,38,84,.06)}\n#vch8 .vc8-cta-strip strong{display:block;color:var(--ink)!important;font-size:14px!important;font-weight:850!important;margin-bottom:3px}\n#vch8 .vc8-cta-strip span{display:block;color:var(--text)!important;font-size:12px!important;line-height:1.45!important}\n#vch8 .vc8-strip-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}\n\n\/* =========================================================\n   FUNCIONES (filtrables)\n========================================================= *\/\n#vch8 .vc8-feature-zone{background-color:#f7f9ff;background-image:radial-gradient(rgba(103,84,246,.12) 1px,transparent 1px),linear-gradient(145deg,rgba(118,86,248,.05),rgba(49,186,242,.035));background-size:24px 24px,auto;border-top:1px solid #eef1f8;border-bottom:1px solid #eef1f8}\n#vch8 .vc8-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:28px}\n#vch8 button.vc8-filter,#vch8 button.vc8-filter:focus,#vch8 button.vc8-filter:active{min-height:40px!important;padding:0 15px!important;margin:0!important;border-radius:999px!important;border:1px solid var(--line)!important;background:#fff!important;color:#65708f!important;font-size:13px!important;font-weight:820!important;box-shadow:none!important;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease)}\n#vch8 button.vc8-filter:hover{min-height:40px!important;padding:0 15px!important;border-radius:999px!important;border:1px solid rgba(103,84,246,.32)!important;background:#fff!important;color:var(--violet)!important;transform:translateY(-1px)}\n#vch8 button.vc8-filter.is-active,#vch8 button.vc8-filter.is-active:hover,#vch8 button.vc8-filter.is-active:focus{background:var(--grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 24px rgba(89,93,246,.2)!important}\n#vch8 button.vc8-filter sup{margin-left:5px;font-size:10px!important;opacity:.7}\n#vch8 .vc8-feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:26px}\n#vch8 .vc8-card{position:relative;overflow:hidden;isolation:isolate;min-height:196px;padding:20px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 10px 28px rgba(28,38,84,.045);transition:var(--rt,opacity 0s),box-shadow .4s,border-color .4s,opacity .35s,transform .45s var(--ease)}\n#vch8 .vc8-card::before{content:\"\";position:absolute;inset:0;z-index:-1;opacity:0;background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),rgba(103,84,246,.09),transparent 60%);transition:opacity .4s}\n#vch8 .vc8-card:hover{box-shadow:var(--shadow-sm);border-color:rgba(103,84,246,.24)}\n#vch8 .vc8-card:hover::before{opacity:1}\n#vch8 .vc8-card.out{display:none}\n#vch8 .vc8-card.pop{animation:vc8CardIn .55s var(--ease) both;animation-delay:var(--fd,0ms)}\n#vch8 .vc8-card-icon{width:42px;height:42px;display:grid;place-items:center;margin-bottom:18px;border-radius:13px;background:var(--grad-soft);color:var(--violet)!important;font-size:15px!important;font-weight:900!important;transition:background .4s,color .4s,transform .5s var(--ease)}\n#vch8 .vc8-card:hover .vc8-card-icon{background:var(--grad);color:#fff!important;transform:rotate(-6deg) scale(1.06)}\n#vch8 .vc8-card h3{margin:0 0 8px!important;color:var(--ink)!important;font-size:18px!important;line-height:1.2!important;font-weight:850!important;letter-spacing:-.02em!important}\n#vch8 .vc8-card p{margin:0!important;color:var(--text)!important;font-size:13px!important;line-height:1.58!important}\n#vch8 .vc8-swipe{display:none;margin:2px 0 0!important;color:var(--muted)!important;font-size:11px!important;font-weight:800!important;letter-spacing:.06em;text-transform:uppercase!important}\n#vch8 .vc8-feature-cta{position:relative;overflow:hidden;margin-top:26px;padding:24px 26px;border-radius:22px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px;background:linear-gradient(135deg,rgba(20,27,68,.98),rgba(47,48,115,.98));box-shadow:0 20px 48px rgba(25,31,79,.18)}\n#vch8 .vc8-feature-cta::before{content:\"\";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(49,186,242,.3),transparent 65%);animation:vc8Drift 10s ease-in-out infinite alternate}\n#vch8 .vc8-feature-cta h3{position:relative;margin:0 0 5px!important;color:#fff!important;font-size:21px!important;font-weight:870!important;letter-spacing:-.025em!important}\n#vch8 .vc8-feature-cta h3 b{color:#7fd5ff!important;font-variant-numeric:tabular-nums}\n#vch8 .vc8-feature-cta p{position:relative;margin:0!important;color:#cbd1e8!important;font-size:13px!important;line-height:1.5!important}\n#vch8 .vc8-feature-cta .vc8-strip-actions{position:relative}\n#vch8 .vc8-feature-cta .vc8-mini-btn{border-color:rgba(255,255,255,.15)!important;background:rgba(255,255,255,.08)!important;color:#fff!important}\n#vch8 .vc8-feature-cta .vc8-mini-btn--primary{background:var(--grad)!important;border-color:transparent!important}\n\n\/* =========================================================\n   SHOWCASE\n========================================================= *\/\n#vch8 .vc8-show-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:30px;align-items:end;margin-bottom:26px}\n#vch8 .vc8-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}\n#vch8 button.vc8-tab,#vch8 button.vc8-tab:focus,#vch8 button.vc8-tab:active{position:relative;overflow:hidden;min-height:42px!important;padding:0 14px!important;margin:0!important;border-radius:12px!important;border:1px solid var(--line)!important;background:#fff!important;color:#65708f!important;font-size:13px!important;font-weight:820!important;box-shadow:none!important;transition:background .3s,color .3s,border-color .3s}\n#vch8 button.vc8-tab:hover{min-height:42px!important;padding:0 14px!important;border-radius:12px!important;border:1px solid rgba(103,84,246,.3)!important;background:#fff!important;color:var(--violet)!important}\n#vch8 button.vc8-tab.is-active,#vch8 button.vc8-tab.is-active:hover,#vch8 button.vc8-tab.is-active:focus{background:var(--grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 24px rgba(89,93,246,.18)!important}\n#vch8 button.vc8-tab::after{content:\"\";position:absolute;left:0;bottom:0;height:3px;width:100%;background:rgba(255,255,255,.75);transform:scaleX(0);transform-origin:0 50%}\n#vch8 button.vc8-tab.is-active.auto::after{animation:vc8Fill var(--dur,5500ms) linear forwards}\n#vch8 .vc8-show{position:relative;padding:12px;border-radius:28px;background:#fff;box-shadow:var(--shadow)}\n#vch8 .vc8-show::before{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--vc8a),rgba(118,86,248,.45),rgba(49,186,242,.4),rgba(118,86,248,.12),rgba(118,86,248,.45));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:vc8Ang 8s linear infinite}\n#vch8 .vc8-show-img{position:relative;overflow:hidden;border-radius:18px;background:#f6f7fb;aspect-ratio:1777\/885}\n#vch8 .vc8-show-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.03);transition:opacity .6s ease,transform 1.2s var(--ease)}\n#vch8 .vc8-show-img img.on{opacity:1;transform:none}\n#vch8 .vc8-show-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:20px 8px 8px;transition:opacity .3s,transform .3s var(--ease)}\n#vch8 .vc8-show-meta.swap{opacity:0;transform:translateY(6px)}\n#vch8 .vc8-show-meta h3{margin:0 0 6px!important;color:var(--ink)!important;font-size:23px!important;font-weight:860!important}\n#vch8 .vc8-show-meta p{margin:0!important;color:var(--text)!important;font-size:14px!important;line-height:1.6!important}\n#vch8 .vc8-show-meta .vc8-chip{margin-top:0}\n\n\/* =========================================================\n   AI (oscuro)\n========================================================= *\/\n#vch8 .vc8-dark{background:radial-gradient(circle at 12% 10%,rgba(94,101,255,.24),transparent 32rem),radial-gradient(circle at 92% 80%,rgba(47,200,242,.15),transparent 28rem),linear-gradient(145deg,#0b1435,#111844 58%,#171d4d);color:#fff!important;overflow:hidden}\n#vch8 .vc8-dark::before{content:\"\";position:absolute;inset:0;opacity:.5;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 70%);pointer-events:none}\n#vch8 .vc8-dark .vc8-title{color:#fff!important}\n#vch8 .vc8-dark .vc8-copy{color:#bdc5dd!important}\n#vch8 .vc8-dark .vc8-kicker{color:#92b7ff!important}\n#vch8 .vc8-dark-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:42px;align-items:center;margin-top:38px}\n#vch8 .vc8-dark-cards{display:grid;gap:12px}\n#vch8 .vc8-dark-card{position:relative;overflow:hidden;display:grid;grid-template-columns:34px 1fr;gap:13px;padding:17px 18px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(255,255,255,.05);transition:var(--rt,opacity 0s),background .5s,border-color .5s,transform .5s var(--ease)}\n#vch8 .vc8-dark-card i{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.08);font-style:normal;font-size:15px;transition:background .5s}\n#vch8 .vc8-dark-card b{display:block;color:#fff!important;font-size:15px!important;margin-bottom:4px}\n#vch8 .vc8-dark-card span{display:block;color:#aeb8d4!important;font-size:13px!important;line-height:1.5!important}\n#vch8 .vc8-dark-card::after{content:\"\";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,#8e73ff,#52c4ff);transform:scaleX(0);transform-origin:0 50%}\n#vch8 .vc8-dark-card.on{background:rgba(255,255,255,.10);border-color:rgba(146,183,255,.35);transform:translateX(6px)}\n#vch8 .vc8-dark-card.on i{background:linear-gradient(135deg,#7656f8,#31baf2)}\n#vch8 .vc8-dark-card.on::after{animation:vc8Fill 3s linear forwards}\n#vch8 .vc8-dark-image{position:relative;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:rgba(255,255,255,.06);box-shadow:0 40px 90px rgba(0,0,0,.35);transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:var(--rt,opacity 0s),transform .8s var(--ease)}\n#vch8 .vc8-dark-image>div{position:relative;overflow:hidden;border-radius:16px}\n#vch8 .vc8-dark-image img{width:100%}\n#vch8 .vc8-dark-image>div::after{content:\"\";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.18) 45%,transparent 60%);transform:translateX(-100%);animation:vc8Sheen 5s ease-in-out infinite}\n#vch8 .vc8-shield{position:absolute;left:-16px;bottom:22px;z-index:3;display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 18px 40px rgba(0,0,0,.3);animation:vc8Bob 6s ease-in-out infinite}\n#vch8 .vc8-shield i{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--grad);color:#fff;font-style:normal;font-size:14px}\n#vch8 .vc8-shield b{display:block;color:var(--ink)!important;font-size:12.5px!important;font-weight:850!important}\n#vch8 .vc8-shield small{display:block;color:var(--muted)!important;font-size:10.5px!important}\n\n\/* =========================================================\n   AUTOMATIZACIONES\n========================================================= *\/\n#vch8 .vc8-split{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:48px;align-items:center}\n#vch8 .vc8-flow{position:relative;display:grid;gap:10px;margin-top:26px;padding-left:22px}\n#vch8 .vc8-flow::before{content:\"\";position:absolute;left:6px;top:14px;bottom:14px;width:2px;border-radius:99px;background:#e6e9f6}\n#vch8 .vc8-flow-dot{position:absolute;left:1px;top:14px;width:12px;height:12px;border-radius:50%;background:var(--grad);box-shadow:0 0 0 5px rgba(103,84,246,.14),0 0 16px rgba(49,186,242,.6);transition:top .8s var(--ease)}\n#vch8 .vc8-step{position:relative;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:var(--rt,opacity 0s),border-color .5s,box-shadow .5s,transform .5s var(--ease)}\n#vch8 .vc8-step b{display:flex;align-items:center;gap:8px;color:var(--ink)!important;font-size:13.5px!important;margin-bottom:4px}\n#vch8 .vc8-step b em{font-style:normal;padding:3px 7px;border-radius:7px;background:#f2f4ff;color:#6254e7!important;font-size:10px!important;font-weight:900!important;letter-spacing:.06em;text-transform:uppercase;transition:background .5s,color .5s}\n#vch8 .vc8-step span{display:block;color:var(--text)!important;font-size:12.5px!important;line-height:1.45!important}\n#vch8 .vc8-step.on{border-color:rgba(103,84,246,.3);box-shadow:0 14px 30px rgba(28,38,84,.08);transform:translateX(4px)}\n#vch8 .vc8-step.on b em{background:var(--grad);color:#fff!important}\n#vch8 .vc8-split-media{position:relative;padding:10px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow);transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:var(--rt,opacity 0s),transform .8s var(--ease)}\n#vch8 .vc8-split-media img{width:100%;border-radius:16px}\n\n\/* =========================================================\n   VCHAT + VMAIL\n========================================================= *\/\n#vch8 .vc8-vmail-sec{padding:20px 0 84px}\n#vch8 .vc8-vmail{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:center;padding:44px;border-radius:32px;color:#fff;background:radial-gradient(circle at 12% 0%,rgba(141,98,255,.38),transparent 40%),radial-gradient(circle at 95% 100%,rgba(49,186,242,.28),transparent 42%),linear-gradient(135deg,#120f33,#1d1a54 55%,#272a77);box-shadow:0 36px 90px rgba(25,24,79,.28)}\n#vch8 .vc8-vmail::before{content:\"\";position:absolute;inset:0;z-index:-1;opacity:.35;background-image:radial-gradient(circle,rgba(207,198,243,.6) 1px,transparent 1.4px);background-size:26px 26px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 60%);mask-image:linear-gradient(90deg,transparent,#000 60%)}\n#vch8 .vc8-vmail::after{content:\"\";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--vc8a),#8d62ff,#31baf2,#c18bff,#8d62ff);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.75;animation:vc8Ang 7s linear infinite}\n#vch8 .vc8-vmail .vc8-kicker{color:#b9a5ff!important}\n#vch8 .vc8-vmail .vc8-kicker::before{background:linear-gradient(90deg,#b9a5ff,#7fd5ff)}\n#vch8 .vc8-vmail h2{margin:0!important;color:#fff!important;font-size:clamp(32px,3.6vw,50px)!important;line-height:1!important;letter-spacing:-.05em!important;font-weight:880!important}\n#vch8 .vc8-vmail h2 span{color:transparent!important;-webkit-text-fill-color:transparent;background:linear-gradient(100deg,#c9b8ff,#8fb0ff,#7fd5ff);-webkit-background-clip:text;background-clip:text}\n#vch8 .vc8-vmail p{margin:16px 0 0!important;color:#c9cfe8!important;font-size:15px!important;line-height:1.62!important;max-width:560px}\n#vch8 .vc8-vmail-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}\n#vch8 .vc8-vmail-tags span{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);color:#e6e9f7!important;font-size:12px!important;font-weight:750!important}\n#vch8 .vc8-vmail-tags span::before{content:\"\";width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#c18bff,#31baf2)}\n#vch8 .vc8-vmail-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}\n#vch8 .vc8-vmail .vc8-btn--secondary{background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important;box-shadow:none}\n#vch8 .vc8-vmail .vc8-btn--light{background:#fff!important;color:#1d1a54!important;box-shadow:0 14px 30px rgba(0,0,0,.25)}\n\n\/* Diagrama animado Vchat \u21c4 Vmail *\/\n#vch8 .vc8-link{position:relative;height:340px}\n#vch8 .vc8-link svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}\n#vch8 .vc8-link path{fill:none;stroke:rgba(201,184,255,.35);stroke-width:2;stroke-dasharray:5 8;animation:vc8Dash 6s linear infinite}\n#vch8 .vc8-node{position:absolute;z-index:2;display:flex;align-items:center;gap:12px;width:230px;padding:14px;border-radius:20px;background:rgba(255,255,255,.96);color:var(--ink)!important;box-shadow:0 22px 50px rgba(0,0,0,.35)}\n#vch8 .vc8-node i{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font-style:normal;font-size:22px;color:#fff}\n#vch8 .vc8-node b{display:block;font-size:16px!important;font-weight:880!important;color:var(--ink)!important}\n#vch8 .vc8-node small{display:block;color:var(--muted)!important;font-size:11px!important;font-weight:700!important}\n#vch8 .vc8-node--chat{left:0;top:20px;animation:vc8Bob 6s ease-in-out infinite}\n#vch8 .vc8-node--chat i{background:var(--grad)}\n#vch8 .vc8-node--mail{right:0;bottom:20px;animation:vc8Bob 7s ease-in-out infinite reverse}\n#vch8 .vc8-node--mail i{background:linear-gradient(135deg,#a46bf2,#6b4cf6)}\n#vch8 .vc8-contact{position:absolute;z-index:3;left:50%;top:50%;width:228px;translate:-50% -50%;padding:15px;border-radius:20px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 22px 60px rgba(0,0,0,.3)}\n#vch8 .vc8-contact-top{display:flex;align-items:center;gap:10px}\n#vch8 .vc8-contact-top i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#ffd166,#ff8fa3);font-style:normal;font-size:17px}\n#vch8 .vc8-contact-top b{display:block;color:#fff!important;font-size:13px!important;font-weight:850!important}\n#vch8 .vc8-contact-top small{display:block;color:#b9c1e0!important;font-size:10.5px!important}\n#vch8 .vc8-contact-ch{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}\n#vch8 .vc8-contact-ch span{padding:4px 8px;border-radius:99px;background:rgba(255,255,255,.1);color:#e6e9f7!important;font-size:10px!important;font-weight:750!important;transition:background .4s,color .4s,transform .4s var(--ease)}\n#vch8 .vc8-contact-ch span.on{background:#fff;color:#1d1a54!important;transform:translateY(-2px)}\n#vch8 .vc8-pk{position:absolute;z-index:2;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;display:grid;place-items:center;border-radius:10px;font-size:14px;background:#fff;box-shadow:0 8px 22px rgba(0,0,0,.3);opacity:0;will-change:transform}\n\n\/* =========================================================\n   LEARNING HUB\n========================================================= *\/\n#vch8 .vc8-learning-zone{background:radial-gradient(circle at 8% 15%,rgba(118,86,248,.10),transparent 24rem),radial-gradient(circle at 92% 82%,rgba(47,200,242,.10),transparent 24rem),linear-gradient(180deg,#fbfbff 0%,#f6f8ff 100%);border-top:1px solid #edf0f8;border-bottom:1px solid #edf0f8}\n#vch8 .vc8-learning-shell{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:34px;align-items:stretch;padding:28px;border:1px solid rgba(103,84,246,.13);border-radius:28px;background:rgba(255,255,255,.86);backdrop-filter:blur(12px);box-shadow:0 22px 60px rgba(28,38,84,.08)}\n#vch8 .vc8-learning-intro{padding:10px 4px 10px 2px;display:flex;flex-direction:column;justify-content:center}\n#vch8 .vc8-learning-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}\n#vch8 .vc8-learning-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}\n#vch8 .vc8-learning-card{position:relative;overflow:hidden;isolation:isolate;min-height:168px;padding:18px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(28,38,84,.045);transition:var(--rt,opacity 0s),transform .45s var(--ease),border-color .4s,box-shadow .4s}\n#vch8 .vc8-learning-card::before{content:\"\";position:absolute;inset:0;z-index:-1;opacity:0;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(103,84,246,.09),transparent 60%);transition:opacity .4s}\n#vch8 .vc8-learning-card:hover{transform:translateY(-4px);border-color:rgba(103,84,246,.24);box-shadow:0 16px 38px rgba(28,38,84,.09)}\n#vch8 .vc8-learning-card:hover::before{opacity:1}\n#vch8 .vc8-learning-top{display:flex;align-items:center;gap:12px}\n#vch8 .vc8-learning-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:13px;background:var(--grad-soft);color:var(--violet)!important;font-size:13px!important;font-weight:900!important;transition:background .4s,color .4s}\n#vch8 .vc8-learning-card:hover .vc8-learning-icon{background:var(--grad);color:#fff!important}\n#vch8 .vc8-learning-card h3{margin:0!important;color:var(--ink)!important;font-size:17px!important;line-height:1.15!important;font-weight:870!important;letter-spacing:-.025em!important}\n#vch8 .vc8-learning-card p{margin:7px 0 0!important;color:var(--text)!important;font-size:12.5px!important;line-height:1.52!important}\n#vch8 .vc8-learning-link{display:inline-flex;align-items:center;gap:7px;color:#5b4de2!important;font-size:12px!important;font-weight:880!important}\n#vch8 .vc8-learning-link::after{content:\"\u2192\";transition:transform .3s var(--ease)}\n#vch8 .vc8-learning-card:hover .vc8-learning-link::after{transform:translateX(4px)}\n#vch8 .vc8-learning-note{margin-top:18px;padding:12px 14px;border-radius:14px;background:linear-gradient(135deg,rgba(103,84,246,.07),rgba(47,200,242,.06));color:#5d6784!important;font-size:12px!important;line-height:1.5!important;font-weight:700!important}\n#vch8 .vc8-learning-note b{color:var(--ink)!important}\n\n\/* =========================================================\n   CTA FINAL\n========================================================= *\/\n#vch8 .vc8-final{position:relative;overflow:hidden;isolation:isolate;border:1px solid rgba(255,255,255,.08);border-radius:30px;background:radial-gradient(circle at 92% 14%,rgba(69,183,255,.26),transparent 24rem),radial-gradient(circle at 15% 110%,rgba(118,86,248,.24),transparent 27rem),linear-gradient(135deg,#151a46 0%,#222868 58%,#334b9d 100%);box-shadow:0 28px 80px rgba(32,38,86,.20);color:#fff!important}\n#vch8 .vc8-final-orb{position:absolute;z-index:-1;right:-140px;top:-160px;width:520px;height:520px;border-radius:50%;background:conic-gradient(from 0deg,rgba(118,86,248,.35),rgba(49,186,242,.3),rgba(141,98,255,.25),rgba(118,86,248,.35));filter:blur(60px);animation:vc8Spin 20s linear infinite}\n#vch8 .vc8-final-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,390px);gap:46px;align-items:center;padding:52px 54px}\n#vch8 .vc8-final-eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 15px!important;color:#a9c7ff!important;font-size:11px!important;line-height:1!important;font-weight:900!important;letter-spacing:.15em!important;text-transform:uppercase!important}\n#vch8 .vc8-final-eyebrow::before{content:\"\";width:22px;height:2px;border-radius:99px;background:linear-gradient(90deg,#8e73ff,#52c4ff)}\n#vch8 .vc8-final h2{max-width:680px;margin:0!important;color:#fff!important;font-size:clamp(36px,3.6vw,56px)!important;line-height:1.01!important;letter-spacing:-.048em!important;font-weight:880!important}\n#vch8 .vc8-final-copy>p{max-width:650px;margin:17px 0 0!important;color:#c6cfe6!important;font-size:15px!important;line-height:1.62!important}\n#vch8 .vc8-final-benefits{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}\n#vch8 .vc8-final-benefits span{min-height:32px;padding:0 11px;display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(255,255,255,.055);color:#dce3f5!important;font-size:11px!important;line-height:1!important;font-weight:760!important;white-space:nowrap}\n#vch8 .vc8-final-benefits span::before{content:\"\u2713\";color:#7fd5ff!important;font-size:11px!important;font-weight:900!important}\n#vch8 .vc8-final-panel{padding:22px;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.055));box-shadow:0 20px 50px rgba(8,13,48,.17);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}\n#vch8 .vc8-final-panel h3{margin:0!important;color:#fff!important;font-size:20px!important;line-height:1.15!important;font-weight:860!important;letter-spacing:-.025em!important}\n#vch8 .vc8-final-panel>p{margin:8px 0 18px!important;color:#c6cfe6!important;font-size:12.5px!important;line-height:1.52!important}\n#vch8 .vc8-final-panel-actions{display:grid;gap:9px}\n#vch8 .vc8-final-panel-actions .vc8-btn{width:100%;min-height:48px}\n#vch8 .vc8-final-panel .vc8-btn--secondary{background:rgba(255,255,255,.075)!important;border-color:rgba(255,255,255,.13)!important;color:#fff!important}\n#vch8 .vc8-final-learning{margin-top:17px;padding-top:16px;border-top:1px solid rgba(255,255,255,.10)}\n#vch8 .vc8-final-learning span{display:block;margin-bottom:5px;color:#98a7cb!important;font-size:10.5px!important;font-weight:760!important}\n#vch8 .vc8-final-learning a{display:inline-flex;align-items:center;gap:7px;color:#fff!important;font-size:12px!important;font-weight:880!important}\n#vch8 .vc8-final-learning a::after{content:\"\u2192\";transition:transform .3s var(--ease)}\n#vch8 .vc8-final-learning a:hover::after{transform:translateX(4px)}\n\n\/* Barra CTA m\u00f3vil *\/\n#vch8 .vc8-dock{position:fixed;z-index:9990;left:12px;right:12px;bottom:12px;display:none;align-items:center;gap:8px;padding:8px;border-radius:18px;background:rgba(11,20,51,.94);box-shadow:0 18px 44px rgba(11,20,51,.35);backdrop-filter:blur(12px);transform:translateY(130%);transition:transform .5s var(--ease)}\n#vch8 .vc8-dock.show{transform:none}\n#vch8 .vc8-dock .vc8-btn{flex:1;min-height:46px;font-size:14px!important;border-radius:12px}\n#vch8 .vc8-dock .vc8-mini-btn{min-height:46px;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}\n\n\/* ---------- Keyframes ---------- *\/\n@keyframes vc8Grad{to{background-position:220% 0}}\n@keyframes vc8Ang{to{--vc8a:360deg}}\n@keyframes vc8Drift{to{transform:translate(40px,30px) scale(1.08)}}\n@keyframes vc8Halo{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.1);opacity:0}}\n@keyframes vc8Ping{0%{box-shadow:0 0 0 0 rgba(25,168,115,.6)}100%{box-shadow:0 0 0 8px rgba(25,168,115,0)}}\n@keyframes vc8In{0%{opacity:0;transform:translateX(-22px) scale(.96)}6%,22%{opacity:1;transform:none}28%,100%{opacity:0;transform:translateX(18px) scale(.97)}}\n@keyframes vc8Bob{0%,100%{translate:0 0}50%{translate:0 -8px}}\n@keyframes vc8Pipe{0%{transform:scaleX(0)}25%,80%{transform:scaleX(1)}100%{transform:scaleX(0)}}\n@keyframes vc8Scan{0%{transform:translateY(-110%)}100%{transform:translateY(420%)}}\n@keyframes vc8Fill{to{transform:scaleX(1)}}\n@keyframes vc8CardIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}\n@keyframes vc8Sheen{0%,55%{transform:translateX(-100%)}100%{transform:translateX(100%)}}\n@keyframes vc8Dash{to{stroke-dashoffset:-130}}\n@keyframes vc8Spin{to{transform:rotate(360deg)}}\n\n\/* ---------- Responsive ---------- *\/\n@media(max-width:1120px){\n  #vch8 .vc8-feature-grid{grid-template-columns:repeat(3,1fr)}\n  #vch8 .vc8-pillars{grid-template-columns:repeat(2,1fr)}\n  #vch8 .vc8-float--ai{right:0}\n}\n@media(max-width:940px){\n  #vch8 .vc8-hero{padding-top:84px}\n  #vch8 .vc8-hero-grid,#vch8 .vc8-show-head,#vch8 .vc8-dark-grid,#vch8 .vc8-split,#vch8 .vc8-final-grid,#vch8 .vc8-vmail,#vch8 .vc8-learning-shell{grid-template-columns:1fr}\n  #vch8 .vc8-tabs,#vch8 .vc8-filters{justify-content:flex-start}\n  #vch8 .vc8-feature-grid{grid-template-columns:repeat(2,1fr)}\n  #vch8 .vc8-stage{padding:22px 0 30px 0;max-width:720px}\n  #vch8 .vc8-final-grid{gap:28px;padding:38px}\n  #vch8 .vc8-vmail{padding:34px}\n  #vch8 .vc8-link{max-width:520px;width:100%;margin:0 auto}\n  #vch8 .vc8-visual,#vch8 .vc8-dark-image,#vch8 .vc8-split-media{transform:none}\n}\n@media(max-width:820px){\n  #vch8 .vc8-cta-strip,#vch8 .vc8-feature-cta{display:grid;grid-template-columns:1fr}\n  #vch8 .vc8-strip-actions{justify-content:flex-start}\n}\n@media(max-width:680px){\n  #vch8 .vc8-wrap{width:min(calc(100% - 28px),var(--max))}\n  #vch8 .vc8-section{padding:58px 0}\n  #vch8 .vc8-hero{padding:78px 0 20px}\n  #vch8 .vc8-hero h2{font-size:clamp(44px,14vw,62px)!important}\n  #vch8 .vc8-actions{display:grid;grid-template-columns:1fr}\n  #vch8 .vc8-actions .vc8-btn{width:100%}\n  #vch8 .vc8-trust>span{width:100%}\n  #vch8 .vc8-feed{left:6px;top:auto;bottom:-14px;gap:0;display:block;height:46px}\n  #vch8 .vc8-feed .vc8-in{position:absolute;left:0;top:0}\n  #vch8 .vc8-float--crm{display:none}\n  #vch8 .vc8-float--ai{width:180px;top:-6px;right:-4px;padding:10px 11px}\n  #vch8 .vc8-pillars{grid-template-columns:1fr}\n  #vch8 .vc8-pillar{min-height:auto}\n  #vch8 .vc8-filters{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;margin-right:-14px;padding:2px 14px 6px 0;scrollbar-width:none}\n  #vch8 .vc8-filters::-webkit-scrollbar{display:none}\n  #vch8 button.vc8-filter{flex:0 0 auto}\n  #vch8 .vc8-feature-grid{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-right:-14px;padding:4px 14px 16px 0;scrollbar-width:none}\n  #vch8 .vc8-feature-grid::-webkit-scrollbar{display:none}\n  #vch8 .vc8-card{flex:0 0 78vw;min-height:200px;scroll-snap-align:start}\n  #vch8 .vc8-swipe{display:block!important}\n  #vch8 .vc8-show-meta{grid-template-columns:1fr}\n  #vch8 .vc8-tabs{flex-wrap:nowrap;overflow-x:auto;margin-right:-14px;padding:2px 14px 6px 0;scrollbar-width:none}\n  #vch8 .vc8-tabs::-webkit-scrollbar{display:none}\n  #vch8 button.vc8-tab{flex:0 0 auto}\n  #vch8 .vc8-shield{left:8px;bottom:8px}\n  #vch8 .vc8-vmail{padding:26px 20px;border-radius:24px}\n  #vch8 .vc8-vmail-actions{display:grid;grid-template-columns:1fr}\n  #vch8 .vc8-link{height:380px}\n  #vch8 .vc8-node{width:180px;padding:11px}\n  #vch8 .vc8-node small{font-size:9.5px!important}\n  #vch8 .vc8-node i{width:38px;height:38px;font-size:19px}\n  #vch8 .vc8-contact{width:200px}\n  #vch8 .vc8-learning-shell{padding:20px 16px;border-radius:22px}\n  #vch8 .vc8-learning-grid{grid-template-columns:1fr}\n  #vch8 .vc8-learning-actions{display:grid;grid-template-columns:1fr}\n  #vch8 .vc8-learning-actions .vc8-btn{width:100%}\n  #vch8 .vc8-learning-card{min-height:auto}\n  #vch8 .vc8-strip-actions{display:grid;grid-template-columns:1fr;width:100%}\n  #vch8 .vc8-mini-btn{width:100%}\n  #vch8 .vc8-final{border-radius:24px}\n  #vch8 .vc8-final-grid{padding:30px 22px;gap:24px}\n  #vch8 .vc8-final h2{font-size:clamp(34px,11vw,46px)!important}\n  #vch8 .vc8-final-benefits{display:grid;grid-template-columns:1fr}\n  #vch8 .vc8-final-benefits span{width:max-content;max-width:100%}\n  #vch8 .vc8-final-panel{padding:18px;border-radius:18px}\n  #vch8 .vc8-dock{display:flex}\n  #vch8 .vc8-dock .vc8-mini-btn{width:auto}\n}\n@media(prefers-reduced-motion:reduce){\n  #vch8 *,#vch8 *::before,#vch8 *::after{animation:none!important;transition:none!important}\n  #vch8 [data-r]{opacity:1!important;transform:none!important;filter:none!important}\n  #vch8 .vc8-in{opacity:1;transform:none;position:static!important}\n  #vch8 .vc8-pk{display:none}\n}\n\n\/* =========================================================\n   VCHAT PARTNERS + AGENCY HUB \u00b7 Secciones adicionales V8.1\n   Estilos confinados a #vch8; no afectan secciones existentes.\n========================================================= *\/\n#vch8 .vc8-partners-zone{background:linear-gradient(180deg,#f8f9ff 0%,#f5f7ff 100%);border-top:1px solid #e8ecf9;border-bottom:1px solid #e8ecf9}\n#vch8 .vc8-ecosystem-head{max-width:850px;margin:0 auto 30px;text-align:center}\n#vch8 .vc8-ecosystem-head .vc8-copy{max-width:780px;margin:17px auto 0!important}\n#vch8 .vc8-partner-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:16px}\n#vch8 .vc8-partner-card{position:relative;min-width:0;display:flex;flex-direction:column;padding:24px;border:1px solid #e4e7f5;border-radius:22px;background:#fff;box-shadow:0 13px 36px rgba(28,38,84,.055);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s}\n#vch8 .vc8-partner-card:hover{transform:translateY(-5px);border-color:rgba(103,84,246,.35);box-shadow:0 22px 46px rgba(28,38,84,.11)}\n#vch8 .vc8-partner-card.is-featured{border:1.5px solid rgba(103,84,246,.5);background:linear-gradient(180deg,#fff 0%,#fcfbff 100%)}\n#vch8 .vc8-partner-tag{display:inline-flex;align-self:flex-start;align-items:center;gap:7px;height:27px;padding:0 10px;border-radius:99px;background:#f2f1ff;color:#6553dc!important;font-weight:850!important;font-size:10px!important;letter-spacing:.075em;text-transform:uppercase}\n#vch8 .vc8-partner-card .vc8-partner-badge{height:142px;display:flex;align-items:center;justify-content:center;margin:17px 0 13px;position:relative}\n#vch8 .vc8-partner-card .vc8-partner-badge img{width:auto;max-width:100%;max-height:142px;object-fit:contain;filter:drop-shadow(0 8px 11px rgba(61,55,130,.09));transition:transform .4s var(--ease)}\n#vch8 .vc8-partner-card:hover .vc8-partner-badge img{transform:scale(1.045)}\n#vch8 .vc8-refer-icon{width:112px;height:112px;border-radius:28px;display:grid;place-items:center;background:linear-gradient(140deg,#f4f1ff,#e6f5ff);border:1px solid #dadcff;position:relative}\n#vch8 .vc8-refer-icon:after{content:\"\";position:absolute;inset:9px;border:1px dashed rgba(105,86,239,.28);border-radius:20px}\n#vch8 .vc8-refer-icon svg{width:60px;height:60px;stroke:#6c5cf1;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}\n#vch8 .vc8-partner-card h3{margin:0 0 10px!important;color:var(--ink)!important;font-size:21px!important;line-height:1.2!important;font-weight:850!important;letter-spacing:-.025em!important}\n#vch8 .vc8-partner-card p{margin:0 0 17px!important;color:var(--text)!important;font-size:13px!important;line-height:1.65!important;flex:1}\n#vch8 .vc8-partner-points{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 19px}\n#vch8 .vc8-partner-points > span{padding:6px 9px;border-radius:99px;background:#f4f6fc;color:#5b6684!important;font-size:11px!important;font-weight:750!important}\n#vch8 .vc8-partner-card .vc8-mini-btn{align-self:stretch;min-height:46px;font-size:13px!important}\n#vch8 .vc8-partners-foot{margin-top:23px;text-align:center;color:#7f89a5!important;font-size:12px!important;line-height:1.5!important}\n#vch8 .vc8-partner-card.is-featured .vc8-mini-btn{background:var(--grad)!important;color:#fff!important;border-color:transparent!important}\n#vch8 .vc8-agency-zone{padding:84px 0}\n#vch8 .vc8-agency-panel{position:relative;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:30px;align-items:center;overflow:hidden;isolation:isolate;padding:45px 50px;border-radius:30px;background:linear-gradient(125deg,#101637 0%,#191a50 53%,#273581 100%);box-shadow:0 28px 72px rgba(18,28,87,.21)}\n#vch8 .vc8-agency-panel::before{content:\"\";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 92% 6%,rgba(65,195,245,.22),transparent 34%),radial-gradient(circle at 0% 94%,rgba(135,92,245,.21),transparent 39%),linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:auto,auto,36px 36px,36px 36px}\n#vch8 .vc8-agency-copy{position:relative;z-index:2}\n#vch8 .vc8-agency-logo{display:block;width:min(100%,285px);height:auto;max-height:104px;object-fit:contain;object-position:left center;margin:0 0 23px}\n#vch8 .vc8-agency-eyebrow{display:block;color:#aab8ff!important;font-size:11px!important;font-weight:900!important;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}\n#vch8 .vc8-agency-panel h2{color:#fff!important;margin:0!important;font-size:clamp(29px,3.15vw,43px)!important;line-height:1.08!important;font-weight:880!important;letter-spacing:-.045em!important}\n#vch8 .vc8-agency-panel h2 > span{color:#fff!important}\n#vch8 .vc8-agency-panel h2 > span > span{color:#8dd2ff!important}\n#vch8 .vc8-agency-panel p{color:#c4cdea!important;margin:17px 0 0!important;font-size:15px!important;line-height:1.7!important}\n#vch8 .vc8-agency-benefits{display:flex;flex-wrap:wrap;gap:9px;margin:21px 0 26px}\n#vch8 .vc8-agency-benefits > span{padding:8px 11px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.065);border-radius:99px;color:#eef0ff!important;font-size:11.5px!important;font-weight:760!important}\n#vch8 .vc8-agency-actions{display:flex;flex-wrap:wrap;gap:10px}\n#vch8 .vc8-agency-actions .vc8-btn--secondary{background:rgba(255,255,255,.10)!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;box-shadow:none!important}\n#vch8 .vc8-agency-art{position:relative;min-height:328px;display:grid;place-items:center}\n#vch8 .vc8-agency-orbit{position:absolute;inset:14px 0;border-radius:26px;border:1px solid rgba(255,255,255,.09);background:radial-gradient(circle at center,rgba(124,107,245,.18),transparent 68%)}\n#vch8 .vc8-agency-visual{position:relative;width:min(100%,420px);padding:20px;border:1px solid rgba(255,255,255,.22);border-radius:23px;background:rgba(255,255,255,.11);backdrop-filter:blur(12px);box-shadow:0 24px 60px rgba(0,0,0,.2);animation:vc8Bob 6.5s ease-in-out infinite}\n#vch8 .vc8-agency-screenbar{display:flex;gap:5px;margin-bottom:14px}\n#vch8 .vc8-agency-screenbar i{width:7px;height:7px;border-radius:50%;background:#94a6e6}\n#vch8 .vc8-agency-visual-title{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#fff!important;font-size:12px!important;font-weight:850!important;margin-bottom:12px}\n#vch8 .vc8-agency-visual-title b{color:#acdaff!important;font-size:10px!important}\n#vch8 .vc8-agency-workspace{display:flex;gap:9px;align-items:center;padding:10px 12px;margin-top:8px;background:rgba(255,255,255,.95);border-radius:12px;color:#202e58!important;font-size:12px!important;font-weight:850!important}\n#vch8 .vc8-agency-workspace i{width:26px;height:26px;flex:none;border-radius:9px;background:linear-gradient(135deg,#7c67fc,#4dbbff);display:grid;place-items:center;color:#fff;font-style:normal;font-size:11px}\n#vch8 .vc8-agency-workspace small{margin-left:auto;white-space:nowrap;font-size:10px!important;font-weight:850!important;color:#28a17b!important}\n#vch8 .vc8-agency-workspace:nth-child(4) i{background:linear-gradient(135deg,#3cc8d0,#548ffe)}\n#vch8 .vc8-agency-workspace:nth-child(5) i{background:linear-gradient(135deg,#976aff,#d28aff)}\n#vch8 .vc8-agency-float{position:absolute;right:-8px;bottom:-14px;display:flex;gap:8px;align-items:center;padding:11px 14px;border-radius:13px;background:#fff;box-shadow:0 15px 38px rgba(0,0,0,.20);font-size:11px!important;font-weight:850!important;color:#25345e!important;animation:vc8Bob 5.5s ease-in-out infinite reverse}\n#vch8 .vc8-agency-float strong{color:#1ba67e!important}\n#vch8 .vc8-ecosys-en{display:none!important}\n@media(max-width:980px){\n #vch8 .vc8-partner-cards{grid-template-columns:repeat(2,minmax(0,1fr))}\n #vch8 .vc8-partner-card:first-child{grid-column:1\/-1}\n #vch8 .vc8-agency-panel{grid-template-columns:1fr;gap:28px}\n #vch8 .vc8-agency-art{min-height:300px}\n}\n@media(max-width:680px){\n #vch8 .vc8-partner-cards{grid-template-columns:1fr}\n #vch8 .vc8-partner-card:first-child{grid-column:auto}\n #vch8 .vc8-partner-card{padding:22px}\n #vch8 .vc8-partner-card .vc8-partner-badge{height:132px}\n #vch8 .vc8-agency-zone{padding:58px 0}\n #vch8 .vc8-agency-panel{padding:26px 20px;border-radius:24px}\n #vch8 .vc8-agency-art{min-height:260px}\n #vch8 .vc8-agency-actions{display:grid;grid-template-columns:1fr}\n #vch8 .vc8-agency-float{right:0}\n}\n@media(prefers-reduced-motion:reduce){#vch8 .vc8-agency-visual,#vch8 .vc8-agency-float{animation:none!important}}\n\n\n\/* V8.2 \u00b7 DEMOS REALES APROBADAS: aisladas en iframe para proteger Elementor. *\/\n#vch8 .vc8-show-live{overflow:hidden}\n#vch8 .vc8-live-viewport{position:relative;height:620px;background:#f7f9fd;border-radius:16px;overflow:hidden;border:1px solid #e7e9f6}\n#vch8 .vc8-live-viewport iframe{display:block;width:100%;height:100%;border:0;background:#fff}\n#vch8 .vc8-live-loading{position:absolute;inset:0;display:grid;place-items:center;color:#737c9b!important;font-size:14px!important;font-weight:750!important;pointer-events:none}\n#vch8 .vc8-live-loading.ready{display:none}\n#vch8 .vc8-live-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 8px 0}\n#vch8 .vc8-live-nav button{padding:9px 15px!important;margin:0!important;background:#f2f1ff!important;color:#5d51e2!important;border:1px solid #dcd9ff!important;border-radius:11px!important;font-size:12px!important;font-weight:850!important;line-height:1.3!important}\n#vch8 .vc8-live-nav span{font-size:12px!important;color:#8690aa!important;font-weight:800!important;font-variant-numeric:tabular-nums}\n#vch8 .vc8-dark-live{min-width:0;transform:none!important}\n#vch8 .vc8-dark-live>div{height:370px;background:#fff;border-radius:14px;overflow:hidden}\n#vch8 .vc8-dark-live iframe{width:100%;height:100%;border:0;display:block;background:#fff}\n#vch8 .vc8-dark-live>div::after{display:none}\n@media(max-width:940px){#vch8 .vc8-show-head{gap:20px}#vch8 .vc8-live-viewport{height:550px}#vch8 .vc8-dark-live>div{height:380px}}\n@media(max-width:680px){#vch8 .vc8-live-viewport{height:460px;border-radius:10px}#vch8 .vc8-live-nav button{padding:10px 9px!important;font-size:11px!important}#vch8 .vc8-show-live{padding:7px;border-radius:18px}#vch8 .vc8-show-live .vc8-bar{padding-bottom:8px}#vch8 .vc8-show-live .vc8-bar span{font-size:9px!important}#vch8 .vc8-dark-live>div{height:400px}#vch8 .vc8-tabs{justify-content:flex-start!important;scroll-snap-type:x proximity}#vch8 button.vc8-tab{scroll-snap-align:center}}\n<\/style>\n\n  <div class=\"vc8-progress\" aria-hidden=\"true\"><\/div>\n\n  <!-- ================= HERO ================= -->\n  <section class=\"vc8-hero\">\n    <div class=\"vc8-wrap vc8-hero-grid\">\n      <div>\n        <div class=\"vc8-badge\" data-r><i><\/i> Omnicanal + CRM + Automatizaci\u00f3n + Agentes AI<\/div>\n        <h2>\n  <span class=\"vc8-w\"><span style=\"--i:0\">Tu<\/span><\/span>\n  <span class=\"vc8-w\"><span style=\"--i:1\" class=\"vc8-grad vc8-hola\">\u201cHola\u201d<\/span><\/span><br>\n  <span class=\"vc8-w\"><span style=\"--i:2\">merece<\/span><\/span>\n  <span class=\"vc8-w\"><span style=\"--i:3\">seguimiento.<\/span><\/span>\n<\/h2>\n        <p class=\"vc8-hero-lead\" data-r style=\"--d:500ms\">Centraliza conversaciones, convierte contactos en oportunidades, agenda, asigna tareas, automatiza procesos y deja trabajar a tus Agentes AI con reglas claras.<\/p>\n        <div class=\"vc8-actions\" data-r style=\"--d:620ms\">\n          <a class=\"vc8-btn vc8-btn--primary\" data-mag href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Comenzar 14 d\u00edas gratis<\/a>\n          <a class=\"vc8-btn vc8-btn--secondary\" href=\"https:\/\/vchat.com.mx\/precios\/\" rel=\"noopener\">Ver precios<\/a>\n          <a class=\"vc8-btn vc8-btn--tertiary\" href=\"https:\/\/chat.vchat.com.mx\/ingresar\/\" rel=\"noopener\">Ingresar<\/a>\n        <\/div>\n        <div data-r style=\"--d:720ms\">\n          <div class=\"vc8-note\">Sin cargos hoy \u00b7 configura tu workspace \u00b7 t\u00fa controlas cu\u00e1ndo interviene AI.<\/div>\n          <div class=\"vc8-login-note\">\u00bfYa usas Vchat? <a href=\"https:\/\/chat.vchat.com.mx\/ingresar\/\" rel=\"noopener\">Ingresar a mi cuenta \u2192<\/a><\/div>\n        <\/div>\n        <div class=\"vc8-trust\" data-r style=\"--d:800ms\">\n          <span>Un solo Inbox para<\/span>\n          <span class=\"vc8-ch\"><img decoding=\"async\" src=\"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366\" alt=\"\" loading=\"lazy\">WhatsApp<\/span>\n          <span class=\"vc8-ch\"><img decoding=\"async\" src=\"https:\/\/cdn.simpleicons.org\/instagram\/E4405F\" alt=\"\" loading=\"lazy\">Instagram<\/span>\n          <span class=\"vc8-ch\"><img decoding=\"async\" src=\"https:\/\/cdn.simpleicons.org\/facebook\/1877F2\" alt=\"\" loading=\"lazy\">Facebook<\/span>\n          <span class=\"vc8-ch\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#6754f6\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M21 12a8 8 0 0 1-11.6 7.1L4 20l1-4.6A8 8 0 1 1 21 12z\"\/><\/svg>Chat web<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"vc8-stage\" data-r style=\"--d:200ms\">\n        <div class=\"vc8-visual\" data-tilt=\"4\">\n          <div class=\"vc8-bar\" aria-hidden=\"true\"><i><\/i><i><\/i><i><\/i><span>chat.vchat.com.mx<\/span><\/div>\n          <div class=\"vc8-visual-img\">\n            <img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Seccion-Inbox-Vchat-by-StudioVainilla.png\" alt=\"Inbox omnicanal de Vchat by StudioVainilla\" loading=\"eager\" fetchpriority=\"high\">\n          <\/div>\n        <\/div>\n\n        <!-- Inbox animado libre de tarjetas flotantes que ocultaban su interfaz. -->\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= PILARES ================= -->\n  <section class=\"vc8-pillars-sec\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-pillars\" data-r>\n        <div class=\"vc8-pillar\"><b><i>1<\/i>Conversa<\/b><span>WhatsApp, Instagram, Facebook y chat web en el mismo Inbox.<\/span><\/div>\n        <div class=\"vc8-pillar\"><b><i>2<\/i>Convierte<\/b><span>CRM, Ficha 360\u00b0, productos, valor, etapas y seguimiento comercial.<\/span><\/div>\n        <div class=\"vc8-pillar\"><b><i>3<\/i>Ejecuta<\/b><span>Agenda, tareas, automatizaciones, SLA, responsables y recordatorios.<\/span><\/div>\n        <div class=\"vc8-pillar\"><b><i>4<\/i>Escala con AI<\/b><span>Agentes AI especializados, conocimiento controlado y cr\u00e9ditos medibles.<\/span><\/div>\n      <\/div>\n      <div class=\"vc8-cta-strip\" data-r style=\"--d:100ms\">\n        <div>\n          <strong>\u00bfQuieres comparar planes antes de empezar?<\/strong>\n          <span>Revisa precios o crea tu workspace y conoce Vchat durante 14 d\u00edas.<\/span>\n        <\/div>\n        <div class=\"vc8-strip-actions\">\n          <a class=\"vc8-mini-btn vc8-mini-btn--violet\" href=\"https:\/\/vchat.com.mx\/precios\/\" rel=\"noopener\">Ver precios<\/a>\n          <a class=\"vc8-mini-btn vc8-mini-btn--primary\" href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Crear cuenta<\/a>\n          <a class=\"vc8-mini-btn\" href=\"https:\/\/chat.vchat.com.mx\/ingresar\/\" rel=\"noopener\">Ya tengo cuenta<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= FUNCIONES ================= -->\n  <section id=\"vchat-funciones\" class=\"vc8-section vc8-feature-zone\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-center\" data-r>\n        <div class=\"vc8-kicker\">Todo lo que puedes hacer<\/div>\n        <h2 class=\"vc8-title\">Una plataforma completa, no s\u00f3lo un inbox.<\/h2>\n        <p class=\"vc8-copy\">Estas son las principales capacidades que hoy forman parte del ecosistema Vchat.<\/p>\n      <\/div>\n      <div class=\"vc8-filters\" role=\"tablist\" aria-label=\"Filtrar capacidades\" data-r style=\"--d:120ms\">\n        <button type=\"button\" class=\"vc8-filter is-active\" data-f=\"all\">Todas<sup>24<\/sup><\/button>\n        <button type=\"button\" class=\"vc8-filter\" data-f=\"conv\">Conversaciones<sup>7<\/sup><\/button>\n        <button type=\"button\" class=\"vc8-filter\" data-f=\"ventas\">Ventas y contactos<sup>5<\/sup><\/button>\n        <button type=\"button\" class=\"vc8-filter\" data-f=\"op\">Operaci\u00f3n<sup>4<\/sup><\/button>\n        <button type=\"button\" class=\"vc8-filter\" data-f=\"ai\">AI<sup>3<\/sup><\/button>\n        <button type=\"button\" class=\"vc8-filter\" data-f=\"admin\">Datos y cuenta<sup>5<\/sup><\/button>\n      <\/div>\n      <div class=\"vc8-feature-grid\">\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">01<\/div><h3>Inbox omnicanal<\/h3><p>Centraliza WhatsApp, Instagram, Facebook y chat web con historial y contexto de cada conversaci\u00f3n.<\/p><span class=\"vc8-chip\">Mensajer\u00eda<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">02<\/div><h3>Atenci\u00f3n humana + AI<\/h3><p>Toma una conversaci\u00f3n, pausa AI, devu\u00e9lvela a AI o mant\u00e9n AI apagada globalmente cuando lo necesites.<\/p><span class=\"vc8-chip\">Control humano<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">03<\/div><h3>Transferencias inteligentes<\/h3><p>Escala conversaciones cuando AI no est\u00e1 autorizada para responder y entrega el contexto al equipo.<\/p><span class=\"vc8-chip\">Handoff<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ventas\"><div class=\"vc8-card-icon\">04<\/div><h3>Ficha 360\u00b0 de contactos<\/h3><p>Datos, empresa, origen, actividad, categor\u00edas, notas, clasificaci\u00f3n, valor y relaci\u00f3n comercial en una sola ficha.<\/p><span class=\"vc8-chip\">Contactos<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ventas\"><div class=\"vc8-card-icon\">05<\/div><h3>CRM y pipeline<\/h3><p>Mueve oportunidades entre etapas, asigna responsables, registra valor y mide conversi\u00f3n.<\/p><span class=\"vc8-chip\">Ventas<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ventas\"><div class=\"vc8-card-icon\">06<\/div><h3>Productos y servicios<\/h3><p>Relaciona productos o servicios con contactos y conversaciones para enriquecer el contexto comercial.<\/p><span class=\"vc8-chip\">Cat\u00e1logo<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"op\"><div class=\"vc8-card-icon\">07<\/div><h3>Tareas y seguimientos<\/h3><p>Crea pendientes con prioridad, responsable, fecha l\u00edmite, estado y relaci\u00f3n con un contacto.<\/p><span class=\"vc8-chip\">Operaci\u00f3n<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"op\"><div class=\"vc8-card-icon\">08<\/div><h3>Agenda y reservas<\/h3><p>Convierte una conversaci\u00f3n en cita, demo, llamada, reserva o seguimiento directamente desde Vchat.<\/p><span class=\"vc8-chip\">Calendario<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"op\"><div class=\"vc8-card-icon\">09<\/div><h3>Automatizaciones<\/h3><p>Configura disparadores, condiciones y acciones para mover procesos sin depender de tareas manuales.<\/p><span class=\"vc8-chip\">Workflows<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">10<\/div><h3>Respuestas y recursos<\/h3><p>Guarda respuestas frecuentes y recursos para responder m\u00e1s r\u00e1pido y mantener consistencia.<\/p><span class=\"vc8-chip\">Productividad<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ai\"><div class=\"vc8-card-icon\">11<\/div><h3>Conocimiento AI<\/h3><p>Alimenta AI con sitios web, FAQs, documentos, PDFs, pol\u00edticas, promociones y fuentes internas.<\/p><span class=\"vc8-chip\">Base de conocimiento<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ai\"><div class=\"vc8-card-icon\">12<\/div><h3>Agentes AI especializados<\/h3><p>Crea agentes por \u00e1rea con instrucciones, comportamiento, conocimiento, canales y autonom\u00eda.<\/p><span class=\"vc8-chip\">Agentes AI<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ai\"><div class=\"vc8-card-icon\">13<\/div><h3>Cr\u00e9ditos AI<\/h3><p>Controla el consumo de AI por workspace y agente, con cr\u00e9ditos incluidos y recargas adicionales.<\/p><span class=\"vc8-chip\">Consumo medible<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"op\"><div class=\"vc8-card-icon\">14<\/div><h3>SLA y responsables<\/h3><p>Visualiza primera respuesta, resoluci\u00f3n, responsable y estado SLA dentro de la conversaci\u00f3n.<\/p><span class=\"vc8-chip\">Servicio<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">15<\/div><h3>Notas internas<\/h3><p>Colabora con tu equipo sin enviar mensajes al cliente y conserva contexto operativo interno.<\/p><span class=\"vc8-chip\">Equipo<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">16<\/div><h3>Adjuntos y audio<\/h3><p>Comparte archivos, im\u00e1genes y recursos; utiliza herramientas de mensajer\u00eda desde el mismo Inbox.<\/p><span class=\"vc8-chip\">Multimedia<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"conv\"><div class=\"vc8-card-icon\">17<\/div><h3>Mensajes programados<\/h3><p>Programa mensajes para una fecha y hora espec\u00edficas sin perder el contexto de la conversaci\u00f3n.<\/p><span class=\"vc8-chip\">Programaci\u00f3n<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ventas\"><div class=\"vc8-card-icon\">18<\/div><h3>Clasificaci\u00f3n y etiquetas<\/h3><p>Organiza contactos y conversaciones por categor\u00edas, etapas, intereses, estado y otros criterios.<\/p><span class=\"vc8-chip\">Organizaci\u00f3n<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"admin\"><div class=\"vc8-card-icon\">19<\/div><h3>Exportaciones<\/h3><p>Exporta conversaciones y datos cuando necesites analizarlos, respaldarlos o moverlos a otro flujo.<\/p><span class=\"vc8-chip\">Datos<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"admin\"><div class=\"vc8-card-icon\">20<\/div><h3>Anal\u00edtica<\/h3><p>Mide atenci\u00f3n, operaci\u00f3n, seguimiento, tiempos y desempe\u00f1o desde las vistas de Insights.<\/p><span class=\"vc8-chip\">Insights<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"ventas\"><div class=\"vc8-card-icon\">21<\/div><h3>Marketing<\/h3><p>Gestiona iniciativas de marketing, trials, comunicaci\u00f3n y acciones ligadas al ciclo del cliente.<\/p><span class=\"vc8-chip\">Growth<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"admin\"><div class=\"vc8-card-icon\">22<\/div><h3>Equipo y permisos<\/h3><p>Organiza usuarios, departamentos, responsables, roles y permisos seg\u00fan la operaci\u00f3n de tu empresa.<\/p><span class=\"vc8-chip\">Administraci\u00f3n<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"admin\"><div class=\"vc8-card-icon\">23<\/div><h3>Canales y configuraci\u00f3n<\/h3><p>Administra canales, bandejas, preferencias y configuraci\u00f3n general desde un solo workspace.<\/p><span class=\"vc8-chip\">Workspace<\/span><\/article>\n        <article class=\"vc8-card\" data-r data-g=\"admin\"><div class=\"vc8-card-icon\">24<\/div><h3>Planes y facturaci\u00f3n<\/h3><p>Gestiona plan, cr\u00e9ditos AI y facturaci\u00f3n desde Vchat con precios regionales y suscripci\u00f3n conectada a Stripe.<\/p><span class=\"vc8-chip\">Cuenta<\/span><\/article>\n      <\/div>\n\n      <p class=\"vc8-swipe\" aria-hidden=\"true\">Desliza para ver m\u00e1s \u2192<\/p>\n      <div class=\"vc8-feature-cta\" data-r>\n        <div>\n          <h3><b data-count=\"24\">24<\/b> capacidades conectadas en un mismo workspace.<\/h3>\n          <p>Empieza por lo que necesitas hoy y activa m\u00e1s funciones conforme crece tu operaci\u00f3n.<\/p>\n        <\/div>\n        <div class=\"vc8-strip-actions\">\n          <a class=\"vc8-mini-btn\" href=\"https:\/\/vchat.com.mx\/precios\/\" rel=\"noopener\">Comparar planes<\/a>\n          <a class=\"vc8-mini-btn vc8-mini-btn--primary\" href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Probar Vchat<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= PLATAFORMA \u00b7 CLONES APROBADOS ================= -->\n  <section class=\"vc8-section vc8-live-zone\" id=\"vchat-plataforma\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-show-head\">\n        <div data-r><div class=\"vc8-kicker\">Conoce la plataforma<\/div><h2 class=\"vc8-title vc8-title--sm\">Una interfaz conectada de punta a punta.<\/h2><\/div>\n        <div class=\"vc8-tabs\" role=\"tablist\" aria-label=\"Demostraciones de Vchat\" data-r style=\"--d:100ms\">\n          <button class=\"vc8-tab is-active\" type=\"button\" role=\"tab\" aria-selected=\"true\" data-demo=\"inbox\">Inbox<\/button>\n          <button class=\"vc8-tab\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-demo=\"contacts\">Contactos<\/button>\n          <button class=\"vc8-tab\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-demo=\"crm\">CRM<\/button>\n          <button class=\"vc8-tab\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-demo=\"tasks\">Tareas<\/button>\n          <button class=\"vc8-tab\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-demo=\"calendar\">Agenda<\/button>\n          <button class=\"vc8-tab\" type=\"button\" role=\"tab\" aria-selected=\"false\" data-demo=\"agents\">Agentes AI<\/button>\n        <\/div>\n      <\/div>\n      <div class=\"vc8-show vc8-show-live\" data-r>\n        <div class=\"vc8-bar\" aria-hidden=\"true\"><i><\/i><i><\/i><i><\/i><span>chat.vchat.com.mx \u00b7 Vista interactiva de demostraci\u00f3n<\/span><\/div>\n        <div class=\"vc8-live-viewport\" aria-label=\"Demostraci\u00f3n del frontend de Vchat\">\n          <div class=\"vc8-live-loading\" aria-live=\"polite\">Cargando demostraci\u00f3n interactiva\u2026<\/div>\n          <iframe id=\"vc8-live-frame\" title=\"Demostraci\u00f3n animada de Inbox de Vchat\" loading=\"lazy\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"yes\"><\/iframe>\n        <\/div>\n        <div class=\"vc8-show-meta\" data-show-meta><div><h3 data-show-title>Inbox omnicanal<\/h3><p data-show-copy>Recorre el Inbox y descubre c\u00f3mo se conectan conversaciones, agentes AI, responsables, productos y etapas.<\/p><\/div><span class=\"vc8-chip\" data-show-tag>Demo animada<\/span><\/div>\n        <div class=\"vc8-live-nav\"><button type=\"button\" data-demo-prev aria-label=\"Anterior m\u00f3dulo\">\u2190 Anterior<\/button><span data-demo-position>01 \/ 06<\/span><button type=\"button\" data-demo-next aria-label=\"Siguiente m\u00f3dulo\">Siguiente \u2192<\/button><\/div>\n      <\/div>\n      <div class=\"vc8-cta-strip\" data-r>\n        <div><strong>\u00bfYa tienes cuenta?<\/strong><span>Entra directamente a tu workspace. Si a\u00fan no, puedes iniciar tu prueba desde aqu\u00ed.<\/span><\/div>\n        <div class=\"vc8-strip-actions\"><a class=\"vc8-mini-btn\" href=\"https:\/\/chat.vchat.com.mx\/ingresar\/\" rel=\"noopener\">Ingresar<\/a><a class=\"vc8-mini-btn vc8-mini-btn--primary\" href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Comenzar gratis<\/a><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= AI CON CONTROL ================= -->\n  <section class=\"vc8-section vc8-dark\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-center\" data-r><div class=\"vc8-kicker\">Lo que hace diferente a Vchat<\/div><h2 class=\"vc8-title\">AI que trabaja con reglas, conocimiento y control humano.<\/h2><p class=\"vc8-copy\">No necesitas dejar todo en manos de un bot. T\u00fa decides qu\u00e9 sabe, qu\u00e9 puede hacer y cu\u00e1ndo debe escalar.<\/p><\/div>\n      <div class=\"vc8-dark-grid\">\n        <div class=\"vc8-dark-cards\">\n          <div class=\"vc8-dark-card\" data-r><i>\u23fb<\/i><div><b>AI global activable o desactivable<\/b><span>Pausa AI para todo el workspace y vuelve a activarla cuando quieras.<\/span><\/div><\/div>\n          <div class=\"vc8-dark-card\" data-r style=\"--d:80ms\"><i>\ud83d\ude4b<\/i><div><b>Control por conversaci\u00f3n<\/b><span>Una persona puede tomar la conversaci\u00f3n y devolverla a AI sin perder historial.<\/span><\/div><\/div>\n          <div class=\"vc8-dark-card\" data-r style=\"--d:160ms\"><i>\u2197<\/i><div><b>Escalamiento por l\u00edmites<\/b><span>Si AI no est\u00e1 autorizada para responder, puede transferir y notificar al equipo.<\/span><\/div><\/div>\n          <div class=\"vc8-dark-card\" data-r style=\"--d:240ms\"><i>\u2699<\/i><div><b>Comportamiento configurable<\/b><span>Define tono, estilo, objetivo, conocimiento y autonom\u00eda de cada agente.<\/span><\/div><\/div>\n        <\/div>\n        <div class=\"vc8-dark-image vc8-dark-live\" data-r style=\"--d:120ms\"><div><iframe id=\"vc8-agents-secondary\" title=\"Demo animada de Agentes AI de Vchat\" loading=\"lazy\" sandbox=\"allow-scripts allow-same-origin\" scrolling=\"yes\"><\/iframe><\/div><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= AUTOMATIZACIONES ================= -->\n  <section class=\"vc8-section\">\n    <div class=\"vc8-wrap vc8-split\">\n      <div>\n        <div data-r>\n          <div class=\"vc8-kicker\">Automatiza m\u00e1s que respuestas<\/div>\n          <h2 class=\"vc8-title vc8-title--sm\">Cuando pasa algo, Vchat puede mover la operaci\u00f3n.<\/h2>\n          <p class=\"vc8-copy\">Combina eventos, condiciones y acciones para que el sistema haga seguimiento, asigne responsables, env\u00ede recordatorios o active procesos.<\/p>\n        <\/div>\n        <div class=\"vc8-flow\">\n          <span class=\"vc8-flow-dot\" aria-hidden=\"true\"><\/span>\n          <div class=\"vc8-step\" data-r><b><em>Cuando<\/em><\/b><span>Nuevo mensaje, cita, fecha, palabra clave o prospecto.<\/span><\/div>\n          <div class=\"vc8-step\" data-r style=\"--d:80ms\"><b><em>Si \/ Para<\/em><\/b><span>Aplica condiciones seg\u00fan canal, etapa o contexto.<\/span><\/div>\n          <div class=\"vc8-step\" data-r style=\"--d:160ms\"><b><em>Entonces<\/em><\/b><span>Env\u00eda, asigna, recuerda, actualiza o dispara una acci\u00f3n.<\/span><\/div>\n          <div class=\"vc8-step\" data-r style=\"--d:240ms\"><b><em>Historial<\/em><\/b><span>Consulta ejecuciones y mantiene trazabilidad.<\/span><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"vc8-split-media\" data-r data-tilt=\"4\" style=\"--d:120ms\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Seccion-Automatizaciones-Vchat-by-StudioVainilla.png\" alt=\"Automatizaciones Vchat\" loading=\"lazy\"><\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= VCHAT + VMAIL ================= -->\n  <section class=\"vc8-vmail-sec\" id=\"vchat-vmail\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-vmail\" data-r>\n        <div>\n          <div class=\"vc8-kicker\">Ecosistema StudioVainilla<\/div>\n          <h2>Vchat + Vmail: <span>comunicaci\u00f3n multicanal m\u00e1s exclusiva.<\/span><\/h2>\n          <p>Integra Vchat con Vmail y lleva la relaci\u00f3n con tus clientes del chat al correo. Vmail te permite crear y enviar campa\u00f1as de correo, utilizar plantillas, automatizar comunicaciones y consultar tus resultados en una sola plataforma.<\/p>\n          <div class=\"vc8-vmail-tags\"><span>Campa\u00f1as de correo<\/span><span>Plantillas<\/span><span>Automatizaci\u00f3n<\/span><span>Resultados<\/span><\/div>\n          <div class=\"vc8-vmail-actions\">\n            <a class=\"vc8-btn vc8-btn--light\" data-mag href=\"https:\/\/vmail.com.mx\/\" target=\"_blank\" rel=\"noopener\">Conocer Vmail \u2197<\/a>\n            <a class=\"vc8-btn vc8-btn--secondary\" href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Comenzar con Vchat<\/a>\n          <\/div>\n        <\/div>\n        <div class=\"vc8-link\" aria-hidden=\"true\">\n          <svg><path data-p=\"0\"\/><path data-p=\"1\"\/><\/svg>\n          <div class=\"vc8-node vc8-node--chat\"><i>\ud83d\udcac<\/i><span><b>Vchat<\/b><small>WhatsApp \u00b7 Instagram \u00b7 Facebook \u00b7 Web<\/small><\/span><\/div>\n          <div class=\"vc8-contact\">\n            <div class=\"vc8-contact-top\"><i>\ud83d\ude42<\/i><span><b>Tu cliente<\/b><small>Un solo contexto<\/small><\/span><\/div>\n            <div class=\"vc8-contact-ch\"><span>WhatsApp<\/span><span>Instagram<\/span><span>Facebook<\/span><span>Chat web<\/span><span>Email<\/span><\/div>\n          <\/div>\n          <div class=\"vc8-node vc8-node--mail\"><i>\u2709\ufe0f<\/i><span><b>Vmail<\/b><small>Campa\u00f1as \u00b7 Plantillas \u00b7 Automatizaci\u00f3n<\/small><\/span><\/div>\n          <span class=\"vc8-pk\">\ud83d\udcac<\/span><span class=\"vc8-pk\">\u2709\ufe0f<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n\n  <!-- ================= VCHAT PARTNERS \u00b7 NUEVO ================= -->\n  <section class=\"vc8-section vc8-partners-zone\" id=\"vchat-partners\" aria-label=\"Vchat Partners\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-ecosystem-head\" data-r>\n        <div class=\"vc8-kicker\"><span class=\"vc8-ecosys-es\">Crece con Vchat<\/span><span class=\"vc8-ecosys-en\">Grow with Vchat<\/span><\/div>\n        <h2 class=\"vc8-title vc8-title--sm\"><span class=\"vc8-ecosys-es\">Tu experiencia puede convertirse en una nueva oportunidad de negocio.<\/span><span class=\"vc8-ecosys-en\">Turn your expertise into a new business opportunity.<\/span><\/h2>\n        <p class=\"vc8-copy\"><span class=\"vc8-ecosys-es\">Recomienda, comercializa y desarrolla relaciones de largo plazo con Vchat. Empieza como Referidor y crece hacia los niveles certificados de nuestro programa de partners.<\/span><span class=\"vc8-ecosys-en\">Refer, sell, and build long-term relationships with Vchat. Start as a Referrer and grow into the certified tiers of our partner program.<\/span><\/p>\n      <\/div>\n      <div class=\"vc8-partner-cards\">\n        <article class=\"vc8-partner-card\" data-r>\n          <span class=\"vc8-partner-tag\"><span class=\"vc8-ecosys-es\">01 \u00b7 Comienza<\/span><span class=\"vc8-ecosys-en\">01 \u00b7 Get started<\/span><\/span>\n          <div class=\"vc8-partner-badge\">\n            <div class=\"vc8-refer-icon\" aria-hidden=\"true\"><svg viewBox=\"0 0 64 64\"><circle cx=\"17\" cy=\"20\" r=\"7\"\/><circle cx=\"47\" cy=\"20\" r=\"7\"\/><path d=\"M4 45c2-10 8-15 18-15M60 45c-2-10-8-15-18-15\"\/><path d=\"M22 39h20M35 32l8 7-8 7\"\/><path d=\"M9 52h46\"\/><\/svg><\/div>\n          <\/div>\n          <h3><span class=\"vc8-ecosys-es\">Referidor Vchat<\/span><span class=\"vc8-ecosys-en\">Vchat Referrer<\/span><\/h3>\n          <p><span class=\"vc8-ecosys-es\">Comparte Vchat con empresas que necesitan mejorar su atenci\u00f3n. Es la forma m\u00e1s sencilla de comenzar a participar en el programa.<\/span><span class=\"vc8-ecosys-en\">Introduce Vchat to businesses looking to improve customer engagement. The simplest way to join the program.<\/span><\/p>\n          <div class=\"vc8-partner-points\"><span><span class=\"vc8-ecosys-es\">Recomendaciones<\/span><span class=\"vc8-ecosys-en\">Referrals<\/span><\/span><span><span class=\"vc8-ecosys-es\">Acceso inicial<\/span><span class=\"vc8-ecosys-en\">Entry tier<\/span><\/span><\/div>\n          <a class=\"vc8-mini-btn vc8-mini-btn--violet\" href=\"https:\/\/partners.vchat.com.mx\/\" data-partners-link rel=\"noopener\"><span class=\"vc8-ecosys-es\">Conocer el programa \u2197<\/span><span class=\"vc8-ecosys-en\">Explore the program \u2197<\/span><\/a>\n        <\/article>\n        <article class=\"vc8-partner-card is-featured\" data-r style=\"--d:90ms\">\n          <span class=\"vc8-partner-tag\"><span class=\"vc8-ecosys-es\">02 \u00b7 Crecer \u00b7 Certificado<\/span><span class=\"vc8-ecosys-en\">02 \u00b7 Grow \u00b7 Certified<\/span><\/span>\n          <div class=\"vc8-partner-badge\">\n            <img decoding=\"async\" data-es-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Comercial-Vchat.png\" data-en-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Comercial-Vchat-English.png\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Comercial-Vchat.png\" data-fallback-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Vchat-Partners-Insignias.png\" alt=\"Vchat Pro \u00b7 Partner Comercial \/ Commercial Partner\" loading=\"lazy\">\n          <\/div>\n          <h3><span class=\"vc8-ecosys-es\">Vchat Pro \u00b7 Partner Comercial<\/span><span class=\"vc8-ecosys-en\">Vchat Pro \u00b7 Commercial Partner<\/span><\/h3>\n          <p><span class=\"vc8-ecosys-es\">Capacitaci\u00f3n, certificaci\u00f3n y herramientas para presentar Vchat, acompa\u00f1ar negocios y desarrollar oportunidades comerciales.<\/span><span class=\"vc8-ecosys-en\">Training, certification, and resources to introduce Vchat, support businesses, and develop commercial opportunities.<\/span><\/p>\n          <div class=\"vc8-partner-points\"><span><span class=\"vc8-ecosys-es\">Certificaci\u00f3n<\/span><span class=\"vc8-ecosys-en\">Certification<\/span><\/span><span><span class=\"vc8-ecosys-es\">Acompa\u00f1amiento<\/span><span class=\"vc8-ecosys-en\">Enablement<\/span><\/span><\/div>\n          <a class=\"vc8-mini-btn\" href=\"https:\/\/partners.vchat.com.mx\/\" data-partners-link rel=\"noopener\"><span class=\"vc8-ecosys-es\">Quiero ser Partner Comercial \u2197<\/span><span class=\"vc8-ecosys-en\">Become a Commercial Partner \u2197<\/span><\/a>\n        <\/article>\n        <article class=\"vc8-partner-card\" data-r style=\"--d:160ms\">\n          <span class=\"vc8-partner-tag\"><span class=\"vc8-ecosys-es\">03 \u00b7 Escalar \u00b7 Certificado<\/span><span class=\"vc8-ecosys-en\">03 \u00b7 Scale \u00b7 Certified<\/span><\/span>\n          <div class=\"vc8-partner-badge\">\n            <img decoding=\"async\" data-es-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Estrategico-Vchat.png\" data-en-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Estrategico-Vchat-English.png\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Insignia-Partner-Estrategico-Vchat.png\" data-fallback-src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Vchat-Partners-Insignias.png\" alt=\"Vchat Partner Estrat\u00e9gico \/ Strategic Partner\" loading=\"lazy\">\n          <\/div>\n          <h3><span class=\"vc8-ecosys-es\">Partner Estrat\u00e9gico<\/span><span class=\"vc8-ecosys-en\">Strategic Partner<\/span><\/h3>\n          <p><span class=\"vc8-ecosys-es\">Para aliados que buscan escalar su operaci\u00f3n, ampliar su cartera y construir una relaci\u00f3n estrat\u00e9gica con Vchat.<\/span><span class=\"vc8-ecosys-en\">For partners looking to scale their operations, grow their client portfolio, and build a strategic relationship with Vchat.<\/span><\/p>\n          <div class=\"vc8-partner-points\"><span><span class=\"vc8-ecosys-es\">Nivel avanzado<\/span><span class=\"vc8-ecosys-en\">Advanced tier<\/span><\/span><span><span class=\"vc8-ecosys-es\">Validaci\u00f3n<\/span><span class=\"vc8-ecosys-en\">Qualification<\/span><\/span><\/div>\n          <a class=\"vc8-mini-btn vc8-mini-btn--violet\" href=\"https:\/\/partners.vchat.com.mx\/\" data-partners-link rel=\"noopener\"><span class=\"vc8-ecosys-es\">Explorar nivel Estrat\u00e9gico \u2197<\/span><span class=\"vc8-ecosys-en\">Explore Strategic Partner \u2197<\/span><\/a>\n        <\/article>\n      <\/div>\n      <p class=\"vc8-partners-foot\" data-r><span class=\"vc8-ecosys-es\">Las insignias certificadas se otorgan \u00fanicamente tras cumplir los requisitos y mantener la certificaci\u00f3n vigente. Consulta condiciones y beneficios en el portal oficial.<\/span><span class=\"vc8-ecosys-en\">Certified badges are issued only after meeting the requirements and maintaining an active certification. See the official portal for eligibility and benefits.<\/span><\/p>\n    <\/div>\n  <\/section>\n\n  <!-- ================= VCHAT AGENCY HUB \u00b7 NUEVO ================= -->\n  <section class=\"vc8-agency-zone\" id=\"vchat-agency-hub\" aria-label=\"Vchat Agency Hub\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-agency-panel\" data-r>\n        <div class=\"vc8-agency-copy\">\n          <img decoding=\"async\" class=\"vc8-agency-logo\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/10\/Vchat-Agency-Hub-Blanco.png\" alt=\"Vchat Agency Hub by StudioVainilla\" loading=\"lazy\">\n          <span class=\"vc8-agency-eyebrow\"><span class=\"vc8-ecosys-es\">Un centro de operaci\u00f3n para agencias<\/span><span class=\"vc8-ecosys-en\">One operations hub for agencies<\/span><\/span>\n          <h2><span class=\"vc8-ecosys-es\">Todos los workspaces de tus clientes. <span>Un solo lugar para colaborar.<\/span><\/span><span class=\"vc8-ecosys-en\">Your clients\u2019 workspaces. <span>One place to collaborate.<\/span><\/span><\/h2>\n          <p><span class=\"vc8-ecosys-es\">Vchat Agency Hub permite a las agencias trabajar con los workspaces vinculados de sus clientes, consultar indicadores, coordinar a sus Community Managers y solicitar acceso operativo cuando el cliente lo autorice.<\/span><span class=\"vc8-ecosys-en\">Vchat Agency Hub helps agencies manage relationships with linked client workspaces, review metrics, coordinate community managers, and request operational access with client approval.<\/span><\/p>\n          <div class=\"vc8-agency-benefits\"><span><span class=\"vc8-ecosys-es\">M\u00faltiples clientes<\/span><span class=\"vc8-ecosys-en\">Multiple clients<\/span><\/span><span><span class=\"vc8-ecosys-es\">M\u00e9tricas y seguimiento<\/span><span class=\"vc8-ecosys-en\">Metrics and tracking<\/span><\/span><span><span class=\"vc8-ecosys-es\">Colaboraci\u00f3n CM<\/span><span class=\"vc8-ecosys-en\">CM collaboration<\/span><\/span><span><span class=\"vc8-ecosys-es\">Permisos del cliente<\/span><span class=\"vc8-ecosys-en\">Client-controlled access<\/span><\/span><\/div>\n          <div class=\"vc8-agency-actions\">\n            <a class=\"vc8-btn vc8-btn--primary\" href=\"https:\/\/vchat.com.mx\/agencias-vchat\/\" data-agency-link rel=\"noopener\"><span class=\"vc8-ecosys-es\">Conocer Agency Hub \u2197<\/span><span class=\"vc8-ecosys-en\">Explore Agency Hub \u2197<\/span><\/a>\n            <a class=\"vc8-btn vc8-btn--secondary\" href=\"https:\/\/partners.vchat.com.mx\/\" data-partners-link rel=\"noopener\"><span class=\"vc8-ecosys-es\">Programa de Partners<\/span><span class=\"vc8-ecosys-en\">Partner program<\/span><\/a>\n          <\/div>\n        <\/div>\n        <div class=\"vc8-agency-art\" aria-hidden=\"true\">\n          <div class=\"vc8-agency-orbit\"><\/div>\n          <div class=\"vc8-agency-visual\">\n            <div class=\"vc8-agency-screenbar\"><i><\/i><i><\/i><i><\/i><\/div>\n            <div class=\"vc8-agency-visual-title\"><span class=\"vc8-ecosys-es\">Workspaces vinculados<\/span><span class=\"vc8-ecosys-en\">Linked workspaces<\/span><b>AGENCY HUB<\/b><\/div>\n            <div class=\"vc8-agency-workspace\"><i>01<\/i><span>\u00d3rbita Studio<\/span><small>\u25cf<\/small><\/div>\n            <div class=\"vc8-agency-workspace\"><i>02<\/i><span>Nexo Caf\u00e9<\/span><small>\u25cf<\/small><\/div>\n            <div class=\"vc8-agency-workspace\"><i>03<\/i><span>Aurora Bikes<\/span><small>\u25cf<\/small><\/div>\n          <\/div>\n          <div class=\"vc8-agency-float\"><span class=\"vc8-ecosys-es\">\u2713 Acceso autorizado<\/span><span class=\"vc8-ecosys-en\">\u2713 Access approved<\/span> <strong>\u25cf<\/strong><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= LEARNING HUB ================= -->\n  <section class=\"vc8-section vc8-learning-zone\" id=\"vchat-learning-hub\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-learning-shell\" data-r>\n        <div class=\"vc8-learning-intro\">\n          <div class=\"vc8-kicker\">Vchat Learning Hub<\/div>\n          <h2 class=\"vc8-title vc8-title--sm\">Aprende Vchat. Y aprende a sacarle m\u00e1s provecho.<\/h2>\n          <p class=\"vc8-copy\">Consulta documentaci\u00f3n oficial, toma cursos, descubre casos de uso y utiliza recursos listos para llevar Vchat a la pr\u00e1ctica en tu operaci\u00f3n.<\/p>\n          <div class=\"vc8-learning-actions\">\n            <a class=\"vc8-btn vc8-btn--primary\" href=\"https:\/\/docs.vchat.com.mx\/\" data-hub-route=\"\" rel=\"noopener\">Explorar Learning Hub<\/a>\n            <a class=\"vc8-btn vc8-btn--secondary\" href=\"https:\/\/docs.vchat.com.mx\/#\/academy\" data-hub-route=\"academy\" rel=\"noopener\">Ir a Academy<\/a>\n          <\/div>\n          <div class=\"vc8-learning-note\"><b>De la funci\u00f3n a la pr\u00e1ctica.<\/b> Docs explica qu\u00e9 hace cada herramienta; Academy ense\u00f1a a dominarla; Playbooks muestra c\u00f3mo aplicarla y Toolkit te ayuda a implementarla.<\/div>\n        <\/div>\n        <div class=\"vc8-learning-grid\">\n          <a class=\"vc8-learning-card\" data-spot href=\"https:\/\/docs.vchat.com.mx\/#\/docs\" data-hub-route=\"docs\" rel=\"noopener\">\n            <div><div class=\"vc8-learning-top\"><span class=\"vc8-learning-icon\">DOC<\/span><h3>Docs<\/h3><\/div><p>Gu\u00edas oficiales para configurar, entender y resolver dudas sobre cada m\u00f3dulo de Vchat.<\/p><\/div>\n            <span class=\"vc8-learning-link\">Consultar documentaci\u00f3n<\/span>\n          <\/a>\n          <a class=\"vc8-learning-card\" data-spot href=\"https:\/\/docs.vchat.com.mx\/#\/academy\" data-hub-route=\"academy\" rel=\"noopener\">\n            <div><div class=\"vc8-learning-top\"><span class=\"vc8-learning-icon\">A<\/span><h3>Academy<\/h3><\/div><p>Cursos y rutas de aprendizaje para administradores, equipos, ventas, soporte y AI.<\/p><\/div>\n            <span class=\"vc8-learning-link\">Comenzar a aprender<\/span>\n          <\/a>\n          <a class=\"vc8-learning-card\" data-spot href=\"https:\/\/docs.vchat.com.mx\/#\/playbooks\" data-hub-route=\"playbooks\" rel=\"noopener\">\n            <div><div class=\"vc8-learning-top\"><span class=\"vc8-learning-icon\">PB<\/span><h3>Playbooks<\/h3><\/div><p>Casos de uso para ventas, atenci\u00f3n, reservas, soporte, automatizaci\u00f3n y operaciones multiservicio.<\/p><\/div>\n            <span class=\"vc8-learning-link\">Ver casos de uso<\/span>\n          <\/a>\n          <a class=\"vc8-learning-card\" data-spot href=\"https:\/\/docs.vchat.com.mx\/#\/toolkit\" data-hub-route=\"toolkit\" rel=\"noopener\">\n            <div><div class=\"vc8-learning-top\"><span class=\"vc8-learning-icon\">TK<\/span><h3>Toolkit<\/h3><\/div><p>Plantillas, prompts, checklists y matrices listas para configurar y operar Vchat mejor.<\/p><\/div>\n            <span class=\"vc8-learning-link\">Abrir herramientas<\/span>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ================= CTA FINAL ================= -->\n  <section class=\"vc8-section\" style=\"padding-bottom:42px\" id=\"vchat-empezar\">\n    <div class=\"vc8-wrap\">\n      <div class=\"vc8-final\" data-r>\n        <div class=\"vc8-final-orb\" aria-hidden=\"true\"><\/div>\n        <div class=\"vc8-final-grid\">\n          <div class=\"vc8-final-copy\">\n            <div class=\"vc8-final-eyebrow\">Empieza con tu operaci\u00f3n real<\/div>\n            <h2>Conoce Vchat durante 14 d\u00edas.<\/h2>\n            <p>Centraliza tus canales, prueba la operaci\u00f3n con tu equipo y descubre c\u00f3mo se conectan Inbox, CRM, Agenda, Tareas, Automatizaciones y Agentes AI.<\/p>\n            <div class=\"vc8-final-benefits\" aria-label=\"Beneficios de la prueba\">\n              <span>Sin cargos hoy<\/span><span>Configura tu workspace<\/span><span>Prueba con casos reales<\/span>\n            <\/div>\n          <\/div>\n          <aside class=\"vc8-final-panel\" aria-label=\"Opciones para comenzar con Vchat\">\n            <h3>Empieza como prefieras<\/h3>\n            <p>Crea tu workspace ahora o habla con nuestro equipo antes de comenzar.<\/p>\n            <div class=\"vc8-final-panel-actions\">\n              <a class=\"vc8-btn vc8-btn--primary\" data-mag href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\">Comenzar 14 d\u00edas gratis<\/a>\n              <a class=\"vc8-btn vc8-btn--secondary\" href=\"https:\/\/vchat.com.mx\/contacto\" rel=\"noopener\">Hablar con un ejecutivo<\/a>\n            <\/div>\n            <div class=\"vc8-final-learning\">\n              <span>\u00bfPrefieres conocer Vchat antes de empezar?<\/span>\n              <a href=\"https:\/\/docs.vchat.com.mx\/\" data-hub-route=\"\" rel=\"noopener\">Explorar Learning Hub<\/a>\n            <\/div>\n          <\/aside>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- Barra de acci\u00f3n en m\u00f3vil -->\n  <div class=\"vc8-dock\" aria-hidden=\"true\">\n    <a class=\"vc8-btn vc8-btn--primary\" href=\"https:\/\/chat.vchat.com.mx\/registro\/\" rel=\"noopener\" tabindex=\"-1\">Comenzar 14 d\u00edas gratis<\/a>\n    <a class=\"vc8-mini-btn\" href=\"https:\/\/vchat.com.mx\/precios\/\" rel=\"noopener\" tabindex=\"-1\">Precios<\/a>\n  <\/div>\n\n<script>\n(function(){\n  var root=document.getElementById('vch8');\n  if(!root||root.getAttribute('data-ready')==='1')return;\n  root.setAttribute('data-ready','1');\n  var reduced=window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  var fine=window.matchMedia('(pointer:fine)').matches;\n  var hasIO='IntersectionObserver' in window;\n  function $(s,c){return (c||root).querySelector(s)}\n  function $$(s,c){return Array.prototype.slice.call((c||root).querySelectorAll(s))}\n  function watch(el,cb,m){if(!el)return;if(!hasIO){cb(true);return}new IntersectionObserver(function(es){cb(es[0].isIntersecting)},{rootMargin:m||'0px'}).observe(el)}\n  root.classList.add('vc8-js');\n  requestAnimationFrame(function(){setTimeout(function(){root.classList.add('vc8-ready')},60)});\n\n  \/* ---------- Reveal ---------- *\/\n  var rv=$$('[data-r]');\n  if(hasIO&&!reduced){\n    var io=new IntersectionObserver(function(es){es.forEach(function(e){if(e.isIntersecting){e.target.classList.add('is-in');io.unobserve(e.target)}})},{threshold:.1,rootMargin:'0px 0px -30px 0px'});\n    rv.forEach(function(el){io.observe(el)});\n  }else rv.forEach(function(el){el.classList.add('is-in')});\n\n  \/* ---------- Header externo: altura para anclas ---------- *\/\n  function headerH(){\n    var h=0,c=document.querySelectorAll('header,.elementor-location-header,#masthead,.site-header');\n    for(var i=0;i<c.length;i++){if(root.contains(c[i]))continue;var cs=getComputedStyle(c[i]);if(cs.position==='fixed'||cs.position==='sticky'){var r=c[i].getBoundingClientRect();if(r.bottom>0&&r.top<=1)h=Math.max(h,r.bottom)}}\n    return h;\n  }\n\n  \/* ---------- Learning Hub seg\u00fan idioma ---------- *\/\n  function lang(){\n    var l=(document.documentElement.getAttribute('lang')||'').toLowerCase();\n    if(l.indexOf('en')===0)return'en';if(l.indexOf('fr')===0)return'fr';if(l.indexOf('pt')===0)return'pt';if(l.indexOf('es')===0)return'es';\n    var f=location.pathname.split('\/').filter(Boolean)[0]||'';return['en','fr','pt'].indexOf(f)>-1?f:'es';\n  }\n  (function(){var base=lang()==='es'?'https:\/\/docs.vchat.com.mx\/':'https:\/\/docs.vchat.com.mx\/en\/';\n    $$('[data-hub-route]').forEach(function(a){var r=(a.getAttribute('data-hub-route')||'').replace(\/^\\\/+|\\\/+$\/g,'');a.href=base+(r?'#\/'+r:'')})})();\n\n\n  \/* ---------- Secciones nuevas Partners \/ Agency Hub: idioma y enlaces ---------- *\/\n  (function(){\n    var path=location.pathname.split('\/').filter(Boolean);\n    var en=(path[0]||'').toLowerCase()==='en'||(document.documentElement.lang||'').toLowerCase().indexOf('en')===0;\n    $$('.vc8-ecosys-es').forEach(function(el){el.style.setProperty('display',en?'none':'inline','important')});\n    $$('.vc8-ecosys-en').forEach(function(el){el.style.setProperty('display',en?'inline':'none','important')});\n    $$('img[data-es-src][data-en-src]').forEach(function(im){\n      var wanted=im.getAttribute(en?'data-en-src':'data-es-src');\n      im.onerror=function(){\n        var fallback=im.getAttribute('data-fallback-src');\n        if(im.src!==fallback){im.onerror=null;im.src=fallback}\n      };\n      im.src=wanted;\n    });\n    $$('[data-partners-link]').forEach(function(a){a.href='https:\/\/partners.vchat.com.mx\/'+(en?'en\/':'')});\n    $$('[data-agency-link]').forEach(function(a){a.href='https:\/\/vchat.com.mx\/'+(en?'en\/':'')+'agencias-vchat\/'});\n  })();\n\n  \/* Tarjetas flotantes del HERO eliminadas a petici\u00f3n del usuario. *\/\n\n  \/* ---------- Pilares en secuencia ---------- *\/\n  var pil=$$('.vc8-pillar'),pI=-1,pT;\n  function pTick(){pil.forEach(function(p){p.classList.remove('on')});pI=(pI+1)%pil.length;void pil[pI].offsetWidth;pil[pI].classList.add('on');pT=setTimeout(pTick,2400)}\n  if(pil.length&&!reduced)watch($('.vc8-pillars'),function(v){clearTimeout(pT);if(v)pTick()});\n\n  \/* ---------- Filtros de capacidades ---------- *\/\n  var cards=$$('.vc8-card');\n  $$('.vc8-filter').forEach(function(btn){\n    btn.addEventListener('click',function(){\n      var f=btn.getAttribute('data-f');\n      $$('.vc8-filter').forEach(function(b){var on=b===btn;b.classList.toggle('is-active',on);b.setAttribute('aria-selected',on?'true':'false')});\n      var n=0;\n      cards.forEach(function(c){\n        var show=f==='all'||c.getAttribute('data-g')===f;\n        c.classList.remove('pop');\n        if(show){c.classList.remove('out');c.classList.add('is-in');c.style.setProperty('--fd',(n*45)+'ms');void c.offsetWidth;c.classList.add('pop');n++}\n        else c.classList.add('out');\n      });\n    });\n  });\n\n  \/* ---------- Contadores ---------- *\/\n  $$('[data-count]').forEach(function(el){\n    if(reduced)return;var to=+el.getAttribute('data-count'),done=false;el.textContent='0';\n    watch(el,function(v){if(!v||done)return;done=true;var t0=performance.now();(function f(n){var k=Math.min(1,(n-t0)\/1200);el.textContent=Math.round(to*(1-Math.pow(1-k,3)));if(k<1)requestAnimationFrame(f)})(t0)});\n  });\n\n  \/* ---------- M\u00f3dulos reales aprobados: 1 visor, lazy load y pausa fuera de pantalla ---------- *\/\n  (function(){\n    var keys=['inbox','contacts','crm','tasks','calendar','agents'];\n    var details={\n      inbox:['Inbox omnicanal','Atenci\u00f3n, AI, productos, transferencias, responsables y pipeline en movimiento.','Inbox en acci\u00f3n'],\n      contacts:['Contactos + Ficha 360\u00b0','Explora contactos ficticios, actividad, categor\u00edas, valor, filtros y acciones de seguimiento.','Contactos V1 aprobado'],\n      crm:['CRM visual','Recorrido de oportunidades, etapas, tarjetas y conversiones con casos ficticios.','CRM V1 aprobado'],\n      tasks:['Tareas y seguimientos','Gestiona prioridades, responsables, estados y fechas calculadas seg\u00fan el d\u00eda de visita.','Tareas V1 aprobado'],\n      calendar:['Agenda y reservas','Navega un calendario din\u00e1mico con reservas ficticias y fechas del periodo actual.','Agenda V1 aprobado'],\n      agents:['Agentes AI especializados','Conoce a Sof\u00eda, Diego y Alex y observa su configuraci\u00f3n y pruebas ficticias.','Agentes AI V1 aprobado']\n    };\n    var frame=$('#vc8-live-frame'),loader=$('.vc8-live-loading'),tt=$('[data-show-title]'),cc=$('[data-show-copy]'),tag=$('[data-show-tag]'),counter=$('[data-demo-position]');\n    var buttons=$$('.vc8-tab[data-demo]'),section=$('.vc8-show-live'),active=0,visible=false, timer=null, cycle=14500;\n    function setFrame(key){\n      var t=document.getElementById('vc8-approved-'+key);\n      if(!t)return;\n      if(loader)loader.classList.remove('ready');\n      frame.setAttribute('title','Clon animado aprobado de '+key+' en Vchat');\n      frame.srcdoc=t.innerHTML;\n    }\n    frame.addEventListener('load',function(){if(loader)loader.classList.add('ready')});\n    function show(i){\n      active=(i+keys.length)%keys.length;\n      buttons.forEach(function(b,j){var yes=j===active;b.classList.toggle('is-active',yes);b.setAttribute('aria-selected',yes?'true':'false');b.classList.remove('auto')});\n      var d=details[keys[active]];tt.textContent=d[0];cc.textContent=d[1];tag.textContent=d[2];\n      if(counter)counter.textContent=String(active+1).padStart(2,'0')+' \/ 06';\n      var b=buttons[active];if(b){var nav=b.parentElement;if(nav.scrollWidth>nav.clientWidth){nav.scrollLeft=Math.max(0,b.offsetLeft-nav.offsetLeft-(nav.clientWidth-b.offsetWidth)\/2)}}\n      if(visible)setFrame(keys[active]);\n      clearTimeout(timer);\n      if(visible&&!reduced)timer=setTimeout(function(){show(active+1)},cycle);\n    }\n    buttons.forEach(function(b,i){b.addEventListener('click',function(){show(i)})});\n    var prev=$('[data-demo-prev]'),next=$('[data-demo-next]');\n    if(prev)prev.addEventListener('click',function(){show(active-1)});\n    if(next)next.addEventListener('click',function(){show(active+1)});\n    if('IntersectionObserver' in window){new IntersectionObserver(function(es){\n      visible=es[0].isIntersecting;\n      clearTimeout(timer);\n      if(visible){setFrame(keys[active]);if(!reduced)timer=setTimeout(function(){show(active+1)},cycle)}\n      else {frame.removeAttribute('srcdoc');frame.src='about:blank';if(loader)loader.classList.remove('ready')}\n    },{threshold:.04}).observe(section)}else{visible=true;show(0)}\n    var aiFrame=$('#vc8-agents-secondary'),aiSection=$('.vc8-dark-live');\n    if(aiFrame&&aiSection){var agentHtml=document.getElementById('vc8-approved-agents');\n      if('IntersectionObserver' in window){new IntersectionObserver(function(es){if(es[0].isIntersecting){if(!aiFrame.srcdoc)aiFrame.srcdoc=agentHtml.innerHTML}else{aiFrame.removeAttribute('srcdoc');aiFrame.src='about:blank'}},{threshold:.04}).observe(aiSection)}\n      else aiFrame.srcdoc=agentHtml.innerHTML;\n    }\n  })();\n\n  \/* ---------- AI: tarjetas en secuencia ---------- *\/\n  var dk=$$('.vc8-dark-card'),dI=-1,dT;\n  function dTick(){dk.forEach(function(c){c.classList.remove('on')});dI=(dI+1)%dk.length;void dk[dI].offsetWidth;dk[dI].classList.add('on');dT=setTimeout(dTick,3000)}\n  if(dk.length&&!reduced)watch($('.vc8-dark-cards'),function(v){clearTimeout(dT);if(v)dTick()});\n\n  \/* ---------- Automatizaciones: flujo ---------- *\/\n  var st=$$('.vc8-step'),dot=$('.vc8-flow-dot'),aI=-1,aT;\n  function aTick(){st.forEach(function(s){s.classList.remove('on')});aI=(aI+1)%st.length;st[aI].classList.add('on');if(dot)dot.style.top=(st[aI].offsetTop+st[aI].offsetHeight\/2-6)+'px';aT=setTimeout(aTick,1800)}\n  if(st.length&&!reduced)watch($('.vc8-flow'),function(v){clearTimeout(aT);if(v)aTick()});\n\n  \/* ---------- Vchat \u21c4 Vmail: rutas y paquetes ---------- *\/\n  var link=$('.vc8-link'),paths=$$('.vc8-link path'),pks=$$('.vc8-pk'),chs=$$('.vc8-contact-ch span'),lkOn=false,lkRaf;\n  function ctr(el,box){var r=el.getBoundingClientRect();return[r.left-box.left+r.width\/2,r.top-box.top+r.height\/2]}\n  function buildLink(){\n    if(!link)return;var b=link.getBoundingClientRect();\n    var a=ctr($('.vc8-node--chat'),b),c=ctr($('.vc8-contact'),b),m=ctr($('.vc8-node--mail'),b);\n    paths[0].setAttribute('d','M'+a[0]+' '+a[1]+' C '+a[0]+' '+(a[1]+90)+', '+(c[0]-90)+' '+c[1]+', '+c[0]+' '+c[1]);\n    paths[1].setAttribute('d','M'+m[0]+' '+m[1]+' C '+m[0]+' '+(m[1]-90)+', '+(c[0]+90)+' '+c[1]+', '+c[0]+' '+c[1]);\n  }\n  var t0=performance.now(),lastCh=-1;\n  function lkLoop(n){\n    if(!lkOn)return;\n    var T=((n-t0)\/1000)%5;\n    pks.forEach(function(p,i){\n      var path=paths[i],L=path.getTotalLength?path.getTotalLength():0;if(!L)return;\n      var tt=((T-i*2.5)+5)%5,k=Math.min(1,tt\/2.2),e=k<.5?2*k*k:1-Math.pow(-2*k+2,2)\/2;\n      var pt=path.getPointAtLength(e*L);p.style.transform='translate('+pt.x+'px,'+pt.y+'px)';p.style.opacity=tt<2.2?(k<.1?k*10:k>.9?(1-k)*10:1):0;\n    });\n    var ch=Math.floor(((n-t0)\/1000)\/1.4)%chs.length;\n    if(ch!==lastCh){chs.forEach(function(s,j){s.classList.toggle('on',j===ch)});lastCh=ch}\n    lkRaf=requestAnimationFrame(lkLoop);\n  }\n  if(link){buildLink();window.addEventListener('resize',buildLink);\n    if(!reduced)watch(link,function(v){lkOn=v;cancelAnimationFrame(lkRaf);if(v){buildLink();lkRaf=requestAnimationFrame(lkLoop)}})}\n\n  \/* ---------- Tilt, spotlight y botones magn\u00e9ticos ---------- *\/\n  if(fine&&!reduced){\n    $$('[data-tilt]').forEach(function(el){var m=parseFloat(el.getAttribute('data-tilt'))||4;\n      el.addEventListener('pointermove',function(e){var r=el.getBoundingClientRect(),x=(e.clientX-r.left)\/r.width,y=(e.clientY-r.top)\/r.height;el.style.setProperty('--rx',((.5-y)*m)+'deg');el.style.setProperty('--ry',((x-.5)*m)+'deg')});\n      el.addEventListener('pointerleave',function(){el.style.setProperty('--rx','0deg');el.style.setProperty('--ry','0deg')})});\n    $$('.vc8-card,[data-spot]').forEach(function(el){el.addEventListener('pointermove',function(e){var r=el.getBoundingClientRect();el.style.setProperty('--mx',(e.clientX-r.left)+'px');el.style.setProperty('--my',(e.clientY-r.top)+'px')})});\n    $$('[data-mag]').forEach(function(b){\n      b.addEventListener('pointermove',function(e){var r=b.getBoundingClientRect();b.style.setProperty('--bx',((e.clientX-r.left-r.width\/2)*.2)+'px');b.style.setProperty('--by',((e.clientY-r.top-r.height\/2)*.28)+'px')});\n      b.addEventListener('pointerleave',function(){b.style.setProperty('--bx','0px');b.style.setProperty('--by','0px')})});\n  }\n\n  \/* ---------- Progreso y barra m\u00f3vil ---------- *\/\n  var bar=$('.vc8-progress'),dock=$('.vc8-dock'),hero=$('.vc8-hero'),fin=$('#vchat-empezar'),finVis=false,tick=false;\n  watch(fin,function(v){finVis=v;onScroll()},'0px 0px 80px 0px');\n  function onScroll(){if(tick)return;tick=true;requestAnimationFrame(function(){tick=false;\n    var r=root.getBoundingClientRect(),max=r.height-innerHeight;if(bar)bar.style.transform='scaleX('+(max>0?Math.max(0,Math.min(1,-r.top\/max)):0)+')';\n    if(dock){var show=hero.getBoundingClientRect().bottom<0&&!finVis;if(dock.classList.contains('show')!==show){dock.classList.toggle('show',show);dock.setAttribute('aria-hidden',show?'false':'true');$$('a',dock).forEach(function(a){a.tabIndex=show?0:-1})}}\n  })}\n  window.addEventListener('scroll',onScroll,{passive:true});window.addEventListener('resize',onScroll);onScroll();\n\n  \/* ---------- Anclas internas ---------- *\/\n  $$('a[href^=\"#\"]').forEach(function(a){a.addEventListener('click',function(e){var t=root.querySelector(a.getAttribute('href'));if(!t)return;e.preventDefault();window.scrollTo({top:t.getBoundingClientRect().top+pageYOffset-headerH()-16,behavior:reduced?'auto':'smooth'})})});\n})();\n<\/script>\n<\/div>\n\n<!-- =========================================================\nVCHAT V8 \u2014 PARCHE ADITIVO EXCLUSIVO PARA LA IMAGEN DEL HERO\nNo reemplazar ni eliminar una sola l\u00ednea del V8.\nAgregar este bloque COMPLETO al final del HTML original V8,\ndespu\u00e9s del cierre <\/div> original.\nNo modifica ni reescribe otras secciones, efectos ni JavaScript.\nDemo ficticia: PedalNube Demo (bicicletas).\n========================================================= -->\n<div id=\"vchat-v8-inbox-mount\" hidden aria-hidden=\"true\">\n<!-- Vchat by StudioVainilla | Inbox HERO animado | Pega TODO en un widget HTML de Elementor -->\n<div id=\"vchatHeroClone2\">\n  <div class=\"vhc-stage\">\n    <div class=\"vhc-app\">\n      <aside class=\"vhc-sidebar\">\n        <div class=\"vhc-brandbar\">\n          <div class=\"vhc-brand\">\n            <img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\">\n          <\/div>\n          <button class=\"vhc-collapse\" aria-hidden=\"true\">\n            <svg viewBox=\"0 0 24 24\"><path d=\"M14.5 6 9 12l5.5 6\"\/><\/svg>\n          <\/button>\n        <\/div>\n\n        <div class=\"vhc-nav-section\">TRABAJO<\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 11.2 12 4l8 7.2\"\/><path d=\"M7 10.7V20h10v-9.3\"\/><\/svg><\/span><span>Inicio<\/span><\/div>\n        <div class=\"vhc-nav-item active\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M5 6.2h14v10.2H8.7L5 19.8z\"\/><\/svg><\/span><span>Inbox<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"8\" r=\"3.15\"\/><path d=\"M5.4 20c1.05-3.8 3.95-5.9 6.6-5.9 2.65 0 5.55 2.1 6.6 5.9\"\/><\/svg><\/span><span>Contactos<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M4 5.6h16l-6.4 7.1v5.1l-3.2 1.7v-6.8z\"\/><\/svg><\/span><span>CRM<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.1\"\/><path d=\"m8.7 12.4 2.2 2.1 4.5-4.9\"\/><\/svg><\/span><span>Tareas<\/span><em>0<\/em><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M7 3.9v3.3\"\/><path d=\"M17 3.9v3.3\"\/><path d=\"M4.7 8.2h14.6\"\/><rect x=\"4.7\" y=\"5.7\" width=\"14.6\" height=\"14\" rx=\"2.2\"\/><\/svg><\/span><span>Agenda<\/span><\/div>\n\n        <div class=\"vhc-nav-section\">HERRAMIENTAS<\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M12.1 3 7.8 12h4.1L10.8 21l5.4-11h-4z\"\/><\/svg><\/span><span>Automatizaciones<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M4.8 6.4h14.4v11.2H8.6l-3.8 3.1z\"\/><path d=\"M8.4 10.2h7.2\"\/><path d=\"M8.4 13.2h5\"\/><\/svg><\/span><span>Respuestas y recursos<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M7 5.7h10v12.6H7z\"\/><path d=\"M11 5.7v12.6\"\/><\/svg><\/span><span>Conocimiento AI<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 3.9 18.7 7.7v8.6L12 20.1l-6.7-3.8V7.7z\"\/><\/svg><\/span><span>Productos y servicios<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 4.4v15.2\"\/><path d=\"M4.4 12h15.2\"\/><path d=\"m6.9 6.9 10.2 10.2\"\/><path d=\"M17.1 6.9 6.9 17.1\"\/><\/svg><\/span><span>Agentes AI<\/span><\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.8\"\/><path d=\"M9.5 10.3c0-1.2.94-2.1 2.46-2.1 1.38 0 2.34.72 2.34 1.95 0 1.16-.73 1.65-1.63 2.2-.93.55-1.34.99-1.34 1.92v.22\"\/><circle cx=\"12\" cy=\"16.9\" r=\".7\" fill=\"currentColor\" stroke=\"none\"\/><\/svg><\/span><span>Cr\u00e9ditos AI<\/span><em>1,876<\/em><\/div>\n\n        <div class=\"vhc-nav-section\">INSIGHTS<\/div>\n        <div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewBox=\"0 0 24 24\"><path d=\"M4.8 18.6 9.2 14l3 2.8 6-7.3\"\/><path d=\"M15.7 9.5h2.5V12\"\/><\/svg><\/span><span>Anal\u00edtica<\/span><\/div>\n      <\/aside>\n\n      <main class=\"vhc-main\">\n        <header class=\"vhc-topbar\">\n          <div class=\"vhc-top-left\">\n            <small>PedalNube Demo<\/small>\n            <strong>Inbox<\/strong>\n          <\/div>\n          <div class=\"vhc-top-right\">\n            <div class=\"vhc-pill flag\">\ud83c\uddf2\ud83c\uddfd <span>ES<\/span><\/div>\n            <div class=\"vhc-pill ai-pill\" data-top-ai-pill><span class=\"vhc-stars\">\u2726<\/span><b>AI<\/b><span class=\"vhc-switch on\" data-top-switch><i><\/i><\/span><\/div>\n            <button class=\"vhc-round\"><svg viewBox=\"0 0 24 24\"><circle cx=\"10.7\" cy=\"10.7\" r=\"4.9\"\/><path d=\"m14.4 14.4 4.2 4.2\"\/><\/svg><\/button>\n            <button class=\"vhc-round\"><svg viewBox=\"0 0 24 24\"><path d=\"M7.2 6.1h9.6\"\/><path d=\"M7.2 9.9h9.6\"\/><path d=\"M7.2 13.8h9.6\"\/><path d=\"M7.2 17.6h9.6\"\/><\/svg><\/button>\n            <button class=\"vhc-round noti\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 3.8 18.2 12 12 20.2 5.8 12z\"\/><\/svg><i><\/i><\/button>\n          <\/div>\n        <\/header>\n\n        <div class=\"vhc-content\">\n          <section class=\"vhc-list-panel\">\n            <div class=\"vhc-list-head\">\n              <div>\n                <h2>Inbox<\/h2>\n                <p><b data-review-count>11<\/b> por revisar \u00b7 <b data-unread-copy>1<\/b> sin leer<\/p>\n              <\/div>\n              <div class=\"vhc-view-actions\">\n                <button>\n                  <svg viewBox=\"0 0 24 24\"><path d=\"m7 12 3.2 3.1L17 8.4\"\/><\/svg>\n                <\/button>\n                <button class=\"active\">\n                  <svg viewBox=\"0 0 24 24\"><path d=\"M7 7h10v10H7z\"\/><\/svg>\n                <\/button>\n              <\/div>\n            <\/div>\n\n            <div class=\"vhc-folders\">\n              <div class=\"vhc-folder active\"><span class=\"vhc-ficon\"><svg viewBox=\"0 0 24 24\"><path d=\"M4.9 8.2h14.2v7.7H4.9z\"\/><\/svg><\/span><b data-inbox-count>10<\/b><\/div>\n              <div class=\"vhc-folder\"><span class=\"vhc-ficon\"><svg viewBox=\"0 0 24 24\"><path d=\"M7.4 6.5h9.2v11H7.4z\"\/><path d=\"M9.2 9.1h5.6\"\/><path d=\"M9.2 11.9h5.6\"\/><\/svg><\/span><b>0<\/b><\/div>\n              <div class=\"vhc-folder\"><span class=\"vhc-ficon\"><svg viewBox=\"0 0 24 24\"><path d=\"M8.4 8.5h7.2\"\/><path d=\"M9.1 8.5 8 18.2h8l-1.1-9.7\"\/><path d=\"M10.2 8.5V6.8h3.6v1.7\"\/><\/svg><\/span><b>2<\/b><\/div>\n            <\/div>\n\n            <div class=\"vhc-searchbox\">\n              <svg viewBox=\"0 0 24 24\"><circle cx=\"10.5\" cy=\"10.5\" r=\"4.6\"\/><path d=\"m14 14 4 4\"\/><\/svg>\n              <span>Buscar conversaciones...<\/span>\n              <b>\u00d7<\/b>\n            <\/div>\n\n            <div class=\"vhc-filter-row\">\n              <div class=\"vhc-mini-tabs\">\n                <span class=\"active\">Todas<\/span>\n                <span>M\u00edas<\/span>\n                <span>Sin leer <b data-unread-copy-2>1<\/b><\/span>\n              <\/div>\n              <button class=\"vhc-filter-btn\">\n                <svg viewBox=\"0 0 24 24\"><path d=\"M5.3 7.4h13.4\"\/><path d=\"M8.1 12h7.8\"\/><path d=\"M10 16.6h4\"\/><circle cx=\"8.1\" cy=\"7.4\" r=\"1\" fill=\"currentColor\" stroke=\"none\"\/><circle cx=\"15.8\" cy=\"12\" r=\"1\" fill=\"currentColor\" stroke=\"none\"\/><circle cx=\"12\" cy=\"16.6\" r=\"1\" fill=\"currentColor\" stroke=\"none\"\/><\/svg>\n                Filtros\n              <\/button>\n            <\/div>\n\n            <div class=\"vhc-conversation-list\">\n              <article class=\"vhc-conv\" data-conv data-name=\"Iv\u00e1n Sol\u00eds\" data-avatar=\"IS\" data-channel=\"WhatsApp\">\n                <div class=\"vhc-conv-avatar\">IS<\/div>\n                <div class=\"vhc-conv-body\">\n                  <div class=\"vhc-conv-top\"><strong>Iv\u00e1n Sol\u00eds<\/strong><time>1 min<\/time><\/div>\n                  <div class=\"vhc-conv-channel\">WhatsApp<\/div>\n                  <div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag lilac\">Sin asignar<\/span><\/div>\n                <\/div>\n                <div class=\"vhc-unread-dot\">1<\/div>\n              <\/article>\n\n              <article class=\"vhc-conv\" data-conv data-name=\"Eva Luna\" data-avatar=\"EL\" data-channel=\"WhatsApp\">\n                <div class=\"vhc-conv-avatar\">EL<\/div>\n                <div class=\"vhc-conv-body\">\n                  <div class=\"vhc-conv-top\"><strong>Eva Luna<\/strong><time>57 min<\/time><\/div>\n                  <div class=\"vhc-conv-channel\">WhatsApp<\/div>\n                  <div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag lilac\">Sin asignar<\/span><span class=\"tag pale\">Nuevo<\/span><\/div>\n                <\/div>\n              <\/article>\n\n              <article class=\"vhc-conv active\" data-conv-main data-conv data-name=\"Nora R\u00edos\" data-avatar=\"NR\" data-channel=\"WhatsApp\">\n                <div class=\"vhc-conv-avatar main-avatar\">NR<\/div>\n                <div class=\"vhc-conv-body\">\n                  <div class=\"vhc-conv-top\"><strong data-contact-name>Nora R\u00edos<\/strong><time>2 h<\/time><\/div>\n                  <div class=\"vhc-conv-channel\">WhatsApp<\/div>\n                  <div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag green\">Con Agente Leo<\/span><span class=\"tag blue\">Calificado<\/span><\/div>\n                <\/div>\n              <\/article>\n\n              <article class=\"vhc-conv\" data-conv data-name=\"Mauro Paz\" data-avatar=\"MP\" data-channel=\"Instagram\">\n                <div class=\"vhc-conv-avatar\">MP<\/div>\n                <div class=\"vhc-conv-body\">\n                  <div class=\"vhc-conv-top\"><strong>Mauro Paz<\/strong><time>3 h<\/time><\/div>\n                  <div class=\"vhc-conv-channel\">Instagram<\/div>\n                  <div class=\"vhc-tags\"><span class=\"tag wa ig\">IG<\/span><span class=\"tag softyellow\">Esperando humano<\/span><\/div>\n                <\/div>\n              <\/article>\n            <\/div>\n\n            <div class=\"vhc-export-btn\">\n              <svg viewBox=\"0 0 24 24\"><path d=\"M12 5.2v9.5\"\/><path d=\"m8.1 10.9 3.9 3.8 3.9-3.8\"\/><path d=\"M5.4 18.8h13.2\"\/><\/svg>\n              Exportar conversaciones\n            <\/div>\n          <\/section>\n\n          <section class=\"vhc-chat-panel\">\n            <div class=\"vhc-chat-header\">\n              <div class=\"vhc-chat-avatar\" data-chat-avatar>NR<\/div>\n              <div class=\"vhc-chat-title\">\n                <strong data-chat-name>Nora R\u00edos<\/strong>\n                <div class=\"vhc-chat-channel\"><span class=\"tag wa\">WA<\/span><span class=\"tag green softfix\">WhatsApp<\/span><\/div>\n              <\/div>\n              <div class=\"vhc-chat-head-actions\">\n                <button class=\"vhc-chat-circle\"><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.3\"\/><path d=\"M12 10.2v5.1\"\/><circle cx=\"12\" cy=\"7.4\" r=\".8\" fill=\"currentColor\" stroke=\"none\"\/><\/svg><\/button>\n                <button class=\"vhc-ai-btn\" data-ai-activate-btn>Activar modo AI<\/button>\n                <button class=\"vhc-chat-circle\"><svg viewBox=\"0 0 24 24\"><path d=\"m7.2 12.1 3.1 3L17 8.4\"\/><\/svg><\/button>\n                <button class=\"vhc-chat-circle\"><svg viewBox=\"0 0 24 24\"><circle cx=\"7.2\" cy=\"12\" r=\"1.1\" fill=\"currentColor\" stroke=\"none\"\/><circle cx=\"12\" cy=\"12\" r=\"1.1\" fill=\"currentColor\" stroke=\"none\"\/><circle cx=\"16.8\" cy=\"12\" r=\"1.1\" fill=\"currentColor\" stroke=\"none\"\/><\/svg><\/button>\n              <\/div>\n            <\/div>\n\n            <div class=\"vhc-context-row\">\n              <div class=\"vhc-chip\"><span class=\"mini-ico\">\u25eb<\/span> Afinaci\u00f3n de bicicletas <b>\uff0b<\/b><\/div>\n              <div class=\"vhc-chip\" data-mode-chip><span class=\"mini-ico\">\u2197<\/span> Humano atendiendo<\/div>\n              <div class=\"vhc-chip light\"><span class=\"mini-ico\">\u21a9<\/span> PedalNube Demo <b>\u2197<\/b><\/div>\n            <\/div>\n\n            <div class=\"vhc-subtabs\">\n              <div class=\"vhc-reply-tabs\">\n                <button class=\"active\">Responder<\/button>\n                <button>Nota interna<\/button>\n              <\/div>\n              <div class=\"vhc-right-info\">\n                <div class=\"vhc-stat-pill\" data-stage-pill><small>ETAPA<\/small><strong data-stage-text>Calificado<\/strong><\/div>\n                <div class=\"vhc-stat-pill\" data-product-pill><strong>Productos<\/strong><em data-product-count>0<\/em><\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"vhc-sla-row\">\n              <div class=\"vhc-sla-pill grow\"><span class=\"ico\">\ud83d\udc64<\/span><small>Responsable<\/small><strong data-responsable>Agente Leo<\/strong><button data-assign-btn>Asignar<\/button><\/div>\n              <div class=\"vhc-sla-pill\"><span class=\"ico\">\u26a1<\/span><small>Primera respuesta<\/small><strong>Cumplido<\/strong><\/div>\n              <div class=\"vhc-sla-pill\"><span class=\"ico\">\u25d4<\/span><small>Resoluci\u00f3n<\/small><strong>Restan 20h 58m<\/strong><\/div>\n            <\/div>\n\n            <div class=\"vhc-timeline\">\n              <div class=\"vhc-msg incoming show\" data-msg=\"0\">\n                Hola, \u00bfhacen mantenimiento de bicicletas?\n                <small>2 h<\/small>\n              <\/div>\n              <div class=\"vhc-msg incoming show\" data-msg=\"1\">\n                \u00bfTienen espacio esta semana?\n                <small>2 h<\/small>\n              <\/div>\n              <div class=\"vhc-msg outgoing top-right\" data-msg=\"2\">\n                \u00bfEn qu\u00e9 horario te acomoda?\n                <small>2 h \u00b7 Le\u00eddo \u2713\u2713<\/small>\n              <\/div>\n              <div class=\"vhc-typing\" data-typing><i><\/i><i><\/i><i><\/i><\/div>\n              <div class=\"vhc-msg outgoing gradient\" data-msg=\"3\">\n                \u00a1Claro! Tenemos espacio el jueves a las 11:00 o a las 16:00. \u00bfCu\u00e1l prefieres?\n                <small>Ahora \u00b7 Le\u00eddo \u2713\u2713<\/small>\n              <\/div>\n              <div class=\"vhc-msg system\" data-msg=\"4\">Agente Leo tom\u00f3 la conversaci\u00f3n<\/div>\n              <div class=\"vhc-msg outgoing human\" data-msg=\"5\">\n                \u00a1Hola! Soy Leo \ud83d\udeb2 Puedo confirmar la afinaci\u00f3n para el jueves a las 16:00.\n                <small>Ahora \u00b7 Le\u00eddo \u2713\u2713<\/small>\n              <\/div>\n              <div class=\"vhc-msg outgoing template\" data-msg=\"6\">\n                \ud83d\udcc5 Plantilla enviada: cita confirmada \u2014 Afinaci\u00f3n de bicicletas.\n                <small>Ahora \u00b7 Enviado \u2713\u2713<\/small>\n              <\/div>\n            <\/div>\n\n            <div class=\"vhc-composer-top\">\n              <div class=\"vhc-tools-left\">\n                <span>\uff0b <b>Adjuntar<\/b><\/span>\n                <button><svg viewBox=\"0 0 24 24\"><path d=\"M12 4.8v9.5\"\/><path d=\"M9.3 8a2.7 2.7 0 1 1 5.4 0v6a4 4 0 0 1-8 0V9.4\"\/><\/svg><\/button>\n                <button><svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"6.3\"\/><circle cx=\"9.4\" cy=\"10.1\" r=\".9\" fill=\"currentColor\" stroke=\"none\"\/><circle cx=\"14.6\" cy=\"10.1\" r=\".9\" fill=\"currentColor\" stroke=\"none\"\/><path d=\"M9.2 14c.9 1 1.8 1.5 2.8 1.5 1 0 1.9-.5 2.8-1.5\"\/><\/svg><\/button>\n                <span>\u25d4 <b>Programar<\/b><\/span>\n              <\/div>\n              <div class=\"vhc-saved-link\">Respuestas guardadas<\/div>\n            <\/div>\n\n            <div class=\"vhc-window-bar\" data-window-bar>\n              <span class=\"green-dot\"><\/span>\n              <strong>Ventana de 24 h abierta<\/strong>\n              <span>\u00b7 puedes responder libremente (quedan 21 h 50 min).<\/span>\n              <button data-template-btn>Enviar plantilla<\/button>\n            <\/div>\n\n            <div class=\"vhc-composer-box\">\n              <div class=\"vhc-placeholder\" data-input-placeholder>Escribe una respuesta...<\/div>\n              <button>Enviar<\/button>\n            <\/div>\n          <\/section>\n        <\/div>\n      <\/main>\n    <\/div>\n  <\/div>\n  \n  <div class=\"vhc-demo-cursor\" data-cursor>\n    <div class=\"vhc-cursor-ring\"><\/div>\n    <div class=\"vhc-cursor-dot\"><\/div>\n  <\/div>\n\n<\/div>\n<\/div>\n<style>\n\n#vchatHeroClone2{\n  --bg:#ffffff;\n  --page:#fcfcfe;\n  --line:#e6e8f2;\n  --line-2:#dddff0;\n  --text:#2b2d42;\n  --muted:#8a8fad;\n  --muted-2:#a2a8c2;\n  --purple:#635bff;\n  --purple-2:#7267ff;\n  --purple-soft:#f2f0ff;\n  --purple-soft-2:#f7f6ff;\n  --green:#16a34a;\n  --green-soft:#eaf7ee;\n  --blue:#3b82f6;\n  --blue-soft:#e8f1ff;\n  --yellow:#a87115;\n  --yellow-soft:#fff4d9;\n  --wa:#14a44d;\n  --shadow:0 18px 60px rgba(62,67,114,.10);\n  width:100%;\n  border-radius:20px;\n  overflow:hidden;\n  background:#fff;\n  box-shadow:var(--shadow);\n  font-family:Inter, Manrope, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  color:var(--text);\n}\n#vchatHeroClone2 *{box-sizing:border-box}\n#vchatHeroClone2 button{font:inherit}\n#vchatHeroClone2 svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}\n#vchatHeroClone2 .vhc-stage{position:relative;width:100%;overflow:hidden;background:#fff}\n#vchatHeroClone2 .vhc-app{position:absolute;inset:0 auto auto 0;width:1778px;height:900px;display:flex;transform-origin:top left;background:#fff}\n\n#vchatHeroClone2 .vhc-sidebar{width:296px;flex:none;background:#fff;border-right:1px solid var(--line);padding:0 14px 14px;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-brandbar{height:102px;border-bottom:1px solid #ececf5;display:flex;align-items:center;gap:12px;padding:0 10px}\n#vchatHeroClone2 .vhc-brand{flex:1;display:flex;align-items:center}\n#vchatHeroClone2 .vhc-brand img{display:block;width:172px;height:auto}\n#vchatHeroClone2 .vhc-collapse{width:42px;height:42px;border-radius:15px;border:1px solid #dfe3f2;background:#fff;color:#67718f;display:flex;align-items:center;justify-content:center;padding:11px}\n#vchatHeroClone2 .vhc-nav-section{padding:22px 12px 10px;font-size:12px;letter-spacing:.12em;color:#93a0bd;font-weight:800}\n#vchatHeroClone2 .vhc-nav-item{height:50px;border-radius:15px;display:flex;align-items:center;gap:14px;padding:0 14px;color:#687794;font-size:17px;font-weight:700;position:relative}\n#vchatHeroClone2 .vhc-nav-item.active{background:var(--purple-soft);color:var(--purple)}\n#vchatHeroClone2 .vhc-nav-item em{margin-left:auto;min-width:34px;height:34px;border-radius:999px;background:#eef2ff;color:var(--purple);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-icon{width:18px;height:18px;display:block;flex:none;color:inherit}\n\n#vchatHeroClone2 .vhc-main{flex:1;min-width:0;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-topbar{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px 0 30px;background:#fff}\n#vchatHeroClone2 .vhc-top-left small{display:block;font-size:11px;letter-spacing:.08em;color:#95a0b9;font-weight:800;margin-bottom:3px}\n#vchatHeroClone2 .vhc-top-left strong{display:block;font-size:18px;font-weight:800;color:#252841}\n#vchatHeroClone2 .vhc-top-right{display:flex;align-items:center;gap:14px}\n#vchatHeroClone2 .vhc-pill{height:56px;border:1px solid #dfe4f2;border-radius:19px;background:#fff;display:flex;align-items:center;justify-content:center;color:#3a4160}\n#vchatHeroClone2 .vhc-pill.flag{padding:0 18px;gap:10px;font-size:16px;font-weight:800}\n#vchatHeroClone2 .vhc-pill.flag span{font-size:17px}\n#vchatHeroClone2 .vhc-pill.ai-pill{padding:0 16px 0 14px;gap:10px;background:#f7f6ff;border-color:#cdd0ff;color:var(--purple);font-weight:800}\n#vchatHeroClone2 .vhc-stars{width:28px;height:28px;border-radius:11px;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1}\n#vchatHeroClone2 .vhc-switch{width:38px;height:24px;border-radius:999px;background:#d7d8ea;position:relative;display:inline-block}\n#vchatHeroClone2 .vhc-switch.on{background:var(--purple)}\n#vchatHeroClone2 .vhc-switch i{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.12)}\n#vchatHeroClone2 .vhc-round{width:46px;height:46px;border-radius:15px;border:1px solid #dfe4f2;background:#fff;color:#665ada;padding:12px;position:relative}\n#vchatHeroClone2 .vhc-round.noti i{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:#ff6388}\n\n#vchatHeroClone2 .vhc-content{display:flex;flex:1;min-height:0;background:var(--page)}\n#vchatHeroClone2 .vhc-list-panel{width:407px;flex:none;border-right:1px solid var(--line);background:#fafaff;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-list-head{height:90px;padding:14px 18px 10px;display:flex;align-items:center;justify-content:space-between}\n#vchatHeroClone2 .vhc-list-head h2{font-size:28px;line-height:1;margin:0 0 8px;font-weight:800;letter-spacing:-.03em;color:#272a43}\n#vchatHeroClone2 .vhc-list-head p{margin:0;font-size:14px;color:#858dab;font-weight:600}\n#vchatHeroClone2 .vhc-list-head p b{color:#262941;font-weight:800}\n#vchatHeroClone2 .vhc-view-actions{display:flex;gap:10px}\n#vchatHeroClone2 .vhc-view-actions button{width:54px;height:49px;border:1px solid #dcdff0;border-radius:17px;background:#fff;color:#655ce8;padding:13px}\n#vchatHeroClone2 .vhc-view-actions button.active{background:var(--purple);border-color:var(--purple);color:#fff}\n#vchatHeroClone2 .vhc-folders{margin:0 18px 14px;height:72px;border:1px solid #e3e4f3;background:#f2f2fa;border-radius:22px;padding:10px;display:flex;gap:16px;align-items:center}\n#vchatHeroClone2 .vhc-folder{height:52px;border-radius:18px;display:flex;align-items:center;gap:10px;padding:0 16px;color:#8c92ab;font-weight:700}\n#vchatHeroClone2 .vhc-folder.active{background:#fff;border:1px solid #dddff0;color:#645ce8;box-shadow:0 4px 8px rgba(105,98,167,.05)}\n#vchatHeroClone2 .vhc-ficon{width:18px;height:18px;display:block}\n#vchatHeroClone2 .vhc-folder b{display:flex;align-items:center;justify-content:center;min-width:35px;height:35px;border-radius:999px;background:#eaebf5;color:#80869d;font-size:15px}\n#vchatHeroClone2 .vhc-folder.active b{background:var(--purple);color:#fff}\n#vchatHeroClone2 .vhc-searchbox{margin:0 18px 15px;height:58px;border-radius:18px;border:1px solid #dde1f0;background:#fff;padding:0 17px;display:flex;align-items:center;gap:12px;color:#7f88a5}\n#vchatHeroClone2 .vhc-searchbox svg{width:18px;height:18px;color:#7e70f4;flex:none}\n#vchatHeroClone2 .vhc-searchbox span{flex:1;font-size:15px}\n#vchatHeroClone2 .vhc-searchbox b{font-size:22px;color:#a0a5bf}\n#vchatHeroClone2 .vhc-filter-row{display:flex;align-items:center;gap:14px;padding:0 18px 12px}\n#vchatHeroClone2 .vhc-mini-tabs{display:flex;align-items:center;gap:8px;flex:1}\n#vchatHeroClone2 .vhc-mini-tabs span{height:38px;padding:0 16px;border-radius:14px;color:#7f86a4;font-size:13px;font-weight:800;display:flex;align-items:center}\n#vchatHeroClone2 .vhc-mini-tabs span.active{background:#eff0ff;color:var(--purple)}\n#vchatHeroClone2 .vhc-mini-tabs b{color:inherit}\n#vchatHeroClone2 .vhc-filter-btn{height:44px;padding:0 15px;border-radius:15px;border:1px solid #d7dbec;background:#fff;color:#635ae8;font-size:14px;font-weight:800;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-filter-btn svg{width:15px;height:15px}\n\n#vchatHeroClone2 .vhc-conversation-list{flex:1;overflow:hidden;padding:0 14px 12px;display:flex;flex-direction:column;gap:10px}\n#vchatHeroClone2 .vhc-conv{position:relative;display:flex;align-items:flex-start;gap:13px;padding:14px 14px;border-radius:18px;border:1px solid transparent;background:transparent}\n#vchatHeroClone2 .vhc-conv.active{background:#fff;border-color:#cdc5ff;box-shadow:0 6px 14px rgba(78,66,164,.05)}\n#vchatHeroClone2 .vhc-conv.active::before{content:\"\";position:absolute;left:-1px;top:14px;bottom:14px;width:4px;border-radius:4px;background:var(--purple)}\n#vchatHeroClone2 .vhc-conv-avatar{width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:#dfeeff;color:#5d57e8;font-size:16px;font-weight:800;flex:none}\n#vchatHeroClone2 .vhc-conv-body{min-width:0;flex:1}\n#vchatHeroClone2 .vhc-conv-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}\n#vchatHeroClone2 .vhc-conv-top strong{font-size:15px;font-weight:800;color:#2a2c44;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n#vchatHeroClone2 .vhc-conv-top time{font-size:12px;color:#9ba2bb;white-space:nowrap}\n#vchatHeroClone2 .vhc-conv-channel{font-size:13px;color:#8a90a8;margin-bottom:8px}\n#vchatHeroClone2 .vhc-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center}\n#vchatHeroClone2 .tag{height:27px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}\n#vchatHeroClone2 .tag.wa{background:var(--wa);color:#fff;padding:0 10px;min-width:39px}\n#vchatHeroClone2 .tag.ig{background:#d56cff}\n#vchatHeroClone2 .tag.lilac{background:#efeeff;color:#655ce8}\n#vchatHeroClone2 .tag.pale{background:#ebe7fa;color:#6c6b92}\n#vchatHeroClone2 .tag.green{background:#e6f7ee;color:#20825c}\n#vchatHeroClone2 .tag.blue{background:#e8f0ff;color:#2e77da}\n#vchatHeroClone2 .tag.softyellow{background:#fff2d7;color:#9b7618}\n#vchatHeroClone2 .tag.softfix{background:#e5f6eb;color:#229a63}\n#vchatHeroClone2 .vhc-unread-dot{position:absolute;right:12px;top:12px;min-width:27px;height:27px;border-radius:50%;background:var(--purple);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}\n#vchatHeroClone2 .vhc-export-btn{height:58px;margin:0 14px 16px;border-radius:15px;border:1px solid #dadcf0;background:#fff;color:#665ce8;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px}\n#vchatHeroClone2 .vhc-export-btn svg{width:15px;height:15px}\n\n#vchatHeroClone2 .vhc-chat-panel{flex:1;min-width:0;display:flex;flex-direction:column;background:#fff}\n#vchatHeroClone2 .vhc-chat-header{height:75px;padding:0 24px 0 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;background:#fff}\n#vchatHeroClone2 .vhc-chat-avatar{width:48px;height:48px;border-radius:16px;background:#dfeeff;color:#5d57e8;font-size:18px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}\n#vchatHeroClone2 .vhc-chat-title strong{display:block;font-size:17px;line-height:1.15;color:#2a2d44;font-weight:800;margin-bottom:7px}\n#vchatHeroClone2 .vhc-chat-channel{display:flex;align-items:center;gap:6px}\n#vchatHeroClone2 .vhc-chat-head-actions{margin-left:auto;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-chat-circle{width:44px;height:44px;border-radius:15px;border:1px solid #dddff0;background:#fff;color:#695ddd;padding:11px}\n#vchatHeroClone2 .vhc-ai-btn{height:44px;padding:0 20px;border-radius:15px;border:1px solid #dddff0;background:#fff;color:#675ce0;font-size:14px;font-weight:800}\n\n#vchatHeroClone2 .vhc-context-row{height:51px;padding:0 20px;display:flex;align-items:center;gap:10px;background:#faf9ff;border-bottom:1px solid #ebeaf6}\n#vchatHeroClone2 .vhc-chip{height:36px;padding:0 14px;border-radius:999px;border:1px solid #ddd9f5;background:#fff;color:#4d4766;font-size:12px;font-weight:800;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-chip.light{background:#f4f0ff;color:#6658da}\n#vchatHeroClone2 .vhc-chip b{color:#6a5ee8;font-weight:800}\n#vchatHeroClone2 .vhc-chip .mini-ico{font-size:12px;color:#6c60e6}\n\n#vchatHeroClone2 .vhc-subtabs{height:66px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}\n#vchatHeroClone2 .vhc-reply-tabs{background:#efedf6;border-radius:15px;padding:5px;display:flex;gap:4px}\n#vchatHeroClone2 .vhc-reply-tabs button{height:42px;padding:0 18px;border:0;background:transparent;border-radius:12px;color:#837a97;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-reply-tabs button.active{background:#fff;color:#675be0;box-shadow:0 1px 3px rgba(0,0,0,.04)}\n#vchatHeroClone2 .vhc-right-info{display:flex;align-items:center;gap:10px}\n#vchatHeroClone2 .vhc-stat-pill{height:42px;padding:0 14px;border-radius:14px;border:1px solid #dddaf3;display:flex;align-items:center;gap:10px;color:#5e55bd;background:#fff;font-size:13px;font-weight:800}\n#vchatHeroClone2 .vhc-stat-pill small{font-size:12px;letter-spacing:.12em;color:#8f8cab;font-weight:900}\n#vchatHeroClone2 .vhc-stat-pill strong{color:#2c2e46;font-size:14px}\n#vchatHeroClone2 .vhc-stat-pill em{width:26px;height:26px;border-radius:50%;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;font-weight:800}\n\n#vchatHeroClone2 .vhc-sla-row{height:69px;padding:10px 17px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}\n#vchatHeroClone2 .vhc-sla-pill{height:48px;padding:0 14px;border-radius:999px;border:1px solid #dfe1ef;background:#fff;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#454a65;white-space:nowrap;justify-content:center;min-width:0;flex:1}\n#vchatHeroClone2 .vhc-sla-pill.grow{flex:1.2;justify-content:flex-start}\n#vchatHeroClone2 .vhc-sla-pill small{font-size:11px;color:#959ab2;font-weight:800}\n#vchatHeroClone2 .vhc-sla-pill strong{font-size:13px;color:#33364f;overflow:hidden;text-overflow:ellipsis}\n#vchatHeroClone2 .vhc-sla-pill .ico{font-size:12px;color:#6f63e8}\n#vchatHeroClone2 .vhc-sla-pill button{margin-left:auto;height:34px;padding:0 14px;border-radius:999px;border:1px solid #d7d7ef;background:#fff;color:#675ce5;font-size:13px;font-weight:800}\n\n#vchatHeroClone2 .vhc-timeline{flex:1;min-height:0;overflow:hidden;padding:0 22px 0 22px;background:#fbfdff;background-image:linear-gradient(rgba(228,235,245,.65) 1px,transparent 1px),linear-gradient(90deg,rgba(228,235,245,.65) 1px,transparent 1px);background-size:40px 40px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}\n#vchatHeroClone2 .vhc-msg{max-width:59%;width:fit-content;padding:14px 18px;border-radius:18px;border:1px solid #e1e4ed;background:#fff;color:#363a53;font-size:15px;line-height:1.35;box-shadow:0 2px 6px rgba(30,38,87,.06);opacity:0;transform:translateY(10px);transition:opacity .26s ease,transform .26s ease}\n#vchatHeroClone2 .vhc-msg.show{opacity:1;transform:none}\n#vchatHeroClone2 .vhc-msg small{display:block;margin-top:7px;font-size:11px;color:#98a0b7}\n#vchatHeroClone2 .vhc-msg.incoming{border-bottom-left-radius:5px}\n#vchatHeroClone2 .vhc-msg.top-right{align-self:flex-end;background:linear-gradient(135deg,#6c63ff,#7166ff);border:0;color:#fff;border-bottom-right-radius:5px}\n#vchatHeroClone2 .vhc-msg.top-right small{color:#e8eaff;text-align:right}\n#vchatHeroClone2 .vhc-msg.outgoing{align-self:flex-end;border-bottom-right-radius:5px}\n#vchatHeroClone2 .vhc-msg.gradient{background:linear-gradient(135deg,#675df9,#5884ff);color:#fff;border:0}\n#vchatHeroClone2 .vhc-msg.gradient small,#vchatHeroClone2 .vhc-msg.human small{color:#ebedff;text-align:right}\n#vchatHeroClone2 .vhc-msg.human{background:linear-gradient(135deg,#4233b7,#5b53ea);color:#fff;border:0}\n#vchatHeroClone2 .vhc-msg.template{background:#fff;color:#39405a;border:1px solid #d9dcf1}\n#vchatHeroClone2 .vhc-msg.template small{text-align:right}\n#vchatHeroClone2 .vhc-msg.system{align-self:center;padding:8px 14px;border-radius:999px;background:#eff1f8;color:#6f7695;font-size:11px;font-weight:800;border:0;box-shadow:none;max-width:none}\n#vchatHeroClone2 .vhc-typing{align-self:flex-start;display:flex;gap:5px;padding:13px 15px;border-radius:18px;border:1px solid #e1e4ed;background:#fff;opacity:0;transition:opacity .2s ease}\n#vchatHeroClone2 .vhc-typing.show{opacity:1}\n#vchatHeroClone2 .vhc-typing i{width:7px;height:7px;border-radius:50%;background:#9298b2;animation:vhcBounce 1s infinite ease-in-out}\n#vchatHeroClone2 .vhc-typing i:nth-child(2){animation-delay:.15s}\n#vchatHeroClone2 .vhc-typing i:nth-child(3){animation-delay:.3s}\n@keyframes vhcBounce{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-4px);opacity:1}}\n\n#vchatHeroClone2 .vhc-composer-top{height:52px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:#fff}\n#vchatHeroClone2 .vhc-tools-left{display:flex;align-items:center;gap:10px;color:#695fe3;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-tools-left span{display:flex;align-items:center;gap:5px}\n#vchatHeroClone2 .vhc-tools-left button{width:39px;height:39px;border-radius:14px;border:1px solid #dadbef;background:#fff;color:#6d63e6;padding:10px}\n#vchatHeroClone2 .vhc-saved-link{font-size:13px;font-weight:800;color:#6e61e5}\n#vchatHeroClone2 .vhc-window-bar{height:45px;margin:0 14px;border-radius:14px;background:#eef8f1;border:1px solid #d6eedf;color:#346c53;font-size:14px;display:flex;align-items:center;padding:0 14px;gap:7px;white-space:nowrap;overflow:hidden}\n#vchatHeroClone2 .vhc-window-bar .green-dot{width:8px;height:8px;border-radius:50%;background:#25a65e;flex:none}\n#vchatHeroClone2 .vhc-window-bar strong{font-weight:800}\n#vchatHeroClone2 .vhc-window-bar button{margin-left:auto;height:32px;padding:0 15px;border-radius:11px;border:1px solid #d6d5f1;background:#f1eeff;color:#655be1;font-size:12px;font-weight:800;flex:none}\n#vchatHeroClone2 .vhc-composer-box{height:69px;margin:8px 14px 14px;border-radius:18px;border:1px solid #d8daef;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:10px 10px 10px 18px;box-shadow:0 3px 8px rgba(35,40,92,.05)}\n#vchatHeroClone2 .vhc-placeholder{font-size:18px;color:#9a98b1}\n#vchatHeroClone2 .vhc-composer-box button{height:49px;padding:0 29px;border-radius:15px;border:0;background:var(--purple);color:#fff;font-size:14px;font-weight:800}\n\n\n#vchatHeroClone2 .vhc-demo-cursor{position:absolute;left:0;top:0;width:26px;height:26px;pointer-events:none;z-index:50;opacity:0;transform:translate(-50%,-50%)}\n#vchatHeroClone2 .vhc-cursor-ring{position:absolute;inset:0;border:2px solid rgba(99,91,255,.35);border-radius:50%;transition:transform .18s ease,opacity .18s ease}\n#vchatHeroClone2 .vhc-cursor-dot{position:absolute;left:7px;top:7px;width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#7c68ff,#42a0ff);box-shadow:0 3px 8px rgba(98,94,255,.25)}\n#vchatHeroClone2 .vhc-demo-cursor.click .vhc-cursor-ring{transform:scale(.78);opacity:.9}\n#vchatHeroClone2 .vhc-demo-cursor.click .vhc-cursor-dot{transform:scale(.92)}\n#vchatHeroClone2 .pulse-ui{animation:vhcPulseUI .42s ease}\n#vchatHeroClone2 .flash-ui{animation:vhcFlashUI .52s ease}\n#vchatHeroClone2 .jump-ui{animation:vhcJumpUI .55s ease}\n#vchatHeroClone2 .vhc-pill.ai-pill.ai-active{box-shadow:0 0 0 3px rgba(99,91,255,.10) inset;background:#efecff}\n#vchatHeroClone2 .vhc-chip.ai-mode{background:#edeaff;color:#5a50d8;border-color:#d8d2ff}\n#vchatHeroClone2 .vhc-window-bar.highlight{box-shadow:0 0 0 2px rgba(34,197,94,.12) inset}\n@keyframes vhcPulseUI{0%{transform:scale(1)}45%{transform:scale(.96)}100%{transform:scale(1)}}\n@keyframes vhcFlashUI{0%,100%{box-shadow:none}40%{box-shadow:0 0 0 3px rgba(99,91,255,.12)}}\n@keyframes vhcJumpUI{0%,100%{transform:translateY(0)}35%{transform:translateY(-2px)}}\n\n@media (prefers-reduced-motion:reduce){\n  #vchatHeroClone2 *{animation:none !important;transition:none !important}\n}\n\n\/* Ajuste LOCAL para que la interfaz reemplace la imagen sin cambiar el dise\u00f1o V8. *\/\n#vch8 .vc8-visual-img #vchatHeroClone2 { width:100%; max-width:100%; border-radius:inherit; box-shadow:none; }\n#vch8 .vc8-visual-img #vchatHeroClone2 .vhc-brand img {width:172px;height:auto;max-width:100%;}\n<\/style>\n<script>\n\/* Solo intercambiamos la imagen antigua por el clon del Inbox. *\/\n(function(){\n  var mount=document.getElementById('vchat-v8-inbox-mount');\n  var target=document.querySelector('#vch8 .vc8-visual-img');\n  var clone=mount&&mount.querySelector('#vchatHeroClone2');\n  if(!target||!clone)return;\n  \/* Mantiene exactamente el marco, la barra, las tarjetas y el tilt originales. *\/\n  target.replaceChildren(clone);\n  mount.remove();\n})();\n<\/script>\n<script>\n\n(function(){\n  const root=document.getElementById('vchatHeroClone2');\n  if(!root||root.dataset.ready==='1') return;\n  root.dataset.ready='1';\n\n  const stage=root.querySelector('.vhc-stage');\n  const app=root.querySelector('.vhc-app');\n  const designW=1778, designH=900;\n  function fit(){\n    const w=root.clientWidth||designW;\n    const scale=w\/designW;\n    app.style.transform='scale('+scale+')';\n    stage.style.height=(designH*scale)+'px';\n  }\n  fit();\n  if(window.ResizeObserver){ new ResizeObserver(fit).observe(root); }\n  else{ window.addEventListener('resize',fit); }\n\n  const reduced=window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  const cursor=root.querySelector('[data-cursor]');\n  const convs=[...root.querySelectorAll('[data-conv]')];\n  const chatName=root.querySelector('[data-chat-name]');\n  const listName=root.querySelector('[data-contact-name]');\n  const chatAvatar=root.querySelector('[data-chat-avatar]');\n  const typing=root.querySelector('[data-typing]');\n  const modeChip=root.querySelector('[data-mode-chip]');\n  const aiBtn=root.querySelector('[data-ai-activate-btn]');\n  const topAiPill=root.querySelector('[data-top-ai-pill]');\n  const assignBtn=root.querySelector('[data-assign-btn]');\n  const responsable=root.querySelector('[data-responsable]');\n  const stageText=root.querySelector('[data-stage-text]');\n  const stagePill=root.querySelector('[data-stage-pill]');\n  const productPill=root.querySelector('[data-product-pill]');\n  const productCount=root.querySelector('[data-product-count]');\n  const templateBtn=root.querySelector('[data-template-btn]');\n  const placeholder=root.querySelector('[data-input-placeholder]');\n  const windowBar=root.querySelector('[data-window-bar]');\n  const reviewCount=root.querySelector('[data-review-count]');\n  const unreadCopies=[...root.querySelectorAll('[data-unread-copy], [data-unread-copy-2]')];\n  const inboxCount=root.querySelector('[data-inbox-count]');\n  const messages=[...root.querySelectorAll('[data-msg]')];\n  let timers=[];\n  let cycleTimer=null;\n\n  function after(ms,fn){ timers.push(setTimeout(fn,Math.round(ms*1.18))); }\n  function clearTimers(){ timers.forEach(clearTimeout); timers=[]; if(cycleTimer){clearTimeout(cycleTimer); cycleTimer=null;} }\n  function pulse(el,cls='pulse-ui'){ if(!el) return; el.classList.remove(cls); void el.offsetWidth; el.classList.add(cls); setTimeout(()=>el.classList.remove(cls),520); }\n  function flash(el,cls='flash-ui'){ if(!el) return; el.classList.remove(cls); void el.offsetWidth; el.classList.add(cls); setTimeout(()=>el.classList.remove(cls),620); }\n\n  function selectConversation(index){\n    convs.forEach((c,i)=>c.classList.toggle('active',i===index));\n    const c=convs[index];\n    if(!c) return;\n    const name=c.getAttribute('data-name')||c.querySelector('strong').textContent.trim();\n    const avatar=c.getAttribute('data-avatar')||c.querySelector('.vhc-conv-avatar').textContent.trim();\n    chatName.textContent=name;\n    listName.textContent=name;\n    chatAvatar.textContent=avatar;\n    pulse(c);\n  }\n\n  function showMessage(index){ if(messages[index]) messages[index].classList.add('show'); }\n  function hideMessages(){ messages.forEach((m,i)=>{ if(i<3) m.classList.add('show'); else m.classList.remove('show'); }); }\n\n  function baseState(){\n    clearTimers();\n    hideMessages();\n    typing.classList.remove('show');\n    cursor.style.opacity='0';\n    modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> Humano atendiendo';\n    modeChip.classList.remove('ai-mode');\n    aiBtn.textContent='Activar modo AI';\n    topAiPill.classList.remove('ai-active');\n    responsable.textContent='Agente Leo';\n    stageText.textContent='Calificado';\n    productCount.textContent='0';\n    placeholder.textContent='Escribe una respuesta...';\n    windowBar.classList.remove('highlight');\n    reviewCount.textContent='11';\n    inboxCount.textContent='10';\n    unreadCopies.forEach(el=>el.textContent='1');\n    selectConversation(2);\n  }\n\n  function centerOf(el){\n    const a=app.getBoundingClientRect();\n    const r=el.getBoundingClientRect();\n    return {x:r.left-a.left+r.width\/2, y:r.top-a.top+r.height\/2};\n  }\n\n  function moveCursorTo(el, ms=300, click=false, cb){\n    const pt=centerOf(el);\n    cursor.style.transition='transform '+ms+'ms cubic-bezier(.22,.8,.2,1), opacity .12s ease';\n    cursor.style.opacity='1';\n    cursor.style.transform='translate('+(pt.x)+'px,'+(pt.y)+'px)';\n    if(click){\n      setTimeout(()=>{cursor.classList.add('click');}, Math.max(60,ms-80));\n      setTimeout(()=>{cursor.classList.remove('click'); if(cb) cb();}, ms+60);\n    } else if(cb){\n      setTimeout(cb,ms+20);\n    }\n  }\n\n  function run(){\n    baseState();\n    if(reduced){\n      messages.forEach(m=>m.classList.add('show'));\n      return;\n    }\n    const unreadDot=convs[0].querySelector('.vhc-unread-dot');\n    \/\/ Recorrido r\u00e1pido\n    after(120, ()=>moveCursorTo(root.querySelector('.vhc-nav-item.active'), 215, true));\n    after(420, ()=>moveCursorTo(convs[0], 260, true, ()=>{\n      selectConversation(0);\n      if(unreadDot){ unreadDot.style.opacity='0'; }\n      unreadCopies.forEach(el=>el.textContent='0');\n      pulse(root.querySelector('.vhc-searchbox'));\n    }));\n    after(920, ()=>moveCursorTo(aiBtn, 260, true, ()=>{\n      aiBtn.textContent='Modo AI activo';\n      modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> AI atendiendo';\n      modeChip.classList.add('ai-mode');\n      topAiPill.classList.add('ai-active');\n      flash(topAiPill); flash(aiBtn);\n    }));\n    after(1350, ()=>moveCursorTo(productPill, 260, true, ()=>{\n      productCount.textContent='2';\n      pulse(productPill,'jump-ui');\n    }));\n    after(1750, ()=>moveCursorTo(stagePill, 260, true, ()=>{\n      stageText.textContent='En seguimiento';\n      flash(stagePill);\n    }));\n    after(2150, ()=>moveCursorTo(assignBtn, 260, true, ()=>{\n      responsable.textContent='Agente Leo';\n      showMessage(4);\n      pulse(assignBtn);\n      reviewCount.textContent='10';\n      inboxCount.textContent='9';\n    }));\n    after(2620, ()=>{ typing.classList.add('show'); placeholder.textContent='Redactando con AI...'; });\n    after(3250, ()=>{ typing.classList.remove('show'); showMessage(3); placeholder.textContent='Escribe una respuesta...'; });\n    after(3650, ()=>moveCursorTo(templateBtn, 260, true, ()=>{ pulse(templateBtn); windowBar.classList.add('highlight'); showMessage(6);}));\n    after(4080, ()=>moveCursorTo(modeChip, 260, true, ()=>{\n      modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> Humano atendiendo';\n      modeChip.classList.remove('ai-mode');\n      aiBtn.textContent='Activar modo AI';\n      showMessage(5);\n    }));\n    after(4520, ()=>moveCursorTo(convs[2], 260, true, ()=>{\n      selectConversation(2);\n      stageText.textContent='Calificado';\n      productCount.textContent='0';\n      windowBar.classList.remove('highlight');\n    }));\n    after(4980, ()=>moveCursorTo(root.querySelector('.vhc-export-btn'), 260, true, ()=>pulse(root.querySelector('.vhc-export-btn'))));\n    after(5600, ()=>{ cursor.style.opacity='0'; });\n    cycleTimer=setTimeout(run, 8500);\n  }\n\n  const io=('IntersectionObserver' in window)? new IntersectionObserver((entries)=>{\n    if(entries[0].isIntersecting){ run(); }\n    else{ baseState(); }\n  },{threshold:.15}) : null;\n  if(io) io.observe(root); else run();\n})();\n\n<\/script>\n<!-- Demos originales APROBADOS sin editar; aislados dentro de templates HTML -->\n<template id=\"vc8-approved-inbox\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}\n\n#vchatHeroClone2{\n  --bg:#ffffff;\n  --page:#fcfcfe;\n  --line:#e6e8f2;\n  --line-2:#dddff0;\n  --text:#2b2d42;\n  --muted:#8a8fad;\n  --muted-2:#a2a8c2;\n  --purple:#635bff;\n  --purple-2:#7267ff;\n  --purple-soft:#f2f0ff;\n  --purple-soft-2:#f7f6ff;\n  --green:#16a34a;\n  --green-soft:#eaf7ee;\n  --blue:#3b82f6;\n  --blue-soft:#e8f1ff;\n  --yellow:#a87115;\n  --yellow-soft:#fff4d9;\n  --wa:#14a44d;\n  --shadow:0 18px 60px rgba(62,67,114,.10);\n  width:100%;\n  border-radius:20px;\n  overflow:hidden;\n  background:#fff;\n  box-shadow:var(--shadow);\n  font-family:Inter, Manrope, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n  color:var(--text);\n}\n#vchatHeroClone2 *{box-sizing:border-box}\n#vchatHeroClone2 button{font:inherit}\n#vchatHeroClone2 svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}\n#vchatHeroClone2 .vhc-stage{position:relative;width:100%;overflow:hidden;background:#fff}\n#vchatHeroClone2 .vhc-app{position:absolute;inset:0 auto auto 0;width:1778px;height:900px;display:flex;transform-origin:top left;background:#fff}\n\n#vchatHeroClone2 .vhc-sidebar{width:296px;flex:none;background:#fff;border-right:1px solid var(--line);padding:0 14px 14px;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-brandbar{height:102px;border-bottom:1px solid #ececf5;display:flex;align-items:center;gap:12px;padding:0 10px}\n#vchatHeroClone2 .vhc-brand{flex:1;display:flex;align-items:center}\n#vchatHeroClone2 .vhc-brand img{display:block;width:172px;height:auto}\n#vchatHeroClone2 .vhc-collapse{width:42px;height:42px;border-radius:15px;border:1px solid #dfe3f2;background:#fff;color:#67718f;display:flex;align-items:center;justify-content:center;padding:11px}\n#vchatHeroClone2 .vhc-nav-section{padding:22px 12px 10px;font-size:12px;letter-spacing:.12em;color:#93a0bd;font-weight:800}\n#vchatHeroClone2 .vhc-nav-item{height:50px;border-radius:15px;display:flex;align-items:center;gap:14px;padding:0 14px;color:#687794;font-size:17px;font-weight:700;position:relative}\n#vchatHeroClone2 .vhc-nav-item.active{background:var(--purple-soft);color:var(--purple)}\n#vchatHeroClone2 .vhc-nav-item em{margin-left:auto;min-width:34px;height:34px;border-radius:999px;background:#eef2ff;color:var(--purple);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-icon{width:18px;height:18px;display:block;flex:none;color:inherit}\n\n#vchatHeroClone2 .vhc-main{flex:1;min-width:0;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-topbar{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px 0 30px;background:#fff}\n#vchatHeroClone2 .vhc-top-left small{display:block;font-size:11px;letter-spacing:.08em;color:#95a0b9;font-weight:800;margin-bottom:3px}\n#vchatHeroClone2 .vhc-top-left strong{display:block;font-size:18px;font-weight:800;color:#252841}\n#vchatHeroClone2 .vhc-top-right{display:flex;align-items:center;gap:14px}\n#vchatHeroClone2 .vhc-pill{height:56px;border:1px solid #dfe4f2;border-radius:19px;background:#fff;display:flex;align-items:center;justify-content:center;color:#3a4160}\n#vchatHeroClone2 .vhc-pill.flag{padding:0 18px;gap:10px;font-size:16px;font-weight:800}\n#vchatHeroClone2 .vhc-pill.flag span{font-size:17px}\n#vchatHeroClone2 .vhc-pill.ai-pill{padding:0 16px 0 14px;gap:10px;background:#f7f6ff;border-color:#cdd0ff;color:var(--purple);font-weight:800}\n#vchatHeroClone2 .vhc-stars{width:28px;height:28px;border-radius:11px;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1}\n#vchatHeroClone2 .vhc-switch{width:38px;height:24px;border-radius:999px;background:#d7d8ea;position:relative;display:inline-block}\n#vchatHeroClone2 .vhc-switch.on{background:var(--purple)}\n#vchatHeroClone2 .vhc-switch i{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.12)}\n#vchatHeroClone2 .vhc-round{width:46px;height:46px;border-radius:15px;border:1px solid #dfe4f2;background:#fff;color:#665ada;padding:12px;position:relative}\n#vchatHeroClone2 .vhc-round.noti i{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:#ff6388}\n\n#vchatHeroClone2 .vhc-content{display:flex;flex:1;min-height:0;background:var(--page)}\n#vchatHeroClone2 .vhc-list-panel{width:407px;flex:none;border-right:1px solid var(--line);background:#fafaff;display:flex;flex-direction:column}\n#vchatHeroClone2 .vhc-list-head{height:90px;padding:14px 18px 10px;display:flex;align-items:center;justify-content:space-between}\n#vchatHeroClone2 .vhc-list-head h2{font-size:28px;line-height:1;margin:0 0 8px;font-weight:800;letter-spacing:-.03em;color:#272a43}\n#vchatHeroClone2 .vhc-list-head p{margin:0;font-size:14px;color:#858dab;font-weight:600}\n#vchatHeroClone2 .vhc-list-head p b{color:#262941;font-weight:800}\n#vchatHeroClone2 .vhc-view-actions{display:flex;gap:10px}\n#vchatHeroClone2 .vhc-view-actions button{width:54px;height:49px;border:1px solid #dcdff0;border-radius:17px;background:#fff;color:#655ce8;padding:13px}\n#vchatHeroClone2 .vhc-view-actions button.active{background:var(--purple);border-color:var(--purple);color:#fff}\n#vchatHeroClone2 .vhc-folders{margin:0 18px 14px;height:72px;border:1px solid #e3e4f3;background:#f2f2fa;border-radius:22px;padding:10px;display:flex;gap:16px;align-items:center}\n#vchatHeroClone2 .vhc-folder{height:52px;border-radius:18px;display:flex;align-items:center;gap:10px;padding:0 16px;color:#8c92ab;font-weight:700}\n#vchatHeroClone2 .vhc-folder.active{background:#fff;border:1px solid #dddff0;color:#645ce8;box-shadow:0 4px 8px rgba(105,98,167,.05)}\n#vchatHeroClone2 .vhc-ficon{width:18px;height:18px;display:block}\n#vchatHeroClone2 .vhc-folder b{display:flex;align-items:center;justify-content:center;min-width:35px;height:35px;border-radius:999px;background:#eaebf5;color:#80869d;font-size:15px}\n#vchatHeroClone2 .vhc-folder.active b{background:var(--purple);color:#fff}\n#vchatHeroClone2 .vhc-searchbox{margin:0 18px 15px;height:58px;border-radius:18px;border:1px solid #dde1f0;background:#fff;padding:0 17px;display:flex;align-items:center;gap:12px;color:#7f88a5}\n#vchatHeroClone2 .vhc-searchbox svg{width:18px;height:18px;color:#7e70f4;flex:none}\n#vchatHeroClone2 .vhc-searchbox span{flex:1;font-size:15px}\n#vchatHeroClone2 .vhc-searchbox b{font-size:22px;color:#a0a5bf}\n#vchatHeroClone2 .vhc-filter-row{display:flex;align-items:center;gap:14px;padding:0 18px 12px}\n#vchatHeroClone2 .vhc-mini-tabs{display:flex;align-items:center;gap:8px;flex:1}\n#vchatHeroClone2 .vhc-mini-tabs span{height:38px;padding:0 16px;border-radius:14px;color:#7f86a4;font-size:13px;font-weight:800;display:flex;align-items:center}\n#vchatHeroClone2 .vhc-mini-tabs span.active{background:#eff0ff;color:var(--purple)}\n#vchatHeroClone2 .vhc-mini-tabs b{color:inherit}\n#vchatHeroClone2 .vhc-filter-btn{height:44px;padding:0 15px;border-radius:15px;border:1px solid #d7dbec;background:#fff;color:#635ae8;font-size:14px;font-weight:800;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-filter-btn svg{width:15px;height:15px}\n\n#vchatHeroClone2 .vhc-conversation-list{flex:1;overflow:hidden;padding:0 14px 12px;display:flex;flex-direction:column;gap:10px}\n#vchatHeroClone2 .vhc-conv{position:relative;display:flex;align-items:flex-start;gap:13px;padding:14px 14px;border-radius:18px;border:1px solid transparent;background:transparent}\n#vchatHeroClone2 .vhc-conv.active{background:#fff;border-color:#cdc5ff;box-shadow:0 6px 14px rgba(78,66,164,.05)}\n#vchatHeroClone2 .vhc-conv.active::before{content:\"\";position:absolute;left:-1px;top:14px;bottom:14px;width:4px;border-radius:4px;background:var(--purple)}\n#vchatHeroClone2 .vhc-conv-avatar{width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:#dfeeff;color:#5d57e8;font-size:16px;font-weight:800;flex:none}\n#vchatHeroClone2 .vhc-conv-body{min-width:0;flex:1}\n#vchatHeroClone2 .vhc-conv-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}\n#vchatHeroClone2 .vhc-conv-top strong{font-size:15px;font-weight:800;color:#2a2c44;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n#vchatHeroClone2 .vhc-conv-top time{font-size:12px;color:#9ba2bb;white-space:nowrap}\n#vchatHeroClone2 .vhc-conv-channel{font-size:13px;color:#8a90a8;margin-bottom:8px}\n#vchatHeroClone2 .vhc-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center}\n#vchatHeroClone2 .tag{height:27px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}\n#vchatHeroClone2 .tag.wa{background:var(--wa);color:#fff;padding:0 10px;min-width:39px}\n#vchatHeroClone2 .tag.ig{background:#d56cff}\n#vchatHeroClone2 .tag.lilac{background:#efeeff;color:#655ce8}\n#vchatHeroClone2 .tag.pale{background:#ebe7fa;color:#6c6b92}\n#vchatHeroClone2 .tag.green{background:#e6f7ee;color:#20825c}\n#vchatHeroClone2 .tag.blue{background:#e8f0ff;color:#2e77da}\n#vchatHeroClone2 .tag.softyellow{background:#fff2d7;color:#9b7618}\n#vchatHeroClone2 .tag.softfix{background:#e5f6eb;color:#229a63}\n#vchatHeroClone2 .vhc-unread-dot{position:absolute;right:12px;top:12px;min-width:27px;height:27px;border-radius:50%;background:var(--purple);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}\n#vchatHeroClone2 .vhc-export-btn{height:58px;margin:0 14px 16px;border-radius:15px;border:1px solid #dadcf0;background:#fff;color:#665ce8;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px}\n#vchatHeroClone2 .vhc-export-btn svg{width:15px;height:15px}\n\n#vchatHeroClone2 .vhc-chat-panel{flex:1;min-width:0;display:flex;flex-direction:column;background:#fff}\n#vchatHeroClone2 .vhc-chat-header{height:75px;padding:0 24px 0 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;background:#fff}\n#vchatHeroClone2 .vhc-chat-avatar{width:48px;height:48px;border-radius:16px;background:#dfeeff;color:#5d57e8;font-size:18px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}\n#vchatHeroClone2 .vhc-chat-title strong{display:block;font-size:17px;line-height:1.15;color:#2a2d44;font-weight:800;margin-bottom:7px}\n#vchatHeroClone2 .vhc-chat-channel{display:flex;align-items:center;gap:6px}\n#vchatHeroClone2 .vhc-chat-head-actions{margin-left:auto;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-chat-circle{width:44px;height:44px;border-radius:15px;border:1px solid #dddff0;background:#fff;color:#695ddd;padding:11px}\n#vchatHeroClone2 .vhc-ai-btn{height:44px;padding:0 20px;border-radius:15px;border:1px solid #dddff0;background:#fff;color:#675ce0;font-size:14px;font-weight:800}\n\n#vchatHeroClone2 .vhc-context-row{height:51px;padding:0 20px;display:flex;align-items:center;gap:10px;background:#faf9ff;border-bottom:1px solid #ebeaf6}\n#vchatHeroClone2 .vhc-chip{height:36px;padding:0 14px;border-radius:999px;border:1px solid #ddd9f5;background:#fff;color:#4d4766;font-size:12px;font-weight:800;display:flex;align-items:center;gap:8px}\n#vchatHeroClone2 .vhc-chip.light{background:#f4f0ff;color:#6658da}\n#vchatHeroClone2 .vhc-chip b{color:#6a5ee8;font-weight:800}\n#vchatHeroClone2 .vhc-chip .mini-ico{font-size:12px;color:#6c60e6}\n\n#vchatHeroClone2 .vhc-subtabs{height:66px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}\n#vchatHeroClone2 .vhc-reply-tabs{background:#efedf6;border-radius:15px;padding:5px;display:flex;gap:4px}\n#vchatHeroClone2 .vhc-reply-tabs button{height:42px;padding:0 18px;border:0;background:transparent;border-radius:12px;color:#837a97;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-reply-tabs button.active{background:#fff;color:#675be0;box-shadow:0 1px 3px rgba(0,0,0,.04)}\n#vchatHeroClone2 .vhc-right-info{display:flex;align-items:center;gap:10px}\n#vchatHeroClone2 .vhc-stat-pill{height:42px;padding:0 14px;border-radius:14px;border:1px solid #dddaf3;display:flex;align-items:center;gap:10px;color:#5e55bd;background:#fff;font-size:13px;font-weight:800}\n#vchatHeroClone2 .vhc-stat-pill small{font-size:12px;letter-spacing:.12em;color:#8f8cab;font-weight:900}\n#vchatHeroClone2 .vhc-stat-pill strong{color:#2c2e46;font-size:14px}\n#vchatHeroClone2 .vhc-stat-pill em{width:26px;height:26px;border-radius:50%;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:12px;font-weight:800}\n\n#vchatHeroClone2 .vhc-sla-row{height:69px;padding:10px 17px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}\n#vchatHeroClone2 .vhc-sla-pill{height:48px;padding:0 14px;border-radius:999px;border:1px solid #dfe1ef;background:#fff;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#454a65;white-space:nowrap;justify-content:center;min-width:0;flex:1}\n#vchatHeroClone2 .vhc-sla-pill.grow{flex:1.2;justify-content:flex-start}\n#vchatHeroClone2 .vhc-sla-pill small{font-size:11px;color:#959ab2;font-weight:800}\n#vchatHeroClone2 .vhc-sla-pill strong{font-size:13px;color:#33364f;overflow:hidden;text-overflow:ellipsis}\n#vchatHeroClone2 .vhc-sla-pill .ico{font-size:12px;color:#6f63e8}\n#vchatHeroClone2 .vhc-sla-pill button{margin-left:auto;height:34px;padding:0 14px;border-radius:999px;border:1px solid #d7d7ef;background:#fff;color:#675ce5;font-size:13px;font-weight:800}\n\n#vchatHeroClone2 .vhc-timeline{flex:1;min-height:0;overflow:hidden;padding:0 22px 0 22px;background:#fbfdff;background-image:linear-gradient(rgba(228,235,245,.65) 1px,transparent 1px),linear-gradient(90deg,rgba(228,235,245,.65) 1px,transparent 1px);background-size:40px 40px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}\n#vchatHeroClone2 .vhc-msg{max-width:59%;width:fit-content;padding:14px 18px;border-radius:18px;border:1px solid #e1e4ed;background:#fff;color:#363a53;font-size:15px;line-height:1.35;box-shadow:0 2px 6px rgba(30,38,87,.06);opacity:0;transform:translateY(10px);transition:opacity .26s ease,transform .26s ease}\n#vchatHeroClone2 .vhc-msg.show{opacity:1;transform:none}\n#vchatHeroClone2 .vhc-msg small{display:block;margin-top:7px;font-size:11px;color:#98a0b7}\n#vchatHeroClone2 .vhc-msg.incoming{border-bottom-left-radius:5px}\n#vchatHeroClone2 .vhc-msg.top-right{align-self:flex-end;background:linear-gradient(135deg,#6c63ff,#7166ff);border:0;color:#fff;border-bottom-right-radius:5px}\n#vchatHeroClone2 .vhc-msg.top-right small{color:#e8eaff;text-align:right}\n#vchatHeroClone2 .vhc-msg.outgoing{align-self:flex-end;border-bottom-right-radius:5px}\n#vchatHeroClone2 .vhc-msg.gradient{background:linear-gradient(135deg,#675df9,#5884ff);color:#fff;border:0}\n#vchatHeroClone2 .vhc-msg.gradient small,#vchatHeroClone2 .vhc-msg.human small{color:#ebedff;text-align:right}\n#vchatHeroClone2 .vhc-msg.human{background:linear-gradient(135deg,#4233b7,#5b53ea);color:#fff;border:0}\n#vchatHeroClone2 .vhc-msg.template{background:#fff;color:#39405a;border:1px solid #d9dcf1}\n#vchatHeroClone2 .vhc-msg.template small{text-align:right}\n#vchatHeroClone2 .vhc-msg.system{align-self:center;padding:8px 14px;border-radius:999px;background:#eff1f8;color:#6f7695;font-size:11px;font-weight:800;border:0;box-shadow:none;max-width:none}\n#vchatHeroClone2 .vhc-typing{align-self:flex-start;display:flex;gap:5px;padding:13px 15px;border-radius:18px;border:1px solid #e1e4ed;background:#fff;opacity:0;transition:opacity .2s ease}\n#vchatHeroClone2 .vhc-typing.show{opacity:1}\n#vchatHeroClone2 .vhc-typing i{width:7px;height:7px;border-radius:50%;background:#9298b2;animation:vhcBounce 1s infinite ease-in-out}\n#vchatHeroClone2 .vhc-typing i:nth-child(2){animation-delay:.15s}\n#vchatHeroClone2 .vhc-typing i:nth-child(3){animation-delay:.3s}\n@keyframes vhcBounce{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-4px);opacity:1}}\n\n#vchatHeroClone2 .vhc-composer-top{height:52px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:#fff}\n#vchatHeroClone2 .vhc-tools-left{display:flex;align-items:center;gap:10px;color:#695fe3;font-size:14px;font-weight:800}\n#vchatHeroClone2 .vhc-tools-left span{display:flex;align-items:center;gap:5px}\n#vchatHeroClone2 .vhc-tools-left button{width:39px;height:39px;border-radius:14px;border:1px solid #dadbef;background:#fff;color:#6d63e6;padding:10px}\n#vchatHeroClone2 .vhc-saved-link{font-size:13px;font-weight:800;color:#6e61e5}\n#vchatHeroClone2 .vhc-window-bar{height:45px;margin:0 14px;border-radius:14px;background:#eef8f1;border:1px solid #d6eedf;color:#346c53;font-size:14px;display:flex;align-items:center;padding:0 14px;gap:7px;white-space:nowrap;overflow:hidden}\n#vchatHeroClone2 .vhc-window-bar .green-dot{width:8px;height:8px;border-radius:50%;background:#25a65e;flex:none}\n#vchatHeroClone2 .vhc-window-bar strong{font-weight:800}\n#vchatHeroClone2 .vhc-window-bar button{margin-left:auto;height:32px;padding:0 15px;border-radius:11px;border:1px solid #d6d5f1;background:#f1eeff;color:#655be1;font-size:12px;font-weight:800;flex:none}\n#vchatHeroClone2 .vhc-composer-box{height:69px;margin:8px 14px 14px;border-radius:18px;border:1px solid #d8daef;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:10px 10px 10px 18px;box-shadow:0 3px 8px rgba(35,40,92,.05)}\n#vchatHeroClone2 .vhc-placeholder{font-size:18px;color:#9a98b1}\n#vchatHeroClone2 .vhc-composer-box button{height:49px;padding:0 29px;border-radius:15px;border:0;background:var(--purple);color:#fff;font-size:14px;font-weight:800}\n\n\n#vchatHeroClone2 .vhc-demo-cursor{position:absolute;left:0;top:0;width:26px;height:26px;pointer-events:none;z-index:50;opacity:0;transform:translate(-50%,-50%)}\n#vchatHeroClone2 .vhc-cursor-ring{position:absolute;inset:0;border:2px solid rgba(99,91,255,.35);border-radius:50%;transition:transform .18s ease,opacity .18s ease}\n#vchatHeroClone2 .vhc-cursor-dot{position:absolute;left:7px;top:7px;width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#7c68ff,#42a0ff);box-shadow:0 3px 8px rgba(98,94,255,.25)}\n#vchatHeroClone2 .vhc-demo-cursor.click .vhc-cursor-ring{transform:scale(.78);opacity:.9}\n#vchatHeroClone2 .vhc-demo-cursor.click .vhc-cursor-dot{transform:scale(.92)}\n#vchatHeroClone2 .pulse-ui{animation:vhcPulseUI .42s ease}\n#vchatHeroClone2 .flash-ui{animation:vhcFlashUI .52s ease}\n#vchatHeroClone2 .jump-ui{animation:vhcJumpUI .55s ease}\n#vchatHeroClone2 .vhc-pill.ai-pill.ai-active{box-shadow:0 0 0 3px rgba(99,91,255,.10) inset;background:#efecff}\n#vchatHeroClone2 .vhc-chip.ai-mode{background:#edeaff;color:#5a50d8;border-color:#d8d2ff}\n#vchatHeroClone2 .vhc-window-bar.highlight{box-shadow:0 0 0 2px rgba(34,197,94,.12) inset}\n@keyframes vhcPulseUI{0%{transform:scale(1)}45%{transform:scale(.96)}100%{transform:scale(1)}}\n@keyframes vhcFlashUI{0%,100%{box-shadow:none}40%{box-shadow:0 0 0 3px rgba(99,91,255,.12)}}\n@keyframes vhcJumpUI{0%,100%{transform:translateY(0)}35%{transform:translateY(-2px)}}\n\n@media (prefers-reduced-motion:reduce){\n  #vchatHeroClone2 *{animation:none !important;transition:none !important}\n}\n\n\/* Ajuste LOCAL para que la interfaz reemplace la imagen sin cambiar el dise\u00f1o V8. *\/\n#vch8 .vc8-visual-img #vchatHeroClone2 { width:100%; max-width:100%; border-radius:inherit; box-shadow:none; }\n#vch8 .vc8-visual-img #vchatHeroClone2 .vhc-brand img {width:172px;height:auto;max-width:100%;}\n<\/style><\/head><body><div id=\"vchatHeroClone2\">\n<div class=\"vhc-stage\">\n<div class=\"vhc-app\">\n<aside class=\"vhc-sidebar\">\n<div class=\"vhc-brandbar\">\n<div class=\"vhc-brand\">\n<img decoding=\"async\" alt=\"Vchat by StudioVainilla\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\"\/>\n<\/div>\n<button aria-hidden=\"true\" class=\"vhc-collapse\">\n<svg viewbox=\"0 0 24 24\"><path d=\"M14.5 6 9 12l5.5 6\"><\/path><\/svg>\n<\/button>\n<\/div>\n<div class=\"vhc-nav-section\">TRABAJO<\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M4 11.2 12 4l8 7.2\"><\/path><path d=\"M7 10.7V20h10v-9.3\"><\/path><\/svg><\/span><span>Inicio<\/span><\/div>\n<div class=\"vhc-nav-item active\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M5 6.2h14v10.2H8.7L5 19.8z\"><\/path><\/svg><\/span><span>Inbox<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"8\" r=\"3.15\"><\/circle><path d=\"M5.4 20c1.05-3.8 3.95-5.9 6.6-5.9 2.65 0 5.55 2.1 6.6 5.9\"><\/path><\/svg><\/span><span>Contactos<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M4 5.6h16l-6.4 7.1v5.1l-3.2 1.7v-6.8z\"><\/path><\/svg><\/span><span>CRM<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.1\"><\/circle><path d=\"m8.7 12.4 2.2 2.1 4.5-4.9\"><\/path><\/svg><\/span><span>Tareas<\/span><em>0<\/em><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M7 3.9v3.3\"><\/path><path d=\"M17 3.9v3.3\"><\/path><path d=\"M4.7 8.2h14.6\"><\/path><rect height=\"14\" rx=\"2.2\" width=\"14.6\" x=\"4.7\" y=\"5.7\"><\/rect><\/svg><\/span><span>Agenda<\/span><\/div>\n<div class=\"vhc-nav-section\">HERRAMIENTAS<\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M12.1 3 7.8 12h4.1L10.8 21l5.4-11h-4z\"><\/path><\/svg><\/span><span>Automatizaciones<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M4.8 6.4h14.4v11.2H8.6l-3.8 3.1z\"><\/path><path d=\"M8.4 10.2h7.2\"><\/path><path d=\"M8.4 13.2h5\"><\/path><\/svg><\/span><span>Respuestas y recursos<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M7 5.7h10v12.6H7z\"><\/path><path d=\"M11 5.7v12.6\"><\/path><\/svg><\/span><span>Conocimiento AI<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M12 3.9 18.7 7.7v8.6L12 20.1l-6.7-3.8V7.7z\"><\/path><\/svg><\/span><span>Productos y servicios<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M12 4.4v15.2\"><\/path><path d=\"M4.4 12h15.2\"><\/path><path d=\"m6.9 6.9 10.2 10.2\"><\/path><path d=\"M17.1 6.9 6.9 17.1\"><\/path><\/svg><\/span><span>Agentes AI<\/span><\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.8\"><\/circle><path d=\"M9.5 10.3c0-1.2.94-2.1 2.46-2.1 1.38 0 2.34.72 2.34 1.95 0 1.16-.73 1.65-1.63 2.2-.93.55-1.34.99-1.34 1.92v.22\"><\/path><circle cx=\"12\" cy=\"16.9\" fill=\"currentColor\" r=\".7\" stroke=\"none\"><\/circle><\/svg><\/span><span>Cr\u00e9ditos AI<\/span><em>1,876<\/em><\/div>\n<div class=\"vhc-nav-section\">INSIGHTS<\/div>\n<div class=\"vhc-nav-item\"><span class=\"vhc-icon\"><svg viewbox=\"0 0 24 24\"><path d=\"M4.8 18.6 9.2 14l3 2.8 6-7.3\"><\/path><path d=\"M15.7 9.5h2.5V12\"><\/path><\/svg><\/span><span>Anal\u00edtica<\/span><\/div>\n<\/aside>\n<main class=\"vhc-main\">\n<header class=\"vhc-topbar\">\n<div class=\"vhc-top-left\">\n<small>PedalNube Demo<\/small>\n<strong>Inbox<\/strong>\n<\/div>\n<div class=\"vhc-top-right\">\n<div class=\"vhc-pill flag\">\ud83c\uddf2\ud83c\uddfd <span>ES<\/span><\/div>\n<div class=\"vhc-pill ai-pill\" data-top-ai-pill=\"\"><span class=\"vhc-stars\">\u2726<\/span><b>AI<\/b><span class=\"vhc-switch on\" data-top-switch=\"\"><i><\/i><\/span><\/div>\n<button class=\"vhc-round\"><svg viewbox=\"0 0 24 24\"><circle cx=\"10.7\" cy=\"10.7\" r=\"4.9\"><\/circle><path d=\"m14.4 14.4 4.2 4.2\"><\/path><\/svg><\/button>\n<button class=\"vhc-round\"><svg viewbox=\"0 0 24 24\"><path d=\"M7.2 6.1h9.6\"><\/path><path d=\"M7.2 9.9h9.6\"><\/path><path d=\"M7.2 13.8h9.6\"><\/path><path d=\"M7.2 17.6h9.6\"><\/path><\/svg><\/button>\n<button class=\"vhc-round noti\"><svg viewbox=\"0 0 24 24\"><path d=\"M12 3.8 18.2 12 12 20.2 5.8 12z\"><\/path><\/svg><i><\/i><\/button>\n<\/div>\n<\/header>\n<div class=\"vhc-content\">\n<section class=\"vhc-list-panel\">\n<div class=\"vhc-list-head\">\n<div>\n<h2>Inbox<\/h2>\n<p><b data-review-count=\"\">11<\/b> por revisar \u00b7 <b data-unread-copy=\"\">1<\/b> sin leer<\/p>\n<\/div>\n<div class=\"vhc-view-actions\">\n<button>\n<svg viewbox=\"0 0 24 24\"><path d=\"m7 12 3.2 3.1L17 8.4\"><\/path><\/svg>\n<\/button>\n<button class=\"active\">\n<svg viewbox=\"0 0 24 24\"><path d=\"M7 7h10v10H7z\"><\/path><\/svg>\n<\/button>\n<\/div>\n<\/div>\n<div class=\"vhc-folders\">\n<div class=\"vhc-folder active\"><span class=\"vhc-ficon\"><svg viewbox=\"0 0 24 24\"><path d=\"M4.9 8.2h14.2v7.7H4.9z\"><\/path><\/svg><\/span><b data-inbox-count=\"\">10<\/b><\/div>\n<div class=\"vhc-folder\"><span class=\"vhc-ficon\"><svg viewbox=\"0 0 24 24\"><path d=\"M7.4 6.5h9.2v11H7.4z\"><\/path><path d=\"M9.2 9.1h5.6\"><\/path><path d=\"M9.2 11.9h5.6\"><\/path><\/svg><\/span><b>0<\/b><\/div>\n<div class=\"vhc-folder\"><span class=\"vhc-ficon\"><svg viewbox=\"0 0 24 24\"><path d=\"M8.4 8.5h7.2\"><\/path><path d=\"M9.1 8.5 8 18.2h8l-1.1-9.7\"><\/path><path d=\"M10.2 8.5V6.8h3.6v1.7\"><\/path><\/svg><\/span><b>2<\/b><\/div>\n<\/div>\n<div class=\"vhc-searchbox\">\n<svg viewbox=\"0 0 24 24\"><circle cx=\"10.5\" cy=\"10.5\" r=\"4.6\"><\/circle><path d=\"m14 14 4 4\"><\/path><\/svg>\n<span>Buscar conversaciones...<\/span>\n<b>\u00d7<\/b>\n<\/div>\n<div class=\"vhc-filter-row\">\n<div class=\"vhc-mini-tabs\">\n<span class=\"active\">Todas<\/span>\n<span>M\u00edas<\/span>\n<span>Sin leer <b data-unread-copy-2=\"\">1<\/b><\/span>\n<\/div>\n<button class=\"vhc-filter-btn\">\n<svg viewbox=\"0 0 24 24\"><path d=\"M5.3 7.4h13.4\"><\/path><path d=\"M8.1 12h7.8\"><\/path><path d=\"M10 16.6h4\"><\/path><circle cx=\"8.1\" cy=\"7.4\" fill=\"currentColor\" r=\"1\" stroke=\"none\"><\/circle><circle cx=\"15.8\" cy=\"12\" fill=\"currentColor\" r=\"1\" stroke=\"none\"><\/circle><circle cx=\"12\" cy=\"16.6\" fill=\"currentColor\" r=\"1\" stroke=\"none\"><\/circle><\/svg>\n                Filtros\n              <\/button>\n<\/div>\n<div class=\"vhc-conversation-list\">\n<article class=\"vhc-conv\" data-avatar=\"IS\" data-channel=\"WhatsApp\" data-conv=\"\" data-name=\"Iv\u00e1n Sol\u00eds\">\n<div class=\"vhc-conv-avatar\">IS<\/div>\n<div class=\"vhc-conv-body\">\n<div class=\"vhc-conv-top\"><strong>Iv\u00e1n Sol\u00eds<\/strong><time>1 min<\/time><\/div>\n<div class=\"vhc-conv-channel\">WhatsApp<\/div>\n<div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag lilac\">Sin asignar<\/span><\/div>\n<\/div>\n<div class=\"vhc-unread-dot\">1<\/div>\n<\/article>\n<article class=\"vhc-conv\" data-avatar=\"EL\" data-channel=\"WhatsApp\" data-conv=\"\" data-name=\"Eva Luna\">\n<div class=\"vhc-conv-avatar\">EL<\/div>\n<div class=\"vhc-conv-body\">\n<div class=\"vhc-conv-top\"><strong>Eva Luna<\/strong><time>57 min<\/time><\/div>\n<div class=\"vhc-conv-channel\">WhatsApp<\/div>\n<div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag lilac\">Sin asignar<\/span><span class=\"tag pale\">Nuevo<\/span><\/div>\n<\/div>\n<\/article>\n<article class=\"vhc-conv active\" data-avatar=\"NR\" data-channel=\"WhatsApp\" data-conv=\"\" data-conv-main=\"\" data-name=\"Nora R\u00edos\">\n<div class=\"vhc-conv-avatar main-avatar\">NR<\/div>\n<div class=\"vhc-conv-body\">\n<div class=\"vhc-conv-top\"><strong data-contact-name=\"\">Nora R\u00edos<\/strong><time>2 h<\/time><\/div>\n<div class=\"vhc-conv-channel\">WhatsApp<\/div>\n<div class=\"vhc-tags\"><span class=\"tag wa\">WA<\/span><span class=\"tag green\">Con Agente Leo<\/span><span class=\"tag blue\">Calificado<\/span><\/div>\n<\/div>\n<\/article>\n<article class=\"vhc-conv\" data-avatar=\"MP\" data-channel=\"Instagram\" data-conv=\"\" data-name=\"Mauro Paz\">\n<div class=\"vhc-conv-avatar\">MP<\/div>\n<div class=\"vhc-conv-body\">\n<div class=\"vhc-conv-top\"><strong>Mauro Paz<\/strong><time>3 h<\/time><\/div>\n<div class=\"vhc-conv-channel\">Instagram<\/div>\n<div class=\"vhc-tags\"><span class=\"tag wa ig\">IG<\/span><span class=\"tag softyellow\">Esperando humano<\/span><\/div>\n<\/div>\n<\/article>\n<\/div>\n<div class=\"vhc-export-btn\">\n<svg viewbox=\"0 0 24 24\"><path d=\"M12 5.2v9.5\"><\/path><path d=\"m8.1 10.9 3.9 3.8 3.9-3.8\"><\/path><path d=\"M5.4 18.8h13.2\"><\/path><\/svg>\n              Exportar conversaciones\n            <\/div>\n<\/section>\n<section class=\"vhc-chat-panel\">\n<div class=\"vhc-chat-header\">\n<div class=\"vhc-chat-avatar\" data-chat-avatar=\"\">NR<\/div>\n<div class=\"vhc-chat-title\">\n<strong data-chat-name=\"\">Nora R\u00edos<\/strong>\n<div class=\"vhc-chat-channel\"><span class=\"tag wa\">WA<\/span><span class=\"tag green softfix\">WhatsApp<\/span><\/div>\n<\/div>\n<div class=\"vhc-chat-head-actions\">\n<button class=\"vhc-chat-circle\"><svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"7.3\"><\/circle><path d=\"M12 10.2v5.1\"><\/path><circle cx=\"12\" cy=\"7.4\" fill=\"currentColor\" r=\".8\" stroke=\"none\"><\/circle><\/svg><\/button>\n<button class=\"vhc-ai-btn\" data-ai-activate-btn=\"\">Activar modo AI<\/button>\n<button class=\"vhc-chat-circle\"><svg viewbox=\"0 0 24 24\"><path d=\"m7.2 12.1 3.1 3L17 8.4\"><\/path><\/svg><\/button>\n<button class=\"vhc-chat-circle\"><svg viewbox=\"0 0 24 24\"><circle cx=\"7.2\" cy=\"12\" fill=\"currentColor\" r=\"1.1\" stroke=\"none\"><\/circle><circle cx=\"12\" cy=\"12\" fill=\"currentColor\" r=\"1.1\" stroke=\"none\"><\/circle><circle cx=\"16.8\" cy=\"12\" fill=\"currentColor\" r=\"1.1\" stroke=\"none\"><\/circle><\/svg><\/button>\n<\/div>\n<\/div>\n<div class=\"vhc-context-row\">\n<div class=\"vhc-chip\"><span class=\"mini-ico\">\u25eb<\/span> Afinaci\u00f3n de bicicletas <b>\uff0b<\/b><\/div>\n<div class=\"vhc-chip\" data-mode-chip=\"\"><span class=\"mini-ico\">\u2197<\/span> Humano atendiendo<\/div>\n<div class=\"vhc-chip light\"><span class=\"mini-ico\">\u21a9<\/span> PedalNube Demo <b>\u2197<\/b><\/div>\n<\/div>\n<div class=\"vhc-subtabs\">\n<div class=\"vhc-reply-tabs\">\n<button class=\"active\">Responder<\/button>\n<button>Nota interna<\/button>\n<\/div>\n<div class=\"vhc-right-info\">\n<div class=\"vhc-stat-pill\" data-stage-pill=\"\"><small>ETAPA<\/small><strong data-stage-text=\"\">Calificado<\/strong><\/div>\n<div class=\"vhc-stat-pill\" data-product-pill=\"\"><strong>Productos<\/strong><em data-product-count=\"\">0<\/em><\/div>\n<\/div>\n<\/div>\n<div class=\"vhc-sla-row\">\n<div class=\"vhc-sla-pill grow\"><span class=\"ico\">\ud83d\udc64<\/span><small>Responsable<\/small><strong data-responsable=\"\">Agente Leo<\/strong><button data-assign-btn=\"\">Asignar<\/button><\/div>\n<div class=\"vhc-sla-pill\"><span class=\"ico\">\u26a1<\/span><small>Primera respuesta<\/small><strong>Cumplido<\/strong><\/div>\n<div class=\"vhc-sla-pill\"><span class=\"ico\">\u25d4<\/span><small>Resoluci\u00f3n<\/small><strong>Restan 20h 58m<\/strong><\/div>\n<\/div>\n<div class=\"vhc-timeline\">\n<div class=\"vhc-msg incoming show\" data-msg=\"0\">\n                Hola, \u00bfhacen mantenimiento de bicicletas?\n                <small>2 h<\/small>\n<\/div>\n<div class=\"vhc-msg incoming show\" data-msg=\"1\">\n                \u00bfTienen espacio esta semana?\n                <small>2 h<\/small>\n<\/div>\n<div class=\"vhc-msg outgoing top-right\" data-msg=\"2\">\n                \u00bfEn qu\u00e9 horario te acomoda?\n                <small>2 h \u00b7 Le\u00eddo \u2713\u2713<\/small>\n<\/div>\n<div class=\"vhc-typing\" data-typing=\"\"><i><\/i><i><\/i><i><\/i><\/div>\n<div class=\"vhc-msg outgoing gradient\" data-msg=\"3\">\n                \u00a1Claro! Tenemos espacio el jueves a las 11:00 o a las 16:00. \u00bfCu\u00e1l prefieres?\n                <small>Ahora \u00b7 Le\u00eddo \u2713\u2713<\/small>\n<\/div>\n<div class=\"vhc-msg system\" data-msg=\"4\">Agente Leo tom\u00f3 la conversaci\u00f3n<\/div>\n<div class=\"vhc-msg outgoing human\" data-msg=\"5\">\n                \u00a1Hola! Soy Leo \ud83d\udeb2 Puedo confirmar la afinaci\u00f3n para el jueves a las 16:00.\n                <small>Ahora \u00b7 Le\u00eddo \u2713\u2713<\/small>\n<\/div>\n<div class=\"vhc-msg outgoing template\" data-msg=\"6\">\n                \ud83d\udcc5 Plantilla enviada: cita confirmada \u2014 Afinaci\u00f3n de bicicletas.\n                <small>Ahora \u00b7 Enviado \u2713\u2713<\/small>\n<\/div>\n<\/div>\n<div class=\"vhc-composer-top\">\n<div class=\"vhc-tools-left\">\n<span>\uff0b <b>Adjuntar<\/b><\/span>\n<button><svg viewbox=\"0 0 24 24\"><path d=\"M12 4.8v9.5\"><\/path><path d=\"M9.3 8a2.7 2.7 0 1 1 5.4 0v6a4 4 0 0 1-8 0V9.4\"><\/path><\/svg><\/button>\n<button><svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"6.3\"><\/circle><circle cx=\"9.4\" cy=\"10.1\" fill=\"currentColor\" r=\".9\" stroke=\"none\"><\/circle><circle cx=\"14.6\" cy=\"10.1\" fill=\"currentColor\" r=\".9\" stroke=\"none\"><\/circle><path d=\"M9.2 14c.9 1 1.8 1.5 2.8 1.5 1 0 1.9-.5 2.8-1.5\"><\/path><\/svg><\/button>\n<span>\u25d4 <b>Programar<\/b><\/span>\n<\/div>\n<div class=\"vhc-saved-link\">Respuestas guardadas<\/div>\n<\/div>\n<div class=\"vhc-window-bar\" data-window-bar=\"\">\n<span class=\"green-dot\"><\/span>\n<strong>Ventana de 24 h abierta<\/strong>\n<span>\u00b7 puedes responder libremente (quedan 21 h 50 min).<\/span>\n<button data-template-btn=\"\">Enviar plantilla<\/button>\n<\/div>\n<div class=\"vhc-composer-box\">\n<div class=\"vhc-placeholder\" data-input-placeholder=\"\">Escribe una respuesta...<\/div>\n<button>Enviar<\/button>\n<\/div>\n<\/section>\n<\/div>\n<\/main>\n<\/div>\n<\/div>\n<div class=\"vhc-demo-cursor\" data-cursor=\"\">\n<div class=\"vhc-cursor-ring\"><\/div>\n<div class=\"vhc-cursor-dot\"><\/div>\n<\/div>\n<\/div><script>\n\n(function(){\n  const root=document.getElementById('vchatHeroClone2');\n  if(!root||root.dataset.ready==='1') return;\n  root.dataset.ready='1';\n\n  const stage=root.querySelector('.vhc-stage');\n  const app=root.querySelector('.vhc-app');\n  const designW=1778, designH=900;\n  function fit(){\n    const w=root.clientWidth||designW;\n    const scale=w\/designW;\n    app.style.transform='scale('+scale+')';\n    stage.style.height=(designH*scale)+'px';\n  }\n  fit();\n  if(window.ResizeObserver){ new ResizeObserver(fit).observe(root); }\n  else{ window.addEventListener('resize',fit); }\n\n  const reduced=window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n  const cursor=root.querySelector('[data-cursor]');\n  const convs=[...root.querySelectorAll('[data-conv]')];\n  const chatName=root.querySelector('[data-chat-name]');\n  const listName=root.querySelector('[data-contact-name]');\n  const chatAvatar=root.querySelector('[data-chat-avatar]');\n  const typing=root.querySelector('[data-typing]');\n  const modeChip=root.querySelector('[data-mode-chip]');\n  const aiBtn=root.querySelector('[data-ai-activate-btn]');\n  const topAiPill=root.querySelector('[data-top-ai-pill]');\n  const assignBtn=root.querySelector('[data-assign-btn]');\n  const responsable=root.querySelector('[data-responsable]');\n  const stageText=root.querySelector('[data-stage-text]');\n  const stagePill=root.querySelector('[data-stage-pill]');\n  const productPill=root.querySelector('[data-product-pill]');\n  const productCount=root.querySelector('[data-product-count]');\n  const templateBtn=root.querySelector('[data-template-btn]');\n  const placeholder=root.querySelector('[data-input-placeholder]');\n  const windowBar=root.querySelector('[data-window-bar]');\n  const reviewCount=root.querySelector('[data-review-count]');\n  const unreadCopies=[...root.querySelectorAll('[data-unread-copy], [data-unread-copy-2]')];\n  const inboxCount=root.querySelector('[data-inbox-count]');\n  const messages=[...root.querySelectorAll('[data-msg]')];\n  let timers=[];\n  let cycleTimer=null;\n\n  function after(ms,fn){ timers.push(setTimeout(fn,Math.round(ms*1.18))); }\n  function clearTimers(){ timers.forEach(clearTimeout); timers=[]; if(cycleTimer){clearTimeout(cycleTimer); cycleTimer=null;} }\n  function pulse(el,cls='pulse-ui'){ if(!el) return; el.classList.remove(cls); void el.offsetWidth; el.classList.add(cls); setTimeout(()=>el.classList.remove(cls),520); }\n  function flash(el,cls='flash-ui'){ if(!el) return; el.classList.remove(cls); void el.offsetWidth; el.classList.add(cls); setTimeout(()=>el.classList.remove(cls),620); }\n\n  function selectConversation(index){\n    convs.forEach((c,i)=>c.classList.toggle('active',i===index));\n    const c=convs[index];\n    if(!c) return;\n    const name=c.getAttribute('data-name')||c.querySelector('strong').textContent.trim();\n    const avatar=c.getAttribute('data-avatar')||c.querySelector('.vhc-conv-avatar').textContent.trim();\n    chatName.textContent=name;\n    listName.textContent=name;\n    chatAvatar.textContent=avatar;\n    pulse(c);\n  }\n\n  function showMessage(index){ if(messages[index]) messages[index].classList.add('show'); }\n  function hideMessages(){ messages.forEach((m,i)=>{ if(i<3) m.classList.add('show'); else m.classList.remove('show'); }); }\n\n  function baseState(){\n    clearTimers();\n    hideMessages();\n    typing.classList.remove('show');\n    cursor.style.opacity='0';\n    modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> Humano atendiendo';\n    modeChip.classList.remove('ai-mode');\n    aiBtn.textContent='Activar modo AI';\n    topAiPill.classList.remove('ai-active');\n    responsable.textContent='Agente Leo';\n    stageText.textContent='Calificado';\n    productCount.textContent='0';\n    placeholder.textContent='Escribe una respuesta...';\n    windowBar.classList.remove('highlight');\n    reviewCount.textContent='11';\n    inboxCount.textContent='10';\n    unreadCopies.forEach(el=>el.textContent='1');\n    selectConversation(2);\n  }\n\n  function centerOf(el){\n    const a=app.getBoundingClientRect();\n    const r=el.getBoundingClientRect();\n    return {x:r.left-a.left+r.width\/2, y:r.top-a.top+r.height\/2};\n  }\n\n  function moveCursorTo(el, ms=300, click=false, cb){\n    const pt=centerOf(el);\n    cursor.style.transition='transform '+ms+'ms cubic-bezier(.22,.8,.2,1), opacity .12s ease';\n    cursor.style.opacity='1';\n    cursor.style.transform='translate('+(pt.x)+'px,'+(pt.y)+'px)';\n    if(click){\n      setTimeout(()=>{cursor.classList.add('click');}, Math.max(60,ms-80));\n      setTimeout(()=>{cursor.classList.remove('click'); if(cb) cb();}, ms+60);\n    } else if(cb){\n      setTimeout(cb,ms+20);\n    }\n  }\n\n  function run(){\n    baseState();\n    if(reduced){\n      messages.forEach(m=>m.classList.add('show'));\n      return;\n    }\n    const unreadDot=convs[0].querySelector('.vhc-unread-dot');\n    \/\/ Recorrido r\u00e1pido\n    after(120, ()=>moveCursorTo(root.querySelector('.vhc-nav-item.active'), 215, true));\n    after(420, ()=>moveCursorTo(convs[0], 260, true, ()=>{\n      selectConversation(0);\n      if(unreadDot){ unreadDot.style.opacity='0'; }\n      unreadCopies.forEach(el=>el.textContent='0');\n      pulse(root.querySelector('.vhc-searchbox'));\n    }));\n    after(920, ()=>moveCursorTo(aiBtn, 260, true, ()=>{\n      aiBtn.textContent='Modo AI activo';\n      modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> AI atendiendo';\n      modeChip.classList.add('ai-mode');\n      topAiPill.classList.add('ai-active');\n      flash(topAiPill); flash(aiBtn);\n    }));\n    after(1350, ()=>moveCursorTo(productPill, 260, true, ()=>{\n      productCount.textContent='2';\n      pulse(productPill,'jump-ui');\n    }));\n    after(1750, ()=>moveCursorTo(stagePill, 260, true, ()=>{\n      stageText.textContent='En seguimiento';\n      flash(stagePill);\n    }));\n    after(2150, ()=>moveCursorTo(assignBtn, 260, true, ()=>{\n      responsable.textContent='Agente Leo';\n      showMessage(4);\n      pulse(assignBtn);\n      reviewCount.textContent='10';\n      inboxCount.textContent='9';\n    }));\n    after(2620, ()=>{ typing.classList.add('show'); placeholder.textContent='Redactando con AI...'; });\n    after(3250, ()=>{ typing.classList.remove('show'); showMessage(3); placeholder.textContent='Escribe una respuesta...'; });\n    after(3650, ()=>moveCursorTo(templateBtn, 260, true, ()=>{ pulse(templateBtn); windowBar.classList.add('highlight'); showMessage(6);}));\n    after(4080, ()=>moveCursorTo(modeChip, 260, true, ()=>{\n      modeChip.innerHTML='<span class=\"mini-ico\">\u2197<\/span> Humano atendiendo';\n      modeChip.classList.remove('ai-mode');\n      aiBtn.textContent='Activar modo AI';\n      showMessage(5);\n    }));\n    after(4520, ()=>moveCursorTo(convs[2], 260, true, ()=>{\n      selectConversation(2);\n      stageText.textContent='Calificado';\n      productCount.textContent='0';\n      windowBar.classList.remove('highlight');\n    }));\n    after(4980, ()=>moveCursorTo(root.querySelector('.vhc-export-btn'), 260, true, ()=>pulse(root.querySelector('.vhc-export-btn'))));\n    after(5600, ()=>{ cursor.style.opacity='0'; });\n    cycleTimer=setTimeout(run, 8500);\n  }\n\n  const io=('IntersectionObserver' in window)? new IntersectionObserver((entries)=>{\n    if(entries[0].isIntersecting){ run(); }\n    else{ baseState(); }\n  },{threshold:.15}) : null;\n  if(io) io.observe(root); else run();\n})();\n\n<\/script><\/body><\/html><\/template>\n<template id=\"vc8-approved-contacts\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}<\/style><\/head><body><!-- VCHAT CONTACTOS \u00b7 DEMO ANIMADA V1 \u00b7 StudioVainilla\n     Widget HTML \u00fanico para Elementor. Sin conexiones ni contactos reales.\n     Datos, personas, tel\u00e9fonos, correos y empresas completamente ficticios.\n     Se adapta a escritorio\/tablet\/m\u00f3vil y detiene la demo fuera de pantalla.\n-->\n<div id=\"svContactsDemo\" class=\"svc\" aria-label=\"Demostraci\u00f3n interactiva del m\u00f3dulo Contactos de Vchat\">\n<style>\n#svContactsDemo{--p:#6155f6;--pd:#5142dc;--ink:#1d203c;--sub:#7883a2;--line:#e6e7f5;--pale:#f8f8fe;--pane:#f8f9ff;position:relative;width:100%;min-height:720px;isolation:isolate;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,\"Segoe UI\",Arial,sans-serif!important;font-size:14px;line-height:1.4;color:var(--ink);background:var(--pane);border:1px solid #e0e4f3;overflow:hidden;box-shadow:0 20px 75px rgba(26,29,88,.12)}\n#svContactsDemo *,#svContactsDemo *:before,#svContactsDemo *:after{box-sizing:border-box}\n#svContactsDemo button,#svContactsDemo input,#svContactsDemo select{font:inherit;letter-spacing:normal;text-transform:none}\n#svContactsDemo button{cursor:pointer}#svContactsDemo button:focus-visible,#svContactsDemo input:focus-visible{outline:2px solid var(--p);outline-offset:2px}\n#svContactsDemo .svc-layout{display:grid;grid-template-columns:305px minmax(0,1fr);height:780px;min-height:720px}\n#svContactsDemo .svc-side{background:#fff;border-right:1px solid #e7e8f3;padding:25px 14px 18px;overflow:hidden;display:flex;flex-direction:column}\n#svContactsDemo .svc-brand{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #eef0f8;padding:8px 7px 26px;margin-bottom:17px}\n#svContactsDemo .svc-brand img{width:190px;max-width:calc(100% - 48px);max-height:61px;object-fit:contain;object-position:left center}\n#svContactsDemo .svc-back{height:48px;width:47px;background:#fff;border:1px solid #dce3f7;border-radius:15px;color:#526587;font-size:25px;box-shadow:0 4px 11px rgba(32,43,84,.04)}\n#svContactsDemo .svc-side-label{font-size:11px;font-weight:850;color:#8ea3c2;letter-spacing:1.4px;margin:12px 17px 13px}\n#svContactsDemo .svc-nav{display:grid;gap:3px}#svContactsDemo .svc-nav-item{height:48px;display:flex;align-items:center;gap:14px;width:100%;padding:0 16px;color:#61728f;background:transparent;border:0;border-radius:13px;font-weight:760;text-align:left;white-space:nowrap}#svContactsDemo .svc-nav-item strong{font-size:15px}#svContactsDemo .svc-nav-item svg{width:19px;height:19px;flex-shrink:0}#svContactsDemo .svc-nav-item.active{background:#f1f0ff;color:#5142df}#svContactsDemo .svc-nav-item:not(.active):hover{background:#f7f8ff}#svContactsDemo .svc-count{margin-left:auto;background:linear-gradient(125deg,#7858ff,#30adff);color:white;min-width:30px;height:30px;padding:0 6px;border-radius:50%;display:grid;place-items:center;font-size:12px;box-shadow:0 3px 8px #635af93d}#svContactsDemo .svc-credits{margin-left:auto;padding:6px 10px;background:#eaf0ff;border-radius:99px;color:#524de9;font-size:12px}\n#svContactsDemo .svc-main{min-width:0;display:flex;flex-direction:column;background:radial-gradient(ellipse at 85% 8%,rgba(102,91,255,.055),transparent 42%),#f8f9ff}\n#svContactsDemo .svc-top{height:85px;min-height:85px;background:#fff;border-bottom:1px solid #e5e8f3;display:flex;align-items:center;justify-content:space-between;padding:0 25px 0 31px;gap:12px}\n#svContactsDemo .svc-org{font-size:11px;letter-spacing:.3px;color:#94a4bf;font-weight:800}#svContactsDemo .svc-page{font-size:18px;color:#1e2541;font-weight:900;margin-top:1px}#svContactsDemo .svc-topbuttons{display:flex;align-items:center;gap:10px}\n#svContactsDemo .svc-topbtn{background:#fff;border:1px solid #dce2f5;height:52px;min-width:52px;border-radius:17px;padding:0 14px;display:flex;justify-content:center;align-items:center;gap:9px;color:#564de0;font-weight:780;white-space:nowrap}#svContactsDemo .svc-topbtn:hover,#svContactsDemo .svc-action:hover{background:#f6f5ff}#svContactsDemo .svc-lang{color:#202c4c;gap:11px;font-size:17px}#svContactsDemo .svc-ai{gap:10px;background:#f9f8ff;color:#8583aa}#svContactsDemo .svc-ai.on{background:#f0edff;color:#6255ed;border-color:#cdc8ff}#svContactsDemo .svc-star{font-size:20px;color:#7561ff}#svContactsDemo .svc-switch{width:38px;height:23px;background:#d9d9e8;border-radius:99px;padding:3px;display:inline-flex;align-items:center;box-shadow:inset 0 1px 3px #6d6a9918}#svContactsDemo .svc-switch:after{content:\"\";display:block;width:17px;height:17px;border-radius:50%;background:#fff;box-shadow:0 2px 5px #3531503d;transition:transform .24s}#svContactsDemo .svc-ai.on .svc-switch{background:#635df7}#svContactsDemo .svc-ai.on .svc-switch:after{transform:translateX(15px)}#svContactsDemo .svc-search-icon{width:21px;height:21px}\n#svContactsDemo .svc-scroll{flex:1;overflow:auto;padding:15px 39px 27px;scrollbar-color:#dbdef1 transparent;scrollbar-width:thin}\n#svContactsDemo .svc-table-card{width:100%;min-height:650px;background:white;border:1px solid #e2e4f3;border-radius:25px;box-shadow:0 12px 35px rgba(62,68,136,.035);overflow:hidden}\n#svContactsDemo .svc-table-title{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 25px;gap:15px;font-size:18px;font-weight:860}#svContactsDemo .svc-results{font-size:12px;color:#6756ea;background:#f1efff;padding:6px 13px;border-radius:99px;white-space:nowrap;font-weight:800}\n#svContactsDemo .svc-tools{background:#fbfbff;padding:11px 22px;display:flex;align-items:center;gap:10px;border-top:1px solid #eef0f8;min-height:58px}#svContactsDemo .svc-tools[hidden]{display:none}#svContactsDemo .svc-tools input{height:37px;border:1px solid #dcdff3;padding:0 13px;border-radius:10px;min-width:0;flex:1;color:#202a48;background:#fff}#svContactsDemo .svc-smallbtn{height:37px;border:1px solid #dcdaf6;color:#5948db;background:#fff;border-radius:10px;padding:0 12px;font-weight:800;font-size:12px}#svContactsDemo .svc-smallbtn.selected{background:#eae6ff;border-color:#a9a0f6}\n#svContactsDemo .svc-table{width:100%;border-collapse:collapse;table-layout:fixed;text-align:left}#svContactsDemo .svc-table thead{height:48px;background:#f7f8fe;border-top:1px solid #ebeef7;border-bottom:1px solid #e5e8f1}#svContactsDemo .svc-table th{padding:0 16px;font-size:12px;color:#777991;letter-spacing:1px;font-weight:850}#svContactsDemo .svc-table th:first-child,#svContactsDemo .svc-table td:first-child{padding-left:25px}#svContactsDemo .svc-table th:last-child,#svContactsDemo .svc-table td:last-child{padding-right:21px;text-align:right}\n#svContactsDemo .svc-table td{border-bottom:1px solid #e7e8f4;height:115px;padding:10px 16px;vertical-align:middle;font-size:15px;font-weight:720}#svContactsDemo .svc-table tbody tr{transition:background .24s,box-shadow .24s}#svContactsDemo .svc-table tbody tr:hover,#svContactsDemo .svc-table tbody tr.demo-focus{background:#f6f5ff;box-shadow:inset 4px 0 0 #7063ff}#svContactsDemo .svc-table th:nth-child(1){width:33%}#svContactsDemo .svc-table th:nth-child(2){width:11%}#svContactsDemo .svc-table th:nth-child(3){width:15%}#svContactsDemo .svc-table th:nth-child(4){width:11%}#svContactsDemo .svc-table th:nth-child(5){width:14%}#svContactsDemo .svc-table th:nth-child(6){width:16%}\n#svContactsDemo .svc-person{display:flex;align-items:center;gap:15px;min-width:0}#svContactsDemo .svc-avatar{display:grid;place-items:center;flex:none;width:53px;height:53px;background:linear-gradient(135deg,#efecff,#e2e7ff);color:#6054b6;border-radius:17px;font-weight:850;font-size:14px}#svContactsDemo .svc-contact-name{font-size:16px;font-weight:870;color:#20213c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}#svContactsDemo .svc-contact-sub{font-size:13px;color:#85839f;font-weight:600;margin:3px 0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#svContactsDemo .svc-tagrow{display:flex;gap:5px;align-items:center;flex-wrap:wrap}#svContactsDemo .svc-tag{border-radius:99px;padding:5px 9px;font-weight:750;font-size:11px;white-space:nowrap}#svContactsDemo .svc-tag.purple{background:#efecff;color:#6251c0}#svContactsDemo .svc-tag.gray{background:#f0f2f6;color:#697184}#svContactsDemo .svc-tag.blue{background:#eaf3ff;color:#2873bd}#svContactsDemo .svc-stage{display:inline-flex;align-items:center;background:#f2f1f7;padding:7px 11px;border-radius:99px;color:#4d4a65;font-size:12px;font-weight:800;white-space:nowrap}#svContactsDemo .svc-stage.hot{background:#e7f7f0;color:#16745a}#svContactsDemo .svc-stage.qualified{background:#eaf1ff;color:#326ace}#svContactsDemo .svc-money{font-weight:860;color:#252842;font-size:16px}#svContactsDemo .svc-cat{display:inline-flex;border-radius:99px;padding:7px 10px;background:#f4f3f7;color:#8b8999;font-size:12px;white-space:nowrap}#svContactsDemo .svc-cat.set{background:#eaf1ff;color:#426fc1}\n#svContactsDemo .svc-actions{display:flex;justify-content:flex-end;gap:7px}#svContactsDemo .svc-action{height:43px;min-width:43px;border:1px solid #dcd8f3;border-radius:14px;background:#fff;color:#6250df;font-weight:850;font-size:12px}#svContactsDemo .svc-action.edit{font-size:20px}#svContactsDemo .svc-action.delete{color:#e34374;border-color:#f3ccd9;font-size:18px}\n#svContactsDemo .svc-table tfoot td{text-align:center;color:#8992ab!important;height:60px;font-size:12px;border:0}\n#svContactsDemo .svc-cursor{position:absolute;top:0;left:0;width:34px;height:34px;z-index:60;pointer-events:none;opacity:0;transform:translate(-50%,-50%);transition:left .48s cubic-bezier(.2,.75,.2,1),top .48s cubic-bezier(.2,.75,.2,1),opacity .17s}#svContactsDemo .svc-cursor svg{width:28px;height:28px;filter:drop-shadow(0 3px 3px rgba(26,25,92,.22))}#svContactsDemo .svc-cursor:after{content:\"\";position:absolute;top:-7px;left:-7px;width:40px;height:40px;border:2px solid #7167f1;border-radius:50%;opacity:0;transform:scale(.5)}#svContactsDemo .svc-cursor.tap:after{animation:svcTap .4s ease-out}@keyframes svcTap{0%{opacity:.8;transform:scale(.5)}100%{opacity:0;transform:scale(1.4)}}\n#svContactsDemo .svc-shade{position:absolute;z-index:34;inset:0;background:#0e163760;backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}#svContactsDemo .svc-shade.open{opacity:1;visibility:visible}#svContactsDemo .svc-drawer{position:absolute;right:0;top:0;bottom:0;width:min(570px,95%);background:#fff;box-shadow:-20px 0 70px #1016482d;z-index:36;transform:translateX(103%);transition:transform .36s cubic-bezier(.25,.8,.25,1);overflow-y:auto;padding:27px 29px}#svContactsDemo .svc-drawer.open{transform:translateX(0)}#svContactsDemo .svc-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:21px}#svContactsDemo .svc-drawer-head h3{margin:0;font-size:23px;line-height:1.2;color:#1e2242}#svContactsDemo .svc-x{width:38px;height:38px;border:1px solid #e1e4f2;background:#fff;border-radius:12px;color:#5b5690;font-size:21px}#svContactsDemo .svc-profile{display:flex;align-items:center;gap:14px;background:#f7f6ff;padding:15px;border:1px solid #e6e3fc;border-radius:17px}#svContactsDemo .svc-profile .svc-avatar{width:63px;height:63px}#svContactsDemo .svc-profile b{display:block;font-size:18px}#svContactsDemo .svc-profile small{color:#787d9d}#svContactsDemo .svc-sectionname{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#827cac;font-weight:900;margin:24px 0 12px}#svContactsDemo .svc-infogrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}#svContactsDemo .svc-infobox{border:1px solid #e9eafa;border-radius:14px;padding:13px;min-width:0}#svContactsDemo .svc-infobox small{display:block;font-size:11px;color:#959bb2;margin-bottom:5px}#svContactsDemo .svc-infobox strong{font-size:13px;color:#292d4a;overflow-wrap:anywhere}#svContactsDemo .svc-drawer-note{background:#eff9f5;border:1px solid #d7eee3;border-radius:13px;padding:14px;font-size:13px;color:#376b57;line-height:1.6}#svContactsDemo .svc-drawer-cta{background:#6054ee;border:none;color:#fff;border-radius:12px;padding:12px 18px;font-size:13px;font-weight:820;margin-top:18px}\n#svContactsDemo .svc-edit-form{display:grid;gap:14px}#svContactsDemo .svc-field label{display:block;font-size:12px;font-weight:820;color:#59617e;margin:0 0 6px}#svContactsDemo .svc-field input,#svContactsDemo .svc-field select{width:100%;height:42px;background:#fff;color:#292c49;border:1px solid #dfe1f2;border-radius:11px;padding:0 11px}#svContactsDemo .svc-form-actions{display:flex;gap:8px}#svContactsDemo .svc-form-actions button{flex:1;height:43px;border-radius:11px;border:1px solid #d9dafa;background:#fff;color:#574cdc;font-weight:800}#svContactsDemo .svc-form-actions .primary{background:#6054ee;color:#fff;border-color:#6054ee}\n#svContactsDemo .svc-toast{position:absolute;z-index:65;right:24px;bottom:20px;background:#222a52;color:#fff;border:1px solid #414985;border-radius:13px;box-shadow:0 12px 35px #14194b35;padding:12px 16px;max-width:min(410px,calc(100% - 36px));font-size:13px;font-weight:720;opacity:0;transform:translateY(18px);pointer-events:none;transition:opacity .23s,transform .23s}#svContactsDemo .svc-toast.on{opacity:1;transform:none}#svContactsDemo .svc-demo-hint{position:absolute;bottom:11px;left:325px;color:#9396b0;font-size:10px;pointer-events:none;z-index:2;opacity:.8}\n@media(max-width:1250px){#svContactsDemo .svc-layout{grid-template-columns:235px minmax(0,1fr)}#svContactsDemo .svc-brand img{width:145px}#svContactsDemo .svc-nav-item{padding:0 10px;gap:11px}#svContactsDemo .svc-nav-item strong{font-size:13px}#svContactsDemo .svc-scroll{padding:15px 16px}#svContactsDemo .svc-table th:nth-child(1){width:37%}#svContactsDemo .svc-table th:nth-child(2){width:10%}#svContactsDemo .svc-table th:nth-child(3){width:14%}#svContactsDemo .svc-table th:nth-child(4){width:10%}#svContactsDemo .svc-table th:nth-child(5){width:13%}#svContactsDemo .svc-table th:nth-child(6){width:16%}#svContactsDemo .svc-table th,#svContactsDemo .svc-table td{padding-left:7px;padding-right:7px}#svContactsDemo .svc-person{gap:8px}#svContactsDemo .svc-avatar{width:42px;height:42px;border-radius:13px}#svContactsDemo .svc-contact-name{font-size:13px}#svContactsDemo .svc-contact-sub{font-size:11px}#svContactsDemo .svc-tag{font-size:10px;padding:4px 6px}#svContactsDemo .svc-action{height:35px;min-width:34px;border-radius:10px}#svContactsDemo .svc-demo-hint{left:255px}}\n@media(max-width:850px){#svContactsDemo .svc-layout{grid-template-columns:70px minmax(0,1fr)}#svContactsDemo .svc-side{padding:15px 7px}#svContactsDemo .svc-brand{padding:0 0 16px;justify-content:center}#svContactsDemo .svc-brand img{display:none}#svContactsDemo .svc-back{height:44px;width:44px}#svContactsDemo .svc-side-label{font-size:0;margin:9px 0;height:3px;background:#eae9ff;border-radius:8px}#svContactsDemo .svc-nav-item{justify-content:center;width:54px;padding:0;gap:0}#svContactsDemo .svc-nav-item strong,#svContactsDemo .svc-count,#svContactsDemo .svc-credits{display:none}#svContactsDemo .svc-top{padding:0 13px;height:70px;min-height:70px}#svContactsDemo .svc-scroll{padding:11px}#svContactsDemo .svc-table th:nth-child(5),#svContactsDemo .svc-table td:nth-child(5){display:none}#svContactsDemo .svc-table th:nth-child(1){width:40%}#svContactsDemo .svc-table th:nth-child(2){width:10%}#svContactsDemo .svc-table th:nth-child(3){width:16%}#svContactsDemo .svc-table th:nth-child(4){width:13%}#svContactsDemo .svc-table th:nth-child(6){width:21%}#svContactsDemo .svc-contact-sub{max-width:175px}#svContactsDemo .svc-demo-hint{display:none}}\n@media(max-width:600px){#svContactsDemo{min-height:650px}#svContactsDemo .svc-layout{height:720px;min-height:650px;grid-template-columns:1fr}#svContactsDemo .svc-side{display:none}#svContactsDemo .svc-top{height:62px;min-height:62px;padding:0 11px}#svContactsDemo .svc-page{font-size:17px}#svContactsDemo .svc-org{font-size:10px}#svContactsDemo .svc-topbuttons{gap:5px}#svContactsDemo .svc-topbtn{height:38px;min-width:37px;padding:0 6px;border-radius:11px}#svContactsDemo .svc-lang{font-size:13px}#svContactsDemo .svc-ai{font-size:11px;gap:4px}#svContactsDemo .svc-star{font-size:15px}#svContactsDemo .svc-switch{width:31px;height:19px;padding:2px}#svContactsDemo .svc-switch:after{width:15px;height:15px}#svContactsDemo .svc-ai.on .svc-switch:after{transform:translateX(12px)}#svContactsDemo .svc-topbtn[data-topmsg],#svContactsDemo .svc-topbtn[data-topbell]{display:none}#svContactsDemo .svc-scroll{padding:9px}#svContactsDemo .svc-table-card{border-radius:17px;min-height:620px}#svContactsDemo .svc-table-title{height:63px;padding:0 13px;font-size:15px}#svContactsDemo .svc-results{font-size:11px;padding:5px 8px}#svContactsDemo .svc-table thead{height:36px}#svContactsDemo .svc-table th{font-size:10px;letter-spacing:.3px}#svContactsDemo .svc-table td{height:88px;font-size:12px}#svContactsDemo .svc-table th:nth-child(2),#svContactsDemo .svc-table td:nth-child(2),#svContactsDemo .svc-table th:nth-child(4),#svContactsDemo .svc-table td:nth-child(4),#svContactsDemo .svc-table th:nth-child(5),#svContactsDemo .svc-table td:nth-child(5){display:none}#svContactsDemo .svc-table th:nth-child(1){width:58%}#svContactsDemo .svc-table th:nth-child(3){width:20%}#svContactsDemo .svc-table th:nth-child(6){width:22%}#svContactsDemo .svc-table th:first-child,#svContactsDemo .svc-table td:first-child{padding-left:9px}#svContactsDemo .svc-table th:last-child,#svContactsDemo .svc-table td:last-child{padding-right:7px}#svContactsDemo .svc-person{gap:7px}#svContactsDemo .svc-avatar{width:36px;height:36px;font-size:11px;border-radius:11px}#svContactsDemo .svc-contact-name{font-size:12px}#svContactsDemo .svc-contact-sub{font-size:10px;max-width:135px;margin:2px 0 5px}#svContactsDemo .svc-tagrow{gap:3px}#svContactsDemo .svc-tag{font-size:9px;padding:3px 5px}#svContactsDemo .svc-stage{font-size:10px;padding:6px}#svContactsDemo .svc-action{height:30px;min-width:30px;border-radius:9px;font-size:10px}#svContactsDemo .svc-actions{gap:3px}#svContactsDemo .svc-action.delete{display:none}#svContactsDemo .svc-action.edit{font-size:16px}#svContactsDemo .svc-tools{padding:7px;flex-wrap:wrap}#svContactsDemo .svc-tools input{flex-basis:100%}#svContactsDemo .svc-infogrid{grid-template-columns:1fr}#svContactsDemo .svc-drawer{padding:20px 18px;width:100%}}\n@media(prefers-reduced-motion:reduce){#svContactsDemo *,#svContactsDemo *:before,#svContactsDemo *:after{animation:none!important;transition:none!important}#svContactsDemo .svc-cursor{display:none!important}}\n<\/style>\n<div class=\"svc-layout\">\n <aside class=\"svc-side\">\n  <div class=\"svc-brand\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\"><button class=\"svc-back\" aria-label=\"Contraer men\u00fa\">\u2039<\/button><\/div>\n  <div class=\"svc-side-label\">TRABAJO<\/div>\n  <nav class=\"svc-nav\" aria-label=\"Navegaci\u00f3n de ejemplo\">\n   <button class=\"svc-nav-item\" data-nav=\"Inicio\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m3 11 9-8 9 8v10h-7v-7h-4v7H3z\"\/><\/svg><strong>Inicio<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Inbox\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M4 5h16v12H9l-5 4z\"\/><\/svg><strong>Inbox<\/strong><span class=\"svc-count\">12<\/span><\/button>\n   <button class=\"svc-nav-item active\" data-nav=\"Contactos\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"7\" r=\"4\"\/><path d=\"M4 21c0-5 3.4-8 8-8s8 3 8 8\"\/><\/svg><strong>Contactos<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"CRM\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 4h18l-7 8v7l-4 2v-9z\"\/><\/svg><strong>CRM<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Tareas\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"m8 12 3 3 5-6\"\/><\/svg><strong>Tareas<\/strong><span class=\"svc-count\">2<\/span><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Agenda\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"16\" rx=\"2\"\/><path d=\"M8 2v6M16 2v6M3 10h18\"\/><\/svg><strong>Agenda<\/strong><\/button>\n  <\/nav>\n  <div class=\"svc-side-label\" style=\"margin-top:25px\">HERRAMIENTAS<\/div>\n  <nav class=\"svc-nav\">\n   <button class=\"svc-nav-item\" data-nav=\"Automatizaciones\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m13 2-8 11h7l-1 9 8-12h-7z\"\/><\/svg><strong>Automatizaciones<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Respuestas y recursos\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 5h18v13H7l-4 3zM7 9h10M7 13h7\"\/><\/svg><strong>Respuestas y recursos<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Conocimiento AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M12 6C9 4 5 4 2 5v15c3-1 7-1 10 1 3-2 7-2 10-1V5c-3-1-7-1-10 1zm0 0v15\"\/><\/svg><strong>Conocimiento AI<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Productos y servicios\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m12 2 9 5v10l-9 5-9-5V7zM3 7l9 5 9-5m-9 5v10\"\/><\/svg><strong>Productos y servicios<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Agentes AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m12 2 3 7 7 3-7 3-3 7-3-7-7-3 7-3z\"\/><\/svg><strong>Agentes AI<\/strong><\/button>\n   <button class=\"svc-nav-item\" data-nav=\"Cr\u00e9ditos AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M15 9c-1-2-6-2-6 0s6 1 6 5-6 3-6 1M12 5v14\"\/><\/svg><strong>Cr\u00e9ditos AI<\/strong><span class=\"svc-credits\">8,450<\/span><\/button>\n  <\/nav>\n  <div class=\"svc-side-label\" style=\"margin-top:22px\">INSIGHTS<\/div>\n  <nav class=\"svc-nav\"><button class=\"svc-nav-item\" data-nav=\"Anal\u00edtica\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 19 9 12l4 4 8-10M16 6h5v5\"\/><\/svg><strong>Anal\u00edtica<\/strong><\/button><\/nav>\n <\/aside>\n <main class=\"svc-main\">\n  <header class=\"svc-top\"><div><div class=\"svc-org\">Horizonte Creativo \u00b7 Demo<\/div><div class=\"svc-page\">Contactos<\/div><\/div><div class=\"svc-topbuttons\">\n   <button class=\"svc-topbtn svc-lang\" title=\"Idioma\">\ud83c\uddf2\ud83c\uddfd <span>ES<\/span><\/button>\n   <button class=\"svc-topbtn svc-ai\" data-ai title=\"Activar o desactivar AI\"><span class=\"svc-star\">\u2726<\/span> AI <span class=\"svc-switch\"><\/span><\/button>\n   <button class=\"svc-topbtn\" data-search aria-label=\"Buscar\"><svg class=\"svc-search-icon\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"10.5\" cy=\"10.5\" r=\"6.5\"\/><path d=\"m16 16 5 5\"\/><\/svg><\/button>\n   <button class=\"svc-topbtn\" data-topmsg title=\"Respuestas y recursos\">\u25a4<\/button><button class=\"svc-topbtn\" data-topbell title=\"Notificaciones\">\u25c7<span style=\"font-size:11px;color:#fa5281;align-self:flex-start\">\u25cf<\/span><\/button>\n  <\/div><\/header>\n  <section class=\"svc-scroll\"><div class=\"svc-table-card\">\n   <div class=\"svc-table-title\"><span>Todos los contactos<\/span><span class=\"svc-results\" data-results>825 resultados<\/span><\/div>\n   <div class=\"svc-tools\" data-tools hidden><input data-query type=\"search\" placeholder=\"Buscar nombre, empresa o correo...\" aria-label=\"Buscar contactos\"><button class=\"svc-smallbtn\" data-filter>Solo oportunidades<\/button><button class=\"svc-smallbtn\" data-new>+ Contacto<\/button><button class=\"svc-smallbtn\" data-close-search>\u00d7<\/button><\/div>\n   <table class=\"svc-table\"><thead><tr><th>CONTACTO<\/th><th>ACTIVIDAD<\/th><th>ETAPA<\/th><th>VALOR<\/th><th>CATEGOR\u00cdA<\/th><th>ACCIONES<\/th><\/tr><\/thead><tbody data-body><\/tbody><tfoot><tr><td colspan=\"6\">Vista demostrativa \u00b7 Todos los contactos y empresas son ficticios<\/td><\/tr><\/tfoot><\/table>\n  <\/div><\/section>\n <\/main>\n<\/div>\n<div class=\"svc-cursor\" data-cursor aria-hidden=\"true\"><svg viewBox=\"0 0 32 32\"><path d=\"M4 2 4 26 11.1 20.2 16.4 30 21.4 27.4 16.1 17.9 25.3 16.4Z\" fill=\"#fff\" stroke=\"#5245d9\" stroke-width=\"2.2\" stroke-linejoin=\"round\"\/><\/svg><\/div>\n<div class=\"svc-shade\" data-shade><\/div><section class=\"svc-drawer\" data-drawer aria-label=\"Ficha de contacto\"><div class=\"svc-drawer-head\"><h3 data-drawer-title>Contacto 360\u00b0<\/h3><button class=\"svc-x\" data-close-drawer aria-label=\"Cerrar\">\u00d7<\/button><\/div><div data-drawer-content><\/div><\/section>\n<div class=\"svc-toast\" data-toast role=\"status\" aria-live=\"polite\"><\/div>\n<script>\n(function(){\n const root=document.getElementById('svContactsDemo');if(!root||root.dataset.initialized)return;root.dataset.initialized='1';\n const $=(sel,scope=root)=>scope.querySelector(sel),$$=(sel,scope=root)=>Array.from(scope.querySelectorAll(sel));\n \/\/ Datos inventados intencionalmente, sin referencias a la base de contactos de ning\u00fan workspace.\n const original=[\n {name:'Valeria Montes',initial:'VM',company:'Flor de Loto Estudio',channel:'Instagram',activity:'Ahora',stage:'Nuevo',value:0,category:'Bienestar',email:'valeria@example.com',phone:'(000) 000-0101',interest:'Sesi\u00f3n de fotograf\u00eda de producto',note:'Solicit\u00f3 una cotizaci\u00f3n de paquetes y desea recibir detalles por correo.'},\n {name:'Mateo Salcedo',initial:'MS',company:'Atlas Bicicletas',channel:'WhatsApp',activity:'3 min',stage:'Calificado',value:12500,category:'Comercio',email:'mateo@example.com',phone:'(000) 000-0102',interest:'Plan de seguimiento de pedidos',note:'Requiere una demostraci\u00f3n y comparar dos opciones de servicio.'},\n {name:'Sof\u00eda Villarreal',initial:'SV',company:'Casa Lumbre Decoraci\u00f3n',channel:'Facebook Messenger',activity:'8 min',stage:'En seguimiento',value:7800,category:'Hogar',email:'sofia@example.com',phone:'(000) 000-0103',interest:'Cat\u00e1logo y atenci\u00f3n digital',note:'Se program\u00f3 llamada de diagn\u00f3stico para resolver dudas.'},\n {name:'Daniela Cruz',initial:'DC',company:'Verde Urbano',channel:'WhatsApp',activity:'18 min',stage:'Propuesta',value:24000,category:'Servicios',email:'daniela@example.com',phone:'(000) 000-0104',interest:'Automatizaci\u00f3n de consultas',note:'Revisando propuesta de implementaci\u00f3n y fechas de inicio.'},\n {name:'Andr\u00e9s Paredes',initial:'AP',company:'Punto Norte Cowork',channel:'Chat web',activity:'37 min',stage:'Calificado',value:9500,category:'Oficinas',email:'andres@example.com',phone:'(000) 000-0105',interest:'Reservaciones y agenda',note:'Solicit\u00f3 un flujo para consultar disponibilidad de salas.'},\n {name:'Luc\u00eda Ben\u00edtez',initial:'LB',company:'Caf\u00e9 Aurora',channel:'Instagram',activity:'1 h',stage:'Nuevo',value:0,category:'Gastronom\u00eda',email:'lucia@example.com',phone:'(000) 000-0106',interest:'Atenci\u00f3n a pedidos',note:'Pidi\u00f3 informaci\u00f3n sobre centralizaci\u00f3n de mensajes.'},\n {name:'Emilio Robles',initial:'ER',company:'Taller Marea',channel:'Facebook Messenger',activity:'2 h',stage:'En seguimiento',value:15800,category:'Automotriz',email:'emilio@example.com',phone:'(000) 000-0107',interest:'Gesti\u00f3n de prospectos',note:'Desea organizar contactos y etiquetas por l\u00ednea de servicio.'},\n {name:'Renata Campos',initial:'RC',company:'Nido Arquitectura',channel:'WhatsApp',activity:'3 h',stage:'Calificado',value:32000,category:'Arquitectura',email:'renata@example.com',phone:'(000) 000-0108',interest:'CRM para proyectos',note:'Comparte propuesta con equipo y revisar\u00e1 presupuesto.'}\n ];\n let contacts=original.map(x=>({...x}));let activeFilter=false,query='',demoOn=false,pausedUntil=0,loopId=0,queued=[],current=1,toastId=0;\n const body=$('[data-body]'),toast=$('[data-toast]'),cursor=$('[data-cursor]');\n const safe=s=>String(s).replace(\/[&<>\"']\/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[c]));\n const fmt=n=>'$'+Number(n).toLocaleString('es-MX');\n function stageClass(s){return s==='Calificado'?'qualified':(s==='Propuesta'||s==='En seguimiento'?'hot':'')}\n function render(){const list=contacts.filter(c=>(!activeFilter||c.value>0)&&(!query||[c.name,c.company,c.email].some(x=>x.toLowerCase().includes(query.toLowerCase()))));body.innerHTML=list.map(c=>{const id=contacts.indexOf(c);return `<tr data-row=\"${id}\"><td><div class=\"svc-person\"><div class=\"svc-avatar\">${safe(c.initial)}<\/div><div style=\"min-width:0\"><div class=\"svc-contact-name\">${safe(c.name)}<\/div><div class=\"svc-contact-sub\">${safe(c.company)}<\/div><div class=\"svc-tagrow\"><span class=\"svc-tag purple\">Prospecto<\/span><span class=\"svc-tag gray\">${safe(c.channel)}<\/span><\/div><\/div><\/div><\/td><td>${safe(c.activity)}<\/td><td><span class=\"svc-stage ${stageClass(c.stage)}\">${safe(c.stage)}<\/span><\/td><td><span class=\"svc-money\">${fmt(c.value)}<\/span><\/td><td><span class=\"svc-cat set\">${safe(c.category)}<\/span><\/td><td><div class=\"svc-actions\"><button class=\"svc-action\" data-open=\"${id}\" title=\"Ficha 360\u00b0\">360<\/button><button class=\"svc-action edit\" data-edit=\"${id}\" title=\"Editar contacto\">\u270e<\/button><button class=\"svc-action delete\" data-remove=\"${id}\" title=\"Eliminar solo en esta demo\">\u265c<\/button><\/div><\/td><\/tr>`}).join('')||'<tr><td colspan=\"6\" style=\"text-align:center;padding:45px\">Sin resultados para esta b\u00fasqueda.<\/td><\/tr>';\n $('[data-results]').textContent=(query||activeFilter?list.length:825)+' resultados';}\n function showToast(t){toast.textContent=t;toast.classList.add('on');clearTimeout(toastId);toastId=setTimeout(()=>toast.classList.remove('on'),2100)}\n function showTools(on){$('[data-tools]').hidden=!on;if(on)$('[data-query]').focus({preventScroll:true});}\n function drawerClose(){$('[data-shade]').classList.remove('open');$('[data-drawer]').classList.remove('open')}\n function openContact(id){const c=contacts[id];if(!c)return;current=id;$('[data-drawer-title]').textContent='Contacto 360\u00b0';$('[data-drawer-content]').innerHTML=`<div class=\"svc-profile\"><span class=\"svc-avatar\">${safe(c.initial)}<\/span><div><b>${safe(c.name)}<\/b><small>${safe(c.company)} \u00b7 Prospecto<\/small><\/div><\/div><p class=\"svc-sectionname\">Informaci\u00f3n del contacto<\/p><div class=\"svc-infogrid\"><div class=\"svc-infobox\"><small>Correo electr\u00f3nico<\/small><strong>${safe(c.email)}<\/strong><\/div><div class=\"svc-infobox\"><small>Tel\u00e9fono de demostraci\u00f3n<\/small><strong>${safe(c.phone)}<\/strong><\/div><div class=\"svc-infobox\"><small>Canal de origen<\/small><strong>${safe(c.channel)}<\/strong><\/div><div class=\"svc-infobox\"><small>Categor\u00eda<\/small><strong>${safe(c.category)}<\/strong><\/div><div class=\"svc-infobox\"><small>Etapa del CRM<\/small><strong>${safe(c.stage)}<\/strong><\/div><div class=\"svc-infobox\"><small>Valor estimado<\/small><strong>${fmt(c.value)}<\/strong><\/div><\/div><p class=\"svc-sectionname\">Oportunidad asociada<\/p><div class=\"svc-infobox\"><small>Inter\u00e9s principal<\/small><strong>${safe(c.interest)}<\/strong><\/div><p class=\"svc-sectionname\">Nota de seguimiento<\/p><div class=\"svc-drawer-note\">${safe(c.note)}<\/div><button class=\"svc-drawer-cta\" data-open-edit=\"${id}\">Editar informaci\u00f3n \u2192<\/button>`;openDrawer()}\n function openDrawer(){$('[data-shade]').classList.add('open');$('[data-drawer]').classList.add('open')}\n function openEdit(id){const c=contacts[id]||{name:'',company:'',email:'',phone:'',stage:'Nuevo',category:'General',value:0,initial:'NV',channel:'Chat web',activity:'Ahora',interest:'Nuevo contacto',note:'Contacto incorporado en la demo'};const isNew=id<0;$('[data-drawer-title]').textContent=isNew?'Nuevo contacto':'Editar contacto';$('[data-drawer-content]').innerHTML=`<form class=\"svc-edit-form\" data-form data-id=\"${id}\"><div class=\"svc-field\"><label>Nombre completo<\/label><input required name=\"name\" value=\"${safe(c.name)}\" placeholder=\"Nombre del contacto\"><\/div><div class=\"svc-field\"><label>Empresa o marca<\/label><input required name=\"company\" value=\"${safe(c.company)}\"><\/div><div class=\"svc-field\"><label>Correo electr\u00f3nico<\/label><input type=\"email\" name=\"email\" value=\"${safe(c.email)}\"><\/div><div class=\"svc-field\"><label>Etapa<\/label><select name=\"stage\">${['Nuevo','Calificado','En seguimiento','Propuesta','Ganado'].map(a=>`<option ${c.stage===a?'selected':''}>${a}<\/option>`).join('')}<\/select><\/div><div class=\"svc-field\"><label>Valor de la oportunidad (MXN)<\/label><input name=\"value\" type=\"number\" min=\"0\" max=\"10000000\" value=\"${c.value}\"><\/div><div class=\"svc-field\"><label>Categor\u00eda<\/label><select name=\"category\">${['Comercio','Bienestar','Servicios','Hogar','Arquitectura','Automotriz','Gastronom\u00eda','Oficinas'].map(a=>`<option ${c.category===a?'selected':''}>${a}<\/option>`).join('')}<\/select><\/div><div class=\"svc-form-actions\"><button type=\"button\" data-close-drawer>Cancelar<\/button><button class=\"primary\" type=\"submit\">Guardar contacto<\/button><\/div><\/form>`;openDrawer()}\n function saveForm(form){const id=Number(form.dataset.id);const d=new FormData(form);const old=contacts[id]||{channel:'Chat web',activity:'Ahora',phone:'(000) 000-0109',interest:'Nuevo contacto',note:'Ficha ficticia para demostraci\u00f3n'};const name=String(d.get('name')||'').trim();let c={...old,name,initial:name.split(\/\\s+\/).slice(0,2).map(p=>p[0]).join('').toUpperCase(),company:String(d.get('company')||''),email:String(d.get('email')||''),stage:String(d.get('stage')||''),value:Number(d.get('value')||0),category:String(d.get('category')||'')};if(id<0)contacts.unshift(c);else contacts[id]=c;drawerClose();render();showToast(id<0?'Contacto de demostraci\u00f3n creado':'Contacto de demostraci\u00f3n actualizado')}\n function handleAction(e){const el=e.target.closest('button');if(!el||!root.contains(el))return;pausedUntil=Date.now()+13000;\n if(el.hasAttribute('data-open'))openContact(Number(el.dataset.open));else if(el.hasAttribute('data-edit'))openEdit(Number(el.dataset.edit));else if(el.hasAttribute('data-open-edit'))openEdit(Number(el.dataset.openEdit));else if(el.hasAttribute('data-close-drawer'))drawerClose();else if(el.hasAttribute('data-remove')){contacts.splice(Number(el.dataset.remove),1);render();showToast('Contacto retirado \u00fanicamente de esta demostraci\u00f3n')}else if(el.hasAttribute('data-search'))showTools(true);else if(el.hasAttribute('data-close-search')){query='';activeFilter=false;$('[data-query]').value='';$('[data-filter]').classList.remove('selected');render();showTools(false)}else if(el.hasAttribute('data-filter')){activeFilter=!activeFilter;el.classList.toggle('selected',activeFilter);render()}else if(el.hasAttribute('data-new'))openEdit(-1);else if(el.hasAttribute('data-ai')){el.classList.toggle('on');showToast(el.classList.contains('on')?'Modo AI activado \u00b7 demostraci\u00f3n':'Modo AI en pausa \u00b7 demostraci\u00f3n')}else if(el.hasAttribute('data-nav')){showToast('Vista de ejemplo: '+el.dataset.nav+' \u00b7 Contactos permanece abierto')}else if(el.classList.contains('svc-lang'))showToast('Demostraci\u00f3n en espa\u00f1ol');else if(el.classList.contains('svc-action')){}else showToast('Control ilustrativo de Vchat')}\n root.addEventListener('click',handleAction);root.addEventListener('submit',e=>{if(e.target.matches('[data-form]')){e.preventDefault();saveForm(e.target)}});$('[data-query]').addEventListener('input',e=>{query=e.target.value;render()});$('[data-shade]').addEventListener('click',()=>{drawerClose();pausedUntil=Date.now()+7000});\n function wait(ms,fn){queued.push(setTimeout(()=>{if(demoOn&&Date.now()>=pausedUntil)fn()},ms))}\n function point(el,click=true){if(!el)return;const box=root.getBoundingClientRect(),r=el.getBoundingClientRect();cursor.style.left=(r.left-box.left+r.width*.63)+'px';cursor.style.top=(r.top-box.top+r.height*.55)+'px';cursor.style.opacity='1';$$('.demo-focus').forEach(x=>x.classList.remove('demo-focus'));const tr=el.closest('tr');if(tr)tr.classList.add('demo-focus');if(click){setTimeout(()=>{cursor.classList.remove('tap');void cursor.offsetWidth;cursor.classList.add('tap')},390)}}\n function reset(){drawerClose();query='';activeFilter=false;$('[data-filter]').classList.remove('selected');$('[data-query]').value='';showTools(false);contacts=original.map(x=>({...x}));render();$$('.demo-focus').forEach(x=>x.classList.remove('demo-focus'));}\n function animate(){queued.forEach(clearTimeout);queued=[];if(!demoOn)return;reset();\n wait(450,()=>point($('[data-row=\"1\"] [data-open]')));\n wait(1050,()=>openContact(1));\n wait(2250,()=>{point($('[data-close-drawer]'));drawerClose()});\n wait(2850,()=>point($('[data-search]')));\n wait(3400,()=>{showTools(true);point($('[data-query]'));});\n wait(3850,()=>{$('[data-query]').value='Casa';query='Casa';render();showToast('Buscando contactos...')});\n wait(4700,()=>{query='';$('[data-query]').value='';render();point($('[data-filter]'))});\n wait(5350,()=>{activeFilter=true;$('[data-filter]').classList.add('selected');render();showToast('Filtro: oportunidades con valor')});\n wait(6400,()=>{point($('[data-filter]'));activeFilter=false;$('[data-filter]').classList.remove('selected');render();});\n wait(7000,()=>{point($('[data-row=\"3\"] [data-edit]'));openEdit(3)});\n wait(8200,()=>{const f=$('[data-form]');if(!f)return;f.elements.stage.value='Ganado';f.elements.value.value='28500';point(f.querySelector('.primary'))});\n wait(9000,()=>{const f=$('[data-form]');if(f)saveForm(f)});\n wait(10100,()=>{showTools(false);point($('[data-ai]'))});\n wait(10600,()=>{$('[data-ai]').classList.toggle('on');showToast('AI activada en el workspace \u00b7 demostraci\u00f3n')});\n wait(11600,()=>point($('[data-row=\"3\"] [data-open]')));\n wait(12200,()=>openContact(3));\n wait(14100,()=>{drawerClose();cursor.style.opacity='0'});\n loopId=setTimeout(animate,16200);\n }\n const prefersReduced=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n if(!prefersReduced&&'IntersectionObserver'in window){const io=new IntersectionObserver(es=>{const visible=es.some(e=>e.isIntersecting);if(visible&&!demoOn){demoOn=true;animate()}else if(!visible&&demoOn){demoOn=false;clearTimeout(loopId);queued.forEach(clearTimeout);queued=[];cursor.style.opacity='0';drawerClose()}},{threshold:.12});io.observe(root)}else if(!prefersReduced){demoOn=true;animate()}else{render()}\n render();\n})();\n<\/script>\n<\/div>\n<\/body><\/html><\/template>\n<template id=\"vc8-approved-crm\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}<\/style><\/head><body><!-- VCHAT CRM \u00b7 CLON ANIMADO V1 \u00b7 DEMOSTRACI\u00d3N SIN DATOS REALES -->\n<div id=\"svCRMDemo\" aria-label=\"Demostraci\u00f3n interactiva del CRM de Vchat by StudioVainilla\"><style>\n#svCRMDemo{--ink:#20223f;--blue:#347ffd;--purple:#6d5acd;--line:#e2e6f5;--muted:#8690ac;position:relative;isolation:isolate;overflow:hidden;color:var(--ink);background:#f8faff;font:14px\/1.42 Inter,system-ui,-apple-system,\"Segoe UI\",Arial,sans-serif!important;box-shadow:0 16px 62px #1d25551a;border:1px solid #e5e8f4;min-height:780px}\n#svCRMDemo *,#svCRMDemo *:before,#svCRMDemo *:after{box-sizing:border-box}#svCRMDemo button,#svCRMDemo input,#svCRMDemo select{font:inherit!important;text-transform:none!important;letter-spacing:normal!important}#svCRMDemo button{cursor:pointer}#svCRMDemo button:focus-visible,#svCRMDemo input:focus-visible{outline:2px solid #6154fa;outline-offset:3px}\n#svCRMDemo .vcrm-layout{display:grid;grid-template-columns:290px minmax(0,1fr);height:820px}#svCRMDemo .vcrm-side{min-width:0;background:#fff;border-right:1px solid #e8eaf4;padding:23px 13px 12px;overflow:hidden}#svCRMDemo .vcrm-brand{display:flex;align-items:center;justify-content:space-between;padding:3px 2px 20px 7px;border-bottom:1px solid #edf0f7;margin-bottom:13px;gap:12px}#svCRMDemo .vcrm-brand img{width:182px;object-fit:contain;max-height:55px}#svCRMDemo .vcrm-back{background:#fff;color:#687ba0;border:1px solid #dfe6f6;border-radius:14px;width:44px;height:44px;font-size:24px}#svCRMDemo .vcrm-side-label{font-weight:850;color:#8fa6c7;font-size:11px;letter-spacing:1.1px;margin:12px 17px 12px}#svCRMDemo .vcrm-nav{display:grid;gap:2px}#svCRMDemo .vcrm-nav-item{border:0;border-radius:12px;background:transparent;min-height:43px;padding:0 15px;display:flex;gap:14px;align-items:center;text-align:left;color:#627490;font-weight:730;width:100%}#svCRMDemo .vcrm-nav-item strong{font-weight:740;font-size:14px;white-space:nowrap}#svCRMDemo .vcrm-nav-item svg{flex:none;width:18px;height:18px}#svCRMDemo .vcrm-nav-item.active{background:#f1f0ff;box-shadow:inset 0 0 0 2px #d7d2ff;color:#4d47dc}#svCRMDemo .vcrm-nav-item:not(.active):hover{background:#f7f7ff}#svCRMDemo .vcrm-count{margin-left:auto;border-radius:99px;padding:5px 9px;color:#fff;background:linear-gradient(120deg,#7960f8,#38a8ff);box-shadow:0 3px 9px #6959fe35;font-size:11px}#svCRMDemo .vcrm-credits{margin-left:auto;border-radius:99px;padding:5px 9px;background:#e9efff;color:#5a53e9;font-size:11px}#svCRMDemo .vcrm-main{display:flex;flex-direction:column;min-width:0;background:linear-gradient(145deg,#f8faff,#f7f9ff)}#svCRMDemo .vcrm-top{height:75px;flex:0 0 75px;background:#fff;border-bottom:1px solid #e4e8f4;display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:10px}#svCRMDemo .vcrm-org{font-size:10px;font-weight:800;color:#91a2be;letter-spacing:.3px}#svCRMDemo .vcrm-page{font-size:17px;font-weight:860;color:#161c34}#svCRMDemo .vcrm-topbuttons{display:flex;gap:10px;align-items:center}#svCRMDemo .vcrm-topbtn{height:49px;min-width:48px;border:1px solid #dfe4f5;border-radius:17px;color:#5148d6;background:#fff;padding:0 13px;font-weight:850;display:flex;align-items:center;justify-content:center;gap:9px}#svCRMDemo .vcrm-topbtn svg{width:20px;height:20px}#svCRMDemo .vcrm-topbtn.vcrm-ai{background:#faf9ff;color:#8e8aaa}#svCRMDemo .vcrm-star{background:#e8e3ff;padding:4px 6px;border-radius:9px;color:#6a57f3}#svCRMDemo .vcrm-switch{width:36px;height:21px;background:#d4d2e6;border-radius:20px;position:relative}#svCRMDemo .vcrm-switch:before{content:\"\";position:absolute;top:3px;left:3px;width:15px;height:15px;background:#fff;border-radius:50%;box-shadow:0 2px 4px #3333;transition:transform .25s}#svCRMDemo .vcrm-ai.on .vcrm-switch{background:#6359ff}#svCRMDemo .vcrm-ai.on .vcrm-switch:before{transform:translateX(15px)}\n#svCRMDemo .vcrm-scroll{overflow:auto;min-height:0;padding:16px 20px 22px;scrollbar-width:thin;scrollbar-color:#d6daee transparent}#svCRMDemo .vcrm-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px}#svCRMDemo .vcrm-stat{background:#fff;border:1px solid #dfe4f3;border-radius:17px;padding:16px;min-height:62px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 24px #1d26510a}#svCRMDemo .vcrm-stat b{font-size:23px;color:#242541;font-weight:900}#svCRMDemo .vcrm-stat span{font-size:11px;letter-spacing:.1px;color:#8993ac;font-weight:680}#svCRMDemo .vcrm-panel{background:#fff;border:1px solid #dfe4f4;border-radius:23px;box-shadow:0 12px 34px #252e5a08;margin-bottom:21px;overflow:hidden}#svCRMDemo .vcrm-journey{background:linear-gradient(110deg,#fff,#f7f5ff)}#svCRMDemo .vcrm-panel-inner{padding:20px 20px 19px}#svCRMDemo .vcrm-eyebrow{font-size:10px;font-weight:930;color:#7069ad;letter-spacing:1.3px}#svCRMDemo .vcrm-panel-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}#svCRMDemo .vcrm-heading{font-size:18px;font-weight:870;color:#262942;letter-spacing:-.35px}#svCRMDemo .vcrm-muted{font-size:10px;color:#969bb6}#svCRMDemo .vcrm-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}#svCRMDemo .vcrm-step{border:1px solid #dfe4f3;border-radius:13px;background:#fff;min-height:62px;min-width:0;padding:10px 10px;display:grid;grid-template-columns:4px minmax(0,1fr) auto;align-items:center;gap:8px;text-align:left;color:#1d2341}#svCRMDemo .vcrm-step .vcrm-stepstripe{height:33px;border-radius:6px;background:var(--stage-color)}#svCRMDemo .vcrm-steptext{min-width:0}#svCRMDemo .vcrm-steptext b{font-size:10px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#svCRMDemo .vcrm-steptext small{font-size:8px;color:#8f91aa;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#svCRMDemo .vcrm-stepcount{border-radius:50%;min-width:19px;min-height:19px;background:#f3f1fa;color:var(--stage-color);font-size:10px;font-weight:820;display:grid;place-items:center}#svCRMDemo .vcrm-step.current{border-color:#3e86ff;box-shadow:0 0 0 1px #398aff26;background:#fcfdff}#svCRMDemo .vcrm-boardheader{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px 17px}#svCRMDemo .vcrm-arrows{display:flex;gap:7px;align-items:center}#svCRMDemo .vcrm-arrows small{font-size:10px;font-weight:850;letter-spacing:.7px;color:#827ab6;margin-right:7px}#svCRMDemo .vcrm-arrow{width:37px;height:37px;border-radius:12px;border:1px solid #dee3f7;background:#f9f9ff;color:#6459e7;font-size:19px}#svCRMDemo .vcrm-board-viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-behavior:smooth;padding:0 19px 24px}#svCRMDemo .vcrm-board-viewport::-webkit-scrollbar{display:none}#svCRMDemo .vcrm-board{display:flex;gap:15px;min-height:385px;width:max-content}#svCRMDemo .vcrm-lane{width:300px;min-height:370px;border:1px solid color-mix(in srgb,var(--stage-color) 25%,#fff);border-radius:17px;background:linear-gradient(180deg,var(--stage-soft),#f9faff 45%);overflow:hidden;position:relative}#svCRMDemo .vcrm-lane:before{content:\"\";position:absolute;inset:0 0 auto;height:4px;background:var(--stage-color)}#svCRMDemo .vcrm-lane-head{padding:19px 17px 14px;min-height:89px;display:flex;align-items:center;gap:9px;border-bottom:1px solid #e5e8f2}#svCRMDemo .vcrm-dot{width:11px;height:11px;flex:none;background:var(--stage-color);box-shadow:0 0 0 5px color-mix(in srgb,var(--stage-color) 12%,#fff);border-radius:50%}#svCRMDemo .vcrm-lane-title{min-width:0;flex:1}#svCRMDemo .vcrm-lane-title strong{font-size:16px;display:block}#svCRMDemo .vcrm-lane-title small{font-size:10px;color:#9795ad;display:block}#svCRMDemo .vcrm-lane-count{background:var(--stage-color);color:#fff;border-radius:11px;padding:6px 10px;font-size:12px;font-weight:830}#svCRMDemo .vcrm-lane-body{padding:13px;min-height:280px;display:grid;align-content:start;gap:10px}#svCRMDemo .vcrm-empty{border:1px dashed color-mix(in srgb,var(--stage-color) 30%,#ddd);border-radius:13px;background:#ffffffb5;color:#9b9db4;font-size:11px;text-align:center;padding:58px 12px;min-height:128px}#svCRMDemo .vcrm-deal{background:#fff;border:1px solid #e1e4f2;border-radius:14px;padding:12px;box-shadow:0 6px 14px #2933590f;cursor:grab;position:relative;animation:vcrmPop .35s both}#svCRMDemo .vcrm-deal:hover{border-color:#aaa7fb;transform:translateY(-2px)}#svCRMDemo .vcrm-deal b{font-size:13px;display:block;color:#202442;margin-bottom:3px}#svCRMDemo .vcrm-deal small{display:block;font-size:10px;color:#8a91a9}#svCRMDemo .vcrm-deal .vcrm-deal-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:8px}#svCRMDemo .vcrm-deal-amount{font-weight:900;color:#5950c4}#svCRMDemo .vcrm-pill{border-radius:99px;padding:4px 7px;background:#f1efff;color:#6452cb;font-size:9px;font-weight:750}#svCRMDemo .vcrm-deal.flash,#svCRMDemo .vcrm-stat.flash,#svCRMDemo .vcrm-step.flash{animation:vcrmGlow .8s both}#svCRMDemo .vcrm-shade{position:absolute;inset:0;background:#19224b70;z-index:10;opacity:0;pointer-events:none;transition:opacity .3s}#svCRMDemo .vcrm-shade.on{opacity:1;pointer-events:auto}#svCRMDemo .vcrm-drawer{position:absolute;right:0;top:0;bottom:0;width:min(480px,96%);background:#fff;box-shadow:-12px 0 55px #131c3d35;z-index:11;transform:translateX(105%);transition:transform .35s;padding:24px;overflow-y:auto}#svCRMDemo .vcrm-drawer.on{transform:none}#svCRMDemo .vcrm-drawer-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e8eaf5;padding-bottom:17px}#svCRMDemo .vcrm-drawer-head h3{margin:0;font-size:21px!important;color:#1f2140!important}#svCRMDemo .vcrm-x{border:1px solid #e3e5f4;border-radius:12px;background:#fff;color:#695ddd;width:37px;height:37px}#svCRMDemo .vcrm-detail-top{padding:20px 0 12px}#svCRMDemo .vcrm-detail-top h4{font-size:21px!important;color:#1b2040!important;margin:0 0 5px!important}#svCRMDemo .vcrm-detail-top p{color:#76829e;font-size:12px}#svCRMDemo .vcrm-data{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0}#svCRMDemo .vcrm-data div{border-radius:12px;background:#f7f8ff;padding:11px;min-width:0}#svCRMDemo .vcrm-data small{display:block;color:#9399b0;font-size:10px}#svCRMDemo .vcrm-data b{font-size:12px;overflow-wrap:anywhere}#svCRMDemo .vcrm-field{display:grid;gap:5px;margin:14px 0;color:#505b7b;font-size:12px;font-weight:800}#svCRMDemo .vcrm-field select,#svCRMDemo .vcrm-field input{border:1px solid #dfe3f3;border-radius:12px;background:#fff;color:#242640;padding:12px;width:100%}#svCRMDemo .vcrm-save{padding:12px 17px;border:0;border-radius:12px;background:#6254ee;color:#fff;font-weight:800;width:100%}#svCRMDemo .vcrm-note{font-size:12px;color:#5c6581;padding:12px;border-radius:12px;background:#f8f8ff;line-height:1.6}#svCRMDemo .vcrm-cursor{position:absolute;top:0;left:0;width:26px;height:30px;z-index:15;pointer-events:none;opacity:0;filter:drop-shadow(0 2px 3px #1114);transition:transform .44s cubic-bezier(.22,.8,.2,1),opacity .2s}#svCRMDemo .vcrm-cursor svg{width:100%}#svCRMDemo .vcrm-cursor.click{filter:drop-shadow(0 0 7px #6654f6aa)}#svCRMDemo .vcrm-toast{position:absolute;bottom:21px;left:50%;transform:translate(-50%,14px);opacity:0;transition:.3s;z-index:20;background:#26224f;color:#fff;padding:10px 17px;border-radius:12px;box-shadow:0 9px 25px #1115;font-size:12px;pointer-events:none}#svCRMDemo .vcrm-toast.on{opacity:1;transform:translate(-50%,0)}#svCRMDemo .vcrm-tip{position:absolute;bottom:18px;right:20px;font-size:10px;color:#a0a4b5}\n@keyframes vcrmPop{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@keyframes vcrmGlow{50%{box-shadow:0 0 0 4px #6058f62b,0 12px 26px #1d255522}}@media(max-width:980px){#svCRMDemo .vcrm-layout{grid-template-columns:75px minmax(0,1fr)}#svCRMDemo .vcrm-side{padding:12px 8px}#svCRMDemo .vcrm-brand{justify-content:center}#svCRMDemo .vcrm-brand img{width:43px;max-width:none;object-fit:cover;object-position:left;aspect-ratio:1}#svCRMDemo .vcrm-back,#svCRMDemo .vcrm-side-label,#svCRMDemo .vcrm-nav-item strong,#svCRMDemo .vcrm-count,#svCRMDemo .vcrm-credits{display:none}#svCRMDemo .vcrm-nav-item{padding:0;justify-content:center}#svCRMDemo .vcrm-nav-item svg{width:22px;height:22px}#svCRMDemo .vcrm-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}\n@media(max-width:600px){#svCRMDemo{min-height:670px}#svCRMDemo .vcrm-layout{height:670px;grid-template-columns:52px minmax(0,1fr)}#svCRMDemo .vcrm-brand{padding:0 0 12px}#svCRMDemo .vcrm-brand img{width:30px;height:30px}#svCRMDemo .vcrm-nav-item{min-height:37px}#svCRMDemo .vcrm-nav-item svg{height:19px;width:19px}#svCRMDemo .vcrm-side{padding:9px 4px}#svCRMDemo .vcrm-top{height:61px;flex-basis:61px;padding:0 9px}#svCRMDemo .vcrm-topbuttons{gap:4px}#svCRMDemo .vcrm-topbtn{height:38px;min-width:34px;border-radius:11px;padding:0 7px}#svCRMDemo .vcrm-lang,#svCRMDemo .vcrm-topbtn.vcrm-ai{font-size:10px}#svCRMDemo .vcrm-org{font-size:8px}#svCRMDemo .vcrm-page{font-size:14px}#svCRMDemo .vcrm-topbtn:nth-last-child(-n+2){display:none}#svCRMDemo .vcrm-topbtn svg{width:16px}#svCRMDemo .vcrm-scroll{padding:11px 9px}#svCRMDemo .vcrm-stats{gap:5px;margin-bottom:12px}#svCRMDemo .vcrm-stat{min-height:48px;gap:3px;padding:6px;display:grid}#svCRMDemo .vcrm-stat b{font-size:19px}#svCRMDemo .vcrm-stat span{font-size:8px}#svCRMDemo .vcrm-panel-inner{padding:12px}#svCRMDemo .vcrm-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}#svCRMDemo .vcrm-step{min-height:51px;padding:5px 3px;gap:3px}#svCRMDemo .vcrm-steptext b{font-size:8px}#svCRMDemo .vcrm-steptext small{font-size:7px}#svCRMDemo .vcrm-stepcount{font-size:8px;min-width:14px;min-height:14px}#svCRMDemo .vcrm-panel-header{margin-bottom:10px}#svCRMDemo .vcrm-heading{font-size:15px}#svCRMDemo .vcrm-boardheader{padding:12px}#svCRMDemo .vcrm-arrows small{display:none}#svCRMDemo .vcrm-arrow{width:30px;height:30px}#svCRMDemo .vcrm-board-viewport{padding:0 10px 15px}#svCRMDemo .vcrm-lane{width:245px;min-height:310px}#svCRMDemo .vcrm-board{min-height:310px}#svCRMDemo .vcrm-lane-body{min-height:240px}#svCRMDemo .vcrm-lane-head{min-height:68px;padding:10px}#svCRMDemo .vcrm-lane-title strong{font-size:13px}}\n@media(prefers-reduced-motion:reduce){#svCRMDemo *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}\n<\/style>\n<div class=\"vcrm-layout\"><aside class=\"vcrm-side\"><div class=\"vcrm-brand\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\"><button class=\"vcrm-back\" aria-label=\"Contraer men\u00fa\">\u2039<\/button><\/div>  <nav class=\"vcrm-nav\" aria-label=\"Navegaci\u00f3n de ejemplo\">\n   <button class=\"vcrm-nav-item\" data-nav=\"Inicio\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m3 11 9-8 9 8v10h-7v-7h-4v7H3z\"\/><\/svg><strong>Inicio<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Inbox\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M4 5h16v12H9l-5 4z\"\/><\/svg><strong>Inbox<\/strong><span class=\"vcrm-count\">37<\/span><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Contactos\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"7\" r=\"4\"\/><path d=\"M4 21c0-5 3.4-8 8-8s8 3 8 8\"\/><\/svg><strong>Contactos<\/strong><\/button>\n   <button class=\"vcrm-nav-item active\" data-nav=\"CRM\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 4h18l-7 8v7l-4 2v-9z\"\/><\/svg><strong>CRM<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Tareas\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"m8 12 3 3 5-6\"\/><\/svg><strong>Tareas<\/strong><span class=\"vcrm-count\">2<\/span><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Agenda\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><rect x=\"3\" y=\"5\" width=\"18\" height=\"16\" rx=\"2\"\/><path d=\"M8 2v6M16 2v6M3 10h18\"\/><\/svg><strong>Agenda<\/strong><\/button>\n  <\/nav>\n  <div class=\"vcrm-side-label\" style=\"margin-top:25px\">HERRAMIENTAS<\/div>\n  <nav class=\"vcrm-nav\">\n   <button class=\"vcrm-nav-item\" data-nav=\"Automatizaciones\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m13 2-8 11h7l-1 9 8-12h-7z\"\/><\/svg><strong>Automatizaciones<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Respuestas y recursos\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 5h18v13H7l-4 3zM7 9h10M7 13h7\"\/><\/svg><strong>Respuestas y recursos<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Conocimiento AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M12 6C9 4 5 4 2 5v15c3-1 7-1 10 1 3-2 7-2 10-1V5c-3-1-7-1-10 1zm0 0v15\"\/><\/svg><strong>Conocimiento AI<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Productos y servicios\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m12 2 9 5v10l-9 5-9-5V7zM3 7l9 5 9-5m-9 5v10\"\/><\/svg><strong>Productos y servicios<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Agentes AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"m12 2 3 7 7 3-7 3-3 7-3-7-7-3 7-3z\"\/><\/svg><strong>Agentes AI<\/strong><\/button>\n   <button class=\"vcrm-nav-item\" data-nav=\"Cr\u00e9ditos AI\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><circle cx=\"12\" cy=\"12\" r=\"9\"\/><path d=\"M15 9c-1-2-6-2-6 0s6 1 6 5-6 3-6 1M12 5v14\"\/><\/svg><strong>Cr\u00e9ditos AI<\/strong><span class=\"vcrm-credits\">30,000<\/span><\/button>\n  <\/nav>\n  <div class=\"vcrm-side-label\" style=\"margin-top:22px\">INSIGHTS<\/div>\n  <nav class=\"vcrm-nav\"><button class=\"vcrm-nav-item\" data-nav=\"Anal\u00edtica\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\"><path d=\"M3 19 9 12l4 4 8-10M16 6h5v5\"\/><\/svg><strong>Anal\u00edtica<\/strong><\/button><\/nav>\n<\/aside><main class=\"vcrm-main\"><header class=\"vcrm-top\"><div><div class=\"vcrm-org\">Estudio Brisa \u00b7 Demo<\/div><div class=\"vcrm-page\">CRM<\/div><\/div><div class=\"vcrm-topbuttons\"><button class=\"vcrm-topbtn vcrm-lang\" title=\"Espa\u00f1ol\">\ud83c\uddf2\ud83c\uddfd ES<\/button><button class=\"vcrm-topbtn vcrm-ai\" data-ai>\u2726 AI <span class=\"vcrm-switch\"><\/span><\/button><button class=\"vcrm-topbtn\" data-search title=\"Buscar oportunidades\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><circle cx=\"10\" cy=\"10\" r=\"6\"\/><path d=\"m15 15 6 6\"\/><\/svg><\/button><button class=\"vcrm-topbtn\" title=\"Respuestas y recursos\">\u25a4<\/button><button class=\"vcrm-topbtn\" title=\"Notificaciones\">\u25c7<\/button><\/div><\/header>\n<section class=\"vcrm-scroll\"><div class=\"vcrm-stats\"><div class=\"vcrm-stat\" data-stat=\"total\"><b>0<\/b><span>conversaciones clasificadas<\/span><\/div><div class=\"vcrm-stat\" data-stat=\"won\"><b>0<\/b><span>ganadas<\/span><\/div><div class=\"vcrm-stat\" data-stat=\"rate\"><b>0%<\/b><span>conversi\u00f3n<\/span><\/div><\/div><div class=\"vcrm-panel vcrm-journey\"><div class=\"vcrm-panel-inner\"><div class=\"vcrm-eyebrow\">RECORRIDO COMERCIAL<\/div><div class=\"vcrm-panel-header\"><div class=\"vcrm-heading\">De oportunidad a cierre<\/div><span class=\"vcrm-muted\">Selecciona una etapa para navegar<\/span><\/div><div class=\"vcrm-steps\" data-steps><\/div><\/div><\/div><div class=\"vcrm-panel\"><div class=\"vcrm-boardheader\"><div><div class=\"vcrm-eyebrow\">TABLERO DE OPORTUNIDADES<\/div><div class=\"vcrm-heading\">Conversaciones por etapa<\/div><\/div><div class=\"vcrm-arrows\"><small>Desliza para explorar las 6 etapas<\/small><button class=\"vcrm-arrow\" data-prev aria-label=\"Etapas anteriores\">\u2190<\/button><button class=\"vcrm-arrow\" data-next aria-label=\"Etapas siguientes\">\u2192<\/button><\/div><\/div><div class=\"vcrm-board-viewport\" data-viewport><div class=\"vcrm-board\" data-board><\/div><\/div><\/div><div class=\"vcrm-tip\">Demostraci\u00f3n \u00b7 Negocios, contactos y montos ficticios<\/div><\/section><\/main><\/div>\n<div class=\"vcrm-cursor\" data-cursor aria-hidden=\"true\"><svg viewBox=\"0 0 30 33\"><path d=\"M4 2V27L11 21L17 31L22 28L16 18L26 16Z\" fill=\"white\" stroke=\"#6655de\" stroke-width=\"2\" stroke-linejoin=\"round\"\/><\/svg><\/div><div class=\"vcrm-shade\" data-shade><\/div><div class=\"vcrm-drawer\" data-drawer><div class=\"vcrm-drawer-head\"><h3>Oportunidad comercial<\/h3><button class=\"vcrm-x\" data-close>\u2715<\/button><\/div><div data-detail><\/div><\/div><div class=\"vcrm-toast\" data-toast><\/div>\n<script>\n(()=>{const root=document.getElementById('svCRMDemo');if(!root||root.dataset.ready)return;root.dataset.ready='1';const $=s=>root.querySelector(s),$$=s=>[...root.querySelectorAll(s)];const stages=[{name:'Nuevo',desc:'Primer inter\u00e9s',color:'#7059cc',soft:'#f3f0ff'},{name:'Calificado',desc:'Necesidad validada',color:'#3385f6',soft:'#edf5ff'},{name:'Propuesta',desc:'Oferta enviada',color:'#e3a028',soft:'#fff7e9'},{name:'Negociaci\u00f3n',desc:'Decisi\u00f3n en curso',color:'#d56e36',soft:'#fff1e9'},{name:'Ganado',desc:'Conversi\u00f3n',color:'#2fa066',soft:'#edfaf5'},{name:'Perdido',desc:'No convertido',color:'#df4c73',soft:'#fff0f4'}];let deals=[{id:1,client:'M\u00f3nica Fuentes',company:'Lumen Caf\u00e9',service:'Atenci\u00f3n omnicanal',stage:0,amount:14800,agent:'Valeria Soto',source:'Instagram',email:'monica@example.com',date:'Hoy \u00b7 11:40',note:'Busca centralizar consultas de sucursales y preparar seguimiento comercial.'},{id:2,client:'Rodrigo Salas',company:'Norte Verde',service:'Automatizaciones de mensajes',stage:0,amount:22500,agent:'Iv\u00e1n Herrera',source:'WhatsApp',email:'rodrigo@example.com',date:'Ayer \u00b7 16:30',note:'Interesado en automatizar preguntas frecuentes y asignar conversaciones.'},{id:3,client:'Paula Rivera',company:'Casa Olivo',service:'Implementaci\u00f3n CRM',stage:1,amount:32400,agent:'Valeria Soto',source:'Messenger',email:'paula@example.com',date:'Hoy \u00b7 09:10',note:'Necesidad validada: pipeline, responsables y m\u00e9tricas de atenci\u00f3n.'},{id:4,client:'Diego Molina',company:'Arena Fit',service:'Agenda y reservas',stage:1,amount:18900,agent:'Julia R\u00edos',source:'Chat web',email:'diego@example.com',date:'Ayer \u00b7 13:20',note:'Solicita llevar las reservas desde conversaciones al calendario.'},{id:5,client:'Elena Campos',company:'\u00c1mbar Studio',service:'Agentes AI especializados',stage:2,amount:46500,agent:'Iv\u00e1n Herrera',source:'WhatsApp',email:'elena@example.com',date:'Martes \u00b7 12:50',note:'Propuesta de agente de atenci\u00f3n y agente de ventas.'},{id:6,client:'Samuel Vega',company:'Tierra Clara',service:'CRM + Inbox',stage:3,amount:38500,agent:'Julia R\u00edos',source:'Instagram',email:'samuel@example.com',date:'Mi\u00e9rcoles \u00b7 10:10',note:'El prospecto analiza alcance y condiciones de implementaci\u00f3n.'},{id:7,client:'Nadia Torres',company:'Punto Azul',service:'Bandeja omnicanal',stage:4,amount:27400,agent:'Valeria Soto',source:'WhatsApp',email:'nadia@example.com',date:'Lunes \u00b7 17:20',note:'Proyecto confirmado, pendiente acompa\u00f1amiento de arranque.'},{id:8,client:'H\u00e9ctor Vidal',company:'Ruta Nativa',service:'Seguimiento comercial',stage:5,amount:16900,agent:'Iv\u00e1n Herrera',source:'Facebook',email:'hector@example.com',date:'Viernes \u00b7 15:30',note:'Cerrado sin conversi\u00f3n. Posible revisi\u00f3n posterior.'}];let focused=1,selected=null,playing=true,timers=[],loop=null;const color=i=>stages[i].color;const money=n=>new Intl.NumberFormat('es-MX',{style:'currency',currency:'MXN',maximumFractionDigits:0}).format(n);function setToast(t){const el=$('[data-toast]');el.textContent=t;el.classList.add('on');setTimeout(()=>el.classList.remove('on'),1750)}function render(){const total=deals.length,won=deals.filter(d=>d.stage===4).length;const statValues=[String(total),String(won),Math.round(won\/Math.max(1,total)*100)+'%'];$$('.vcrm-stat').forEach((el,i)=>{if(el.querySelector('b').textContent!==statValues[i]){el.querySelector('b').textContent=statValues[i];el.classList.remove('flash');void el.offsetWidth;el.classList.add('flash')}});$('[data-steps]').innerHTML=stages.map((s,i)=>`<button class=\"vcrm-step ${focused===i?'current':''}\" data-jump=\"${i}\" style=\"--stage-color:${s.color}\"><i class=\"vcrm-stepstripe\"><\/i><span class=\"vcrm-steptext\"><b>${s.name}<\/b><small>${s.desc}<\/small><\/span><span class=\"vcrm-stepcount\">${deals.filter(d=>d.stage===i).length}<\/span><\/button>`).join('');$('[data-board]').innerHTML=stages.map((s,i)=>`<div class=\"vcrm-lane\" data-lane=\"${i}\" style=\"--stage-color:${s.color};--stage-soft:${s.soft}\"><div class=\"vcrm-lane-head\"><span class=\"vcrm-dot\"><\/span><div class=\"vcrm-lane-title\"><strong>${s.name}<\/strong><small>${s.desc}<\/small><\/div><span class=\"vcrm-lane-count\">${deals.filter(d=>d.stage===i).length}<\/span><\/div><div class=\"vcrm-lane-body\">${deals.filter(d=>d.stage===i).map(d=>`<article class=\"vcrm-deal\" tabindex=\"0\" role=\"button\" data-deal=\"${d.id}\" draggable=\"true\"><b>${d.client}<\/b><small>${d.company} \u00b7 ${d.service}<\/small><div class=\"vcrm-deal-bottom\"><span class=\"vcrm-deal-amount\">${money(d.amount)}<\/span><span class=\"vcrm-pill\">${d.source}<\/span><\/div><\/article>`).join('')||'<div class=\"vcrm-empty\">Sin oportunidades en esta etapa<\/div>'}<\/div><\/div>`).join('');}\nfunction jump(i){focused=Math.max(0,Math.min(5,i));$$('[data-jump]').forEach((b,j)=>b.classList.toggle('current',j===focused));const vp=$('[data-viewport]'),lane=$(`[data-lane=\"${focused}\"]`);if(lane)vp.scrollTo({left:lane.offsetLeft-$('[data-board]').offsetLeft,behavior:'smooth'});}function openDeal(id){const d=deals.find(x=>x.id===id);if(!d)return;selected=id;$('[data-detail]').innerHTML=`<div class=\"vcrm-detail-top\"><h4>${d.client}<\/h4><p>${d.company} \u00b7 ${d.service}<\/p><\/div><div class=\"vcrm-data\"><div><small>Contacto<\/small><b>${d.client}<\/b><\/div><div><small>Empresa<\/small><b>${d.company}<\/b><\/div><div><small>Responsable<\/small><b>${d.agent}<\/b><\/div><div><small>Origen<\/small><b>${d.source}<\/b><\/div><div><small>Actividad reciente<\/small><b>${d.date}<\/b><\/div><div><small>Correo ficticio<\/small><b>${d.email}<\/b><\/div><\/div><label class=\"vcrm-field\">Etapa del pipeline<select data-editstage>${stages.map((s,i)=>`<option value=\"${i}\" ${i===d.stage?'selected':''}>${s.name}<\/option>`).join('')}<\/select><\/label><label class=\"vcrm-field\">Valor estimado (MXN)<input data-editamount type=\"number\" min=\"0\" max=\"10000000\" value=\"${d.amount}\"><\/label><p class=\"vcrm-note\">${d.note}<\/p><button class=\"vcrm-save\" data-save>Guardar oportunidad<\/button>`;$('[data-shade]').classList.add('on');$('[data-drawer]').classList.add('on');}function closeDeal(){$('[data-shade]').classList.remove('on');$('[data-drawer]').classList.remove('on');}function changeDeal(id,stage,amount){const d=deals.find(x=>x.id===id);if(!d)return;d.stage=stage;if(Number.isFinite(amount))d.amount=amount;render();jump(stage);setToast('Oportunidad actualizada \u00b7 '+stages[stage].name)}function point(el,click=false){if(!el)return;const host=root.getBoundingClientRect(),r=el.getBoundingClientRect();const cur=$('[data-cursor]');cur.style.opacity='1';cur.style.transform=`translate(${r.left-host.left+r.width*.6}px,${r.top-host.top+r.height*.55}px)`;if(click){cur.classList.add('click');setTimeout(()=>cur.classList.remove('click'),250)}}function pause(){playing=false;stop();}function stop(){timers.forEach(clearTimeout);timers=[];if(loop)clearTimeout(loop);loop=null;}function wait(t,cb){timers.push(setTimeout(()=>{if(playing)cb()},t))}function reset(){closeDeal();deals.forEach((d,i)=>{d.stage=[0,0,1,1,2,3,4,5][i];d.amount=[14800,22500,32400,18900,46500,38500,27400,16900][i]});focused=1;render();jump(0)}function run(){stop();if(!playing)return;reset();wait(500,()=>point($('[data-jump=\"1\"]'),true));wait(950,()=>jump(1));wait(1650,()=>{point($('[data-deal=\"3\"]'),true);openDeal(3)});wait(2900,()=>{point($('[data-editstage]'),true);$('[data-editstage]').value='2'});wait(3650,()=>{point($('[data-save]'),true);changeDeal(3,2,32400);closeDeal()});wait(4700,()=>{point($('[data-next]'),true);jump(3)});wait(5500,()=>{point($('[data-deal=\"6\"]'),true);openDeal(6)});wait(6750,()=>{$('[data-editstage]').value='4';point($('[data-save]'),true);changeDeal(6,4,38500);closeDeal()});wait(7900,()=>{point($('[data-stat=\"won\"]'),true)});wait(8500,()=>{point($('[data-jump=\"5\"]'),true);jump(5)});wait(9500,()=>{point($('[data-jump=\"0\"]'),true);jump(0)});wait(10300,()=>{point($('[data-deal=\"1\"]'),true);openDeal(1)});wait(11350,()=>{point($('[data-close]'),true);closeDeal()});wait(12000,()=>{$('[data-cursor]').style.opacity='0'});loop=setTimeout(run,13300);}\nroot.addEventListener('click',e=>{const btn=e.target.closest('button,[data-deal]');if(!btn)return;if(!btn.matches('[data-close]'))pause();if(btn.matches('[data-jump]'))jump(+btn.dataset.jump);else if(btn.matches('[data-next]'))jump(Math.min(5,focused+1));else if(btn.matches('[data-prev]'))jump(Math.max(0,focused-1));else if(btn.matches('[data-deal]'))openDeal(+btn.dataset.deal);else if(btn.matches('[data-close]'))closeDeal();else if(btn.matches('[data-save]')){const d=deals.find(x=>x.id===selected);if(d)changeDeal(selected,+$('[data-editstage]').value,Number($('[data-editamount]').value));closeDeal()}else if(btn.matches('[data-ai]')){btn.classList.toggle('on');setToast(btn.classList.contains('on')?'AI activa en esta demostraci\u00f3n':'AI en pausa')}else if(btn.matches('[data-search]'))setToast('Selecciona una etapa o una oportunidad para explorar');});$('[data-shade]').addEventListener('click',closeDeal);root.addEventListener('keydown',e=>{if(e.key==='Escape')closeDeal();if((e.key==='Enter'||e.key===' ')&&e.target.matches('[data-deal]')){e.preventDefault();pause();openDeal(+e.target.dataset.deal)}});let drag=null;root.addEventListener('dragstart',e=>{const el=e.target.closest('[data-deal]');if(!el)return;pause();drag=+el.dataset.deal;e.dataTransfer.setData('text\/plain',String(drag))});root.addEventListener('dragover',e=>{if(e.target.closest('[data-lane]'))e.preventDefault()});root.addEventListener('drop',e=>{const lane=e.target.closest('[data-lane]');if(lane&&drag!=null){e.preventDefault();changeDeal(drag,+lane.dataset.lane,NaN);drag=null}});const reduced=window.matchMedia('(prefers-reduced-motion:reduce)').matches;render();if(reduced){playing=false;return}if('IntersectionObserver' in window){const io=new IntersectionObserver(entries=>{if(entries[0].isIntersecting){if(!playing)return;run()}else stop()},{threshold:.12});io.observe(root);}else run();document.addEventListener('visibilitychange',()=>{if(document.hidden)stop();else if(playing)run()});})();\n<\/script><\/div><\/body><\/html><\/template>\n<template id=\"vc8-approved-tasks\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}<\/style><\/head><body><!-- Vchat by StudioVainilla \u00b7 TAREAS \u00b7 Clon Animado V1 \u00b7 Datos 100% ficticios \u00b7 Fecha local din\u00e1mica -->\n<div id=\"svTaskDemo\" aria-label=\"Demostraci\u00f3n animada de Tareas de Vchat by StudioVainilla\">\n<style>\n#svTaskDemo{--v:#6556f5;--ink:#232744;--sub:#8991ae;--edge:#e0e5f5;--pale:#f6f8ff;position:relative;isolation:isolate;overflow:hidden;background:#f8fbff;color:var(--ink);font:14px\/1.45 Inter,system-ui,-apple-system,\"Segoe UI\",Arial,sans-serif!important;border:1px solid #e7eafb;box-shadow:0 20px 70px #1923471d;min-height:800px}\n#svTaskDemo *,#svTaskDemo *::before,#svTaskDemo *::after{box-sizing:border-box}\n#svTaskDemo button,#svTaskDemo input,#svTaskDemo textarea,#svTaskDemo select{font:inherit!important;letter-spacing:normal!important;text-transform:none!important}\n#svTaskDemo button{cursor:pointer}#svTaskDemo button:focus-visible,#svTaskDemo input:focus-visible{outline:2px solid #6959f4;outline-offset:2px}#svTaskDemo button:disabled{opacity:.45;cursor:default}\n#svTaskDemo h2,#svTaskDemo h3,#svTaskDemo p{margin:0!important;font-family:inherit!important;color:inherit}\n#svTaskDemo .vt-layout{display:grid;grid-template-columns:290px minmax(0,1fr);height:835px}\n#svTaskDemo .vt-side{min-width:0;background:#fff;border-right:1px solid #e9ecf6;padding:25px 13px 16px;overflow:auto;scrollbar-width:none}\n#svTaskDemo .vt-side::-webkit-scrollbar{display:none}\n#svTaskDemo .vt-brand{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f7;margin-bottom:14px;padding:0 5px 18px 7px;gap:9px}\n#svTaskDemo .vt-brand img{width:185px;height:57px;object-fit:contain;object-position:left center}\n#svTaskDemo .vt-back{border:1px solid #e0e6f5;background:#fff;color:#66799d;width:43px;height:43px;border-radius:14px;font-size:25px;line-height:1}\n#svTaskDemo .vt-nav-label{font-size:11px;letter-spacing:1.6px;font-weight:900;color:#8ea4c3;margin:16px 17px 12px}\n#svTaskDemo .vt-nav{display:grid;gap:3px}#svTaskDemo .vt-navitem{display:flex;align-items:center;gap:14px;min-height:42px;padding:0 14px;border:0;border-radius:12px;background:none;color:#607390;width:100%;font-weight:760;text-align:left;white-space:nowrap}\n#svTaskDemo .vt-navitem svg{width:19px;height:19px;flex:none;stroke-width:1.9}#svTaskDemo .vt-navitem:hover{background:#f7f7ff}#svTaskDemo .vt-navitem.active{color:#4d46de;background:#f0efff}#svTaskDemo .vt-navitem span{flex:1}\n#svTaskDemo .vt-numb{margin-left:auto;padding:3px 9px;border-radius:18px;background:linear-gradient(130deg,#7957fd,#328dfd);color:#fff;font-size:12px;font-weight:850;box-shadow:0 3px 8px #6557f54a}\n#svTaskDemo .vt-credit{margin-left:auto;background:#eaf0ff;color:#5f59de;padding:4px 9px;border-radius:20px;font-size:11px}\n#svTaskDemo .vt-main{display:flex;flex-direction:column;min-width:0;min-height:0;background:#f8fbff}\n#svTaskDemo .vt-top{height:74px;flex:0 0 74px;background:#fff;border-bottom:1px solid #e3e8f5;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}\n#svTaskDemo .vt-org{font-size:10px;font-weight:800;color:#8fa5c4;letter-spacing:.35px}#svTaskDemo .vt-pagetitle{color:#151b32;font-weight:860;font-size:17px}\n#svTaskDemo .vt-tools{display:flex;align-items:center;gap:10px}#svTaskDemo .vt-tool{min-width:49px;height:48px;background:#fff;border:1px solid #e0e5f5;border-radius:17px;display:flex;align-items:center;justify-content:center;gap:9px;color:#6054da;font-weight:850;padding:0 13px}#svTaskDemo .vt-tool svg{width:20px;height:20px}#svTaskDemo .vt-ai{background:#fbfaff;color:#847b9e;border-color:#dbd5ff}#svTaskDemo .vt-ai.on{color:#6450d9}#svTaskDemo .vt-star{padding:4px 6px;background:linear-gradient(135deg,#8060ff,#30a7f5);color:#fff;border-radius:9px}\n#svTaskDemo .vt-switch{position:relative;width:35px;height:20px;border-radius:20px;background:#d7d5e8}#svTaskDemo .vt-switch:before{content:\"\";position:absolute;width:15px;height:15px;top:2.5px;left:3px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #45456c44;transition:transform .25s}#svTaskDemo .vt-ai.on .vt-switch{background:#6059ff}#svTaskDemo .vt-ai.on .vt-switch:before{transform:translateX(14px)}\n#svTaskDemo .vt-scroll{overflow:auto;min-height:0;padding:20px 34px 34px;scrollbar-width:thin;scrollbar-color:#ccd3e9 transparent}\n#svTaskDemo .vt-headingband{width:min(500px,100%);padding:9px 13px;margin-bottom:10px;border:1px solid #dfe4ff;border-radius:99px;background:#f0f3ff;color:#8171e3;font-size:10px;letter-spacing:2px;font-weight:950}\n#svTaskDemo .vt-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 26px}#svTaskDemo .vt-title{font-size:clamp(26px,3.1vw,39px);line-height:1.13;color:#222541;font-weight:930;letter-spacing:-1.4px}#svTaskDemo .vt-desc{font-size:12px;color:#8991ae;margin-top:10px!important}\n#svTaskDemo .vt-primary{min-height:54px;padding:0 21px;border:1px solid #a69dff;background:#5e57ee;color:#fff;font-size:13px;font-weight:860;border-radius:16px;white-space:nowrap;box-shadow:0 4px 0 #cdc9ff,0 12px 25px #6358fc24;transition:transform .2s,box-shadow .2s}#svTaskDemo .vt-primary:hover{transform:translateY(-2px)}\n#svTaskDemo .vt-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}\n#svTaskDemo .vt-stat{position:relative;min-width:0;min-height:157px;padding:25px 23px;background:#fff;border:1px solid #e0e5f5;border-bottom:4px solid var(--accent);border-radius:22px;box-shadow:0 12px 36px #283d7110;transition:transform .3s,box-shadow .3s}#svTaskDemo .vt-stat:hover,#svTaskDemo .vt-stat.pulse{transform:translateY(-3px);box-shadow:0 18px 34px #4d57b825}\n#svTaskDemo .vt-statlabel{color:#838aab;font-size:12px;font-weight:800}#svTaskDemo .vt-statnum{font-size:35px;font-weight:930;margin-top:7px;color:#222541;line-height:1.2}#svTaskDemo .vt-statnote{color:#a2a8c1;font-size:10px;font-weight:750;margin-top:7px}#svTaskDemo .vt-staticon{position:absolute;right:19px;top:19px;width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:var(--tint);color:var(--accent)}#svTaskDemo .vt-staticon svg{width:22px;height:22px}\n#svTaskDemo .vt-filters{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:20px;padding:21px 23px;background:#fff;border:1px solid #e0e6f5;border-radius:23px;box-shadow:0 12px 33px #2c3a6b0d;margin-bottom:26px}\n#svTaskDemo .vt-smalltitle{color:#848aa6;font-size:11px;font-weight:850;letter-spacing:.45px;margin-bottom:8px}#svTaskDemo .vt-inputwrap{height:52px;border:1px solid #dfe4f4;background:#fafbff;border-radius:14px;display:flex;align-items:center;gap:12px;padding:0 14px;color:#6457eb}#svTaskDemo .vt-inputwrap svg{width:19px;height:19px;flex:none}#svTaskDemo .vt-inputwrap input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:#282a49;font-size:14px}#svTaskDemo .vt-inputwrap input::placeholder{color:#9ba4c5}\n#svTaskDemo .vt-tabs{display:flex;gap:4px;background:#f3f3fb;padding:6px;border:1px solid #e4e7f5;border-radius:15px;min-height:52px}#svTaskDemo .vt-tab{flex:1;border:0;background:none;border-radius:11px;padding:7px 8px;white-space:nowrap;color:#8189a7;font-size:11px;font-weight:780;transition:.2s}#svTaskDemo .vt-tab.active{background:#fff;color:#564ce0;box-shadow:0 2px 8px #25325b13}\n#svTaskDemo .vt-listtop{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 4px 14px}#svTaskDemo .vt-eyebrow{color:#6559f5;letter-spacing:1.4px;font-size:11px;font-weight:950;margin-bottom:4px}#svTaskDemo .vt-sectiontitle{font-size:20px;font-weight:890;color:#252844}#svTaskDemo .vt-hint{font-size:10px;color:#9ba1b9}\n#svTaskDemo .vt-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#svTaskDemo .vt-card{position:relative;min-width:0;padding:22px 23px 20px;border:1px solid #e1e6f3;border-left:4px solid var(--bar);border-radius:21px;background:#fff;box-shadow:0 12px 35px #293a710d;min-height:272px;transition:transform .35s,box-shadow .35s,border-color .35s}#svTaskDemo .vt-card:hover,#svTaskDemo .vt-card.vt-highlight{transform:translateY(-3px);box-shadow:0 19px 42px #474f9b25;border-color:#bab5ff}#svTaskDemo .vt-cardtop{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:15px}#svTaskDemo .vt-priority{padding:9px 12px;font-size:11px;font-weight:850;border-radius:11px}#svTaskDemo .vt-priority.alta{background:#fff3db;color:#99651e}#svTaskDemo .vt-priority.normal{background:#f2f0f9;color:#777393}#svTaskDemo .vt-priority.urgente{background:#fff0f0;color:#d45167}#svTaskDemo .vt-status{border:1px solid #dfd8ff;background:#f6f4ff;color:#5f56be;border-radius:11px;min-height:36px;padding:0 12px;font-weight:870;font-size:13px}#svTaskDemo .vt-status.completada{background:#eaf8f1;border-color:#c9ebd7;color:#258460}#svTaskDemo .vt-status.en-curso{background:#eef7ff;border-color:#cfe8ff;color:#287ac6}#svTaskDemo .vt-status.vencida{background:#fff2f2;border-color:#ffd3db;color:#cc5366}\n#svTaskDemo .vt-cardtitle{font-size:19px;font-weight:900;letter-spacing:-.5px;line-height:1.24;color:#292a49;margin-bottom:7px}#svTaskDemo .vt-carddesc{font-size:12px;color:#8e96b2;min-height:30px}#svTaskDemo .vt-cardgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}#svTaskDemo .vt-label{font-size:9.5px;font-weight:850;color:#9ba1b7;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}#svTaskDemo .vt-cardtext{font-size:12px;color:#5e5bba;font-weight:800}#svTaskDemo .vt-owner{display:flex;align-items:center;gap:10px;color:#4f5678;font-size:12px;font-weight:800}#svTaskDemo .vt-avatar{width:32px;height:32px;display:grid;place-items:center;background:#eeecff;border-radius:11px;color:#655af6;font-size:12px;font-weight:860}#svTaskDemo .vt-datezone{display:flex;justify-content:space-between;gap:8px;align-items:end;margin-top:16px}#svTaskDemo .vt-deadline{font-size:12px;color:#333858;font-weight:800}#svTaskDemo .vt-datezone .vt-label{margin-bottom:4px}#svTaskDemo .vt-actions{display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap}#svTaskDemo .vt-action{border:1px solid #dce1f4;border-radius:11px;background:#fff;color:#5a55bf;min-height:36px;padding:0 12px;font-weight:820;font-size:11px}#svTaskDemo .vt-action.main{border-color:#6559f4;background:#6559f4;color:#fff}#svTaskDemo .vt-action.danger{border-color:#ffd3db;color:#d5546d;background:#fffafc}#svTaskDemo .vt-empty{grid-column:1\/-1;padding:46px 12px;text-align:center;background:#fff;border:1px dashed #c7cef0;border-radius:20px;color:#818ca8}\n#svTaskDemo .vt-toast{position:absolute;z-index:30;right:26px;bottom:25px;padding:13px 17px;background:#202b52;color:#fff;border:1px solid #6e75c2;border-radius:14px;box-shadow:0 15px 40px #171b4c42;font-size:12px;font-weight:750;opacity:0;transform:translateY(15px);transition:opacity .28s,transform .28s;pointer-events:none}#svTaskDemo .vt-toast.show{opacity:1;transform:none}\n#svTaskDemo .vt-overlay{position:absolute;inset:0;background:#13183276;z-index:20;display:none;align-items:center;justify-content:center;padding:16px}#svTaskDemo .vt-overlay.show{display:flex}#svTaskDemo .vt-modal{width:min(560px,100%);max-height:90%;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 35px 90px #11163455;padding:26px 28px}#svTaskDemo .vt-modalhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}#svTaskDemo .vt-modaltitle{font-size:22px;font-weight:890;color:#222641}#svTaskDemo .vt-close{border:1px solid #dfe2f0;background:#fff;width:37px;height:37px;border-radius:11px;color:#616382;font-size:21px}#svTaskDemo .vt-form{display:grid;gap:12px}#svTaskDemo .vt-form label{font-size:11px;font-weight:840;color:#6c7896;display:block;margin-bottom:5px}#svTaskDemo .vt-form input,#svTaskDemo .vt-form select,#svTaskDemo .vt-form textarea{width:100%;border:1px solid #dfe5f4;border-radius:12px;background:#fafbff;color:#232744;padding:11px 12px;outline:0}#svTaskDemo .vt-form textarea{resize:vertical;min-height:72px}#svTaskDemo .vt-formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}#svTaskDemo .vt-modalbuttons{display:flex;justify-content:flex-end;gap:9px;margin-top:10px}\n#svTaskDemo .vt-pointer{position:absolute;z-index:25;left:0;top:0;width:21px;height:24px;pointer-events:none;opacity:0;filter:drop-shadow(0 3px 2px #2b287b55);transform:translate(-60px,-60px);transition:transform .52s cubic-bezier(.22,.8,.2,1),opacity .25s}#svTaskDemo .vt-pointer.visible{opacity:1}#svTaskDemo .vt-pointer svg{width:22px;height:25px;fill:white;stroke:#6556e9;stroke-width:2}#svTaskDemo .vt-click{position:absolute;z-index:24;pointer-events:none;width:42px;height:42px;border:2px solid #7868f9;border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.3)}#svTaskDemo .vt-click.active{animation:vtRipple .5s ease-out both}@keyframes vtRipple{0%{opacity:.9;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}\n#svTaskDemo .vt-live{display:flex;align-items:center;gap:6px;color:#848baa;font-size:10px;font-weight:750;margin-top:10px}#svTaskDemo .vt-livedot{width:6px;height:6px;background:#27b781;border-radius:50%}\n@media(max-width:1100px){#svTaskDemo .vt-layout{grid-template-columns:235px minmax(0,1fr)}#svTaskDemo .vt-side{padding-left:8px;padding-right:8px}#svTaskDemo .vt-brand img{width:150px}#svTaskDemo .vt-scroll{padding:18px 20px}#svTaskDemo .vt-stats{gap:8px}#svTaskDemo .vt-stat{padding:19px 13px}#svTaskDemo .vt-staticon{right:10px;top:12px}#svTaskDemo .vt-cards{gap:11px}#svTaskDemo .vt-card{padding:19px 15px}}\n@media(max-width:780px){#svTaskDemo{min-height:670px}#svTaskDemo .vt-layout{grid-template-columns:62px minmax(0,1fr);height:720px}#svTaskDemo .vt-side{padding:12px 6px}#svTaskDemo .vt-brand{padding:0 0 9px;justify-content:center}#svTaskDemo .vt-brand img,#svTaskDemo .vt-back,#svTaskDemo .vt-nav-label,#svTaskDemo .vt-navitem span,#svTaskDemo .vt-numb,#svTaskDemo .vt-credit{display:none}#svTaskDemo .vt-navitem{justify-content:center;padding:0}#svTaskDemo .vt-top{padding:0 12px;height:62px;flex-basis:62px}#svTaskDemo .vt-tools{gap:5px}#svTaskDemo .vt-tool{height:37px;min-width:36px;border-radius:12px;padding:0 8px}#svTaskDemo .vt-tool svg{width:17px;height:17px}#svTaskDemo .vt-org{font-size:8px}#svTaskDemo .vt-pagetitle{font-size:14px}#svTaskDemo .vt-scroll{padding:15px 12px}#svTaskDemo .vt-intro{margin-bottom:17px}#svTaskDemo .vt-title{font-size:clamp(23px,4vw,33px);letter-spacing:-.7px}#svTaskDemo .vt-desc{font-size:11px}#svTaskDemo .vt-primary{font-size:11px;min-height:44px;padding:0 12px;border-radius:12px}#svTaskDemo .vt-stats{grid-template-columns:repeat(2,minmax(0,1fr))}#svTaskDemo .vt-stat{min-height:105px}#svTaskDemo .vt-statnum{font-size:26px}#svTaskDemo .vt-staticon{width:32px;height:32px}#svTaskDemo .vt-filters{grid-template-columns:1fr;gap:12px;padding:15px}#svTaskDemo .vt-tabs{overflow:auto}#svTaskDemo .vt-tab{flex:0 0 auto;min-width:77px}#svTaskDemo .vt-cards{grid-template-columns:1fr}#svTaskDemo .vt-pointer{display:none}}\n@media(max-width:430px){#svTaskDemo .vt-layout{grid-template-columns:49px minmax(0,1fr);height:700px}#svTaskDemo .vt-navitem svg{width:17px}#svTaskDemo .vt-topbuttons{display:flex}#svTaskDemo .vt-tool.vt-extra{display:none}#svTaskDemo .vt-headingband{padding:6px 9px;font-size:8px}#svTaskDemo .vt-title{font-size:26px}#svTaskDemo .vt-intro{align-items:end}#svTaskDemo .vt-desc{font-size:10px}#svTaskDemo .vt-stat{padding:16px 12px}#svTaskDemo .vt-statlabel{font-size:10px}#svTaskDemo .vt-listtop{align-items:start}#svTaskDemo .vt-hint{display:none}#svTaskDemo .vt-card{padding:15px}#svTaskDemo .vt-cardtitle{font-size:17px}#svTaskDemo .vt-modal{padding:17px}#svTaskDemo .vt-formgrid{grid-template-columns:1fr}}\n@media(prefers-reduced-motion:reduce){#svTaskDemo *,#svTaskDemo *::before,#svTaskDemo *::after{animation:none!important;transition:none!important}#svTaskDemo .vt-pointer{display:none}}\n<\/style>\n<div class=\"vt-layout\">\n<aside class=\"vt-side\" aria-label=\"Navegaci\u00f3n de demostraci\u00f3n\">\n <div class=\"vt-brand\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\"><button class=\"vt-back\" type=\"button\" aria-label=\"Contraer men\u00fa\">\u2039<\/button><\/div>\n <div class=\"vt-nav-label\">TRABAJO<\/div><nav class=\"vt-nav\" id=\"vt-worknav\"><\/nav>\n <div class=\"vt-nav-label\">HERRAMIENTAS<\/div><nav class=\"vt-nav\" id=\"vt-toolsnav\"><\/nav>\n <div class=\"vt-nav-label\">INSIGHTS<\/div><nav class=\"vt-nav\" id=\"vt-insightsnav\"><\/nav>\n<\/aside>\n<div class=\"vt-main\">\n <header class=\"vt-top\"><div><div class=\"vt-org\">Estudio Horizonte \u00b7 Demo<\/div><div class=\"vt-pagetitle\">Tareas<\/div><\/div><div class=\"vt-tools\"><button class=\"vt-tool\" type=\"button\" aria-label=\"Idioma\">\ud83c\uddf2\ud83c\uddfd <strong>ES<\/strong><\/button><button class=\"vt-tool vt-ai on\" type=\"button\" id=\"vt-ai-btn\"><span class=\"vt-star\">\u2726<\/span><strong>AI<\/strong><span class=\"vt-switch\"><\/span><\/button><button class=\"vt-tool vt-extra\" type=\"button\" aria-label=\"B\u00fasqueda\" id=\"vt-topsearch\" data-icon=\"search\"><\/button><button class=\"vt-tool vt-extra\" type=\"button\" aria-label=\"Recursos\" data-icon=\"message\"><\/button><button class=\"vt-tool vt-extra\" type=\"button\" aria-label=\"Notificaciones\" data-icon=\"diamond\"><\/button><\/div><\/header>\n <div class=\"vt-scroll\" id=\"vt-scroll\">\n  <div class=\"vt-headingband\">CENTRO DE TAREAS<\/div>\n  <div class=\"vt-intro\"><div><h2 class=\"vt-title\">Seguimientos y pendientes<\/h2><p class=\"vt-desc\">Una vista clara de lo que necesita atenci\u00f3n, qui\u00e9n es responsable y qu\u00e9 sigue.<\/p><\/div><button class=\"vt-primary\" id=\"vt-new\" type=\"button\">\uff0b Nueva tarea<\/button><\/div>\n  <div class=\"vt-stats\" id=\"vt-stats\"><\/div>\n  <div class=\"vt-filters\"><div><div class=\"vt-smalltitle\">Buscar seguimiento<\/div><label class=\"vt-inputwrap\"><span data-icon=\"search\"><\/span><input id=\"vt-search\" type=\"search\" placeholder=\"Tarea, contacto, responsable o descripci\u00f3n\" autocomplete=\"off\"><\/label><\/div><div><div class=\"vt-smalltitle\">Filtrar por estado<\/div><div class=\"vt-tabs\" id=\"vt-tabs\"><\/div><\/div><\/div>\n  <div class=\"vt-listtop\"><div><div class=\"vt-eyebrow\">SEGUIMIENTO DEL EQUIPO<\/div><h3 class=\"vt-sectiontitle\">Tareas y pr\u00f3ximas acciones<\/h3><\/div><span class=\"vt-hint\">Cambia su estado o abre una tarea para editarla.<\/span><\/div>\n  <div class=\"vt-cards\" id=\"vt-cards\"><\/div><div class=\"vt-live\"><span class=\"vt-livedot\"><\/span> Fechas de demostraci\u00f3n ajustadas autom\u00e1ticamente al d\u00eda de hoy<\/div>\n <\/div>\n<\/div><\/div>\n<div class=\"vt-overlay\" id=\"vt-overlay\"><div class=\"vt-modal\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"vt-modaltitle\"><div class=\"vt-modalhead\"><div class=\"vt-modaltitle\" id=\"vt-modaltitle\">Editar tarea<\/div><button type=\"button\" class=\"vt-close\" id=\"vt-close\" aria-label=\"Cerrar\">\u00d7<\/button><\/div><form id=\"vt-form\" class=\"vt-form\"><div><label for=\"vt-tasktitle\">Nombre de la tarea<\/label><input id=\"vt-tasktitle\" required maxlength=\"100\"><\/div><div><label for=\"vt-taskdesc\">Descripci\u00f3n<\/label><textarea id=\"vt-taskdesc\" maxlength=\"240\"><\/textarea><\/div><div class=\"vt-formgrid\"><div><label for=\"vt-taskwho\">Contacto relacionado<\/label><input id=\"vt-taskwho\" maxlength=\"70\"><\/div><div><label for=\"vt-taskowner\">Responsable<\/label><select id=\"vt-taskowner\"><option>Valeria Torres<\/option><option>Andr\u00e9s Molina<\/option><option>Camila Duarte<\/option><option>Diego Salas<\/option><\/select><\/div><\/div><div class=\"vt-formgrid\"><div><label for=\"vt-taskdate\">Fecha l\u00edmite<\/label><input id=\"vt-taskdate\" type=\"datetime-local\" required><\/div><div><label for=\"vt-taskpriority\">Prioridad<\/label><select id=\"vt-taskpriority\"><option>Alta<\/option><option>Normal<\/option><option>Urgente<\/option><\/select><\/div><\/div><div class=\"vt-formgrid\"><div><label for=\"vt-taskstatus\">Estado<\/label><select id=\"vt-taskstatus\"><option>Pendiente<\/option><option>En curso<\/option><option>Completada<\/option><option>Vencida<\/option><\/select><\/div><div><label>Vista de demostraci\u00f3n<\/label><div style=\"padding:11px;color:#7f89a9;font-size:11px;background:#f5f6ff;border-radius:11px\">Los cambios se aplican solo en esta p\u00e1gina.<\/div><\/div><\/div><div class=\"vt-modalbuttons\"><button type=\"button\" class=\"vt-action\" id=\"vt-cancel\">Cancelar<\/button><button type=\"submit\" class=\"vt-primary\">Guardar tarea<\/button><\/div><\/form><\/div><\/div>\n<div class=\"vt-toast\" id=\"vt-toast\" role=\"status\" aria-live=\"polite\"><\/div><div class=\"vt-click\" id=\"vt-click\"><\/div><div class=\"vt-pointer\" id=\"vt-pointer\" aria-hidden=\"true\"><svg viewBox=\"0 0 25 29\"><path d=\"M3 2v22l6-7 5 10 4-2-5-10h10L3 2Z\"\/><\/svg><\/div>\n<script>\n(function(){\nconst root=document.getElementById('svTaskDemo');if(!root||root.dataset.loaded)return;root.dataset.loaded='1';\nconst $=(s,scope=root)=>scope.querySelector(s),$$=(s,scope=root)=>Array.from(scope.querySelectorAll(s));\nconst paths={home:'M3 11 12 3l9 8M5 10v11h14V10M9 21v-7h6v7',inbox:'M3 4h18v14H8l-5 3V4z',contact:'M20 21v-2a6 6 0 0 0-12 0v2M14 7a4 4 0 1 1-8 0 4 4 0 0 1 8 0',crm:'M4 5h16l-6 7v6l-4 2v-8L4 5z',tasks:'M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20ZM8 12l3 3 5-6',agenda:'M3 6h18v15H3zM7 3v6M17 3v6M3 11h18',bolt:'M13 2 4 13h7l-1 9 10-12h-7l0-8z',message:'M3 5h18v13H8l-5 3zM7 9h10M7 13h8',book:'M3 4h8a4 4 0 0 1 2 2 4 4 0 0 1 2-2h6v16h-6a4 4 0 0 0-2 2 4 4 0 0 0-2-2H3z',box:'M12 2 3 7v10l9 5 9-5V7zM3 7l9 5 9-5M12 12v10',sparkle:'m12 2 2.6 7.4L22 12l-7.4 2.6L12 22l-2.6-7.4L2 12l7.4-2.6z',coins:'M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20ZM15 8c-1-2-6-2-6 1s6 2 6 5-5 4-6 1M12 5v14',chart:'M3 20 9 13l4 3 8-11M15 5h6v6',search:'M11 19a8 8 0 1 0 0-16 8 8 0 0 0 0 16Zm6-2 5 5',diamond:'M12 2 3 12l9 10 9-10-9-10z',clock:'M12 22a10 10 0 1 0 0-20 10 10 0 0 0 0 20ZM12 6v7l5 3',refresh:'M20 7V3l-4 4M4 17v4l4-4M4 10a8 8 0 0 1 14-4l2 1M20 14a8 8 0 0 1-14 4l-2-1',warning:'M12 3 2 21h20L12 3zM12 9v5M12 18h.01',check:'M20 6 9 17l-5-5'};\nfunction icon(name){return `<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"${paths[name]||paths.sparkle}\"\/><\/svg>`}\nconst nav=[['Inicio','home'],['Inbox','inbox','6'],['Contactos','contact'],['CRM','crm'],['Tareas','tasks'],['Agenda','agenda']],tools=[['Automatizaciones','bolt'],['Respuestas y recursos','message'],['Conocimiento AI','book'],['Productos y servicios','box'],['Agentes AI','sparkle'],['Cr\u00e9ditos AI','coins','24,500']];\nfunction navDraw(arr,id){$(id).innerHTML=arr.map(([name,glyph,count])=>`<button type=\"button\" class=\"vt-navitem ${name==='Tareas'?'active':''}\" data-nav=\"${name}\" title=\"${name}\">${icon(glyph)}<span>${name}<\/span>${count?`<b class=\"${name==='Cr\u00e9ditos AI'?'vt-credit':'vt-numb'}\">${count}<\/b>`:''}<\/button>`).join('')}\nnavDraw(nav,'#vt-worknav');navDraw(tools,'#vt-toolsnav');navDraw([['Anal\u00edtica','chart']],'#vt-insightsnav');$$('[data-icon]').forEach(el=>el.innerHTML=icon(el.dataset.icon));\nconst addDays=(offset,hour=15,minute=30)=>{const d=new Date();d.setHours(hour,minute,0,0);d.setDate(d.getDate()+offset);return d};\nlet tasks=[\n{id:1,title:'Enviar propuesta de identidad visual',desc:'Compartir la propuesta final y confirmar observaciones del cliente.',who:'Elena R\u00edos \u00b7 Estudio Roble',owner:'Valeria Torres',priority:'Alta',status:'Pendiente',due:addDays(3,17,0)},\n{id:2,title:'Confirmar fecha de demostraci\u00f3n',desc:'Validar agenda para presentar el proyecto y resolver preguntas.',who:'Tom\u00e1s M\u00e9ndez \u00b7 Ruta Norte',owner:'Andr\u00e9s Molina',priority:'Normal',status:'Completada',due:addDays(-1,11,0)},\n{id:3,title:'Revisar materiales del lanzamiento',desc:'Verificar fotograf\u00edas, textos y enlaces antes de su publicaci\u00f3n.',who:'Renata Salcedo \u00b7 Casa Brisa',owner:'Camila Duarte',priority:'Alta',status:'En curso',due:addDays(2,12,30)},\n{id:4,title:'Dar seguimiento a cotizaci\u00f3n',desc:'Preguntar si hace falta informaci\u00f3n adicional para decidir.',who:'Hugo Villar \u00b7 Nube Verde',owner:'Diego Salas',priority:'Normal',status:'Pendiente',due:addDays(5,10,0)},\n{id:5,title:'Actualizar brief de contenidos',desc:'Reunir cambios recibidos y compartir una nueva versi\u00f3n.',who:'Paola Reyes \u00b7 Mercado \u00c1mbar',owner:'Valeria Torres',priority:'Urgente',status:'Vencida',due:addDays(-2,16,0)},\n{id:6,title:'Preparar resumen de resultados',desc:'Organizar los indicadores y hallazgos de la \u00faltima campa\u00f1a.',who:'Marina Le\u00f3n \u00b7 Faro Local',owner:'Camila Duarte',priority:'Normal',status:'Completada',due:addDays(-3,9,0)}\n];\nconst fmt=d=>new Intl.DateTimeFormat('es-MX',{day:'numeric',month:'short',year:'numeric',hour:'numeric',minute:'2-digit',hour12:true}).format(d);\nconst localDate=d=>{let q=n=>String(n).padStart(2,'0');return `${d.getFullYear()}-${q(d.getMonth()+1)}-${q(d.getDate())}T${q(d.getHours())}:${q(d.getMinutes())}`};\nconst esc=s=>String(s??'').replace(\/[&<>\"']\/g,c=>({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[c]));\nlet filter='Todas',term='',currentId=null,nextId=7,aiOn=true,manualPauseUntil=0,visible=true,runToken=0;\nfunction counts(){return {Pendientes:tasks.filter(t=>t.status==='Pendiente').length,'En curso':tasks.filter(t=>t.status==='En curso').length,Vencidas:tasks.filter(t=>t.status==='Vencida').length,Completadas:tasks.filter(t=>t.status==='Completada').length}}\nconst styles=[['Pendientes','clock','#6e60ff','#f1efff','Por iniciar'],['En curso','refresh','#318cf4','#eaf4ff','En seguimiento'],['Vencidas','warning','#f06d7c','#fff0f1','Requieren atenci\u00f3n'],['Completadas','check','#25a478','#eaf8f2','Hist\u00f3rico visible']];\nfunction drawStats(){let c=counts();$('#vt-stats').innerHTML=styles.map(([name,glyph,color,tint,description])=>`<div class=\"vt-stat\" style=\"--accent:${color};--tint:${tint}\" data-stat=\"${name}\"><div class=\"vt-statlabel\">${name}<\/div><div class=\"vt-statnum\">${c[name]}<\/div><div class=\"vt-statnote\">${description}<\/div><div class=\"vt-staticon\">${icon(glyph)}<\/div><\/div>`).join('')}\nfunction drawTabs(){let ts=['Todas','Pendientes','En curso','Vencidas','Completadas'];$('#vt-tabs').innerHTML=ts.map(t=>`<button type=\"button\" class=\"vt-tab ${filter===t?'active':''}\" data-filter=\"${t}\">${t}<\/button>`).join('')}\nfunction card(t){let color=t.status==='Completada'?'#21a878':t.status==='En curso'?'#328bf3':t.status==='Vencida'?'#e66a7b':'#6a5bf9';let p=t.priority.toLowerCase();return `<article class=\"vt-card\" data-id=\"${t.id}\" style=\"--bar:${color}\"><div class=\"vt-cardtop\"><span class=\"vt-priority ${p}\">${esc(t.priority)}<\/span><button type=\"button\" class=\"vt-status ${t.status.toLowerCase().replace(' ','-')}\" data-cycle=\"${t.id}\" title=\"Cambiar estado\">${esc(t.status)}\u2304<\/button><\/div><div class=\"vt-cardtitle\">${esc(t.title)}<\/div><div class=\"vt-carddesc\">${esc(t.desc)}<\/div><div class=\"vt-cardgrid\"><div><div class=\"vt-label\">Relacionado con<\/div><div class=\"vt-cardtext\">${esc(t.who)}<\/div><\/div><div><div class=\"vt-label\">Responsable<\/div><div class=\"vt-owner\"><span class=\"vt-avatar\">${esc(t.owner.charAt(0))}<\/span>${esc(t.owner)}<\/div><\/div><\/div><div class=\"vt-datezone\"><div><div class=\"vt-label\">Fecha l\u00edmite<\/div><div class=\"vt-deadline\">${fmt(t.due)}<\/div><\/div><\/div><div class=\"vt-actions\"><button type=\"button\" class=\"vt-action\" data-edit=\"${t.id}\">Editar<\/button><button type=\"button\" class=\"vt-action main\" data-done=\"${t.id}\">${t.status==='Completada'?'Reabrir':'Completar'}<\/button><button type=\"button\" class=\"vt-action danger\" data-delete=\"${t.id}\">Eliminar<\/button><\/div><\/article>`}\nfunction drawCards(){let list=tasks.filter(t=>{let matches=filter==='Todas'||(filter==='Pendientes'?t.status==='Pendiente':filter==='Vencidas'?t.status==='Vencida':filter===t.status);return matches&&`${t.title} ${t.desc} ${t.who} ${t.owner}`.toLocaleLowerCase('es').includes(term.toLocaleLowerCase('es'))});$('#vt-cards').innerHTML=list.length?list.map(card).join(''):'<div class=\"vt-empty\">No hay tareas que coincidan con esta b\u00fasqueda.<\/div>'}\nfunction draw(){drawStats();drawTabs();drawCards()}\nfunction toast(msg){let el=$('#vt-toast');el.textContent=msg;el.classList.add('show');clearTimeout(el._hide);el._hide=setTimeout(()=>el.classList.remove('show'),2600)}\nfunction pause(ms=9500){manualPauseUntil=Date.now()+ms;runToken++}function setFilter(f,fromAuto=false){if(!fromAuto)pause();filter=f;drawTabs();drawCards()}\nfunction change(id,status,silent=false){let t=tasks.find(x=>x.id===id);if(!t)return;t.status=status;draw();if(!silent)toast('Estado actualizado en la demostraci\u00f3n')}\nfunction edit(id){pause();currentId=id;let t=tasks.find(x=>x.id===id);$('#vt-modaltitle').textContent=t?'Editar tarea':'Nueva tarea';$('#vt-tasktitle').value=t?t.title:'';$('#vt-taskdesc').value=t?t.desc:'';$('#vt-taskwho').value=t?t.who:'';$('#vt-taskowner').value=t?t.owner:'Valeria Torres';$('#vt-taskdate').value=localDate(t?t.due:addDays(4));$('#vt-taskpriority').value=t?t.priority:'Normal';$('#vt-taskstatus').value=t?t.status:'Pendiente';$('#vt-overlay').classList.add('show');$('#vt-tasktitle').focus()}\nfunction closeModal(){$('#vt-overlay').classList.remove('show');currentId=null}\n$('#vt-new').addEventListener('click',()=>edit(null));$('#vt-close').addEventListener('click',closeModal);$('#vt-cancel').addEventListener('click',closeModal);$('#vt-overlay').addEventListener('click',e=>{if(e.target===$('#vt-overlay'))closeModal()});\n$('#vt-form').addEventListener('submit',e=>{e.preventDefault();const val={title:$('#vt-tasktitle').value.trim(),desc:$('#vt-taskdesc').value.trim(),who:$('#vt-taskwho').value.trim(),owner:$('#vt-taskowner').value,priority:$('#vt-taskpriority').value,status:$('#vt-taskstatus').value,due:new Date($('#vt-taskdate').value)};if(!val.title||!Number.isFinite(val.due.getTime()))return;if(currentId){Object.assign(tasks.find(t=>t.id===currentId),val)}else tasks.unshift({id:nextId++,...val});closeModal();filter='Todas';term='';$('#vt-search').value='';draw();toast('Tarea guardada (solo demostraci\u00f3n)')});\n$('#vt-search').addEventListener('input',e=>{pause();term=e.target.value;drawCards()});$('#vt-topsearch').addEventListener('click',()=>{$('#vt-search').focus();$('#vt-search').scrollIntoView({block:'nearest',behavior:'smooth'})});\n$('#vt-tabs').addEventListener('click',e=>{let b=e.target.closest('[data-filter]');if(b)setFilter(b.dataset.filter)});\n$('#vt-cards').addEventListener('click',e=>{let b=e.target.closest('[data-edit],[data-done],[data-cycle],[data-delete]');if(!b)return;pause();let id=+(b.dataset.edit||b.dataset.done||b.dataset.cycle||b.dataset.delete);if(b.hasAttribute('data-edit'))edit(id);else if(b.hasAttribute('data-done')){let t=tasks.find(x=>x.id===id);if(t)change(id,t.status==='Completada'?'Pendiente':'Completada')}else if(b.hasAttribute('data-cycle')){let t=tasks.find(x=>x.id===id);if(t){let all=['Pendiente','En curso','Completada','Vencida'];change(id,all[(all.indexOf(t.status)+1)%all.length])}}else if(b.hasAttribute('data-delete')){tasks=tasks.filter(x=>x.id!==id);draw();toast('Tarea eliminada (solo demostraci\u00f3n)')}});\n$('#vt-ai-btn').addEventListener('click',()=>{pause();aiOn=!aiOn;$('#vt-ai-btn').classList.toggle('on',aiOn);toast(aiOn?'AI activada':'AI en pausa')});$$('[data-nav]').forEach(b=>b.addEventListener('click',()=>{pause();toast('Demo de Tareas \u00b7 otras secciones disponibles por separado')}));\n$('#vt-overlay').addEventListener('keydown',e=>{if(e.key==='Escape')closeModal()});\nconst pointer=$('#vt-pointer'),ripple=$('#vt-click');function point(el,click=false){if(!el||!root.contains(el))return;let r=el.getBoundingClientRect(),base=root.getBoundingClientRect();if(r.height===0)return;let x=r.left-base.left+r.width*.57,y=r.top-base.top+r.height*.56;pointer.style.transform=`translate(${x}px,${y}px)`;pointer.classList.add('visible');if(click){ripple.style.left=x+'px';ripple.style.top=y+'px';ripple.classList.remove('active');void ripple.offsetWidth;ripple.classList.add('active')}}\nconst sleep=ms=>new Promise(resolve=>setTimeout(resolve,ms));let playing=false;\nasync function demo(){if(playing)return;playing=true;while(root.isConnected){if(!visible||document.hidden||Date.now()<manualPauseUntil||$('#vt-overlay').classList.contains('show')){pointer.classList.remove('visible');await sleep(1100);continue}let tok=++runToken;\n const sequence=[\n async()=>{point($('#vt-new'));await sleep(700);if(tok!==runToken)return;point($('#vt-new'),true);await sleep(500);toast('Crea y asigna tareas desde una sola vista')},\n async()=>{point($('[data-stat=\"Pendientes\"]'));await sleep(580);point($('[data-stat=\"En curso\"]'));await sleep(600);point($('[data-stat=\"Completadas\"]'));},\n async()=>{let target=$('[data-edit=\"1\"]');if(target){target.closest('.vt-card').scrollIntoView({block:'nearest',behavior:'smooth'});await sleep(650);point(target,true);target.closest('.vt-card').classList.add('vt-highlight');await sleep(350);if(tok!==runToken)return;editAuto(1);await sleep(1050);closeModal()}},\n async()=>{point($('[data-cycle=\"3\"]'),true);await sleep(420);if(tok!==runToken)return;change(3,'Completada',true);toast('El equipo complet\u00f3 el seguimiento');await sleep(950);change(3,'En curso',true)},\n async()=>{point($('[data-filter=\"Pendientes\"]'),true);await sleep(500);if(tok!==runToken)return;setFilter('Pendientes',true);await sleep(950);point($('[data-filter=\"Todas\"]'),true);setFilter('Todas',true)},\n async()=>{let inp=$('#vt-search');point(inp,true);await sleep(380);if(tok!==runToken)return;inp.value='propuesta';term='propuesta';drawCards();await sleep(1200);inp.value='';term='';drawCards()},\n async()=>{point($('#vt-ai-btn'),true);await sleep(450);if(tok!==runToken)return;aiOn=!aiOn;$('#vt-ai-btn').classList.toggle('on',aiOn);await sleep(800);aiOn=!aiOn;$('#vt-ai-btn').classList.toggle('on',aiOn)},\n async()=>{point($('[data-done=\"4\"]'),true);await sleep(480);if(tok!==runToken)return;change(4,'Completada',true);toast('Nueva tarea completada');await sleep(1100);change(4,'Pendiente',true)}\n ];\n for(const step of sequence){if(tok!==runToken||!visible||document.hidden||Date.now()<manualPauseUntil)break;try{await step()}catch(e){}await sleep(350)}pointer.classList.remove('visible');await sleep(1300)\n }playing=false}\n function editAuto(id){let t=tasks.find(x=>x.id===id);if(!t)return;currentId=id;$('#vt-modaltitle').textContent='Editar tarea';$('#vt-tasktitle').value=t.title;$('#vt-taskdesc').value=t.desc;$('#vt-taskwho').value=t.who;$('#vt-taskowner').value=t.owner;$('#vt-taskdate').value=localDate(t.due);$('#vt-taskpriority').value=t.priority;$('#vt-taskstatus').value=t.status;$('#vt-overlay').classList.add('show')}\n if('IntersectionObserver' in window){new IntersectionObserver(es=>{visible=es[0].isIntersecting},{threshold:.08}).observe(root)}\n draw();if(!window.matchMedia('(prefers-reduced-motion: reduce)').matches)demo();\n})();\n<\/script><\/div>\n<\/body><\/html><\/template>\n<template id=\"vc8-approved-calendar\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}<\/style><\/head><body><!-- Vchat by StudioVainilla \u2014 AGENDA \u00b7 Clon Animado V1 \u00b7 datos ficticios y calendario din\u00e1mico. Pegar completo en 1 widget HTML de Elementor. -->\n<div id=\"svAgendaV1\" aria-label=\"Demostraci\u00f3n interactiva del calendario de Vchat\">\n<style>\n#svAgendaV1{--a:#6557f5;--ink:#212643;--muted:#8990aa;--border:#dfe5f6;--pale:#f7f9ff;isolation:isolate;position:relative;background:#f8faff;color:var(--ink);font:13px\/1.45 Inter,system-ui,-apple-system,\"Segoe UI\",Arial,sans-serif!important;overflow:hidden;border:1px solid #e7eafa;box-shadow:0 22px 75px #18204a20;min-height:790px}\n#svAgendaV1 *,#svAgendaV1 *:before,#svAgendaV1 *:after{box-sizing:border-box}#svAgendaV1 button,#svAgendaV1 input,#svAgendaV1 select,#svAgendaV1 textarea{font:inherit!important;text-transform:none!important;letter-spacing:normal!important}#svAgendaV1 button{cursor:pointer}#svAgendaV1 button:focus-visible,#svAgendaV1 input:focus-visible{outline:2px solid var(--a);outline-offset:2px}#svAgendaV1 h2,#svAgendaV1 h3,#svAgendaV1 p{margin:0!important;font-family:inherit!important;color:inherit}\n#svAgendaV1 .va-shell{height:820px;display:grid;grid-template-columns:289px minmax(0,1fr)}\n#svAgendaV1 .va-sidebar{background:#fff;border-right:1px solid #e4e9f4;padding:23px 12px;overflow:auto;scrollbar-width:none}#svAgendaV1 .va-sidebar::-webkit-scrollbar{display:none}#svAgendaV1 .va-brand{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 5px 16px;padding:0 1px 15px;border-bottom:1px solid #eef0f8}#svAgendaV1 .va-brand img{width:185px;height:57px;object-fit:contain;object-position:left}#svAgendaV1 .va-back{width:43px;height:43px;background:#fff;color:#576a90;border:1px solid var(--border);border-radius:14px;font-size:23px}#svAgendaV1 .va-sidecap{color:#94a4c1;font-size:11px;font-weight:850;letter-spacing:1.2px;margin:18px 16px 12px}#svAgendaV1 .va-nav{display:grid;gap:3px}#svAgendaV1 .va-ni{display:flex;align-items:center;gap:14px;width:100%;height:42px;text-align:left;color:#687b98;font-weight:750;padding:0 13px;border:0;border-radius:11px;background:transparent;white-space:nowrap}#svAgendaV1 .va-ni:hover,#svAgendaV1 .va-ni.active{background:#f1f0ff;color:#4a45dd}#svAgendaV1 .va-ic{font-size:18px;line-height:1;width:22px;text-align:center;font-weight:500}#svAgendaV1 .va-ni .va-count{margin-left:auto;border-radius:18px;padding:3px 9px;background:linear-gradient(110deg,#7958fb,#368ffd);color:#fff;box-shadow:0 2px 7px #695cff48;font-size:11px}#svAgendaV1 .va-ni .va-credit{margin-left:auto;background:#eaf0ff;color:#6555db;border-radius:18px;padding:3px 9px;font-size:11px}\n#svAgendaV1 .va-main{display:flex;flex-direction:column;min-width:0;min-height:0}#svAgendaV1 .va-top{height:73px;flex:0 0 73px;background:#fff;border-bottom:1px solid #e4e8f3;padding:0 24px;display:flex;justify-content:space-between;align-items:center;gap:12px}#svAgendaV1 .va-org{font-size:10px;color:#92a2bc;font-weight:800;letter-spacing:.4px}#svAgendaV1 .va-top strong{font-size:16px;color:#161b35;font-weight:850}#svAgendaV1 .va-ttools{display:flex;align-items:center;gap:10px}#svAgendaV1 .va-tool{min-width:48px;height:49px;display:flex;align-items:center;justify-content:center;gap:9px;padding:0 11px;border:1px solid #dfe3f6;border-radius:17px;background:#fff;color:#5a50d9;font-size:17px;font-weight:800}#svAgendaV1 .va-tool:first-child{font-size:13px;color:#1c2441}#svAgendaV1 .va-ai{font-size:12px;background:#f9f8ff;min-width:111px}#svAgendaV1 .va-ai .va-spark{background:linear-gradient(135deg,#7f5afa,#378cf6);padding:7px;border-radius:10px;color:#fff;font-size:13px}#svAgendaV1 .va-switch{height:20px;width:36px;border-radius:20px;background:#d9d7e6;position:relative}#svAgendaV1 .va-switch:after{content:\"\";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0004;transition:transform .25s}#svAgendaV1 .va-ai.on .va-switch{background:#5a5df7}#svAgendaV1 .va-ai.on .va-switch:after{transform:translateX(16px)}#svAgendaV1 .va-body{flex:1;min-height:0;overflow:auto;padding:20px 34px 36px;scroll-behavior:smooth;scrollbar-width:thin}\n#svAgendaV1 .va-hero{min-height:194px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 28px;border:1px solid #e0e4f8;border-radius:24px;background:linear-gradient(120deg,#fff 25%,#f3f1ff 100%);box-shadow:0 16px 38px #27365f0b}#svAgendaV1 .va-pill{display:inline-flex;align-items:center;padding:7px 13px;background:#f3f1ff;border:1px solid #e4dfff;color:#8170d7;border-radius:30px;font-size:11px;font-weight:900;letter-spacing:1.1px}#svAgendaV1 .va-hero h2{font-size:clamp(24px,2.5vw,37px)!important;line-height:1.13!important;font-weight:900!important;letter-spacing:-1.1px;margin:12px 0!important}#svAgendaV1 .va-desc{color:#7784a5;font-size:12px;max-width:540px}#svAgendaV1 .va-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}#svAgendaV1 .va-btn{background:#fff;border:1px solid #d7def8;color:#48527d;border-radius:13px;min-height:45px;padding:0 15px;font-size:12px!important;font-weight:780;white-space:nowrap;box-shadow:none}#svAgendaV1 .va-btn:hover{border-color:#aab1fd;background:#f6f5ff}#svAgendaV1 .va-primary{background:#6256ee!important;color:white!important;border-color:#6256ee!important;box-shadow:0 8px 20px #5745ee2e}#svAgendaV1 .va-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:22px 0}#svAgendaV1 .va-stat{min-height:140px;background:#fff;border:1px solid var(--border);border-bottom:3px solid var(--line);border-radius:21px;padding:22px;box-shadow:0 13px 32px #2c375d0b;position:relative}#svAgendaV1 .va-stat-label{color:#848ca9;font-weight:800;font-size:12px}#svAgendaV1 .va-stat strong{display:block;color:#232744;font-size:36px;margin:9px 0 5px;line-height:1.1}#svAgendaV1 .va-stat small{font-size:11px;color:#959db7}#svAgendaV1 .va-stat-icon{position:absolute;right:17px;top:17px;background:var(--bg);border-radius:14px;padding:11px;color:var(--line);font-size:18px}\n#svAgendaV1 .va-panel{border:1px solid #dee4f7;background:#fff;border-radius:24px;padding:21px 22px 25px;box-shadow:0 14px 35px #2c375d0a}#svAgendaV1 .va-panel-top{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #eef0f8;padding-bottom:15px}#svAgendaV1 .va-kicker{font-size:10px;letter-spacing:1px;font-weight:900;color:#665bf4}#svAgendaV1 .va-panel-top h3{display:inline-block!important;margin-left:10px!important;font-size:16px!important;font-weight:860!important}#svAgendaV1 .va-hint{color:#959db7;font-size:11px}#svAgendaV1 .va-toolbar{display:grid;grid-template-columns:200px 1.5fr 1fr .8fr;gap:12px;align-items:end;padding:15px 0;border-bottom:1px solid #eff1f9}#svAgendaV1 .va-field{display:grid;gap:6px;min-width:0}#svAgendaV1 .va-field label{font-size:11px;font-weight:850;color:#7b86a6}#svAgendaV1 .va-select,#svAgendaV1 .va-textinput{width:100%;height:49px;border:1px solid #d9dff3;border-radius:12px;background:#fff;color:#333c5f;padding:0 12px;font-weight:720;min-width:0;outline:0}#svAgendaV1 .va-select:focus,#svAgendaV1 .va-textinput:focus{border-color:#7c70f8}#svAgendaV1 .va-tabs{height:49px;display:flex;align-items:center;gap:4px;background:#f0effb;border-radius:12px;padding:5px}#svAgendaV1 .va-tab{height:39px;flex:1;border:0;border-radius:10px;background:transparent;color:#777e9e;font-size:12px;font-weight:850}#svAgendaV1 .va-tab.active{background:#fff;color:#584add;box-shadow:0 2px 5px #27346512}\n#svAgendaV1 .va-monthbar{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:16px 0 20px}#svAgendaV1 .va-monthbar .va-btn{min-height:42px}#svAgendaV1 .va-period{padding:0 18px;max-width:320px;overflow:hidden;text-overflow:ellipsis}#svAgendaV1 .va-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;padding-bottom:12px;text-align:center;color:#8089a7;font-size:11px;letter-spacing:1px;font-weight:900}#svAgendaV1 .va-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px}#svAgendaV1 .va-day{position:relative;border:1px solid #dfe5f5;border-radius:15px;min-width:0;min-height:130px;overflow:hidden;background:#fff;box-shadow:0 7px 16px #2d3c6510;transition:background .22s,border-color .22s}#svAgendaV1 .va-day.outside{background:#f7f8fc;opacity:.56}#svAgendaV1 .va-day.today{border-color:#9a92ff;box-shadow:0 0 0 1px #918aff44}#svAgendaV1 .va-day.focused{border-color:#6659fb;box-shadow:0 0 0 2px #6559fb48}#svAgendaV1 .va-dayhead{display:flex;align-items:center;justify-content:space-between;gap:3px;padding:8px 7px;background:#fbfbfe;border-bottom:1px solid #f0f0f7;min-height:43px}#svAgendaV1 .va-dayname{font-size:10px;color:#a0a6bc}#svAgendaV1 .va-date{font-weight:850;font-size:12px;color:#343955}#svAgendaV1 .va-todaynum{background:#6258f4;color:#fff;padding:4px 8px;border-radius:8px}#svAgendaV1 .va-addday{margin-left:auto;width:27px;height:27px;border:1px solid #dfdcff;border-radius:9px;background:#f1efff;color:#5d51e9;font-size:21px;line-height:1}#svAgendaV1 .va-dayappointments{padding:6px;display:grid;gap:5px}#svAgendaV1 .va-book{width:100%;border:0;border-left:3px solid #675afa;background:#f0efff;border-radius:9px;padding:6px 7px;text-align:left;color:#2d3157;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#svAgendaV1 .va-book span{display:block;font-size:10px;font-weight:900;color:#5d4fe8}#svAgendaV1 .va-book strong{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis}#svAgendaV1 .va-book small{display:block;color:#8991ad;font-size:9px;overflow:hidden;text-overflow:ellipsis}#svAgendaV1 .va-book:hover{background:#e6e4ff}#svAgendaV1 .va-list{display:grid;gap:10px;padding-top:10px}#svAgendaV1 .va-listrow{display:grid;grid-template-columns:100px 1fr auto auto;gap:15px;align-items:center;border:1px solid #e1e5f6;border-radius:14px;padding:12px 16px;background:#fff}#svAgendaV1 .va-listrow strong{font-size:13px}#svAgendaV1 .va-listrow small{color:#8e99b2}#svAgendaV1 .va-status{padding:6px 11px;border-radius:30px;background:#e5f8ef;color:#237f60;font-weight:850;font-size:11px}#svAgendaV1 .va-status.pending{background:#fff3e0;color:#a27523}#svAgendaV1 .va-empty{padding:38px;color:#909bb7;text-align:center}#svAgendaV1 .va-summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:15px 22px;margin-top:12px;border:1px solid #dce3f6;background:#fff;border-radius:18px}#svAgendaV1 .va-summary b{font-size:12px}#svAgendaV1 .va-summary small{display:block;color:#8c97b2}\n#svAgendaV1 .va-modalback{position:absolute;inset:0;z-index:20;background:#0d15387d;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(3px)}#svAgendaV1 .va-modalback.open{display:flex}#svAgendaV1 .va-modal{width:min(460px,100%);max-height:90%;overflow:auto;border:1px solid #e0e4f6;border-radius:23px;padding:24px;background:#fff;box-shadow:0 30px 90px #15183e66}#svAgendaV1 .va-modalhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}#svAgendaV1 .va-modalhead h3{font-size:20px!important;font-weight:850!important}#svAgendaV1 .va-close{width:36px;height:36px;border-radius:10px;border:1px solid #dfe3f5;background:#fff;color:#505b88;font-size:20px}#svAgendaV1 .va-formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}#svAgendaV1 .va-formgrid .va-field.full{grid-column:1\/-1}#svAgendaV1 .va-modalfooter{display:flex;gap:8px;justify-content:flex-end;margin-top:18px}#svAgendaV1 .va-toast{position:absolute;z-index:25;right:22px;bottom:25px;background:#1d254b;color:#fff;padding:12px 18px;border-radius:13px;box-shadow:0 10px 35px #0003;opacity:0;transform:translateY(15px);transition:.25s;pointer-events:none}#svAgendaV1 .va-toast.show{opacity:1;transform:none}#svAgendaV1 .va-cursor{position:absolute;z-index:18;top:0;left:0;pointer-events:none;color:#5f54e9;filter:drop-shadow(0 3px 2px #fff);opacity:0;transition:transform .55s cubic-bezier(.2,.72,.2,1),opacity .3s}#svAgendaV1 .va-cursor svg{width:25px;height:29px;fill:#5f54e9;stroke:#fff;stroke-width:1.5}#svAgendaV1 .va-cursor.click:after{content:\"\";position:absolute;left:4px;top:5px;width:26px;height:26px;border:2px solid #6557fa;border-radius:50%;animation:vaClick .5s ease-out forwards}@keyframes vaClick{to{transform:scale(1.9);opacity:0}}\n#svAgendaV1 .va-muted{font-size:10px;color:#8992ae}#svAgendaV1 .va-demo{color:#6a60d7;font-size:11px;font-weight:850;margin:8px 0 0}\n@media(max-width:1050px){#svAgendaV1 .va-shell{grid-template-columns:220px minmax(0,1fr)}#svAgendaV1 .va-brand img{width:145px}#svAgendaV1 .va-body{padding:17px 17px 25px}#svAgendaV1 .va-hero{display:block}#svAgendaV1 .va-actions{justify-content:flex-start;margin-top:15px}#svAgendaV1 .va-toolbar{grid-template-columns:1fr 1fr}#svAgendaV1 .va-day{min-height:105px}}\n@media(max-width:720px){#svAgendaV1 .va-shell{height:760px;display:flex;flex-direction:column}#svAgendaV1 .va-sidebar{display:none}#svAgendaV1 .va-top{padding:0 12px;height:62px;flex-basis:62px}#svAgendaV1 .va-tool{min-width:36px;height:39px;padding:0 8px}#svAgendaV1 .va-ttools{gap:5px}#svAgendaV1 .va-ttools .va-extra{display:none}#svAgendaV1 .va-body{padding:14px 12px 23px}#svAgendaV1 .va-hero{padding:20px;min-height:auto}#svAgendaV1 .va-hero h2{font-size:27px!important}#svAgendaV1 .va-stats{grid-template-columns:repeat(2,1fr);gap:9px;margin:12px 0}#svAgendaV1 .va-stat{min-height:99px;padding:14px}#svAgendaV1 .va-stat strong{font-size:26px}#svAgendaV1 .va-stat-icon{top:10px;right:10px}#svAgendaV1 .va-panel{padding:14px 10px}#svAgendaV1 .va-panel-top{flex-wrap:wrap}#svAgendaV1 .va-toolbar{grid-template-columns:1fr 1fr;gap:8px}#svAgendaV1 .va-select{height:42px;font-size:11px!important}#svAgendaV1 .va-monthbar{justify-content:center}#svAgendaV1 .va-period{font-size:11px!important}#svAgendaV1 .va-weekdays{gap:3px;font-size:9px}#svAgendaV1 .va-calendar{gap:3px}#svAgendaV1 .va-day{min-height:82px;border-radius:9px}#svAgendaV1 .va-dayhead{padding:4px;min-height:30px}#svAgendaV1 .va-dayname{display:none}#svAgendaV1 .va-date{font-size:11px}#svAgendaV1 .va-addday{width:20px;height:20px;font-size:15px}#svAgendaV1 .va-dayappointments{padding:2px}#svAgendaV1 .va-book{padding:3px;min-height:20px;border-radius:5px}#svAgendaV1 .va-book strong,#svAgendaV1 .va-book small{display:none}#svAgendaV1 .va-book span{font-size:8px}#svAgendaV1 .va-listrow{grid-template-columns:1fr auto}#svAgendaV1 .va-summary{padding:10px;flex-wrap:wrap}}\n@media(prefers-reduced-motion:reduce){#svAgendaV1 *,#svAgendaV1 *:before,#svAgendaV1 *:after{animation:none!important;transition:none!important}#svAgendaV1 .va-cursor{display:none}}\n<\/style>\n<div class=\"va-shell\">\n<aside class=\"va-sidebar\"><div class=\"va-brand\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\"><button class=\"va-back\" type=\"button\" aria-label=\"Contraer men\u00fa\">\u2039<\/button><\/div><div class=\"va-sidecap\">TRABAJO<\/div><nav class=\"va-nav\" aria-label=\"Men\u00fa demostrativo de Vchat\">\n<button class=\"va-ni\"><span class=\"va-ic\">\u2302<\/span>Inicio<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u25a4<\/span>Inbox<span class=\"va-count\">8<\/span><\/button><button class=\"va-ni\"><span class=\"va-ic\">\u2659<\/span>Contactos<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u26b2<\/span>CRM<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u2611<\/span>Tareas<span class=\"va-count\">2<\/span><\/button><button class=\"va-ni active\"><span class=\"va-ic\">\u25a3<\/span>Agenda<\/button><\/nav><div class=\"va-sidecap\">HERRAMIENTAS<\/div><nav class=\"va-nav\"><button class=\"va-ni\"><span class=\"va-ic\">\u03df<\/span>Automatizaciones<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u25a4<\/span>Respuestas y recursos<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u25eb<\/span>Conocimiento AI<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u2b21<\/span>Productos y servicios<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u2727<\/span>Agentes AI<\/button><button class=\"va-ni\"><span class=\"va-ic\">\u24e2<\/span>Cr\u00e9ditos AI <span class=\"va-credit\">2,450<\/span><\/button><\/nav><div class=\"va-sidecap\">INSIGHTS<\/div><nav class=\"va-nav\"><button class=\"va-ni\"><span class=\"va-ic\">\u2301<\/span>Anal\u00edtica<\/button><\/nav><\/aside>\n<div class=\"va-main\"><div class=\"va-top\"><div><div class=\"va-org\">Estudio Aurora \u00b7 Demo<\/div><strong>Agenda<\/strong><\/div><div class=\"va-ttools\"><button class=\"va-tool\" type=\"button\">\ud83c\uddf2\ud83c\uddfd &nbsp; ES<\/button><button class=\"va-tool va-ai on\" id=\"vaAI\" type=\"button\"><span class=\"va-spark\">\u2726<\/span> AI <span class=\"va-switch\"><\/span><\/button><button class=\"va-tool va-extra\" type=\"button\">\u2315<\/button><button class=\"va-tool va-extra\" type=\"button\">\u25a4<\/button><button class=\"va-tool va-extra\" type=\"button\">\u2662<\/button><\/div><\/div>\n<div class=\"va-body\" id=\"vaScroll\"><section class=\"va-hero\"><div><span class=\"va-pill\">\u25cf AGENDA INTELIGENTE<\/span><h2>Calendarios y reservas<\/h2><p class=\"va-desc\">Administra disponibilidad, servicios, reservas y automatizaci\u00f3n AI desde un calendario operativo por contexto.<\/p><\/div><div class=\"va-actions\"><button class=\"va-btn\" type=\"button\" data-demo=\"calendarios\">Calendarios<\/button><button class=\"va-btn\" type=\"button\" data-demo=\"embed\">C\u00f3digo embed<\/button><button class=\"va-btn\" type=\"button\" data-demo=\"disponibilidad\">Disponibilidad<\/button><button class=\"va-btn va-primary\" id=\"vaNew\" type=\"button\">\uff0b Nueva reserva<\/button><\/div><\/section>\n<section class=\"va-stats\" aria-label=\"Indicadores de reservas\"><div class=\"va-stat\" style=\"--line:#705df7;--bg:#f0ecff\"><div class=\"va-stat-label\">Reservas \u00b7 30 d\u00edas<\/div><span class=\"va-stat-icon\">\u25a3<\/span><strong id=\"vaTotal\">0<\/strong><small>Actividad registrada<\/small><\/div><div class=\"va-stat\" style=\"--line:#25a378;--bg:#e7f9ef\"><div class=\"va-stat-label\">Confirmadas<\/div><span class=\"va-stat-icon\">\u2713<\/span><strong id=\"vaConfirmed\">0<\/strong><small>Pr\u00f3ximas o activas<\/small><\/div><div class=\"va-stat\" style=\"--line:#378cff;--bg:#edf5ff\"><div class=\"va-stat-label\">Hoy<\/div><span class=\"va-stat-icon\">\u25f7<\/span><strong id=\"vaToday\">0<\/strong><small>Atenciones del d\u00eda<\/small><\/div><div class=\"va-stat\" style=\"--line:#ef6575;--bg:#fff1f1\"><div class=\"va-stat-label\">Canceladas<\/div><span class=\"va-stat-icon\">\u22a0<\/span><strong id=\"vaCancelled\">0<\/strong><small>\u00daltimos 30 d\u00edas<\/small><\/div><\/section>\n<section class=\"va-panel\" id=\"vaPanel\"><div class=\"va-panel-top\"><div><span class=\"va-kicker\">ORGANIZA TUS CITAS<\/span><h3>Vista de reservaciones<\/h3><\/div><span class=\"va-hint\">Consulta disponibilidad, filtra servicios o cambia de periodo.<\/span><\/div><div class=\"va-toolbar\"><div class=\"va-tabs\"><button type=\"button\" class=\"va-tab active\" data-view=\"calendario\">Calendario<\/button><button type=\"button\" class=\"va-tab\" data-view=\"agenda\">Agenda<\/button><\/div><div class=\"va-field\"><label for=\"vaCalendarSelect\">Calendario<\/label><select id=\"vaCalendarSelect\" class=\"va-select\"><option value=\"principal\">Calendario principal \u00b7 Principal<\/option><option value=\"asesorias\">Consultor\u00eda \u00b7 Sesiones<\/option><\/select><\/div><div class=\"va-field\"><label for=\"vaService\">Servicio<\/label><select id=\"vaService\" class=\"va-select\"><option value=\"todos\">Todos los servicios<\/option><option value=\"Diagn\u00f3stico inicial\">Diagn\u00f3stico inicial<\/option><option value=\"Consultor\u00eda digital\">Consultor\u00eda digital<\/option><option value=\"Sesi\u00f3n estrat\u00e9gica\">Sesi\u00f3n estrat\u00e9gica<\/option><option value=\"Presentaci\u00f3n de propuesta\">Presentaci\u00f3n de propuesta<\/option><\/select><\/div><div class=\"va-field\"><label for=\"vaStatus\">Estado<\/label><select id=\"vaStatus\" class=\"va-select\"><option value=\"todos\">Todos<\/option><option value=\"Confirmada\">Confirmadas<\/option><option value=\"Pendiente\">Pendientes<\/option><option value=\"Cancelada\">Canceladas<\/option><\/select><\/div><\/div><div class=\"va-monthbar\"><button class=\"va-btn\" id=\"vaPrev\" aria-label=\"Mes anterior\" type=\"button\">\u276e<\/button><button class=\"va-btn va-period\" id=\"vaPeriod\" type=\"button\">Mes actual<\/button><button class=\"va-btn\" id=\"vaNext\" aria-label=\"Mes siguiente\" type=\"button\">\u276f<\/button><button class=\"va-btn\" id=\"vaGoToday\" type=\"button\">Hoy<\/button><\/div><div id=\"vaCalendarWrap\"><div class=\"va-weekdays\"><span>LUNES<\/span><span>MARTES<\/span><span>MI\u00c9RCOLES<\/span><span>JUEVES<\/span><span>VIERNES<\/span><span>S\u00c1BADO<\/span><span>DOMINGO<\/span><\/div><div id=\"vaCalendarGrid\" class=\"va-calendar\"><\/div><\/div><div id=\"vaAgendaList\" class=\"va-list\" hidden><\/div><\/section>\n<div class=\"va-summary\" id=\"vaSummary\"><div><b>Pr\u00f3ximas reservas \u00b7 Demostraci\u00f3n<\/b><small>Agenda ilustrativa con datos ficticios y fechas din\u00e1micas.<\/small><\/div><button class=\"va-btn\" type=\"button\" id=\"vaShowFirst\">Ver reserva<\/button><\/div><div class=\"va-demo\">Demostraci\u00f3n interactiva; no conecta con reservas reales.<\/div><\/div><\/div><\/div>\n<div class=\"va-modalback\" id=\"vaModalBack\" role=\"presentation\"><section class=\"va-modal\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"vaModalTitle\"><div class=\"va-modalhead\"><h3 id=\"vaModalTitle\">Nueva reserva<\/h3><button class=\"va-close\" type=\"button\" id=\"vaClose\" aria-label=\"Cerrar\">\u00d7<\/button><\/div><form id=\"vaForm\"><div class=\"va-formgrid\"><div class=\"va-field full\"><label for=\"vaName\">Nombre de contacto<\/label><input id=\"vaName\" class=\"va-textinput\" required maxlength=\"80\" placeholder=\"Nombre de demostraci\u00f3n\"><\/div><div class=\"va-field full\"><label for=\"vaFormService\">Servicio<\/label><select id=\"vaFormService\" class=\"va-select\"><option>Diagn\u00f3stico inicial<\/option><option>Consultor\u00eda digital<\/option><option>Sesi\u00f3n estrat\u00e9gica<\/option><option>Presentaci\u00f3n de propuesta<\/option><\/select><\/div><div class=\"va-field\"><label for=\"vaDate\">Fecha<\/label><input id=\"vaDate\" class=\"va-textinput\" type=\"date\" required><\/div><div class=\"va-field\"><label for=\"vaTime\">Hora<\/label><input id=\"vaTime\" class=\"va-textinput\" type=\"time\" required><\/div><div class=\"va-field full\"><label for=\"vaFormState\">Estado<\/label><select id=\"vaFormState\" class=\"va-select\"><option>Confirmada<\/option><option>Pendiente<\/option><\/select><\/div><\/div><div class=\"va-modalfooter\"><button class=\"va-btn\" type=\"button\" id=\"vaCancel\">Cancelar<\/button><button class=\"va-btn va-primary\" type=\"submit\">Guardar reserva<\/button><\/div><\/form><\/section><\/div><div class=\"va-toast\" role=\"status\" id=\"vaToast\"><\/div><div class=\"va-cursor\" aria-hidden=\"true\" id=\"vaCursor\"><svg viewBox=\"0 0 24 28\"><path d=\"M3 2 L3 24 L9 18 L13 26 L17 24 L13 16 L22 15 Z\"\/><\/svg><\/div>\n<script>\n(function(){\n 'use strict';\n const root=document.getElementById('svAgendaV1');if(!root||root.dataset.initialized)return;root.dataset.initialized='1';\n const $=s=>root.querySelector(s),$$=s=>[...root.querySelectorAll(s)];const now=new Date();now.setHours(12,0,0,0);const today=new Date(now.getFullYear(),now.getMonth(),now.getDate(),12);let shown=new Date(today.getFullYear(),today.getMonth(),1,12);const localDate=d=>`${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`;const addDays=(n,from=today)=>new Date(from.getFullYear(),from.getMonth(),from.getDate()+n,12);const key=d=>localDate(d);const fmt=d=>new Intl.DateTimeFormat('es-MX',{day:'numeric',month:'short',year:'numeric'}).format(d);const monthfmt=d=>new Intl.DateTimeFormat('es-MX',{month:'long',year:'numeric'}).format(d);const cap=s=>s.charAt(0).toUpperCase()+s.slice(1);const parseDate=s=>new Date(Number(s.slice(0,4)),Number(s.slice(5,7))-1,Number(s.slice(8,10)),12);\n let events=[{id:1,date:key(addDays(-2)),time:'11:00',name:'Clara Montes',service:'Diagn\u00f3stico inicial',state:'Confirmada',calendar:'principal'},{id:2,date:key(today),time:'10:30',name:'Natalia Vega',service:'Consultor\u00eda digital',state:'Confirmada',calendar:'principal'},{id:3,date:key(addDays(1)),time:'12:00',name:'Daniela Cruz',service:'Diagn\u00f3stico inicial',state:'Pendiente',calendar:'principal'},{id:4,date:key(addDays(2)),time:'16:00',name:'Andr\u00e9s Villar',service:'Sesi\u00f3n estrat\u00e9gica',state:'Confirmada',calendar:'principal'},{id:5,date:key(addDays(3)),time:'09:30',name:'Elena Paredes',service:'Presentaci\u00f3n de propuesta',state:'Confirmada',calendar:'principal'},{id:6,date:key(addDays(5)),time:'13:00',name:'Mateo Sol\u00eds',service:'Consultor\u00eda digital',state:'Pendiente',calendar:'principal'},{id:7,date:key(addDays(7)),time:'17:00',name:'Valeria Le\u00f3n',service:'Sesi\u00f3n estrat\u00e9gica',state:'Confirmada',calendar:'principal'},{id:8,date:key(addDays(9)),time:'10:00',name:'Luc\u00eda R\u00edos',service:'Diagn\u00f3stico inicial',state:'Confirmada',calendar:'principal'},{id:9,date:key(addDays(4)),time:'15:30',name:'Paula Neri',service:'Sesi\u00f3n estrat\u00e9gica',state:'Pendiente',calendar:'asesorias'}];\n let view='calendario',selected=null,editing=null,muted=false,playing=false,pausedUntil=0,visible=true,run=0,timer=null;const reduced=window.matchMedia&&window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n const filtered=()=>events.filter(e=>($('#vaCalendarSelect').value===e.calendar)&&($('#vaService').value==='todos'||e.service===$('#vaService').value)&&($('#vaStatus').value==='todos'||e.state===$('#vaStatus').value)).sort((a,b)=>(a.date+a.time).localeCompare(b.date+b.time));\n const toast=msg=>{const t=$('#vaToast');t.textContent=msg;t.classList.add('show');setTimeout(()=>t.classList.remove('show'),2000)};\n function updateStats(){const recent=events.filter(e=>Math.abs((parseDate(e.date)-today)\/86400000)<=30);$('#vaTotal').textContent=recent.length;$('#vaConfirmed').textContent=events.filter(e=>e.state==='Confirmada'&&e.date>=key(today)).length;$('#vaToday').textContent=events.filter(e=>e.date===key(today)&&e.state!=='Cancelada').length;$('#vaCancelled').textContent=recent.filter(e=>e.state==='Cancelada').length}\n function render(){updateStats();$('#vaPeriod').textContent=cap(monthfmt(shown))+' \u00b7 Calendario Principal';$$('[data-view]').forEach(b=>b.classList.toggle('active',b.dataset.view===view));$('#vaCalendarWrap').hidden=view!=='calendario';$('#vaAgendaList').hidden=view!=='agenda';const ev=filtered();if(view==='agenda'){let box=$('#vaAgendaList');box.replaceChildren();if(!ev.length){const p=document.createElement('p');p.className='va-empty';p.textContent='No hay reservas para los filtros seleccionados.';box.append(p)}ev.forEach(e=>{const row=document.createElement('div');row.className='va-listrow';const date=document.createElement('strong');date.textContent=fmt(parseDate(e.date))+' \u00b7 '+e.time;const details=document.createElement('div');const name=document.createElement('strong');name.textContent=e.name;const sm=document.createElement('small');sm.textContent=e.service;details.append(name,document.createElement('br'),sm);const status=document.createElement('span');status.className='va-status'+(e.state==='Pendiente'?' pending':'');status.textContent=e.state;const open=document.createElement('button');open.className='va-btn';open.type='button';open.textContent='Ver';open.addEventListener('click',()=>openModal(e));row.append(date,details,status,open);box.append(row)});return}\n const grid=$('#vaCalendarGrid');grid.replaceChildren();const first=new Date(shown.getFullYear(),shown.getMonth(),1,12);const offset=(first.getDay()+6)%7;const start=new Date(first.getFullYear(),first.getMonth(),1-offset,12);const weekday=['Dom','Lun','Mar','Mi\u00e9','Jue','Vie','S\u00e1b'];for(let i=0;i<42;i++){const d=addDays(i,start),ds=key(d),day=document.createElement('div');day.className='va-day'+(d.getMonth()!==shown.getMonth()?' outside':'')+(ds===key(today)?' today':'')+(selected===ds?' focused':'');day.dataset.date=ds;const head=document.createElement('div');head.className='va-dayhead';const label=document.createElement('span');label.className='va-dayname';label.textContent=weekday[d.getDay()];const num=document.createElement('span');num.className='va-date'+(ds===key(today)?' va-todaynum':'');num.textContent=d.getDate();const add=document.createElement('button');add.type='button';add.className='va-addday';add.title='Nueva reserva para '+fmt(d);add.textContent='+';add.addEventListener('click',()=>openModal(null,ds));head.append(label,num,add);const content=document.createElement('div');content.className='va-dayappointments';ev.filter(e=>e.date===ds).forEach(e=>{const bt=document.createElement('button');bt.type='button';bt.className='va-book';const t=document.createElement('span'),n=document.createElement('strong'),s=document.createElement('small');t.textContent=e.time;n.textContent=e.name;s.textContent=e.service;bt.append(t,n,s);bt.addEventListener('click',()=>{selected=ds;render();openModal(e)});content.append(bt)});day.append(head,content);grid.append(day)} }\n function openModal(e=null,ds=null){editing=e?e.id:null;$('#vaModalTitle').textContent=e?'Detalle de reserva \u00b7 Editar':'Nueva reserva';$('#vaName').value=e?.name||'';$('#vaFormService').value=e?.service||'Diagn\u00f3stico inicial';$('#vaDate').value=e?.date||ds||key(addDays(1));$('#vaTime').value=e?.time||'11:00';$('#vaFormState').value=e?.state==='Pendiente'?'Pendiente':'Confirmada';$('#vaModalBack').classList.add('open');$('#vaName').focus({preventScroll:true})}\n function closeModal(){$('#vaModalBack').classList.remove('open');editing=null}$('#vaClose').onclick=closeModal;$('#vaCancel').onclick=closeModal;$('#vaModalBack').addEventListener('click',e=>{if(e.target===$('#vaModalBack'))closeModal()});root.addEventListener('keydown',e=>{if(e.key==='Escape')closeModal()});$('#vaForm').addEventListener('submit',e=>{e.preventDefault();const name=$('#vaName').value.trim(),date=$('#vaDate').value;if(!name||!date)return;const obj={id:editing||Date.now(),name,date,time:$('#vaTime').value||'11:00',service:$('#vaFormService').value,state:$('#vaFormState').value,calendar:$('#vaCalendarSelect').value};if(editing){events=events.map(x=>x.id===editing?obj:x)}else events.push(obj);shown=new Date(parseDate(date).getFullYear(),parseDate(date).getMonth(),1,12);selected=date;closeModal();render();toast(editing?'Reserva actualizada':'Reserva de demostraci\u00f3n creada')});\n $('#vaNew').onclick=()=>{manual();openModal()};$('#vaPrev').onclick=()=>{manual();shift(-1)};$('#vaNext').onclick=()=>{manual();shift(1)};$('#vaGoToday').onclick=()=>{manual();shown=new Date(today.getFullYear(),today.getMonth(),1,12);render()};$('#vaPeriod').onclick=()=>{manual();shown=new Date(today.getFullYear(),today.getMonth(),1,12);render()};function shift(delta){shown=new Date(shown.getFullYear(),shown.getMonth()+delta,1,12);render()}$$('[data-view]').forEach(b=>b.onclick=()=>{manual();view=b.dataset.view;render()});['vaCalendarSelect','vaService','vaStatus'].forEach(id=>$('#'+id).addEventListener('change',()=>{manual();render()}));$('#vaAI').onclick=()=>{$('#vaAI').classList.toggle('on');toast($('#vaAI').classList.contains('on')?'AI activa (demo)':'AI en pausa (demo)')};$('#vaShowFirst').onclick=()=>openModal(events[1]);$$('[data-demo]').forEach(b=>b.addEventListener('click',()=>toast('Vista de '+b.textContent+' \u00b7 demostraci\u00f3n visual')));\n function manual(){pausedUntil=Date.now()+12000}function moveCursor(el){if(!el)return;const r=el.getBoundingClientRect(),br=root.getBoundingClientRect(),c=$('#vaCursor');c.style.opacity='1';c.style.transform=`translate(${r.left-br.left+r.width*.48}px,${r.top-br.top+r.height*.5}px)`;c.classList.remove('click');void c.offsetWidth;c.classList.add('click')}\n const sleep=ms=>new Promise(resolve=>setTimeout(resolve,ms));async function demo(){if(playing||reduced)return;playing=true;const epoch=++run;while(visible&&epoch===run){if(Date.now()<pausedUntil){await sleep(650);continue}const phase=async(el,fn,delay=1300)=>{if(!visible||epoch!==run)return;moveCursor(el);await sleep(700);if(fn)fn();await sleep(delay)};await phase($('#vaNew'),()=>{openModal(null,key(addDays(4)));$('#vaName').value='Sof\u00eda Herrera';$('#vaFormService').value='Sesi\u00f3n estrat\u00e9gica';$('#vaTime').value='11:30'},1500);closeModal();await phase($('#vaCalendarGrid .va-book'),()=>{const e=events.find(x=>x.date===key(today));if(e)openModal(e)},1500);closeModal();await phase($('[data-view=\"agenda\"]'),()=>{view='agenda';render()},1400);await phase($('#vaService'),()=>{$('#vaService').value='Sesi\u00f3n estrat\u00e9gica';render()},1100);await phase($('[data-view=\"calendario\"]'),()=>{$('#vaService').value='todos';view='calendario';render()},1000);await phase($('#vaNext'),()=>shift(1),1300);await phase($('#vaGoToday'),()=>{shown=new Date(today.getFullYear(),today.getMonth(),1,12);render()},1200);await phase($('#vaAI'),()=>$('#vaAI').classList.toggle('on'),850);await sleep(750)}playing=false;$('#vaCursor').style.opacity='0'}\n if('IntersectionObserver' in window){new IntersectionObserver(entries=>{visible=entries[0].isIntersecting;if(visible&&!playing)demo();if(!visible){run++;playing=false;$('#vaCursor').style.opacity='0'}},{threshold:.08}).observe(root)}else{visible=true;demo()}\n render();\n})();\n<\/script>\n<\/div><\/body><\/html><\/template>\n<template id=\"vc8-approved-agents\"><!doctype html><html lang=\"es\"><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"><style>html,body{margin:0;background:#fff;overflow-x:hidden}<\/style><\/head><body><!-- VCHAT AGENTES AI \u00b7 CLON ANIMADO V1 \u00b7 DEMO FICTICIA \u00b7 Elementor HTML -->\n<div id=\"vchat-agents-v1\" class=\"vag-root\">\n<style>\n#vchat-agents-v1{--v:#6155f4;--blue:#35aef2;--ink:#20213e;--muted:#8990ab;--border:#dce2f3;--surface:#f7f9fd;position:relative;isolation:isolate;width:100%;background:#f7f9fd;color:var(--ink);font-family:Inter,system-ui,-apple-system,\"Segoe UI\",Arial,sans-serif;font-size:13px;overflow:hidden;border:1px solid #e6eaf5;border-radius:15px;box-shadow:0 20px 60px rgba(35,40,92,.12)}\n#vchat-agents-v1 *,#vchat-agents-v1 *::before,#vchat-agents-v1 *::after{box-sizing:border-box}\n#vchat-agents-v1 button,#vchat-agents-v1 input{font:inherit}#vchat-agents-v1 button{cursor:pointer}#vchat-agents-v1 .vag-shell{display:grid;grid-template-columns:235px minmax(0,1fr);height:760px;min-height:580px}\n#vchat-agents-v1 .vag-side{background:#fff;border-right:1px solid #e4e8f1;overflow:auto;scrollbar-width:thin;z-index:1}#vchat-agents-v1 .vag-brand{height:79px;border-bottom:1px solid #edf0f6;display:flex;align-items:center;justify-content:space-between;padding:14px 15px}#vchat-agents-v1 .vag-brand img{max-width:154px;height:auto;max-height:55px;object-fit:contain}#vchat-agents-v1 .vag-nav-label{color:#93a4c0;font-size:10px;letter-spacing:.13em;font-weight:800;margin:16px 18px 9px}#vchat-agents-v1 .vag-nav{display:grid;gap:3px;padding:0 10px}#vchat-agents-v1 .vag-nav-item{width:100%;border:0;background:transparent;border-radius:10px;text-align:left;display:flex;align-items:center;gap:11px;height:37px;padding:0 11px;color:#61718e;font-size:13px;font-weight:730}#vchat-agents-v1 .vag-nav-item .vag-glyph{width:18px;text-align:center;color:#70829e;font-size:17px}#vchat-agents-v1 .vag-nav-item.active{background:#f0effe;color:#5147db}#vchat-agents-v1 .vag-nav-item.active .vag-glyph{color:var(--v)}#vchat-agents-v1 .vag-number{margin-left:auto;border-radius:20px;background:linear-gradient(120deg,#8859fa,#388df4);color:#fff;font-size:10px;padding:3px 8px}#vchat-agents-v1 .vag-main{min-width:0;display:flex;flex-direction:column}#vchat-agents-v1 .vag-top{flex:none;height:70px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #e4e8f1;padding:0 20px;gap:12px}#vchat-agents-v1 .vag-workspace{font-size:10px;color:#9aabc3;font-weight:760}#vchat-agents-v1 .vag-top h3{margin:3px 0 0;font-size:14px;line-height:1.1;color:#18203b;font-weight:850}#vchat-agents-v1 .vag-top-actions{display:flex;align-items:center;gap:7px}#vchat-agents-v1 .vag-top-pill{border:1px solid #dde2f4;border-radius:14px;background:#fff;color:#463fae;height:41px;min-width:43px;padding:0 13px;font-weight:850;white-space:nowrap}#vchat-agents-v1 .vag-top-pill.ai{background:#f7f6ff;display:flex;align-items:center;gap:9px}#vchat-agents-v1 .vag-spark{background:linear-gradient(140deg,#6759f7,#389ff4);color:white;border-radius:11px;padding:6px}#vchat-agents-v1 .vag-switch{width:33px;height:19px;background:#d9dce9;border-radius:25px;display:inline-flex;align-items:center;padding:3px;transition:background .25s}#vchat-agents-v1 .vag-switch:after{content:\"\";width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #899;transition:transform .25s}#vchat-agents-v1 .vag-switch.on{background:linear-gradient(90deg,#6155f4,#319bef)}#vchat-agents-v1 .vag-switch.on:after{transform:translateX(14px)}#vchat-agents-v1 .vag-scroll{flex:1;overflow:auto;padding:17px 18px 28px;scrollbar-width:thin;scroll-behavior:smooth}#vchat-agents-v1 .vag-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}#vchat-agents-v1 .vag-stat{min-height:113px;border:1px solid #dddcef;border-radius:16px;background:#fff;padding:18px 16px;display:flex;flex-direction:column;justify-content:center}#vchat-agents-v1 .vag-stat.primary{color:#fff;border:0;background:linear-gradient(125deg,#8950fb,#625cf9 54%,#2fc5f1);position:relative;overflow:hidden}#vchat-agents-v1 .vag-stat.primary:after{content:\"\";position:absolute;width:120px;height:120px;border-radius:50%;right:-33px;top:-40px;background:#fff2}#vchat-agents-v1 .vag-stat small{font-size:11px;font-weight:750;color:#77758b}#vchat-agents-v1 .vag-stat.primary small{color:white}#vchat-agents-v1 .vag-stat strong{display:block;font-size:29px;margin:5px 0 3px;line-height:1;font-weight:850;letter-spacing:-.03em}#vchat-agents-v1 .vag-stat span{color:#9793a9;font-size:10.5px}#vchat-agents-v1 .vag-stat.primary span{color:#e6ecff}#vchat-agents-v1 .vag-credits{background:linear-gradient(105deg,#fff,#f1f9ff);border:1px solid #dce6fe;border-radius:17px;margin-top:14px;padding:20px 22px;box-shadow:0 7px 23px rgba(41,50,116,.035)}#vchat-agents-v1 .vag-credit-eyebrow{color:#4d4bdd;font-size:11px;font-weight:850;letter-spacing:.055em}#vchat-agents-v1 .vag-credits-head{display:flex;align-items:center;justify-content:space-between;gap:12px}#vchat-agents-v1 .vag-credits-num{font-size:30px;color:#5143a6;font-weight:870}#vchat-agents-v1 .vag-credits-num span{font-size:13px;font-weight:700;color:#666279}#vchat-agents-v1 .vag-credits-caption{margin-top:4px;color:#89899c;font-size:11px}#vchat-agents-v1 .vag-percent{background:#edf0ff;border-radius:12px;padding:11px 15px;font-weight:850;color:#4841d7;font-size:20px}#vchat-agents-v1 .vag-progress{margin:15px 0 13px;height:8px;border-radius:99px;background:#dfe5ed;overflow:hidden}#vchat-agents-v1 .vag-progress>span{display:block;height:100%;width:36%;background:linear-gradient(90deg,#8652fa,#37b9f1);border-radius:inherit;transition:width .6s}#vchat-agents-v1 .vag-credit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}#vchat-agents-v1 .vag-credit-grid>div{background:#faf9fd;border:1px solid #e7e5f0;border-radius:12px;padding:10px 12px}#vchat-agents-v1 .vag-credit-grid small{display:block;color:#8c8a9e;font-size:10px;margin-bottom:5px}#vchat-agents-v1 .vag-credit-grid b{display:block;font-size:12px}#vchat-agents-v1 .vag-tools{margin-top:17px;padding:16px 17px;background:#fff;border:1px solid #e2deed;border-radius:16px;display:flex;gap:20px;align-items:end;justify-content:space-between}#vchat-agents-v1 .vag-search{max-width:390px;flex:1}#vchat-agents-v1 .vag-search label{display:block;font-size:11px;font-weight:850;margin-bottom:6px}#vchat-agents-v1 .vag-search input{height:40px;width:100%;border:1px solid #d7d5ed;background:#fff;border-radius:10px;outline:0;padding:0 12px;font-size:13px;color:#293052}#vchat-agents-v1 .vag-search input:focus{border-color:#7267ff;box-shadow:0 0 0 3px #7467ff19}#vchat-agents-v1 .vag-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}#vchat-agents-v1 .vag-filter{border:1px solid #e0e6f1;background:#fff;border-radius:10px;padding:11px 12px;font-size:11px;font-weight:800;color:#6a7992;white-space:nowrap}#vchat-agents-v1 .vag-filter.active{background:#645af3;border-color:#645af3;color:#fff}#vchat-agents-v1 .vag-agents{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:17px;align-items:start}#vchat-agents-v1 .vag-agent{min-width:0;border:1px solid #dedaf1;border-top:4px solid #6658f1;border-radius:17px;background:#fff;overflow:hidden;box-shadow:0 8px 22px rgba(32,32,75,.035);transition:box-shadow .3s,transform .3s,border-color .3s}#vchat-agents-v1 .vag-agent.highlight{box-shadow:0 0 0 3px #7369ff29,0 12px 32px #6560af25;transform:translateY(-3px)}#vchat-agents-v1 .vag-agent.paused{border-top-color:#e7aa42;opacity:.78}#vchat-agents-v1 .vag-agent-body{padding:16px 16px 12px}#vchat-agents-v1 .vag-agent-name{font-size:18px;font-weight:800;margin:0 0 8px}#vchat-agents-v1 .vag-agent-desc{line-height:1.65;color:#72718a;font-size:11.8px;min-height:145px;margin:0 0 12px}#vchat-agents-v1 .vag-detail{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #eceaf2;padding:8px 0;align-items:start}#vchat-agents-v1 .vag-detail span{color:#9290a4;font-size:10px}#vchat-agents-v1 .vag-detail b{font-size:10.5px;text-align:right;max-width:60%;line-height:1.4}#vchat-agents-v1 .vag-channels{display:flex;gap:4px;flex-wrap:wrap;margin:8px 0 10px}#vchat-agents-v1 .vag-channels span{background:#f4f1fe;color:#665495;border-radius:15px;padding:5px 7px;font-size:9px;font-weight:700}#vchat-agents-v1 .vag-agent-footer{padding:11px 13px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;background:#fcfbff;border-top:1px solid #eeebf7}#vchat-agents-v1 .vag-act{font-size:10px;font-weight:800;background:#fff;border:1px solid #dfe4f1;color:#4b5a75;border-radius:9px;padding:10px 2px}#vchat-agents-v1 .vag-act.edit{background:#625af2;color:#fff;border-color:#625af2}#vchat-agents-v1 .vag-act:hover{filter:brightness(.97)}#vchat-agents-v1 .vag-status{display:inline-block;border-radius:20px;background:#e6f8f0;color:#15885b;padding:4px 8px;font-weight:800;font-size:9px;margin-left:6px}#vchat-agents-v1 .vag-status.pause{background:#fff2d7;color:#976515}#vchat-agents-v1 .vag-empty{padding:35px;text-align:center;color:#8a92a9;grid-column:1\/-1}#vchat-agents-v1 .vag-cursor{position:absolute;z-index:30;left:0;top:0;width:25px;height:27px;pointer-events:none;opacity:0;transition:transform .55s cubic-bezier(.22,.8,.2,1),opacity .18s;filter:drop-shadow(0 2px 3px #16265455)}#vchat-agents-v1 .vag-cursor svg{width:100%;height:100%}#vchat-agents-v1 .vag-cursor.show{opacity:1}#vchat-agents-v1 .vag-cursor.click:after{content:\"\";position:absolute;width:34px;height:34px;border:2px solid #7866fb;border-radius:50%;left:-6px;top:-6px;animation:vag-wave .48s ease-out forwards}@keyframes vag-wave{from{opacity:1;transform:scale(.55)}to{opacity:0;transform:scale(1.65)}}#vchat-agents-v1 .vag-toast{position:absolute;z-index:29;right:24px;top:86px;background:#fff;border:1px solid #dfe3f5;box-shadow:0 12px 35px #41488d24;border-radius:12px;padding:12px 17px;font-weight:750;opacity:0;transform:translateY(-10px);transition:opacity .3s,transform .3s;pointer-events:none}#vchat-agents-v1 .vag-toast.show{opacity:1;transform:translateY(0)}#vchat-agents-v1 .vag-modal{position:absolute;inset:0;z-index:35;display:none;place-items:center;padding:16px;background:#171a3b77;backdrop-filter:blur(4px)}#vchat-agents-v1 .vag-modal.open{display:grid}#vchat-agents-v1 .vag-dialog{width:min(550px,100%);max-height:90%;overflow:auto;border-radius:20px;background:#fff;padding:23px;box-shadow:0 30px 75px #12122f55}#vchat-agents-v1 .vag-modal-title{display:flex;justify-content:space-between;align-items:center;gap:16px}#vchat-agents-v1 .vag-modal-title h3{margin:0;color:#20213e;font-size:22px}#vchat-agents-v1 .vag-close{border:1px solid #dcdff1;border-radius:9px;background:#fff;padding:7px 11px;color:#4b4e73}#vchat-agents-v1 .vag-dialog p{color:#68718c;line-height:1.6}#vchat-agents-v1 .vag-dialog label{display:block;font-weight:750;margin:12px 0 5px}#vchat-agents-v1 .vag-dialog input,#vchat-agents-v1 .vag-dialog textarea{width:100%;border:1px solid #dbe0ee;border-radius:10px;padding:11px;outline:none}#vchat-agents-v1 .vag-dialog textarea{min-height:95px;resize:vertical}#vchat-agents-v1 .vag-demo-chat{background:#f4f6ff;border-radius:13px;padding:15px;display:grid;gap:9px}#vchat-agents-v1 .vag-bubble{max-width:85%;border-radius:13px;padding:10px 13px;background:#fff;border:1px solid #e2e6f3;font-size:12px;line-height:1.5}#vchat-agents-v1 .vag-bubble.reply{justify-self:end;background:#e9e7ff;border-color:#d9d5fc}#vchat-agents-v1 .vag-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}#vchat-agents-v1 .vag-primary{border:0;background:#6359f1;color:#fff;border-radius:10px;padding:11px 17px;font-weight:850}#vchat-agents-v1 .vag-secondary{border:1px solid #dae0ed;background:#fff;color:#4e5780;border-radius:10px;padding:11px 17px;font-weight:800}#vchat-agents-v1 .vag-demo-note{color:#9ba4ba;text-align:center;font-size:10px;margin:18px 0 0}\n@media(max-width:1050px){#vchat-agents-v1 .vag-shell{grid-template-columns:192px minmax(0,1fr)}#vchat-agents-v1 .vag-agents{grid-template-columns:repeat(2,minmax(0,1fr))}#vchat-agents-v1 .vag-metrics{grid-template-columns:repeat(2,1fr)}}\n@media(max-width:680px){#vchat-agents-v1 .vag-shell{display:block;height:720px}#vchat-agents-v1 .vag-side{display:none}#vchat-agents-v1 .vag-main{height:100%}#vchat-agents-v1 .vag-top{padding:0 10px;height:61px}#vchat-agents-v1 .vag-top-pill{padding:0 7px;min-width:35px;height:35px;font-size:11px}#vchat-agents-v1 .vag-scroll{padding:12px}#vchat-agents-v1 .vag-stat{min-height:100px;padding:12px}#vchat-agents-v1 .vag-stat strong{font-size:25px}#vchat-agents-v1 .vag-credit-grid{grid-template-columns:repeat(2,1fr)}#vchat-agents-v1 .vag-credits{padding:13px}#vchat-agents-v1 .vag-tools{flex-direction:column;align-items:stretch;padding:12px;gap:12px}#vchat-agents-v1 .vag-search{max-width:none;width:100%}#vchat-agents-v1 .vag-filters{justify-content:space-between}#vchat-agents-v1 .vag-filter{padding:10px 8px}#vchat-agents-v1 .vag-agents{grid-template-columns:1fr}#vchat-agents-v1 .vag-agent-desc{min-height:0}#vchat-agents-v1 .vag-cursor{display:none}}\n@media(prefers-reduced-motion:reduce){#vchat-agents-v1 *,#vchat-agents-v1 *:before,#vchat-agents-v1 *:after{animation:none!important;transition:none!important}#vchat-agents-v1 .vag-cursor{display:none}}\n<\/style>\n<div class=\"vag-shell\">\n<aside class=\"vag-side\"><div class=\"vag-brand\"><img decoding=\"async\" src=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\" alt=\"Vchat by StudioVainilla\"><span style=\"font-size:20px;border:1px solid #e0e5f4;border-radius:12px;padding:5px 10px;color:#61718e\">\u2039<\/span><\/div><div class=\"vag-nav-label\">TRABAJO<\/div><nav class=\"vag-nav\" aria-label=\"M\u00f3dulos de demostraci\u00f3n\"><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2302<\/span> Inicio<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u25a2<\/span> Inbox <span class=\"vag-number\">8<\/span><\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2659<\/span> Contactos<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u25bd<\/span> CRM<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2299<\/span> Tareas<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u25a3<\/span> Agenda<\/div><\/nav><div class=\"vag-nav-label\">HERRAMIENTAS<\/div><nav class=\"vag-nav\"><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u03df<\/span> Automatizaciones<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u25a4<\/span> Respuestas y recursos<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u25eb<\/span> Conocimiento AI<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2b21<\/span> Productos y servicios<\/div><div class=\"vag-nav-item active\"><span class=\"vag-glyph\">\u2727<\/span> Agentes AI<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u24e2<\/span> Cr\u00e9ditos AI <span class=\"vag-number\" data-available>1,611<\/span><\/div><\/nav><div class=\"vag-nav-label\">INSIGHTS<\/div><nav class=\"vag-nav\"><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2301<\/span> Anal\u00edtica<\/div><div class=\"vag-nav-item\"><span class=\"vag-glyph\">\u2197<\/span> Marketing<\/div><\/nav><\/aside>\n<div class=\"vag-main\"><header class=\"vag-top\"><div><div class=\"vag-workspace\">Demo Comercial<\/div><h3>Agentes AI<\/h3><\/div><div class=\"vag-top-actions\"><button class=\"vag-top-pill\">\ud83c\uddf2\ud83c\uddfd ES<\/button><button class=\"vag-top-pill ai\" data-global-ai><span class=\"vag-spark\">\u2726<\/span> AI <span class=\"vag-switch on\" data-switch><\/span><\/button><button class=\"vag-top-pill\" aria-label=\"Buscar\">\u2315<\/button><button class=\"vag-top-pill\" aria-label=\"Mensajes\">\u25a4<\/button><button class=\"vag-top-pill\" aria-label=\"Notificaciones\">\u2662<\/button><\/div><\/header>\n<main class=\"vag-scroll\" data-scroll><section class=\"vag-metrics\"><div class=\"vag-stat primary\"><small>Agentes<\/small><strong data-total>3<\/strong><span>Configurados en este workspace<\/span><\/div><div class=\"vag-stat\"><small>Activos<\/small><strong data-active>3<\/strong><span>Disponibles para operar<\/span><\/div><div class=\"vag-stat\"><small>Pruebas y ejecuciones<\/small><strong data-tests>61<\/strong><span>Historial acumulado<\/span><\/div><div class=\"vag-stat\"><small>Consumo mensual<\/small><strong data-pct>36%<\/strong><span><span data-available>1,611<\/span> cr\u00e9ditos disponibles<\/span><\/div><\/section>\n<section class=\"vag-credits\"><div class=\"vag-credit-eyebrow\">CR\u00c9DITOS DE VCHAT AI<\/div><div class=\"vag-credits-head\"><div><div class=\"vag-credits-num\"><span data-used-big>889<\/span> <span>cr\u00e9ditos utilizados<\/span><\/div><div class=\"vag-credits-caption\">Consulta este contador antes de aumentar autonom\u00eda o activar nuevos agentes.<\/div><\/div><div class=\"vag-percent\" data-pct>36%<\/div><\/div><div class=\"vag-progress\"><span data-progress><\/span><\/div><div class=\"vag-credit-grid\"><div><small>Disponibles<\/small><b data-available>1,611<\/b><\/div><div><small>L\u00edmite mensual<\/small><b>2,500<\/b><\/div><div><small>Periodo<\/small><b data-period><\/b><\/div><div><small>Motor<\/small><b>Vchat AI<\/b><\/div><\/div><\/section>\n<section class=\"vag-tools\"><div class=\"vag-search\"><label for=\"vag-agents-search\">Buscar<\/label><input id=\"vag-agents-search\" data-search placeholder=\"Nombre, objetivo o modo\" autocomplete=\"off\"><\/div><div class=\"vag-filters\"><button class=\"vag-filter active\" data-filter=\"all\">Todos<\/button><button class=\"vag-filter\" data-filter=\"active\">Activos<\/button><button class=\"vag-filter\" data-filter=\"paused\">Pausados<\/button><button class=\"vag-filter\" data-filter=\"draft\">Borradores<\/button><\/div><\/section>\n<section class=\"vag-agents\" data-agents aria-label=\"Agentes ficticios\"><\/section><p class=\"vag-demo-note\">Demostraci\u00f3n visual \u00b7 Nombres, consumo y conversaciones ficticios \u00b7 No conectada a un workspace real<\/p><\/main><\/div><\/div>\n<div class=\"vag-cursor\" aria-hidden=\"true\" data-cursor><svg viewBox=\"0 0 28 31\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M3 2v23l6-6 5 10 5-3-5-10h9L3 2Z\" fill=\"#fff\" stroke=\"#4136b8\" stroke-width=\"2.2\" stroke-linejoin=\"round\"\/><\/svg><\/div><div class=\"vag-toast\" data-toast aria-live=\"polite\"><\/div>\n<div class=\"vag-modal\" data-modal><div class=\"vag-dialog\"><div class=\"vag-modal-title\"><h3 data-modal-title><\/h3><button class=\"vag-close\" data-close aria-label=\"Cerrar\">\u2715<\/button><\/div><div data-modal-content><\/div><div class=\"vag-dialog-actions\"><button class=\"vag-secondary\" data-close>Cerrar<\/button><button class=\"vag-primary\" data-modal-save>Guardar cambios<\/button><\/div><\/div><\/div>\n<script>\n(function(){\n const r=document.getElementById('vchat-agents-v1');if(!r||r.dataset.init)return;r.dataset.init='1';const $=s=>r.querySelector(s),$$=s=>Array.from(r.querySelectorAll(s));const format=n=>Number(n).toLocaleString('es-MX');\n const agents=[\n {name:'Sof\u00eda',role:'Atenci\u00f3n General',desc:'Asistente de atenci\u00f3n que recibe consultas, orienta a los visitantes y ofrece seguimiento inicial. Identifica necesidades, comparte informaci\u00f3n validada, registra solicitudes y facilita que cada conversaci\u00f3n llegue al \u00e1rea indicada.',knowledge:'Preguntas frecuentes \u00b7 Servicios \u00b7 Pol\u00edticas',behavior:'C\u00e1lido \u00b7 Profesional \u00b7 Resolutivo',credits:340,status:'active',channels:['Chat web','Facebook','Instagram','WhatsApp'],greeting:'Hola, quiero informaci\u00f3n sobre sus servicios.',reply:'\u00a1Hola! Con gusto te ayudo. \u00bfQu\u00e9 servicio te interesa conocer?'},\n {name:'Diego',role:'Soporte T\u00e9cnico',desc:'Agente especializado en soporte t\u00e9cnico e integraciones. Ayuda a resolver dudas de configuraci\u00f3n, identifica incidencias, explica procesos paso a paso y transfiere al equipo humano cuando un caso requiere atenci\u00f3n especializada.',knowledge:'Integraciones \u00b7 Manuales \u00b7 Soporte',behavior:'Preciso \u00b7 Paciente \u00b7 Claro',credits:306,status:'active',channels:['Chat web','WhatsApp','Facebook'],greeting:'No consigo conectar mi canal, \u00bfme ayudas?',reply:'Claro. Revisaremos la conexi\u00f3n y los permisos paso a paso.'},\n {name:'Alex',role:'Ventas y Comercial',desc:'Agente de ventas que identifica oportunidades, aclara dudas, presenta productos y propone el siguiente paso. Su objetivo es ayudar al prospecto a evaluar una soluci\u00f3n y solicitar una demostraci\u00f3n o asesor\u00eda.',knowledge:'Cat\u00e1logo \u00b7 Tarifas \u00b7 Promociones',behavior:'Consultivo \u00b7 Proactivo \u00b7 Persuasivo',credits:243,status:'active',channels:['Chat web','Instagram','WhatsApp'],greeting:'\u00bfPuedo agendar una demostraci\u00f3n?',reply:'\u00a1Claro! Te comparto las opciones para elegir un horario.'}\n ];\n let filter='all',term='',ai=true,tests=61,modalAgent=0,mode='edit',running=false,phaseTimer=null;const sc=$('[data-scroll]'),list=$('[data-agents]'),cursor=$('[data-cursor]'),modal=$('[data-modal]');\n const today=new Date();const end=new Date(today.getFullYear(),today.getMonth()+1,16);const start=new Date(end.getFullYear(),end.getMonth()-1,16);$('[data-period]').textContent=[start,end].map(d=>[d.getFullYear(),String(d.getMonth()+1).padStart(2,'0'),String(d.getDate()).padStart(2,'0')].join('-')).join(' \u2192 ');\n function metrics(){let used=agents.reduce((n,a)=>n+a.credits,0),available=2500-used,pct=Math.round(100*used\/2500);$$('[data-available]').forEach(x=>x.textContent=format(available));$$('[data-pct]').forEach(x=>x.textContent=pct+'%');$('[data-used-big]').textContent=format(used);$('[data-tests]').textContent=tests;$('[data-active]').textContent=agents.filter(a=>a.status==='active').length;$('[data-total]').textContent=agents.length;$('[data-progress]').style.width=pct+'%';}\n function render(){const shown=agents.map((a,i)=>({...a,index:i})).filter(a=>(filter==='all'||a.status===filter)&&(a.name+' '+a.role+' '+a.desc).toLowerCase().includes(term.toLowerCase()));list.innerHTML=shown.length?shown.map(a=>`<article class=\"vag-agent ${a.status==='paused'?'paused':''}\" data-agent=\"${a.index}\"><div class=\"vag-agent-body\"><h3 class=\"vag-agent-name\">${a.name} <span class=\"vag-status ${a.status==='paused'?'pause':''}\">${a.status==='active'?'Activo':'Pausado'}<\/span><\/h3><p class=\"vag-agent-desc\">${a.desc}<\/p><div class=\"vag-detail\"><span>Departamentos<\/span><b>${a.role}<\/b><\/div><div class=\"vag-detail\"><span>Conocimiento<\/span><b>${a.knowledge}<\/b><\/div><div class=\"vag-detail\"><span>Comportamiento<\/span><b>${a.behavior}<\/b><\/div><div class=\"vag-detail\"><span>Autonom\u00eda<\/span><b>Controlado<\/b><\/div><div class=\"vag-detail\"><span>Cr\u00e9ditos del ciclo<\/span><b>${a.credits} usados<\/b><\/div><div class=\"vag-channels\">${a.channels.map(c=>'<span>'+c+'<\/span>').join('')}<\/div><\/div><div class=\"vag-agent-footer\"><button class=\"vag-act edit\" data-action=\"edit\" data-i=\"${a.index}\">Editar<\/button><button class=\"vag-act\" data-action=\"test\" data-i=\"${a.index}\">Probar<\/button><button class=\"vag-act\" data-action=\"pause\" data-i=\"${a.index}\">${a.status==='active'?'Pausar':'Activar'}<\/button><button class=\"vag-act\" data-action=\"detail\" data-i=\"${a.index}\">Ver<\/button><\/div><\/article>`).join(''):'<div class=\"vag-empty\">No se encontraron agentes con estos filtros.<\/div>';metrics();}\n function toast(msg){const t=$('[data-toast]');t.textContent=msg;t.classList.add('show');clearTimeout(toast.timer);toast.timer=setTimeout(()=>t.classList.remove('show'),2200)}\n function setFilter(f){filter=f;$$('[data-filter]').forEach(b=>b.classList.toggle('active',b.dataset.filter===f));render()}\n function openModal(i,m){modalAgent=i;mode=m;const a=agents[i];$('[data-modal-title]').textContent=m==='test'?'Probar agente: '+a.name:m==='edit'?'Editar agente: '+a.name:'Detalles de '+a.name;const c=$('[data-modal-content]');if(m==='test'){c.innerHTML=`<p>Vista ilustrativa de una conversaci\u00f3n atendida por <strong>${a.name}<\/strong>.<\/p><div class=\"vag-demo-chat\"><div class=\"vag-bubble\">${a.greeting}<\/div><div class=\"vag-bubble reply\" data-reply>\u25cf \u25cf \u25cf<\/div><\/div>`;$('[data-modal-save]').textContent='Repetir prueba';tests++;a.credits+=2;metrics();setTimeout(()=>{const x=$('[data-reply]');if(x&&mode==='test'&&modal.classList.contains('open'))x.textContent=a.reply},850)}else if(m==='edit'){c.innerHTML=`<p>Edita la informaci\u00f3n de demostraci\u00f3n de este agente.<\/p><label>Nombre<\/label><input data-edit-name value=\"${a.name}\" maxlength=\"35\"><label>Objetivo del agente<\/label><textarea data-edit-desc maxlength=\"450\">${a.desc}<\/textarea>`;$('[data-modal-save]').textContent='Guardar cambios'}else{c.innerHTML=`<p>${a.desc}<\/p><div class=\"vag-detail\"><span>Departamento<\/span><b>${a.role}<\/b><\/div><div class=\"vag-detail\"><span>Estado<\/span><b>${a.status==='active'?'Activo':'Pausado'}<\/b><\/div><div class=\"vag-detail\"><span>Cr\u00e9ditos usados<\/span><b>${a.credits}<\/b><\/div>`;$('[data-modal-save]').textContent='Probar agente'}modal.classList.add('open')}\n function closeModal(){modal.classList.remove('open')}r.addEventListener('click',e=>{const btn=e.target.closest('[data-action]');if(btn){const i=+btn.dataset.i,m=btn.dataset.action;if(m==='pause'){agents[i].status=agents[i].status==='active'?'paused':'active';render();toast(agents[i].name+': '+(agents[i].status==='active'?'agente activado':'agente pausado'))}else openModal(i,m)}const fil=e.target.closest('[data-filter]');if(fil)setFilter(fil.dataset.filter);if(e.target.closest('[data-close]'))closeModal();if(e.target.closest('[data-global-ai]')){ai=!ai;$('[data-switch]').classList.toggle('on',ai);toast(ai?'AI global activada':'AI global en pausa')}if(e.target.closest('[data-modal-save]')){const a=agents[modalAgent];if(mode==='edit'){const n=$('[data-edit-name]').value.trim(),d=$('[data-edit-desc]').value.trim();if(n&&d){a.name=n;a.desc=d;render();closeModal();toast('Cambios guardados en la demostraci\u00f3n')}}else openModal(modalAgent,'test')}});modal.addEventListener('click',e=>{if(e.target===modal)closeModal()});$('[data-search]').addEventListener('input',e=>{term=e.target.value;render()});\n function moveTo(el){if(!el)return;const rr=r.getBoundingClientRect(),er=el.getBoundingClientRect();cursor.classList.add('show');cursor.style.transform=`translate(${er.left-rr.left+er.width*.57}px,${er.top-rr.top+Math.min(er.height*.5,35)}px)`}function pulse(){cursor.classList.remove('click');void cursor.offsetWidth;cursor.classList.add('click');setTimeout(()=>cursor.classList.remove('click'),550)}function sleep(ms){return new Promise(resolve=>setTimeout(resolve,ms))}async function scrollToEl(el){if(!el)return;let a=sc.getBoundingClientRect(),b=el.getBoundingClientRect();if(b.top<a.top+20||b.bottom>a.bottom-15)sc.scrollTop+=b.top-a.top-a.height*.26;await sleep(420)}\n const reduce=window.matchMedia('(prefers-reduced-motion: reduce)').matches;const steps=async()=>{if(running||reduce)return;running=true;while(running){if(document.hidden||!r.isConnected){await sleep(900);continue}if(!onScreen){await sleep(800);continue}const f=$('[data-filter=\"active\"]');await scrollToEl(f);moveTo(f);await sleep(700);pulse();setFilter('active');await sleep(900);let card=$('[data-agent=\"1\"]');await scrollToEl(card);moveTo(card);card?.classList.add('highlight');await sleep(900);const test=$('[data-action=\"test\"][data-i=\"1\"]');moveTo(test);await sleep(620);pulse();openModal(1,'test');await sleep(1950);moveTo($('[data-close]'));pulse();closeModal();await sleep(450);let pause=$('[data-action=\"pause\"][data-i=\"2\"]');await scrollToEl(pause);moveTo(pause);await sleep(530);pulse();agents[2].status='paused';render();toast('Alex: agente pausado');await sleep(880);const paused=$('[data-filter=\"paused\"]');moveTo(paused);await sleep(450);pulse();setFilter('paused');await sleep(850);const resume=$('[data-action=\"pause\"][data-i=\"2\"]');moveTo(resume);await sleep(520);pulse();agents[2].status='active';setFilter('all');toast('Alex: agente activado');await sleep(750);const search=$('[data-search]');await scrollToEl(search);moveTo(search);await sleep(420);pulse();search.value='Sof\u00eda';term='Sof\u00eda';render();await sleep(1100);search.value='';term='';render();await sleep(300);const aiBtn=$('[data-global-ai]');moveTo(aiBtn);await sleep(550);pulse();ai=false;$('[data-switch]').classList.remove('on');toast('AI global en pausa');await sleep(950);moveTo(aiBtn);pulse();ai=true;$('[data-switch]').classList.add('on');toast('AI global activada');await sleep(880);sc.scrollTo({top:0,behavior:'smooth'});await sleep(1100);cursor.classList.remove('show');$$('.vag-agent.highlight').forEach(a=>a.classList.remove('highlight'));await sleep(700)}};\n let onScreen=false;const observer=new IntersectionObserver(entries=>{onScreen=entries[0].isIntersecting;if(onScreen&&!running)steps()},{threshold:.22});observer.observe(r);render();\n})();\n<\/script>\n<\/div>\n<\/body><\/html><\/template>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Omnicanal + CRM + Automatizaci\u00f3n + Agentes AI Tu \u201cHola\u201d merece seguimiento. Centraliza conversaciones, convierte contactos en oportunidades, agenda, asigna tareas, automatiza procesos y deja trabajar a tus Agentes AI con reglas claras. Comenzar 14 d\u00edas gratis Ver precios Ingresar Sin cargos hoy \u00b7 configura tu workspace \u00b7 t\u00fa controlas cu\u00e1ndo interviene AI. \u00bfYa usas [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-48","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Vchat By StudioVainilla | Chat Multiplataforma + AI<\/title>\n<meta name=\"description\" content=\"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/vchat.com.mx\/pt\/\" \/>\n<meta property=\"og:locale\" content=\"pt_PT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Vchat By StudioVainilla | Chat AI Multiplataforma\" \/>\n<meta property=\"og:description\" content=\"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vchat.com.mx\/pt\/\" \/>\n<meta property=\"og:site_name\" content=\"Vchat\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-23T02:22:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Seccion-Inbox-Vchat-by-StudioVainilla.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1777\" \/>\n\t<meta property=\"og:image:height\" content=\"885\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"Vchat By StudioVainilla | Chat AI Multiplataforma\" \/>\n<meta name=\"twitter:description\" content=\"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2023\/08\/handsome-business-partners.jpg\" \/>\n<meta name=\"twitter:label1\" content=\"Tempo estimado de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"16 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vchat.com.mx\/\",\"url\":\"https:\/\/vchat.com.mx\/\",\"name\":\"Vchat By StudioVainilla | Chat Multiplataforma + AI\",\"isPartOf\":{\"@id\":\"https:\/\/vchat.com.mx\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vchat.com.mx\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vchat.com.mx\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366\",\"datePublished\":\"2023-08-04T04:55:25+00:00\",\"dateModified\":\"2026-10-23T02:22:56+00:00\",\"description\":\"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.\",\"breadcrumb\":{\"@id\":\"https:\/\/vchat.com.mx\/#breadcrumb\"},\"inLanguage\":\"pt-PT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vchat.com.mx\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/vchat.com.mx\/#primaryimage\",\"url\":\"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366\",\"contentUrl\":\"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vchat.com.mx\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/vchat.com.mx\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Vchat &#8211; Chat AI Multiplataforma\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/vchat.com.mx\/#website\",\"url\":\"https:\/\/vchat.com.mx\/\",\"name\":\"Vchat\",\"description\":\"Tus Bandejas de Chat, en una sola.\",\"publisher\":{\"@id\":\"https:\/\/vchat.com.mx\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/vchat.com.mx\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-PT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/vchat.com.mx\/#organization\",\"name\":\"Vchat\",\"url\":\"https:\/\/vchat.com.mx\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/vchat.com.mx\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\",\"contentUrl\":\"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png\",\"width\":2172,\"height\":724,\"caption\":\"Vchat\"},\"image\":{\"@id\":\"https:\/\/vchat.com.mx\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Vchat by StudioVainilla | Chat Multim\u00eddia + IA","description":"Unifica seus canais de chat, agiliza o atendimento ao cliente e cria chatbots com o ChatGPT no WhatsApp, sites, Messenger, Instagram DM e muito mais.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/vchat.com.mx\/pt\/","og_locale":"pt_PT","og_type":"article","og_title":"Vchat By StudioVainilla | Chat AI Multiplataforma","og_description":"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.","og_url":"https:\/\/vchat.com.mx\/pt\/","og_site_name":"Vchat","article_modified_time":"2026-10-23T02:22:56+00:00","og_image":[{"width":1777,"height":885,"url":"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Seccion-Inbox-Vchat-by-StudioVainilla.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_title":"Vchat By StudioVainilla | Chat AI Multiplataforma","twitter_description":"Unifica tus canales de chat, agiliza la atenci\u00f3n al cliente, crea chatbots con ChatGPT en WhatsApp, sitios web, Messenger, Instagram DM y m\u00e1s.","twitter_image":"https:\/\/vchat.com.mx\/wp-content\/uploads\/2023\/08\/handsome-business-partners.jpg","twitter_misc":{"Tempo estimado de leitura":"16 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/vchat.com.mx\/","url":"https:\/\/vchat.com.mx\/","name":"Vchat by StudioVainilla | Chat Multim\u00eddia + IA","isPartOf":{"@id":"https:\/\/vchat.com.mx\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vchat.com.mx\/#primaryimage"},"image":{"@id":"https:\/\/vchat.com.mx\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366","datePublished":"2023-08-04T04:55:25+00:00","dateModified":"2026-10-23T02:22:56+00:00","description":"Unifica seus canais de chat, agiliza o atendimento ao cliente e cria chatbots com o ChatGPT no WhatsApp, sites, Messenger, Instagram DM e muito mais.","breadcrumb":{"@id":"https:\/\/vchat.com.mx\/#breadcrumb"},"inLanguage":"pt-PT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vchat.com.mx\/"]}]},{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/vchat.com.mx\/#primaryimage","url":"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366","contentUrl":"https:\/\/cdn.simpleicons.org\/whatsapp\/25D366"},{"@type":"BreadcrumbList","@id":"https:\/\/vchat.com.mx\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/vchat.com.mx\/"},{"@type":"ListItem","position":2,"name":"Vchat &#8211; Chat AI Multiplataforma"}]},{"@type":"WebSite","@id":"https:\/\/vchat.com.mx\/#website","url":"https:\/\/vchat.com.mx\/","name":"Vchat","description":"Os seus Tabuleiros de Chat, num s\u00f3.","publisher":{"@id":"https:\/\/vchat.com.mx\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/vchat.com.mx\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-PT"},{"@type":"Organization","@id":"https:\/\/vchat.com.mx\/#organization","name":"Vchat","url":"https:\/\/vchat.com.mx\/","logo":{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/vchat.com.mx\/#\/schema\/logo\/image\/","url":"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png","contentUrl":"https:\/\/vchat.com.mx\/wp-content\/uploads\/2026\/09\/Imagotipo-Vchat-by-StudioVainilla.png","width":2172,"height":724,"caption":"Vchat"},"image":{"@id":"https:\/\/vchat.com.mx\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/pages\/48","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/comments?post=48"}],"version-history":[{"count":255,"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/pages\/48\/revisions"}],"predecessor-version":[{"id":2495,"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/pages\/48\/revisions\/2495"}],"wp:attachment":[{"href":"https:\/\/vchat.com.mx\/pt\/wp-json\/wp\/v2\/media?parent=48"}],"curies":[{"name":"bom jogo","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}