Mapa de Proyectos en Europa<\/title>\n\n \n <link\n rel=\"stylesheet\"\n href=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.css\"\n integrity=\"sha256-p4NxAoJBhIIN+hmNHrzRCf9tD\/miZyoHS5obTRR9BMY=\"\n crossorigin=\"\"\n \/>\n\n <style>\n :root {\n --bg: #08111f;\n --panel: rgba(9, 20, 36, 0.92);\n --panel-2: rgba(12, 24, 42, 0.95);\n --stroke: rgba(255,255,255,0.08);\n --text: #f4f7fb;\n --muted: #b5c0cf;\n --accent: #d9ef1f;\n --accent-dark: #b4c910;\n --shadow: 0 20px 60px rgba(0,0,0,.32);\n --radius: 24px;\n }\n\n * {\n box-sizing: border-box;\n }\n\n body {\n margin: 0;\n font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n background: #f5f7fb;\n color: #111;\n }\n\n .projects-europe {\n width: 100%;\n padding: clamp(20px, 4vw, 48px);\n background:\n radial-gradient(circle at top left, rgba(62, 111, 255, 0.10), transparent 26%),\n radial-gradient(circle at bottom right, rgba(217,239,31,0.08), transparent 22%),\n linear-gradient(180deg, #07111f 0%, #0b1729 100%);\n border-radius: 28px;\n overflow: hidden;\n box-shadow: var(--shadow);\n color: var(--text);\n }\n\n .projects-europe__header {\n max-width: 840px;\n margin-bottom: 24px;\n }\n\n .projects-europe__eyebrow {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n margin-bottom: 14px;\n border-radius: 999px;\n background: rgba(217,239,31,0.10);\n border: 1px solid rgba(217,239,31,0.18);\n color: var(--accent);\n font-size: 12px;\n font-weight: 700;\n letter-spacing: .08em;\n text-transform: uppercase;\n }\n\n .projects-europe__title {\n margin: 0 0 10px;\n font-size: clamp(34px, 5vw, 60px);\n line-height: .96;\n letter-spacing: -0.04em;\n font-weight: 600;\n }\n\n .projects-europe__subtitle {\n margin: 0;\n color: var(--muted);\n font-size: clamp(15px, 2vw, 18px);\n line-height: 1.65;\n max-width: 760px;\n }\n\n .projects-europe__layout {\n display: grid;\n grid-template-columns: minmax(0, 1.55fr) minmax(320px, .75fr);\n gap: 22px;\n align-items: stretch;\n margin-top: 26px;\n }\n\n .projects-europe__map-wrap {\n position: relative;\n min-height: 650px;\n border-radius: var(--radius);\n overflow: hidden;\n border: 1px solid var(--stroke);\n background: #dfe8f0;\n box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);\n }\n\n #eu-map {\n width: 100%;\n height: 100%;\n min-height: 650px;\n z-index: 1;\n }\n\n .projects-europe__panel {\n display: flex;\n flex-direction: column;\n gap: 16px;\n min-height: 650px;\n }\n\n .project-card {\n background: var(--panel);\n border: 1px solid var(--stroke);\n border-radius: var(--radius);\n overflow: hidden;\n box-shadow: var(--shadow);\n backdrop-filter: blur(8px);\n }\n\n .project-card__image {\n width: 100%;\n aspect-ratio: 16 \/ 9;\n object-fit: cover;\n display: block;\n background: linear-gradient(135deg, #1a2b46, #102037);\n }\n\n .project-card__body {\n padding: 20px;\n }\n\n .project-card__status {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 12px;\n padding: 7px 10px;\n border-radius: 999px;\n background: rgba(217,239,31,0.10);\n border: 1px solid rgba(217,239,31,0.18);\n color: var(--accent);\n font-size: 12px;\n font-weight: 700;\n letter-spacing: .05em;\n text-transform: uppercase;\n }\n\n .project-card__title {\n margin: 0 0 8px;\n font-size: 28px;\n line-height: 1.02;\n letter-spacing: -0.03em;\n font-weight: 600;\n color: var(--text);\n }\n\n .project-card__country {\n margin: 0 0 12px;\n color: #d7dfea;\n font-size: 15px;\n font-weight: 500;\n }\n\n .project-card__desc {\n margin: 0 0 16px;\n color: var(--muted);\n font-size: 15px;\n line-height: 1.65;\n }\n\n .project-card__meta {\n display: grid;\n grid-template-columns: 1fr;\n gap: 10px;\n margin-top: 14px;\n }\n\n .project-card__meta-item {\n display: flex;\n justify-content: space-between;\n gap: 12px;\n padding: 10px 12px;\n border-radius: 14px;\n background: rgba(255,255,255,0.03);\n border: 1px solid rgba(255,255,255,0.05);\n }\n\n .project-card__meta-label {\n color: var(--muted);\n font-size: 13px;\n }\n\n .project-card__meta-value {\n color: var(--text);\n font-size: 13px;\n font-weight: 600;\n text-align: right;\n }\n\n .project-card__cta {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n margin-top: 18px;\n padding: 14px 16px;\n width: 100%;\n border-radius: 16px;\n background: var(--accent);\n color: #111;\n text-decoration: none;\n font-weight: 700;\n transition: .2s ease;\n }\n\n .project-card__cta:hover {\n background: #ecff56;\n transform: translateY(-1px);\n }\n\n .projects-europe__note {\n padding: 16px 18px;\n background: var(--panel-2);\n border: 1px solid var(--stroke);\n border-radius: 18px;\n color: var(--muted);\n font-size: 14px;\n line-height: 1.6;\n }\n\n .leaflet-control-attribution {\n font-size: 10px !important;\n }\n\n .country-tooltip {\n background: rgba(8, 17, 31, 0.95);\n color: #fff;\n border: 1px solid rgba(255,255,255,0.08);\n box-shadow: 0 12px 30px rgba(0,0,0,.28);\n border-radius: 12px;\n padding: 8px 10px;\n font-size: 12px;\n font-weight: 600;\n }\n\n .leaflet-popup-content-wrapper {\n border-radius: 16px;\n box-shadow: 0 18px 40px rgba(0,0,0,.2);\n }\n\n .leaflet-popup-content {\n margin: 14px 16px !important;\n min-width: 220px;\n }\n\n .popup-project {\n font-family: inherit;\n }\n\n .popup-project__title {\n margin: 0 0 6px;\n font-size: 16px;\n font-weight: 700;\n color: #111827;\n }\n\n .popup-project__text {\n margin: 0;\n font-size: 13px;\n line-height: 1.55;\n color: #5b6472;\n }\n\n .custom-project-marker {\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: var(--accent);\n border: 3px solid #ffffff;\n box-shadow: 0 0 0 8px rgba(217,239,31,0.16), 0 8px 24px rgba(0,0,0,.22);\n position: relative;\n }\n\n .custom-project-marker--empty {\n background: #0f203a;\n border: 2px solid var(--accent);\n box-shadow: 0 0 0 8px rgba(217,239,31,0.08);\n }\n\n .leaflet-div-icon {\n background: transparent;\n border: 0;\n }\n\n @media (max-width: 1100px) {\n .projects-europe__layout {\n grid-template-columns: 1fr;\n }\n\n .projects-europe__panel {\n min-height: unset;\n }\n\n .projects-europe__map-wrap,\n #eu-map {\n min-height: 540px;\n }\n }\n\n @media (max-width: 640px) {\n .projects-europe {\n padding: 18px;\n border-radius: 20px;\n }\n\n .projects-europe__map-wrap,\n #eu-map {\n min-height: 460px;\n border-radius: 18px;\n }\n\n .project-card__body {\n padding: 16px;\n }\n\n .project-card__title {\n font-size: 22px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n<section class=\"projects-europe\">\n <div class=\"projects-europe__header\">\n <span class=\"projects-europe__eyebrow\">Mapa de proyectos<\/span>\n <h2 class=\"projects-europe__title\">Europa como territorio de expansi\u00f3n<\/h2>\n <p class=\"projects-europe__subtitle\">\n Explore el mapa por pa\u00eds, visualice puntos de futuro desarrollo y prepare el espacio\n para proyectos reales con ficha, imagen y caracter\u00edsticas t\u00e9cnicas.\n <\/p>\n <\/div>\n\n <div class=\"projects-europe__layout\">\n <div class=\"projects-europe__map-wrap\">\n <div id=\"eu-map\"><\/div>\n <\/div>\n\n <aside class=\"projects-europe__panel\">\n <article class=\"project-card\" id=\"projectCard\">\n <img decoding=\"async\"\n id=\"projectImage\"\n class=\"project-card__image\"\n src=\"https:\/\/images.unsplash.com\/photo-1500382017468-9049fed747ef?auto=format&fit=crop&w=1200&q=80\"\n alt=\"Proyecto en Europa\"\n \/>\n\n <div class=\"project-card__body\">\n <span class=\"project-card__status\" id=\"projectStatus\">Disponible<\/span>\n <h3 class=\"project-card__title\" id=\"projectTitle\">Espacio listo para proyecto<\/h3>\n <p class=\"project-card__country\" id=\"projectCountry\">Europa<\/p>\n <p class=\"project-card__desc\" id=\"projectDesc\">\n Este mapa est\u00e1 preparado para mostrar proyectos activos, futuros desarrollos\n y fichas t\u00e9cnicas por pa\u00eds. Seleccione un punto del mapa para visualizar su contenido.\n <\/p>\n\n <div class=\"project-card__meta\">\n <div class=\"project-card__meta-item\">\n <span class=\"project-card__meta-label\">Tipo<\/span>\n <span class=\"project-card__meta-value\" id=\"projectType\">Pendiente<\/span>\n <\/div>\n <div class=\"project-card__meta-item\">\n <span class=\"project-card__meta-label\">Capacidad<\/span>\n <span class=\"project-card__meta-value\" id=\"projectCapacity\">\u2014<\/span>\n <\/div>\n <div class=\"project-card__meta-item\">\n <span class=\"project-card__meta-label\">Estado<\/span>\n <span class=\"project-card__meta-value\" id=\"projectPhase\">Sin definir<\/span>\n <\/div>\n <\/div>\n\n <a href=\"javascript:void(0)\" class=\"project-card__cta\" id=\"projectButton\">\n Ver ficha del proyecto\n <\/a>\n <\/div>\n <\/article>\n\n <div class=\"projects-europe__note\">\n Puede dejar puntos vac\u00edos como marcadores de expansi\u00f3n futura y luego reemplazarlos por proyectos reales con nombre, imagen, capacidad, fase y enlace interno. Menos improvisaci\u00f3n, m\u00e1s estructura.\n <\/div>\n <\/aside>\n <\/div>\n<\/section>\n\n<script\n src=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.js\"\n integrity=\"sha256-20nQCchB9co0qIjJZRGuk2\/Z9VM+kNiyxNV1lvTlZBo=\"\n crossorigin=\"\"\n><\/script>\n\n<script>\n \/\/ =========================\n \/\/ CONFIGURACI\u00d3N GENERAL\n \/\/ =========================\n const map = L.map('eu-map', {\n zoomControl: true,\n scrollWheelZoom: false\n }).setView([52.2, 13.5], 4);\n\n \/\/ Capa visual estilo limpio tipo Google Maps\n L.tileLayer('https:\/\/{s}.basemaps.cartocdn.com\/light_all\/{z}\/{x}\/{y}{r}.png', {\n subdomains: 'abcd',\n maxZoom: 19,\n attribution: '© OpenStreetMap © CARTO'\n }).addTo(map);\n\n \/\/ Lista de pa\u00edses europeos a resaltar\n const europeanCountries = [\n \"Spain\", \"Portugal\", \"France\", \"Germany\", \"Italy\", \"Belgium\", \"Netherlands\",\n \"Luxembourg\", \"Switzerland\", \"Austria\", \"Poland\", \"Romania\", \"Greece\",\n \"Czechia\", \"Czech Republic\", \"Hungary\", \"Slovakia\", \"Slovenia\", \"Croatia\",\n \"Bulgaria\", \"Denmark\", \"Ireland\", \"United Kingdom\", \"Norway\", \"Sweden\",\n \"Finland\", \"Estonia\", \"Latvia\", \"Lithuania\", \"Ukraine\", \"Belarus\",\n \"Serbia\", \"Bosnia and Herz.\", \"Bosnia and Herzegovina\", \"Montenegro\",\n \"Albania\", \"North Macedonia\", \"Moldova\", \"Iceland\"\n ];\n\n \/\/ Traducci\u00f3n de nombres al espa\u00f1ol\n const countryNamesES = {\n Spain: \"Espa\u00f1a\",\n Portugal: \"Portugal\",\n France: \"Francia\",\n Germany: \"Alemania\",\n Italy: \"Italia\",\n Belgium: \"B\u00e9lgica\",\n Netherlands: \"Pa\u00edses Bajos\",\n Luxembourg: \"Luxemburgo\",\n Switzerland: \"Suiza\",\n Austria: \"Austria\",\n Poland: \"Polonia\",\n Romania: \"Ruman\u00eda\",\n Greece: \"Grecia\",\n Czechia: \"Chequia\",\n \"Czech Republic\": \"Chequia\",\n Hungary: \"Hungr\u00eda\",\n Slovakia: \"Eslovaquia\",\n Slovenia: \"Eslovenia\",\n Croatia: \"Croacia\",\n Bulgaria: \"Bulgaria\",\n Denmark: \"Dinamarca\",\n Ireland: \"Irlanda\",\n \"United Kingdom\": \"Reino Unido\",\n Norway: \"Noruega\",\n Sweden: \"Suecia\",\n Finland: \"Finlandia\",\n Estonia: \"Estonia\",\n Latvia: \"Letonia\",\n Lithuania: \"Lituania\",\n Ukraine: \"Ucrania\",\n Belarus: \"Bielorrusia\",\n Serbia: \"Serbia\",\n \"Bosnia and Herz.\": \"Bosnia y Herzegovina\",\n \"Bosnia and Herzegovina\": \"Bosnia y Herzegovina\",\n Montenegro: \"Montenegro\",\n Albania: \"Albania\",\n \"North Macedonia\": \"Macedonia del Norte\",\n Moldova: \"Moldavia\",\n Iceland: \"Islandia\"\n };\n\n \/\/ Proyectos editables\n const projects = [\n {\n id: 1,\n name: \"Silo 130 metros cubicos\",\n country: \"Espa\u00f1a\",\n lat: 40.4168,\n lng: -3.7038,\n status: \"Espacio disponible\",\n phase: \"Pendiente\",\n type: \"Futura implementaci\u00f3n\",\n capacity: \"\u2014\",\n description: \"Ubicaci\u00f3n preparada para incorporar un futuro proyecto con ficha t\u00e9cnica, imagen y caracter\u00edsticas operativas.\",\n image: \"https:\/\/temp.agri-techsolutions.com\/wp-content\/uploads\/2026\/04\/ChatGPT-Image-5-abr-2026-09_56_17-p.m.png\",\n url: \"#\",\n empty: true\n },\n {\n id: 2,\n name: \"Proyecto silo\",\n country: \"Alemania\",\n lat: 52.5200,\n lng: 13.4050,\n status: \"Espacio disponible\",\n phase: \"Pendiente\",\n type: \"Futura implementaci\u00f3n\",\n capacity: \"\u2014\",\n description: \"Este punto est\u00e1 reservado para futuros desarrollos dentro del mapa de proyectos en Europa.\",\n image: \"https:\/\/temp.agri-techsolutions.com\/wp-content\/uploads\/2026\/04\/ChatGPT-Image-5-abr-2026-09_14_17-p.m.png\",\n url: \"#\",\n empty: true\n },\n {\n id: 3,\n name: \"Proyecto silo\",\n country: \"Polonia\",\n lat: 52.2297,\n lng: 21.0122,\n status: \"Espacio disponible\",\n phase: \"Pendiente\",\n type: \"Futura implementaci\u00f3n\",\n capacity: \"\u2014\",\n description: \"Punto de expansi\u00f3n listo para mostrar proyectos futuros con mayor detalle visual.\",\n image: \"https:\/\/temp.agri-techsolutions.com\/wp-content\/uploads\/2024\/07\/ChatGPT-Image-5-abr-2026-08_32_28-p.m.png\",\n url: \"#\",\n empty: true\n }\n ];\n\n \/\/ =========================\n \/\/ FICHA LATERAL\n \/\/ =========================\n const projectCard = {\n image: document.getElementById('projectImage'),\n status: document.getElementById('projectStatus'),\n title: document.getElementById('projectTitle'),\n country: document.getElementById('projectCountry'),\n desc: document.getElementById('projectDesc'),\n type: document.getElementById('projectType'),\n capacity: document.getElementById('projectCapacity'),\n phase: document.getElementById('projectPhase'),\n button: document.getElementById('projectButton')\n };\n\n function updateProjectCard(project) {\n projectCard.image.src = project.image;\n projectCard.image.alt = project.name;\n projectCard.status.textContent = project.status;\n projectCard.title.textContent = project.name;\n projectCard.country.textContent = project.country;\n projectCard.desc.textContent = project.description;\n projectCard.type.textContent = project.type;\n projectCard.capacity.textContent = project.capacity;\n projectCard.phase.textContent = project.phase;\n projectCard.button.href = project.url || '#';\n projectCard.button.textContent = project.empty ? 'Espacio reservado' : 'Ver ficha del proyecto';\n }\n if (projects.length > 0) {\n updateProjectCard(projects[0]);\n}\n\n \/\/ =========================\n \/\/ MARCADORES\n \/\/ =========================\n projects.forEach(project => {\n const markerClass = project.empty\n ? 'custom-project-marker custom-project-marker--empty'\n : 'custom-project-marker';\n\n const icon = L.divIcon({\n className: '',\n html: `<div class=\"${markerClass}\"><\/div>`,\n iconSize: [22, 22],\n iconAnchor: [11, 11],\n popupAnchor: [0, -10]\n });\n\n const marker = L.marker([project.lat, project.lng], { icon }).addTo(map);\n\n marker.bindPopup(`\n <div class=\"popup-project\">\n <h4 class=\"popup-project__title\">${project.name}<\/h4>\n <p class=\"popup-project__text\">${project.country} \u00b7 ${project.status}<\/p>\n <\/div>\n `);\n\n marker.on('click', () => {\n updateProjectCard(project);\n });\n });\n\n \/\/ =========================\n \/\/ PA\u00cdSES CON HOVER\n \/\/ =========================\n const countryStyle = {\n color: '#5c708d',\n weight: 1.2,\n fillColor: '#b6c4d6',\n fillOpacity: 0.10\n };\n\n const countryHoverStyle = {\n color: '#d9ef1f',\n weight: 2,\n fillColor: '#d9ef1f',\n fillOpacity: 0.18\n };\n\n const geojsonUrl = 'https:\/\/raw.githubusercontent.com\/datasets\/geo-countries\/master\/data\/countries.geojson';\n\n fetch(geojsonUrl)\n .then(response => response.json())\n .then(data => {\n const filtered = {\n type: 'FeatureCollection',\n features: data.features.filter(feature => {\n const name = feature.properties.ADMIN || feature.properties.name;\n return europeanCountries.includes(name);\n })\n };\n\n L.geoJSON(filtered, {\n style: countryStyle,\n onEachFeature: function(feature, layer) {\n const rawName = feature.properties.ADMIN || feature.properties.name;\n const countryName = countryNamesES[rawName] || rawName;\n\n layer.bindTooltip(countryName, {\n permanent: false,\n direction: 'top',\n className: 'country-tooltip',\n sticky: true\n });\n\n layer.on({\n mouseover: function() {\n layer.setStyle(countryHoverStyle);\n layer.bringToFront();\n },\n mouseout: function() {\n layer.setStyle(countryStyle);\n },\n click: function() {\n map.fitBounds(layer.getBounds(), {\n padding: [40, 40]\n });\n }\n });\n }\n }).addTo(map);\n })\n .catch(error => {\n console.error('Error cargando GeoJSON:', error);\n });\n<\/script>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\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>Visualiza nuestros proyectos destacados Mapa de Proyectos en Europa Mapa de proyectos Europa como territorio de expansi\u00f3n Explore el mapa por pa\u00eds, visualice puntos de futuro desarrollo y prepare el espacio para proyectos reales con ficha, imagen y caracter\u00edsticas t\u00e9cnicas. Disponible Espacio listo para proyecto Europa Este mapa est\u00e1 preparado para mostrar proyectos activos, futuros desarrollos y fichas t\u00e9cnicas por pa\u00eds. Seleccione un punto del mapa para visualizar su contenido. Tipo Pendiente Capacidad \u2014 Estado Sin definir Ver ficha del proyecto Puede dejar puntos vac\u00edos como marcadores de expansi\u00f3n futura y luego reemplazarlos por proyectos reales con nombre, imagen, capacidad, fase y enlace interno. Menos improvisaci\u00f3n, m\u00e1s estructura.<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-456","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/pages\/456","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/comments?post=456"}],"version-history":[{"count":25,"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/pages\/456\/revisions"}],"predecessor-version":[{"id":2377,"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/pages\/456\/revisions\/2377"}],"wp:attachment":[{"href":"https:\/\/euagtech.com\/tk\/wp-json\/wp\/v2\/media?parent=456"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}