{"id":1444,"date":"2025-09-10T11:05:06","date_gmt":"2025-09-10T11:05:06","guid":{"rendered":"https:\/\/attrium.asesoramientocomercial.com\/?page_id=1444"},"modified":"2025-09-10T11:05:06","modified_gmt":"2025-09-10T11:05:06","slug":"1444-2","status":"publish","type":"page","link":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/","title":{"rendered":""},"content":{"rendered":"<p><!DOCTYPE html><br \/>\n<html lang=\"es\"><br \/>\n<head><br \/>\n    <meta charset=\"UTF-8\"><br \/>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><br \/>\n    <title>Generador de Conceptos IA para Hoteles v2.0<\/title><br \/>\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n<style>\n        body {\n            font-family: 'Inter', sans-serif;\n            background-color: #111827; \/* bg-gray-900 *\/\n        }\n        .glass-pane {\n            background: rgba(31, 41, 55, 0.6); \/* bg-gray-800 with opacity *\/\n            backdrop-filter: blur(10px);\n            border: 1px solid rgba(255, 255, 255, 0.1);\n        }\n        .control-label { color: #9CA3AF; \/* text-gray-400 *\/ }\n        .control-input, .control-select {\n            background-color: #374151; \/* bg-gray-700 *\/\n            color: #F9FAFB; \/* text-gray-50 *\/\n            border: 1px solid #4B5563; \/* border-gray-600 *\/\n        }\n        .control-input:focus, .control-select:focus {\n            outline: none;\n            border-color: #2563EB; \/* border-blue-600 *\/\n            box-shadow: 0 0 0 2px #1E40AF; \/* ring-blue-700 *\/\n        }\n        .gradient-text {\n            background: linear-gradient(90deg, #38BDF8, #A78BFA);\n            -webkit-background-clip: text;\n            -webkit-text-fill-color: transparent;\n        }\n        .generate-button {\n            background: linear-gradient(90deg, #1D4ED8, #6D28D9);\n            transition: all 0.3s ease;\n            box-shadow: 0 0 15px rgba(99, 102, 241, 0.5);\n        }\n        .generate-button:hover {\n            transform: translateY(-2px);\n            box-shadow: 0 0 25px rgba(99, 102, 241, 0.8);\n        }\n        .color-palette { cursor: pointer; border: 2px solid transparent; transition: border-color 0.2s ease; }\n        .color-palette.selected { border-color: #38BDF8; \/* sky-400 *\/ }\n        .dashboard-card {\n            border: 1px solid rgba(255, 255, 255, 0.1);\n            transition: transform 0.3s ease, box-shadow 0.3s ease;\n        }\n        .dashboard-tab {\n            cursor: pointer;\n            padding: 8px 12px;\n            border-bottom: 2px solid transparent;\n            transition: all 0.2s ease-in-out;\n        }\n        .dashboard-tab.active {\n            color: #38BDF8;\n            border-bottom-color: #38BDF8;\n        }\n        .kpi-gauge {\n            position: relative;\n            width: 100px;\n            height: 50px;\n            overflow: hidden;\n        }\n        .kpi-gauge-bg, .kpi-gauge-fill {\n            position: absolute;\n            top: 0; left: 0; width: 100px; height: 100px;\n            border-radius: 50%;\n            border: 10px solid;\n            box-sizing: border-box;\n        }\n        .kpi-gauge-bg { border-color: #374151; }\n        .kpi-gauge-fill {\n            border-color: #38BDF8;\n            clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);\n            transform-origin: center;\n        }\n        ::-webkit-scrollbar { width: 8px; }\n        ::-webkit-scrollbar-track { background: #1F2937; }\n        ::-webkit-scrollbar-thumb { background: #4B5563; border-radius: 4px; }\n        ::-webkit-scrollbar-thumb:hover { background: #6B7280; }\n    <\/style>\n<p><\/head><br \/>\n<body class=\"text-gray-200\"><\/p>\n<div class=\"min-h-screen flex flex-col lg:flex-row\">\n        <!-- Controls Pane --><\/p>\n<aside class=\"w-full lg:w-1\/3 xl:w-1\/4 p-6 lg:p-8 glass-pane lg:min-h-screen lg:overflow-y-auto\">\n<div class=\"flex items-center mb-6\">\n                <svg class=\"w-8 h-8 text-sky-400 mr-3\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z\"><\/path><\/svg><\/p>\n<h1 class=\"text-2xl font-bold text-white\">Concept<span class=\"gradient-text\">AI 2.0<\/span><\/h1>\n<\/p><\/div>\n<p class=\"text-gray-400 mb-8\">La plataforma definitiva para conceptualizar, analizar y vender proyectos de interiorismo hotelero.<\/p>\n<div class=\"glass-pane p-4 rounded-lg mb-8\">\n<h3 class=\"font-semibold text-white mb-2 flex items-center\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-5 w-5 mr-2\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fill-rule=\"evenodd\" d=\"M11.3 1.046A1 1 0 0112 2v5h4a1 1 0 01.82 1.573l-7 10A1 1 0 018 18v-5H4a1 1 0 01-.82-1.573l7-10a1 1 0 011.12-.38z\" clip-rule=\"evenodd\" \/><\/svg>Nuestra Tecnolog\u00eda<\/h3>\n<p class=\"text-xs text-gray-400\">Fusionamos modelos de difusi\u00f3n de im\u00e1genes con LLMs especializados en arquitectura y negocio, entrenados con datasets propietarios. Esto nos permite generar no solo visuales impactantes, sino tambi\u00e9n an\u00e1lisis de viabilidad comercial para cada concepto.<\/p>\n<\/p><\/div>\n<div class=\"space-y-5\">\n<div>\n                    <label for=\"roomType\" class=\"block text-sm font-medium control-label mb-1\">Tipo de Espacio<\/label><br \/>\n                    <select id=\"roomType\" class=\"w-full control-select rounded-md\"><option>Suite Presidencial<\/option><option>Habitaci\u00f3n Doble Deluxe<\/option><option>Lobby \/ Recepci\u00f3n<\/option><option>Restaurante de autor<\/option><option>Bar en la azotea (Rooftop)<\/option><option>Gimnasio y zona de bienestar<\/option><option>Spa de lujo<\/option><option>Piscina interior<\/option><option>Sala de Conferencias modular<\/option><option>Biblioteca \/ Espacio de coworking<\/option><\/select>\n                <\/div>\n<div>\n                    <label for=\"hotelType\" class=\"block text-sm font-medium control-label mb-1\">Tipo de Hotel<\/label><br \/>\n                    <select id=\"hotelType\" class=\"w-full control-select rounded-md\"><option>Urbano de Lujo<\/option><option>Resort de Playa Exclusivo<\/option><option>Hotel Boutique con encanto<\/option><option>Eco-Lodge Sostenible<\/option><option>Business &#038; Convention Center<\/option><option>Hotel Hist\u00f3rico \/ Palacio<\/option><option>Apartahotel de dise\u00f1o<\/option><\/select>\n                <\/div>\n<div>\n                    <label for=\"styleType\" class=\"block text-sm font-medium control-label mb-1\">Estilo Decorativo<\/label><br \/>\n                    <select id=\"styleType\" class=\"w-full control-select rounded-md\"><option>Minimalismo Org\u00e1nico<\/option><option>Brutalismo Sofisticado<\/option><option>Art D\u00e9co Futurista<\/option><option>Japandi (Japon\u00e9s-Escandinavo)<\/option><option>Wabi-Sabi de Lujo<\/option><option>Neo-Mediterr\u00e1neo<\/option><option>Industrial Chic<\/option><option>Maximalismo Curado<\/option><\/select>\n                <\/div>\n<div>\n                    <label for=\"imageType\" class=\"block text-sm font-medium control-label mb-1\">Tipo de Imagen<\/label><br \/>\n                    <select id=\"imageType\" class=\"w-full control-select rounded-md\"><option value=\"Fotograf\u00eda Hiperrealista\">Fotograf\u00eda Hiperrealista<\/option><option value=\"Render arquitect\u00f3nico 3D\">Render Arquitect\u00f3nico<\/option><option value=\"Boceto art\u00edstico conceptual\">Boceto Art\u00edstico<\/option><option value=\"Publicaci\u00f3n para Instagram\">Post para Redes Sociales<\/option><option value=\"Plano de distribuci\u00f3n 2D, estilo blueprint, anotado\">Plano de Distribuci\u00f3n<\/option><\/select>\n                <\/div>\n<div>\n                    <label for=\"lighting\" class=\"block text-sm font-medium control-label mb-1\">Iluminaci\u00f3n<\/label><br \/>\n                    <select id=\"lighting\" class=\"w-full control-select rounded-md\"><option>Luz diurna natural y brillante<\/option><option>Luz dorada del atardecer<\/option><option>Iluminaci\u00f3n nocturna, \u00edntima y ambiental<\/option><option>Iluminaci\u00f3n de estudio, dram\u00e1tica<\/option><option>Luces de ne\u00f3n art\u00edsticas<\/option><\/select>\n                <\/div>\n<div>\n                    <label for=\"attributes\" class=\"block text-sm font-medium control-label mb-1\">Atributos Clave (ej: sostenible, tecnol\u00f3gico)<\/label><br \/>\n                    <input type=\"text\" id=\"attributes\" class=\"w-full control-input rounded-md\" placeholder=\"sostenible, tecnol\u00f3gico, lujo silencioso...\">\n                <\/div>\n<div>\n                    <label class=\"block text-sm font-medium control-label mb-2\">Paleta de Colores<\/label><\/p>\n<div id=\"colorPalettes\" class=\"grid grid-cols-3 gap-3\">\n<div class=\"color-palette rounded-lg p-2 text-center text-xs selected\" data-value=\"Oasis Des\u00e9rtico (terracotas, beiges, verde oliva)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #D2B48C;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #F5DEB3;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #808000;\"><\/span><\/div>\n<p><span>Oasis<\/span><\/div>\n<div class=\"color-palette rounded-lg p-2 text-center text-xs\" data-value=\"Ne\u00f3n Urbano (negros, grises, acentos de fucsia y cian)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #333333;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #FF00FF;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #00FFFF;\"><\/span><\/div>\n<p><span>Ne\u00f3n<\/span><\/div>\n<div class=\"color-palette rounded-lg p-2 text-center text-xs\" data-value=\"Costa Serena (blancos, azules, maderas claras)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #F0F8FF;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #87CEEB;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #DEB887;\"><\/span><\/div>\n<p><span>Costa<\/span><\/div>\n<div class=\"color-palette rounded-lg p-2 text-center text-xs\" data-value=\"Bosque Encantado (verdes profundos, marrones, toques dorados)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #006400;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #8B4513;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #FFD700;\"><\/span><\/div>\n<p><span>Bosque<\/span><\/div>\n<div class=\"color-palette rounded-lg p-2 text-center text-xs\" data-value=\"Lujo Volc\u00e1nico (negro, gris marengo, rojo lava)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #1C1C1C;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #464646;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #CF1020;\"><\/span><\/div>\n<p><span>Volc\u00e1n<\/span><\/div>\n<div class=\"color-palette rounded-lg p-2 text-center text-xs\" data-value=\"Pastel Pop (rosa milenial, menta, lila)\">\n<div class=\"flex justify-center space-x-1 mb-1\"><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #FADADD;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #BEE7B8;\"><\/span><span class=\"h-4 w-4 rounded-full\" style=\"background-color: #C8A2C8;\"><\/span><\/div>\n<p><span>Pop<\/span><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<div>\n                    <label for=\"numResults\" class=\"block text-sm font-medium control-label mb-1\">N\u00famero de Conceptos (1-4)<\/label><br \/>\n                    <input type=\"range\" id=\"numResults\" min=\"1\" max=\"4\" value=\"1\" class=\"w-full h-2 bg-gray-700 rounded-lg appearance-none cursor-pointer\">\n                <\/div>\n<\/p><\/div>\n<div class=\"mt-10\">\n                <button id=\"generateButton\" class=\"w-full generate-button text-white font-bold py-3 px-4 rounded-lg flex items-center justify-center\"><svg class=\"w-5 h-5 mr-2 animate-pulse\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M13 10V3L4 14h7v7l9-11h-7z\"><\/path><\/svg>Generar Conceptos<\/button>\n            <\/div>\n<\/aside>\n<p>        <main class=\"w-full lg:w-2\/3 xl:w-3\/4 p-6 lg:p-8 overflow-y-auto\"><\/p>\n<div id=\"resultsContainer\" class=\"h-full\">\n<div id=\"initialState\" class=\"h-full flex flex-col items-center justify-center text-center\"><svg class=\"w-24 h-24 text-gray-700 mb-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1\" d=\"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z\"><\/path><\/svg><\/p>\n<h2 class=\"text-2xl font-bold text-white\">Tus conceptos aparecer\u00e1n aqu\u00ed<\/h2>\n<p class=\"text-gray-500 mt-2 max-w-md\">Utiliza el panel de la izquierda para configurar los par\u00e1metros de dise\u00f1o y pulsa \u00abGenerar Conceptos\u00bb para iniciar la magia.<\/p>\n<\/div>\n<div id=\"loadingState\" class=\"hidden h-full flex flex-col items-center justify-center text-center\">\n<div class=\"relative w-24 h-24\">\n<div class=\"absolute inset-0 border-4 border-t-transparent border-sky-500 rounded-full animate-spin\"><\/div>\n<div class=\"absolute inset-2 border-4 border-t-transparent border-purple-500 rounded-full animate-spin [animation-direction:reverse]\"><\/div>\n<\/div>\n<h2 class=\"text-2xl font-bold text-white mt-6\">Generando&#8230;<\/h2>\n<p class=\"text-gray-500 mt-2 max-w-md\">Nuestra IA est\u00e1 dise\u00f1ando. Este proceso puede tardar unos segundos.<\/p>\n<\/div>\n<div id=\"resultsGrid\" class=\"hidden grid grid-cols-1 xl:grid-cols-2 gap-6 lg:gap-8\"><\/div>\n<\/p><\/div>\n<p>        <\/main>\n    <\/div>\n<p><script>\n    const generateButton = document.getElementById('generateButton');\n    const resultsContainer = document.getElementById('resultsContainer');\n    const initialState = document.getElementById('initialState');\n    const loadingState = document.getElementById('loadingState');\n    const resultsGrid = document.getElementById('resultsGrid');<\/p>\n<p>    \/\/ Controls\n    const roomTypeSelect = document.getElementById('roomType');\n    const hotelTypeSelect = document.getElementById('hotelType');\n    const styleTypeSelect = document.getElementById('styleType');\n    const imageTypeSelect = document.getElementById('imageType');\n    const lightingSelect = document.getElementById('lighting');\n    const attributesInput = document.getElementById('attributes');\n    const numResultsInput = document.getElementById('numResults');\n    const colorPalettesContainer = document.getElementById('colorPalettes');<\/p>\n<p>    colorPalettesContainer.addEventListener('click', (e) => {\n        const targetPalette = e.target.closest('.color-palette');\n        if (!targetPalette) return;\n        colorPalettesContainer.querySelectorAll('.color-palette').forEach(p => p.classList.remove('selected'));\n        targetPalette.classList.add('selected');\n    });<\/p>\n<p>    const createDashboardCard = (id) => {\n        const card = document.createElement('div');\n        card.className = 'glass-pane rounded-xl overflow-hidden dashboard-card';\n        card.innerHTML = `<\/p>\n<div id=\"image-container-${id}\" class=\"bg-gray-800 aspect-video flex items-center justify-center text-gray-500\">Cargando visualizaci\u00f3n...<\/div>\n<div class=\"p-4\">\n<div class=\"flex border-b border-gray-700 text-sm text-gray-400\">\n<div class=\"dashboard-tab active\" data-tab=\"desc\" data-target=\"${id}\">Descripci\u00f3n<\/div>\n<div class=\"dashboard-tab\" data-tab=\"analisis\" data-target=\"${id}\">An\u00e1lisis IA<\/div>\n<\/p><\/div>\n<div id=\"tab-content-${id}\" class=\"mt-4\">\n<div id=\"tab-desc-${id}\" class=\"tab-pane\">Cargando descripci\u00f3n...<\/div>\n<div id=\"tab-analisis-${id}\" class=\"tab-pane hidden\">Cargando an\u00e1lisis...<\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>        `;\n        card.querySelectorAll('.dashboard-tab').forEach(tab => {\n            tab.addEventListener('click', () => {\n                card.querySelectorAll('.dashboard-tab').forEach(t => t.classList.remove('active'));\n                tab.classList.add('active');\n                card.querySelectorAll('.tab-pane').forEach(p => p.classList.add('hidden'));\n                card.querySelector(`#tab-${tab.dataset.tab}-${id}`).classList.remove('hidden');\n            });\n        });\n        return card;\n    };<\/p>\n<p>    const updateImageInCard = (id, base64Data) => {\n        const imageContainer = document.getElementById(`image-container-${id}`);\n        imageContainer.innerHTML = `<img decoding=\"async\" src=\"data:image\/png;base64,${base64Data}\" alt=\"Concepto generado por IA\" class=\"w-full h-full object-cover\">`;\n    };<\/p>\n<p>    const populateDashboard = (id, data) => {\n        \/\/ Description Tab\n        const descContainer = document.getElementById(`tab-desc-${id}`);\n        let mobiliarioHtml = data.mobiliarioDestacado.map(m => `<\/p>\n<li class=\"ml-4\"><strong class=\"text-sky-300\">${m.pieza}:<\/strong> ${m.descripcion}<\/li>\n<p>`).join('');\n        descContainer.innerHTML = `<\/p>\n<div class=\"space-y-3 text-sm text-gray-300\">\n<p><strong class=\"text-white\">Concepto General:<\/strong> ${data.conceptoGeneral}<\/p>\n<p><strong class=\"text-white\">Dise\u00f1o y Materiales:<\/strong> ${data.disenoYMateriales}<\/p>\n<p><strong class=\"text-white\">Experiencia del Hu\u00e9sped:<\/strong> ${data.experienciaHuesped}<\/p>\n<div><strong class=\"text-white\">Mobiliario Destacado:<\/strong><\/p>\n<ul class=\"list-disc\">${mobiliarioHtml}<\/ul>\n<\/div><\/div>\n<p>        `;<\/p>\n<p>        \/\/ Analysis Tab\n        const analisisContainer = document.getElementById(`tab-analisis-${id}`);\n        const { costeEstimadoM2, indiceSostenibilidad, potencialViral, tiempoImplementacionSemanas } = data.analisisIA;<\/p>\n<p>        const createGauge = (value) => {\n            const rotation = (value \/ 100) * 180;\n            return `<\/p>\n<div class=\"kpi-gauge\">\n<div class=\"kpi-gauge-bg\"><\/div>\n<div class=\"kpi-gauge-fill\" style=\"transform: rotate(${rotation}deg);\"><\/div>\n<\/p><\/div>\n<div class=\"absolute bottom-0 w-full text-center text-lg font-bold text-white\">${value}<\/div>\n<p>            `;\n        };<\/p>\n<p>        analisisContainer.innerHTML = `<\/p>\n<div class=\"grid grid-cols-2 gap-4 text-sm\">\n<div class=\"glass-pane p-3 rounded-lg text-center\">\n<h4 class=\"font-semibold text-white\">Coste Estimado \/ m\u00b2<\/h4>\n<p class=\"text-2xl font-bold gradient-text\">${costeEstimadoM2.min}-${costeEstimadoM2.max} ${costeEstimadoM2.moneda}<\/p>\n<p class=\"text-xs text-gray-400\">Basado en materiales y complejidad del dise\u00f1o.<\/p>\n<\/p><\/div>\n<div class=\"glass-pane p-3 rounded-lg text-center\">\n<h4 class=\"font-semibold text-white\">Implementaci\u00f3n<\/h4>\n<p class=\"text-2xl font-bold gradient-text\">${tiempoImplementacionSemanas.min}-${tiempoImplementacionSemanas.max} <span class=\"text-lg\">semanas<\/span><\/p>\n<p class=\"text-xs text-gray-400\">Tiempo estimado de ejecuci\u00f3n y amueblado.<\/p>\n<\/p><\/div>\n<div class=\"glass-pane p-3 rounded-lg text-center\">\n<h4 class=\"font-semibold text-white\">\u00cdndice Sostenibilidad<\/h4>\n<div class=\"relative w-[100px] h-[50px] mx-auto\">${createGauge(indiceSostenibilidad.puntuacion)}<\/div>\n<p class=\"text-xs text-gray-400 mt-2\">${indiceSostenibilidad.comentario}<\/p>\n<\/p><\/div>\n<div class=\"glass-pane p-3 rounded-lg text-center\">\n<h4 class=\"font-semibold text-white\">Potencial Viral<\/h4>\n<div class=\"relative w-[100px] h-[50px] mx-auto\">${createGauge(potencialViral.puntuacion)}<\/div>\n<p class=\"text-xs text-gray-400 mt-2\">${potencialViral.comentario}<\/p>\n<\/p><\/div>\n<\/p><\/div>\n<p>        `;\n    };<\/p>\n<p>    const displayErrorInCard = (id, message) => {\n        document.getElementById(`image-container-${id}`).innerHTML = `<\/p>\n<div class=\"p-4 text-center text-red-400\">${message}<\/div>\n<p>`;\n        document.getElementById(`tab-content-${id}`).innerHTML = `<\/p>\n<div class=\"p-4 text-red-400\">${message}<\/div>\n<p>`;\n    };<\/p>\n<p>    generateButton.addEventListener('click', async () => {\n        initialState.classList.add('hidden');\n        resultsGrid.classList.add('hidden');\n        loadingState.classList.remove('hidden');\n        resultsGrid.innerHTML = '';<\/p>\n<p>        const numResults = parseInt(numResultsInput.value);\n        const selectedPalette = colorPalettesContainer.querySelector('.color-palette.selected');<\/p>\n<p>        const options = {\n            room: roomTypeSelect.value,\n            hotel: hotelTypeSelect.value,\n            style: styleTypeSelect.value,\n            imageType: imageTypeSelect.value,\n            lighting: lightingSelect.value,\n            attributes: attributesInput.value,\n            palette: selectedPalette.dataset.value,\n        };<\/p>\n<p>        loadingState.classList.add('hidden');\n        resultsGrid.classList.remove('hidden');\n        for (let i = 0; i < numResults; i++) {\n            resultsGrid.appendChild(createDashboardCard(i));\n        }\n\n        const generationPromises = Array.from({ length: numResults }, (_, i) => generateConcept(i, options));\n        await Promise.all(generationPromises);\n    });<\/p>\n<p>    const generateConcept = async (id, options) => {\n        const imagePromise = generateImage(id, options);\n        const textPromise = generateText(id, options);\n        await Promise.all([imagePromise, textPromise]);\n    };<\/p>\n<p>    const generateImage = async (id, options) => {\n        const imagePrompt = `URGENTE: El sujeto principal DEBE ser un \"${options.room}\". No muestres otro tipo de espacio.\n        ${options.imageType} de un\/a \"${options.room}\" en un hotel \"${options.hotel}\". El estilo es \"${options.style}\" con atributos de \"${options.attributes}\".\n        La paleta de colores es \"${options.palette}\". La iluminaci\u00f3n es \"${options.lighting}\".\n        Calidad m\u00e1xima, 8k, ultra detallado, enfoque en mobiliario a medida y materiales de lujo.`;\n        try {\n            const apiKey = \"\";\n            const apiUrl = `https:\/\/generativelanguage.googleapis.com\/v1beta\/models\/imagen-3.0-generate-002:predict?key=${apiKey}`;\n            const payload = { instances: [{ prompt: imagePrompt }], parameters: { \"sampleCount\": 1 } };\n            const response = await fetch(apiUrl, { method: 'POST', headers: { 'Content-Type': 'application\/json' }, body: JSON.stringify(payload) });\n            if (!response.ok) throw new Error(`API de imagen: ${response.status}`);\n            const result = await response.json();\n            if (result.predictions && result.predictions[0].bytesBase64Encoded) {\n                updateImageInCard(id, result.predictions[0].bytesBase64Encoded);\n            } else { throw new Error(\"Respuesta de imagen inv\u00e1lida.\"); }\n        } catch (error) {\n            console.error(`Error en imagen ${id}:`, error);\n            displayErrorInCard(id, `Error al generar imagen: ${error.message}`);\n        }\n    };<\/p>\n<p>    const generateText = async (id, options) => {\n        const jsonSchema = {\n            type: \"OBJECT\",\n            properties: {\n                conceptoGeneral: { type: \"STRING\" },\n                disenoYMateriales: { type: \"STRING\" },\n                mobiliarioDestacado: { type: \"ARRAY\", items: { type: \"OBJECT\", properties: { pieza: { type: \"STRING\" }, descripcion: { type: \"STRING\" } } } },\n                experienciaHuesped: { type: \"STRING\" },\n                analisisIA: {\n                    type: \"OBJECT\",\n                    properties: {\n                        costeEstimadoM2: { type: \"OBJECT\", properties: { min: { type: \"NUMBER\" }, max: { type: \"NUMBER\" }, moneda: { type: \"STRING\" } } },\n                        indiceSostenibilidad: { type: \"OBJECT\", properties: { puntuacion: { type: \"NUMBER\" }, comentario: { type: \"STRING\" } } },\n                        potencialViral: { type: \"OBJECT\", properties: { puntuacion: { type: \"NUMBER\" }, comentario: { type: \"STRING\" } } },\n                        tiempoImplementacionSemanas: { type: \"OBJECT\", properties: { min: { type: \"NUMBER\" }, max: { type: \"NUMBER\" } } }\n                    }\n                }\n            }\n        };<\/p>\n<p>        const systemPrompt = `Eres ConceptAI, una IA experta en dise\u00f1o de interiores y estrategia de negocio para el sector hotelero. Tu respuesta DEBE ser \u00fanicamente un objeto JSON v\u00e1lido que se ajuste al esquema proporcionado. No incluyas \\`\\`\\`json o cualquier otro texto fuera del JSON. Genera un an\u00e1lisis de negocio CRE\u00cdBLE y DATOS realistas para cada concepto.`;\n        const userQuery = `Analiza y describe el siguiente concepto de dise\u00f1o y proporciona un an\u00e1lisis de viabilidad. Responde S\u00d3LO con el objeto JSON.\n        - Espacio: ${options.room}\n        - Hotel: ${options.hotel}\n        - Estilo: ${options.style}\n        - Atributos: ${options.attributes}\n        - Colores: ${options.palette}`;<\/p>\n<p>        try {\n            const apiKey = \"\";\n            const apiUrl = `https:\/\/generativelanguage.googleapis.com\/v1beta\/models\/gemini-2.5-flash-preview-05-20:generateContent?key=${apiKey}`;\n            const payload = {\n                contents: [{ parts: [{ text: userQuery }] }],\n                systemInstruction: { parts: [{ text: systemPrompt }] },\n                generationConfig: { responseMimeType: \"application\/json\", responseSchema: jsonSchema }\n            };\n            const response = await fetch(apiUrl, { method: 'POST', headers: { 'Content-Type': 'application\/json' }, body: JSON.stringify(payload) });\n            if (!response.ok) throw new Error(`API de texto: ${response.status}`);\n            const result = await response.json();\n            const candidate = result.candidates?.[0];\n            const jsonText = candidate?.content?.parts?.[0]?.text;\n            if (jsonText) {\n                populateDashboard(id, JSON.parse(jsonText));\n            } else { throw new Error(\"Respuesta de texto inv\u00e1lida.\"); }\n        } catch (error) {\n            console.error(`Error en texto ${id}:`, error);\n            displayErrorInCard(id, `Error al generar an\u00e1lisis: ${error.message}`);\n        }\n    };\n<\/script><\/p>\n<p><\/body><br \/>\n<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Generador de Conceptos IA para Hoteles v2.0 ConceptAI 2.0 La plataforma definitiva para conceptualizar, analizar y vender proyectos de interiorismo hotelero. Nuestra Tecnolog\u00eda Fusionamos modelos de difusi\u00f3n de im\u00e1genes con LLMs especializados en arquitectura y negocio, entrenados con datasets propietarios. Esto nos permite generar no solo visuales impactantes, sino tambi\u00e9n an\u00e1lisis de viabilidad comercial para  [&#8230;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-1444","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>- Attrium<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"- Attrium\" \/>\n<meta property=\"og:description\" content=\"Generador de Conceptos IA para Hoteles v2.0 ConceptAI 2.0 La plataforma definitiva para conceptualizar, analizar y vender proyectos de interiorismo hotelero. Nuestra Tecnolog\u00eda Fusionamos modelos de difusi\u00f3n de im\u00e1genes con LLMs especializados en arquitectura y negocio, entrenados con datasets propietarios. Esto nos permite generar no solo visuales impactantes, sino tambi\u00e9n an\u00e1lisis de viabilidad comercial para [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Attrium\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/index.php\\\/1444-2\\\/\",\"url\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/index.php\\\/1444-2\\\/\",\"name\":\"- Attrium\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/#website\"},\"datePublished\":\"2025-09-10T11:05:06+00:00\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/index.php\\\/1444-2\\\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/#website\",\"url\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/\",\"name\":\"Attrium\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/attrium.asesoramientocomercial.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"- Attrium","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/","og_locale":"es_ES","og_type":"article","og_title":"- Attrium","og_description":"Generador de Conceptos IA para Hoteles v2.0 ConceptAI 2.0 La plataforma definitiva para conceptualizar, analizar y vender proyectos de interiorismo hotelero. Nuestra Tecnolog\u00eda Fusionamos modelos de difusi\u00f3n de im\u00e1genes con LLMs especializados en arquitectura y negocio, entrenados con datasets propietarios. Esto nos permite generar no solo visuales impactantes, sino tambi\u00e9n an\u00e1lisis de viabilidad comercial para [...]","og_url":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/","og_site_name":"Attrium","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/","url":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/","name":"- Attrium","isPartOf":{"@id":"https:\/\/attrium.asesoramientocomercial.com\/#website"},"datePublished":"2025-09-10T11:05:06+00:00","inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/attrium.asesoramientocomercial.com\/index.php\/1444-2\/"]}]},{"@type":"WebSite","@id":"https:\/\/attrium.asesoramientocomercial.com\/#website","url":"https:\/\/attrium.asesoramientocomercial.com\/","name":"Attrium","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/attrium.asesoramientocomercial.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"}]}},"_links":{"self":[{"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/pages\/1444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/comments?post=1444"}],"version-history":[{"count":1,"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/pages\/1444\/revisions"}],"predecessor-version":[{"id":1445,"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/pages\/1444\/revisions\/1445"}],"wp:attachment":[{"href":"https:\/\/attrium.asesoramientocomercial.com\/index.php\/wp-json\/wp\/v2\/media?parent=1444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}