{"id":8393,"date":"2026-05-30T00:25:18","date_gmt":"2026-05-30T00:25:18","guid":{"rendered":"https:\/\/voicit.com\/?page_id=8393"},"modified":"2026-05-30T00:25:18","modified_gmt":"2026-05-30T00:25:18","slug":"controllo-delle-apparecchiature","status":"publish","type":"page","link":"https:\/\/voicit.com\/it\/control-de-equipo\/","title":{"rendered":"Voce per controllare il tuo team"},"content":{"rendered":"\n<!--\n  VOICIT \u2014 Landing: Control de equipo\n  URL: \/control-de-equipo\/\n  Embebida como Custom HTML en Gutenberg.\n-->\n\n<!-- Overrides para forzar full-width en la p\u00e1gina de WP (Astra), ocultar el page title generado por el tema, y resetear botones que el tema styliza con el color de marca -->\n<style id=\"vl-wp-overrides\">\n  \/* \u2500\u2500 1) FULL-WIDTH: anular TODOS los wrappers de Astra incluidos los IDs espec\u00edficos \u2500\u2500\n        Jerarqu\u00eda real: body > #page > #content > .ast-container > #primary > main#main > article#post-8393 > .entry-content > .vl-landing *\/\n  body.page-id-8393 div#page.hfeed.site,\n  body.page-id-8393 div#content.site-content,\n  body.page-id-8393 div#content,\n  body.page-id-8393 .ast-container,\n  body.page-id-8393 div#primary.content-area,\n  body.page-id-8393 main#main.site-main,\n  body.page-id-8393 article#post-8393,\n  body.page-id-8393 article.page,\n  body.page-id-8393 .entry-content,\n  body.page-id-8393 .entry-content.clear {\n    max-width: 100% !important;\n    width: 100% !important;\n    padding: 0 !important;\n    margin: 0 !important;\n  }\n\n  \/* Variables WordPress de padding global *\/\n  body.page-id-8393 {\n    --wp--style--root--padding-top: 0 !important;\n    --wp--style--root--padding-right: 0 !important;\n    --wp--style--root--padding-bottom: 0 !important;\n    --wp--style--root--padding-left: 0 !important;\n  }\n\n  \/* Bloques Gutenberg envolventes *\/\n  body.page-id-8393 .wp-block-html,\n  body.page-id-8393 .wp-site-blocks,\n  body.page-id-8393 .is-layout-flow,\n  body.page-id-8393 .is-layout-constrained,\n  body.page-id-8393 .has-global-padding {\n    padding: 0 !important;\n    margin: 0 !important;\n    max-width: 100% !important;\n    width: 100% !important;\n  }\n\n  \/* El .vl-landing fuerza ancho viewport usando transform \u2014 m\u00e9todo bulletproof *\/\n  body.page-id-8393 .vl-landing {\n    width: 100vw !important;\n    max-width: 100vw !important;\n    position: relative !important;\n    left: 50% !important;\n    transform: translateX(-50%) !important;\n    margin: 0 !important;\n  }\n\n  \/* \u2500\u2500 3) Ocultar t\u00edtulo de p\u00e1gina del tema \u2500\u2500 *\/\n  body.page-id-8393 .entry-header,\n  body.page-id-8393 .ast-page-title-wrapper,\n  body.page-id-8393 .ast-archive-description,\n  body.page-id-8393 .entry-title,\n  body.page-id-8393 h1.entry-title,\n  body.page-id-8393 .page-title {\n    display: none !important;\n  }\n  body.page-id-8393 .entry-content > *:not(.vl-landing) { display: none; }\n\n  \/* \u2500\u2500 4) RESET BOTONES \u2014 Astra pinta TODOS los <button> con el color de marca (#E7FE15).\n        Hay que forzar nuestros colores espec\u00edficos en cada bot\u00f3n del mockup. \u2500\u2500 *\/\n  .vl-landing button,\n  .vl-landing .vl-btn {\n    box-shadow: none !important;\n    text-transform: none !important;\n    letter-spacing: normal !important;\n    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif !important;\n  }\n\n  \/* File picker (Paso 1) \u2014 bot\u00f3n \"Subir informe\" *\/\n  .vl-landing .vl-mk-fp-btn {\n    background: #ECECEC !important;\n    color: #9A9A9A !important;\n    border: none !important;\n  }\n  .vl-landing .vl-mk-filepicker.is-visible .vl-mk-fp-btn.is-enabled,\n  .vl-landing .vl-mk-fp-btn.is-enabled {\n    background: #161616 !important;\n    color: #FFFFFF !important;\n  }\n\n  \/* Chat (Paso 2) \u2014 botones \"S\u00ed, generar\" \/ \"Ajustar\" \/ \u2715 *\/\n  .vl-landing .vl-mk-chat-btn {\n    background: #F2F2F2 !important;\n    color: #424242 !important;\n    border: 1px solid #E5E5E5 !important;\n  }\n  .vl-landing .vl-mk-chat-btn:hover {\n    background: #E5E5E5 !important;\n    border-color: #161616 !important;\n    color: #161616 !important;\n  }\n  .vl-landing .vl-mk-chat-btn--primary {\n    background: #161616 !important;\n    color: #FFFFFF !important;\n    border-color: #161616 !important;\n  }\n  .vl-landing .vl-mk-chat-btn--primary:hover {\n    background: #2C2C2C !important;\n    border-color: #2C2C2C !important;\n    color: #FFFFFF !important;\n  }\n  .vl-landing .vl-mk-chat-li-delete {\n    background: rgba(0,0,0,0.06) !important;\n    color: #161616 !important;\n    border: none !important;\n  }\n  .vl-landing .vl-mk-chat-li-delete:hover {\n    background: #FCEAEA !important;\n    color: #DC2626 !important;\n  }\n\n  \/* Editor (Paso 3) \u2014 botones de iconos formato\/longitud + acci\u00f3n \"Guardar plantilla\" *\/\n  .vl-landing .vl-mk-editor-icon-btn {\n    background: transparent !important;\n    color: #4B4B4B !important;\n    border: none !important;\n  }\n  .vl-landing .vl-mk-editor-icon-btn:hover { background: #F0F0F0 !important; }\n  .vl-landing .vl-mk-editor-icon-btn.is-active {\n    background: #E5E5E5 !important;\n    color: #161616 !important;\n  }\n  .vl-landing .vl-mk-editor-action {\n    background: #FFFFFF !important;\n    color: #424242 !important;\n    border: 1px solid #DDDDDD !important;\n  }\n  .vl-landing .vl-mk-editor-action:hover {\n    background: #F5F5F5 !important;\n    border-color: #161616 !important;\n    color: #161616 !important;\n  }\n  .vl-landing .vl-mk-editor-action--primary {\n    background: #161616 !important;\n    color: #FFFFFF !important;\n    border-color: #161616 !important;\n  }\n  .vl-landing .vl-mk-editor-action--primary:hover {\n    background: #2C2C2C !important;\n    border-color: #2C2C2C !important;\n    color: #FFFFFF !important;\n  }\n<\/style>\n\n<style>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   VOICIT LANDING \u2014 Design System\n   Basado en gu\u00eda de marca oficial\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');\n\n\/* Reset dentro del contenedor *\/\n.vl-landing *, .vl-landing *::before, .vl-landing *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\n.vl-landing {\n  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;\n  color: #161616;\n  line-height: 1.6;\n  \/* overflow-x: clip evita scroll horizontal SIN romper position:sticky de los descendientes *\/\n  overflow-x: clip;\n  \/* Full-width breakout robusto: funciona si el parent es boxed (1200px) o ya es full-width.\n     calc(50% - 50vw) da un margin negativo solo cuando el parent es m\u00e1s estrecho que el viewport. *\/\n  width: 100vw;\n  margin-left: calc(50% - 50vw);\n  margin-right: calc(50% - 50vw);\n  position: relative;\n}\n\n\/* \u2500\u2500\u2500 Tipograf\u00eda \u2500\u2500\u2500 *\/\n.vl-landing h1 {\n  font-size: clamp(36px, 5vw, 56px);\n  font-weight: 800;\n  line-height: 1.1;\n  letter-spacing: -0.02em;\n  color: #161616;\n}\n\/* BALANCE GLOBAL DE T\u00cdTULOS: todos los h1\/h2\/h3 reparten sus l\u00edneas de forma\n   equilibrada para que nunca quede una palabra hu\u00e9rfana sola en la \u00faltima l\u00ednea\n   (sobre todo en tablet\/m\u00f3vil). En desktop, los t\u00edtulos que caben en una l\u00ednea\n   no se ven afectados (balance es no-op). Se aplica SIEMPRE, sin necesidad de\n   a\u00f1adir clases por t\u00edtulo. Las clases .vl-h1-balance\/.vl-h2-balance se mantienen\n   por compatibilidad y para los <br> que se ocultan en m\u00f3vil. *\/\n.vl-landing h1,\n.vl-landing h2,\n.vl-landing h3,\n.vl-landing .vl-h1-balance,\n.vl-landing .vl-h2-balance {\n  text-wrap: pretty;\n  text-wrap: balance;\n}\n\n.vl-landing h2 {\n  font-size: clamp(28px, 3.5vw, 42px);\n  font-weight: 700;\n  line-height: 1.2;\n  letter-spacing: -0.01em;\n  color: #161616;\n}\n\n.vl-landing h3 {\n  font-size: clamp(20px, 2.5vw, 28px);\n  font-weight: 700;\n  line-height: 1.3;\n  color: #161616;\n}\n\n.vl-landing h4 {\n  font-size: 18px;\n  font-weight: 600;\n  color: #161616;\n}\n\n.vl-landing p {\n  font-size: 18px;\n  line-height: 1.7;\n  color: #424242;\n}\n\n.vl-landing .text-secondary {\n  color: #6E6E6E;\n}\n\n.vl-landing .text-small {\n  font-size: 15px;\n}\n\n\/* \u2500\u2500\u2500 Layout \u2500\u2500\u2500 *\/\n.vl-container {\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 24px;\n}\n\n.vl-container--narrow {\n  max-width: 900px;\n  margin: 0 auto;\n  padding: 0 24px;\n}\n\n.vl-section {\n  padding: 100px 0;\n}\n\n.vl-section--alt {\n  background: #F2F2F2;\n}\n\n.vl-section--dark {\n  background: #000000;\n  color: #FFFFFF;\n}\n\n\/* P\u00edldora del CTA final \u2014 contenedor gris claro estilo c\u00e1psula (stadium shape) sobre fondo blanco *\/\n.vl-cta-pill {\n  background: #F2F2F2;\n  border-radius: 9999px;          \/* el browser clampea a la mitad del lado menor \u2192 forma c\u00e1psula *\/\n  padding: 56px 80px;\n  max-width: 980px;\n  margin: 0 auto;\n  color: #161616;\n}\n\/* Botones dentro de la p\u00edldora ajustados al fondo claro *\/\n.vl-cta-pill .vl-btn--brand {\n  background: #161616 !important;\n  color: #FFFFFF !important;\n}\n.vl-cta-pill .vl-btn--brand:hover {\n  background: #2C2C2C !important;\n}\n.vl-cta-pill .vl-btn--secondary {\n  background: transparent !important;\n  border-color: #161616 !important;\n  color: #161616 !important;\n}\n.vl-cta-pill .vl-btn--secondary:hover {\n  border-color: #161616 !important;\n  background: rgba(0,0,0,0.04) !important;\n}\n@media (max-width: 768px) {\n  .vl-cta-pill {\n    padding: 56px 28px;\n    border-radius: 36px;\n  }\n}\n@media (max-width: 480px) {\n  .vl-cta-pill {\n    padding: 48px 22px;\n    border-radius: 28px;\n  }\n}\n\n.vl-section--dark h2,\n.vl-section--dark h3,\n.vl-section--dark h4 {\n  color: #FFFFFF;\n}\n\n.vl-section--dark p {\n  color: #B0B0B0;\n}\n\n\/* \u2500\u2500\u2500 Botones \u2500\u2500\u2500 *\/\n.vl-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 16px 32px;\n  font-family: 'Manrope', sans-serif;\n  font-size: 16px;\n  font-weight: 600;\n  border-radius: 12px;\n  text-decoration: none !important;\n  cursor: pointer;\n  transition: all 0.3s ease;\n  border: none;\n}\n\n.vl-btn--primary {\n  background: #161616 !important;\n  color: #FFFFFF !important;\n}\n\n.vl-btn--primary:hover {\n  background: #2C2C2C !important;\n}\n\n.vl-btn--secondary {\n  background: transparent !important;\n  color: #161616 !important;\n  border: 2px solid #DCDCDC;\n}\n\n.vl-btn--secondary:hover {\n  border-color: #161616;\n}\n\n.vl-btn--brand {\n  background: #E7FE15 !important;\n  color: #161616 !important;\n  font-weight: 700;\n}\n\n.vl-btn--brand:hover {\n  background: #CDE213 !important;\n}\n\n\/* \u2500\u2500\u2500 Badge \u2500\u2500\u2500 *\/\n.vl-badge {\n  display: inline-block;\n  padding: 6px 16px;\n  border-radius: 100px;\n  font-size: 13px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n}\n\n.vl-badge--brand {\n  background: #161616;\n  color: #E7FE15;\n}\n\n.vl-badge--green {\n  background: #DBF0DE;\n  color: #29A63B;\n}\n\n.vl-badge--blue {\n  background: #E5F5FC;\n  color: #63C2ED;\n}\n\n.vl-badge--orange {\n  background: #FCE9DF;\n  color: #ED7840;\n}\n\n\/* \u2500\u2500\u2500 Cards \u2500\u2500\u2500 *\/\n.vl-card {\n  background: #FFFFFF;\n  border: 1px solid #DCDCDC;\n  border-radius: 16px;\n  padding: 36px;\n  transition: all 0.3s ease;\n}\n\n.vl-card:hover {\n  box-shadow: 0 8px 32px rgba(0,0,0,0.08);\n  transform: translateY(-4px);\n}\n\n.vl-card--dark {\n  background: #161616;\n  border-color: #2C2C2C;\n  color: #FFFFFF;\n}\n\n.vl-card--dark h3, .vl-card--dark h4 {\n  color: #FFFFFF;\n}\n\n.vl-card--dark p {\n  color: #9A9A9A;\n}\n\n\/* \u2500\u2500\u2500 Grid \u2500\u2500\u2500 *\/\n.vl-grid-2 {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 32px;\n}\n\n.vl-grid-3 {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 32px;\n}\n\n\/* \u2500\u2500\u2500 Screenshot mock \u2500\u2500\u2500 *\/\n.vl-screenshot {\n  width: 100%;\n  border-radius: 16px;\n  border: 1px solid #DCDCDC;\n  box-shadow: 0 16px 48px rgba(0,0,0,0.1);\n  overflow: hidden;\n}\n\n.vl-screenshot img {\n  width: 100%;\n  height: auto;\n  display: block;\n}\n\n\/* Placeholder para screenshots (reemplazar con img reales) *\/\n.vl-screenshot-placeholder {\n  width: 100%;\n  aspect-ratio: 16\/10;\n  border-radius: 16px;\n  border: 2px dashed #DCDCDC;\n  background: #FAFAFA;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  color: #9A9A9A;\n  text-align: center;\n  padding: 20px;\n}\n\n\/* \u2500\u2500\u2500 Iconos decorativos \u2500\u2500\u2500 *\/\n.vl-icon {\n  width: 56px;\n  height: 56px;\n  border-radius: 14px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 24px;\n  flex-shrink: 0;\n}\n\n.vl-icon--brand {\n  background: #161616;\n  color: #E7FE15;\n}\n\n.vl-icon--light {\n  background: #F2F2F2;\n  color: #161616;\n}\n\n.vl-icon img {\n  width: 32px;\n  height: 32px;\n  object-fit: contain;\n}\n\n.vl-icon img.vl-icon-invert {\n  filter: invert(1);\n}\n\n\/* \u2500\u2500\u2500 Tooltip info icon \u2500\u2500\u2500 *\/\n.vl-info-tooltip {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  cursor: default;\n  margin-left: 6px;\n  vertical-align: middle;\n}\n\n.vl-info-tooltip .vl-info-icon {\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: #E8E8E8;\n  color: #777;\n  font-size: 12px;\n  font-weight: 700;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  flex-shrink: 0;\n  transition: background 0.2s;\n}\n\n.vl-info-tooltip:hover .vl-info-icon {\n  background: #D0D0D0;\n  color: #444;\n}\n\n.vl-info-tooltip .vl-info-text {\n  position: absolute;\n  bottom: calc(100% + 10px);\n  left: 50%;\n  transform: translateX(-50%);\n  background: #161616;\n  color: #FFFFFF;\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 1.5;\n  padding: 12px 16px;\n  border-radius: 10px;\n  width: 320px;\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity 0.25s, visibility 0.25s;\n  pointer-events: none;\n  z-index: 10;\n  box-shadow: 0 4px 16px rgba(0,0,0,0.15);\n}\n\n.vl-info-tooltip .vl-info-text::after {\n  content: '';\n  position: absolute;\n  top: 100%;\n  left: 50%;\n  transform: translateX(-50%);\n  border: 6px solid transparent;\n  border-top-color: #161616;\n}\n\n.vl-info-tooltip:hover .vl-info-text {\n  opacity: 1;\n  visibility: visible;\n}\n\n\/* \u2500\u2500 Card flip on hover \u2500\u2500 *\/\n.vl-card--flip {\n  position: relative;\n  min-height: 120px;\n  cursor: default;\n}\n.vl-card-flip-front {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 20px;\n}\n.vl-card-flip-front h4 {\n  font-size: 20px;\n  margin: 0;\n}\n.vl-card-flip-back {\n  position: absolute;\n  top: 0; left: 0; right: 0; bottom: 0;\n  background: #FFFFFF;\n  border-radius: 16px;\n  padding: 32px;\n  display: flex;\n  align-items: center;\n  opacity: 0;\n  transition: opacity 0.3s ease;\n  pointer-events: none;\n  z-index: 2;\n}\n.vl-card--flip:hover .vl-card-flip-back {\n  opacity: 1;\n  pointer-events: auto;\n}\n\/* Balancea las l\u00edneas del p\u00e1rrafo del back para evitar palabras hu\u00e9rfanas *\/\n.vl-card-flip-back p {\n  text-wrap: pretty;\n  text-wrap: balance;\n  max-width: 40ch;\n  margin-left: auto;\n  margin-right: auto;\n}\n\n\/* \u2500\u2500\u2500 Separador gradiente Voicit \u2500\u2500\u2500 *\/\n.vl-gradient-bar {\n  height: 4px;\n  background: linear-gradient(90deg, #E7FE15 0%, #B8CC76 50%, #56AB91 100%);\n  border-radius: 2px;\n}\n\n\/* \u2500\u2500\u2500 Step indicator \u2500\u2500\u2500 *\/\n.vl-step-number {\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background: #161616;\n  color: #E7FE15;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 20px;\n  font-weight: 800;\n  flex-shrink: 0;\n  line-height: 1;\n}\n\/* Resetea margin\/line-height del h3 dentro de la fila step para que quede\n   centrado vertical con el n\u00famero (sin esto, Astra mete margin-top al h3). *\/\n.vl-step-row .vl-step-number + h3,\n.vl-landing .vl-step-row h3 {\n  margin: 0 !important;\n  padding: 0 !important;\n  line-height: 1.25;\n  display: flex;\n  align-items: center;\n}\n\n\/* \u2500\u2500\u2500 Animaciones (scroll reveal) \u2500\u2500\u2500 *\/\n.vl-reveal {\n  opacity: 0;\n  transform: translateY(30px);\n  transition: opacity 0.7s ease, transform 0.7s ease;\n}\n\n.vl-reveal.is-visible {\n  opacity: 1;\n  transform: translateY(0);\n}\n\n.vl-reveal-delay-1 { transition-delay: 0.1s; }\n.vl-reveal-delay-2 { transition-delay: 0.2s; }\n.vl-reveal-delay-3 { transition-delay: 0.3s; }\n\n\/* Animaci\u00f3n float suave para screenshots *\/\n@keyframes vl-float {\n  0%, 100% { transform: translateY(0px); }\n  50% { transform: translateY(-10px); }\n}\n\n.vl-float {\n  animation: vl-float 4s ease-in-out infinite;\n}\n\n\/* Pulse para CTAs *\/\n@keyframes vl-pulse {\n  0%, 100% { box-shadow: 0 0 0 0 rgba(231,254,21,0.4); }\n  50% { box-shadow: 0 0 0 12px rgba(231,254,21,0); }\n}\n\n.vl-pulse {\n  animation: vl-pulse 2.5s ease-in-out infinite;\n}\n\n\/* Gradiente de fondo animado (hero) *\/\n@keyframes vl-gradient-move {\n  0% { background-position: 0% 50%; }\n  50% { background-position: 100% 50%; }\n  100% { background-position: 0% 50%; }\n}\n\n\/* Ticker \/ marquee logos *\/\n@keyframes vl-scroll {\n  0% { transform: translateX(0); }\n  100% { transform: translateX(-50%); }\n}\n\n\/* \u2500\u2500\u2500 Testimonial \u2500\u2500\u2500 *\/\n.vl-testimonial {\n  background: #FFFFFF;\n  border-radius: 16px;\n  padding: 36px;\n  border: 1px solid #DCDCDC;\n  position: relative;\n}\n\n.vl-testimonial::before {\n  content: '\"';\n  font-size: 80px;\n  font-weight: 800;\n  color: #E7FE15;\n  position: absolute;\n  top: 12px;\n  left: 28px;\n  line-height: 1;\n}\n\n.vl-testimonial-text {\n  font-size: 17px;\n  line-height: 1.7;\n  color: #424242;\n  font-style: italic;\n  padding-top: 28px;\n}\n\n.vl-testimonial-author {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  margin-top: 24px;\n}\n\n.vl-testimonial-avatar {\n  width: 56px;\n  height: 56px;\n  border-radius: 50%;\n  background: #F2F2F2;\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.vl-testimonial-avatar img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  display: block;\n}\n\n.vl-testimonial-name {\n  font-size: 15px;\n  font-weight: 700;\n  color: #161616;\n}\n\n.vl-testimonial-role {\n  font-size: 13px;\n  color: #6E6E6E;\n  line-height: 1.4;\n}\n\n.vl-testimonials-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 24px;\n}\n\n@media (max-width: 900px) {\n  .vl-testimonials-grid {\n    grid-template-columns: 1fr;\n    gap: 20px;\n  }\n}\n\n\/* \u2500\u2500\u2500 Testimonial sticky-stack \u2500\u2500\u2500 *\/\n.vl-tstack-section { position: relative; }\n\n\/* Track de scroll: 3 viewports de altura = espacio para mostrar las 3 tarjetas *\/\n.vl-tstack-track {\n  position: relative;\n  height: 300vh;\n}\n\n\/* El contenido se queda fijo mientras dura el track *\/\n.vl-tstack-sticky {\n  position: sticky;\n  top: 0;\n  height: 100vh;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: stretch;\n  overflow: hidden;\n  padding: 60px 0;\n  box-sizing: border-box;\n}\n\n\/* Contenedor de las cards (apiladas en absoluto). min-height ampliado para que\n   el testimonio m\u00e1s largo quepa entero. Cards con bottom:0 \u21d2 misma altura visual. *\/\n.vl-tstack-cards {\n  position: relative;\n  width: 100%;\n  max-width: 620px;\n  margin: 0 auto;\n  min-height: 400px;\n}\n\n\/* Cada card empieza fuera de pantalla (abajo) y entra al llegar su turno.\n   bottom:0 + display:flex hace que TODAS las cards llenen el alto del\n   contenedor, igualando alturas independientemente del largo del texto. *\/\n.vl-tstack-card {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  margin: 0;\n  transform: translateY(120vh);\n  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);\n  background: #FFFFFF;\n  box-shadow: 0 12px 40px -8px rgba(0,0,0,0.15);\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n}\n.vl-tstack-card[data-tstack-idx=\"0\"] { z-index: 1; }\n.vl-tstack-card[data-tstack-idx=\"1\"] { z-index: 2; }\n.vl-tstack-card[data-tstack-idx=\"2\"] { z-index: 3; }\n\n.vl-tstack-card.is-visible {\n  transform: translateY(0);\n}\n\n\/* Las cards detr\u00e1s se mueven ligeramente arriba con cada nueva,\n   creando sensaci\u00f3n de \"pila de cartas\" *\/\n.vl-tstack-card.is-behind-1 { transform: translateY(-14px) scale(0.97); }\n.vl-tstack-card.is-behind-2 { transform: translateY(-26px) scale(0.94); }\n.vl-tstack-card.is-behind-3 { transform: translateY(-36px) scale(0.91); }\n\n\/* En m\u00f3vil el sticky-stack se mantiene activo (queremos la animaci\u00f3n apilada tambi\u00e9n en vertical).\n   Ajustes espec\u00edficos para m\u00f3vil est\u00e1n en el bloque de auditor\u00eda @media al final del CSS. *\/\n\n.vl-testimonial--compact {\n  padding: 32px 32px 28px;\n}\n\n.vl-testimonial-rating {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  background: #161616;\n  color: #FFFFFF;\n  border-radius: 100px;\n  padding: 10px 18px;\n  font-size: 14px;\n  font-weight: 600;\n  margin-bottom: 16px;\n}\n\n.vl-testimonial-rating .vl-stars {\n  color: #E7FE15;\n  letter-spacing: 1px;\n}\n\n.vl-testimonial-avatar--initials {\n  background: linear-gradient(135deg, #1F1F1F 0%, #3A3A3A 100%);\n  color: #FFFFFF;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-weight: 700;\n  font-size: 16px;\n  letter-spacing: 0.5px;\n}\n\n\/* \u2500\u2500\u2500 FAQ (estilo minimalista, chevron a la izquierda) \u2500\u2500\u2500 *\/\n.vl-faq details {\n  background: transparent;\n  border: none;\n  border-bottom: 1px solid #ECECEC;\n  border-radius: 0;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n}\n.vl-faq details:last-child {\n  border-bottom: none;\n}\n\n.vl-faq summary {\n  list-style: none;\n  cursor: pointer;\n  padding: 20px 0 20px 36px;\n  font-size: 17px;\n  font-weight: 500;\n  color: #161616;\n  display: block;\n  position: relative;\n  transition: color 0.2s;\n}\n.vl-faq summary:hover {\n  color: #424242;\n}\n\n.vl-faq summary::-webkit-details-marker { display: none; }\n\n\/* Chevron a la izquierda del texto, construido con bordes CSS (sin imagen) *\/\n.vl-faq summary::before {\n  content: \"\";\n  position: absolute;\n  left: 8px;\n  top: 50%;\n  width: 8px;\n  height: 8px;\n  border-right: 2px solid #161616;\n  border-bottom: 2px solid #161616;\n  transform: translateY(-75%) rotate(45deg);\n  transition: transform 0.25s ease;\n}\n.vl-faq details[open] summary::before {\n  transform: translateY(-25%) rotate(-135deg);\n}\n\n.vl-faq .vl-faq-answer {\n  padding: 0 0 20px 36px;\n  font-size: 15.5px;\n  line-height: 1.65;\n  color: #6E6E6E;\n}\n\n\/* \u2500\u2500\u2500 Logos marquee \u2500\u2500\u2500 *\/\n.vl-logos-track {\n  display: flex;\n  align-items: center;\n  width: max-content;\n  animation: vl-scroll 33s linear infinite;\n}\n\n.vl-logos-track img {\n  height: 32px;\n  width: auto;\n  max-width: 150px;\n  object-fit: contain;\n  margin-right: 72px;\n  flex-shrink: 0;\n  opacity: 0.6;\n  filter: grayscale(100%);\n  transition: opacity 0.3s, filter 0.3s;\n}\n\n\/* Override espec\u00edfico: el logo de ieTeam tiene mucho aire transparente\n   alrededor de su PNG y queda visualmente peque\u00f1o. Le subimos altura. *\/\n.vl-logos-track img[alt=\"ieTeam\"] {\n  height: 60px;\n  max-width: 210px;\n}\n\n.vl-logos-track img:hover {\n  opacity: 1;\n  filter: grayscale(0%);\n}\n\n\/* \u2500\u2500\u2500 Google rating \u2500\u2500\u2500 *\/\n.vl-google-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n  background: #161616;\n  color: #FFFFFF;\n  padding: 12px 24px;\n  border-radius: 100px;\n  font-size: 15px;\n  font-weight: 600;\n}\n\n.vl-google-badge svg {\n  width: 20px;\n  height: 20px;\n}\n\n.vl-stars {\n  color: #FFE14C;\n  letter-spacing: 2px;\n}\n\n\/* \u2500\u2500\u2500 Responsive \u2500\u2500\u2500 *\/\n@media (max-width: 900px) {\n  .vl-grid-2, .vl-grid-3 {\n    grid-template-columns: 1fr;\n  }\n\n  .vl-section {\n    padding: 64px 0;\n  }\n\n  .vl-hero-flex {\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .vl-hero-actions {\n    justify-content: center;\n  }\n\n  .vl-step-row {\n    flex-direction: column;\n  }\n}\n\n@media (max-width: 600px) {\n  .vl-landing h1 {\n    font-size: 32px;\n  }\n\n  .vl-landing h2 {\n    font-size: 26px;\n  }\n\n  .vl-btn {\n    padding: 14px 24px;\n    font-size: 15px;\n    width: 100%;\n    justify-content: center;\n  }\n\n  .vl-hero-actions {\n    flex-direction: column;\n    width: 100%;\n  }\n\n  .vl-card {\n    padding: 28px 24px;\n  }\n}\n\n\/* \u2500\u2500\u2500 Utilidades \u2500\u2500\u2500 *\/\n.vl-text-center { text-align: center; }\n\/* \u2500\u2500\u2500 Mockup Hero: PDF \u2192 IA \u2192 Plantilla \u2500\u2500\u2500 *\/\n.vl-hero-mockup {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  gap: 0;\n  position: relative;\n}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 DROPZONE (siempre visible al inicio) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.vl-mk-dropzone {\n  position: relative;\n  align-self: stretch;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 96px;\n  padding: 16px;\n  border: 2px dashed #C5C5C5;\n  border-radius: 12px;\n  background: rgba(255,255,255,0.5);\n  margin-bottom: 4px;\n  transition: border-color 0.4s ease, background 0.4s ease;\n  animation: vl-dropzone-soften 0.5s ease-out 1.4s forwards;\n}\n@keyframes vl-dropzone-soften {\n  to {\n    border-color: #ECECEC;\n    background: transparent;\n  }\n}\n\n\/* Hint inicial dentro del dropzone *\/\n.vl-mk-dropzone-hint {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  color: #9A9A9A;\n  font-size: 12px;\n  font-weight: 600;\n  letter-spacing: 0.2px;\n  pointer-events: none;\n  animation: vl-hint-out 0.4s ease-out 1.0s forwards;\n}\n@keyframes vl-hint-out {\n  to { opacity: 0; visibility: hidden; }\n}\n\n\/* PDF que entra desde fuera *\/\n.vl-mk-pdf-wrapper {\n  position: relative;\n  opacity: 0;\n  transform: translate(70px, -50px);\n  animation: vl-pdf-drop 1.0s cubic-bezier(0.34, 1.15, 0.64, 1) 0.45s forwards;\n}\n@keyframes vl-pdf-drop {\n  0%   { opacity: 0; transform: translate(70px, -50px); }\n  30%  { opacity: 1; }\n  100% { opacity: 1; transform: translate(0, 0); }\n}\n.vl-mk-pdf {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: #FFFFFF;\n  border: 1.5px solid #E5E5E5;\n  border-radius: 12px;\n  padding: 12px 16px 12px 12px;\n  box-shadow: 0 8px 24px -6px rgba(0,0,0,0.12);\n  transform: rotate(-2deg);\n}\n.vl-mk-pdf-icon { flex-shrink: 0; }\n.vl-mk-pdf-name {\n  font-size: 13px;\n  font-weight: 700;\n  color: #161616;\n  line-height: 1.2;\n}\n.vl-mk-pdf-size {\n  font-size: 11px;\n  color: #9A9A9A;\n  margin-top: 2px;\n}\n.vl-mk-cursor {\n  position: absolute;\n  bottom: -10px;\n  right: -6px;\n  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));\n  opacity: 0;\n  animation: vl-cursor-show 0.3s ease-out 0.45s forwards, vl-cursor-bob 2.6s ease-in-out 1.5s infinite;\n}\n@keyframes vl-cursor-show {\n  to { opacity: 1; }\n}\n@keyframes vl-cursor-bob {\n  0%, 100% { transform: translate(0,0); }\n  50%      { transform: translate(-4px,-3px); }\n}\n\n\/* Flechas conectoras \u2014 aparecen despu\u00e9s de la fase anterior *\/\n.vl-mk-arrow {\n  align-self: center;\n  display: flex;\n  justify-content: center;\n  height: 28px;\n  margin: 10px 0;\n  opacity: 0;\n  transform: translateY(-4px);\n  animation: vl-fade-down 0.35s ease-out forwards;\n}\n.vl-mk-arrow--1 { animation-delay: 1.55s; }\n.vl-mk-arrow--2 { animation-delay: 2.45s; }\n@keyframes vl-fade-down {\n  to { opacity: 1; transform: translateY(0); }\n}\n\n\/* M\u00e1quina Voicit \u2014 aparece despu\u00e9s de la flecha 1 *\/\n.vl-mk-machine {\n  position: relative;\n  align-self: center;\n  background: #161616;\n  border-radius: 12px;\n  padding: 14px 20px;\n  min-width: 220px;\n  overflow: hidden;\n  opacity: 0;\n  transform: translateY(-4px);\n  animation: vl-fade-down 0.4s ease-out 1.85s forwards;\n}\n.vl-mk-machine-pulse {\n  display: none;\n}\n.vl-mk-machine-content {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.vl-mk-machine-logo {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  font-weight: 700;\n  color: #FFFFFF;\n}\n.vl-mk-machine-logo .vl-mk-gear path { fill: #E7FE15; }\n\n\/* Engranaje girando sobre su propio eje *\/\n.vl-mk-gear {\n  transform-origin: center;\n  transform-box: fill-box;\n  animation: vl-spin 7s linear infinite;\n}\n@keyframes vl-spin {\n  to { transform: rotate(360deg); }\n}\n\n.vl-mk-machine-status {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 12px;\n}\n.vl-mk-dot {\n  flex-shrink: 0;\n  width: 18px;\n  height: 18px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.vl-mk-dot::before {\n  content: '';\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: #E7FE15;\n  animation: vl-blink 1.4s ease-in-out infinite;\n}\n@keyframes vl-blink {\n  0%, 100% { opacity: 1; }\n  50%      { opacity: 0.3; }\n}\n\n\/* Shimmer en el texto \"Analizando estructura...\" \u2014 estilo ChatGPT\/Claude *\/\n.vl-mk-shimmer {\n  background: linear-gradient(\n    90deg,\n    rgba(154,154,154,1) 0%,\n    rgba(154,154,154,1) 35%,\n    rgba(255,255,255,1) 50%,\n    rgba(154,154,154,1) 65%,\n    rgba(154,154,154,1) 100%\n  );\n  background-size: 250% 100%;\n  -webkit-background-clip: text;\n  background-clip: text;\n  -webkit-text-fill-color: transparent;\n  color: transparent;\n  animation: vl-shimmer 2.2s linear infinite;\n}\n@keyframes vl-shimmer {\n  0%   { background-position: 200% 0; }\n  100% { background-position: -200% 0; }\n}\n\n\/* Plantilla generada *\/\n.vl-mk-template {\n  background: #FFFFFF;\n  border: 1.5px solid #E5E5E5;\n  border-radius: 12px;\n  padding: 16px 18px;\n  box-shadow: 0 8px 24px -6px rgba(0,0,0,0.08);\n  opacity: 0;\n  transform: translateY(-4px);\n  animation: vl-fade-down 0.4s ease-out 2.75s forwards;\n}\n.vl-mk-template-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  padding-bottom: 10px;\n  margin-bottom: 10px;\n  border-bottom: 1px solid #F0F0F0;\n}\n.vl-mk-template-title {\n  font-size: 12.5px;\n  font-weight: 700;\n  color: #161616;\n  line-height: 1.3;\n}\n.vl-mk-badge-ok {\n  flex-shrink: 0;\n  background: #E7FE15;\n  color: #161616;\n  font-size: 10px;\n  font-weight: 700;\n  padding: 3px 8px;\n  border-radius: 100px;\n  letter-spacing: 0.3px;\n  white-space: nowrap;\n}\n.vl-mk-section-list {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.vl-mk-section-list li {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-size: 12.5px;\n  color: #424242;\n  font-weight: 500;\n  opacity: 0;\n  animation: vl-li-fade 0.45s ease-out forwards;\n}\n.vl-mk-section-list li:nth-child(1) { animation-delay: 3.1s; }\n.vl-mk-section-list li:nth-child(2) { animation-delay: 3.7s; }\n.vl-mk-section-list li:nth-child(3) { animation-delay: 4.3s; }\n.vl-mk-section-list li:nth-child(4) { animation-delay: 4.9s; }\n.vl-mk-section-list li:nth-child(5) { animation-delay: 5.5s; }\n@keyframes vl-li-fade {\n  from { opacity: 0; transform: translateX(-6px); }\n  to   { opacity: 1; transform: translateX(0); }\n}\n\n\/* Texto de cada secci\u00f3n: efecto typewriter de izquierda a derecha *\/\n.vl-mk-section-text {\n  display: inline-block;\n  white-space: nowrap;\n  overflow: hidden;\n  max-width: 0;\n  animation: vl-typewriter 0.55s steps(24, end) forwards;\n}\n.vl-mk-section-list li:nth-child(1) .vl-mk-section-text { animation-delay: 3.15s; }\n.vl-mk-section-list li:nth-child(2) .vl-mk-section-text { animation-delay: 3.75s; }\n.vl-mk-section-list li:nth-child(3) .vl-mk-section-text { animation-delay: 4.35s; }\n.vl-mk-section-list li:nth-child(4) .vl-mk-section-text { animation-delay: 4.95s; }\n.vl-mk-section-list li:nth-child(5) .vl-mk-section-text { animation-delay: 5.55s; }\n@keyframes vl-typewriter {\n  to { max-width: 260px; }\n}\n\n.vl-mk-check {\n  flex-shrink: 0;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: #161616;\n  color: #E7FE15;\n  font-size: 9px;\n  font-weight: 800;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  opacity: 0;\n  transform: scale(0.4);\n  animation: vl-check-pop 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;\n}\n.vl-mk-section-list li:nth-child(1) .vl-mk-check { animation-delay: 3.70s; }\n.vl-mk-section-list li:nth-child(2) .vl-mk-check { animation-delay: 4.30s; }\n.vl-mk-section-list li:nth-child(3) .vl-mk-check { animation-delay: 4.90s; }\n.vl-mk-section-list li:nth-child(4) .vl-mk-check { animation-delay: 5.50s; }\n.vl-mk-section-list li:nth-child(5) .vl-mk-check { animation-delay: 6.10s; }\n@keyframes vl-check-pop {\n  to { opacity: 1; transform: scale(1); }\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   MOCKUP PASO 1 \u2014 File picker\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.vl-mk-filepicker {\n  position: relative;\n  background: #FFFFFF;\n  border-radius: 14px;\n  box-shadow: 0 10px 32px -8px rgba(0,0,0,0.12);\n  border: 1px solid #E8E8E8;\n  max-width: 480px;\n  margin: 0 auto;\n}\n.vl-mk-fp-header {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: 12px 16px;\n  border-bottom: 1px solid #EEEEEE;\n  background: #FAFAFA;\n  border-top-left-radius: 14px;  \/* sigue el radio del contenedor padre *\/\n  border-top-right-radius: 14px;\n}\n.vl-mk-fp-dots { display: flex; gap: 6px; }\n.vl-mk-fp-dots span {\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n  background: #D8D8D8;\n}\n.vl-mk-fp-dots span:nth-child(1) { background: #FF5F57; }\n.vl-mk-fp-dots span:nth-child(2) { background: #FEBC2E; }\n.vl-mk-fp-dots span:nth-child(3) { background: #28C840; }\n.vl-mk-fp-title {\n  font-size: 13px;\n  font-weight: 600;\n  color: #424242;\n}\n.vl-mk-fp-grid {\n  position: relative;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 10px;\n  padding: 18px;\n}\n.vl-mk-fp-file {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 12px;\n  border-radius: 10px;\n  background: #F7F7F7;\n  border: 2px solid transparent;\n  cursor: pointer;\n  min-width: 0;       \/* clave: deshace min-width:auto del grid item para que se encoja *\/\n  overflow: hidden;   \/* refuerza el clip para que el ellipsis del nombre funcione *\/\n  user-select: none;\n  transition: border-color 0.25s ease, background 0.25s ease;\n}\n.vl-mk-fp-file:hover {\n  background: #F0F0F0;\n}\n.vl-mk-fp-file.is-selected {\n  background: #EAEAEA;\n  border-color: #161616;\n}\n.vl-mk-fp-name {\n  font-size: 12px;\n  font-weight: 600;\n  color: #2A2A2A;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  min-width: 0;       \/* permite que se encoja por debajo del tama\u00f1o del contenido *\/\n  flex: 1 1 auto;\n}\n.vl-mk-fp-actions {\n  padding: 14px 18px 18px;\n  display: flex;\n  justify-content: flex-end;\n}\n.vl-mk-fp-btn {\n  background: #ECECEC;\n  color: #9A9A9A;\n  border: none;\n  border-radius: 8px;\n  padding: 10px 18px;\n  font-size: 13px;\n  font-weight: 700;\n  font-family: inherit;\n  cursor: default;\n  transition: background 0.3s ease, color 0.3s ease;\n}\n.vl-mk-fp-btn.is-enabled {\n  background: #161616;\n  color: #FFFFFF;\n  cursor: pointer;\n}\n.vl-mk-fp-btn.is-enabled:hover {\n  background: #2C2C2C;\n}\n\n\/* Toast del Paso 1 \u2014 pop-up desde arriba *\/\n.vl-mk-fp-toast {\n  position: absolute;\n  top: -10px;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  background: #FFFFFF;\n  border: 1px solid #E0E0E0;\n  border-left: 4px solid #E7FE15;\n  border-radius: 10px;\n  padding: 10px 16px;\n  font-size: 13px;\n  font-weight: 700;\n  color: #161616;\n  box-shadow: 0 12px 32px -4px rgba(0,0,0,0.22);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  opacity: 0;\n  pointer-events: none;\n  white-space: nowrap;\n  z-index: 10;\n}\n.vl-mk-fp-toast.is-showing {\n  animation: vl-fp-toast-in 0.45s cubic-bezier(0.34, 1.5, 0.64, 1) forwards;\n}\n.vl-mk-fp-toast.is-hiding {\n  animation: vl-fp-toast-out 0.4s ease-in forwards;\n}\n@keyframes vl-fp-toast-in {\n  from { opacity: 0; transform: translate(-50%, -100%); }\n  to   { opacity: 1; transform: translate(-50%, 0); }\n}\n@keyframes vl-fp-toast-out {\n  from { opacity: 1; transform: translate(-50%, 0); }\n  to   { opacity: 0; transform: translate(-50%, -100%); }\n}\n\n\/* Animaciones \u2014 se disparan al entrar en viewport (.is-visible) *\/\n.vl-mk-filepicker.is-visible .vl-mk-fp-file {\n  opacity: 0;\n  animation: vl-fp-file-in 0.4s ease-out forwards;\n}\n.vl-mk-filepicker.is-visible .vl-mk-fp-file:nth-child(1) { animation-delay: 0.2s; }\n.vl-mk-filepicker.is-visible .vl-mk-fp-file:nth-child(2) { animation-delay: 0.35s; }\n.vl-mk-filepicker.is-visible .vl-mk-fp-file:nth-child(3) { animation-delay: 0.50s; }\n.vl-mk-filepicker.is-visible .vl-mk-fp-file:nth-child(4) { animation-delay: 0.65s; }\n@keyframes vl-fp-file-in {\n  from { opacity: 0; transform: translateY(6px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n\/* La selecci\u00f3n de archivo y la activaci\u00f3n del bot\u00f3n ahora son manuales\n   (gestionadas por JS al hacer click). No hay animaciones autom\u00e1ticas. *\/\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   MOCKUP PASO 2 \u2014 Chat con el agente\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.vl-mk-chat {\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n  max-width: 560px;\n  margin: 0 auto;\n}\n.vl-mk-chat-row {\n  display: flex;\n  gap: 12px;\n  align-items: flex-start;\n  opacity: 0;\n}\n.vl-mk-chat-row--user { justify-content: flex-end; }\n.vl-mk-chat-row--ai   { justify-content: flex-start; }\n\n.vl-mk-chat-avatar {\n  flex-shrink: 0;\n  width: 34px;\n  height: 34px;\n  border-radius: 50%;\n  background: #161616;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-top: 2px;\n}\n.vl-mk-chat-avatar svg {\n  display: block;\n  transform: translateY(1.5px);\n}\n.vl-mk-chat-bubble {\n  background: #FFFFFF;\n  border: 1px solid #E8E8E8;\n  border-radius: 14px;\n  padding: 16px 18px;\n  font-size: 14px;\n  line-height: 1.6;\n  color: #2A2A2A;\n  box-shadow: 0 2px 8px -2px rgba(0,0,0,0.06);\n  max-width: 88%;\n}\n.vl-mk-chat-bubble--user {\n  background: #161616;\n  color: #FFFFFF;\n  border-color: #161616;\n  border-bottom-right-radius: 4px;\n}\n.vl-mk-chat-bubble--ai {\n  border-bottom-left-radius: 4px;\n}\n\n.vl-mk-chat-pdf-tag {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  background: rgba(255,255,255,0.08);\n  padding: 6px 10px;\n  border-radius: 8px;\n  font-size: 12.5px;\n  font-weight: 600;\n  color: #FFFFFF;\n}\n\n.vl-mk-chat-intro,\n.vl-mk-chat-question {\n  margin: 0 0 10px;\n  font-weight: 600;\n  color: #161616;\n}\n.vl-mk-chat-question { margin-top: 14px; margin-bottom: 12px; }\n.vl-mk-chat-sections {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 9px;\n}\n.vl-mk-chat-sections li {\n  position: relative;\n  padding-left: 18px;\n  font-size: 13.5px;\n  font-weight: 600;\n  color: #161616;\n  opacity: 0;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  overflow: hidden;\n}\n.vl-mk-chat-sections li::before {\n  content: '';\n  position: absolute;\n  left: 0;\n  top: 9px;\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: #E7FE15;\n}\n.vl-mk-chat-section-name {\n  flex: 1;\n}\n\n\/* Bot\u00f3n \u2715 para eliminar secci\u00f3n \u2014 oculto por defecto, visible en modo edici\u00f3n *\/\n.vl-mk-chat-li-delete {\n  display: none;\n  width: 22px;\n  height: 22px;\n  border-radius: 50%;\n  border: none;\n  background: rgba(0,0,0,0.06);\n  color: #161616;\n  font-size: 11px;\n  font-weight: 700;\n  font-family: inherit;\n  cursor: pointer;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  padding: 0;\n  transition: background 0.2s, color 0.2s, transform 0.2s;\n}\n.vl-mk-chat.is-editing .vl-mk-chat-li-delete {\n  display: inline-flex;\n  animation: vl-chat-x-in 0.3s ease-out forwards;\n}\n.vl-mk-chat-li-delete:hover {\n  background: #FCEAEA;\n  color: #DC2626;\n}\n@keyframes vl-chat-x-in {\n  from { opacity: 0; transform: scale(0.5); }\n  to   { opacity: 1; transform: scale(1); }\n}\n\n\/* Animaci\u00f3n al borrar una secci\u00f3n *\/\n.vl-mk-chat-sections li.is-removing {\n  animation: vl-chat-li-remove 0.32s ease-in forwards;\n}\n@keyframes vl-chat-li-remove {\n  to {\n    opacity: 0;\n    max-height: 0;\n    margin: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n    transform: translateX(20px);\n  }\n}\n\n.vl-mk-chat-buttons {\n  display: flex;\n  gap: 8px;\n  margin-top: 4px;\n  flex-wrap: wrap;\n}\n.vl-mk-chat-btn {\n  background: #F2F2F2;\n  color: #424242;\n  border: 1px solid #E5E5E5;\n  border-radius: 100px;\n  padding: 7px 14px;\n  font-size: 12px;\n  font-weight: 700;\n  font-family: inherit;\n  cursor: pointer;\n  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;\n}\n.vl-mk-chat-btn:hover {\n  background: #E5E5E5;\n  border-color: #161616;\n  color: #161616;\n}\n.vl-mk-chat-btn--primary {\n  background: #161616;\n  color: #FFFFFF;\n  border-color: #161616;\n}\n.vl-mk-chat-btn--primary:hover {\n  background: #2C2C2C;\n  border-color: #2C2C2C;\n  color: #FFFFFF;\n}\n.vl-mk-chat-btn[disabled],\n.vl-mk-chat-btn:disabled {\n  cursor: default;\n}\n\n\/* Mensaje final \"\u2713 Borrador de plantilla generado\" *\/\n.vl-mk-chat-done {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  color: #161616;\n  font-weight: 700;\n  font-size: 14px;\n}\n.vl-mk-chat-done svg { flex-shrink: 0; }\n\n\/* Animaciones \u2014 disparadas con .is-visible *\/\n.vl-mk-chat.is-visible .vl-mk-chat-row--user {\n  animation: vl-chat-in-right 0.45s ease-out 0.15s forwards;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-thinking {\n  animation: vl-chat-in-left 0.45s ease-out 0.85s forwards;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-response {\n  animation: vl-chat-in-left 0.45s ease-out 2.6s forwards;\n}\n\/* La burbuja de \"pensando\" se desvanece justo antes de aparecer la respuesta *\/\n.vl-mk-chat.is-visible .vl-mk-chat-thinking {\n  animation: vl-chat-in-left 0.45s ease-out 0.85s forwards,\n             vl-chat-fade-out 0.4s ease-in 2.3s forwards;\n}\n@keyframes vl-chat-in-right {\n  from { opacity: 0; transform: translateX(20px); }\n  to   { opacity: 1; transform: translateX(0); }\n}\n@keyframes vl-chat-in-left {\n  from { opacity: 0; transform: translateX(-20px); }\n  to   { opacity: 1; transform: translateX(0); }\n}\n@keyframes vl-chat-fade-out {\n  to { opacity: 0; height: 0; margin: 0; padding: 0; transform: scaleY(0); transform-origin: top; }\n}\n\n\/* Lista de secciones \u2014 typewriter staggered *\/\n.vl-mk-chat.is-visible .vl-mk-chat-sections li {\n  animation: vl-chat-li-in 0.4s ease-out forwards;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-sections li:nth-child(1) { animation-delay: 3.2s; }\n.vl-mk-chat.is-visible .vl-mk-chat-sections li:nth-child(2) { animation-delay: 3.6s; }\n.vl-mk-chat.is-visible .vl-mk-chat-sections li:nth-child(3) { animation-delay: 4.0s; }\n.vl-mk-chat.is-visible .vl-mk-chat-sections li:nth-child(4) { animation-delay: 4.4s; }\n.vl-mk-chat.is-visible .vl-mk-chat-sections li:nth-child(5) { animation-delay: 4.8s; }\n@keyframes vl-chat-li-in {\n  from { opacity: 0; transform: translateX(-6px); }\n  to   { opacity: 1; transform: translateX(0); }\n}\n\n\/* La pregunta y los botones aparecen al final *\/\n.vl-mk-chat-question {\n  opacity: 0;\n}\n.vl-mk-chat-buttons {\n  opacity: 0;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-question {\n  animation: vl-chat-fade-up 0.4s ease-out 5.3s forwards;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-buttons {\n  animation: vl-chat-fade-up 0.4s ease-out 5.6s forwards;\n}\n@keyframes vl-chat-fade-up {\n  from { opacity: 0; transform: translateY(4px); }\n  to   { opacity: 1; transform: translateY(0); }\n}\n\n\/* La intro \"He detectado...\" aparece justo cuando la respuesta entra *\/\n.vl-mk-chat-intro {\n  opacity: 0;\n}\n.vl-mk-chat.is-visible .vl-mk-chat-intro {\n  animation: vl-chat-fade-up 0.4s ease-out 2.9s forwards;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   MOCKUP PASO 3 \u2014 Editor de plantilla\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.vl-mk-editor {\n  position: relative;\n  background: #FFFFFF;\n  border-radius: 14px;\n  border: 1px solid #E8E8E8;\n  box-shadow: 0 10px 32px -8px rgba(0,0,0,0.12);\n  max-width: 540px;\n  margin: 0 auto;\n}\n\n\/* Cabecera del editor *\/\n.vl-mk-editor-head {\n  padding: 12px 18px;\n  border-bottom: 1px solid #EEEEEE;\n  background: #FAFAFA;\n  border-radius: 14px 14px 0 0;\n}\n.vl-mk-editor-title {\n  font-size: 13px;\n  font-weight: 700;\n  color: #161616;\n}\n\n\/* Cuerpo con secciones *\/\n.vl-mk-editor-body {\n  padding: 14px 14px;\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n\n\/* Secci\u00f3n (estado base = colapsada) *\/\n.vl-mk-editor-section {\n  background: #F7F7F7;\n  border: 1px solid transparent;\n  border-radius: 10px;\n  opacity: 0;\n  transform: translateX(-6px);\n  overflow: hidden;\n  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;\n}\n.vl-mk-editor-section-head {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 11px 14px;\n  cursor: pointer;\n  user-select: none;\n  transition: background 0.2s ease;\n}\n.vl-mk-editor-section-head:hover {\n  background: rgba(0,0,0,0.03);\n}\n.vl-mk-editor-drag {\n  color: #B0B0B0;\n  font-size: 14px;\n  font-weight: 700;\n  letter-spacing: -2px;\n  line-height: 1;\n  user-select: none;\n  cursor: grab;\n  padding: 0 4px;\n  touch-action: none;\n  transition: color 0.2s ease;\n}\n.vl-mk-editor-drag:hover {\n  color: #4B4B4B;\n}\n.vl-mk-editor-section--dragging .vl-mk-editor-drag,\n.vl-mk-editor--is-dragging .vl-mk-editor-drag {\n  cursor: grabbing;\n}\n\n\/* Secci\u00f3n durante el arrastre \u2014 flota con sombra y leve transparencia *\/\n.vl-mk-editor-section--dragging {\n  position: relative;\n  z-index: 50;\n  box-shadow: 0 14px 32px -4px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.1);\n  opacity: 0.96;\n  cursor: grabbing;\n  transition: box-shadow 0.15s ease, opacity 0.15s ease;\n}\n.vl-mk-editor--is-dragging {\n  cursor: grabbing;\n}\n.vl-mk-editor-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: #2A2A2A;\n}\n.vl-mk-editor-caret {\n  margin-left: auto;\n  color: #888;\n  font-size: 12px;\n  transition: transform 0.25s ease;\n  transform: rotate(-90deg);\n}\n\n\/* Secci\u00f3n abierta *\/\n.vl-mk-editor-section--open {\n  background: #FFFFFF;\n  border-color: #161616;\n  box-shadow: 0 4px 14px -4px rgba(0,0,0,0.15), 0 0 0 1px #161616;\n}\n.vl-mk-editor-section--open .vl-mk-editor-section-head {\n  background: #F2F2F2;\n}\n.vl-mk-editor-section--open .vl-mk-editor-section-head:hover {\n  background: #ECECEC;\n}\n.vl-mk-editor-section--open .vl-mk-editor-caret {\n  transform: rotate(0deg);\n}\n\n\/* Cuerpo de la secci\u00f3n \u2014 controlado por transition *\/\n.vl-mk-editor-section-body {\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n  max-height: 0;\n  opacity: 0;\n  padding: 0 14px;\n  overflow: hidden;\n  transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.4s ease;\n}\n.vl-mk-editor-section--open .vl-mk-editor-section-body {\n  max-height: 400px;\n  opacity: 1;\n  padding: 14px;\n}\n\n\/* Caja de instrucciones editable *\/\n.vl-mk-editor-instructions {\n  background: #FAFAFA;\n  border: 1px solid #EEEEEE;\n  border-radius: 8px;\n  padding: 10px 12px;\n  font-size: 12.5px;\n  line-height: 1.55;\n  color: #424242;\n  font-style: italic;\n}\n\n\/* Controles Formato \/ Longitud *\/\n.vl-mk-editor-controls {\n  display: flex;\n  gap: 24px;\n  flex-wrap: wrap;\n  opacity: 1;\n}\n.vl-mk-editor-ctrl-group {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n}\n.vl-mk-editor-ctrl-label {\n  font-size: 12px;\n  color: #6E6E6E;\n  font-weight: 500;\n}\n.vl-mk-editor-btn-group {\n  display: flex;\n  gap: 4px;\n}\n.vl-mk-editor-icon-btn {\n  width: 32px;\n  height: 32px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  border-radius: 7px;\n  color: #4B4B4B;\n  cursor: pointer;\n  transition: background 0.2s ease, color 0.2s ease;\n  padding: 0;\n  font-family: inherit;\n}\n.vl-mk-editor-icon-btn:hover {\n  background: #F0F0F0;\n}\n.vl-mk-editor-icon-btn.is-active {\n  background: #E5E5E5;\n  color: #161616;\n}\n.vl-mk-editor-icon-btn.is-active:hover {\n  background: #DBDBDB;\n}\n.vl-mk-editor-hash {\n  font-size: 18px;\n  font-weight: 800;\n  font-family: inherit;\n  line-height: 1;\n}\n\n\/* Footer *\/\n.vl-mk-editor-footer {\n  display: flex;\n  gap: 8px;\n  padding: 14px 18px;\n  border-top: 1px solid #EEEEEE;\n  background: #FAFAFA;\n  justify-content: flex-end;\n  border-radius: 0 0 14px 14px;\n}\n.vl-mk-editor-action {\n  background: #FFFFFF;\n  color: #424242;\n  border: 1px solid #DDDDDD;\n  border-radius: 8px;\n  padding: 8px 14px;\n  font-size: 12.5px;\n  font-weight: 700;\n  font-family: inherit;\n  cursor: pointer;\n  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;\n}\n.vl-mk-editor-action:hover {\n  background: #F5F5F5;\n  border-color: #161616;\n  color: #161616;\n}\n.vl-mk-editor-action--primary {\n  background: #161616;\n  color: #FFFFFF;\n  border-color: #161616;\n}\n.vl-mk-editor-action--primary:hover {\n  background: #2C2C2C;\n  border-color: #2C2C2C;\n  color: #FFFFFF;\n}\n\n\/* Toast \u2014 pop-up que entra desde arriba *\/\n.vl-mk-editor-toast {\n  position: absolute;\n  top: -10px;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  background: #FFFFFF;\n  border: 1px solid #E0E0E0;\n  border-left: 4px solid #E7FE15;\n  border-radius: 10px;\n  padding: 10px 16px;\n  font-size: 13px;\n  font-weight: 700;\n  color: #161616;\n  box-shadow: 0 12px 32px -4px rgba(0,0,0,0.22);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  opacity: 0;\n  pointer-events: none;\n  white-space: nowrap;\n  z-index: 10;\n}\n\n\/* \u2550\u2550\u2550 ANIMACIONES INICIALES (entrada) \u2014 disparadas con .is-visible \u2550\u2550\u2550 *\/\n\n\/* Las 5 secciones aparecen escalonadas al hacer scroll *\/\n.vl-mk-editor.is-visible .vl-mk-editor-section {\n  animation: vl-ed-section-in 0.4s ease-out forwards;\n}\n.vl-mk-editor.is-visible .vl-mk-editor-section:nth-child(1) { animation-delay: 0.20s; }\n.vl-mk-editor.is-visible .vl-mk-editor-section:nth-child(2) { animation-delay: 0.35s; }\n.vl-mk-editor.is-visible .vl-mk-editor-section:nth-child(3) { animation-delay: 0.50s; }\n.vl-mk-editor.is-visible .vl-mk-editor-section:nth-child(4) { animation-delay: 0.65s; }\n.vl-mk-editor.is-visible .vl-mk-editor-section:nth-child(5) { animation-delay: 0.80s; }\n@keyframes vl-ed-section-in {\n  from { opacity: 0; transform: translateX(-6px); }\n  to   { opacity: 1; transform: translateX(0); }\n}\n\n\/* Bot\u00f3n \"Guardar plantilla\" \u2014 pulso al hacer click (controlado por JS) *\/\n\n\/* Toast \u2014 visible cuando tiene .is-showing (controlado por JS) *\/\n@keyframes vl-ed-toast-in {\n  from { opacity: 0; transform: translate(-50%, -100%); }\n  to   { opacity: 1; transform: translate(-50%, 0); }\n}\n@keyframes vl-ed-toast-out {\n  from { opacity: 1; transform: translate(-50%, 0); }\n  to   { opacity: 0; transform: translate(-50%, -100%); }\n}\n.vl-mk-editor-toast.is-showing {\n  animation: vl-ed-toast-in 0.45s cubic-bezier(0.34, 1.5, 0.64, 1) forwards;\n}\n.vl-mk-editor-toast.is-hiding {\n  animation: vl-ed-toast-out 0.4s ease-in forwards;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PAIN CARDS \u2014 Colores e iconos animados en hover\n   Estado base = blanco\/negro. Solo se activa al pasar el rat\u00f3n.\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.vl-card--pain {\n  transition: background-color 0.4s ease, transform 0.3s ease, box-shadow 0.3s ease;\n}\n.vl-card--pain .vl-icon {\n  transition: background-color 0.4s ease;\n}\n\n\/* Hourglass \u2014 amarillo p\u00e1lido + flip 180\u00b0 *\/\n\/* Eye (visibilidad de productividad) \u2014 amarillo p\u00e1lido + parpadeo en hover.\n   Se aplasta verticalmente (cierra p\u00e1rpado) y vuelve a abrirse. *\/\n.vl-card--pain-1 .vl-pain-icon-img {\n  transform-origin: center center;\n  transition: transform 0.2s ease-out;\n  will-change: transform;\n}\n.vl-card--pain-1:hover {\n  background-color: #FFF9DB;\n}\n.vl-card--pain-1:hover .vl-icon {\n  background-color: #FCE899;\n}\n.vl-card--pain-1:hover .vl-pain-icon-img {\n  animation: vl-pain-blink 0.55s cubic-bezier(0.4, 0, 0.2, 1) 1;\n}\n@keyframes vl-pain-blink {\n  0%   { transform: scaleY(1); }\n  45%  { transform: scaleY(0.04); }\n  100% { transform: scaleY(1); }\n}\n\n\/* X mark \u2014 rojo p\u00e1lido + vaiv\u00e9n *\/\n.vl-card--pain-2 .vl-pain-icon-svg {\n  transform-origin: center;\n  transform-box: fill-box;\n}\n.vl-card--pain-2:hover {\n  background-color: #FCEAEA;\n}\n.vl-card--pain-2:hover .vl-icon {\n  background-color: #F5BABA;\n}\n.vl-card--pain-2:hover .vl-pain-icon-svg {\n  animation: vl-pain-wobble 0.55s ease-in-out;\n}\n@keyframes vl-pain-wobble {\n  0%, 100% { transform: rotate(0deg); }\n  20%      { transform: rotate(-14deg); }\n  50%      { transform: rotate(12deg); }\n  75%      { transform: rotate(-6deg); }\n}\n\n\/* Gear \u2014 azul p\u00e1lido + giro continuo (al mismo ritmo que el del hero) *\/\n.vl-card--pain-3 .vl-pain-icon-img {\n  transform-origin: center;\n  animation: vl-pain-spin 7s linear infinite;\n  animation-play-state: paused;\n}\n.vl-card--pain-3:hover {\n  background-color: #EEF5FE;\n}\n.vl-card--pain-3:hover .vl-icon {\n  background-color: #C9DEFC;\n}\n.vl-card--pain-3:hover .vl-pain-icon-img {\n  animation-play-state: running;\n}\n@keyframes vl-pain-spin {\n  to { transform: rotate(360deg); }\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   COMPARATIVA \"Un cambio que notar\u00e1s\"\n   Estilo monocrom\u00e1tico, alineado con el lenguaje de Voicit\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.vl-compare-grid {\n  display: grid;\n  grid-template-columns: 1fr auto 1fr;\n  gap: 28px;\n  align-items: stretch;\n  max-width: 980px;\n  margin: 0 auto;\n}\n\n.vl-compare-card {\n  background: #FFFFFF;\n  border-radius: 16px;\n  padding: 36px 36px 40px;\n  display: flex;\n  flex-direction: column;\n}\n.vl-compare-card--before {\n  border: 1px solid #E5E5E5;\n  background: #FAFAFA;\n}\n.vl-compare-card--after {\n  border: 1.5px solid #161616;\n  box-shadow: 0 4px 20px -6px rgba(0,0,0,0.08);\n}\n\n\/* Etiqueta \"ANTES\" \/ \"AHORA\" en may\u00fasculas *\/\n.vl-compare-label {\n  display: inline-block;\n  font-size: 11px;\n  font-weight: 800;\n  letter-spacing: 2.5px;\n  text-transform: uppercase;\n  color: #9A9A9A;\n  margin-bottom: 14px;\n}\n.vl-compare-card--after .vl-compare-label {\n  color: #161616;\n}\n\n\/* T\u00edtulo descriptivo *\/\n.vl-compare-title {\n  font-size: 18px;\n  font-weight: 700;\n  color: #161616;\n  line-height: 1.35;\n  margin: 0 0 22px;\n  padding-bottom: 20px;\n  border-bottom: 1px solid #ECECEC;\n}\n.vl-compare-card--after .vl-compare-title {\n  border-bottom-color: #E0E0E0;\n}\n\n\/* Lista de items *\/\n.vl-compare-list {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n}\n.vl-compare-list li {\n  display: flex;\n  align-items: flex-start;\n  gap: 14px;\n  font-size: 16px;\n  line-height: 1.55;\n}\n.vl-compare-card--before .vl-compare-list li {\n  color: #6E6E6E;\n}\n.vl-compare-card--after .vl-compare-list li {\n  color: #161616;\n  font-weight: 500;\n}\n\n\/* Guion (em-dash) en la card \"Antes\" \u2014 gris claro *\/\n.vl-compare-dash {\n  flex-shrink: 0;\n  width: 22px;\n  height: 22px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-top: 2px;\n}\n.vl-compare-dash::before {\n  content: '';\n  display: block;\n  width: 12px;\n  height: 2px;\n  background: #C5C5C5;\n  border-radius: 1px;\n}\n\n\/* Check en la card \"Ahora\" \u2014 c\u00edrculo negro con \u2713 amarillo de marca\n   Mismo lenguaje que el check del mockup del Hero *\/\n.vl-compare-check {\n  flex-shrink: 0;\n  width: 22px;\n  height: 22px;\n  border-radius: 50%;\n  background: #161616;\n  color: #E7FE15;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 11px;\n  font-weight: 800;\n  line-height: 1;\n  margin-top: 2px;\n}\n\n\/* Flecha de transformaci\u00f3n entre las dos cards *\/\n.vl-compare-arrow {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n\/* Responsive: en pantallas peque\u00f1as, apilamos vertical y rotamos la flecha *\/\n@media (max-width: 900px) {\n  .vl-compare-grid {\n    grid-template-columns: 1fr;\n    gap: 20px;\n    max-width: 540px;\n  }\n  .vl-compare-arrow svg {\n    transform: rotate(90deg);\n  }\n}\n\n.vl-mb-8 { margin-bottom: 8px; }\n.vl-mb-12 { margin-bottom: 12px; }\n.vl-mb-16 { margin-bottom: 16px; }\n.vl-mb-24 { margin-bottom: 24px; }\n.vl-mb-32 { margin-bottom: 32px; }\n.vl-mb-48 { margin-bottom: 48px; }\n.vl-mb-64 { margin-bottom: 64px; }\n.vl-mt-32 { margin-top: 32px; }\n.vl-mt-48 { margin-top: 48px; }\n.vl-mt-64 { margin-top: 64px; }\n.vl-gap-16 { gap: 16px; }\n.vl-gap-24 { gap: 24px; }\n.vl-flex { display: flex; }\n.vl-flex-col { flex-direction: column; }\n.vl-items-center { align-items: center; }\n.vl-justify-center { justify-content: center; }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AUDITOR\u00cdA RESPONSIVE \u2014 tablet vertical y m\u00f3vil\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n\n\/* \u2500\u2500 TABLET VERTICAL Y M\u00d3VIL (\u2264900px) \u2500\u2500 *\/\n@media (max-width: 900px) {\n  \/* Hero: reducir padding *\/\n  .vl-landing section[style*=\"padding-top:60px\"] {\n    padding-top: 48px !important;\n    padding-bottom: 56px !important;\n  }\n\n  \/* HERO: REORDENAR a vertical (H1 \u2192 p\u00e1rrafo \u2192 mockup \u2192 CTAs \u2192 badge) *\/\n  .vl-hero-flex {\n    flex-direction: column !important;\n    align-items: center !important;\n    text-align: center !important;\n    gap: 28px !important;\n  }\n  \/* Las \"columnas\" inline-styled del hero se aplanan en m\u00f3vil con display:contents,\n     as\u00ed sus hijos pasan a ser flex-items directos de vl-hero-flex y podemos\n     reordenarlos con `order`. *\/\n  .vl-hero-flex > div[style*=\"flex:1.8\"],\n  .vl-hero-flex > div[style*=\"flex:1;min-width:0\"] {\n    display: contents;\n  }\n  \/* Orden visual en m\u00f3vil *\/\n  .vl-hero-flex h1 { order: 1; margin: 0; }\n  .vl-hero-flex p[style*=\"font-size:20px\"] { order: 2; margin: 0; max-width: 560px; }\n  .vl-hero-mockup, .vl-tm-hero { order: 3; margin: 0 auto; max-width: 460px; width: 100%; }\n  .vl-hero-flex .vl-hero-actions { order: 4; margin: 0; justify-content: center; }\n  \/* El contenedor del badge Google (el div con margin-top:32px que envuelve el badge) *\/\n  .vl-hero-flex > div > div[style*=\"margin-top:32px\"] {\n    order: 5;\n    margin-top: 0 !important;\n    justify-content: center !important;\n    width: 100%;\n  }\n\n  \/* Carrusel de logos: tama\u00f1os algo menores *\/\n  .vl-logos-track img {\n    height: 28px;\n    max-width: 130px;\n    margin-right: 56px;\n  }\n  .vl-logos-track img[alt=\"ieTeam\"] {\n    height: 50px;\n    max-width: 170px;\n  }\n\n  \/* STEP ROWS \u2014 centrados verticalmente, orden: t\u00edtulo+n\u00ba \u2192 p\u00e1rrafo \u2192 mockup *\/\n  .vl-step-row {\n    flex-direction: column !important;\n    text-align: center !important;\n    align-items: center !important;\n    gap: 28px !important;\n  }\n  .vl-step-row[style*=\"row-reverse\"] { flex-direction: column !important; }\n  .vl-step-row > div { flex: 1 1 100% !important; width: 100%; }\n\n  \/* Mockups (file picker, chat, editor) deben mantener su contenido alineado\n     a la IZQUIERDA en m\u00f3vil\/tablet \u2014 el text-align:center del step-row se les\n     aplicaba por herencia y centraba burbujas, t\u00edtulos, filas, expansiones, etc.\n     Forzamos LEFT en todo el sub\u00e1rbol para coincidir con desktop. *\/\n  .vl-mk-filepicker,\n  .vl-mk-filepicker *,\n  .vl-mk-chat,\n  .vl-mk-chat *,\n  .vl-mk-editor,\n  .vl-mk-editor *,\n  .vl-tm,\n  .vl-tm * {\n    text-align: left !important;\n  }\n  \/* Excepci\u00f3n: las stat cards del perfil y los ejes\/labels van centrados *\/\n  .vl-tm-stat, .vl-tm-stat *, .vl-tm-xaxis span, .vl-tm-yaxis span { text-align: center !important; }\n\n  \/* H2 con clase .vl-h2-balance: en tablet\/m\u00f3vil ocultamos el <br> desktop y\n     dejamos que text-wrap:balance reparta en l\u00edneas equilibradas. *\/\n  .vl-landing .vl-h2-balance br.vl-br-desktop { display: none; }\n  \/* La cabecera del paso: n\u00famero ARRIBA, t\u00edtulo DEBAJO (apilados, no en l\u00ednea) *\/\n  .vl-step-row > div > div[style*=\"align-items:center\"][style*=\"gap:16px\"] {\n    flex-direction: column !important;\n    justify-content: center !important;\n    align-items: center !important;\n    gap: 14px !important;\n  }\n  \/* El mockup del paso va al final, debajo del p\u00e1rrafo *\/\n  .vl-step-row > div:has(.vl-mk-filepicker),\n  .vl-step-row > div:has(.vl-mk-chat),\n  .vl-step-row > div:has(.vl-mk-editor) {\n    order: 2;\n  }\n\n  \/* Casos de uso: tablet \u2192 grid de 2 columnas (no 1) para aprovechar mejor el ancho *\/\n  .vl-grid-3 {\n    grid-template-columns: repeat(2, 1fr) !important;\n  }\n  \/* EXCEPCI\u00d3N: el grid de pain points (3 tarjetas) NO debe ir a 2 columnas en\n     tablet \u2014 quedar\u00eda 2+1 con un hueco hu\u00e9rfano. Lo mantenemos en 3 columnas\n     horizontales (como en desktop), que caben bien en iPad vertical. *\/\n  .vl-grid-3:has(.vl-card--pain) {\n    grid-template-columns: repeat(3, 1fr) !important;\n  }\n\n  \/* Comparativa Antes\/Ahora: ya pasa a 1 columna, flecha rotada *\/\n  .vl-compare-card { padding: 28px 28px 32px; }\n\n  \/* IMPORTANTE: Mantenemos el STICKY-STACK de testimonios activo en m\u00f3vil\/tablet\n     porque queremos que la animaci\u00f3n funcione en vertical tambi\u00e9n *\/\n  \/* (no se desactiva como antes) *\/\n  .vl-tstack-cards { max-width: 540px; min-height: 500px; }\n}\n\n\/* \u2500\u2500 M\u00d3VIL (\u2264600px) \u2500\u2500 *\/\n@media (max-width: 600px) {\n  \/* Hero: padding a\u00fan menor *\/\n  .vl-landing section[style*=\"padding-top:60px\"] {\n    padding-top: 36px !important;\n    padding-bottom: 48px !important;\n  }\n\n  \/* H1: m\u00e1s grande de lo que estaba (32 \u2192 36) *\/\n  .vl-landing h1 {\n    font-size: 36px;\n  }\n  .vl-landing h1 br { display: none; }\n\n  \/* P\u00e1rrafo del hero: m\u00e1s peque\u00f1o para crear contraste con H1 *\/\n  .vl-hero-flex p[style*=\"font-size:20px\"] {\n    font-size: 16px !important;\n    line-height: 1.55 !important;\n  }\n\n  \/* Botones: NO full-width \u2014 que tengan su tama\u00f1o natural y queden centrados *\/\n  .vl-btn {\n    width: auto !important;\n    padding: 14px 28px !important;\n  }\n  .vl-hero-actions {\n    flex-direction: row !important;\n    width: auto !important;\n    flex-wrap: wrap;\n    gap: 12px !important;\n    justify-content: center !important;\n  }\n\n  \/* Badge Google: centrado y con padding reducido *\/\n  .vl-google-badge {\n    padding: 11px 18px;\n    font-size: 13.5px;\n  }\n\n  \/* Casos de uso: en m\u00f3vil s\u00ed 1 columna *\/\n  .vl-grid-3 {\n    grid-template-columns: 1fr !important;\n  }\n  \/* Pain points: en m\u00f3vil tambi\u00e9n 1 columna (el :has tiene m\u00e1s especificidad\n     que .vl-grid-3, as\u00ed que hay que sobreescribirlo expl\u00edcitamente aqu\u00ed). *\/\n  .vl-grid-3:has(.vl-card--pain) {\n    grid-template-columns: 1fr !important;\n  }\n\n  \/* Pain points \/ Ventajas grid de 2 \u2192 1 columna ya viene desde 900px *\/\n  .vl-grid-2 {\n    grid-template-columns: 1fr !important;\n  }\n\n  \/* Container: padding lateral m\u00e1s generoso *\/\n  .vl-container, .vl-container--narrow {\n    padding-left: 20px;\n    padding-right: 20px;\n  }\n\n  \/* Hero mockup: 100% del ancho disponible *\/\n  .vl-hero-mockup { max-width: 100%; }\n  .vl-mk-machine { min-width: 200px; padding: 12px 16px; }\n  .vl-mk-template-title { font-size: 12px; }\n\n  \/* Carrusel logos: tama\u00f1os m\u00f3vil *\/\n  .vl-logos-track img {\n    height: 24px;\n    max-width: 110px;\n    margin-right: 40px;\n  }\n  .vl-logos-track img[alt=\"ieTeam\"] {\n    height: 42px;\n    max-width: 140px;\n  }\n\n  \/* File picker (Paso 1): grid 1 col en m\u00f3vil para que los nombres se lean *\/\n  .vl-mk-fp-grid {\n    grid-template-columns: 1fr;\n    padding: 14px;\n  }\n  .vl-mk-fp-file { padding: 10px; }\n  .vl-mk-fp-name { font-size: 11.5px; }\n\n  \/* Chat mockup (Paso 2): burbujas m\u00e1s anchas, menos padding *\/\n  .vl-mk-chat-bubble {\n    padding: 12px 14px;\n    font-size: 13px;\n    max-width: 92%;\n  }\n  .vl-mk-chat-sections li { font-size: 12.5px; }\n\n  \/* Editor (Paso 3): controles apilan verticalmente *\/\n  .vl-mk-editor { max-width: 100%; }\n  .vl-mk-editor-section-head { padding: 10px 12px; }\n  .vl-mk-editor-name { font-size: 12.5px; }\n  .vl-mk-editor-controls {\n    flex-direction: column;\n    gap: 14px;\n  }\n  .vl-mk-editor-action { width: auto; }\n  .vl-mk-editor-toast { font-size: 12px; padding: 9px 14px; }\n\n  \/* Comparativa: padding compacto *\/\n  .vl-compare-card { padding: 24px 22px 28px; }\n  .vl-compare-title { font-size: 16px; padding-bottom: 16px; margin-bottom: 18px; }\n  .vl-compare-list li { font-size: 14.5px; }\n\n  \/* Testimonios: padding compacto en m\u00f3vil\n     (el sticky-stack sigue activo, ver el bloque de 900px) *\/\n  .vl-testimonial--compact { padding: 24px 22px 22px; }\n  .vl-testimonial-text { font-size: 15px; line-height: 1.6; padding-top: 22px; }\n  .vl-tstack-track { height: 280vh; }    \/* algo menos que 300vh en m\u00f3vil para que sea m\u00e1s r\u00e1pido *\/\n  \/* En m\u00f3vil las cards son m\u00e1s estrechas \u2192 el texto se envuelve a m\u00e1s l\u00edneas y\n     necesita m\u00e1s altura. Bumpeamos min-height para que quepa el contenido. *\/\n  .vl-tstack-cards { min-height: 480px; }\n\n  \/* CTA final: padding y h2 *\/\n  .vl-landing section[style*=\"background:#161616\"] { padding: 56px 0 !important; }\n\n  \/* Iconos pain points: tama\u00f1o cuadrado m\u00e1s peque\u00f1o *\/\n  .vl-icon { width: 50px; height: 50px; }\n  .vl-icon svg { width: 28px; height: 28px; }\n  .vl-icon img { width: 28px; height: 28px; }\n\n  \/* Avatares de testimonios un pel\u00edn menores *\/\n  .vl-testimonial-avatar { width: 48px; height: 48px; }\n\n  \/* CTA final (p\u00edldora): el H2 y el subt\u00edtulo quedaban con palabras hu\u00e9rfanas\n     en m\u00f3vil. Reducimos tama\u00f1o y aplicamos text-wrap:balance. DESKTOP NO CAMBIA. *\/\n  .vl-cta-pill h2 {\n    font-size: 22px !important;\n    line-height: 1.25 !important;\n    text-wrap: pretty;\n    text-wrap: balance;\n  }\n  .vl-cta-pill p {\n    font-size: 15px !important;\n    line-height: 1.45 !important;\n    text-wrap: pretty;\n    text-wrap: balance;\n  }\n}\n\n\/* \u2500\u2500 M\u00d3VIL ESTRECHO (\u2264375px) \u2500\u2500 *\/\n@media (max-width: 375px) {\n  .vl-landing h1 { font-size: 32px; }\n  .vl-landing h2 { font-size: 24px; }\n  .vl-landing h3 { font-size: 19px; }\n  .vl-mk-fp-name { font-size: 10.5px; }\n  .vl-mk-chat-bubble { font-size: 12.5px; padding: 10px 12px; }\n  .vl-btn { padding: 13px 22px !important; font-size: 14px !important; }\n  \/* En pantallas muy estrechas el texto del testimonio se envuelve a 9+ l\u00edneas *\/\n  .vl-tstack-cards { min-height: 540px; }\n  \/* CTA final en m\u00f3vil estrecho: a\u00fan m\u00e1s compacto *\/\n  .vl-cta-pill h2 { font-size: 20px !important; }\n  .vl-cta-pill p  { font-size: 14px !important; }\n}\n<\/style>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     MOCKUPS \"CONTROL DE EQUIPO\" (.vl-tm-*) \u2014 redise\u00f1ados desde cero\n     para reflejar el producto real: dashboard de equipo, gr\u00e1fica de\n     actividad, perfil individual y panel de reuni\u00f3n estilo Notion.\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<style id=\"vl-tm-styles\">\n\/* Paleta: negro #161616 para los paneles \"gr\u00e1fica\", amarillo #E7FE15 solo\n   sobre oscuro, grises sobre blanco. Tipograf\u00eda heredada (Manrope). *\/\n\n.vl-tm { font-family: inherit; }\n.vl-tm *, .vl-tm *::before, .vl-tm *::after { box-sizing: border-box; }\n\n\/* Tarjeta base blanca (hero, perfil) *\/\n.vl-tm-card {\n  position: relative;\n  background: #FFFFFF;\n  border: 1px solid #E8E8E8;\n  border-radius: 16px;\n  box-shadow: 0 14px 40px -12px rgba(0,0,0,0.16);\n  overflow: hidden;\n  max-width: 500px;\n  margin: 0 auto;\n}\n\/* El hero NO recorta (overflow visible) para que el toast \"Excel descargado\"\n   flote por encima de la tarjeta sin cortarse. Las esquinas se mantienen\n   redondeadas porque ning\u00fan contenido tiene fondo de color en las esquinas. *\/\n.vl-tm-hero { overflow: visible; }\n\n\/* \u2500\u2500 Cabecera de producto (logo + nombre + acci\u00f3n) \u2500\u2500 *\/\n.vl-tm-head {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 18px;\n  border-bottom: 1px solid #F0F0F0;\n}\n.vl-tm-logo {\n  width: 34px; height: 34px;\n  border-radius: 9px;\n  background: #161616;\n  display: flex; align-items: center; justify-content: center;\n  flex-shrink: 0;\n}\n.vl-tm-head-title { font-size: 15px; font-weight: 800; color: #161616; letter-spacing: -0.01em; }\n.vl-tm-head-action {\n  margin-left: auto;\n  display: inline-flex; align-items: center; gap: 6px;\n  font-size: 12px; font-weight: 700; color: #4B4B4B;\n  background: #F4F4F4; border: 1px solid #E6E6E6;\n  padding: 7px 12px; border-radius: 8px;\n  white-space: nowrap;\n  cursor: pointer;\n  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;\n}\n.vl-tm-head-action:hover { background: #161616; color: #FFFFFF; border-color: #161616; }\n.vl-tm-head-action:active { transform: scale(0.96); }\n\n\/* Toast de exportaci\u00f3n (flota sobre la tarjeta) *\/\n.vl-tm-toast {\n  position: absolute;\n  top: -10px; left: 50%;\n  transform: translate(-50%, -100%);\n  background: #FFFFFF;\n  border: 1px solid #E0E0E0;\n  border-left: 4px solid #E7FE15;\n  border-radius: 10px;\n  padding: 10px 16px;\n  font-size: 13px; font-weight: 700; color: #161616;\n  box-shadow: 0 12px 32px -4px rgba(0,0,0,0.22);\n  display: flex; align-items: center; gap: 8px;\n  opacity: 0; pointer-events: none; white-space: nowrap; z-index: 20;\n}\n.vl-tm-toast.is-showing { animation: vl-tm-toast-in 0.45s cubic-bezier(0.34,1.5,0.64,1) forwards; }\n.vl-tm-toast.is-hiding { animation: vl-tm-toast-out 0.4s ease-in forwards; }\n@keyframes vl-tm-toast-in { from { opacity: 0; transform: translate(-50%,-100%); } to { opacity: 1; transform: translate(-50%,0); } }\n@keyframes vl-tm-toast-out { from { opacity: 1; transform: translate(-50%,0); } to { opacity: 0; transform: translate(-50%,-100%); } }\n\n\/* \u2500\u2500 Lista de compa\u00f1eros (HERO) \u2500\u2500 *\/\n.vl-tm-roster { padding: 8px 10px 12px; }\n.vl-tm-roster-cols {\n  display: grid;\n  grid-template-columns: 1fr auto auto;\n  column-gap: 22px;\n  padding: 6px 10px 8px;\n  font-size: 10px; font-weight: 700; letter-spacing: 0.3px;\n  text-transform: uppercase; color: #A0A0A0;\n}\n.vl-tm-roster-cols span:nth-child(2),\n.vl-tm-roster-cols span:nth-child(3) { text-align: right; min-width: 52px; }\n\n.vl-tm-member {\n  display: grid;\n  grid-template-columns: 1fr auto auto;\n  align-items: center;\n  column-gap: 22px;\n  padding: 9px 10px;\n  border-radius: 10px;\n  opacity: 0;\n  transform: translateY(8px);\n}\n.vl-tm.is-visible .vl-tm-member { animation: vl-tm-fadeup 0.5s ease-out forwards; }\n.vl-tm.is-visible .vl-tm-member:nth-child(2) { animation-delay: 0.10s; }\n.vl-tm.is-visible .vl-tm-member:nth-child(3) { animation-delay: 0.20s; }\n.vl-tm.is-visible .vl-tm-member:nth-child(4) { animation-delay: 0.30s; }\n.vl-tm.is-visible .vl-tm-member:nth-child(5) { animation-delay: 0.40s; }\n.vl-tm-member:hover { background: #F7F7F7; }\n.vl-tm-member-id { display: flex; align-items: center; gap: 10px; min-width: 0; }\n.vl-tm-avatar {\n  width: 34px; height: 34px; border-radius: 50%;\n  flex-shrink: 0; object-fit: cover;\n  display: flex; align-items: center; justify-content: center;\n  font-size: 12px; font-weight: 700; color: #FFFFFF;\n}\n.vl-tm-member-name { font-size: 13px; font-weight: 600; color: #1F1F1F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.vl-tm-member-sub { font-size: 11px; color: #9A9A9A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.vl-tm-member-num { font-size: 14px; font-weight: 800; color: #161616; text-align: right; min-width: 52px; font-variant-numeric: tabular-nums; }\n.vl-tm-member-num small { display: block; font-size: 9px; font-weight: 600; color: #B0B0B0; text-transform: uppercase; letter-spacing: 0.3px; }\n.vl-tm-badge {\n  font-size: 10px; font-weight: 700; color: #1F7D34;\n  background: #E8F5EB; padding: 3px 9px; border-radius: 9999px;\n  text-align: center; min-width: 52px;\n}\n\/* permiso de menor autoridad: gris neutro *\/\n.vl-tm-badge--member { color: #6E6E6E; background: #EEEEEE; }\n\/* avatar como imagen *\/\nimg.vl-tm-avatar { object-fit: cover; }\n\n\/* \u2500\u2500 Panel \"gr\u00e1fica\" negro (PASO 1 dashboard + perfil) \u2500\u2500 *\/\n.vl-tm-graph {\n  background: #161616;\n  border-radius: 14px;\n  padding: 18px 18px 14px;\n  position: relative;\n}\n.vl-tm-graph-legend { display: flex; gap: 8px; margin-bottom: 16px; }\n.vl-tm-chip {\n  display: inline-flex; align-items: center; gap: 7px;\n  font-size: 11px; font-weight: 700; color: #FFFFFF;\n  background: rgba(255,255,255,0.08);\n  border: 1px solid rgba(255,255,255,0.14);\n  padding: 6px 11px; border-radius: 9999px;\n  cursor: pointer; user-select: none;\n  transition: opacity 0.2s ease, background 0.2s ease;\n}\n.vl-tm-chip.is-off { opacity: 0.4; }\n.vl-tm-chip-swatch { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }\n.vl-tm-chip-swatch--reports { background: repeating-linear-gradient(45deg, #C9CD4A 0 2px, #8A8E2E 2px 4px); }\n.vl-tm-chip-swatch--users { background: #EDEDED; }\n\n\/* zona del gr\u00e1fico *\/\n.vl-tm-plot {\n  position: relative;\n  height: 150px;\n  display: flex;\n  align-items: flex-end;\n  gap: 0;\n  padding-left: 26px;\n  border-bottom: 1px solid rgba(255,255,255,0.12);\n}\n\/* eje Y labels *\/\n.vl-tm-yaxis { position: absolute; left: 0; top: 0; bottom: 0; width: 22px; display: flex; flex-direction: column; justify-content: space-between; }\n.vl-tm-yaxis span { font-size: 9px; color: rgba(255,255,255,0.4); line-height: 1; }\n\/* grid lines *\/\n.vl-tm-gridline { position: absolute; left: 26px; right: 0; height: 1px; background: rgba(255,255,255,0.07); }\n\n.vl-tm-bargroup {\n  flex: 1;\n  height: 100%;\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  gap: 3px;\n  position: relative;\n  cursor: pointer;\n}\n.vl-tm-bar {\n  width: 9px;\n  border-radius: 3px 3px 0 0;\n  height: 0;\n  transition: height 0.7s cubic-bezier(0.22,1,0.36,1), opacity 0.25s ease;\n}\n.vl-tm.is-visible .vl-tm-bar { height: var(--h, 0); }\n.vl-tm-bar--reports { background: repeating-linear-gradient(45deg, #C9CD4A 0 3px, #7E8228 3px 6px); }\n.vl-tm-bar--users { background: #EDEDED; }\n.vl-tm-bargroup:nth-child(2) .vl-tm-bar { transition-delay: 0.05s; }\n.vl-tm-bargroup:nth-child(3) .vl-tm-bar { transition-delay: 0.10s; }\n.vl-tm-bargroup:nth-child(4) .vl-tm-bar { transition-delay: 0.15s; }\n.vl-tm-bargroup:nth-child(5) .vl-tm-bar { transition-delay: 0.20s; }\n.vl-tm-bargroup:nth-child(6) .vl-tm-bar { transition-delay: 0.25s; }\n.vl-tm-bargroup:nth-child(7) .vl-tm-bar { transition-delay: 0.30s; }\n.vl-tm-bargroup:nth-child(8) .vl-tm-bar { transition-delay: 0.35s; }\n\/* serie oculta por toggle *\/\n.vl-tm-graph.hide-reports .vl-tm-bar--reports,\n.vl-tm-graph.hide-users .vl-tm-bar--users { opacity: 0; width: 0; }\n\/* barra resaltada al hover *\/\n.vl-tm-bargroup.is-active .vl-tm-bar--reports { background: repeating-linear-gradient(45deg, #E7FE15 0 3px, #B8CC10 3px 6px); }\n.vl-tm-bargroup.is-active .vl-tm-bar--users { background: #FFFFFF; }\n\n.vl-tm-xaxis { display: flex; padding-left: 26px; margin-top: 7px; }\n.vl-tm-xaxis span { flex: 1; text-align: center; font-size: 9px; color: rgba(255,255,255,0.45); white-space: nowrap; }\n\n\/* l\u00ednea de media (perfil) *\/\n.vl-tm-avg {\n  position: absolute; left: 26px; right: 0;\n  border-top: 1.5px dashed rgba(231,254,21,0.7);\n  pointer-events: none;\n}\n.vl-tm-avg-tag {\n  position: absolute; left: 30px; top: -9px;\n  font-size: 9px; font-weight: 700; color: #161616;\n  background: #E7FE15; padding: 1px 7px; border-radius: 9999px;\n}\n\n\/* tooltip del gr\u00e1fico \u2014 uno por grupo, aparece encima de las barras al hover *\/\n.vl-tm-tip {\n  position: absolute;\n  bottom: 100%; left: 50%;\n  margin-bottom: 8px;\n  transform: translateX(-50%) translateY(4px);\n  background: #2A2A2A;\n  border: 1px solid rgba(255,255,255,0.16);\n  border-radius: 10px;\n  padding: 9px 12px;\n  width: 150px;\n  box-shadow: 0 8px 20px -6px rgba(0,0,0,0.5);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n  z-index: 5;\n}\n\/* el grupo activo por defecto (Abr) muestra su tooltip hasta el primer hover real *\/\n.vl-tm-graph:not(:hover) .vl-tm-bargroup.is-active .vl-tm-tip,\n.vl-tm-bargroup:hover .vl-tm-tip { opacity: 1; transform: translateX(-50%) translateY(0); }\n\/* resaltado de barras: el activo por defecto y el que est\u00e1 en hover *\/\n.vl-tm-graph:not(:hover) .vl-tm-bargroup.is-active .vl-tm-bar--reports,\n.vl-tm-bargroup:hover .vl-tm-bar--reports { background: repeating-linear-gradient(45deg, #E7FE15 0 3px, #B8CC10 3px 6px); }\n.vl-tm-graph:not(:hover) .vl-tm-bargroup.is-active .vl-tm-bar--users,\n.vl-tm-bargroup:hover .vl-tm-bar--users { background: #FFFFFF; }\n.vl-tm-tip-title { font-size: 10px; color: rgba(255,255,255,0.6); margin-bottom: 6px; font-weight: 600; }\n.vl-tm-tip-row { display: flex; align-items: center; gap: 7px; font-size: 11px; color: #FFFFFF; font-weight: 600; }\n.vl-tm-tip-row + .vl-tm-tip-row { margin-top: 3px; }\n.vl-tm-tip-dot { width: 9px; height: 9px; border-radius: 2px; flex-shrink: 0; }\n\n\/* \u2500\u2500 Perfil individual (PASO 2): stat cards + lista reuniones \u2500\u2500 *\/\n.vl-tm-profile-bar {\n  display: flex; align-items: center; gap: 10px;\n  padding: 14px 18px; border-bottom: 1px solid #F0F0F0;\n}\n.vl-tm-profile-back { color: #B0B0B0; font-size: 14px; }\n.vl-tm-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #EDEDED; }\n.vl-tm-stat { background: #F7F7F7; padding: 16px 12px; text-align: center; }\n.vl-tm-stat-num { font-size: 22px; font-weight: 800; color: #161616; line-height: 1; font-variant-numeric: tabular-nums; }\n.vl-tm-stat-label { font-size: 10.5px; color: #8A8A8A; margin-top: 5px; font-weight: 500; }\n\n.vl-tm-meetings { padding: 6px 0 8px; }\n.vl-tm-meeting {\n  display: flex; align-items: center; gap: 12px;\n  padding: 11px 18px;\n  position: relative;\n  opacity: 0;\n  transform: translateX(8px);\n}\n.vl-tm.is-visible .vl-tm-meeting { animation: vl-tm-fadein 0.45s ease-out forwards; }\n.vl-tm.is-visible .vl-tm-meeting:nth-child(1) { animation-delay: 0.45s; }\n.vl-tm.is-visible .vl-tm-meeting:nth-child(2) { animation-delay: 0.58s; }\n.vl-tm.is-visible .vl-tm-meeting:nth-child(3) { animation-delay: 0.71s; }\n.vl-tm.is-visible .vl-tm-meeting:nth-child(4) { animation-delay: 0.84s; }\n.vl-tm-meeting + .vl-tm-meeting { border-top: 1px solid #F4F4F4; }\n.vl-tm-meeting:hover { background: #F9F9F9; }\n.vl-tm-meeting-name { flex: 1; font-size: 12.5px; font-weight: 600; color: #2A2A2A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }\n.vl-tm-meeting-dur { font-size: 11.5px; color: #8A8A8A; flex-shrink: 0; font-variant-numeric: tabular-nums; }\n.vl-tm-meeting-report { flex-shrink: 0; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; }\n.vl-tm-meeting-report svg { width: 18px; height: 18px; }\n.vl-tm-play {\n  flex-shrink: 0;\n  width: 28px; height: 28px; border-radius: 50%;\n  background: #161616; color: #FFFFFF;\n  display: flex; align-items: center; justify-content: center;\n  opacity: 0; transform: scale(0.7);\n  cursor: pointer;\n  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;\n}\n.vl-tm-meeting:hover .vl-tm-play { opacity: 1; transform: scale(1); }\n.vl-tm-play:hover { background: #2C2C2C; }\n\n\/* \u2500\u2500 Reproductor inline: al pulsar play, la fila \"suena\" \u2500\u2500 *\/\n.vl-tm-play-tri { display: block; }\n.vl-tm-eq { display: none; align-items: flex-end; gap: 2px; height: 12px; }\n.vl-tm-eq i {\n  width: 2.5px; border-radius: 1px;\n  background: #FFFFFF;  \/* blanco sobre el bot\u00f3n oscuro *\/\n  height: 100%;\n  animation: vl-tm-eq 0.85s ease-in-out infinite;\n}\n.vl-tm-eq i:nth-child(2) { animation-delay: 0.22s; }\n.vl-tm-eq i:nth-child(3) { animation-delay: 0.44s; }\n\/* fila reproduci\u00e9ndose: play visible aunque no haya hover + cambia a ecualizador *\/\n.vl-tm-meeting.is-playing .vl-tm-play { opacity: 1; transform: scale(1); background: #161616; }\n.vl-tm-meeting.is-playing .vl-tm-play-tri { display: none; }\n.vl-tm-meeting.is-playing .vl-tm-eq { display: flex; }\n\/* barra de progreso en la parte baja de la fila (oscura \u2014 sobre fondo blanco) *\/\n.vl-tm-progress {\n  position: absolute; left: 0; bottom: 0; height: 2px; width: 0;\n  background: #161616; border-radius: 0 2px 2px 0;\n}\n.vl-tm-meeting.is-playing .vl-tm-progress { animation: vl-tm-prog 9s linear forwards; }\n@keyframes vl-tm-eq { 0%,100% { height: 28%; } 50% { height: 100%; } }\n@keyframes vl-tm-prog { from { width: 0; } to { width: 100%; } }\n\n\/* \u2500\u2500 Panel de reuni\u00f3n estilo Notion (PASO 3) \u2500\u2500 *\/\n.vl-tm-notion {\n  position: relative;\n  background: #FFFFFF;\n  border: 1px solid #E8E8E8;\n  border-radius: 16px;\n  box-shadow: 0 14px 40px -12px rgba(0,0,0,0.16);\n  overflow: hidden;\n  max-width: 500px; margin: 0 auto;\n  display: flex; flex-direction: column;\n  min-height: 420px;\n}\n\/* Barra de propietario \u2014 indica que la documentaci\u00f3n es de un compa\u00f1ero *\/\n.vl-tm-notion-owner {\n  display: flex; align-items: center; gap: 8px;\n  padding: 9px 16px;\n  background: #FAFAFA;\n  border-bottom: 1px solid #F0F0F0;\n}\n.vl-tm-owner-back { color: #B0B0B0; font-size: 14px; flex-shrink: 0; }\n.vl-tm-owner-av { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }\n.vl-tm-owner-text { font-size: 11px; color: #6E6E6E; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.vl-tm-owner-text b { color: #161616; font-weight: 700; }\n.vl-tm-owner-tag { margin-left: auto; flex-shrink: 0; font-size: 9px; font-weight: 700; color: #5E6B17; background: #EEF4D6; padding: 2px 8px; border-radius: 9999px; white-space: nowrap; }\n.vl-tm-notion-head {\n  display: flex; align-items: center; gap: 10px;\n  padding: 14px 18px; border-bottom: 1px solid #F0F0F0;\n}\n.vl-tm-notion-title { font-size: 13.5px; font-weight: 700; color: #161616; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n.vl-tm-notion-play {\n  flex-shrink: 0;\n  display: inline-flex; align-items: center; gap: 7px;\n  background: #161616; color: #FFFFFF;\n  font-size: 11px; font-weight: 700;\n  padding: 6px 12px 6px 9px; border-radius: 9999px;\n  cursor: pointer; transition: background 0.2s ease;\n}\n.vl-tm-notion-play:hover { background: #2C2C2C; }\n\/* icono play\/pausa blanco (sin amarillo) *\/\n.vl-tm-notion-play .vl-tm-playicon { width: 16px; height: 16px; border-radius: 50%; background: #FFFFFF; color: #161616; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\n.vl-tm-ic-pause { display: none; }\n.vl-tm-notion-play.is-playing .vl-tm-ic-play { display: none; }\n.vl-tm-notion-play.is-playing .vl-tm-ic-pause { display: block; }\n\/* reproductor minimalista INLINE: al reproducir, el label desaparece y sale la l\u00ednea de tiempo *\/\n.vl-tm-mini { display: none; align-items: center; gap: 8px; }\n.vl-tm-notion-play.is-playing .vl-tm-play-label { display: none; }\n.vl-tm-notion-play.is-playing .vl-tm-mini { display: flex; }\n.vl-tm-mini-track { position: relative; width: 70px; height: 3px; border-radius: 2px; background: rgba(255,255,255,0.28); }\n.vl-tm-mini-fill { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: #FFFFFF; border-radius: 2px; }\n.vl-tm-notion-play.is-playing .vl-tm-mini-fill { animation: vl-tm-seek 9s linear forwards; }\n.vl-tm-mini-dot { position: absolute; top: 50%; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #FFFFFF; transform: translate(-50%,-50%); box-shadow: 0 0 0 2px rgba(0,0,0,0.15); }\n.vl-tm-notion-play.is-playing .vl-tm-mini-dot { animation: vl-tm-seekdot 9s linear forwards; }\n.vl-tm-mini-time { font-size: 10px; color: rgba(255,255,255,0.85); flex-shrink: 0; font-variant-numeric: tabular-nums; }\n@keyframes vl-tm-seek { from { width: 0; } to { width: 100%; } }\n@keyframes vl-tm-seekdot { from { left: 0; } to { left: 100%; } }\n\n.vl-tm-notion-body { flex: 1; padding: 15px 18px; overflow: hidden; }\n.vl-tm-report-section + .vl-tm-report-section { margin-top: 12px; }\n.vl-tm-report-h {\n  font-size: 11.5px; font-weight: 800; color: #161616; margin: 0 0 4px;\n  opacity: 0; transform: translateY(6px);\n}\n.vl-tm-report-p {\n  font-size: 10.5px; line-height: 1.5; color: #555; margin: 0;\n  opacity: 0; transform: translateY(6px);\n}\n.vl-tm.is-visible .vl-tm-report-h,\n.vl-tm.is-visible .vl-tm-report-p { animation: vl-tm-fadeup 0.5s ease-out forwards; }\n.vl-tm.is-visible .vl-tm-report-section:nth-child(1) .vl-tm-report-h { animation-delay: 0.3s; }\n.vl-tm.is-visible .vl-tm-report-section:nth-child(1) .vl-tm-report-p { animation-delay: 0.4s; }\n.vl-tm.is-visible .vl-tm-report-section:nth-child(2) .vl-tm-report-h { animation-delay: 0.55s; }\n.vl-tm.is-visible .vl-tm-report-section:nth-child(2) .vl-tm-report-p { animation-delay: 0.65s; }\n\/* Override forzado contra Astra: el tema aplica .entry-content p { font-size:18px }\n   y .entry-content h6 { tama\u00f1o heading }, que ganan a mi selector base. Necesario\n   !important + mayor especificidad para que el informe quede compacto. *\/\n.vl-landing .vl-tm .vl-tm-report-h { font-size: 11.5px !important; line-height: 1.3 !important; margin: 0 0 4px !important; font-family: inherit !important; }\n.vl-landing .vl-tm .vl-tm-report-p { font-size: 10.5px !important; line-height: 1.5 !important; margin: 0 !important; }\n.vl-landing .vl-tm .vl-tm-ai-answer { font-size: 10.5px !important; }\n.vl-landing .vl-tm .vl-tm-chatbox-text { font-size: 11px !important; }\n\n\/* caja de chat *\/\n.vl-tm-chatbox {\n  margin: 0 14px 14px; padding: 4px 4px 4px 14px;\n  display: flex; align-items: center; gap: 8px;\n  background: #F4F4F4; border: 1px solid #E6E6E6; border-radius: 9999px;\n}\n.vl-tm-chatbox-text { flex: 1; font-size: 11px; color: #9A9A9A; white-space: nowrap; overflow: hidden; }\n.vl-tm-chatbox-text .vl-tm-caret { display: inline-block; width: 1px; background: #161616; margin-left: 1px; animation: vl-tm-blink 1s step-end infinite; }\n.vl-tm-chatbox-send { width: 30px; height: 30px; border-radius: 50%; background: #161616; color: #FFFFFF; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }\n\/* respuesta IA que aparece *\/\n.vl-tm-ai-answer {\n  margin: 0 18px; padding: 0;\n  max-height: 0; overflow: hidden;\n  font-size: 10.5px; line-height: 1.5; color: #2A2A2A;\n  transition: max-height 0.5s ease, padding 0.5s ease, margin 0.5s ease;\n}\n.vl-tm-ai-answer.is-open { max-height: 120px; padding: 11px 13px; margin: 0 18px 12px; background: #F6FBE6; border: 1px solid #E2EF9E; border-radius: 10px; }\n.vl-tm-ai-answer-label { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 700; color: #5E6B17; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.3px; }\n\n@keyframes vl-tm-fadeup { to { opacity: 1; transform: translateY(0); } }\n@keyframes vl-tm-fadein { to { opacity: 1; transform: translateX(0); } }\n@keyframes vl-tm-wave { 0%,100% { height: 25%; } 50% { height: 90%; } }\n@keyframes vl-tm-blink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }\n\n@media (max-width: 600px) {\n  .vl-tm-card, .vl-tm-notion { max-width: 100%; }\n  .vl-tm-stat-num { font-size: 19px; }\n  .vl-tm-plot { height: 130px; }\n}\n<\/style>\n\n<div class=\"vl-landing\">\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       HERO SECTION\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section\" style=\"padding-top:60px;padding-bottom:80px;background:#F8F8F8;\">\n    <div class=\"vl-container\">\n\n      <div style=\"display:flex;align-items:center;gap:40px;\" class=\"vl-hero-flex\">\n        <!-- Columna izquierda: texto -->\n        <div style=\"flex:1.8;min-width:0;\">\n\n          <h1 class=\"vl-mb-24 vl-h1-balance\">\n            Gestiona tu equipo con datos. <br>\n            <span style=\"color:#6E6E6E;\">Visibilidad total y control de calidad de cada reuni\u00f3n o entrevista.<\/span>\n          <\/h1>\n\n          <p style=\"font-size:20px;color:#424242;max-width:620px;\" class=\"vl-mb-32\">\n            Accede a los informes y audios grabados por cada compa\u00f1ero. Mide la actividad de reuniones al mes, duraci\u00f3n media y mucho m\u00e1s. Supervisa toda la informaci\u00f3n para tomar el control.\n          <\/p>\n\n          <div style=\"display:flex;gap:16px;flex-wrap:wrap;\" class=\"vl-hero-actions\">\n            <a href=\"https:\/\/app.voicit.com\/signup\" class=\"vl-btn vl-btn--primary\">\n              Solicitar demo\n            <\/a>\n            <a href=\"https:\/\/calendly.com\/alvaroarres\/voicitcall\" class=\"vl-btn vl-btn--secondary\" rel=\"nofollow noopener\" target=\"_blank\">\n              Solicitar demo\n            <\/a>\n          <\/div>\n\n          <div style=\"display:flex;align-items:center;gap:20px;margin-top:32px;flex-wrap:wrap;\">\n            <a href=\"https:\/\/chromewebstore.google.com\/detail\/voicit-resumen-reuni%C3%B3n-ia\/lekjojhflheocafafpmiiemdiechdnkm\" target=\"_blank\" rel=\"noopener nofollow\" class=\"vl-google-badge\" style=\"text-decoration:none !important;color:#FFFFFF !important;\">\n              <svg viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 01-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z\" fill=\"#4285F4\"\/><path d=\"M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z\" fill=\"#34A853\"\/><path d=\"M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z\" fill=\"#FBBC05\"\/><path d=\"M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z\" fill=\"#EA4335\"\/><\/svg>\n              4.8 de 5 <span class=\"vl-stars\">\u2605\u2605\u2605\u2605\u2605<\/span> +350 rese\u00f1as\n            <\/a>\n          <\/div>\n        <\/div>\n\n        <!-- Columna derecha: mockup del DASHBOARD DE EQUIPO (tabla de compa\u00f1eros) -->\n        <div style=\"flex:1;min-width:0;\">\n          <div class=\"vl-tm vl-tm-card vl-tm-hero\" data-tm-mock>\n\n            <!-- Cabecera de producto -->\n            <div class=\"vl-tm-head\">\n              <div class=\"vl-tm-logo\">\n                <svg width=\"20\" height=\"12\" viewBox=\"0 0 90.23 54.17\" fill=\"#FFFFFF\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M72.18,36.11v-18h-18v18c-8.6,0-12.93-5.21-19.84-14.43C27.06,12,18.05,0,0,0V18.07c8.6,0,12.93,5.22,19.84,14.43,7.24,9.65,16.25,21.67,34.3,21.67V36.11ZM90.23,0h-18v18h18Z\"\/><\/svg>\n              <\/div>\n              <span class=\"vl-tm-head-title\">Voicit Team<\/span>\n              <span class=\"vl-tm-head-action\" data-tm-export>\n                <svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M12 3v12m0 0l-4-4m4 4l4-4M4 21h16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\n                Exportar m\u00e9tricas\n              <\/span>\n            <\/div>\n\n            <!-- Lista de compa\u00f1eros con m\u00e9tricas -->\n            <div class=\"vl-tm-roster\">\n              <div class=\"vl-tm-roster-cols\">\n                <span>4 compa\u00f1eros<\/span>\n                <span>Este mes<\/span>\n                <span>Permisos<\/span>\n              <\/div>\n\n              <div class=\"vl-tm-member\">\n                <div class=\"vl-tm-member-id\">\n                  <img class=\"vl-tm-avatar\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/laura-pena-candidata.webp\" alt=\"Ana Ruiz\" loading=\"lazy\" decoding=\"async\"\/>\n                  <div style=\"min-width:0;\">\n                    <div class=\"vl-tm-member-name\">Ana Ruiz<\/div>\n                    <div class=\"vl-tm-member-sub\">ana@voicit.com<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"vl-tm-member-num\">12<small>informes<\/small><\/div>\n                <div class=\"vl-tm-badge\">Admin<\/div>\n              <\/div>\n\n              <div class=\"vl-tm-member\">\n                <div class=\"vl-tm-member-id\">\n                  <img class=\"vl-tm-avatar\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/javier-ruiz-candidato.webp\" alt=\"David Torres\" loading=\"lazy\" decoding=\"async\"\/>\n                  <div style=\"min-width:0;\">\n                    <div class=\"vl-tm-member-name\">David Torres<\/div>\n                    <div class=\"vl-tm-member-sub\">david@voicit.com<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"vl-tm-member-num\">9<small>informes<\/small><\/div>\n                <div class=\"vl-tm-badge\">Admin<\/div>\n              <\/div>\n\n              <div class=\"vl-tm-member\">\n                <div class=\"vl-tm-member-id\">\n                  <img class=\"vl-tm-avatar\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/carlos-torres-candidato.webp\" alt=\"Carlos M\u00e9ndez\" loading=\"lazy\" decoding=\"async\"\/>\n                  <div style=\"min-width:0;\">\n                    <div class=\"vl-tm-member-name\">Carlos M\u00e9ndez<\/div>\n                    <div class=\"vl-tm-member-sub\">carlos@voicit.com<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"vl-tm-member-num\">15<small>informes<\/small><\/div>\n                <div class=\"vl-tm-badge vl-tm-badge--member\">Miembro<\/div>\n              <\/div>\n\n              <div class=\"vl-tm-member\">\n                <div class=\"vl-tm-member-id\">\n                  <img class=\"vl-tm-avatar\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/maria-garcia-candidata-v2.webp\" alt=\"Luc\u00eda Fern\u00e1ndez\" loading=\"lazy\" decoding=\"async\"\/>\n                  <div style=\"min-width:0;\">\n                    <div class=\"vl-tm-member-name\">Luc\u00eda Fern\u00e1ndez<\/div>\n                    <div class=\"vl-tm-member-sub\">lucia@voicit.com<\/div>\n                  <\/div>\n                <\/div>\n                <div class=\"vl-tm-member-num\">7<small>informes<\/small><\/div>\n                <div class=\"vl-tm-badge vl-tm-badge--member\">Miembro<\/div>\n              <\/div>\n            <\/div>\n\n            <!-- Toast de exportaci\u00f3n -->\n            <div class=\"vl-tm-toast\" data-tm-toast>\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M5 12l5 5L20 7\" stroke=\"#161616\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\n              <span>Excel descargado<\/span>\n            <\/div>\n\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       LOGOS DE CONFIANZA\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section style=\"padding:32px 0;border-top:1px solid #F2F2F2;border-bottom:1px solid #F2F2F2;overflow:hidden;\">\n    <div class=\"vl-container vl-text-center\">\n      <p class=\"text-small text-secondary vl-mb-16\" style=\"font-size:14px;color:#9A9A9A;\">Elegida por +1.000 empresas para documentar sus entrevistas<\/p>\n      <div style=\"overflow:hidden;\">\n        <div class=\"vl-logos-track\">\n          <!-- 6 logos de clientes reales (cabecera de voicit.com) -->\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/Telefonica_2021_logo-1.png\" alt=\"Telef\u00f3nica\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/deloitte-logo-1.png\" alt=\"Deloitte\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/PcComponentes-1.png\" alt=\"PcComponentes\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/2560px-Mahou-san_miguel_logo-1.png\" alt=\"Mahou San Miguel\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2025\/08\/brandty_gris.webp\" alt=\"Brandty\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2025\/08\/logo_ieteam_grises_.webp\" alt=\"ieTeam\">\n          <!-- Duplicados para loop continuo -->\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/Telefonica_2021_logo-1.png\" alt=\"Telef\u00f3nica\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/deloitte-logo-1.png\" alt=\"Deloitte\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/PcComponentes-1.png\" alt=\"PcComponentes\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2023\/02\/2560px-Mahou-san_miguel_logo-1.png\" alt=\"Mahou San Miguel\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2025\/08\/brandty_gris.webp\" alt=\"Brandty\">\n          <img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2025\/08\/logo_ieteam_grises_.webp\" alt=\"ieTeam\">\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       PROBLEMA \/ PAIN POINTS\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section\">\n    <div class=\"vl-container\">\n\n      <div class=\"vl-text-center vl-mb-64 vl-reveal\">\n        <h2 class=\"vl-mb-16 vl-h2-balance\">Controlar la calidad de tu equipo <br class=\"vl-br-desktop\">no deber\u00eda depender de asistir a cada reuni\u00f3n<\/h2>\n        <!-- P\u00e1rrafo eliminado (backup): \"Hasta ahora, adaptar un sistema de IA a tu forma de trabajar significaba horas de configuraci\u00f3n manual. Eso se acab\u00f3.\" -->\n      <\/div>\n\n      <div class=\"vl-grid-3\">\n        <!-- Pain 1 -->\n        <div class=\"vl-card vl-card--pain vl-card--pain-1 vl-reveal vl-reveal-delay-1\">\n          <div class=\"vl-icon vl-icon--light vl-mb-24\"><img decoding=\"async\" class=\"vl-pain-icon-img\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/icon-eye-mercado.png\" alt=\"Ojo: visibilidad\" width=\"32\" height=\"32\"><\/div>\n          <h3 class=\"vl-mb-8\">Cero visibilidad de productividad<\/h3>\n          <p class=\"text-small\">No sabes cu\u00e1ntas reuniones hace tu equipo ni cu\u00e1nto tiempo invierte en cada una de ellas.<\/p>\n        <\/div>\n\n        <!-- Pain 2 -->\n        <div class=\"vl-card vl-card--pain vl-card--pain-2 vl-reveal vl-reveal-delay-2\">\n          <div class=\"vl-icon vl-icon--light vl-mb-24\"><svg class=\"vl-pain-icon-svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M7.5 3.5L16 12l8.5-8.5L28.5 7.5 20 16l8.5 8.5-4 4L16 20l-8.5 8.5-4-4L12 16 3.5 7.5l4-4z\" fill=\"#1A171B\"\/><\/svg><\/div>\n          <h3 class=\"vl-mb-8\">La informaci\u00f3n no est\u00e1 a mano<\/h3>\n          <p class=\"text-small\">Pedir las reuniones e informes de tus compa\u00f1eros uno a uno ralentiza tu flujo de trabajo y resta eficiencia.<\/p>\n        <\/div>\n\n        <!-- Pain 3 -->\n        <div class=\"vl-card vl-card--pain vl-card--pain-3 vl-reveal vl-reveal-delay-3\">\n          <div class=\"vl-icon vl-icon--light vl-mb-24\"><img decoding=\"async\" class=\"vl-pain-icon-img\" src=\"data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAcgAAAHHCAMAAAAMKTgNAAAAM1BMVEVHcEwaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxsaFxvHNkjaAAAAEHRSTlMA8DBg0MBAgKAQIOBwkFCw8zDaSgAAAAlwSFlzAAAhNwAAITcBM1ifegAAD0dJREFUeJztnQd24zAMRG3LRe65\/2n3pWziItkSiQEGfPMvkDF+KFGsi9RsPwzZ5a5FaiSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESSyESTSiX69h\/6hTCI7cC2Q9B8f2PSJRHboWgDpP8sDTZ9HZAevBY7+uz7I9GlEdvhawOj\/FwiYPovIzqEWKPq\/CuHSJxHZ\/f2RdCb72xLB0ucQ2d3+lWQm+\/saodKnENnd\/5lUJvvHIoHSZxDZPf6dRCafPKLSJxD55DGRyQGPoPT8Igc8pjE56BGTnl7koMckJkc8QtKzixzxmMLkqEdEenKRox4TmHzhEZCeW+QLj\/QmX3q0T08t8qVHcpNvPJqnZxb5xiO1ybcerdMTi3zrkdjkBI\/G6XlFTvBIa3KSR9v0tCIneSQ1OdGjaXpWkRM9Upqc7NEyPanIyR4JTc7waJieU+QMj3QmZ3m0S08pcpZHMpMzPZqlZxQ50yOVydkerdITipztkchkgUej9HwiCzzSmCzyaJOeTmSRRxKThR5N0rOJLPRIYbLYo0V6MpHFHglMVng0SM8lssJjuMkqj\/XpqURWeQw2WemxOj2TyEqPoSarPdamJxJZ7THQpIHHyvQ8Ig08hpk08ViXnkakiccgk0Yeq9KziDTyGGLSzGNNehKRZh4DTBp6rEjPIdLQo7tJU4\/l6SlEmnp0NmnssTg9g0hjj64mzT2WpicQae7R0STAY0n61W5jG+F4vswOAfDoZhLicW76S7+EpLieDnNiQDw6mQR5nJF+311RGb5yTHcJ8uhiEuZxanqsxZ8k01zCPDqYBHqckn4LeqI+s+nehgF6hJuEenyXfn86Yv\/8Pct+9bIWUI9gk2CPL9Nv4X98IM6LZgn2CDXpUMqx9J1rY\/xjeR55W8I9Ak26NImh9Pud15txiH4b4xFm0unR9pT+4NbBGWPzpNLFI8ik2yvqPv0h4NX4zINKJ48Qk471vEnPofHjQaWbR4RJz4r+T7+n0fhxq9LR48fy9SdQCpOxXZwhNocGPLqb7Ng0ftLv83t0Nrl2\/GMzWHoWAeTR16TAeZRJV4AeZdIRqEeZdAPsUSadgHuUSRccPMqkAy4eZRKOk0eZBOPmUSahOHqUSSCuHmUShrNHmQTh7lEmIQR4lEkAIR5l0pwgjzJpTJhHmTQl0KNMGhLqUSbNCPYok0aEe5RJEwg8yqQBFB5lshoSjzJZCY1HmayCyKNMVkDlUSaLIfMok4XQeZTJIgg9ymQBlB5lcjakHmVyJrQeZXIWxB5lcgbUHmVyMuQeZXIi9B5lchIJPMrkBFJ4lMm3JPEok29I41EmX5LIo0y+IJVHmRwlmUeZHCGdR5kcJKFHmRwgpUeZfCKpR5l8IK1HmbwjsUeZvCG1R5n8JblHmfwhvUeZ\/KIBjxL5ydLrRnocW4IyEnBOL3ITWsTj5o9Ym7NuxSfkElO25eZ82j69lw7bbncNuhq2Ty4yoGzr8+X1v\/92dw24d2voXtg8eN4I9smxv0zrVqx23pdvbVKLdG2Qx\/OsTv6h831tZm6Sjg1yOXin9RsOJ8f\/tMxN0q1Mx670Q2179cqYuEl6NcjNpSal2z3OeZukT4N8vlx+LoedS9C0TdKlQdZrXLi1yqxN0qFBHjursAePLmzO4R2HUdad5Vj0Bf+Pl3N4B\/4vvjaeG9qf0Yk\/Mk6CHNBF2dln3qIbJSAzHHD3wbo5frMHp16SSZrAHjsu3aMeUh02t1nnzA3stwewHivoaHq+LxBkObArYPbQXlq2L5AVsBZrdDGQL8psaz6AtVjj+\/AnXPpk3R1gVwfWzbkF+IavGuB3B1cIp8ER3A+4Mnl6C2ySz22QC2cyU3dnjyqC42AlzOTJ7zdUg+osuD6WUCbXnj+iEtBHpEN\/9RbUv2OeZytovPzoPXcA+obK82zFPJQCdjRhxnjyPFsxfdaAD7A9Zlory7MV02cNmcpbQQY2sjxbIU\/WoGkDyG\/JMiaA6COE7RSFvCaSrPhAPI7CRighr8kc462IGazAhxFiMWCO1XSA7+jQLfiAtXXHwJ8zHcDHV+ijCDEl122tWThte6gieKGL927dIlKIjP6ADj5HYhIZRIYvc8lwxEwCkQSHDSU49CmBSIJl9vDtD\/Xwi6Q4\/Yu\/SfKLpNj3wt8k6UWSHMdH3yTpRZKszEaunDeBXiTLJCz7tyS7SJqpO\/bhHXaRPBM+AecQzoFcJNE0Af6AgSrIRRJtQiPv7pCLZDrT3ftc0Hlwi6SagAVumjSAWyTV9l7uZyu3SK7bMoJOQ58GtUiybdrU\/VZqkWSLzYJuTJgGtUiy04Vg23ctoBbJdqEU8wcIs0i6k0yYX5LMIumO+2J+STKLpDsTk3mdALNIvq0uBEUZg1kk36H8xLPLzCIJzD1AvHKHWCThliXm\/3rebIRn1BJ3W4lFEu60J94EQiyS8ER+4u8PiZwFQVlGIBbJeBoNQVlGIBbJeLcb79yyRM6Cd0RAIiUSjUTOQSJnIZEFSOQcJHIWElmARM6BWCTjDX0EZRlBQ3SzICjLCBIpkWgIL+jTNFYJhBPLElkC4fUYxFsktfhqDlqzUwTfPSdaDlkE34gA8VZXbRmYA0FRxmAWSXepAvNJyswi6bqtzOd6UG90Zbt5CHZztAHUItm2YzEfR0ctkmyQjvqgHWqRZC9J6qOvuA9M4npJMr8iyUVSzS1Tn85CLpJqQxb1eUnsx3wyPVu5LxogF0n0bEXcPmgIuUiiZyv56fTsh9PzTGWR3xfBLpJmBoT9UiV2kTRHe5BfMsB\/Ew9Jd4e8q5NAJMlaOvp7lvmvHeRY8EF9nvlHCpEUTZL\/4vMEV\/MyNEn6BplBJEGT5G+QKa6vD2+Se\/4GmUJk+LdkghqlEBl9BtaB\/Rvyk0W3scb+ZwdfmA1YGdDvrAH8bsBgVugkCGJZcuTvmQxiJj1wYSSip0O49XMAxNqWwIcrYrSc8eDLARAzd2EPV8hKHba7okaArP8MmgWBzHoQHrs\/CGRF9jLmvxiyLoDwmIthIAMh64jXJGY6me+KoREwPz\/gNYkZY6W7hW8U0IZQ9yfSCjOkQ7eBdxzQmJZzhwc1NJfmyYpblO1qcg+6wDXPkxW3k9Cz64rymOnJiptR9zMJ80h5Du0osFWgXiZxHrOMBnyDW5ftYxLnkfL00hfgCrF06PEAPRIezPYS5HIluMkVcI1OjhmsP6BL7MEjA1tkdsaT2l8C3d97RY67Qtc+ZvqI\/AZ7KM0a1uXZY3eYp5n4+APYX\/j8zwZNsq+wsbN1dRYOq7Mhj9cTeOVjtq7OF+jVoEvzwecDfHt5qlGd\/+CXPhs3SnRzzDaq8x+Hk6Is35Rb8NvxI+O3xzceJwwdjR5WB4+w+b49vvE5CGNjoBL8zfGfZMOsfzgd+lWr8tD77NIJ3sJSgdvZNOuKl8\/K7Yy5tA3S8xy+467sU7vzO9Aqb4N0Pi5q082t1NbpmfpN4gbpfjTmtZveLi+974byzA0y4gS39fnyvmKrk\/+x1qkbZNBptev+tB2zuerOIec8HlM3yMgz3Jab627Xbf\/Y7fpN3PEcSQd1\/shw2IQDOUdZb8lwRo0DKac97qG+9sSL\/A0StaMpG6n2CQwhjz8kNymPv6Q2KY83JDYpj3ekNSmPDyQ1KY9PpDQpjwMkNCmPg6QzKY8jJDMpj6OkMimPL0hkUh5fksakPL4hiUl5fEsKk\/I4gQQm5XES9CblcSLkJuVxMtQm5XEGxCblcRa0JuVxJqQm5XE2lCblsQBCk\/JYBJ1JeSyEzKQ8FkNlUh4rIDIpj1XQmJTHSkhMymM1FCbl0QACk\/JoQrhJeTQi2KQ8mhFqUh4NCTQpj6aEmZRHY4JMyqM5ISblEUCASXmE4G5SHkE4m5RHGK4m5RGIo0l5hOJmUh7BOJmURzguJuXRAQeT8ugC3KQ8OgE2KY9uQE3KoyNAk\/LoCsykPDoDMunqsb9w3heyOzhcxfwLxKSvx887fPgeAP1hsdgnN+nucbHYk13H9HMFcHKTnle8\/aZ3uYt8In83ObuaNL8czTH97X8hi8q7C7mDapHN5EN2BpWP96pH1SKVyefsh+Buz8D1+GG1yGNyMPv+FPcx0g9e2xxXiyQmR7M73jN\/w3E3dqNuZC0SmHyV\/XD2fsJeL6y1qAac\/l12z2Z53L25Cj+4FpVA00\/IfvB5Wy77CXfpRteC1uTE7Ksz2OWyf\/VIpapFDbD0M7KvdrASTrYINemy+gqUfmb2w+lqn2G9W2WsRSmQ9CXZt6aj6sdu7FPjBTS1KAKQvjC7ZYRN8lpQpC\/NbpmhTCRPLRjSF2e3DFEokqYWBOnLsxuGKBbJUov49BXZzTLUiCSpRXj6muxGEb4oF8lRi+j0VdlNEvxQIZKiFsHp67IbBPilRiRDLWLTV2Y3qN4vVSIJahGavjZ7dfFuqBMZX4vI9NXZK2t3R6XI8FoEpq\/PXlW6B2pFRtciLr1B9orKPVEtMrgWYektshcXboB6kbG1qKYwvUn2wroNYiAytBb1FKW3yV5UthEsREbWwoCC9EbZC50NYiIysBYWzE5vlb3Y2gA2IuNqYcLM9GbZK7w9YSQyrBY2zEpvl73K3ANWIqNqYcSM9IbZK93dYSYyqBZWTE5vmb3a3g12ImNqYcbE9KbZDfz9YigypBZ2TEpvm93E4A+WIiNqYciE9MbZjRx+YSoyoBaWvE1vnd3MorlI\/1qY8ia9eXZike61sOVlevvszCK9a2HMi\/SA7NQinWthzWh6RHZukb61MGckPSQ7uUjXWtgzmB6TnV2kZy0ADKQHZacX6VgLBE\/pUdn5RfrVAsJDelj2BCLdaoHhLj0uewaRXrUAcZMemD2FSKdaoPhNj8yeQ6RPLWD8pIdmTyLSpRY4vtJjs2cR6VELIPs1OnsakQ61QLI\/gf9AHpH4WqQmkUjxColsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlsBIlshJ0hXd6SLBaLf8KmBq6lNLddAAAAAElFTkSuQmCC\" alt=\"Engranaje de configuraci\u00f3n\"><\/div>\n          <h3 class=\"vl-mb-8\">Imposible controlar la calidad a escala<\/h3>\n          <p class=\"text-small\">No puedes asistir a todas las reuniones de tus compa\u00f1eros y pierdes informaci\u00f3n de c\u00f3mo se llevaron a cabo.<\/p>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       SOLUCI\u00d3N \u2014 C\u00f3mo funciona (3 pasos)\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section vl-section--alt\" style=\"padding-bottom:140px;\">\n    <div class=\"vl-container\">\n\n      <div class=\"vl-text-center vl-mb-64 vl-reveal\">\n        <span class=\"vl-badge vl-badge--green vl-mb-16\">La soluci\u00f3n<\/span>\n        <h2 class=\"vl-mb-16\" style=\"max-width:720px;margin:0 auto;\">Control total de tu equipo<\/h2>\n      <\/div>\n\n      <!-- Paso 1 -->\n      <div style=\"display:flex;align-items:center;gap:48px;margin-bottom:80px;\" class=\"vl-step-row vl-reveal\">\n        <div style=\"flex:1;\">\n          <div style=\"display:flex;align-items:center;gap:16px;\" class=\"vl-mb-16\">\n            <div class=\"vl-step-number\">1<\/div>\n            <h3>Dashboard centralizado<\/h3>\n          <\/div>\n          <p class=\"vl-mb-16\">Visi\u00f3n global de todos tus compa\u00f1eros: reuniones realizadas, tiempo medio, informes generados y mucho m\u00e1s.<span class=\"vl-info-tooltip\"><span class=\"vl-info-icon\">i<\/span><span class=\"vl-info-text\">Filtra por cada compa\u00f1ero. KPIs en tiempo real sin necesidad de pedirle nada a nadie.<\/span><\/span><\/p>\n        <\/div>\n        <div style=\"flex:1;\">\n          <!-- MOCKUP PASO 1: Gr\u00e1fica de actividad del equipo (toggle + tooltip) -->\n          <div class=\"vl-tm\" data-tm-mock>\n            <div class=\"vl-tm-graph\" data-tm-graph>\n              <!-- Leyenda con toggles -->\n              <div class=\"vl-tm-graph-legend\">\n                <span class=\"vl-tm-chip\" data-tm-series=\"reports\"><span class=\"vl-tm-chip-swatch vl-tm-chip-swatch--reports\"><\/span>Total Informes<\/span>\n                <span class=\"vl-tm-chip\" data-tm-series=\"users\"><span class=\"vl-tm-chip-swatch vl-tm-chip-swatch--users\"><\/span>Usuarios Activos<\/span>\n              <\/div>\n\n              <!-- Zona del gr\u00e1fico -->\n              <div class=\"vl-tm-plot\">\n                <div class=\"vl-tm-yaxis\"><span>60<\/span><span>30<\/span><span>0<\/span><\/div>\n                <div class=\"vl-tm-gridline\" style=\"top:0;\"><\/div>\n                <div class=\"vl-tm-gridline\" style=\"top:50%;\"><\/div>\n\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:63%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:9%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Oct 2025<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 38<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 3<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:78%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:6%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Nov 2025<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 47<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 2<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:38%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:9%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Dic 2025<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 23<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 3<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:48%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:6%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Ene 2026<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 29<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 2<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:30%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:9%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Feb 2026<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 18<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 3<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:68%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:12%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Mar 2026<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 41<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 4<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup is-active\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:37%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:9%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">Abr 2026<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 22<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 3<\/div><\/div>\n                <\/div>\n                <div class=\"vl-tm-bargroup\">\n                  <span class=\"vl-tm-bar vl-tm-bar--reports\" style=\"--h:10%;\"><\/span>\n                  <span class=\"vl-tm-bar vl-tm-bar--users\" style=\"--h:4%;\"><\/span>\n                  <div class=\"vl-tm-tip\"><div class=\"vl-tm-tip-title\">May 2026<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--reports\"><\/span>Total Informes: 6<\/div><div class=\"vl-tm-tip-row\"><span class=\"vl-tm-tip-dot vl-tm-chip-swatch--users\"><\/span>Usuarios Activos: 1<\/div><\/div>\n                <\/div>\n              <\/div>\n              <div class=\"vl-tm-xaxis\"><span>Oct<\/span><span>Nov<\/span><span>Dic<\/span><span>Ene<\/span><span>Feb<\/span><span>Mar<\/span><span>Abr<\/span><span>May<\/span><\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Paso 2 -->\n      <div style=\"display:flex;align-items:center;gap:48px;margin-bottom:80px;flex-direction:row-reverse;\" class=\"vl-step-row vl-reveal\">\n        <div style=\"flex:1;\">\n          <div style=\"display:flex;align-items:center;gap:16px;\" class=\"vl-mb-16\">\n            <div class=\"vl-step-number\">2<\/div>\n            <h3>Estad\u00edsticas individuales<\/h3>\n          <\/div>\n          <p class=\"vl-mb-16\">Haz click en cualquier persona del equipo y accede a toda su informaci\u00f3n: duraci\u00f3n de cada reuni\u00f3n, t\u00edtulos de cada reuni\u00f3n y evoluci\u00f3n mensual.<span class=\"vl-info-tooltip\"><span class=\"vl-info-icon\">i<\/span><span class=\"vl-info-text\">Identifica al instante qui\u00e9n tiene m\u00e1s carga de trabajo. Decisiones basadas en datos, no en sensaciones.<\/span><\/span><\/p>\n        <\/div>\n        <div style=\"flex:1;\">\n          <!-- MOCKUP PASO 2: Perfil individual (stats + reuniones con play) -->\n          <div class=\"vl-tm vl-tm-card\" data-tm-mock>\n\n            <!-- Barra de perfil -->\n            <div class=\"vl-tm-profile-bar\">\n              <span class=\"vl-tm-profile-back\">\u2039<\/span>\n              <img class=\"vl-tm-avatar\" style=\"width:30px;height:30px;\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/laura-pena-candidata.webp\" alt=\"Ana Ruiz\" loading=\"lazy\" decoding=\"async\"\/>\n              <div style=\"flex:1;min-width:0;\">\n                <div class=\"vl-tm-member-name\">Ana Ruiz<\/div>\n                <div class=\"vl-tm-member-sub\">Equipo \u00b7 Mayo 2026<\/div>\n              <\/div>\n            <\/div>\n\n            <!-- 3 indicadores -->\n            <div class=\"vl-tm-stats\">\n              <div class=\"vl-tm-stat\"><div class=\"vl-tm-stat-num\">48<span style=\"font-size:12px;font-weight:600;\"> min<\/span><\/div><div class=\"vl-tm-stat-label\">Duraci\u00f3n media<\/div><\/div>\n              <div class=\"vl-tm-stat\"><div class=\"vl-tm-stat-num\">7<\/div><div class=\"vl-tm-stat-label\">Grabadas<\/div><\/div>\n              <div class=\"vl-tm-stat\"><div class=\"vl-tm-stat-num\">4<\/div><div class=\"vl-tm-stat-label\">Informes<\/div><\/div>\n            <\/div>\n\n            <!-- Lista de reuniones -->\n            <div class=\"vl-tm-meetings\">\n              <div class=\"vl-tm-meeting\">\n                <span class=\"vl-tm-meeting-name\">Reuni\u00f3n con cliente \u00b7 Propuesta<\/span>\n                <span class=\"vl-tm-meeting-dur\">32 min<\/span>\n                <span class=\"vl-tm-meeting-report\" title=\"Informe generado\"><svg viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"12\" cy=\"12\" r=\"10\" stroke=\"#1F7D34\" stroke-width=\"1.8\"\/><path d=\"M8 12l3 3 5-6\" stroke=\"#1F7D34\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span>\n                <span class=\"vl-tm-play\" data-tm-rowplay><svg class=\"vl-tm-play-tri\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7z\"\/><\/svg><span class=\"vl-tm-eq\"><i><\/i><i><\/i><i><\/i><\/span><\/span>\n                <span class=\"vl-tm-progress\"><\/span>\n              <\/div>\n              <div class=\"vl-tm-meeting\">\n                <span class=\"vl-tm-meeting-name\">Entrevista \u2014 Project Manager<\/span>\n                <span class=\"vl-tm-meeting-dur\">45 min<\/span>\n                <span class=\"vl-tm-meeting-report\" title=\"Informe generado\"><svg viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"12\" cy=\"12\" r=\"10\" stroke=\"#1F7D34\" stroke-width=\"1.8\"\/><path d=\"M8 12l3 3 5-6\" stroke=\"#1F7D34\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span>\n                <span class=\"vl-tm-play\" data-tm-rowplay><svg class=\"vl-tm-play-tri\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7z\"\/><\/svg><span class=\"vl-tm-eq\"><i><\/i><i><\/i><i><\/i><\/span><\/span>\n                <span class=\"vl-tm-progress\"><\/span>\n              <\/div>\n              <div class=\"vl-tm-meeting\">\n                <span class=\"vl-tm-meeting-name\">Daily de equipo<\/span>\n                <span class=\"vl-tm-meeting-dur\">12 min<\/span>\n                <span class=\"vl-tm-meeting-report\" title=\"Solo audio\"><svg viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"12\" cy=\"12\" r=\"10\" stroke=\"#C4C4C4\" stroke-width=\"1.8\"\/><path d=\"M9 9l6 6M15 9l-6 6\" stroke=\"#C4C4C4\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/><\/svg><\/span>\n                <span class=\"vl-tm-play\" data-tm-rowplay><svg class=\"vl-tm-play-tri\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7z\"\/><\/svg><span class=\"vl-tm-eq\"><i><\/i><i><\/i><i><\/i><\/span><\/span>\n                <span class=\"vl-tm-progress\"><\/span>\n              <\/div>\n              <div class=\"vl-tm-meeting\">\n                <span class=\"vl-tm-meeting-name\">Llamada de seguimiento \u00b7 Q2<\/span>\n                <span class=\"vl-tm-meeting-dur\">27 min<\/span>\n                <span class=\"vl-tm-meeting-report\" title=\"Informe generado\"><svg viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"12\" cy=\"12\" r=\"10\" stroke=\"#1F7D34\" stroke-width=\"1.8\"\/><path d=\"M8 12l3 3 5-6\" stroke=\"#1F7D34\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span>\n                <span class=\"vl-tm-play\" data-tm-rowplay><svg class=\"vl-tm-play-tri\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7z\"\/><\/svg><span class=\"vl-tm-eq\"><i><\/i><i><\/i><i><\/i><\/span><\/span>\n                <span class=\"vl-tm-progress\"><\/span>\n              <\/div>\n            <\/div>\n\n          <\/div>\n        <\/div>\n      <\/div>\n\n      <!-- Paso 3 -->\n      <div style=\"display:flex;align-items:center;gap:48px;\" class=\"vl-step-row vl-reveal\">\n        <div style=\"flex:1;\">\n          <div style=\"display:flex;align-items:center;gap:16px;\" class=\"vl-mb-16\">\n            <div class=\"vl-step-number\">3<\/div>\n            <h3>Cada reuni\u00f3n con su informe, audio y chat IA<\/h3>\n          <\/div>\n          <p class=\"vl-mb-16\">Entra en cualquier reuni\u00f3n o entrevista documentada: lee el informe, escucha la conversaci\u00f3n original o preg\u00fantale a la IA lo que desees. Calidad asegurada sin asistir a las reuniones.<span class=\"vl-info-tooltip\"><span class=\"vl-info-icon\">i<\/span><span class=\"vl-info-text\">Como si hubieras estado presente en cada reuni\u00f3n, pero sin haberle dedicado el tiempo. Control de calidad masivo en minutos.<\/span><\/span><\/p>\n        <\/div>\n        <div style=\"flex:1;\">\n          <!-- MOCKUP PASO 3: Panel de reuni\u00f3n estilo Notion (informe + audio + chat) -->\n          <div class=\"vl-tm\" data-tm-mock>\n            <div class=\"vl-tm-notion\">\n\n              <!-- Barra de propietario: deja claro que entras en la cuenta de un compa\u00f1ero -->\n              <div class=\"vl-tm-notion-owner\">\n                <span class=\"vl-tm-owner-back\">\u2039<\/span>\n                <img class=\"vl-tm-owner-av\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/javier-ruiz-candidato.webp\" alt=\"David Torres\" loading=\"lazy\" decoding=\"async\"\/>\n                <span class=\"vl-tm-owner-text\">Repositorio de <b>David Torres<\/b><\/span>\n                <span class=\"vl-tm-owner-tag\">Tu compa\u00f1ero<\/span>\n              <\/div>\n\n              <!-- Cabecera: t\u00edtulo + reproductor minimalista inline -->\n              <div class=\"vl-tm-notion-head\">\n                <span class=\"vl-tm-notion-title\">Entrevista a Marta Gil<\/span>\n                <span class=\"vl-tm-notion-play\" data-tm-play>\n                  <span class=\"vl-tm-playicon\">\n                    <svg class=\"vl-tm-ic-play\" width=\"9\" height=\"9\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M8 5v14l11-7z\"\/><\/svg>\n                    <svg class=\"vl-tm-ic-pause\" width=\"9\" height=\"9\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M6 5h4v14H6zM14 5h4v14h-4z\"\/><\/svg>\n                  <\/span>\n                  <span class=\"vl-tm-play-label\">Escuchar audio<\/span>\n                  <span class=\"vl-tm-mini\">\n                    <span class=\"vl-tm-mini-track\"><span class=\"vl-tm-mini-fill\"><\/span><span class=\"vl-tm-mini-dot\"><\/span><\/span>\n                    <span class=\"vl-tm-mini-time\">02:14<\/span>\n                  <\/span>\n                <\/span>\n              <\/div>\n\n              <!-- Cuerpo del informe (candidato entrevistado por un compa\u00f1ero) -->\n              <div class=\"vl-tm-notion-body\">\n                <div class=\"vl-tm-report-section\">\n                  <h6 class=\"vl-tm-report-h\">Resumen del candidato<\/h6>\n                  <p class=\"vl-tm-report-p\">Marta Gil, 6 a\u00f1os como desarrolladora backend (Java y Python). Entrevistada por David Torres. Comunicaci\u00f3n clara y alto encaje cultural con el equipo.<\/p>\n                <\/div>\n                <div class=\"vl-tm-report-section\">\n                  <h6 class=\"vl-tm-report-h\">Valoraci\u00f3n<\/h6>\n                  <p class=\"vl-tm-report-p\">Nivel t\u00e9cnico s\u00f3lido, sobre todo en arquitectura de microservicios. Falta validar experiencia liderando equipos. Recomendaci\u00f3n: pasar a segunda fase.<\/p>\n                <\/div>\n              <\/div>\n\n              <!-- Respuesta IA (aparece tras \"escribir\" en el chat) -->\n              <div class=\"vl-tm-ai-answer\" data-tm-answer>\n                <div class=\"vl-tm-ai-answer-label\"><svg width=\"13\" height=\"9\" viewBox=\"0 0 90.23 54.17\" fill=\"#5E6B17\"><path d=\"M72.18,36.11v-18h-18v18c-8.6,0-12.93-5.21-19.84-14.43C27.06,12,18.05,0,0,0V18.07c8.6,0,12.93,5.22,19.84,14.43,7.24,9.65,16.25,21.67,34.3,21.67V36.11ZM90.23,0h-18v18h18Z\"\/><\/svg> Respuesta IA<\/div>\n                David la valora con un 8,5\/10: muy fuerte en backend y microservicios, con margen de mejora en gesti\u00f3n de equipos. La recomienda para segunda fase.\n              <\/div>\n\n              <!-- Caja de chat -->\n              <div class=\"vl-tm-chatbox\">\n                <span class=\"vl-tm-chatbox-text\" data-tm-chat>\u00bfQu\u00e9 valoraci\u00f3n le dio David a la candidata?<\/span>\n                <span class=\"vl-tm-chatbox-send\"><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M5 12h14m-6-6l6 6-6 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span>\n              <\/div>\n\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       CASOS DE USO\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section vl-section--alt\">\n    <div class=\"vl-container\">\n\n      <div class=\"vl-text-center vl-mb-48 vl-reveal\">\n        <h2 class=\"vl-mb-16\">Para cualquier responsable de equipo<\/h2>\n      <\/div>\n\n      <div class=\"vl-grid-3 vl-reveal\">\n        <!-- Caso 1: Directores de selecci\u00f3n \u2014 CV con avatar -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#FFE8D6;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"5\" y=\"3\" width=\"22\" height=\"26\" rx=\"2\" fill=\"#1A171B\"\/><circle cx=\"11\" cy=\"11\" r=\"2.5\" fill=\"#FFE8D6\"\/><path d=\"M7 17.5c0-2 1.8-3.5 4-3.5s4 1.5 4 3.5V19H7v-1.5z\" fill=\"#FFE8D6\"\/><rect x=\"17\" y=\"9\" width=\"7\" height=\"1.8\" fill=\"#FFE8D6\"\/><rect x=\"17\" y=\"13\" width=\"7\" height=\"1.8\" fill=\"#FFE8D6\"\/><rect x=\"8\" y=\"22\" width=\"16\" height=\"1.8\" fill=\"#FFE8D6\"\/><rect x=\"8\" y=\"25.5\" width=\"11\" height=\"1.8\" fill=\"#FFE8D6\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Directores de selecci\u00f3n<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Controla la calidad de las entrevistas sin asistir a ninguna<\/p>\n          <\/div>\n        <\/div>\n\n        <!-- Caso 2: Coordinadores de proyectos \u2014 malet\u00edn -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#E1F4E4;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M11 8V6a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v2\" stroke=\"#1A171B\" stroke-width=\"2.5\" fill=\"none\"\/><rect x=\"3\" y=\"9\" width=\"26\" height=\"18\" rx=\"2\" fill=\"#1A171B\"\/><rect x=\"13\" y=\"16\" width=\"6\" height=\"3\" rx=\"0.5\" fill=\"#E1F4E4\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Directores de ventas<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Revisa las llamadas comerciales de tu equipo y replica lo que funciona<\/p>\n          <\/div>\n        <\/div>\n\n        <!-- Caso 3: Equipos remotos o distribuidos \u2014 tres personas -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#EEE3F7;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"16\" cy=\"11\" r=\"4.5\" fill=\"#1A171B\"\/><path d=\"M7 27c0-4.5 4-8 9-8s9 3.5 9 8v1H7v-1z\" fill=\"#1A171B\"\/><circle cx=\"5.5\" cy=\"13.5\" r=\"3.2\" fill=\"#1A171B\"\/><path d=\"M0.5 25c0-2.8 2.3-5 5-5h2.5v8H0.5v-3z\" fill=\"#1A171B\"\/><circle cx=\"26.5\" cy=\"13.5\" r=\"3.2\" fill=\"#1A171B\"\/><path d=\"M24 20h2.5c2.7 0 5 2.2 5 5v3H24v-8z\" fill=\"#1A171B\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Coordinadores de proyectos<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Sigue el avance de cada proyecto sin reuniones de seguimiento<\/p>\n          <\/div>\n        <\/div>\n\n        <!-- Caso 4: Consultoras 360\u00b0 \u2014 auriculares con micro -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#FFF6CC;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M4 18v-2C4 9.5 9.5 4 16 4s12 5.5 12 12v2\" stroke=\"#1A171B\" stroke-width=\"2.8\" fill=\"none\" stroke-linecap=\"round\"\/><rect x=\"2\" y=\"16\" width=\"6.5\" height=\"11\" rx=\"2\" fill=\"#1A171B\"\/><rect x=\"23.5\" y=\"16\" width=\"6.5\" height=\"11\" rx=\"2\" fill=\"#1A171B\"\/><path d=\"M26.5 27v2.5h-6\" stroke=\"#1A171B\" stroke-width=\"2.2\" fill=\"none\" stroke-linecap=\"round\"\/><circle cx=\"19\" cy=\"29.5\" r=\"1.5\" fill=\"#1A171B\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Atenci\u00f3n al cliente<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Supervisa la calidad de la atenci\u00f3n sin escuchar cada llamada<\/p>\n          <\/div>\n        <\/div>\n\n        <!-- Caso 5: RPO y outsourcing \u2014 gr\u00e1fico de barras -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#DEEBFD;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"3\" y=\"3\" width=\"26\" height=\"20\" rx=\"2\" fill=\"#1A171B\"\/><rect x=\"7\" y=\"15\" width=\"3.5\" height=\"5\" fill=\"#DEEBFD\"\/><rect x=\"12.5\" y=\"11\" width=\"3.5\" height=\"9\" fill=\"#DEEBFD\"\/><rect x=\"18\" y=\"13\" width=\"3.5\" height=\"7\" fill=\"#DEEBFD\"\/><rect x=\"23.5\" y=\"8\" width=\"3\" height=\"12\" fill=\"#DEEBFD\"\/><rect x=\"14\" y=\"23\" width=\"4\" height=\"4\" fill=\"#1A171B\"\/><rect x=\"9\" y=\"27\" width=\"14\" height=\"2.5\" rx=\"0.5\" fill=\"#1A171B\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Equipos remotos o distribuidos<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Coordina equipos en distintas oficinas o en remoto sin reuniones diarias<\/p>\n          <\/div>\n        <\/div>\n\n        <!-- Caso 6: Equipos en crecimiento \u2014 lupa -->\n        <div class=\"vl-card vl-card--flip\" style=\"text-align:center;\">\n          <div class=\"vl-card-flip-front\" style=\"flex-direction:column;align-items:center;justify-content:center;gap:16px;\">\n            <div class=\"vl-icon vl-icon--light\" style=\"background:#FBE0E8;\"><svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><circle cx=\"13\" cy=\"13\" r=\"8.5\" stroke=\"#1A171B\" stroke-width=\"3\" fill=\"none\"\/><path d=\"M19.5 19.5l9 9\" stroke=\"#1A171B\" stroke-width=\"3.5\" stroke-linecap=\"round\"\/><\/svg><\/div>\n            <h4 style=\"font-size:20px;margin:0;\">Equipos en crecimiento<\/h4>\n          <\/div>\n          <div class=\"vl-card-flip-back\" style=\"justify-content:center;text-align:center;\">\n            <p class=\"text-small\" style=\"margin:0;\">Escala tu equipo sin perder control sobre lo que hace cada persona<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       TESTIMONIAL\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       TESTIMONIOS (4 clientes reales RRHH)\n       Las fotos est\u00e1n como iniciales \u2014 sustituir por LinkedIn \/ Google\n       cuando el cliente d\u00e9 permiso. URLs LinkedIn al final de cada bloque.\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section vl-section--alt vl-tstack-section\" style=\"padding:0;\">\n    <div class=\"vl-tstack-track\">\n      <div class=\"vl-tstack-sticky\">\n        <div class=\"vl-container\">\n\n          <div class=\"vl-text-center\" style=\"margin-bottom:90px;\">\n            <h2 class=\"vl-mb-16\">Ellos ya lo han probado<\/h2>\n          <\/div>\n\n          <div class=\"vl-tstack-cards\">\n\n            <!-- Testimonio 1: H\u00e9ctor Huertas \u2014 Buenpuerto -->\n            <div class=\"vl-testimonial vl-testimonial--compact vl-tstack-card\" data-tstack-idx=\"0\">\n              <p class=\"vl-testimonial-text\">\n                Llevo m\u00e1s de 25 a\u00f1os en selecci\u00f3n y nunca hab\u00eda tenido tanta visibilidad. S\u00e9 qu\u00e9 hace cada consultor sin pedirles nada y puedo apoyar exactamente donde hace falta.\n              <\/p>\n              <div class=\"vl-testimonial-author\">\n                <div class=\"vl-testimonial-avatar\"><img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/hector-huertas.webp\" alt=\"H\u00e9ctor Huertas\"><\/div>\n                <div>\n                  <div class=\"vl-testimonial-name\">H\u00e9ctor Huertas<\/div>\n                  <div class=\"vl-testimonial-role\">Socio Director \u00b7 Buenpuerto<br>+25 a\u00f1os en RRHH<\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <!-- Testimonio 2: I\u00f1aki Goyeneche \u2014 ieTeam -->\n            <div class=\"vl-testimonial vl-testimonial--compact vl-tstack-card\" data-tstack-idx=\"1\">\n              <p class=\"vl-testimonial-text\">\n                Coordinar a todo el equipo era un caos. Ahora tengo el dashboard, los audios y los informes de cada compa\u00f1ero en una sola pantalla. Cero reuniones de seguimiento.\n              <\/p>\n              <div class=\"vl-testimonial-author\">\n                <div class=\"vl-testimonial-avatar\"><img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/inaki-goyeneche.webp\" alt=\"I\u00f1aki Goyeneche\"><\/div>\n                <div>\n                  <div class=\"vl-testimonial-name\">I\u00f1aki Goyeneche<\/div>\n                  <div class=\"vl-testimonial-role\">Talent Area Manager \u00b7 ieTeam<br>+24 a\u00f1os en consultor\u00eda de talento<\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <!-- Testimonio 3: Cristina Muler \u2014 Brandty -->\n            <div class=\"vl-testimonial vl-testimonial--compact vl-tstack-card\" data-tstack-idx=\"2\">\n              <p class=\"vl-testimonial-text\">\n                Como CEO de una consultora puedo entrar en cualquier proceso y entender qu\u00e9 est\u00e1 pasando en 30 segundos. Antes necesitaba 1h de meeting con el responsable para lo mismo.\n              <\/p>\n              <div class=\"vl-testimonial-author\">\n                <div class=\"vl-testimonial-avatar\"><img decoding=\"async\" src=\"https:\/\/voicit.com\/wp-content\/uploads\/2026\/05\/cristina-muler.webp\" alt=\"Cristina Muler\"><\/div>\n                <div>\n                  <div class=\"vl-testimonial-name\">Cristina Muler<\/div>\n                  <div class=\"vl-testimonial-role\">CEO \u00b7 Brandty<br>Consultora de Selecci\u00f3n<\/div>\n                <\/div>\n              <\/div>\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       EL ANTES Y EL DESPU\u00c9S (comparativa)\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section\">\n    <div class=\"vl-container\">\n\n      <div class=\"vl-text-center vl-mb-48 vl-reveal\">\n        <h2 class=\"vl-mb-16 vl-h2-balance\">Un cambio que te impulsar\u00e1 como l\u00edder y responsable<\/h2>\n      <\/div>\n\n\n      <div class=\"vl-compare-grid vl-reveal\">\n\n        <!-- Card \"Antes\" -->\n        <div class=\"vl-compare-card vl-compare-card--before\">\n          <span class=\"vl-compare-label\">Antes<\/span>\n          <h3 class=\"vl-compare-title\">Sin Voicit<\/h3>\n          <ul class=\"vl-compare-list\">\n            <li>\n              <span class=\"vl-compare-dash\" aria-hidden=\"true\"><\/span>\n              <span>Reuniones semanales para tener visibilidad<\/span>\n            <\/li>\n            <li>\n              <span class=\"vl-compare-dash\" aria-hidden=\"true\"><\/span>\n              <span>Informaci\u00f3n atada a cada persona del equipo<\/span>\n            <\/li>\n            <li>\n              <span class=\"vl-compare-dash\" aria-hidden=\"true\"><\/span>\n              <span>Sin forma de revisar lo que pas\u00f3 en cada reuni\u00f3n<\/span>\n            <\/li>\n          <\/ul>\n        <\/div>\n\n        <!-- Flecha de transformaci\u00f3n (visible solo en desktop) -->\n        <div class=\"vl-compare-arrow\" aria-hidden=\"true\">\n          <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\">\n            <path d=\"M6 16h20m-6-6l6 6-6 6\" stroke=\"#9A9A9A\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n          <\/svg>\n        <\/div>\n\n        <!-- Card \"Ahora\" -->\n        <div class=\"vl-compare-card vl-compare-card--after\">\n          <span class=\"vl-compare-label\">Ahora<\/span>\n          <h3 class=\"vl-compare-title\">Con Voicit<\/h3>\n          <ul class=\"vl-compare-list\">\n            <li>\n              <span class=\"vl-compare-check\" aria-hidden=\"true\">\u2713<\/span>\n              <span>Dashboard en tiempo real sin pedir nada<\/span>\n            <\/li>\n            <li>\n              <span class=\"vl-compare-check\" aria-hidden=\"true\">\u2713<\/span>\n              <span>Acceso a audios, informes y chat IA de cada reuni\u00f3n<\/span>\n            <\/li>\n            <li>\n              <span class=\"vl-compare-check\" aria-hidden=\"true\">\u2713<\/span>\n              <span>Revisa cualquier reuni\u00f3n sin haber asistido<\/span>\n            <\/li>\n          <\/ul>\n        <\/div>\n\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       CTA FINAL (p\u00edldora gris claro sobre fondo blanco)\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section\" style=\"background:#FFFFFF;text-align:center;padding:80px 0 100px;\">\n    <div class=\"vl-container\">\n      <div class=\"vl-cta-pill vl-reveal\">\n\n        <h2 class=\"vl-mb-16\" style=\"color:#161616;\">Toma el control de tu equipo<\/h2>\n        <p style=\"font-size:18px;color:#424242;max-width:560px;margin:0 auto 28px;\">\n          Empieza gratis. Sin compromiso. Sin tarjeta de cr\u00e9dito.\n        <\/p>\n\n        <div style=\"display:flex;gap:16px;justify-content:center;flex-wrap:wrap;\">\n          <a href=\"https:\/\/app.voicit.com\/signup\" class=\"vl-btn vl-btn--brand\">\n            Solicitar demo\n          <\/a>\n          <a href=\"https:\/\/calendly.com\/alvaroarres\/voicitcall\" class=\"vl-btn vl-btn--secondary\" rel=\"nofollow noopener\" target=\"_blank\">\n            Solicitar demo\n          <\/a>\n        <\/div>\n\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n       FAQ\n       \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n  <section class=\"vl-section\">\n    <div class=\"vl-container--narrow\">\n\n      <div class=\"vl-text-center vl-mb-48 vl-reveal\">\n        <h2>Preguntas frecuentes<\/h2>\n      <\/div>\n\n      <div class=\"vl-faq vl-reveal\">\n        <details>\n          <summary>\u00bfNecesito que mi equipo cambie de herramientas para usarlo?<\/summary>\n          <div class=\"vl-faq-answer\">\n            <p>No. Tu equipo sigue usando Voicit como siempre (grabando reuniones, generando informes). El dashboard se alimenta autom\u00e1ticamente de su actividad, sin que tengan que hacer nada extra.<\/p>\n          <\/div>\n        <\/details>\n\n        <details>\n          <summary>\u00bfPuedo ver reuniones a las que no he asistido?<\/summary>\n          <div class=\"vl-faq-answer\">\n            <p>S\u00ed. Tienes acceso a todas las reuniones de tu equipo: audio original, transcripci\u00f3n completa, informe generado y chat IA para preguntar cualquier detalle. Sin pedirle el archivo a nadie.<\/p>\n          <\/div>\n        <\/details>\n\n        <details>\n          <summary>\u00bfFunciona para mi sector o solo para selecci\u00f3n?<\/summary>\n          <div class=\"vl-faq-answer\">\n            <p>Funciona para cualquier equipo que tenga reuniones: ventas, atenci\u00f3n al cliente, proyectos, operaciones\u2026 En consultoras de selecci\u00f3n y RRHH es uno de los casos de uso m\u00e1s potentes, ya que permite revisar la calidad de las entrevistas de todo el equipo sin asistir a ninguna.<\/p>\n          <\/div>\n        <\/details>\n\n        <details>\n          <summary>\u00bfQu\u00e9 m\u00e9tricas concretas veo en el dashboard?<\/summary>\n          <div class=\"vl-faq-answer\">\n            <p>Reuniones realizadas, informes generados, tiempo medio por reuni\u00f3n, duraci\u00f3n total, evoluci\u00f3n mensual\u2026 Y todas filtrables por cada compa\u00f1ero o por periodo.<\/p>\n          <\/div>\n        <\/details>\n\n        <details>\n          <summary>\u00bfC\u00f3mo se ahorra tiempo concretamente?<\/summary>\n          <div class=\"vl-faq-answer\">\n            <p>Eliminas las reuniones de seguimiento semanal con cada compa\u00f1ero (2-4h\/semana) y la necesidad de pedir audios o informes uno por uno. El dashboard te da en 30 segundos lo que antes requer\u00eda 1h de meeting.<\/p>\n          <\/div>\n        <\/details>\n      <\/div>\n\n      <div style=\"text-align:center;margin-top:48px;\">\n        <a href=\"https:\/\/voicit.com\/voicit-faqs\/\" class=\"vl-btn\" style=\"background:#161616 !important;color:#FFFFFF !important;border:none;border-radius:100px;padding:14px 32px;font-weight:700;font-size:15px;text-decoration:none !important;display:inline-flex;align-items:center;\">\n          M\u00e1s dudas aqu\u00ed\n        <\/a>\n      <\/div>\n\n    <\/div>\n  <\/section>\n\n<\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     SCHEMA JSON-LD\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"WebPage\",\n  \"name\": \"Gestiona tu equipo con datos \u2014 Control y visibilidad con Voicit\",\n  \"description\": \"Dashboard para responsables de equipo: m\u00e9tricas por compa\u00f1ero, acceso a reuniones, informes y audios. Controla la calidad y la eficiencia de tu equipo sin asistir a cada reuni\u00f3n.\",\n  \"url\": \"https:\/\/voicit.com\/control-de-equipo\/\",\n  \"publisher\": {\n    \"@type\": \"Organization\",\n    \"name\": \"Voicit\",\n    \"logo\": {\n      \"@type\": \"ImageObject\",\n      \"url\": \"https:\/\/voicit.com\/wp-content\/uploads\/2024\/01\/voicit-logo.png\"\n    }\n  }\n}\n<\/script>\n\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"FAQPage\",\n  \"mainEntity\": [\n    {\n      \"@type\": \"Question\",\n      \"name\": \"\u00bfNecesito que mi equipo cambie de herramientas para usarlo?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"No. Tu equipo sigue usando Voicit como siempre (grabando reuniones, generando informes). El dashboard se alimenta autom\u00e1ticamente de su actividad, sin que tengan que hacer nada extra.\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"\u00bfPuedo ver reuniones a las que no he asistido?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"S\u00ed. Tienes acceso a todas las reuniones de tu equipo: audio original, transcripci\u00f3n completa, informe generado y chat IA para preguntar cualquier detalle. Sin pedirle el archivo a nadie.\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"\u00bfFunciona para mi sector o solo para selecci\u00f3n?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"Funciona para cualquier equipo que tenga reuniones: ventas, atenci\u00f3n al cliente, proyectos, operaciones\u2026 En consultoras de selecci\u00f3n y RRHH es uno de los casos de uso m\u00e1s potentes, ya que permite revisar la calidad de las entrevistas de todo el equipo sin asistir a ninguna.\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"\u00bfQu\u00e9 m\u00e9tricas concretas veo en el dashboard?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"Reuniones realizadas, informes generados, tiempo medio por reuni\u00f3n, duraci\u00f3n total, evoluci\u00f3n mensual\u2026 Y todas filtrables por cada compa\u00f1ero o por periodo.\"\n      }\n    },\n    {\n      \"@type\": \"Question\",\n      \"name\": \"\u00bfC\u00f3mo se ahorra tiempo concretamente?\",\n      \"acceptedAnswer\": {\n        \"@type\": \"Answer\",\n        \"text\": \"Eliminas las reuniones de seguimiento semanal con cada compa\u00f1ero (2-4h\/semana) y la necesidad de pedir audios o informes uno por uno. El dashboard te da en 30 segundos lo que antes requer\u00eda 1h de meeting.\"\n      }\n    }\n  ]\n}\n<\/script>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     JavaScript \u2014 Scroll Animations\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<script>\n(function() {\n  'use strict';\n\n  \/\/ Intersection Observer para reveal on scroll\n  const observer = new IntersectionObserver((entries) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n        entry.target.classList.add('is-visible');\n        observer.unobserve(entry.target);\n      }\n    });\n  }, {\n    threshold: 0.1,\n    rootMargin: '0px 0px -50px 0px'\n  });\n\n  \/\/ Observar todos los elementos .vl-reveal EXCEPTO los mockups\n  document.querySelectorAll('.vl-reveal:not(.vl-mk-filepicker):not(.vl-mk-chat):not(.vl-mk-editor)').forEach(el => {\n    observer.observe(el);\n  });\n\n  \/\/ Observador espec\u00edfico para mockups con trigger m\u00e1s estricto\n  \/\/ (solo dispara cuando el mockup est\u00e1 bien dentro del viewport)\n  const mockupObserver = new IntersectionObserver((entries) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n        entry.target.classList.add('is-visible');\n        mockupObserver.unobserve(entry.target);\n\n        \/\/ Editor del Paso 3: abrir autom\u00e1ticamente \"23 informes generados\" tras la intro\n        if (entry.target.classList.contains('vl-mk-editor')) {\n          setTimeout(() => {\n            const sections = entry.target.querySelectorAll('[data-vl-section]');\n            \/\/ Secci\u00f3n 2 = 23 informes generados (\u00edndice 1)\n            if (sections[1]) vlEditorOpenSection(sections[1]);\n          }, 1100);\n        }\n      }\n    });\n  }, {\n    threshold: 0.45,\n    rootMargin: '0px 0px -15% 0px'\n  });\n  document.querySelectorAll('.vl-mk-filepicker, .vl-mk-chat, .vl-mk-editor').forEach(el => {\n    mockupObserver.observe(el);\n  });\n\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  \/\/ MOCKUP PASO 3 \u2014 L\u00f3gica interactiva del editor\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n\n  \/\/ HTML reutilizable de los controles (instrucciones + Formato + Longitud)\n  function vlEditorControlsHtml(instructions) {\n    return `\n      <div class=\"vl-mk-editor-instructions\">${instructions}<\/div>\n      <div class=\"vl-mk-editor-controls\">\n        <div class=\"vl-mk-editor-ctrl-group\">\n          <label class=\"vl-mk-editor-ctrl-label\">Formato<\/label>\n          <div class=\"vl-mk-editor-btn-group\" data-vl-ctrl=\"formato\">\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn is-active\" data-vl-val=\"redactado\" title=\"Redactado\">\n              <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><rect x=\"4\" y=\"6\" width=\"16\" height=\"2.5\" rx=\"1\" fill=\"currentColor\"\/><rect x=\"4\" y=\"11\" width=\"14\" height=\"2.5\" rx=\"1\" fill=\"currentColor\"\/><rect x=\"4\" y=\"16\" width=\"10\" height=\"2.5\" rx=\"1\" fill=\"currentColor\"\/><\/svg>\n            <\/button>\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn\" data-vl-val=\"bullets\" title=\"Bullet points\">\n              <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><circle cx=\"5.5\" cy=\"7.2\" r=\"1.4\" fill=\"currentColor\"\/><rect x=\"9.5\" y=\"6\" width=\"11\" height=\"2.4\" rx=\"1\" fill=\"currentColor\"\/><circle cx=\"5.5\" cy=\"12.2\" r=\"1.4\" fill=\"currentColor\"\/><rect x=\"9.5\" y=\"11\" width=\"11\" height=\"2.4\" rx=\"1\" fill=\"currentColor\"\/><circle cx=\"5.5\" cy=\"17.2\" r=\"1.4\" fill=\"currentColor\"\/><rect x=\"9.5\" y=\"16\" width=\"11\" height=\"2.4\" rx=\"1\" fill=\"currentColor\"\/><\/svg>\n            <\/button>\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn\" data-vl-val=\"hashtag\" title=\"Hashtag\">\n              <span class=\"vl-mk-editor-hash\">#<\/span>\n            <\/button>\n          <\/div>\n        <\/div>\n        <div class=\"vl-mk-editor-ctrl-group\">\n          <label class=\"vl-mk-editor-ctrl-label\">Longitud<\/label>\n          <div class=\"vl-mk-editor-btn-group\" data-vl-ctrl=\"longitud\">\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn\" data-vl-val=\"larga\" title=\"Larga\">\n              <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><rect x=\"4\" y=\"5\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"9\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"13\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"17\" width=\"11\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><\/svg>\n            <\/button>\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn\" data-vl-val=\"media\" title=\"Media\">\n              <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><rect x=\"4\" y=\"8\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"12\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"16\" width=\"11\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><\/svg>\n            <\/button>\n            <button type=\"button\" class=\"vl-mk-editor-icon-btn is-active\" data-vl-val=\"corta\" title=\"Corta\">\n              <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\"><rect x=\"4\" y=\"11\" width=\"16\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><rect x=\"4\" y=\"15\" width=\"9\" height=\"1.8\" rx=\"0.9\" fill=\"currentColor\"\/><\/svg>\n            <\/button>\n          <\/div>\n        <\/div>\n      <\/div>\n    `;\n  }\n\n  \/\/ Abrir una secci\u00f3n \u2014 primero cierra la anterior, luego abre la nueva (secuencial)\n  function vlEditorOpenSection(section) {\n    const editor = section.closest('.vl-mk-editor');\n    if (!editor) return;\n\n    \/\/ Inyectamos contenido si todav\u00eda no lo tiene\n    const body = section.querySelector('.vl-mk-editor-section-body');\n    if (body && !body.dataset.vlPopulated) {\n      const instructions = section.dataset.instructions || '';\n      body.innerHTML = vlEditorControlsHtml(instructions);\n      body.dataset.vlPopulated = '1';\n    }\n\n    const openOnes = Array.from(editor.querySelectorAll('.vl-mk-editor-section--open'))\n      .filter(s => s !== section);\n\n    if (openOnes.length > 0) {\n      \/\/ 1) Cerrar la(s) que est\u00e9n abiertas\n      openOnes.forEach(s => s.classList.remove('vl-mk-editor-section--open'));\n      \/\/ 2) Esperar a que termine la transici\u00f3n de colapso, luego abrir la nueva\n      clearTimeout(editor._vlOpenTimer);\n      editor._vlOpenTimer = setTimeout(() => {\n        section.classList.add('vl-mk-editor-section--open');\n      }, 420);\n    } else {\n      \/\/ Nada estaba abierto \u2192 abrir directamente\n      section.classList.add('vl-mk-editor-section--open');\n    }\n  }\n\n  \/\/ Cerrar una secci\u00f3n\n  function vlEditorCloseSection(section) {\n    section.classList.remove('vl-mk-editor-section--open');\n  }\n\n  \/\/ Toggle del head: si la secci\u00f3n clicada est\u00e1 abierta la cerramos, si no la abrimos\n  document.addEventListener('click', (e) => {\n    \/\/ 1) Click en la cabecera de una secci\u00f3n \u2192 toggle accordion\n    const head = e.target.closest('[data-vl-toggle]');\n    if (head) {\n      const section = head.closest('[data-vl-section]');\n      if (section.classList.contains('vl-mk-editor-section--open')) {\n        vlEditorCloseSection(section);\n      } else {\n        vlEditorOpenSection(section);\n      }\n      return;\n    }\n\n    \/\/ 2) Click en un bot\u00f3n de Formato\/Longitud \u2192 cambiar selecci\u00f3n\n    const iconBtn = e.target.closest('.vl-mk-editor-icon-btn');\n    if (iconBtn) {\n      const group = iconBtn.parentElement;\n      group.querySelectorAll('.vl-mk-editor-icon-btn').forEach(b => b.classList.remove('is-active'));\n      iconBtn.classList.add('is-active');\n      return;\n    }\n\n    \/\/ 3) Click en \"Guardar plantilla\" \u2192 pulso + toast\n    const saveBtn = e.target.closest('[data-vl-save]');\n    if (saveBtn) {\n      const editor = saveBtn.closest('.vl-mk-editor');\n      const toast = editor.querySelector('.vl-mk-editor-toast');\n      if (toast) {\n        toast.classList.remove('is-hiding');\n        toast.classList.remove('is-showing');\n        void toast.offsetWidth;\n        toast.classList.add('is-showing');\n\n        clearTimeout(toast._hideTimer);\n        toast._hideTimer = setTimeout(() => {\n          toast.classList.remove('is-showing');\n          toast.classList.add('is-hiding');\n        }, 2200);\n      }\n      return;\n    }\n  });\n\n  \/\/ Filtrar click en el handle del drag para que no dispare el toggle de la secci\u00f3n\n  document.addEventListener('click', (e) => {\n    if (e.target.closest('.vl-mk-editor-drag')) {\n      e.stopPropagation();\n    }\n  }, true);\n\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  \/\/ MOCKUP PASO 1 \u2014 File picker interactivo\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  document.addEventListener('click', (e) => {\n    \/\/ Click en un archivo PDF \u2192 seleccionarlo\n    const file = e.target.closest('.vl-mk-fp-file');\n    if (file) {\n      const picker = file.closest('.vl-mk-filepicker');\n      if (picker) {\n        picker.querySelectorAll('.vl-mk-fp-file').forEach(f => f.classList.remove('is-selected'));\n        file.classList.add('is-selected');\n        const btn = picker.querySelector('.vl-mk-fp-btn');\n        if (btn) btn.classList.add('is-enabled');\n      }\n      return;\n    }\n\n    \/\/ Click en \"Subir informe\" \u2192 toast desde arriba\n    const upBtn = e.target.closest('[data-vl-upload]');\n    if (upBtn && upBtn.classList.contains('is-enabled')) {\n      const picker = upBtn.closest('.vl-mk-filepicker');\n      const toast = picker?.querySelector('.vl-mk-fp-toast');\n      if (toast) {\n        toast.classList.remove('is-hiding');\n        toast.classList.remove('is-showing');\n        void toast.offsetWidth;\n        toast.classList.add('is-showing');\n        clearTimeout(toast._hideTimer);\n        toast._hideTimer = setTimeout(() => {\n          toast.classList.remove('is-showing');\n          toast.classList.add('is-hiding');\n        }, 2200);\n      }\n      return;\n    }\n\n    \/\/ \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 MOCKUP PASO 2 \u2014 Chat interactivo \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\n    \/\/ Click en \"Ajustar\" \u2192 modo edici\u00f3n (aparecen las X en cada secci\u00f3n)\n    const adjustBtn = e.target.closest('[data-vl-chat-adjust]');\n    if (adjustBtn) {\n      const chat = adjustBtn.closest('.vl-mk-chat');\n      if (chat) chat.classList.add('is-editing');\n      return;\n    }\n\n    \/\/ Click en una \u2715 \u2192 eliminar esa secci\u00f3n con animaci\u00f3n\n    const delBtn = e.target.closest('[data-vl-delete-section]');\n    if (delBtn) {\n      const li = delBtn.closest('li');\n      if (li) {\n        \/\/ Fijamos su altura actual para que la animaci\u00f3n de max-height funcione\n        li.style.maxHeight = li.offsetHeight + 'px';\n        void li.offsetWidth;\n        li.classList.add('is-removing');\n        setTimeout(() => li.remove(), 340);\n      }\n      return;\n    }\n\n    \/\/ Click en \"S\u00ed, generar\" \u2192 a\u00f1adir burbuja \"Generando...\" con shimmer permanente\n    const confirmBtn = e.target.closest('[data-vl-chat-confirm]');\n    if (confirmBtn) {\n      const chat = confirmBtn.closest('.vl-mk-chat');\n      if (!chat || chat.dataset.vlGenerating === '1') return;\n      chat.dataset.vlGenerating = '1';\n      chat.classList.remove('is-editing');\n\n      \/\/ Deshabilitamos los botones para que no se pueda volver a pulsar\n      chat.querySelectorAll('.vl-mk-chat-btn').forEach(b => {\n        b.disabled = true;\n        b.style.opacity = '0.5';\n        b.style.cursor = 'default';\n        b.style.pointerEvents = 'none';\n      });\n\n      \/\/ Creamos la nueva burbuja con shimmer \"Generando\u2026\"\n      const row = document.createElement('div');\n      row.className = 'vl-mk-chat-row vl-mk-chat-row--ai';\n      row.style.opacity = '0';\n      row.innerHTML = `\n        <div class=\"vl-mk-chat-avatar\">\n          <svg width=\"20\" height=\"12\" viewBox=\"0 0 90.23 54.17\" fill=\"#FFFFFF\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M72.18,36.11v-18h-18v18c-8.6,0-12.93-5.21-19.84-14.43C27.06,12,18.05,0,0,0V18.07c8.6,0,12.93,5.22,19.84,14.43,7.24,9.65,16.25,21.67,34.3,21.67V36.11ZM90.23,0h-18v18h18Z\"\/><\/svg>\n        <\/div>\n        <div class=\"vl-mk-chat-bubble vl-mk-chat-bubble--ai\">\n          <span class=\"vl-mk-shimmer\">Analizando KPIs del equipo\u2026<\/span>\n        <\/div>\n      `;\n      chat.appendChild(row);\n      \/\/ Forzar reflow y animar entrada\n      void row.offsetWidth;\n      row.style.transition = 'opacity 0.4s ease, transform 0.4s ease';\n      row.style.opacity = '1';\n\n      \/\/ Tras un peque\u00f1o delay, sustituir \"Generando...\" por el check de finalizado\n      setTimeout(() => {\n        const bubble = row.querySelector('.vl-mk-chat-bubble');\n        if (!bubble) return;\n        bubble.style.transition = 'opacity 0.3s ease';\n        bubble.style.opacity = '0';\n        setTimeout(() => {\n          bubble.innerHTML = '<span class=\"vl-mk-chat-done\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M5 12l5 5L20 7\" stroke=\"#161616\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>Dashboard del equipo listo<\/span>';\n          bubble.style.opacity = '1';\n        }, 320);\n      }, 2400);\n      return;\n    }\n  });\n\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  \/\/ DRAG & DROP para reordenar secciones del editor\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  let vlDrag = null;\n\n  document.addEventListener('pointerdown', (e) => {\n    const handle = e.target.closest('.vl-mk-editor-drag');\n    if (!handle) return;\n    const editor = handle.closest('.vl-mk-editor');\n    if (!editor) return;\n\n    e.preventDefault();\n    handle.setPointerCapture?.(e.pointerId);\n\n    const section = handle.closest('[data-vl-section]');\n    vlDrag = {\n      section,\n      editor,\n      container: section.parentElement,\n      handle,\n      pointerLastY: e.clientY,\n      currentTranslateY: 0,\n      pointerId: e.pointerId,\n    };\n\n    section.classList.add('vl-mk-editor-section--dragging');\n    editor.classList.add('vl-mk-editor--is-dragging');\n    document.body.style.cursor = 'grabbing';\n    document.body.style.userSelect = 'none';\n  });\n\n  document.addEventListener('pointermove', (e) => {\n    if (!vlDrag || e.pointerId !== vlDrag.pointerId) return;\n\n    \/\/ 1) Actualizamos el translate bas\u00e1ndonos en cu\u00e1nto se ha movido el puntero\n    const deltaY = e.clientY - vlDrag.pointerLastY;\n    vlDrag.currentTranslateY += deltaY;\n    vlDrag.pointerLastY = e.clientY;\n    vlDrag.section.style.transform = `translateY(${vlDrag.currentTranslateY}px)`;\n\n    \/\/ 2) Buscamos d\u00f3nde deber\u00eda insertarse seg\u00fan la posici\u00f3n del cursor\n    const cursorY = e.clientY;\n    const siblings = Array.from(vlDrag.container.querySelectorAll('[data-vl-section]'))\n      .filter(s => s !== vlDrag.section);\n\n    let insertBefore = null;\n    for (const sib of siblings) {\n      const rect = sib.getBoundingClientRect();\n      const midY = rect.top + rect.height \/ 2;\n      if (cursorY < midY) {\n        insertBefore = sib;\n        break;\n      }\n    }\n\n    const shouldReorder = insertBefore !== null\n      ? vlDrag.section.nextElementSibling !== insertBefore\n      : vlDrag.section !== vlDrag.container.lastElementChild;\n\n    if (shouldReorder) {\n      \/\/ Antes de reordenar guardamos d\u00f3nde est\u00e1 visualmente la secci\u00f3n\n      const rectBefore = vlDrag.section.getBoundingClientRect();\n\n      \/\/ Quitamos el transform para medir su posici\u00f3n natural\n      vlDrag.section.style.transform = '';\n\n      if (insertBefore) {\n        vlDrag.container.insertBefore(vlDrag.section, insertBefore);\n      } else {\n        vlDrag.container.appendChild(vlDrag.section);\n      }\n\n      \/\/ Medimos su nueva posici\u00f3n natural tras el reorder\n      const rectAfter = vlDrag.section.getBoundingClientRect();\n\n      \/\/ Aplicamos un offset para que visualmente quede donde estaba antes\n      vlDrag.currentTranslateY = rectBefore.top - rectAfter.top;\n      vlDrag.section.style.transform = `translateY(${vlDrag.currentTranslateY}px)`;\n    }\n  });\n\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  \/\/ TESTIMONIOS \u2014 Sticky stack scroll\n  \/\/ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n  (function () {\n    const section = document.querySelector('.vl-tstack-section');\n    if (!section) return;\n    const track = section.querySelector('.vl-tstack-track');\n    const cards = section.querySelectorAll('.vl-tstack-card');\n    if (!track || cards.length === 0) return;\n\n    function updateStack() {\n      const rect = track.getBoundingClientRect();\n      const trackHeight = track.offsetHeight - window.innerHeight;\n      if (trackHeight <= 0) return;\n      let progress = -rect.top \/ trackHeight;\n      progress = Math.max(0, Math.min(1, progress));\n\n      \/\/ El track se divide en N segmentos (uno por card)\n      \/\/ Card N aparece cuando progress >= N\/totalCards\n      \/\/ Card N va a \"estar detr\u00e1s\" cuando hay cards superiores visibles\n      const N = cards.length;\n      \/\/ \u00daltima card visible seg\u00fan progreso\n      \/\/ progress 0    \u2192 1 card visible (H\u00e9ctor)\n      \/\/ progress 0.25 \u2192 2 (H\u00e9ctor + Cristina)\n      \/\/ progress 0.50 \u2192 3 (+ Roberto)\n      \/\/ progress 0.75 \u2192 4 (+ Javier)\n      const topIdx = Math.min(N - 1, Math.floor(progress * N));\n\n      cards.forEach((card, idx) => {\n        card.classList.remove('is-behind-1', 'is-behind-2', 'is-behind-3');\n        if (idx <= topIdx) {\n          card.classList.add('is-visible');\n          \/\/ Si esta card NO es la \u00faltima visible, est\u00e1 detr\u00e1s\n          const depth = topIdx - idx;\n          if (depth === 1) card.classList.add('is-behind-1');\n          else if (depth === 2) card.classList.add('is-behind-2');\n          else if (depth >= 3) card.classList.add('is-behind-3');\n        } else {\n          card.classList.remove('is-visible');\n        }\n      });\n    }\n\n    \/\/ RAF throttle para suavidad\n    let ticking = false;\n    function onScroll() {\n      if (!ticking) {\n        requestAnimationFrame(() => { updateStack(); ticking = false; });\n        ticking = true;\n      }\n    }\n    window.addEventListener('scroll', onScroll, { passive: true });\n    window.addEventListener('resize', onScroll);\n    \/\/ Estado inicial: la primera card visible al menos\n    updateStack();\n    \/\/ Aseguramos que la primera siempre est\u00e1 visible (estado base)\n    cards[0].classList.add('is-visible');\n  })();\n\n  const vlDragEnd = (e) => {\n    if (!vlDrag) return;\n    if (e && e.pointerId !== vlDrag.pointerId) return;\n\n    const section = vlDrag.section;\n    const editor = vlDrag.editor;\n\n    section.classList.remove('vl-mk-editor-section--dragging');\n    editor.classList.remove('vl-mk-editor--is-dragging');\n\n    \/\/ Snap suave a su posici\u00f3n natural\n    section.style.transition = 'transform 0.22s cubic-bezier(0.34, 1.5, 0.64, 1)';\n    section.style.transform = '';\n    setTimeout(() => {\n      section.style.transition = '';\n    }, 240);\n\n    document.body.style.cursor = '';\n    document.body.style.userSelect = '';\n    vlDrag = null;\n  };\n  document.addEventListener('pointerup', vlDragEnd);\n  document.addEventListener('pointercancel', vlDragEnd);\n\n  \/\/ Smooth scroll para anclas internas\n  document.querySelectorAll('.vl-landing a[href^=\"#\"]').forEach(anchor => {\n    anchor.addEventListener('click', function(e) {\n      e.preventDefault();\n      const target = document.querySelector(this.getAttribute('href'));\n      if (target) {\n        target.scrollIntoView({ behavior: 'smooth', block: 'start' });\n      }\n    });\n  });\n})();\n<\/script>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     JS de los mockups \"Control de equipo\" (.vl-tm-*)\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<script>\n(function () {\n  'use strict';\n\n  \/\/ 1) Reveal: a\u00f1ade .is-visible al entrar en viewport (dispara animaciones internas)\n  var mocks = document.querySelectorAll('.vl-tm[data-tm-mock]');\n  if (!mocks.length) return;\n\n  var obs = new IntersectionObserver(function (entries) {\n    entries.forEach(function (entry) {\n      if (entry.isIntersecting) {\n        entry.target.classList.add('is-visible');\n        initMock(entry.target);\n        obs.unobserve(entry.target);\n      }\n    });\n  }, { threshold: 0.4, rootMargin: '0px 0px -10% 0px' });\n\n  mocks.forEach(function (m) { obs.observe(m); });\n\n  \/\/ 2) Inicializa la interactividad propia de cada mockup\n  function initMock(root) {\n    \/\/ \u2500\u2500 Toggle de series en la gr\u00e1fica (Paso 1) \u2500\u2500\n    var chips = root.querySelectorAll('[data-tm-series]');\n    var graph = root.querySelector('[data-tm-graph]');\n    chips.forEach(function (chip) {\n      chip.addEventListener('click', function () {\n        var series = chip.getAttribute('data-tm-series');\n        chip.classList.toggle('is-off');\n        if (graph) graph.classList.toggle('hide-' + series, chip.classList.contains('is-off'));\n      });\n    });\n\n    \/\/ \u2500\u2500 Exportar m\u00e9tricas \u2192 toast \"Excel descargado\" (Hero) \u2500\u2500\n    var exportBtn = root.querySelector('[data-tm-export]');\n    var toast = root.querySelector('[data-tm-toast]');\n    if (exportBtn && toast) {\n      exportBtn.addEventListener('click', function () {\n        toast.classList.remove('is-hiding');\n        toast.classList.add('is-showing');\n        clearTimeout(toast._t);\n        toast._t = setTimeout(function () {\n          toast.classList.remove('is-showing');\n          toast.classList.add('is-hiding');\n        }, 2400);\n      });\n    }\n\n    \/\/ \u2500\u2500 Play inline en filas de reuni\u00f3n (Paso 2): la fila \"suena\" al pulsar \u2500\u2500\n    var rowPlays = root.querySelectorAll('[data-tm-rowplay]');\n    rowPlays.forEach(function (p) {\n      p.addEventListener('click', function (e) {\n        e.stopPropagation();\n        var row = p.closest('.vl-tm-meeting');\n        if (!row) return;\n        var wasPlaying = row.classList.contains('is-playing');\n        \/\/ parar cualquier otra fila que estuviera sonando\n        root.querySelectorAll('.vl-tm-meeting.is-playing').forEach(function (r) { r.classList.remove('is-playing'); });\n        if (!wasPlaying) {\n          row.classList.add('is-playing');\n          \/\/ reiniciar la animaci\u00f3n de la barra de progreso desde 0\n          var prog = row.querySelector('.vl-tm-progress');\n          if (prog) { prog.style.animation = 'none'; void prog.offsetWidth; prog.style.animation = ''; }\n        }\n      });\n    });\n\n    \/\/ \u2500\u2500 Play de audio minimalista (Paso 3): label \u2192 l\u00ednea de tiempo con puntito \u2500\u2500\n    var playBtn = root.querySelector('[data-tm-play]');\n    if (playBtn) {\n      playBtn.addEventListener('click', function () {\n        var on = playBtn.classList.toggle('is-playing');\n        if (on) {\n          ['.vl-tm-mini-fill', '.vl-tm-mini-dot'].forEach(function (sel) {\n            var el = playBtn.querySelector(sel);\n            if (el) { el.style.animation = 'none'; void el.offsetWidth; el.style.animation = ''; }\n          });\n        }\n      });\n    }\n\n    \/\/ \u2500\u2500 Chat que se \"escribe solo\" + respuesta IA (Paso 3) \u2500\u2500\n    var chat = root.querySelector('[data-tm-chat]');\n    var answer = root.querySelector('[data-tm-answer]');\n    if (chat) {\n      var full = '\u00bfQu\u00e9 valoraci\u00f3n le dio David a la candidata?';\n      \/\/ Esperamos a que terminen las animaciones de entrada del informe\n      setTimeout(function () { typeChat(chat, full, 0, answer); }, 2600);\n    }\n  }\n\n  function typeChat(el, text, i, answer) {\n    el.style.color = '#161616';\n    if (i <= text.length) {\n      el.innerHTML = text.slice(0, i) + '<span class=\"vl-tm-caret\">&nbsp;<\/span>';\n      setTimeout(function () { typeChat(el, text, i + 1, answer); }, 42);\n    } else {\n      el.textContent = text;\n      \/\/ Mostrar la respuesta IA tras una breve pausa\n      if (answer) setTimeout(function () { answer.classList.add('is-open'); }, 650);\n    }\n  }\n})();\n<\/script>\n\n","protected":false},"excerpt":{"rendered":"<p>Dashboard para responsables de equipo: m\u00e9tricas por compa\u00f1ero, acceso a reuniones, informes y audios. Controla la calidad y la eficiencia sin asistir a cada reuni\u00f3n.<\/p>","protected":false},"author":1,"featured_media":7980,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-gradient":""}},"footnotes":"","rank_math_title":"Voicit para el control de tu equipo | Dashboard y m\u00e9tricas","rank_math_description":"Controla la calidad y la eficiencia de tu equipo con un dashboard: m\u00e9tricas por compa\u00f1ero, acceso a reuniones, informes y audios. Sin asistir a cada reuni\u00f3n.","rank_math_focus_keyword":"control de equipo"},"class_list":["post-8393","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/pages\/8393","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/comments?post=8393"}],"version-history":[{"count":28,"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/pages\/8393\/revisions"}],"predecessor-version":[{"id":8475,"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/pages\/8393\/revisions\/8475"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/media\/7980"}],"wp:attachment":[{"href":"https:\/\/voicit.com\/it\/wp-json\/wp\/v2\/media?parent=8393"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}