{"id":1457,"date":"2026-05-02T08:24:36","date_gmt":"2026-05-02T08:24:36","guid":{"rendered":"https:\/\/cityhaus.com.mx\/?page_id=1457"},"modified":"2026-09-25T22:08:45","modified_gmt":"2026-09-25T22:08:45","slug":"availability","status":"publish","type":"page","link":"https:\/\/www.cityhaus.com.mx\/en\/availability\/","title":{"rendered":"Availability"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1457\" class=\"elementor elementor-1457\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-70783a9c e-con-full e-flex e-con e-parent\" data-id=\"70783a9c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5e504be0 elementor--h-position-center elementor--v-position-middle elementor-widget elementor-widget-slides\" data-id=\"5e504be0\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;navigation&quot;:&quot;none&quot;,&quot;transition&quot;:&quot;fade&quot;,&quot;transition_speed&quot;:500}\" data-widget_type=\"slides.default\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-slides-wrapper elementor-main-swiper swiper\" role=\"region\" aria-roledescription=\"carousel\" aria-label=\"Slider Main\" dir=\"ltr\" data-animation=\"\">\n\t\t\t\t<div class=\"swiper-wrapper elementor-slides\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-repeater-item-203a3b7 swiper-slide\" role=\"group\" aria-roledescription=\"slide\"><div class=\"swiper-slide-bg\" role=\"img\" aria-label=\"fachadas3\"><\/div><div class=\"elementor-background-overlay\"><\/div><div class=\"swiper-slide-inner\" ><div class=\"swiper-slide-contents\"><div class=\"elementor-slide-heading\">Availability<\/div><div class=\"elementor-slide-description\">Explore available units and secure your place in Puerto Vallarta\u2019s highest-growth area.<\/div><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-785dce60 e-flex e-con-boxed e-con e-parent\" data-id=\"785dce60\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-4d02142b e-con-full e-flex e-con e-child\" data-id=\"4d02142b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3f174df5 elementor-widget elementor-widget-text-editor\" data-id=\"3f174df5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Every unit at CityHa\u00fcs has been designed to balance cutting-edge architecture with urban functionality. Explore our current inventory and discover the space that fits your vision of lifestyle and comfort. Your place in the area&#8217;s most exclusive development is waiting for you.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-156ea415 e-flex e-con-boxed e-con e-parent\" data-id=\"156ea415\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-63171c5f e-con-full e-flex e-con e-child\" data-id=\"63171c5f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6eecb0d elementor-widget elementor-widget-html\" data-id=\"6eecb0d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"selector-torre-final\">\n    <style>\n        .tv-wrap { --azul: #103250; --dorado: #A09368; --dorado-hover: #8E825A; --available: #2d6a9f; --reserved: #c9a44a; --sold: rgb(244 0 0 \/ 97%); --bg: #f5f3ef; font-family: 'Creato Display', sans-serif; background: var(--bg); padding: 28px 20px; max-width: 1200px; margin: 0 auto; border-radius: 8px; box-shadow: 0 4px 20px rgba(16, 50, 80, 0.05); box-sizing: border-box; }\n        .tv-tabs { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }\n        .tv-tab { padding: 9px 22px; border: 1.5px solid #c5cdd6; background: transparent; color: #555; font-family: 'Creato Display', sans-serif; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; border-radius: 4px; cursor: pointer; transition: all 0.2s; font-weight: 600; }\n        .tv-tab:hover { border-color: var(--azul); color: var(--azul); }\n        .tv-tab.activo { background: var(--azul); border-color: var(--azul); color: #fff; }\n        .tv-subtitulo { background: var(--azul); color: #fff; font-family: 'Agenor Font', serif; font-size: 13px; letter-spacing: 3px; text-transform: uppercase; padding: 10px 18px; border-radius: 4px; margin-bottom: 18px; display: inline-block; }\n\n        .tv-main { display: flex; gap: 24px; align-items: flex-start; }\n        .tv-imagen-wrap { position: relative; flex: 1; min-width: 0; min-height: 350px; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 24px rgba(0,0,0,0.10); user-select: none; background: #e2e6ea; display: flex; align-items: center; justify-content: center; }\n        .tv-imagen-wrap img { display: block; width: 100%; height: auto; pointer-events: none; }\n\n        .tv-map-panel,.tv-panel{background:#fff;box-shadow:0 2px 16px rgba(0,0,0,.07)}\n        .tv-col-right{width:275px;flex-shrink:0; position: sticky;top: 100px;height: fit-content;}\n        .tv-map-panel{border-radius:6px;padding:0;margin-bottom:15px;overflow:hidden; min-height: 120px; background: #fafafa;}\n        .tv-map-title{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:#aaa;padding:12px 20px 8px;font-weight:600;}\n        .tv-map-panel img{width:100%;height:auto;display:block;border:none}\n        .tv-panel{width:100%;border-radius:6px;padding:24px 20px;min-height:380px;box-sizing:border-box}\n\n        .tv-rect { position: absolute; border-radius: 3px; cursor: pointer; border: 2px solid rgba(255,255,255,0.5); transition: 0.15s; display: flex; align-items: center; justify-content: center; z-index: 2; }\n        .tv-rect .rect-label { font-family: 'Creato Display', sans-serif; font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.95); text-shadow: 0 1px 3px rgba(0,0,0,0.5); pointer-events: none; }\n        .tv-rect.available { background: rgb(45 106 159 \/ 95%); }\n        .tv-rect.reserved  { background: rgba(201, 164, 74, 0.90); }\n        .tv-rect.sold    { background: rgb(244 0 0 \/ 97%); cursor: not-allowed; }\n        .tv-rect:hover:not(.sold) { filter: brightness(1.15); border-color: rgba(255,255,255,0.9); z-index: 3; }\n        .tv-rect.activo { border-color: var(--dorado); border-width: 3px; z-index: 4; }\n\n        .p-vacio { min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #aaa; text-align: center; font-size: 13px; gap: 12px; }\n        .p-badge { font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; padding: 4px 12px; border-radius: 20px; display: inline-block; margin-bottom: 12px; font-weight: 700; }\n        .badge-available { background: #e8f1f9; color: #2d6a9f; }\n        .badge-reserved { background: #fdf4e3; color: #a07820; }\n        .badge-sold { background: #f0f0f0; color: #888; }\n        .p-titulo { font-family: 'Agenor Font', serif; font-size: 24px; font-weight: 700; color: var(--azul); line-height: 1.2; margin-bottom: 3px; }\n        .p-sub { font-size: 12px; color: #888; margin-bottom: 14px; letter-spacing: 0.5px; }\n        .p-sep { height: 1px; background: #eee; margin: 12px 0; }\n        .p-fila { display: flex; justify-content: space-between; font-size: 12px; margin-bottom: 8px; }\n        .p-fila label { font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; color: #999; font-weight: 600; }\n        .p-fila span { color: #333; font-weight: 600; }\n        .p-metraje { background: var(--bg); border-radius: 4px; padding: 12px 14px; margin: 14px 0; }\n        .p-metraje-t { font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: #888; margin-bottom: 8px; font-weight: 700; }\n        .p-m { display: flex; justify-content: space-between; font-size: 12px; margin-bottom: 5px; color: #555; }\n        .p-m.tot { font-weight: 700; color: var(--azul); border-top: 1px solid #ddd; padding-top: 6px; margin-top: 4px; }\n        \n        .p-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }\n        .p-btn-sec { width: 100%; padding: 10px; background: transparent; border: 1px solid var(--azul); color: var(--azul); font-family: 'Creato Display', sans-serif; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; border-radius: 4px; cursor: pointer; text-align: center; text-decoration: none; display: block; box-sizing: border-box; font-weight: 600; transition: all 0.2s; }\n        .p-btn-sec:hover { background: rgba(16, 50, 80, 0.05); }\n        \n        .p-btn-roi { width: 100%; padding: 12px; background: var(--dorado); border: none; color: #fff; font-family: 'Creato Display', sans-serif; font-size: 11.5px; letter-spacing: 1.5px; text-transform: uppercase; border-radius: 4px; cursor: pointer; font-weight: 700; transition: 0.2s; display: flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; box-sizing: border-box; }\n        .p-btn-roi:hover { background: var(--dorado-hover); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(160, 147, 104, 0.35); }\n        \n        .p-btn-pri { width: 100%; padding: 11px; background: var(--azul); border: none; color: #fff; font-family: 'Creato Display', sans-serif; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; border-radius: 4px; cursor: pointer; transition: 0.2s; font-weight: 600; }\n        .p-btn-pri:hover { background: #0a2035; }\n\n        .tv-leyenda { display: flex; gap: 16px; margin-bottom: 16px; align-items: center; flex-wrap: wrap; }\n        .tv-leyenda-label { font-size: 9px; letter-spacing: 2px; text-transform: uppercase; color: #888; margin-right: 4px; font-weight: 700; }\n        .tv-leyenda-item { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 400; color: #555; }\n        .tv-dot { width: 10px; height: 10px; border-radius: 2px; }\n        .dot-d { background: var(--available); }\n        .dot-r { background: var(--reserved); }\n        .dot-v { background: var(--sold); }\n        \n        \/* Modal Popup *\/\n        .ch-modal-overlay {\n            position: fixed;\n            top: 0; left: 0; width: 100vw; height: 100vh;\n            background: rgba(10, 32, 53, 0.8);\n            backdrop-filter: blur(8px);\n            z-index: 99999999;\n            display: none;\n            align-items: center;\n            justify-content: center;\n            padding: 20px;\n            box-sizing: border-box;\n            opacity: 0;\n            transition: opacity 0.25s ease;\n        }\n        .ch-modal-overlay.active {\n            display: flex !important;\n            opacity: 1;\n        }\n        .ch-modal-box {\n            background: #FFFFFF;\n            width: 100%;\n            max-width: 540px;\n            border-radius: 14px;\n            box-shadow: 0 25px 60px rgba(0,0,0,0.35);\n            overflow: hidden;\n            position: relative;\n            transform: scale(0.95);\n            transition: transform 0.25s ease;\n            border: 1px solid rgba(160, 147, 104, 0.4);\n        }\n        .ch-modal-overlay.active .ch-modal-box {\n            transform: scale(1);\n        }\n        .ch-modal-header {\n            background: #103250;\n            color: #FFFFFF;\n            padding: 20px 24px;\n            position: relative;\n        }\n        .ch-modal-badge {\n            font-size: 10px;\n            letter-spacing: 2px;\n            text-transform: uppercase;\n            color: #A09368;\n            font-weight: 700;\n            margin-bottom: 4px;\n        }\n        .ch-modal-title {\n            font-family: 'Agenor Font', serif;\n            font-size: 19px;\n            font-weight: 700;\n            color: #FFFFFF;\n            line-height: 1.2;\n            margin: 0;\n        }\n        .ch-modal-close {\n            position: absolute;\n            top: 16px;\n            right: 0px;\n            background: transparent;\n            border: none;\n            color: rgba(255,255,255,0.7);\n            font-size: 26px;\n            cursor: pointer;\n            line-height: 1;\n            transition: color 0.2s;\n        }\n        .ch-modal-close:hover {\n            color: #A09368;\n        }\n        .ch-modal-body {\n            padding: 15px 20px 20px;\n            max-height: 80vh;\n            overflow-y: auto;\n            position: relative;\n        }\n\n        .ch-loader-screen {\n            display: none;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n            padding: 50px 20px;\n            text-align: center;\n            background: #FFFFFF;\n            min-height: 380px;\n        }\n        .ch-loader-spinner {\n            width: 48px;\n            height: 48px;\n            border: 4px solid rgba(160, 147, 104, 0.2);\n            border-top: 4px solid #A09368;\n            border-radius: 50%;\n            animation: chSpin 0.9s linear infinite;\n            margin-bottom: 20px;\n        }\n        @keyframes chSpin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n        .ch-loader-title {\n            font-family: 'Agenor Font', serif;\n            font-size: 20px;\n            font-weight: 700;\n            color: #103250;\n            margin-bottom: 8px;\n            text-transform: uppercase;\n        }\n        .ch-loader-desc {\n            font-family: 'Creato Display', sans-serif;\n            font-size: 14px;\n            color: #6E7D8B;\n        }\n\n        @media (max-width: 768px) {\n            .tv-main { flex-direction: column; }\n            .tv-col-right { width: 100%; position: static; }\n            .tv-panel { scroll-margin-top: 20px; }\n            .ch-modal-body { padding: 10px; }\n        }\n    <\/style>\n\n    <div class=\"tv-wrap\">\n        <div class=\"tv-tabs\" id=\"tvTabs\"><\/div>\n        <div class=\"tv-subtitulo\" id=\"tvSubtitulo\"><\/div>\n\n        <div class=\"tv-leyenda\">\n            <span class=\"tv-leyenda-label\">Legend<\/span>\n            <div class=\"tv-leyenda-item\"><span class=\"tv-dot dot-d\"><\/span>Available<\/div>\n            <div class=\"tv-leyenda-item\"><span class=\"tv-dot dot-r\"><\/span>Reserved<\/div>\n            <div class=\"tv-leyenda-item\"><span class=\"tv-dot dot-v\"><\/span>Sold<\/div>\n        <\/div>\n\n        <div class=\"tv-main\">\n            <div class=\"tv-imagen-wrap\" id=\"tvImagenWrap\">\n                <p style=\"color:#888; font-size:13px;\">Loading tower viewer...<\/p>\n            <\/div>\n            <div class=\"tv-col-right\">\n                <div class=\"tv-map-panel\">\n                    <div class=\"tv-map-title\">Floor location<\/div>\n                    <img decoding=\"async\" id=\"imgMapa\" src=\"\" alt=\"View map\">\n                <\/div>\n                <div class=\"tv-panel\">\n                    <div class=\"p-vacio\" id=\"pVacio\">\n                        <svg width=\"38\" height=\"38\" fill=\"none\" viewBox=\"0 0 38 38\"><rect x=\"3\" y=\"3\" width=\"32\" height=\"32\" rx=\"3\" stroke=\"#ddd\" stroke-width=\"2\"\/><rect x=\"8\" y=\"8\" width=\"22\" height=\"7\" rx=\"1\" fill=\"#e8e8e8\"\/><rect x=\"8\" y=\"19\" width=\"22\" height=\"7\" rx=\"1\" fill=\"#e8e8e8\"\/><\/svg>\n                        <p>Click on a unit<br>to see details<\/p>\n                    <\/div>\n                    <div class=\"p-contenido\" id=\"pContenido\" style=\"display:none\">\n                        <div class=\"p-badge\" id=\"pBadge\"><\/div>\n                        <div class=\"p-titulo\" id=\"pTitulo\"><\/div>\n                        <div class=\"p-sub\" id=\"pSub\"><\/div>\n                        <div class=\"p-sep\"><\/div>\n                        <div class=\"p-fila\"><label>Apartment<\/label><span id=\"pModelo\"><\/span><\/div>\n                        <div class=\"p-fila\"><label>Bedrooms<\/label><span id=\"pRec\"><\/span><\/div>\n                        <div class=\"p-fila\"><label>Bathrooms<\/label><span id=\"pBan\"><\/span><\/div>\n                        <div class=\"p-metraje\">\n                            <div class=\"p-metraje-t\">Area<\/div>\n                            <div class=\"p-m\"><span>Interior<\/span><span id=\"pInt\"><\/span><\/div>\n                            <div class=\"p-m\"><span>Balcony<\/span><span id=\"pTer\"><\/span><\/div>\n                            <div class=\"p-m tot\"><span>Total<\/span><span id=\"pTot\"><\/span><\/div>\n                        <\/div>\n                        \n                        <div class=\"p-actions\">\n                            <a href=\"#\" class=\"p-btn-sec\" id=\"btnPlano\">View Floor Plan<\/a>\n                            \n                            <button type=\"button\" class=\"p-btn-roi\" id=\"btnSimularROI\">\n                                <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><line x1=\"12\" y1=\"1\" x2=\"12\" y2=\"23\"><\/line><path d=\"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6\"><\/path><\/svg>\n                                <span>Simulate Performance<\/span>\n                            <\/button>\n                            \n                            <button class=\"p-btn-pri\" id=\"btnInformacion\">Request Information<\/button>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- MODAL POPUP -->\n    <div class=\"ch-modal-overlay\" id=\"chGhlModal\">\n        <div class=\"ch-modal-box\">\n            <div class=\"ch-modal-header\">\n                <button type=\"button\" class=\"ch-modal-close\" id=\"btnCerrarModal\">&times;<\/button>\n                <div class=\"ch-modal-badge\">Financial Projection & ROI<\/div>\n                <h3 class=\"ch-modal-title\" id=\"ghlModalTitle\">Unlock Simulation<\/h3>\n            <\/div>\n            <div class=\"ch-modal-body\">\n                <div class=\"ch-loader-screen\" id=\"chLoaderScreen\">\n                    <div class=\"ch-loader-spinner\"><\/div>\n                    <h4 class=\"ch-loader-title\">Generating Projection...<\/h4>\n                    <p class=\"ch-loader-desc\">Transferring you to your personalized performance simulation.<\/p>\n                <\/div>\n\n                <iframe \n                    src=\"https:\/\/api.leadconnectorhq.com\/widget\/survey\/ZbbCgliMDF04rZKZirAl\" \n                    style=\"border:none;width:100%;min-height:380px;\" \n                    scrolling=\"no\" \n                    id=\"xtrfkVJu4NaeV57wBoah\" \n                    title=\"survey\">\n                <\/iframe>\n                <script src=\"https:\/\/link.msgsndr.com\/js\/form_embed.js\"><\/script>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <script>\n        (function() {\n            function moverModalAlBody() {\n                const modal = document.getElementById('chGhlModal');\n                if (modal && modal.parentElement !== document.body) {\n                    document.body.appendChild(modal);\n                }\n            }\n            if (document.readyState === 'loading') {\n                document.addEventListener('DOMContentLoaded', moverModalAlBody);\n            } else {\n                moverModalAlBody();\n            }\n\n            let VISTAS_DATA = [];\n\n            let vistaActiva = 0;\n            let modoEdit = false;\n            let initialized = false;\n\n            document.addEventListener('click', function(e) {\n                const trigger = e.target.closest('a[href=\"#abrir-modal-roi\"], button[href=\"#abrir-modal-roi\"], .btn-abrir-modal-roi');\n                if (trigger) {\n                    e.preventDefault();\n                    abrirModal(null);\n                }\n            });\n\n            window.addEventListener('message', function(event) {\n                if (event.data) {\n                    const dataStr = typeof event.data === 'string' ? event.data : JSON.stringify(event.data);\n                    if (dataStr.includes('form-submit') || dataStr.includes('survey_submit') || dataStr.includes('leadconnector')) {\n                        mostrarPantallaCarga();\n                    }\n                }\n            });\n\n            async function safeInit() {\n                const tabsCont = document.getElementById('tvTabs');\n                const wrap = document.getElementById('tvImagenWrap');\n                const mapa = document.getElementById('imgMapa');\n\n                if (!tabsCont || !wrap || !mapa) {\n                    setTimeout(safeInit, 100);\n                    return;\n                }\n\n                if (initialized) return;\n                initialized = true;\n\n                try {\n                    const res = await fetch('\/wp-json\/cityhaus\/v1\/unidades?lang=en', { cache: 'no-cache' });\n                    if (res.ok) {\n                        const data = await res.json();\n                        if (Array.isArray(data) && data.length) VISTAS_DATA = data;\n                    }\n                } catch (e) {}\n\n                tabsCont.innerHTML = '';\n                if (!VISTAS_DATA.length) {\n                    tabsCont.innerHTML = '<span style=\"color:#888;font-size:13px;\">Could not load units.<\/span>';\n                    return;\n                }\n                VISTAS_DATA.forEach((v, i) => {\n                    const b = document.createElement('button');\n                    b.type = 'button';\n                    b.className = 'tv-tab' + (i === 0 ? ' activo' : '');\n                    b.innerText = v.tab;\n                    b.onclick = () => {\n                        document.querySelectorAll('.tv-tab').forEach(t => t.classList.remove('activo'));\n                        b.classList.add('activo');\n                        vistaActiva = i;\n                        const pVacio = document.getElementById('pVacio');\n                        const pContenido = document.getElementById('pContenido');\n                        if (pVacio) pVacio.style.display = 'flex';\n                        if (pContenido) pContenido.style.display = 'none';\n                        render();\n                    };\n                    tabsCont.appendChild(b);\n                });\n\n                const modal = document.getElementById('chGhlModal');\n                const btnCerrar = document.getElementById('btnCerrarModal');\n                if (btnCerrar) btnCerrar.onclick = cerrarModal;\n                if (modal) {\n                    modal.onclick = (e) => { if (e.target === modal) cerrarModal(); };\n                }\n                document.addEventListener('keydown', (e) => {\n                    if (e.key === 'Escape') cerrarModal();\n                });\n\n                render();\n            }\n\n            function mostrarPantallaCarga() {\n                const iframe = document.getElementById('xtrfkVJu4NaeV57wBoah');\n                const loader = document.getElementById('chLoaderScreen');\n                if (iframe && loader) {\n                    iframe.style.display = 'none';\n                    loader.style.display = 'flex';\n                }\n            }\n\n            window.abrirModal = function(u) {\n                moverModalAlBody();\n                const modal = document.getElementById('chGhlModal');\n                const iframe = document.getElementById('xtrfkVJu4NaeV57wBoah');\n                const loader = document.getElementById('chLoaderScreen');\n                const title = document.getElementById('ghlModalTitle');\n\n                if (loader) loader.style.display = 'none';\n                if (iframe) iframe.style.display = 'block';\n\n                let baseUrlGhl = \"https:\/\/api.leadconnectorhq.com\/widget\/survey\/ZbbCgliMDF04rZKZirAl\";\n\n                if (u) {\n                    const nombrePrototipo = u.id.split(' ')[0].toUpperCase();\n                    if (title) title.innerText = `Unit ${nombrePrototipo} ${u.modelo} Simulation`;\n                    if (iframe) {\n                        \/\/ Send with origin=tower\n                        iframe.src = `${baseUrlGhl}?modelo_interes=${encodeURIComponent(nombrePrototipo)}&unidad_interes=${encodeURIComponent(u.modelo)}&origen=torre`;\n                    }\n                } else {\n                    if (title) title.innerText = `Simulate Performance & ROI`;\n                    if (iframe) {\n                        \/\/ Send without origin so it opens blank\n                        iframe.src = baseUrlGhl;\n                    }\n                }\n\n                if (modal) modal.classList.add('active');\n            };\n\n            function cerrarModal() {\n                const modal = document.getElementById('chGhlModal');\n                if (modal) modal.classList.remove('active');\n            }\n\n            function render() {\n                const v = VISTAS_DATA[vistaActiva];\n                if (!v) return;\n                const subtitulo = document.getElementById('tvSubtitulo');\n                const mapa = document.getElementById('imgMapa');\n                const wrap = document.getElementById('tvImagenWrap');\n\n                if (subtitulo) subtitulo.innerText = v.subtitulo;\n                if (mapa) mapa.src = v.mapa;\n\n                if (!wrap) return;\n                wrap.innerHTML = '';\n\n                const img = document.createElement('img');\n                img.src = v.imagen;\n                img.alt = v.subtitulo;\n                img.style.cssText = 'width:100%; height:auto; display:block;';\n\n                img.onload = function() {\n                    v.unidades.forEach(u => {\n                        const rect = document.createElement('div');\n                        rect.className = `tv-rect ${u.estado}`;\n                        rect.style.cssText = `top:${u.top}%; left:${u.left}%; width:${u.width}%; height:${u.height}%;`;\n                        rect.innerHTML = `<span class=\"rect-label\">${u.id}<\/span>`;\n                        rect.onclick = (e) => {\n                            e.stopPropagation();\n                            if (u.estado === 'sold') return;\n                            if(!modoEdit) {\n                                document.querySelectorAll('.tv-rect').forEach(r => r.classList.remove('activo'));\n                                rect.classList.add('activo');\n                                mostrarDetalle(u);\n                            }\n                        };\n                        wrap.appendChild(rect);\n                    });\n                };\n\n                wrap.appendChild(img);\n            }\n\n            function mostrarDetalle(u) {\n                const pVacio = document.getElementById('pVacio');\n                const cont = document.getElementById('pContenido');\n                if (pVacio) pVacio.style.display = 'none';\n                if (cont) cont.style.display = 'block';\n\n                const badge = document.getElementById('pBadge');\n                if (badge) {\n                    badge.innerText = u.estado.toUpperCase();\n                    badge.className = `p-badge badge-${u.estado}`;\n                }\n\n                const pTitulo = document.getElementById('pTitulo');\n                if (pTitulo) pTitulo.innerText = u.id;\n\n                const pModelo = document.getElementById('pModelo');\n                if (pModelo) pModelo.innerText = \"Apt. \" + u.modelo;\n\n                const pRec = document.getElementById('pRec');\n                if (pRec) pRec.innerText = u.recamaras;\n\n                const pBan = document.getElementById('pBan');\n                if (pBan) pBan.innerText = u.banos;\n\n                const pInt = document.getElementById('pInt');\n                if (pInt) pInt.innerText = u.interior.toFixed(2) + ' m\u00b2';\n\n                const pTer = document.getElementById('pTer');\n                if (pTer) pTer.innerText = u.terraza.toFixed(2) + ' m\u00b2';\n\n                const pTot = document.getElementById('pTot');\n                if (pTot) pTot.innerText = (u.interior + u.terraza).toFixed(2) + ' m\u00b2';\n\n                const btnPlano = document.getElementById('btnPlano');\n                if (btnPlano) {\n                    btnPlano.href = u.urlPlano;\n                    btnPlano.setAttribute('data-elementor-open-lightbox', 'yes');\n                }\n\n                const btnSimular = document.getElementById('btnSimularROI');\n                if (btnSimular) {\n                    btnSimular.onclick = (e) => {\n                        e.preventDefault();\n                        window.abrirModal(u);\n                    };\n                }\n\n                const btnInfo = document.getElementById('btnInformacion');\n                if (btnInfo) {\n                    const telefono = \"5213222786206\";\n                    const mensaje = `Hello! I'm interested in unit ${u.id}, apartment ${u.modelo} at CityHa\u00fcs. Could you provide me with availability and a price list?`;\n                    const whatsappUrl = `https:\/\/wa.me\/${telefono}?text=${encodeURIComponent(mensaje)}`;\n                    btnInfo.onclick = () => {\n                        window.open(whatsappUrl, '_blank');\n                    };\n                }\n\n                if (window.innerWidth <= 768 && cont) {\n                    const yOffset = -80;\n                    const y = cont.getBoundingClientRect().top + window.pageYOffset + yOffset;\n                    window.scrollTo({ top: y, behavior: 'smooth' });\n                }\n            }\n\n            if (document.readyState === 'loading') {\n                document.addEventListener('DOMContentLoaded', safeInit);\n            } else {\n                safeInit();\n            }\n\n            document.addEventListener('click', function(e) {\n                if (e.target.closest('.elementor-accordion-title, .elementor-tab-title, .e-n-accordion-item-title, .e-n-accordion-item')) {\n                    setTimeout(function() {\n                        render();\n                    }, 200);\n                }\n            });\n        })();\n    <\/script>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a466024 e-flex e-con-boxed e-con e-parent\" data-id=\"a466024\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-04966a4 e-flex e-con-boxed e-con e-child\" data-id=\"04966a4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-52cd2b6 e-con-full e-flex e-con e-child\" data-id=\"52cd2b6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-62c4f40 elementor-widget elementor-widget-heading\" data-id=\"62c4f40\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">READY TO INVEST<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-99e5f6f elementor-widget elementor-widget-heading\" data-id=\"99e5f6f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">IN PUERTO VALLARTA?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d5c59cc elementor-widget elementor-widget-text-editor\" data-id=\"d5c59cc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\tLeave us your details and a specialized advisor will contact you with detailed financial information.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-21bc584 e-con-full e-flex e-con e-child\" data-id=\"21bc584\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-c1f9e09 e-con-full e-flex e-con e-child\" data-id=\"c1f9e09\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-15b65d1 elementor-widget elementor-widget-image\" data-id=\"15b65d1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"646\" height=\"688\" src=\"https:\/\/www.cityhaus.com.mx\/wp-content\/uploads\/2026\/04\/2025-07-17-CAM-040-Barandales-2.png\" class=\"attachment-full size-full wp-image-884\" alt=\"\" srcset=\"https:\/\/www.cityhaus.com.mx\/wp-content\/uploads\/2026\/04\/2025-07-17-CAM-040-Barandales-2.png 646w, https:\/\/www.cityhaus.com.mx\/wp-content\/uploads\/2026\/04\/2025-07-17-CAM-040-Barandales-2-282x300.png 282w\" sizes=\"(max-width: 646px) 100vw, 646px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a3ee492 e-con-full e-flex e-con e-child\" data-id=\"a3ee492\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ab6b563 elementor-widget__width-initial elementor-widget elementor-widget-html\" data-id=\"ab6b563\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<iframe src=\"https:\/\/api.leadconnectorhq.com\/widget\/survey\/PdvBIfAXnleSSi1Pe2Zu\" style=\"border:none;width:100%;\" scrolling=\"no\" id=\"PdvBIfAXnleSSi1Pe2Zu\" title=\"survey\"><\/iframe>\n<script src=\"https:\/\/link.msgsndr.com\/js\/form_embed.js\"><\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\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>AvailabilityExplore available units and secure your place in Puerto Vallarta\u2019s highest-growth area. Every unit at CityHa\u00fcs has been designed to balance cutting-edge architecture with urban functionality. Explore our current inventory and discover the space that fits your vision of lifestyle and comfort. Your place in the area&#8217;s most exclusive development is waiting for you. Legend [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_locale":"en_US","_original_post":"https:\/\/cityhaus.com.mx\/?page_id=387","footnotes":""},"class_list":["post-1457","page","type-page","status-publish","hentry","en-US"],"_links":{"self":[{"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/pages\/1457","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/comments?post=1457"}],"version-history":[{"count":31,"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/pages\/1457\/revisions"}],"predecessor-version":[{"id":2577,"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/pages\/1457\/revisions\/2577"}],"wp:attachment":[{"href":"https:\/\/www.cityhaus.com.mx\/wp-json\/wp\/v2\/media?parent=1457"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}