ABSYS \u00b7 Contacto \u00b7 Grupo de investigaci\u00f3n IA<\/title>\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/intl-tel-input\/17.0.8\/css\/intlTelInput.css\">\r\n <style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');\r\n\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* Ocultar t\u00edtulo por defecto de WordPress *\/\r\n .page .entry-title {\r\n display: none;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N PRINCIPAL (Fondo blanco)\r\n ========================= *\/\r\n .contact-page {\r\n position: relative;\r\n width: 100vw;\r\n left: 50%;\r\n margin-left: -50vw;\r\n overflow: hidden;\r\n background: \r\n radial-gradient(circle at top right, rgba(37, 99, 235, 0.03), transparent 40%),\r\n linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);\r\n padding: 100px 0 120px;\r\n }\r\n\r\n \/* Grid de fondo sutil *\/\r\n .contact-page::before {\r\n content: \"\";\r\n position: absolute;\r\n inset: 0;\r\n background-image:\r\n linear-gradient(rgba(0, 0, 0, 0.02) 1px, transparent 1px),\r\n linear-gradient(90deg, rgba(0, 0, 0, 0.02) 1px, transparent 1px);\r\n background-size: 42px 42px;\r\n opacity: 0.4;\r\n pointer-events: none;\r\n }\r\n\r\n \/* Glow decorativo *\/\r\n .contact-page::after {\r\n content: \"\";\r\n position: absolute;\r\n top: -220px;\r\n right: -220px;\r\n width: 560px;\r\n height: 560px;\r\n background: radial-gradient(circle, rgba(37, 99, 235, 0.12), transparent 70%);\r\n pointer-events: none;\r\n }\r\n\r\n \/* Canvas neural *\/\r\n #neuralCanvas {\r\n position: absolute;\r\n inset: 0;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0.16;\r\n pointer-events: none;\r\n }\r\n\r\n .contact-wrapper {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 1300px;\r\n margin: auto;\r\n padding: 0 40px;\r\n }\r\n\r\n \/* =========================\r\n HEADER\r\n ========================= *\/\r\n .contact-header {\r\n text-align: center;\r\n margin-bottom: 70px;\r\n }\r\n\r\n .contact-eyebrow {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: .82rem;\r\n font-weight: 700;\r\n letter-spacing: .18em;\r\n text-transform: uppercase;\r\n color: #2563eb;\r\n border-radius: 0;\r\n }\r\n\r\n .contact-eyebrow-dot {\r\n width: 8px;\r\n height: 8px;\r\n background: #2563eb;\r\n box-shadow: 0 0 18px rgba(37, 99, 235, 0.6);\r\n border-radius: 0;\r\n }\r\n\r\n .contact-title {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: clamp(3rem, 6vw, 5rem);\r\n line-height: 1.05;\r\n letter-spacing: -3px;\r\n font-weight: 800;\r\n color: #000000 !important;\r\n margin-bottom: 16px;\r\n }\r\n\r\n .contact-title span {\r\n color: #2563eb;\r\n }\r\n\r\n .contact-sub {\r\n max-width: 700px;\r\n margin: 0 auto;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.05rem;\r\n line-height: 1.8;\r\n color: #334155;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N 1: FORMULARIO + INFO\r\n ========================= *\/\r\n .section-form-info {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 40px;\r\n margin-bottom: 90px;\r\n }\r\n\r\n \/* Bloque A: Formulario *\/\r\n .form-block {\r\n background: #ffffff;\r\n border: 1px solid #e2e8f0;\r\n padding: 48px;\r\n box-shadow: 0 8px 20px -6px rgba(37, 99, 235, 0.80) !important;\r\n transition: box-shadow 0.3s ease;\r\n border-radius: 0;\r\n }\r\n\r\n .form-block h3 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.8rem;\r\n font-weight: 800;\r\n letter-spacing: -1px;\r\n color: #000000 !important;\r\n margin-bottom: 12px;\r\n }\r\n\r\n .form-block p {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n color: #475569;\r\n margin-bottom: 32px;\r\n line-height: 1.6;\r\n }\r\n\r\n .formulario-wp {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n }\r\n\r\n .form-row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 20px;\r\n }\r\n\r\n .form-field label {\r\n display: block;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.75rem;\r\n font-weight: 700;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n color: #1e293b;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .form-field input,\r\n .form-field textarea {\r\n width: 100%;\r\n padding: 14px 16px;\r\n border: 1px solid #e2e8f0;\r\n background: #ffffff;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.95rem;\r\n color: #1e293b !important; \/* Texto oscuro *\/\r\n background: #ffffff !important;\r\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\r\n border-radius: 0 !important;\r\n }\r\n\r\n .form-field textarea {\r\n min-height: 140px;\r\n resize: vertical;\r\n }\r\n\r\n \/* FOCUS: resalta el borde en azul el\u00e9ctrico con sombra suave *\/\r\n .form-field input:focus,\r\n .form-field textarea:focus {\r\n border-color: #2563eb !important;\r\n box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;\r\n outline: none;\r\n }\r\n\r\n .iti {\r\n width: 100%;\r\n }\r\n .iti input {\r\n width: 100%;\r\n }\r\n\r\n #btn-enviar {\r\n margin-top: 10px;\r\n width: 100%;\r\n padding: 16px;\r\n border: none;\r\n background: #2563eb;\r\n color: white;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.85rem;\r\n font-weight: 800;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n cursor: pointer;\r\n transition: background 0.25s ease, transform 0.2s ease;\r\n border-radius: 0;\r\n }\r\n\r\n #btn-enviar:hover {\r\n background: #1d4ed8;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* Bloque B: Informaci\u00f3n de contacto *\/\r\n .info-block {\r\n background: #ffffff;\r\n border: 1px solid #e2e8f0;\r\n padding: 48px;\r\n box-shadow: 0 8px 20px -6px rgba(37, 99, 235, 0.80) !important;\r\n border-radius: 0;\r\n }\r\n\r\n .info-block h3 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.8rem;\r\n font-weight: 800;\r\n letter-spacing: -1px;\r\n color: #000000 !important;\r\n margin-bottom: 28px;\r\n }\r\n\r\n .contact-info-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 28px;\r\n }\r\n\r\n .info-item {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 16px;\r\n }\r\n\r\n .info-icon {\r\n width: 48px;\r\n height: 48px;\r\n background: #f1f5f9;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #2563eb;\r\n font-size: 1.4rem;\r\n border-radius: 0;\r\n flex-shrink: 0;\r\n }\r\n\r\n .info-content h4 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1rem;\r\n font-weight: 700;\r\n color: #0f172a !important;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .info-content p {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n color: #475569;\r\n line-height: 1.5;\r\n font-size: 0.95rem;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N 2: IMAGEN + MAPA (con subt\u00edtulos y textos)\r\n ========================= *\/\r\n .section-media {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 40px;\r\n margin-top: 20px;\r\n }\r\n\r\n .media-col {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .media-subtitle {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.85rem;\r\n font-weight: 700;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n color: #2563eb;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .media-heading {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.6rem;\r\n font-weight: 700;\r\n letter-spacing: -0.5px;\r\n color: #000000;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-image {\r\n background: #f1f5f9;\r\n border: 1px solid #e2e8f0;\r\n overflow: hidden;\r\n min-height: 320px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-image img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n filter: grayscale(0.1);\r\n transition: transform 0.4s ease;\r\n }\r\n\r\n .media-image:hover img {\r\n transform: scale(1.02);\r\n }\r\n\r\n .media-caption {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.95rem;\r\n line-height: 1.6;\r\n color: #475569;\r\n }\r\n\r\n .media-map {\r\n border: 1px solid #e2e8f0;\r\n overflow: hidden;\r\n min-height: 320px;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-map iframe {\r\n width: 100%;\r\n height: 100%;\r\n border: none;\r\n display: block;\r\n }\r\n\r\n \/* =========================\r\n RESPONSIVE\r\n ========================= *\/\r\n @media (max-width: 1000px) {\r\n .section-form-info,\r\n .section-media {\r\n grid-template-columns: 1fr;\r\n gap: 30px;\r\n }\r\n .contact-wrapper {\r\n padding: 0 24px;\r\n }\r\n .form-block, .info-block {\r\n padding: 32px;\r\n }\r\n .form-row {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n @media (max-width: 640px) {\r\n .contact-page {\r\n padding: 70px 0;\r\n }\r\n .form-block, .info-block {\r\n padding: 24px;\r\n }\r\n .info-item {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n }\r\n .contact-title {\r\n letter-spacing: -2px;\r\n }\r\n .media-heading {\r\n font-size: 1.3rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"contact-page\">\r\n <canvas id=\"neuralCanvas\"><\/canvas>\r\n <div class=\"contact-wrapper\">\r\n\r\n \r\n <div class=\"contact-header\">\r\n <div class=\"contact-eyebrow\">\r\n <span class=\"contact-eyebrow-dot\"><\/span>\r\n CONTACTO \u00b7 ABSYS\r\n <\/div>\r\n <h1 class=\"contact-title\">\r\n Conecta con <span>ABSYS<\/span><br>Investigaci\u00f3n e innovaci\u00f3n\r\n <\/h1>\r\n <p class=\"contact-sub\">\r\n Colaboraciones, acceso a infraestructura, proyectos de IA y consultas acad\u00e9micas.\r\n Estamos en la Universidad Complutense de Madrid.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"section-form-info\">\r\n \r\n <div class=\"form-block\">\r\n <h3>Env\u00edanos un mensaje<\/h3>\r\n <p>Cu\u00e9ntanos tu proyecto o consulta. Te responderemos en menos de 48 horas.<\/p>\r\n <form id=\"contacto-wp\" class=\"formulario-wp\">\r\n <div class=\"form-row\">\r\n <div class=\"form-field\">\r\n <label for=\"nombre\">Nombre completo<\/label>\r\n <input type=\"text\" id=\"nombre\" placeholder=\"Tu nombre\" required>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"email\">Correo electr\u00f3nico<\/label>\r\n <input type=\"email\" id=\"email\" placeholder=\"tucorreo@ejemplo.com\" required>\r\n <\/div>\r\n <\/div>\r\n <div class=\"form-row\">\r\n <div class=\"form-field\">\r\n <label for=\"telefono\">Tel\u00e9fono<\/label>\r\n <input type=\"tel\" id=\"telefono\" placeholder=\"+34 612 345 678\" required>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"asunto\">Asunto<\/label>\r\n <input type=\"text\" id=\"asunto\" placeholder=\"Motivo del contacto\" required>\r\n <\/div>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"mensaje\">Mensaje<\/label>\r\n <textarea id=\"mensaje\" placeholder=\"Cu\u00e9ntanos tu propuesta o duda...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\" id=\"btn-enviar\">Enviar mensaje<\/button>\r\n <\/form>\r\n <\/div>\r\n\r\n \r\n <div class=\"info-block\">\r\n <h3>Informaci\u00f3n de contacto<\/h3>\r\n <div class=\"contact-info-list\">\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-map-marker-alt\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Ubicaci\u00f3n<\/h4>\r\n <p>Facultad de Inform\u00e1tica,<br>Universidad Complutense de Madrid<br>C\/ Profesor Jos\u00e9 Garc\u00eda Santesmases 9, 28040 Madrid<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-envelope\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Correo electr\u00f3nico<\/h4>\r\n <p>absys@ucm.es<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-phone-alt\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Tel\u00e9fono<\/h4>\r\n <p>+34 913 94 76 00 (ext. 1234)<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-clock\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Horario de oficina<\/h4>\r\n <p>Lunes a Viernes: 9:00 \u2013 18:00<br>Previa cita para visitas t\u00e9cnicas<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"section-media\">\r\n \r\n <div class=\"media-col\">\r\n <div class=\"media-subtitle\">Nuestra facultad<\/div>\r\n <div class=\"media-heading\">Vis\u00edtanos<\/div>\r\n <div class=\"media-image\">\r\n <img decoding=\"async\" src=\"http:\/\/absys.dacya.ucm.es\/wp-content\/uploads\/2026\/05\/facultad-jpg.jpg\" alt=\"Facultad de Inform\u00e1tica UCM\">\r\n <\/div>\r\n <div class=\"media-caption\">\r\n Nuestro trabajo se realiza en la Facultad de Inform\u00e1tica y cuenta con laboratorios inform\u00e1ticos avanzados y espacios de investigaci\u00f3n colaborativa.\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"media-col\">\r\n <div class=\"media-subtitle\">Encu\u00e9ntranos<\/div>\r\n <div class=\"media-heading\">C\u00f3mo llegar<\/div>\r\n <div class=\"media-map\">\r\n <iframe \r\n loading=\"lazy\"\r\n allowfullscreen\r\n referrerpolicy=\"no-referrer-when-downgrade\"\r\n src=\"https:\/\/www.google.com\/maps?q=40.4526,-3.7267&hl=es&z=16&output=embed\">\r\n <\/iframe>\r\n <\/div>\r\n \r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n<\/section>\r\n\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/intl-tel-input\/17.0.8\/js\/intlTelInput.min.js\"><\/script>\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\"><\/script>\r\n<script>\r\n document.addEventListener(\"DOMContentLoaded\", function() {\r\n \/\/ Inicializar tel\u00e9fono internacional\r\n const inputTel = document.querySelector(\"#telefono\");\r\n const form = document.querySelector(\"#contacto-wp\");\r\n \r\n if (inputTel && window.intlTelInput) {\r\n const iti = window.intlTelInput(inputTel, {\r\n initialCountry: \"auto\",\r\n geoIpLookup: callback => {\r\n fetch(\"https:\/\/ipapi.co\/json\")\r\n .then(res => res.json())\r\n .then(data => callback(data.country_code))\r\n .catch(() => callback(\"es\"));\r\n },\r\n utilsScript: \"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@23.0.10\/build\/js\/utils.js\",\r\n autoPlaceholder: false\r\n });\r\n\r\n \/\/ Validaci\u00f3n de caracteres para tel\u00e9fono\r\n inputTel.addEventListener(\"keydown\", function(e) {\r\n const key = e.key;\r\n if ([\"Backspace\",\"Delete\",\"Tab\",\"Escape\",\"Enter\",\"ArrowLeft\",\"ArrowRight\",\"ArrowUp\",\"ArrowDown\",\"Home\",\"End\"].includes(key)) return;\r\n if (e.ctrlKey || e.metaKey) return;\r\n if (!\/^[0-9+\\-() ]$\/.test(key)) e.preventDefault();\r\n });\r\n\r\n inputTel.addEventListener(\"paste\", function(e) {\r\n e.preventDefault();\r\n const pasted = (e.clipboardData || window.clipboardData).getData(\"text\");\r\n const filtered = pasted.replace(\/[^0-9+\\-() ]\/g, \"\");\r\n document.execCommand(\"insertText\", false, filtered);\r\n });\r\n\r\n inputTel.addEventListener(\"input\", function() {\r\n const cursorPos = inputTel.selectionStart;\r\n const before = inputTel.value;\r\n const after = before.replace(\/[^0-9+\\-() ]\/g, \"\");\r\n if (before !== after) {\r\n inputTel.value = after;\r\n inputTel.setSelectionRange(cursorPos - 1, cursorPos - 1);\r\n }\r\n });\r\n\r\n \/\/ Submit con validaci\u00f3n\r\n form.addEventListener(\"submit\", function(e) {\r\n e.preventDefault();\r\n if (iti.isValidNumber()) {\r\n const numero = iti.getNumber();\r\n alert(\"Mensaje enviado correctamente. N\u00famero verificado: \" + numero);\r\n \/\/ Aqu\u00ed se podr\u00eda agregar una petici\u00f3n AJAX real\r\n } else {\r\n alert(\"Por favor, introduzca un n\u00famero de tel\u00e9fono v\u00e1lido.\");\r\n }\r\n });\r\n }\r\n\r\n \/\/ Fondo neural (azul el\u00e9ctrico)\r\n const canvas = document.getElementById('neuralCanvas');\r\n if (canvas && window.gsap) {\r\n const ctx = canvas.getContext('2d');\r\n let width, height, nodes = [];\r\n \r\n function resizeCanvas() {\r\n width = canvas.offsetWidth;\r\n height = canvas.offsetHeight;\r\n canvas.width = width;\r\n canvas.height = height;\r\n }\r\n \r\n function createNodes() {\r\n nodes = [];\r\n for (let i = 0; i < 55; i++) {\r\n nodes.push({\r\n x: Math.random() * width,\r\n y: Math.random() * height,\r\n radius: Math.random() * 2.5 + 1.2\r\n });\r\n gsap.to(nodes[i], {\r\n x: `+=${gsap.utils.random(-100, 100)}`,\r\n y: `+=${gsap.utils.random(-100, 100)}`,\r\n duration: gsap.utils.random(10, 20),\r\n repeat: -1,\r\n yoyo: true,\r\n ease: \"sine.inOut\"\r\n });\r\n }\r\n }\r\n \r\n function draw() {\r\n if (!ctx) return;\r\n ctx.clearRect(0, 0, width, height);\r\n \/\/ Dibujar conexiones\r\n for (let i = 0; i < nodes.length; i++) {\r\n for (let j = i + 1; j < nodes.length; j++) {\r\n const dx = nodes[i].x - nodes[j].x;\r\n const dy = nodes[i].y - nodes[j].y;\r\n const dist = Math.sqrt(dx * dx + dy * dy);\r\n if (dist < 180) {\r\n ctx.strokeStyle = `rgba(37, 99, 235, ${(1 - dist \/ 180) * 0.25})`;\r\n ctx.lineWidth = 0.8;\r\n ctx.beginPath();\r\n ctx.moveTo(nodes[i].x, nodes[i].y);\r\n ctx.lineTo(nodes[j].x, nodes[j].y);\r\n ctx.stroke();\r\n }\r\n }\r\n \/\/ Dibujar nodos\r\n ctx.fillStyle = 'rgba(37, 99, 235, 0.45)';\r\n ctx.beginPath();\r\n ctx.arc(nodes[i].x, nodes[i].y, nodes[i].radius, 0, Math.PI * 2);\r\n ctx.fill();\r\n }\r\n }\r\n \r\n window.addEventListener('resize', () => {\r\n resizeCanvas();\r\n createNodes();\r\n });\r\n resizeCanvas();\r\n createNodes();\r\n gsap.ticker.add(draw);\r\n }\r\n });\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>ABSYS \u00b7 Contacto \u00b7 Grupo de investigaci\u00f3n IA CONTACTO \u00b7 ABSYS Conecta con ABSYSInvestigaci\u00f3n e innovaci\u00f3n Colaboraciones, acceso a infraestructura, proyectos de IA y consultas acad\u00e9micas. Estamos en la Universidad Complutense de Madrid. Env\u00edanos un mensaje Cu\u00e9ntanos tu proyecto o consulta. Te responderemos en menos de 48 horas. Nombre completo Correo electr\u00f3nico Tel\u00e9fono Asunto Mensaje…<\/p>\n<p class=\"more\"><a class=\"more-link\" href=\"http:\/\/absys.dacya.ucm.es\/?page_id=253\">Seguir leyendo <span class=\"screen-reader-text\">Contacto<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-253","page","type-page","status-publish","hentry","entry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=253"}],"version-history":[{"count":54,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253\/revisions"}],"predecessor-version":[{"id":1966,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253\/revisions\/1966"}],"wp:attachment":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n ABSYS \u00b7 Contacto \u00b7 Grupo de investigaci\u00f3n IA<\/title>\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/intl-tel-input\/17.0.8\/css\/intlTelInput.css\">\r\n <style>\r\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');\r\n\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* Ocultar t\u00edtulo por defecto de WordPress *\/\r\n .page .entry-title {\r\n display: none;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N PRINCIPAL (Fondo blanco)\r\n ========================= *\/\r\n .contact-page {\r\n position: relative;\r\n width: 100vw;\r\n left: 50%;\r\n margin-left: -50vw;\r\n overflow: hidden;\r\n background: \r\n radial-gradient(circle at top right, rgba(37, 99, 235, 0.03), transparent 40%),\r\n linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);\r\n padding: 100px 0 120px;\r\n }\r\n\r\n \/* Grid de fondo sutil *\/\r\n .contact-page::before {\r\n content: \"\";\r\n position: absolute;\r\n inset: 0;\r\n background-image:\r\n linear-gradient(rgba(0, 0, 0, 0.02) 1px, transparent 1px),\r\n linear-gradient(90deg, rgba(0, 0, 0, 0.02) 1px, transparent 1px);\r\n background-size: 42px 42px;\r\n opacity: 0.4;\r\n pointer-events: none;\r\n }\r\n\r\n \/* Glow decorativo *\/\r\n .contact-page::after {\r\n content: \"\";\r\n position: absolute;\r\n top: -220px;\r\n right: -220px;\r\n width: 560px;\r\n height: 560px;\r\n background: radial-gradient(circle, rgba(37, 99, 235, 0.12), transparent 70%);\r\n pointer-events: none;\r\n }\r\n\r\n \/* Canvas neural *\/\r\n #neuralCanvas {\r\n position: absolute;\r\n inset: 0;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0.16;\r\n pointer-events: none;\r\n }\r\n\r\n .contact-wrapper {\r\n position: relative;\r\n z-index: 2;\r\n max-width: 1300px;\r\n margin: auto;\r\n padding: 0 40px;\r\n }\r\n\r\n \/* =========================\r\n HEADER\r\n ========================= *\/\r\n .contact-header {\r\n text-align: center;\r\n margin-bottom: 70px;\r\n }\r\n\r\n .contact-eyebrow {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: .82rem;\r\n font-weight: 700;\r\n letter-spacing: .18em;\r\n text-transform: uppercase;\r\n color: #2563eb;\r\n border-radius: 0;\r\n }\r\n\r\n .contact-eyebrow-dot {\r\n width: 8px;\r\n height: 8px;\r\n background: #2563eb;\r\n box-shadow: 0 0 18px rgba(37, 99, 235, 0.6);\r\n border-radius: 0;\r\n }\r\n\r\n .contact-title {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: clamp(3rem, 6vw, 5rem);\r\n line-height: 1.05;\r\n letter-spacing: -3px;\r\n font-weight: 800;\r\n color: #000000 !important;\r\n margin-bottom: 16px;\r\n }\r\n\r\n .contact-title span {\r\n color: #2563eb;\r\n }\r\n\r\n .contact-sub {\r\n max-width: 700px;\r\n margin: 0 auto;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.05rem;\r\n line-height: 1.8;\r\n color: #334155;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N 1: FORMULARIO + INFO\r\n ========================= *\/\r\n .section-form-info {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 40px;\r\n margin-bottom: 90px;\r\n }\r\n\r\n \/* Bloque A: Formulario *\/\r\n .form-block {\r\n background: #ffffff;\r\n border: 1px solid #e2e8f0;\r\n padding: 48px;\r\n box-shadow: 0 8px 20px -6px rgba(37, 99, 235, 0.80) !important;\r\n transition: box-shadow 0.3s ease;\r\n border-radius: 0;\r\n }\r\n\r\n .form-block h3 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.8rem;\r\n font-weight: 800;\r\n letter-spacing: -1px;\r\n color: #000000 !important;\r\n margin-bottom: 12px;\r\n }\r\n\r\n .form-block p {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n color: #475569;\r\n margin-bottom: 32px;\r\n line-height: 1.6;\r\n }\r\n\r\n .formulario-wp {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n }\r\n\r\n .form-row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 20px;\r\n }\r\n\r\n .form-field label {\r\n display: block;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.75rem;\r\n font-weight: 700;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n color: #1e293b;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .form-field input,\r\n .form-field textarea {\r\n width: 100%;\r\n padding: 14px 16px;\r\n border: 1px solid #e2e8f0;\r\n background: #ffffff;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.95rem;\r\n color: #1e293b !important; \/* Texto oscuro *\/\r\n background: #ffffff !important;\r\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\r\n border-radius: 0 !important;\r\n }\r\n\r\n .form-field textarea {\r\n min-height: 140px;\r\n resize: vertical;\r\n }\r\n\r\n \/* FOCUS: resalta el borde en azul el\u00e9ctrico con sombra suave *\/\r\n .form-field input:focus,\r\n .form-field textarea:focus {\r\n border-color: #2563eb !important;\r\n box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;\r\n outline: none;\r\n }\r\n\r\n .iti {\r\n width: 100%;\r\n }\r\n .iti input {\r\n width: 100%;\r\n }\r\n\r\n #btn-enviar {\r\n margin-top: 10px;\r\n width: 100%;\r\n padding: 16px;\r\n border: none;\r\n background: #2563eb;\r\n color: white;\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.85rem;\r\n font-weight: 800;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n cursor: pointer;\r\n transition: background 0.25s ease, transform 0.2s ease;\r\n border-radius: 0;\r\n }\r\n\r\n #btn-enviar:hover {\r\n background: #1d4ed8;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* Bloque B: Informaci\u00f3n de contacto *\/\r\n .info-block {\r\n background: #ffffff;\r\n border: 1px solid #e2e8f0;\r\n padding: 48px;\r\n box-shadow: 0 8px 20px -6px rgba(37, 99, 235, 0.80) !important;\r\n border-radius: 0;\r\n }\r\n\r\n .info-block h3 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.8rem;\r\n font-weight: 800;\r\n letter-spacing: -1px;\r\n color: #000000 !important;\r\n margin-bottom: 28px;\r\n }\r\n\r\n .contact-info-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 28px;\r\n }\r\n\r\n .info-item {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 16px;\r\n }\r\n\r\n .info-icon {\r\n width: 48px;\r\n height: 48px;\r\n background: #f1f5f9;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #2563eb;\r\n font-size: 1.4rem;\r\n border-radius: 0;\r\n flex-shrink: 0;\r\n }\r\n\r\n .info-content h4 {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1rem;\r\n font-weight: 700;\r\n color: #0f172a !important;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .info-content p {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n color: #475569;\r\n line-height: 1.5;\r\n font-size: 0.95rem;\r\n }\r\n\r\n \/* =========================\r\n SECCI\u00d3N 2: IMAGEN + MAPA (con subt\u00edtulos y textos)\r\n ========================= *\/\r\n .section-media {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 40px;\r\n margin-top: 20px;\r\n }\r\n\r\n .media-col {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .media-subtitle {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.85rem;\r\n font-weight: 700;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n color: #2563eb;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .media-heading {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 1.6rem;\r\n font-weight: 700;\r\n letter-spacing: -0.5px;\r\n color: #000000;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-image {\r\n background: #f1f5f9;\r\n border: 1px solid #e2e8f0;\r\n overflow: hidden;\r\n min-height: 320px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-image img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n display: block;\r\n filter: grayscale(0.1);\r\n transition: transform 0.4s ease;\r\n }\r\n\r\n .media-image:hover img {\r\n transform: scale(1.02);\r\n }\r\n\r\n .media-caption {\r\n font-family: 'Plus Jakarta Sans', sans-serif;\r\n font-size: 0.95rem;\r\n line-height: 1.6;\r\n color: #475569;\r\n }\r\n\r\n .media-map {\r\n border: 1px solid #e2e8f0;\r\n overflow: hidden;\r\n min-height: 320px;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .media-map iframe {\r\n width: 100%;\r\n height: 100%;\r\n border: none;\r\n display: block;\r\n }\r\n\r\n \/* =========================\r\n RESPONSIVE\r\n ========================= *\/\r\n @media (max-width: 1000px) {\r\n .section-form-info,\r\n .section-media {\r\n grid-template-columns: 1fr;\r\n gap: 30px;\r\n }\r\n .contact-wrapper {\r\n padding: 0 24px;\r\n }\r\n .form-block, .info-block {\r\n padding: 32px;\r\n }\r\n .form-row {\r\n grid-template-columns: 1fr;\r\n }\r\n }\r\n\r\n @media (max-width: 640px) {\r\n .contact-page {\r\n padding: 70px 0;\r\n }\r\n .form-block, .info-block {\r\n padding: 24px;\r\n }\r\n .info-item {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n }\r\n .contact-title {\r\n letter-spacing: -2px;\r\n }\r\n .media-heading {\r\n font-size: 1.3rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"contact-page\">\r\n <canvas id=\"neuralCanvas\"><\/canvas>\r\n <div class=\"contact-wrapper\">\r\n\r\n \r\n <div class=\"contact-header\">\r\n <div class=\"contact-eyebrow\">\r\n <span class=\"contact-eyebrow-dot\"><\/span>\r\n CONTACTO \u00b7 ABSYS\r\n <\/div>\r\n <h1 class=\"contact-title\">\r\n Conecta con <span>ABSYS<\/span><br>Investigaci\u00f3n e innovaci\u00f3n\r\n <\/h1>\r\n <p class=\"contact-sub\">\r\n Colaboraciones, acceso a infraestructura, proyectos de IA y consultas acad\u00e9micas.\r\n Estamos en la Universidad Complutense de Madrid.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"section-form-info\">\r\n \r\n <div class=\"form-block\">\r\n <h3>Env\u00edanos un mensaje<\/h3>\r\n <p>Cu\u00e9ntanos tu proyecto o consulta. Te responderemos en menos de 48 horas.<\/p>\r\n <form id=\"contacto-wp\" class=\"formulario-wp\">\r\n <div class=\"form-row\">\r\n <div class=\"form-field\">\r\n <label for=\"nombre\">Nombre completo<\/label>\r\n <input type=\"text\" id=\"nombre\" placeholder=\"Tu nombre\" required>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"email\">Correo electr\u00f3nico<\/label>\r\n <input type=\"email\" id=\"email\" placeholder=\"tucorreo@ejemplo.com\" required>\r\n <\/div>\r\n <\/div>\r\n <div class=\"form-row\">\r\n <div class=\"form-field\">\r\n <label for=\"telefono\">Tel\u00e9fono<\/label>\r\n <input type=\"tel\" id=\"telefono\" placeholder=\"+34 612 345 678\" required>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"asunto\">Asunto<\/label>\r\n <input type=\"text\" id=\"asunto\" placeholder=\"Motivo del contacto\" required>\r\n <\/div>\r\n <\/div>\r\n <div class=\"form-field\">\r\n <label for=\"mensaje\">Mensaje<\/label>\r\n <textarea id=\"mensaje\" placeholder=\"Cu\u00e9ntanos tu propuesta o duda...\"><\/textarea>\r\n <\/div>\r\n <button type=\"submit\" id=\"btn-enviar\">Enviar mensaje<\/button>\r\n <\/form>\r\n <\/div>\r\n\r\n \r\n <div class=\"info-block\">\r\n <h3>Informaci\u00f3n de contacto<\/h3>\r\n <div class=\"contact-info-list\">\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-map-marker-alt\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Ubicaci\u00f3n<\/h4>\r\n <p>Facultad de Inform\u00e1tica,<br>Universidad Complutense de Madrid<br>C\/ Profesor Jos\u00e9 Garc\u00eda Santesmases 9, 28040 Madrid<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-envelope\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Correo electr\u00f3nico<\/h4>\r\n <p>absys@ucm.es<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-phone-alt\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Tel\u00e9fono<\/h4>\r\n <p>+34 913 94 76 00 (ext. 1234)<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\"><i class=\"fas fa-clock\"><\/i><\/div>\r\n <div class=\"info-content\">\r\n <h4>Horario de oficina<\/h4>\r\n <p>Lunes a Viernes: 9:00 \u2013 18:00<br>Previa cita para visitas t\u00e9cnicas<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"section-media\">\r\n \r\n <div class=\"media-col\">\r\n <div class=\"media-subtitle\">Nuestra facultad<\/div>\r\n <div class=\"media-heading\">Vis\u00edtanos<\/div>\r\n <div class=\"media-image\">\r\n <img decoding=\"async\" src=\"http:\/\/absys.dacya.ucm.es\/wp-content\/uploads\/2026\/05\/facultad-jpg.jpg\" alt=\"Facultad de Inform\u00e1tica UCM\">\r\n <\/div>\r\n <div class=\"media-caption\">\r\n Nuestro trabajo se realiza en la Facultad de Inform\u00e1tica y cuenta con laboratorios inform\u00e1ticos avanzados y espacios de investigaci\u00f3n colaborativa.\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"media-col\">\r\n <div class=\"media-subtitle\">Encu\u00e9ntranos<\/div>\r\n <div class=\"media-heading\">C\u00f3mo llegar<\/div>\r\n <div class=\"media-map\">\r\n <iframe \r\n loading=\"lazy\"\r\n allowfullscreen\r\n referrerpolicy=\"no-referrer-when-downgrade\"\r\n src=\"https:\/\/www.google.com\/maps?q=40.4526,-3.7267&hl=es&z=16&output=embed\">\r\n <\/iframe>\r\n <\/div>\r\n \r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n<\/section>\r\n\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/intl-tel-input\/17.0.8\/js\/intlTelInput.min.js\"><\/script>\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/gsap\/3.12.5\/gsap.min.js\"><\/script>\r\n<script>\r\n document.addEventListener(\"DOMContentLoaded\", function() {\r\n \/\/ Inicializar tel\u00e9fono internacional\r\n const inputTel = document.querySelector(\"#telefono\");\r\n const form = document.querySelector(\"#contacto-wp\");\r\n \r\n if (inputTel && window.intlTelInput) {\r\n const iti = window.intlTelInput(inputTel, {\r\n initialCountry: \"auto\",\r\n geoIpLookup: callback => {\r\n fetch(\"https:\/\/ipapi.co\/json\")\r\n .then(res => res.json())\r\n .then(data => callback(data.country_code))\r\n .catch(() => callback(\"es\"));\r\n },\r\n utilsScript: \"https:\/\/cdn.jsdelivr.net\/npm\/intl-tel-input@23.0.10\/build\/js\/utils.js\",\r\n autoPlaceholder: false\r\n });\r\n\r\n \/\/ Validaci\u00f3n de caracteres para tel\u00e9fono\r\n inputTel.addEventListener(\"keydown\", function(e) {\r\n const key = e.key;\r\n if ([\"Backspace\",\"Delete\",\"Tab\",\"Escape\",\"Enter\",\"ArrowLeft\",\"ArrowRight\",\"ArrowUp\",\"ArrowDown\",\"Home\",\"End\"].includes(key)) return;\r\n if (e.ctrlKey || e.metaKey) return;\r\n if (!\/^[0-9+\\-() ]$\/.test(key)) e.preventDefault();\r\n });\r\n\r\n inputTel.addEventListener(\"paste\", function(e) {\r\n e.preventDefault();\r\n const pasted = (e.clipboardData || window.clipboardData).getData(\"text\");\r\n const filtered = pasted.replace(\/[^0-9+\\-() ]\/g, \"\");\r\n document.execCommand(\"insertText\", false, filtered);\r\n });\r\n\r\n inputTel.addEventListener(\"input\", function() {\r\n const cursorPos = inputTel.selectionStart;\r\n const before = inputTel.value;\r\n const after = before.replace(\/[^0-9+\\-() ]\/g, \"\");\r\n if (before !== after) {\r\n inputTel.value = after;\r\n inputTel.setSelectionRange(cursorPos - 1, cursorPos - 1);\r\n }\r\n });\r\n\r\n \/\/ Submit con validaci\u00f3n\r\n form.addEventListener(\"submit\", function(e) {\r\n e.preventDefault();\r\n if (iti.isValidNumber()) {\r\n const numero = iti.getNumber();\r\n alert(\"Mensaje enviado correctamente. N\u00famero verificado: \" + numero);\r\n \/\/ Aqu\u00ed se podr\u00eda agregar una petici\u00f3n AJAX real\r\n } else {\r\n alert(\"Por favor, introduzca un n\u00famero de tel\u00e9fono v\u00e1lido.\");\r\n }\r\n });\r\n }\r\n\r\n \/\/ Fondo neural (azul el\u00e9ctrico)\r\n const canvas = document.getElementById('neuralCanvas');\r\n if (canvas && window.gsap) {\r\n const ctx = canvas.getContext('2d');\r\n let width, height, nodes = [];\r\n \r\n function resizeCanvas() {\r\n width = canvas.offsetWidth;\r\n height = canvas.offsetHeight;\r\n canvas.width = width;\r\n canvas.height = height;\r\n }\r\n \r\n function createNodes() {\r\n nodes = [];\r\n for (let i = 0; i < 55; i++) {\r\n nodes.push({\r\n x: Math.random() * width,\r\n y: Math.random() * height,\r\n radius: Math.random() * 2.5 + 1.2\r\n });\r\n gsap.to(nodes[i], {\r\n x: `+=${gsap.utils.random(-100, 100)}`,\r\n y: `+=${gsap.utils.random(-100, 100)}`,\r\n duration: gsap.utils.random(10, 20),\r\n repeat: -1,\r\n yoyo: true,\r\n ease: \"sine.inOut\"\r\n });\r\n }\r\n }\r\n \r\n function draw() {\r\n if (!ctx) return;\r\n ctx.clearRect(0, 0, width, height);\r\n \/\/ Dibujar conexiones\r\n for (let i = 0; i < nodes.length; i++) {\r\n for (let j = i + 1; j < nodes.length; j++) {\r\n const dx = nodes[i].x - nodes[j].x;\r\n const dy = nodes[i].y - nodes[j].y;\r\n const dist = Math.sqrt(dx * dx + dy * dy);\r\n if (dist < 180) {\r\n ctx.strokeStyle = `rgba(37, 99, 235, ${(1 - dist \/ 180) * 0.25})`;\r\n ctx.lineWidth = 0.8;\r\n ctx.beginPath();\r\n ctx.moveTo(nodes[i].x, nodes[i].y);\r\n ctx.lineTo(nodes[j].x, nodes[j].y);\r\n ctx.stroke();\r\n }\r\n }\r\n \/\/ Dibujar nodos\r\n ctx.fillStyle = 'rgba(37, 99, 235, 0.45)';\r\n ctx.beginPath();\r\n ctx.arc(nodes[i].x, nodes[i].y, nodes[i].radius, 0, Math.PI * 2);\r\n ctx.fill();\r\n }\r\n }\r\n \r\n window.addEventListener('resize', () => {\r\n resizeCanvas();\r\n createNodes();\r\n });\r\n resizeCanvas();\r\n createNodes();\r\n gsap.ticker.add(draw);\r\n }\r\n });\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>ABSYS \u00b7 Contacto \u00b7 Grupo de investigaci\u00f3n IA CONTACTO \u00b7 ABSYS Conecta con ABSYSInvestigaci\u00f3n e innovaci\u00f3n Colaboraciones, acceso a infraestructura, proyectos de IA y consultas acad\u00e9micas. Estamos en la Universidad Complutense de Madrid. Env\u00edanos un mensaje Cu\u00e9ntanos tu proyecto o consulta. Te responderemos en menos de 48 horas. Nombre completo Correo electr\u00f3nico Tel\u00e9fono Asunto Mensaje…<\/p>\n<p class=\"more\"><a class=\"more-link\" href=\"http:\/\/absys.dacya.ucm.es\/?page_id=253\">Seguir leyendo <span class=\"screen-reader-text\">Contacto<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-253","page","type-page","status-publish","hentry","entry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=253"}],"version-history":[{"count":54,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253\/revisions"}],"predecessor-version":[{"id":1966,"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=\/wp\/v2\/pages\/253\/revisions\/1966"}],"wp:attachment":[{"href":"http:\/\/absys.dacya.ucm.es\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}