MOCHILA \u2014 Servicio de Consultor\u00eda (v5.0 - Edici\u00f3n Profesional)<\/title>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Nunito:wght@300;400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.2\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\"\/>\r\n <style>\r\n \/* VARIABLES *\/\r\n :root{\r\n --primary:#1344a1;\r\n --variant:#4b77c4;\r\n --muted:#c4d6e9;\r\n --dark:#201d4c;\r\n --cream:#f6f8ff;\r\n --accent:#d65c4a;\r\n --shadow-light: 0 8px 24px rgba(32,29,76,.05);\r\n --shadow-mid: 0 16px 42px rgba(19,68,161,.08);\r\n --maxw:1200px;\r\n --radius-lg: 18px;\r\n }\r\n *{box-sizing:border-box}\r\n html,body{height:100%}\r\n \/* AJUSTE PARA BAJAR EL MEN\u00da Y CONTENIDO *\/\r\n body{font-family:\"Nunito\",sans-serif;margin:0;padding-top:90px;color:var(--dark);background:linear-gradient(180deg,#fff 0,#f6f8ff 40%)}\r\n \r\n header{position:fixed;top:0;left:0;right:0;z-index:1300;background:#fff;border-bottom:1px solid rgba(22,57,135,.06);\r\n \/* Hago el header m\u00e1s alto *\/\r\n padding: 1rem 0;\r\n }\r\n .nav-inner{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 1rem}\r\n .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--primary)}\r\n .logo-svg{width:46px;height:46px}\r\n nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.4rem}\r\n nav a{color:var(--primary);text-decoration:none;padding:.45rem .7rem;border-radius:8px;font-weight:700}\r\n nav a:hover{background:rgba(19,68,161,.06)}\r\n\r\n #hero{padding:3.6rem 1rem 2.8rem;position:relative}\r\n .hero-inner{max-width:var(--maxw);margin:0 auto;display:flex;gap:2rem;align-items:center;justify-content:space-between;flex-wrap:wrap}\r\n .hero-card{background:linear-gradient(135deg,#e9f0ff,#fff);border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-mid);display:flex;gap:2rem;align-items:center}\r\n .h-title{font-weight:800;font-size:1.6rem;color:var(--primary);margin:0}\r\n .h-sub{margin:0;color:#455070}\r\n .btn-main{background:linear-gradient(135deg,var(--primary),var(--variant));color:#fff;padding:.7rem 1.2rem;border-radius:999px;border:none;font-weight:800;box-shadow:0 12px 30px rgba(19,68,161,.2);transition:all .2s}\r\n .btn-main:hover{box-shadow:0 10px 24px rgba(19,68,161,.3)}\r\n .btn-ghost{background:transparent;border:2px solid var(--primary);color:var(--primary);padding:.6rem 1.1rem;border-radius:12px;font-weight:700;transition:all .2s}\r\n .btn-ghost:hover{background:rgba(19,68,161,.06)}\r\n \r\n section{padding:3.5rem 1rem}\r\n .container-max{max-width:var(--maxw);margin:0 auto}\r\n h2{font-weight:800;color:var(--primary)}\r\n p.lead{color:#495670}\r\n \r\n .icon-box{display:flex;align-items:flex-start;gap:1.2rem;margin-bottom:1.5rem;background:#fff;border-radius:var(--radius-lg);padding:1.4rem;box-shadow:var(--shadow-light)}\r\n .icon-box i{font-size:1.8rem;color:var(--primary);flex-shrink:0}\r\n .icon-box h5{font-weight:800;margin:0 0 .3rem 0}\r\n .icon-box p{margin:0;color:#4a516b;font-size:.95rem}\r\n \r\n \/* FLOW *\/\r\n .flow-container {padding: 2rem 0;position: relative;}\r\n .flow {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 2rem;\r\n position: relative;\r\n z-index: 10;\r\n }\r\n .step {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.5rem;\r\n box-shadow: var(--shadow-light);\r\n text-align: center;\r\n position: relative;\r\n transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n border: 1px solid var(--muted);\r\n }\r\n .step .num{width:48px;height:48px;background:var(--variant);color:white;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:.8rem;font-size:1rem}\r\n .step i{font-size:1.8rem;color:var(--primary);margin-bottom:.4rem}\r\n \r\n \/* TARJETAS DE ASESOR\u00cdA (4 Columnas) *\/\r\n .advisory-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); \r\n gap: 1.2rem;\r\n }\r\n .advisory-card {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.2rem;\r\n box-shadow: var(--shadow-light);\r\n transition: all 0.3s ease;\r\n border: 1px solid #eef2f8;\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n }\r\n .advisory-card i {font-size: 1.8rem;color: var(--primary);margin-bottom: 0.6rem;}\r\n .advisory-card h6 {font-size: 1.1rem;font-weight: 800;color: var(--primary);margin-bottom: 0.4rem;}\r\n .advisory-card p {font-size: 0.9rem;}\r\n .advisory-card.featured {\r\n background: linear-gradient(145deg, var(--primary), var(--variant));\r\n color: white;\r\n border: 2px solid var(--primary);\r\n box-shadow: 0 15px 40px rgba(19,68,161,.35);\r\n cursor: default;\r\n }\r\n .advisory-card.featured i {color: white;}\r\n .advisory-card.featured h6 {color: white;}\r\n .advisory-card.featured p {color: #f0f4ff;}\r\n \r\n \/* Testimonios Din\u00e1micos (AJUSTE) *\/\r\n .testimonial-card {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.5rem;\r\n box-shadow: var(--shadow-light);\r\n border-left: 5px solid var(--accent); \/* L\u00ednea de color para dinamismo *\/\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n transition: transform 0.2s;\r\n }\r\n .testimonial-card:hover {\r\n transform: translateY(-5px);\r\n box-shadow: 0 10px 30px rgba(214, 92, 74, .1);\r\n }\r\n .testimonial-card blockquote {\r\n font-style: italic;\r\n margin: 0 0 1rem 0;\r\n line-height: 1.6;\r\n color: var(--dark);\r\n font-size: 1.05rem;\r\n }\r\n .testimonial-card footer {\r\n font-weight: 800;\r\n color: var(--accent);\r\n font-size: 0.95rem;\r\n }\r\n .testimonial-card footer small {\r\n display: block;\r\n color: #6c757d;\r\n font-weight: 400;\r\n }\r\n\r\n \/* TARJETAS DE RECURSOS Y SOLICITUD *\/\r\n .resource-card{background:#fff;border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-light)}\r\n \r\n \/* BANCO DE CONSULTORES *\/\r\n .consultor-perfil {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.8rem;\r\n padding: 0.6rem 0;\r\n border-bottom: 1px solid #f0f4ff;\r\n }\r\n .consultor-perfil:last-child {border-bottom: none;}\r\n .consultor-icon {width: 46px;height: 46px;border-radius: 10px;background: #f0f4ff;display: flex;align-items: center;justify-content: center;color: var(--primary);flex-shrink: 0;}\r\n\r\n \/* CHATBOT FLOTANTE *\/\r\n #floatingChatButton {\r\n position: fixed;\r\n bottom: 20px;\r\n right: 20px;\r\n z-index: 1000;\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n background: var(--accent);\r\n color: white;\r\n border: none;\r\n box-shadow: 0 8px 16px rgba(214, 92, 74, .4);\r\n font-size: 1.8rem;\r\n transition: transform 0.3s;\r\n }\r\n #floatingChatButton:hover {\r\n transform: scale(1.05);\r\n }\r\n #floatingChatContainer {\r\n position: fixed;\r\n bottom: 90px;\r\n right: 20px;\r\n z-index: 1000;\r\n width: 320px;\r\n height: 400px;\r\n background: white;\r\n border-radius: var(--radius-lg);\r\n box-shadow: var(--shadow-mid);\r\n display: none;\r\n flex-direction: column;\r\n overflow: hidden;\r\n border: 1px solid var(--primary);\r\n }\r\n .chat-header{background:linear-gradient(135deg,var(--primary),var(--variant));color:white;padding:.6rem .8rem;display:flex;align-items:center;justify-content:space-between}\r\n .chat-messages{flex:1;padding:.7rem;overflow-y:auto;background:linear-gradient(180deg,#fbfdff,#fff); scroll-behavior: smooth;}\r\n .chat-input{padding:.5rem;border-top:1px solid #eee;display:flex;gap:.5rem; background: #fff;}\r\n .msg{\r\n padding:.6rem;\r\n border-radius:10px;\r\n margin:.4rem 0;\r\n max-width:85%;\r\n line-height: 1.3;\r\n }\r\n .msg.bot{\r\n background:#f1f6ff;\r\n display:inline-block;\r\n align-self: flex-start;\r\n border-bottom-left-radius: 2px;\r\n }\r\n .msg.user{\r\n background:var(--variant);\r\n color:white;\r\n display:inline-block;\r\n align-self:flex-end;\r\n border-bottom-right-radius: 2px;\r\n }\r\n .msg .msg-from{font-weight:700; opacity: 0.9;}\r\n\r\n \/* Media Queries *\/\r\n @media (max-width: 900px){\r\n .flow {\r\n grid-template-columns: 1fr;\r\n gap: 1.5rem;\r\n }\r\n .step:not(:last-child)::after {\r\n right: 50%;\r\n transform: translateX(50%) rotate(90deg);\r\n width: 1.5rem;\r\n top: unset;\r\n bottom: -1.5rem;\r\n height: 1.5rem;\r\n }\r\n .flow-container {padding: 1rem 0;}\r\n }\r\n @media (max-width: 768px){\r\n .hero-card{flex-direction:column; align-items:flex-start;}\r\n .advisory-grid {grid-template-columns: 1fr;}\r\n #floatingChatContainer {width: 90%; right: 5%; left: 5%;}\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <header>\r\n <div class=\"nav-inner\">\r\n <a href=\"#hero\" class=\"brand\" aria-label=\"MOCHILA inicio\">\r\n <svg class=\"logo-svg\" viewBox=\"0 0 64 64\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <rect width=\"64\" height=\"64\" rx=\"10\" fill=\"#1344a1\"\/>\r\n <g transform=\"translate(9,9)\" fill=\"#fff\">\r\n <path d=\"M6 2h28v4H6zM6 10h28v24H6z\" opacity=\"0.95\"><\/path>\r\n <\/g>\r\n <\/svg>\r\n <div style=\"line-height:1\">\r\n <div style=\"font-weight:800\">MOCHILA<\/div>\r\n <small style=\"opacity:.9;font-weight:600\">Servicio de Consultor\u00eda \u2014 v5.0<\/small>\r\n <\/div>\r\n <\/a>\r\n <nav aria-label=\"Men\u00fa principal\">\r\n <ul id=\"mainNav\">\r\n <li><a href=\"#hero\"><i class=\"fas fa-home me-2\"><\/i>Inicio<\/a><\/li>\r\n <li><a href=\"#descripcion\"><i class=\"fas fa-info-circle me-2\"><\/i>Descripci\u00f3n<\/a><\/li>\r\n <li><a href=\"#solicitud\"><i class=\"fas fa-clipboard-list me-2\"><\/i>Solicitud & Diagn\u00f3stico<\/a><\/li>\r\n <li><a href=\"#asesoria\"><i class=\"fas fa-handshake me-2\"><\/i>Asesor\u00eda<\/a><\/li>\r\n <li><a href=\"#recursos\"><i class=\"fas fa-download me-2\"><\/i>Recursos<\/a><\/li>\r\n <li><a href=\"#soporte\"><i class=\"fas fa-headset me-2\"><\/i>Soporte<\/a><\/li>\r\n <li><a href=\"#testimonios\"><i class=\"fas fa-award me-2\"><\/i>Testimonios<\/a><\/li>\r\n <\/ul>\r\n <\/nav>\r\n <\/div>\r\n <\/header>\r\n\r\n <section id=\"hero\">\r\n <div class=\"hero-inner container-max\">\r\n <div class=\"hero-card\">\r\n <div style=\"flex:1\">\r\n <h1 class=\"h-title\">Servicio de consultor\u00eda \u2013 Proyecto MOCHILA \u2013 Instalaci\u00f3n de unidades para dise\u00f1o y emisi\u00f3n de microcredenciales en IES de LAC<\/h1>\r\n <div style=\"display:flex;gap:.8rem;margin-top:.8rem;flex-wrap:wrap\">\r\n <\/div>\r\n <\/div>\r\n <div style=\"width:220px;text-align:center\">\r\n <svg viewBox=\"0 0 200 160\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" aria-hidden=\"true\" style=\"width:100%\">\r\n <rect x=\"8\" y=\"20\" width=\"140\" height=\"92\" rx=\"10\" fill=\"#f3f8ff\" stroke=\"#dfe9f8\"\/>\r\n <circle cx=\"160\" cy=\"36\" r=\"22\" fill=\"#fff\" stroke=\"#f0f6ff\"\/>\r\n <rect x=\"22\" y=\"40\" width=\"112\" height=\"12\" rx=\"6\" fill=\"#fff\"\/>\r\n <rect x=\"22\" y=\"62\" width=\"80\" height=\"10\" rx=\"6\" fill=\"#fff\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"descripcion\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Descripci\u00f3n del proceso<\/h2>\r\n <p class=\"lead aos-init\" data-aos>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sun.<\/p>\r\n \r\n <div class=\"icon-box aos-init\" data-aos>\r\n <i class=\"fas fa-bullseye\"><\/i>\r\n <div>\r\n <h5>Objetivos y beneficios clave<\/h5>\r\n <p>Asesor\u00eda experta, promoci\u00f3n de la adopci\u00f3n de microcredenciales, creaci\u00f3n de comunidades de pr\u00e1ctica y posicionamiento como referente regional.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"icon-box aos-init\" data-aos>\r\n <i class=\"fas fa-layer-group\"><\/i>\r\n <div>\r\n <h5>Fases del servicio<\/h5>\r\n <p>Proceso secuencial de: diagn\u00f3stico inicial, asesor\u00eda especializada y plan de implementaci\u00f3n\/seguimiento.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"flow-container mt-4 aos-init\" data-aos>\r\n <h3 style=\"font-weight:700; color:var(--primary); margin-bottom:1.5rem; text-align:center;\">Flujo de acompa\u00f1amiento MOCHILA<\/h3>\r\n <div class=\"flow\">\r\n <div class=\"step\">\r\n <div class=\"num\">1<\/div>\r\n <i class=\"fas fa-clipboard-list\"><\/i>\r\n <div style=\"font-weight:800\">Diagn\u00f3stico inicial<\/div>\r\n <div class=\"small text-muted\">Solicitud y cuestionario de madurez<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">2<\/div>\r\n <i class=\"fas fa-user-tie\"><\/i>\r\n <div style=\"font-weight:800\">Asesor\u00eda especializada<\/div>\r\n <div class=\"small text-muted\">Sesiones de consultor\u00eda y gu\u00eda r\u00e1pida<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">3<\/div>\r\n <i class=\"fas fa-rocket\"><\/i>\r\n <div style=\"font-weight:800\">Implementaci\u00f3n<\/div>\r\n <div class=\"small text-muted\">Plan personalizado y emisi\u00f3n piloto<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">4<\/div>\r\n <i class=\"fas fa-handshake\"><\/i>\r\n <div style=\"font-weight:800\">Seguimiento y Cierre<\/div>\r\n <div class=\"small text-muted\">Recursos y soporte continuo<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"solicitud\" style=\"background:linear-gradient(180deg,#fff,#f7fbff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Solicitud & diagn\u00f3stico<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>El proceso comienza con la solicitud formal seguida de un autodiagn\u00f3stico que mide la madurez de su instituci\u00f3n en dimensiones clave (pedag\u00f3gica, t\u00e9cnica y administrativa).<\/p>\r\n\r\n <div class=\"row g-4 mt-3 justify-content-center\">\r\n \r\n <div class=\"col-lg-10 aos-init\" data-aos>\r\n <div class=\"row g-4\">\r\n \r\n <div class=\"col-md-6\">\r\n <div class=\"resource-card h-100\">\r\n <h6 style=\"font-weight:800\"><i class=\"fas fa-envelope-open-text me-2\"><\/i> Paso 1: Formulario de Solicitud<\/h6>\r\n <p class=\"small text-muted\">Registre los datos de su instituci\u00f3n para iniciar el proceso y habilitar el Kit de Implementaci\u00f3n.<\/p>\r\n <form id=\"solForm\">\r\n <div class=\"mb-2\"><label class=\"form-label small\">Instituci\u00f3n<\/label><input id=\"fInst\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-2\"><label class=\"form-label small\">Pa\u00eds<\/label><input id=\"fPais\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-2\"><label class=\"form-label small\">Contacto (email)<\/label><input id=\"fEmail\" type=\"email\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-3\"><label class=\"form-label small\">Breve descripci\u00f3n del inter\u00e9s<\/label><textarea id=\"fDesc\" class=\"form-control form-control-sm\" rows=\"2\"><\/textarea><\/div>\r\n <div class=\"d-grid gap-2\"><button class=\"btn-main btn-sm\" type=\"submit\"><i class=\"fas fa-paper-plane\"><\/i> Enviar solicitud<\/button><\/div>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6\">\r\n <div class=\"resource-card h-100\" style=\"background:#f0f4ff; border: 1px solid var(--primary);\">\r\n <h6 style=\"font-weight:800; color:var(--primary);\"><i class=\"fas fa-chart-pie me-2\"><\/i> Paso 2: Autodiagn\u00f3stico de Madurez<\/h6>\r\n <div class=\"row g-3\">\r\n\t<form id=\"solForm\">\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">\u00bfCu\u00e1l es el principal objetivo que busca su instituci\u00f3n al implementar microcredenciales digitales?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>Experimentaci\u00f3n.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Mejora de la oferta formativa.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Apertura de nuevos mercados.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Liderazgo e innovaci\u00f3n educativa.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">Sobre la emisi\u00f3n y tecnolog\u00eda, \u00bfcu\u00e1l es su situaci\u00f3n?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>En exploraci\u00f3n.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Iniciativas aisladas.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Procesos estandarizados.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Sistema integrado con datos.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">\u00bfC\u00f3mo es la gesti\u00f3n y reconocimiento institucional?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>Sin marco definido.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Comit\u00e9 exploratorio.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Pol\u00edtica establecida.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Alianzas con sector externo.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t<\/form>\r\n<\/div>\r\n <div style=\"margin-top:1.5rem;display:flex;gap:.8rem;flex-wrap:wrap\">\r\n <button id=\"btnReport\" class=\"btn-main btn-sm\">Generar reporte demo<\/button>\r\n <button id=\"btnClear\" class=\"btn-ghost btn-sm\">Limpiar<\/button>\r\n <\/div>\r\n <div id=\"miniReport\" style=\"display:none;margin-top:1rem;background:#f8fbff;padding:1rem;border-radius:12px;border:1px solid #e1e9f5;\">\r\n <strong>Reporte Preliminar (demo)<\/strong>\r\n <pre id=\"miniText\" style=\"white-space:pre-wrap;font-size:.95rem;margin:6px 0 0 0;font-family:monospace;line-height:1.4\"><\/pre>\r\n <button id=\"btnDownloadReport\" class=\"btn-ghost btn-sm mt-2\">Descargar reporte<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"asesoria\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Asesor\u00eda espec\u00edfica<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Ofrecemos consultor\u00eda enfocada en tres \u00e1reas clave (pedag\u00f3gica, t\u00e9cnica y administrativa), culminando en un plan de implementaci\u00f3n personalizado.<\/p>\r\n \r\n <div class=\"advisory-grid mt-4 aos-init\" data-aos>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('pedagogica')\">\r\n <i class=\"fas fa-graduation-cap\"><\/i>\r\n <h6>1. Pedag\u00f3gica<\/h6>\r\n <p class=\"small text-muted\">Definici\u00f3n de rutas de aprendizaje, dise\u00f1o instruccional, r\u00fabricas y procesos formativos acreditables.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('tecnica')\">\r\n <i class=\"fas fa-microchip\"><\/i>\r\n <h6>2. T\u00e9cnica<\/h6>\r\n <p class=\"small text-muted\">Integraci\u00f3n de plataformas (LMS\/API), est\u00e1ndares Open Badges (JSON-LD) y checklist de pruebas QA.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('normativa')\">\r\n <i class=\"fas fa-briefcase\"><\/i>\r\n <h6>3. Administrativa<\/h6>\r\n <p class=\"small text-muted\">An\u00e1lisis de marco legal, desarrollo de pol\u00edticas de emisi\u00f3n, protecci\u00f3n de datos y gobernanza institucional.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card featured\" onclick=\"alert('Ver detalles del Plan de Implementaci\u00f3n Personalizado')\">\r\n <i class=\"fas fa-map-marked-alt\"><\/i>\r\n <h6>Plan de implementaci\u00f3n personalizado (entregable final)<\/h6>\r\n <p class=\"small\">Documento estrat\u00e9gico que incluye apartados dispositivos, acad\u00e9micos, t\u00e9cnicos y financieros para la puesta en marcha de su unidad.<\/p>\r\n <\/div>\r\n \r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <div class=\"modal fade\" id=\"asesoriaModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg modal-dialog-centered\">\r\n <div class=\"modal-content\" style=\"border-radius:16px\">\r\n <div class=\"modal-header\" style=\"background:linear-gradient(135deg,var(--primary),var(--variant));color:white\">\r\n <h5 class=\"modal-title\" id=\"asesoriaModalTitle\">Asesor\u00eda<\/h5>\r\n <button type=\"button\" class=\"btn-close btn-close-white\" data-bs-dismiss=\"modal\" aria-label=\"Cerrar\"><\/button>\r\n <\/div>\r\n <div class=\"modal-body\">\r\n <div id=\"asesoriaOverviewContent\" class=\"small text-muted\"><\/div>\r\n <\/div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn-ghost\" data-bs-dismiss=\"modal\">Cerrar<\/button>\r\n <button class=\"btn-main\" onclick=\"alert('Solicitud de asesor\u00eda registrada (demo)')\"><i class=\"fas fa-calendar-check\"><\/i> Solicitar Sesi\u00f3n<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <section id=\"recursos\" style=\"background:linear-gradient(180deg,#fff,#f9fbff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Recursos digitales<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Accede al kit de implementaci\u00f3n y a los entregables del proyecto. Al completar el diagn\u00f3stico y la solicitud se habilita el acceso (demo).<\/p>\r\n <div class=\"row g-4 mt-4\">\r\n <div class=\"col-md-4 aos-init\" data-aos>\r\n <div class=\"resource-card text-center h-100\">\r\n <i class=\"fas fa-box-archive fa-3x text-primary\"><\/i>\r\n <h6 class=\"mt-3 fw-bold\">Kit de implementaci\u00f3n<\/h6>\r\n <p class=\"small text-muted\">Gu\u00eda r\u00e1pida para dise\u00f1o y emisi\u00f3n, videotutoriales, marcos de referencia, otros.<\/p>\r\n <div style=\"display:flex;gap:.6rem;justify-content:center;margin-top:1rem\">\r\n <button id=\"btnDownloadKit\" class=\"btn-ghost\" onclick=\"downloadKit()\">Descargar<\/button>\r\n <button class=\"btn-ghost\" onclick=\"alert('Ver demo: Kit')\">Ver<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"soporte\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Soporte & contacto<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Utilice nuestros canales de soporte: sistema de tickets, banco de consultores y preguntas frecuentes (FAQ).<\/p>\r\n <div class=\"row g-4 mt-4\">\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-ticket-alt me-2\"><\/i> Sistema de tickets<\/h6>\r\n <p class=\"small text-muted\">Registre una solicitud formal. Recibir\u00e1 seguimiento por correo electr\u00f3nico.<\/p>\r\n <form id=\"ticketForm\">\r\n <input id=\"tName\" class=\"form-control form-control-sm mb-2\" placeholder=\"Nombre \/ Instituci\u00f3n\" required\/>\r\n <input id=\"tEmail\" class=\"form-control form-control-sm mb-2\" placeholder=\"Email\" required\/>\r\n <input id=\"tSubject\" class=\"form-control form-control-sm mb-2\" placeholder=\"Asunto\" required\/>\r\n <textarea id=\"tMessage\" class=\"form-control form-control-sm mb-3\" rows=\"2\" placeholder=\"Mensaje\" required><\/textarea>\r\n <div style=\"display:flex;gap:.5rem\"><button class=\"btn-main btn-sm\" type=\"submit\">Enviar ticket<\/button><button type=\"button\" class=\"btn-ghost btn-sm\" onclick=\"viewTickets()\">Ver Tickets<\/button><\/div>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-users me-2\"><\/i> Banco de consultores <\/h6>\r\n <p class=\"small text-muted\">Expertos de las instituciones socias, clasificados por especialidad.<\/p>\r\n <div style=\"display:flex;flex-direction:column;gap:.2rem;margin-top:.8rem\">\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-user-graduate\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>M.A. Leonel Fuentes<\/strong><br\/><small class=\"text-muted\">Acad\u00e9mico\/Pedag\u00f3gico \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Leonel Fuentes \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-laptop-code\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>Ing. Jos\u00e9 Pablo Godoy<\/strong><br\/><small class=\"text-muted\">Tecnol\u00f3gico \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Jos\u00e9 Pablo Godoy \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>Lic. Carlos Pi\u00f1eiro<\/strong><br\/><small class=\"text-muted\">Normativo\/Legal \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Carlos Pi\u00f1eiro \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-question-circle me-2\"><\/i> Preguntas Frecuentes (FAQ)<\/h6>\r\n \r\n <p class=\"small text-muted\">Respuestas r\u00e1pidas a las consultas m\u00e1s comunes:<\/p>\r\n <details><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfQu\u00e9 es una microcredencial?<\/summary><p class=\"small text-muted mt-2\">Peque\u00f1as certificaciones digitales, interoperables usando Open Badges y metadatos JSON-LD.<\/p><\/details>\r\n <details style=\"margin-top:.4rem\"><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfQui\u00e9nes son los consultores?<\/summary><p class=\"small text-muted mt-2\">Expertos (Acad\u00e9micos, Tecn\u00f3logos, Normativos y Gestores) de las instituciones socias del proyecto MOCHILA (ver banco de consultores).<\/p><\/details>\r\n <details style=\"margin-top:.4rem\"><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfC\u00f3mo se garantiza la validez de la microcredencial?<\/summary><p class=\"small text-muted mt-2\">Utilizamos el est\u00e1ndar Open Badges, un formato global y seguro para la certificaci\u00f3n de competencias.<\/p><\/details>\r\n \r\n <div class=\"d-grid gap-2 mt-3\">\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Abriendo archivo central de consultas (simulaci\u00f3n en la nube del proyecto)')\"><i class=\"fas fa-cloud-upload-alt\"><\/i> Archivo central de consultas<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n \r\n <section id=\"testimonios\" style=\"background:linear-gradient(180deg,#f7fbff,#fff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Testimonios de implementaci\u00f3n<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Casos de \u00e9xito de instituciones de educaci\u00f3n superior que han implementado con \u00e9xito sus unidades de microcredenciales.<\/p>\r\n \r\n <div class=\"row g-4 mt-4\">\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"El plan de implementaci\u00f3n fue riguroso y nos permiti\u00f3 dise\u00f1ar una estrategia de microcredenciales alineada a nuestros estatutos acad\u00e9micos y t\u00e9cnicos.\"<\/blockquote>\r\n <footer>\r\n Dr. Juan P\u00e9rez\r\n <small>Universidad de San Carlos de Guatemala (USAC)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"La asesor\u00eda en la integraci\u00f3n de metadatos Open Badges fue clave. Pasamos de un concepto a una emisi\u00f3n formal en tiempo r\u00e9cord.\"<\/blockquote>\r\n <footer>\r\n Ing. Andrea Gonz\u00e1lez\r\n <small>Universidad de San Carlos de Guatemala (USAC)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"La gu\u00eda normativa nos ayud\u00f3 a crear un marco legal s\u00f3lido para la gobernanza y la emisi\u00f3n de nuestras certificaciones digitales, garantizando su validez.\"<\/blockquote>\r\n <footer>\r\n Abg. Mar\u00eda Rojas\r\n <small>Universidad Nacional Aut\u00f3noma de Honduras (UNAH)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"Gracias al diagn\u00f3stico inicial pudimos identificar r\u00e1pidamente las brechas tecnol\u00f3gicas, enfocando nuestros recursos de manera eficiente.\"<\/blockquote>\r\n <footer>\r\n Mgt. Ernesto Soto\r\n <small>Universidad de Educaci\u00f3n a Distancia de Costa Rica (UNED)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"El acompa\u00f1amiento fue excelente. Nuestros consultores, incluyendo expertos de USAC e INTEC, brindaron una perspectiva regional invaluable.\"<\/blockquote>\r\n <footer>\r\n Lic. Sonia Vidal\r\n <small>Universidad de El Salvador (UES)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n \r\n <\/div>\r\n <\/section>\r\n\r\n\r\n\r\n <button id=\"floatingChatButton\" aria-label=\"Abrir chat\" onclick=\"toggleChat()\"><i class=\"fas fa-comment-dots\"><\/i><\/button>\r\n\r\n <div id=\"floatingChatContainer\">\r\n <div class=\"chat-header\">\r\n <div><strong>Asistente Virtual MOCHILA<\/strong><br\/><small style=\"opacity:.95\">Respuestas autom\u00e1ticas - v5.0 Profesional<\/small><\/div>\r\n <button class=\"btn btn-sm btn-light\" onclick=\"clearChat()\" title=\"Limpiar chat\"><i class=\"fas fa-trash\"><\/i><\/button>\r\n <\/div>\r\n <div id=\"chatMessages\" class=\"chat-messages d-flex flex-column\" aria-live=\"polite\">\r\n <\/div>\r\n <div class=\"chat-input\">\r\n <input id=\"chatInput\" class=\"form-control form-control-sm\" placeholder=\"Escriba su consulta...\" aria-label=\"Mensaje\" onkeypress=\"handleChatKeyPress(event)\"\/>\r\n <button class=\"btn btn-primary btn-sm\" onclick=\"sendChat()\">Enviar<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"modal fade\" id=\"ticketsModal\" tabindex=\"-1\" aria-hidden=\"true\"><div class=\"modal-dialog modal-lg modal-dialog-centered\"><div class=\"modal-content\"><div class=\"modal-header\"><h5 class=\"modal-title\">Tickets guardados (local)<\/h5><button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Cerrar\"><\/button><\/div><div class=\"modal-body\"><div id=\"ticketsList\"><\/div><\/div><div class=\"modal-footer\"><button class=\"btn-ghost\" data-bs-dismiss=\"modal\">Cerrar<\/button><\/div><\/div><\/div><\/div>\r\n\r\n <script>\r\n \/* AOS-like init *\/\r\n (function(){const obs=new IntersectionObserver((entries)=>{entries.forEach((e)=>{if(e.isIntersecting) e.target.classList.add('aos-animate');});},{threshold:.15});document.querySelectorAll('[data-aos]').forEach((el,i)=>{el.classList.add('aos-init');el.style.transitionDelay=(i*60)+'ms';obs.observe(el);});})();\r\n \r\n \/* Solicitud form & resource gating (demo) *\/\r\n const storageKeyRequests='mochila_requests_v50';\r\n document.getElementById('solForm').addEventListener('submit', function(e){e.preventDefault();const inst=document.getElementById('fInst').value.trim();const pais=document.getElementById('fPais').value.trim();const email=document.getElementById('fEmail').value.trim();const desc=document.getElementById('fDesc').value.trim();if(!inst||!pais||!email){alert('Complete los campos requeridos.');return;}const arr=JSON.parse(localStorage.getItem(storageKeyRequests)||'[]');arr.push({institucion:inst,pais,correo:email,desc,fecha:new Date().toISOString()});localStorage.setItem(storageKeyRequests,JSON.stringify(arr));alert('Solicitud recibida (demo). Kit habilitado.');document.getElementById('btnDownloadKit').disabled=false;this.reset();});\r\n\r\n \/* Autodiagn\u00f3stico *\/\r\n const sPedR=document.getElementById('sPedR'), sTecR=document.getElementById('sTecR'), sNormR=document.getElementById('sNormR');\r\n const sPed=document.getElementById('sPed'), sTec=document.getElementById('sTec'), sNorm=document.getElementById('sNorm');\r\n [sPedR,sTecR,sNormR].forEach(i=>i.addEventListener('input',()=>{sPed.textContent=sPedR.value;sTec.textContent=sTecR.value;sNorm.textContent=sNormR.value;}));\r\n\r\n function generateReport(){const scores={Pedagogica:+sPedR.value,Tecnica:+sTecR.value,Normativa:+sNormR.value};const avg=Math.round((scores.Pedagogica+scores.Tecnica+scores.Normativa)\/3);const recs=[];if(scores.Tecnica<6) recs.push('- Priorizar integraci\u00f3n t\u00e9cnica y capacitaci\u00f3n TI.');if(scores.Normativa<6) recs.push('- Generar borrador de pol\u00edtica institucional.');if(scores.Pedagogica<6) recs.push('- Dise\u00f1ar 2 microcursos piloto con rubricas.');const txt=`Reporte demo \u2014 Madurez institucional\\n\\nPuntajes:\\n- Pedag\u00f3gica: ${scores.Pedagogica}\\n- T\u00e9cnica: ${scores.Tecnica}\\n- Normativa: ${scores.Normativa}\\n\\nMadurez promedio: ${avg}\/10\\n\\nRecomendaciones:\\n${recs.length?recs.join('\\n'):'- Todas las dimensiones >=6: avanzar a asesor\u00eda y piloto.'}\\n\\nEntregables sugeridos: reporte ejecutivo, plan 3 meses, kit de implementaci\u00f3n.`;document.getElementById('miniText').textContent=txt;document.getElementById('miniReport').style.display='block';document.getElementById('btnDownloadReport').style.display='inline-block';}\r\n document.getElementById('btnReport').addEventListener('click',generateReport);\r\n document.getElementById('btnClear').addEventListener('click',()=>{[sPedR,sTecR,sNormR].forEach(i=>i.value=5);sPed.textContent=sTec.textContent=sNorm.textContent='5';document.getElementById('miniReport').style.display='none';document.getElementById('btnDownloadReport').style.display='none';});\r\n document.getElementById('btnDownloadReport').addEventListener('click',()=>{const txt=document.getElementById('miniText').textContent;const blob=new Blob([txt],{type:'text\/plain;charset=utf-8'});const url=URL.createObjectURL(blob);const a=document.createElement('a');a.href=url;a.download='reporte_mochila_demo.txt';document.body.appendChild(a);a.click();a.remove();URL.revokeObjectURL(url);});\r\n\r\n \/* Asesor\u00eda modal content *\/\r\n function openAsesoriaModal(type){\r\n const title=document.getElementById('asesoriaModalTitle');\r\n const overview=document.getElementById('asesoriaOverviewContent');\r\n \r\n if(type==='pedagogica'){\r\n title.textContent='Asesor\u00eda Pedag\u00f3gica y Acad\u00e9mica \u2014 Detalle';\r\n overview.innerHTML=`<p class=\"small text-muted\"><strong>Fundamentos:<\/strong> Rutas de aprendizaje, criterios acad\u00e9micos y dise\u00f1o de microcredenciales con descriptores estandarizados.<\/p><ol class=\"small text-muted\"><li>Identificar competencias y resultados de aprendizaje.<\/li><li>Definir evidencia y criterios de evaluaci\u00f3n.<\/li><li>Dise\u00f1ar metadatos y arte de la credencial.<\/li><\/ol>`;\r\n }else if(type==='tecnica'){\r\n title.textContent='Asesor\u00eda T\u00e9cnica y Metadatos \u2014 Detalle';\r\n overview.innerHTML=`<p class=\"small text-muted\"><strong>Metadatos y Open Badges:<\/strong> JSON-LD templates, endpoints, pruebas QA y checklist de integraci\u00f3n.<\/p><ul class=\"small text-muted\"><li>Campos clave: id, title, description, criteria, issuer, issuanceDate, evidence.<\/li><li>Integraci\u00f3n con plataformas (LMS\/API).<\/li><\/ul>`;\r\n }else if(type==='normativa'){\r\n title.textContent='Asesor\u00eda administrativa';\r\n overview.innerHTML=`<ul class=\"small text-muted\"><li>Criterios para dise\u00f1o y emisi\u00f3n.<\/li><li>Revisi\u00f3n de marco legal institucional.<\/li><li>Desarrollo de pol\u00edtica de gobernanza.<\/li><\/ul>`;\r\n } else {\r\n return; \r\n }\r\n\r\n const modalEl=document.getElementById('asesoriaModal');\r\n const modal=new bootstrap.Modal(modalEl);\r\n modal.show();\r\n }\r\n\r\n \/* Resources (download demo) *\/\r\n function downloadKit(){const hasReq=JSON.parse(localStorage.getItem(storageKeyRequests)||'[]').length>0;if(!hasReq){alert('Env\u00eda primero una solicitud para habilitar el Kit (demo).');return;}const content='Kit de implementacion MOCHILA - demo\\n\\nIncluye: Guia, plantillas y ejemplos.';const blob=new Blob([content],{type:'text\/plain;charset=utf-8'});const url=URL.createObjectURL(blob);const a=document.createElement('a');a.href=url;a.download='kit_mochila_demo.txt';document.body.appendChild(a);a.click();a.remove();URL.revokeObjectURL(url);}\r\n\r\n \/* Tickets (local storage demo) *\/\r\n const ticketsKey='mochila_tickets_v50';\r\n document.getElementById('ticketForm').addEventListener('submit',function(e){e.preventDefault();const name=document.getElementById('tName').value.trim();const email=document.getElementById('tEmail').value.trim();const subject=document.getElementById('tSubject').value.trim();const message=document.getElementById('tMessage').value.trim();if(!name||!email||!subject||!message){alert('Complete todos los campos.');return;}const arr=JSON.parse(localStorage.getItem(ticketsKey)||'[]');arr.push({name,email,subject,message,fecha:new Date().toISOString(),status:'nuevo'});localStorage.setItem(ticketsKey,JSON.stringify(arr));alert('Ticket creado (demo).');this.reset();});\r\n function viewTickets(){const arr=JSON.parse(localStorage.getItem(ticketsKey)||'[]');const list=document.getElementById('ticketsList');list.innerHTML='';if(!arr.length){list.innerHTML='<p class=\"text-muted\">No hay tickets guardados.<\/p>';}else{arr.reverse().forEach(t=>{const el=document.createElement('div');el.className='p-2 mb-2 border rounded';el.innerHTML=`<div style=\"font-weight:800\">${escapeHtml(t.subject)}<\/div><div class=\"small text-muted\">${escapeHtml(t.name)} \u2014 ${new Date(t.fecha).toLocaleString()}<\/div><div style=\"margin-top:.4rem\">${escapeHtml(t.message)}<\/div>`;list.appendChild(el);});}const modal=new bootstrap.Modal(document.getElementById('ticketsModal'));modal.show();}\r\n\r\n \/* Chatbot Flotante Logic - Mensaje de bienvenida ajustado *\/\r\n const chatKey='mochila_chat_v50';\r\n const chatContainer = document.getElementById('floatingChatContainer');\r\n const chatMessagesEl = document.getElementById('chatMessages');\r\n const chatInputEl = document.getElementById('chatInput');\r\n\r\n function toggleChat(){\r\n chatContainer.style.display = chatContainer.style.display === 'flex' ? 'none' : 'flex';\r\n if (chatContainer.style.display === 'flex') {\r\n loadChat();\r\n chatInputEl.focus();\r\n }\r\n }\r\n\r\n function loadChat(){\r\n const arr=JSON.parse(localStorage.getItem(chatKey)||'[]');\r\n chatMessagesEl.innerHTML='';\r\n if (arr.length === 0) {\r\n \/\/ Mensaje profesional solicitado, sin negritas ni lista expl\u00edcita de palabras clave\r\n const welcomeMsg = 'Bienvenido. Soy MOCHILA Bot, su asistente virtual. Estamos aqu\u00ed para ofrecerle informaci\u00f3n sobre nuestro servicio de consultor\u00eda. Por favor, escriba su consulta.';\r\n appendMessage('bot', welcomeMsg, false); \r\n } else {\r\n arr.forEach(m => appendMessage(m.from, m.text, false));\r\n }\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n }\r\n\r\n function appendMessage(from, text, save=true) {\r\n if (save) saveMsg(from, text);\r\n \r\n const d = document.createElement('div');\r\n d.className = `msg ${from} d-flex flex-column`;\r\n \r\n const fromSpan = document.createElement('small');\r\n fromSpan.className = 'msg-from';\r\n fromSpan.textContent = from === 'user' ? 'Usted' : 'Asistente';\r\n \r\n const textDiv = document.createElement('div');\r\n textDiv.style.marginTop = '.25rem';\r\n textDiv.innerHTML = from === 'bot' ? text : escapeHtml(text); \r\n \r\n d.appendChild(fromSpan);\r\n d.appendChild(textDiv);\r\n \r\n chatMessagesEl.appendChild(d);\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n }\r\n \r\n function saveMsg(from, text){\r\n const arr=JSON.parse(localStorage.getItem(chatKey)||'[]');\r\n arr.push({from,text,t:new Date().toISOString()});\r\n localStorage.setItem(chatKey,JSON.stringify(arr));\r\n }\r\n\r\n function sendChat(){\r\n const txt=chatInputEl.value.trim();\r\n if(!txt)return;\r\n \r\n appendMessage('user', txt);\r\n chatInputEl.value='';\r\n \r\n \/\/ Agregar indicador de escritura\r\n const typingDiv = document.createElement('div');\r\n typingDiv.className = 'msg bot';\r\n typingDiv.innerHTML = '<small class=\"msg-from\">Asistente<\/small><div style=\"margin-top:.25rem\">Analizando consulta...<\/div>';\r\n chatMessagesEl.appendChild(typingDiv);\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n \r\n setTimeout(()=>{\r\n typingDiv.remove();\r\n const reply = autoReply(txt);\r\n appendMessage('bot', reply);\r\n }, 800 + Math.random() * 800); \r\n }\r\n \r\n function handleChatKeyPress(event) {\r\n if (event.key === 'Enter') {\r\n sendChat();\r\n event.preventDefault(); \r\n }\r\n }\r\n \r\n function autoReply(t){\r\n const s = t.toLowerCase();\r\n\r\n if (s.includes('diagnostico') || s.includes('madurez')) {\r\n return 'El proceso de Diagn\u00f3stico Inicial comienza con el env\u00edo de la Solicitud formal y la ejecuci\u00f3n del Autodiagn\u00f3stico de Madurez Institucional. Esto nos permite generar un Reporte Preliminar con recomendaciones espec\u00edficas para su implementaci\u00f3n.';\r\n }\r\n \r\n if (s.includes('asesoria') || s.includes('consultoria') || s.includes('acompa\u00f1amiento') || s.includes('plan')) {\r\n return 'La Asesor\u00eda Especializada se estructura en tres pilares: Pedag\u00f3gica, T\u00e9cnica y Normativa, culminando en un Plan de Implementaci\u00f3n Personalizado.';\r\n }\r\n \r\n if (s.includes('kit') || s.includes('recursos') || s.includes('plantillas')) {\r\n return 'El Kit de Implementaci\u00f3n (Gu\u00eda, plantillas, checklist) y otros recursos digitales se habilitan en la secci\u00f3n \"Recursos Digitales\" una vez que su instituci\u00f3n complete la Solicitud formal. Este kit es clave para la fase de Implementaci\u00f3n.';\r\n }\r\n \r\n if (s.includes('badge') || s.includes('microcredencial') || s.includes('open badge')) {\r\n return 'Las Microcredenciales son certificaciones digitales que siguen el est\u00e1ndar internacional Open Badges (JSON-LD), asegurando su interoperabilidad y validez. Nuestro servicio gu\u00eda en el dise\u00f1o y la emisi\u00f3n t\u00e9cnica conforme a este est\u00e1ndar.';\r\n }\r\n \r\n if (s.includes('normativa') || s.includes('legal') || s.includes('politicas')) {\r\n return 'La Asesor\u00eda Normativa y Legal aborda el marco regulatorio institucional, incluyendo el desarrollo de pol\u00edticas de emisi\u00f3n, protecci\u00f3n de datos y el modelo de gobernanza para las microcredenciales.';\r\n }\r\n \r\n if (s.includes('contacto') || s.includes('soporte')) {\r\n return 'Puede contactarnos a trav\u00e9s del Sistema de Tickets para solicitudes formales. Tambi\u00e9n puede consultar el Banco de Consultores para contactar a un experto espec\u00edfico.';\r\n }\r\n \r\n if (s.includes('socios') || s.includes('universidades') || s.includes('instituciones') || s.includes('aliados')) {\r\n return 'El proyecto MOCHILA cuenta con el respaldo de IES socias de alto prestigio en la regi\u00f3n LAC, cuyos expertos contribuyen a nuestro servicio de consultor\u00eda.';\r\n }\r\n \r\n if (s.includes('testimonios') || s.includes('exito')) {\r\n return 'Los testimonios de \u00e9xito, como los de UC3M, ITESM y UCHILE, demuestran la efectividad de nuestro plan de consultor\u00eda. Puede ver los casos completos al final de la p\u00e1gina.';\r\n }\r\n \r\n return 'Hemos recibido su consulta. Por favor, formule su pregunta en relaci\u00f3n a nuestras \u00e1reas de servicio para ofrecerle una respuesta precisa.';\r\n }\r\n \r\n function clearChat(){\r\n if(!confirm('\u00bfBorrar historial local del chat?'))return;\r\n localStorage.removeItem(chatKey);\r\n loadChat();\r\n }\r\n\r\n \/* Util *\/\r\n function escapeHtml(s){return String(s).replace(\/[&<>\"]\/g,m=>({'&':'&','<':'<','>':'>','\"':'"'}[m]));}\r\n\r\n \/* Init *\/\r\n document.addEventListener('DOMContentLoaded',()=>{\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(a=>a.addEventListener('click',e=>{e.preventDefault();const t=document.querySelector(a.getAttribute('href'));if(t)t.scrollIntoView({behavior:'smooth',block:'start'});}));\r\n if(!(JSON.parse(localStorage.getItem(storageKeyRequests)||'[]').length>0))document.getElementById('btnDownloadKit').disabled=true;\r\n });\r\n <\/script>\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.2\/dist\/js\/bootstrap.bundle.min.js\"><\/script>\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>MOCHILA \u2014 Servicio de Consultor\u00eda (v5.0 – Edici\u00f3n Profesional) MOCHILA Servicio de Consultor\u00eda \u2014 v5.0 Inicio Descripci\u00f3n Solicitud & Diagn\u00f3stico Asesor\u00eda Recursos Soporte Testimonios Servicio de consultor\u00eda \u2013 Proyecto MOCHILA \u2013 Instalaci\u00f3n de unidades para dise\u00f1o y emisi\u00f3n de microcredenciales en IES de LAC Descripci\u00f3n del proceso Sed ut perspiciatis unde omnis iste natus error …<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/virtual.usac.edu.gt\/diged\/mochila_demo\/\"> <span class=\"screen-reader-text\">mochila_demo<\/span> Read More »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","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":"","footnotes":""},"class_list":["post-22782","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/comments?post=22782"}],"version-history":[{"count":191,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782\/revisions"}],"predecessor-version":[{"id":22986,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782\/revisions\/22986"}],"wp:attachment":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/media?parent=22782"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\r\n\r\n\r\n \r\n \r\n MOCHILA \u2014 Servicio de Consultor\u00eda (v5.0 - Edici\u00f3n Profesional)<\/title>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Nunito:wght@300;400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.2\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css\"\/>\r\n <style>\r\n \/* VARIABLES *\/\r\n :root{\r\n --primary:#1344a1;\r\n --variant:#4b77c4;\r\n --muted:#c4d6e9;\r\n --dark:#201d4c;\r\n --cream:#f6f8ff;\r\n --accent:#d65c4a;\r\n --shadow-light: 0 8px 24px rgba(32,29,76,.05);\r\n --shadow-mid: 0 16px 42px rgba(19,68,161,.08);\r\n --maxw:1200px;\r\n --radius-lg: 18px;\r\n }\r\n *{box-sizing:border-box}\r\n html,body{height:100%}\r\n \/* AJUSTE PARA BAJAR EL MEN\u00da Y CONTENIDO *\/\r\n body{font-family:\"Nunito\",sans-serif;margin:0;padding-top:90px;color:var(--dark);background:linear-gradient(180deg,#fff 0,#f6f8ff 40%)}\r\n \r\n header{position:fixed;top:0;left:0;right:0;z-index:1300;background:#fff;border-bottom:1px solid rgba(22,57,135,.06);\r\n \/* Hago el header m\u00e1s alto *\/\r\n padding: 1rem 0;\r\n }\r\n .nav-inner{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 1rem}\r\n .brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--primary)}\r\n .logo-svg{width:46px;height:46px}\r\n nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.4rem}\r\n nav a{color:var(--primary);text-decoration:none;padding:.45rem .7rem;border-radius:8px;font-weight:700}\r\n nav a:hover{background:rgba(19,68,161,.06)}\r\n\r\n #hero{padding:3.6rem 1rem 2.8rem;position:relative}\r\n .hero-inner{max-width:var(--maxw);margin:0 auto;display:flex;gap:2rem;align-items:center;justify-content:space-between;flex-wrap:wrap}\r\n .hero-card{background:linear-gradient(135deg,#e9f0ff,#fff);border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-mid);display:flex;gap:2rem;align-items:center}\r\n .h-title{font-weight:800;font-size:1.6rem;color:var(--primary);margin:0}\r\n .h-sub{margin:0;color:#455070}\r\n .btn-main{background:linear-gradient(135deg,var(--primary),var(--variant));color:#fff;padding:.7rem 1.2rem;border-radius:999px;border:none;font-weight:800;box-shadow:0 12px 30px rgba(19,68,161,.2);transition:all .2s}\r\n .btn-main:hover{box-shadow:0 10px 24px rgba(19,68,161,.3)}\r\n .btn-ghost{background:transparent;border:2px solid var(--primary);color:var(--primary);padding:.6rem 1.1rem;border-radius:12px;font-weight:700;transition:all .2s}\r\n .btn-ghost:hover{background:rgba(19,68,161,.06)}\r\n \r\n section{padding:3.5rem 1rem}\r\n .container-max{max-width:var(--maxw);margin:0 auto}\r\n h2{font-weight:800;color:var(--primary)}\r\n p.lead{color:#495670}\r\n \r\n .icon-box{display:flex;align-items:flex-start;gap:1.2rem;margin-bottom:1.5rem;background:#fff;border-radius:var(--radius-lg);padding:1.4rem;box-shadow:var(--shadow-light)}\r\n .icon-box i{font-size:1.8rem;color:var(--primary);flex-shrink:0}\r\n .icon-box h5{font-weight:800;margin:0 0 .3rem 0}\r\n .icon-box p{margin:0;color:#4a516b;font-size:.95rem}\r\n \r\n \/* FLOW *\/\r\n .flow-container {padding: 2rem 0;position: relative;}\r\n .flow {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 2rem;\r\n position: relative;\r\n z-index: 10;\r\n }\r\n .step {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.5rem;\r\n box-shadow: var(--shadow-light);\r\n text-align: center;\r\n position: relative;\r\n transition: transform 0.3s ease, box-shadow 0.3s ease;\r\n border: 1px solid var(--muted);\r\n }\r\n .step .num{width:48px;height:48px;background:var(--variant);color:white;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:.8rem;font-size:1rem}\r\n .step i{font-size:1.8rem;color:var(--primary);margin-bottom:.4rem}\r\n \r\n \/* TARJETAS DE ASESOR\u00cdA (4 Columnas) *\/\r\n .advisory-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); \r\n gap: 1.2rem;\r\n }\r\n .advisory-card {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.2rem;\r\n box-shadow: var(--shadow-light);\r\n transition: all 0.3s ease;\r\n border: 1px solid #eef2f8;\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n }\r\n .advisory-card i {font-size: 1.8rem;color: var(--primary);margin-bottom: 0.6rem;}\r\n .advisory-card h6 {font-size: 1.1rem;font-weight: 800;color: var(--primary);margin-bottom: 0.4rem;}\r\n .advisory-card p {font-size: 0.9rem;}\r\n .advisory-card.featured {\r\n background: linear-gradient(145deg, var(--primary), var(--variant));\r\n color: white;\r\n border: 2px solid var(--primary);\r\n box-shadow: 0 15px 40px rgba(19,68,161,.35);\r\n cursor: default;\r\n }\r\n .advisory-card.featured i {color: white;}\r\n .advisory-card.featured h6 {color: white;}\r\n .advisory-card.featured p {color: #f0f4ff;}\r\n \r\n \/* Testimonios Din\u00e1micos (AJUSTE) *\/\r\n .testimonial-card {\r\n background: #fff;\r\n border-radius: var(--radius-lg);\r\n padding: 1.5rem;\r\n box-shadow: var(--shadow-light);\r\n border-left: 5px solid var(--accent); \/* L\u00ednea de color para dinamismo *\/\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n transition: transform 0.2s;\r\n }\r\n .testimonial-card:hover {\r\n transform: translateY(-5px);\r\n box-shadow: 0 10px 30px rgba(214, 92, 74, .1);\r\n }\r\n .testimonial-card blockquote {\r\n font-style: italic;\r\n margin: 0 0 1rem 0;\r\n line-height: 1.6;\r\n color: var(--dark);\r\n font-size: 1.05rem;\r\n }\r\n .testimonial-card footer {\r\n font-weight: 800;\r\n color: var(--accent);\r\n font-size: 0.95rem;\r\n }\r\n .testimonial-card footer small {\r\n display: block;\r\n color: #6c757d;\r\n font-weight: 400;\r\n }\r\n\r\n \/* TARJETAS DE RECURSOS Y SOLICITUD *\/\r\n .resource-card{background:#fff;border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-light)}\r\n \r\n \/* BANCO DE CONSULTORES *\/\r\n .consultor-perfil {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.8rem;\r\n padding: 0.6rem 0;\r\n border-bottom: 1px solid #f0f4ff;\r\n }\r\n .consultor-perfil:last-child {border-bottom: none;}\r\n .consultor-icon {width: 46px;height: 46px;border-radius: 10px;background: #f0f4ff;display: flex;align-items: center;justify-content: center;color: var(--primary);flex-shrink: 0;}\r\n\r\n \/* CHATBOT FLOTANTE *\/\r\n #floatingChatButton {\r\n position: fixed;\r\n bottom: 20px;\r\n right: 20px;\r\n z-index: 1000;\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n background: var(--accent);\r\n color: white;\r\n border: none;\r\n box-shadow: 0 8px 16px rgba(214, 92, 74, .4);\r\n font-size: 1.8rem;\r\n transition: transform 0.3s;\r\n }\r\n #floatingChatButton:hover {\r\n transform: scale(1.05);\r\n }\r\n #floatingChatContainer {\r\n position: fixed;\r\n bottom: 90px;\r\n right: 20px;\r\n z-index: 1000;\r\n width: 320px;\r\n height: 400px;\r\n background: white;\r\n border-radius: var(--radius-lg);\r\n box-shadow: var(--shadow-mid);\r\n display: none;\r\n flex-direction: column;\r\n overflow: hidden;\r\n border: 1px solid var(--primary);\r\n }\r\n .chat-header{background:linear-gradient(135deg,var(--primary),var(--variant));color:white;padding:.6rem .8rem;display:flex;align-items:center;justify-content:space-between}\r\n .chat-messages{flex:1;padding:.7rem;overflow-y:auto;background:linear-gradient(180deg,#fbfdff,#fff); scroll-behavior: smooth;}\r\n .chat-input{padding:.5rem;border-top:1px solid #eee;display:flex;gap:.5rem; background: #fff;}\r\n .msg{\r\n padding:.6rem;\r\n border-radius:10px;\r\n margin:.4rem 0;\r\n max-width:85%;\r\n line-height: 1.3;\r\n }\r\n .msg.bot{\r\n background:#f1f6ff;\r\n display:inline-block;\r\n align-self: flex-start;\r\n border-bottom-left-radius: 2px;\r\n }\r\n .msg.user{\r\n background:var(--variant);\r\n color:white;\r\n display:inline-block;\r\n align-self:flex-end;\r\n border-bottom-right-radius: 2px;\r\n }\r\n .msg .msg-from{font-weight:700; opacity: 0.9;}\r\n\r\n \/* Media Queries *\/\r\n @media (max-width: 900px){\r\n .flow {\r\n grid-template-columns: 1fr;\r\n gap: 1.5rem;\r\n }\r\n .step:not(:last-child)::after {\r\n right: 50%;\r\n transform: translateX(50%) rotate(90deg);\r\n width: 1.5rem;\r\n top: unset;\r\n bottom: -1.5rem;\r\n height: 1.5rem;\r\n }\r\n .flow-container {padding: 1rem 0;}\r\n }\r\n @media (max-width: 768px){\r\n .hero-card{flex-direction:column; align-items:flex-start;}\r\n .advisory-grid {grid-template-columns: 1fr;}\r\n #floatingChatContainer {width: 90%; right: 5%; left: 5%;}\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <header>\r\n <div class=\"nav-inner\">\r\n <a href=\"#hero\" class=\"brand\" aria-label=\"MOCHILA inicio\">\r\n <svg class=\"logo-svg\" viewBox=\"0 0 64 64\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <rect width=\"64\" height=\"64\" rx=\"10\" fill=\"#1344a1\"\/>\r\n <g transform=\"translate(9,9)\" fill=\"#fff\">\r\n <path d=\"M6 2h28v4H6zM6 10h28v24H6z\" opacity=\"0.95\"><\/path>\r\n <\/g>\r\n <\/svg>\r\n <div style=\"line-height:1\">\r\n <div style=\"font-weight:800\">MOCHILA<\/div>\r\n <small style=\"opacity:.9;font-weight:600\">Servicio de Consultor\u00eda \u2014 v5.0<\/small>\r\n <\/div>\r\n <\/a>\r\n <nav aria-label=\"Men\u00fa principal\">\r\n <ul id=\"mainNav\">\r\n <li><a href=\"#hero\"><i class=\"fas fa-home me-2\"><\/i>Inicio<\/a><\/li>\r\n <li><a href=\"#descripcion\"><i class=\"fas fa-info-circle me-2\"><\/i>Descripci\u00f3n<\/a><\/li>\r\n <li><a href=\"#solicitud\"><i class=\"fas fa-clipboard-list me-2\"><\/i>Solicitud & Diagn\u00f3stico<\/a><\/li>\r\n <li><a href=\"#asesoria\"><i class=\"fas fa-handshake me-2\"><\/i>Asesor\u00eda<\/a><\/li>\r\n <li><a href=\"#recursos\"><i class=\"fas fa-download me-2\"><\/i>Recursos<\/a><\/li>\r\n <li><a href=\"#soporte\"><i class=\"fas fa-headset me-2\"><\/i>Soporte<\/a><\/li>\r\n <li><a href=\"#testimonios\"><i class=\"fas fa-award me-2\"><\/i>Testimonios<\/a><\/li>\r\n <\/ul>\r\n <\/nav>\r\n <\/div>\r\n <\/header>\r\n\r\n <section id=\"hero\">\r\n <div class=\"hero-inner container-max\">\r\n <div class=\"hero-card\">\r\n <div style=\"flex:1\">\r\n <h1 class=\"h-title\">Servicio de consultor\u00eda \u2013 Proyecto MOCHILA \u2013 Instalaci\u00f3n de unidades para dise\u00f1o y emisi\u00f3n de microcredenciales en IES de LAC<\/h1>\r\n <div style=\"display:flex;gap:.8rem;margin-top:.8rem;flex-wrap:wrap\">\r\n <\/div>\r\n <\/div>\r\n <div style=\"width:220px;text-align:center\">\r\n <svg viewBox=\"0 0 200 160\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" aria-hidden=\"true\" style=\"width:100%\">\r\n <rect x=\"8\" y=\"20\" width=\"140\" height=\"92\" rx=\"10\" fill=\"#f3f8ff\" stroke=\"#dfe9f8\"\/>\r\n <circle cx=\"160\" cy=\"36\" r=\"22\" fill=\"#fff\" stroke=\"#f0f6ff\"\/>\r\n <rect x=\"22\" y=\"40\" width=\"112\" height=\"12\" rx=\"6\" fill=\"#fff\"\/>\r\n <rect x=\"22\" y=\"62\" width=\"80\" height=\"10\" rx=\"6\" fill=\"#fff\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"descripcion\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Descripci\u00f3n del proceso<\/h2>\r\n <p class=\"lead aos-init\" data-aos>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sun.<\/p>\r\n \r\n <div class=\"icon-box aos-init\" data-aos>\r\n <i class=\"fas fa-bullseye\"><\/i>\r\n <div>\r\n <h5>Objetivos y beneficios clave<\/h5>\r\n <p>Asesor\u00eda experta, promoci\u00f3n de la adopci\u00f3n de microcredenciales, creaci\u00f3n de comunidades de pr\u00e1ctica y posicionamiento como referente regional.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"icon-box aos-init\" data-aos>\r\n <i class=\"fas fa-layer-group\"><\/i>\r\n <div>\r\n <h5>Fases del servicio<\/h5>\r\n <p>Proceso secuencial de: diagn\u00f3stico inicial, asesor\u00eda especializada y plan de implementaci\u00f3n\/seguimiento.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"flow-container mt-4 aos-init\" data-aos>\r\n <h3 style=\"font-weight:700; color:var(--primary); margin-bottom:1.5rem; text-align:center;\">Flujo de acompa\u00f1amiento MOCHILA<\/h3>\r\n <div class=\"flow\">\r\n <div class=\"step\">\r\n <div class=\"num\">1<\/div>\r\n <i class=\"fas fa-clipboard-list\"><\/i>\r\n <div style=\"font-weight:800\">Diagn\u00f3stico inicial<\/div>\r\n <div class=\"small text-muted\">Solicitud y cuestionario de madurez<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">2<\/div>\r\n <i class=\"fas fa-user-tie\"><\/i>\r\n <div style=\"font-weight:800\">Asesor\u00eda especializada<\/div>\r\n <div class=\"small text-muted\">Sesiones de consultor\u00eda y gu\u00eda r\u00e1pida<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">3<\/div>\r\n <i class=\"fas fa-rocket\"><\/i>\r\n <div style=\"font-weight:800\">Implementaci\u00f3n<\/div>\r\n <div class=\"small text-muted\">Plan personalizado y emisi\u00f3n piloto<\/div>\r\n <\/div>\r\n <div class=\"step\">\r\n <div class=\"num\">4<\/div>\r\n <i class=\"fas fa-handshake\"><\/i>\r\n <div style=\"font-weight:800\">Seguimiento y Cierre<\/div>\r\n <div class=\"small text-muted\">Recursos y soporte continuo<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"solicitud\" style=\"background:linear-gradient(180deg,#fff,#f7fbff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Solicitud & diagn\u00f3stico<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>El proceso comienza con la solicitud formal seguida de un autodiagn\u00f3stico que mide la madurez de su instituci\u00f3n en dimensiones clave (pedag\u00f3gica, t\u00e9cnica y administrativa).<\/p>\r\n\r\n <div class=\"row g-4 mt-3 justify-content-center\">\r\n \r\n <div class=\"col-lg-10 aos-init\" data-aos>\r\n <div class=\"row g-4\">\r\n \r\n <div class=\"col-md-6\">\r\n <div class=\"resource-card h-100\">\r\n <h6 style=\"font-weight:800\"><i class=\"fas fa-envelope-open-text me-2\"><\/i> Paso 1: Formulario de Solicitud<\/h6>\r\n <p class=\"small text-muted\">Registre los datos de su instituci\u00f3n para iniciar el proceso y habilitar el Kit de Implementaci\u00f3n.<\/p>\r\n <form id=\"solForm\">\r\n <div class=\"mb-2\"><label class=\"form-label small\">Instituci\u00f3n<\/label><input id=\"fInst\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-2\"><label class=\"form-label small\">Pa\u00eds<\/label><input id=\"fPais\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-2\"><label class=\"form-label small\">Contacto (email)<\/label><input id=\"fEmail\" type=\"email\" class=\"form-control form-control-sm\" required><\/div>\r\n <div class=\"mb-3\"><label class=\"form-label small\">Breve descripci\u00f3n del inter\u00e9s<\/label><textarea id=\"fDesc\" class=\"form-control form-control-sm\" rows=\"2\"><\/textarea><\/div>\r\n <div class=\"d-grid gap-2\"><button class=\"btn-main btn-sm\" type=\"submit\"><i class=\"fas fa-paper-plane\"><\/i> Enviar solicitud<\/button><\/div>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6\">\r\n <div class=\"resource-card h-100\" style=\"background:#f0f4ff; border: 1px solid var(--primary);\">\r\n <h6 style=\"font-weight:800; color:var(--primary);\"><i class=\"fas fa-chart-pie me-2\"><\/i> Paso 2: Autodiagn\u00f3stico de Madurez<\/h6>\r\n <div class=\"row g-3\">\r\n\t<form id=\"solForm\">\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">\u00bfCu\u00e1l es el principal objetivo que busca su instituci\u00f3n al implementar microcredenciales digitales?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>Experimentaci\u00f3n.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Mejora de la oferta formativa.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Apertura de nuevos mercados.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p1\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Liderazgo e innovaci\u00f3n educativa.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">Sobre la emisi\u00f3n y tecnolog\u00eda, \u00bfcu\u00e1l es su situaci\u00f3n?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>En exploraci\u00f3n.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Iniciativas aisladas.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Procesos estandarizados.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Sistema integrado con datos.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t\t<div class=\"mb-2\">\r\n\t\t\t<label class=\"form-label small\">\u00bfC\u00f3mo es la gesti\u00f3n y reconocimiento institucional?<\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r1\" id=\"fInst\" > <label class=\"form-label small\"><i>Sin marco definido.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r2\" id=\"fInst\" > <label class=\"form-label small\"><i>Comit\u00e9 exploratorio.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r3\" id=\"fInst\" > <label class=\"form-label small\"><i>Pol\u00edtica establecida.<\/i><\/label><br\/>\r\n\t\t\t<input type=\"radio\" name=\"p2\" value=\"r4\" id=\"fInst\" > <label class=\"form-label small\"><i>Alianzas con sector externo.<\/i><\/label><br\/>\r\n\t\t<\/div>\r\n\t<\/form>\r\n<\/div>\r\n <div style=\"margin-top:1.5rem;display:flex;gap:.8rem;flex-wrap:wrap\">\r\n <button id=\"btnReport\" class=\"btn-main btn-sm\">Generar reporte demo<\/button>\r\n <button id=\"btnClear\" class=\"btn-ghost btn-sm\">Limpiar<\/button>\r\n <\/div>\r\n <div id=\"miniReport\" style=\"display:none;margin-top:1rem;background:#f8fbff;padding:1rem;border-radius:12px;border:1px solid #e1e9f5;\">\r\n <strong>Reporte Preliminar (demo)<\/strong>\r\n <pre id=\"miniText\" style=\"white-space:pre-wrap;font-size:.95rem;margin:6px 0 0 0;font-family:monospace;line-height:1.4\"><\/pre>\r\n <button id=\"btnDownloadReport\" class=\"btn-ghost btn-sm mt-2\">Descargar reporte<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"asesoria\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Asesor\u00eda espec\u00edfica<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Ofrecemos consultor\u00eda enfocada en tres \u00e1reas clave (pedag\u00f3gica, t\u00e9cnica y administrativa), culminando en un plan de implementaci\u00f3n personalizado.<\/p>\r\n \r\n <div class=\"advisory-grid mt-4 aos-init\" data-aos>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('pedagogica')\">\r\n <i class=\"fas fa-graduation-cap\"><\/i>\r\n <h6>1. Pedag\u00f3gica<\/h6>\r\n <p class=\"small text-muted\">Definici\u00f3n de rutas de aprendizaje, dise\u00f1o instruccional, r\u00fabricas y procesos formativos acreditables.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('tecnica')\">\r\n <i class=\"fas fa-microchip\"><\/i>\r\n <h6>2. T\u00e9cnica<\/h6>\r\n <p class=\"small text-muted\">Integraci\u00f3n de plataformas (LMS\/API), est\u00e1ndares Open Badges (JSON-LD) y checklist de pruebas QA.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card\" onclick=\"openAsesoriaModal('normativa')\">\r\n <i class=\"fas fa-briefcase\"><\/i>\r\n <h6>3. Administrativa<\/h6>\r\n <p class=\"small text-muted\">An\u00e1lisis de marco legal, desarrollo de pol\u00edticas de emisi\u00f3n, protecci\u00f3n de datos y gobernanza institucional.<\/p>\r\n <\/div>\r\n \r\n <div class=\"advisory-card featured\" onclick=\"alert('Ver detalles del Plan de Implementaci\u00f3n Personalizado')\">\r\n <i class=\"fas fa-map-marked-alt\"><\/i>\r\n <h6>Plan de implementaci\u00f3n personalizado (entregable final)<\/h6>\r\n <p class=\"small\">Documento estrat\u00e9gico que incluye apartados dispositivos, acad\u00e9micos, t\u00e9cnicos y financieros para la puesta en marcha de su unidad.<\/p>\r\n <\/div>\r\n \r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <div class=\"modal fade\" id=\"asesoriaModal\" tabindex=\"-1\" aria-hidden=\"true\">\r\n <div class=\"modal-dialog modal-lg modal-dialog-centered\">\r\n <div class=\"modal-content\" style=\"border-radius:16px\">\r\n <div class=\"modal-header\" style=\"background:linear-gradient(135deg,var(--primary),var(--variant));color:white\">\r\n <h5 class=\"modal-title\" id=\"asesoriaModalTitle\">Asesor\u00eda<\/h5>\r\n <button type=\"button\" class=\"btn-close btn-close-white\" data-bs-dismiss=\"modal\" aria-label=\"Cerrar\"><\/button>\r\n <\/div>\r\n <div class=\"modal-body\">\r\n <div id=\"asesoriaOverviewContent\" class=\"small text-muted\"><\/div>\r\n <\/div>\r\n <div class=\"modal-footer\">\r\n <button class=\"btn-ghost\" data-bs-dismiss=\"modal\">Cerrar<\/button>\r\n <button class=\"btn-main\" onclick=\"alert('Solicitud de asesor\u00eda registrada (demo)')\"><i class=\"fas fa-calendar-check\"><\/i> Solicitar Sesi\u00f3n<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <section id=\"recursos\" style=\"background:linear-gradient(180deg,#fff,#f9fbff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Recursos digitales<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Accede al kit de implementaci\u00f3n y a los entregables del proyecto. Al completar el diagn\u00f3stico y la solicitud se habilita el acceso (demo).<\/p>\r\n <div class=\"row g-4 mt-4\">\r\n <div class=\"col-md-4 aos-init\" data-aos>\r\n <div class=\"resource-card text-center h-100\">\r\n <i class=\"fas fa-box-archive fa-3x text-primary\"><\/i>\r\n <h6 class=\"mt-3 fw-bold\">Kit de implementaci\u00f3n<\/h6>\r\n <p class=\"small text-muted\">Gu\u00eda r\u00e1pida para dise\u00f1o y emisi\u00f3n, videotutoriales, marcos de referencia, otros.<\/p>\r\n <div style=\"display:flex;gap:.6rem;justify-content:center;margin-top:1rem\">\r\n <button id=\"btnDownloadKit\" class=\"btn-ghost\" onclick=\"downloadKit()\">Descargar<\/button>\r\n <button class=\"btn-ghost\" onclick=\"alert('Ver demo: Kit')\">Ver<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"soporte\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Soporte & contacto<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Utilice nuestros canales de soporte: sistema de tickets, banco de consultores y preguntas frecuentes (FAQ).<\/p>\r\n <div class=\"row g-4 mt-4\">\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-ticket-alt me-2\"><\/i> Sistema de tickets<\/h6>\r\n <p class=\"small text-muted\">Registre una solicitud formal. Recibir\u00e1 seguimiento por correo electr\u00f3nico.<\/p>\r\n <form id=\"ticketForm\">\r\n <input id=\"tName\" class=\"form-control form-control-sm mb-2\" placeholder=\"Nombre \/ Instituci\u00f3n\" required\/>\r\n <input id=\"tEmail\" class=\"form-control form-control-sm mb-2\" placeholder=\"Email\" required\/>\r\n <input id=\"tSubject\" class=\"form-control form-control-sm mb-2\" placeholder=\"Asunto\" required\/>\r\n <textarea id=\"tMessage\" class=\"form-control form-control-sm mb-3\" rows=\"2\" placeholder=\"Mensaje\" required><\/textarea>\r\n <div style=\"display:flex;gap:.5rem\"><button class=\"btn-main btn-sm\" type=\"submit\">Enviar ticket<\/button><button type=\"button\" class=\"btn-ghost btn-sm\" onclick=\"viewTickets()\">Ver Tickets<\/button><\/div>\r\n <\/form>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-users me-2\"><\/i> Banco de consultores <\/h6>\r\n <p class=\"small text-muted\">Expertos de las instituciones socias, clasificados por especialidad.<\/p>\r\n <div style=\"display:flex;flex-direction:column;gap:.2rem;margin-top:.8rem\">\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-user-graduate\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>M.A. Leonel Fuentes<\/strong><br\/><small class=\"text-muted\">Acad\u00e9mico\/Pedag\u00f3gico \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Leonel Fuentes \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-laptop-code\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>Ing. Jos\u00e9 Pablo Godoy<\/strong><br\/><small class=\"text-muted\">Tecnol\u00f3gico \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Jos\u00e9 Pablo Godoy \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n <div class=\"consultor-perfil\">\r\n <div class=\"consultor-icon\"><i class=\"fas fa-balance-scale\"><\/i><\/div>\r\n <div style=\"flex:1\"><strong>Lic. Carlos Pi\u00f1eiro<\/strong><br\/><small class=\"text-muted\">Normativo\/Legal \u2014 USAC<\/small><\/div>\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Contactar a Carlos Pi\u00f1eiro \u2014 demo')\">Perfil<\/button>\r\n <\/div>\r\n \r\n\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-lg-4 aos-init\" data-aos>\r\n <div class=\"resource-card h-100\">\r\n <h6 class=\"fw-bold\"><i class=\"fas fa-question-circle me-2\"><\/i> Preguntas Frecuentes (FAQ)<\/h6>\r\n \r\n <p class=\"small text-muted\">Respuestas r\u00e1pidas a las consultas m\u00e1s comunes:<\/p>\r\n <details><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfQu\u00e9 es una microcredencial?<\/summary><p class=\"small text-muted mt-2\">Peque\u00f1as certificaciones digitales, interoperables usando Open Badges y metadatos JSON-LD.<\/p><\/details>\r\n <details style=\"margin-top:.4rem\"><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfQui\u00e9nes son los consultores?<\/summary><p class=\"small text-muted mt-2\">Expertos (Acad\u00e9micos, Tecn\u00f3logos, Normativos y Gestores) de las instituciones socias del proyecto MOCHILA (ver banco de consultores).<\/p><\/details>\r\n <details style=\"margin-top:.4rem\"><summary style=\"font-weight:700;cursor:pointer\" class=\"small\">\u00bfC\u00f3mo se garantiza la validez de la microcredencial?<\/summary><p class=\"small text-muted mt-2\">Utilizamos el est\u00e1ndar Open Badges, un formato global y seguro para la certificaci\u00f3n de competencias.<\/p><\/details>\r\n \r\n <div class=\"d-grid gap-2 mt-3\">\r\n <button class=\"btn-ghost btn-sm\" onclick=\"alert('Abriendo archivo central de consultas (simulaci\u00f3n en la nube del proyecto)')\"><i class=\"fas fa-cloud-upload-alt\"><\/i> Archivo central de consultas<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n \r\n <section id=\"testimonios\" style=\"background:linear-gradient(180deg,#f7fbff,#fff)\">\r\n <div class=\"container-max\">\r\n <h2 class=\"aos-init\" data-aos>Testimonios de implementaci\u00f3n<\/h2>\r\n <p class=\"lead text-muted aos-init\" data-aos>Casos de \u00e9xito de instituciones de educaci\u00f3n superior que han implementado con \u00e9xito sus unidades de microcredenciales.<\/p>\r\n \r\n <div class=\"row g-4 mt-4\">\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"El plan de implementaci\u00f3n fue riguroso y nos permiti\u00f3 dise\u00f1ar una estrategia de microcredenciales alineada a nuestros estatutos acad\u00e9micos y t\u00e9cnicos.\"<\/blockquote>\r\n <footer>\r\n Dr. Juan P\u00e9rez\r\n <small>Universidad de San Carlos de Guatemala (USAC)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"La asesor\u00eda en la integraci\u00f3n de metadatos Open Badges fue clave. Pasamos de un concepto a una emisi\u00f3n formal en tiempo r\u00e9cord.\"<\/blockquote>\r\n <footer>\r\n Ing. Andrea Gonz\u00e1lez\r\n <small>Universidad de San Carlos de Guatemala (USAC)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"La gu\u00eda normativa nos ayud\u00f3 a crear un marco legal s\u00f3lido para la gobernanza y la emisi\u00f3n de nuestras certificaciones digitales, garantizando su validez.\"<\/blockquote>\r\n <footer>\r\n Abg. Mar\u00eda Rojas\r\n <small>Universidad Nacional Aut\u00f3noma de Honduras (UNAH)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"Gracias al diagn\u00f3stico inicial pudimos identificar r\u00e1pidamente las brechas tecnol\u00f3gicas, enfocando nuestros recursos de manera eficiente.\"<\/blockquote>\r\n <footer>\r\n Mgt. Ernesto Soto\r\n <small>Universidad de Educaci\u00f3n a Distancia de Costa Rica (UNED)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"col-md-6 col-lg-4 aos-init\" data-aos>\r\n <div class=\"testimonial-card h-100\">\r\n <blockquote>\"El acompa\u00f1amiento fue excelente. Nuestros consultores, incluyendo expertos de USAC e INTEC, brindaron una perspectiva regional invaluable.\"<\/blockquote>\r\n <footer>\r\n Lic. Sonia Vidal\r\n <small>Universidad de El Salvador (UES)<\/small>\r\n <\/footer>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n \r\n <\/div>\r\n <\/section>\r\n\r\n\r\n\r\n <button id=\"floatingChatButton\" aria-label=\"Abrir chat\" onclick=\"toggleChat()\"><i class=\"fas fa-comment-dots\"><\/i><\/button>\r\n\r\n <div id=\"floatingChatContainer\">\r\n <div class=\"chat-header\">\r\n <div><strong>Asistente Virtual MOCHILA<\/strong><br\/><small style=\"opacity:.95\">Respuestas autom\u00e1ticas - v5.0 Profesional<\/small><\/div>\r\n <button class=\"btn btn-sm btn-light\" onclick=\"clearChat()\" title=\"Limpiar chat\"><i class=\"fas fa-trash\"><\/i><\/button>\r\n <\/div>\r\n <div id=\"chatMessages\" class=\"chat-messages d-flex flex-column\" aria-live=\"polite\">\r\n <\/div>\r\n <div class=\"chat-input\">\r\n <input id=\"chatInput\" class=\"form-control form-control-sm\" placeholder=\"Escriba su consulta...\" aria-label=\"Mensaje\" onkeypress=\"handleChatKeyPress(event)\"\/>\r\n <button class=\"btn btn-primary btn-sm\" onclick=\"sendChat()\">Enviar<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"modal fade\" id=\"ticketsModal\" tabindex=\"-1\" aria-hidden=\"true\"><div class=\"modal-dialog modal-lg modal-dialog-centered\"><div class=\"modal-content\"><div class=\"modal-header\"><h5 class=\"modal-title\">Tickets guardados (local)<\/h5><button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"modal\" aria-label=\"Cerrar\"><\/button><\/div><div class=\"modal-body\"><div id=\"ticketsList\"><\/div><\/div><div class=\"modal-footer\"><button class=\"btn-ghost\" data-bs-dismiss=\"modal\">Cerrar<\/button><\/div><\/div><\/div><\/div>\r\n\r\n <script>\r\n \/* AOS-like init *\/\r\n (function(){const obs=new IntersectionObserver((entries)=>{entries.forEach((e)=>{if(e.isIntersecting) e.target.classList.add('aos-animate');});},{threshold:.15});document.querySelectorAll('[data-aos]').forEach((el,i)=>{el.classList.add('aos-init');el.style.transitionDelay=(i*60)+'ms';obs.observe(el);});})();\r\n \r\n \/* Solicitud form & resource gating (demo) *\/\r\n const storageKeyRequests='mochila_requests_v50';\r\n document.getElementById('solForm').addEventListener('submit', function(e){e.preventDefault();const inst=document.getElementById('fInst').value.trim();const pais=document.getElementById('fPais').value.trim();const email=document.getElementById('fEmail').value.trim();const desc=document.getElementById('fDesc').value.trim();if(!inst||!pais||!email){alert('Complete los campos requeridos.');return;}const arr=JSON.parse(localStorage.getItem(storageKeyRequests)||'[]');arr.push({institucion:inst,pais,correo:email,desc,fecha:new Date().toISOString()});localStorage.setItem(storageKeyRequests,JSON.stringify(arr));alert('Solicitud recibida (demo). Kit habilitado.');document.getElementById('btnDownloadKit').disabled=false;this.reset();});\r\n\r\n \/* Autodiagn\u00f3stico *\/\r\n const sPedR=document.getElementById('sPedR'), sTecR=document.getElementById('sTecR'), sNormR=document.getElementById('sNormR');\r\n const sPed=document.getElementById('sPed'), sTec=document.getElementById('sTec'), sNorm=document.getElementById('sNorm');\r\n [sPedR,sTecR,sNormR].forEach(i=>i.addEventListener('input',()=>{sPed.textContent=sPedR.value;sTec.textContent=sTecR.value;sNorm.textContent=sNormR.value;}));\r\n\r\n function generateReport(){const scores={Pedagogica:+sPedR.value,Tecnica:+sTecR.value,Normativa:+sNormR.value};const avg=Math.round((scores.Pedagogica+scores.Tecnica+scores.Normativa)\/3);const recs=[];if(scores.Tecnica<6) recs.push('- Priorizar integraci\u00f3n t\u00e9cnica y capacitaci\u00f3n TI.');if(scores.Normativa<6) recs.push('- Generar borrador de pol\u00edtica institucional.');if(scores.Pedagogica<6) recs.push('- Dise\u00f1ar 2 microcursos piloto con rubricas.');const txt=`Reporte demo \u2014 Madurez institucional\\n\\nPuntajes:\\n- Pedag\u00f3gica: ${scores.Pedagogica}\\n- T\u00e9cnica: ${scores.Tecnica}\\n- Normativa: ${scores.Normativa}\\n\\nMadurez promedio: ${avg}\/10\\n\\nRecomendaciones:\\n${recs.length?recs.join('\\n'):'- Todas las dimensiones >=6: avanzar a asesor\u00eda y piloto.'}\\n\\nEntregables sugeridos: reporte ejecutivo, plan 3 meses, kit de implementaci\u00f3n.`;document.getElementById('miniText').textContent=txt;document.getElementById('miniReport').style.display='block';document.getElementById('btnDownloadReport').style.display='inline-block';}\r\n document.getElementById('btnReport').addEventListener('click',generateReport);\r\n document.getElementById('btnClear').addEventListener('click',()=>{[sPedR,sTecR,sNormR].forEach(i=>i.value=5);sPed.textContent=sTec.textContent=sNorm.textContent='5';document.getElementById('miniReport').style.display='none';document.getElementById('btnDownloadReport').style.display='none';});\r\n document.getElementById('btnDownloadReport').addEventListener('click',()=>{const txt=document.getElementById('miniText').textContent;const blob=new Blob([txt],{type:'text\/plain;charset=utf-8'});const url=URL.createObjectURL(blob);const a=document.createElement('a');a.href=url;a.download='reporte_mochila_demo.txt';document.body.appendChild(a);a.click();a.remove();URL.revokeObjectURL(url);});\r\n\r\n \/* Asesor\u00eda modal content *\/\r\n function openAsesoriaModal(type){\r\n const title=document.getElementById('asesoriaModalTitle');\r\n const overview=document.getElementById('asesoriaOverviewContent');\r\n \r\n if(type==='pedagogica'){\r\n title.textContent='Asesor\u00eda Pedag\u00f3gica y Acad\u00e9mica \u2014 Detalle';\r\n overview.innerHTML=`<p class=\"small text-muted\"><strong>Fundamentos:<\/strong> Rutas de aprendizaje, criterios acad\u00e9micos y dise\u00f1o de microcredenciales con descriptores estandarizados.<\/p><ol class=\"small text-muted\"><li>Identificar competencias y resultados de aprendizaje.<\/li><li>Definir evidencia y criterios de evaluaci\u00f3n.<\/li><li>Dise\u00f1ar metadatos y arte de la credencial.<\/li><\/ol>`;\r\n }else if(type==='tecnica'){\r\n title.textContent='Asesor\u00eda T\u00e9cnica y Metadatos \u2014 Detalle';\r\n overview.innerHTML=`<p class=\"small text-muted\"><strong>Metadatos y Open Badges:<\/strong> JSON-LD templates, endpoints, pruebas QA y checklist de integraci\u00f3n.<\/p><ul class=\"small text-muted\"><li>Campos clave: id, title, description, criteria, issuer, issuanceDate, evidence.<\/li><li>Integraci\u00f3n con plataformas (LMS\/API).<\/li><\/ul>`;\r\n }else if(type==='normativa'){\r\n title.textContent='Asesor\u00eda administrativa';\r\n overview.innerHTML=`<ul class=\"small text-muted\"><li>Criterios para dise\u00f1o y emisi\u00f3n.<\/li><li>Revisi\u00f3n de marco legal institucional.<\/li><li>Desarrollo de pol\u00edtica de gobernanza.<\/li><\/ul>`;\r\n } else {\r\n return; \r\n }\r\n\r\n const modalEl=document.getElementById('asesoriaModal');\r\n const modal=new bootstrap.Modal(modalEl);\r\n modal.show();\r\n }\r\n\r\n \/* Resources (download demo) *\/\r\n function downloadKit(){const hasReq=JSON.parse(localStorage.getItem(storageKeyRequests)||'[]').length>0;if(!hasReq){alert('Env\u00eda primero una solicitud para habilitar el Kit (demo).');return;}const content='Kit de implementacion MOCHILA - demo\\n\\nIncluye: Guia, plantillas y ejemplos.';const blob=new Blob([content],{type:'text\/plain;charset=utf-8'});const url=URL.createObjectURL(blob);const a=document.createElement('a');a.href=url;a.download='kit_mochila_demo.txt';document.body.appendChild(a);a.click();a.remove();URL.revokeObjectURL(url);}\r\n\r\n \/* Tickets (local storage demo) *\/\r\n const ticketsKey='mochila_tickets_v50';\r\n document.getElementById('ticketForm').addEventListener('submit',function(e){e.preventDefault();const name=document.getElementById('tName').value.trim();const email=document.getElementById('tEmail').value.trim();const subject=document.getElementById('tSubject').value.trim();const message=document.getElementById('tMessage').value.trim();if(!name||!email||!subject||!message){alert('Complete todos los campos.');return;}const arr=JSON.parse(localStorage.getItem(ticketsKey)||'[]');arr.push({name,email,subject,message,fecha:new Date().toISOString(),status:'nuevo'});localStorage.setItem(ticketsKey,JSON.stringify(arr));alert('Ticket creado (demo).');this.reset();});\r\n function viewTickets(){const arr=JSON.parse(localStorage.getItem(ticketsKey)||'[]');const list=document.getElementById('ticketsList');list.innerHTML='';if(!arr.length){list.innerHTML='<p class=\"text-muted\">No hay tickets guardados.<\/p>';}else{arr.reverse().forEach(t=>{const el=document.createElement('div');el.className='p-2 mb-2 border rounded';el.innerHTML=`<div style=\"font-weight:800\">${escapeHtml(t.subject)}<\/div><div class=\"small text-muted\">${escapeHtml(t.name)} \u2014 ${new Date(t.fecha).toLocaleString()}<\/div><div style=\"margin-top:.4rem\">${escapeHtml(t.message)}<\/div>`;list.appendChild(el);});}const modal=new bootstrap.Modal(document.getElementById('ticketsModal'));modal.show();}\r\n\r\n \/* Chatbot Flotante Logic - Mensaje de bienvenida ajustado *\/\r\n const chatKey='mochila_chat_v50';\r\n const chatContainer = document.getElementById('floatingChatContainer');\r\n const chatMessagesEl = document.getElementById('chatMessages');\r\n const chatInputEl = document.getElementById('chatInput');\r\n\r\n function toggleChat(){\r\n chatContainer.style.display = chatContainer.style.display === 'flex' ? 'none' : 'flex';\r\n if (chatContainer.style.display === 'flex') {\r\n loadChat();\r\n chatInputEl.focus();\r\n }\r\n }\r\n\r\n function loadChat(){\r\n const arr=JSON.parse(localStorage.getItem(chatKey)||'[]');\r\n chatMessagesEl.innerHTML='';\r\n if (arr.length === 0) {\r\n \/\/ Mensaje profesional solicitado, sin negritas ni lista expl\u00edcita de palabras clave\r\n const welcomeMsg = 'Bienvenido. Soy MOCHILA Bot, su asistente virtual. Estamos aqu\u00ed para ofrecerle informaci\u00f3n sobre nuestro servicio de consultor\u00eda. Por favor, escriba su consulta.';\r\n appendMessage('bot', welcomeMsg, false); \r\n } else {\r\n arr.forEach(m => appendMessage(m.from, m.text, false));\r\n }\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n }\r\n\r\n function appendMessage(from, text, save=true) {\r\n if (save) saveMsg(from, text);\r\n \r\n const d = document.createElement('div');\r\n d.className = `msg ${from} d-flex flex-column`;\r\n \r\n const fromSpan = document.createElement('small');\r\n fromSpan.className = 'msg-from';\r\n fromSpan.textContent = from === 'user' ? 'Usted' : 'Asistente';\r\n \r\n const textDiv = document.createElement('div');\r\n textDiv.style.marginTop = '.25rem';\r\n textDiv.innerHTML = from === 'bot' ? text : escapeHtml(text); \r\n \r\n d.appendChild(fromSpan);\r\n d.appendChild(textDiv);\r\n \r\n chatMessagesEl.appendChild(d);\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n }\r\n \r\n function saveMsg(from, text){\r\n const arr=JSON.parse(localStorage.getItem(chatKey)||'[]');\r\n arr.push({from,text,t:new Date().toISOString()});\r\n localStorage.setItem(chatKey,JSON.stringify(arr));\r\n }\r\n\r\n function sendChat(){\r\n const txt=chatInputEl.value.trim();\r\n if(!txt)return;\r\n \r\n appendMessage('user', txt);\r\n chatInputEl.value='';\r\n \r\n \/\/ Agregar indicador de escritura\r\n const typingDiv = document.createElement('div');\r\n typingDiv.className = 'msg bot';\r\n typingDiv.innerHTML = '<small class=\"msg-from\">Asistente<\/small><div style=\"margin-top:.25rem\">Analizando consulta...<\/div>';\r\n chatMessagesEl.appendChild(typingDiv);\r\n chatMessagesEl.scrollTop = chatMessagesEl.scrollHeight;\r\n \r\n setTimeout(()=>{\r\n typingDiv.remove();\r\n const reply = autoReply(txt);\r\n appendMessage('bot', reply);\r\n }, 800 + Math.random() * 800); \r\n }\r\n \r\n function handleChatKeyPress(event) {\r\n if (event.key === 'Enter') {\r\n sendChat();\r\n event.preventDefault(); \r\n }\r\n }\r\n \r\n function autoReply(t){\r\n const s = t.toLowerCase();\r\n\r\n if (s.includes('diagnostico') || s.includes('madurez')) {\r\n return 'El proceso de Diagn\u00f3stico Inicial comienza con el env\u00edo de la Solicitud formal y la ejecuci\u00f3n del Autodiagn\u00f3stico de Madurez Institucional. Esto nos permite generar un Reporte Preliminar con recomendaciones espec\u00edficas para su implementaci\u00f3n.';\r\n }\r\n \r\n if (s.includes('asesoria') || s.includes('consultoria') || s.includes('acompa\u00f1amiento') || s.includes('plan')) {\r\n return 'La Asesor\u00eda Especializada se estructura en tres pilares: Pedag\u00f3gica, T\u00e9cnica y Normativa, culminando en un Plan de Implementaci\u00f3n Personalizado.';\r\n }\r\n \r\n if (s.includes('kit') || s.includes('recursos') || s.includes('plantillas')) {\r\n return 'El Kit de Implementaci\u00f3n (Gu\u00eda, plantillas, checklist) y otros recursos digitales se habilitan en la secci\u00f3n \"Recursos Digitales\" una vez que su instituci\u00f3n complete la Solicitud formal. Este kit es clave para la fase de Implementaci\u00f3n.';\r\n }\r\n \r\n if (s.includes('badge') || s.includes('microcredencial') || s.includes('open badge')) {\r\n return 'Las Microcredenciales son certificaciones digitales que siguen el est\u00e1ndar internacional Open Badges (JSON-LD), asegurando su interoperabilidad y validez. Nuestro servicio gu\u00eda en el dise\u00f1o y la emisi\u00f3n t\u00e9cnica conforme a este est\u00e1ndar.';\r\n }\r\n \r\n if (s.includes('normativa') || s.includes('legal') || s.includes('politicas')) {\r\n return 'La Asesor\u00eda Normativa y Legal aborda el marco regulatorio institucional, incluyendo el desarrollo de pol\u00edticas de emisi\u00f3n, protecci\u00f3n de datos y el modelo de gobernanza para las microcredenciales.';\r\n }\r\n \r\n if (s.includes('contacto') || s.includes('soporte')) {\r\n return 'Puede contactarnos a trav\u00e9s del Sistema de Tickets para solicitudes formales. Tambi\u00e9n puede consultar el Banco de Consultores para contactar a un experto espec\u00edfico.';\r\n }\r\n \r\n if (s.includes('socios') || s.includes('universidades') || s.includes('instituciones') || s.includes('aliados')) {\r\n return 'El proyecto MOCHILA cuenta con el respaldo de IES socias de alto prestigio en la regi\u00f3n LAC, cuyos expertos contribuyen a nuestro servicio de consultor\u00eda.';\r\n }\r\n \r\n if (s.includes('testimonios') || s.includes('exito')) {\r\n return 'Los testimonios de \u00e9xito, como los de UC3M, ITESM y UCHILE, demuestran la efectividad de nuestro plan de consultor\u00eda. Puede ver los casos completos al final de la p\u00e1gina.';\r\n }\r\n \r\n return 'Hemos recibido su consulta. Por favor, formule su pregunta en relaci\u00f3n a nuestras \u00e1reas de servicio para ofrecerle una respuesta precisa.';\r\n }\r\n \r\n function clearChat(){\r\n if(!confirm('\u00bfBorrar historial local del chat?'))return;\r\n localStorage.removeItem(chatKey);\r\n loadChat();\r\n }\r\n\r\n \/* Util *\/\r\n function escapeHtml(s){return String(s).replace(\/[&<>\"]\/g,m=>({'&':'&','<':'<','>':'>','\"':'"'}[m]));}\r\n\r\n \/* Init *\/\r\n document.addEventListener('DOMContentLoaded',()=>{\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(a=>a.addEventListener('click',e=>{e.preventDefault();const t=document.querySelector(a.getAttribute('href'));if(t)t.scrollIntoView({behavior:'smooth',block:'start'});}));\r\n if(!(JSON.parse(localStorage.getItem(storageKeyRequests)||'[]').length>0))document.getElementById('btnDownloadKit').disabled=true;\r\n });\r\n <\/script>\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.2\/dist\/js\/bootstrap.bundle.min.js\"><\/script>\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>MOCHILA \u2014 Servicio de Consultor\u00eda (v5.0 – Edici\u00f3n Profesional) MOCHILA Servicio de Consultor\u00eda \u2014 v5.0 Inicio Descripci\u00f3n Solicitud & Diagn\u00f3stico Asesor\u00eda Recursos Soporte Testimonios Servicio de consultor\u00eda \u2013 Proyecto MOCHILA \u2013 Instalaci\u00f3n de unidades para dise\u00f1o y emisi\u00f3n de microcredenciales en IES de LAC Descripci\u00f3n del proceso Sed ut perspiciatis unde omnis iste natus error …<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/virtual.usac.edu.gt\/diged\/mochila_demo\/\"> <span class=\"screen-reader-text\">mochila_demo<\/span> Read More »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","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":"","footnotes":""},"class_list":["post-22782","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/comments?post=22782"}],"version-history":[{"count":191,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782\/revisions"}],"predecessor-version":[{"id":22986,"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/pages\/22782\/revisions\/22986"}],"wp:attachment":[{"href":"https:\/\/virtual.usac.edu.gt\/diged\/wp-json\/wp\/v2\/media?parent=22782"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}