{"id":1134,"date":"2021-01-04T22:21:51","date_gmt":"2021-01-04T22:21:51","guid":{"rendered":"https:\/\/vivirfrentealmar.com\/?page_id=1134"},"modified":"2026-08-11T21:38:29","modified_gmt":"2026-08-11T21:38:29","slug":"oasis","status":"publish","type":"page","link":"https:\/\/vivirfrentealmar.com\/en\/oasis\/","title":{"rendered":"Oasis"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1134\" class=\"elementor elementor-1134\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-624220c elementor-section-full_width elementor-section-height-default elementor-section-height-default wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no\" data-id=\"624220c\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2f6ca68\" data-id=\"2f6ca68\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4fddee5 elementor-widget elementor-widget-html\" data-id=\"4fddee5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Oasis On The Bay - Vivir Frente al Mar<\/title>\n    \n    <!-- Tipograf\u00edas -->\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=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Montserrat:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n\n    <style>\n        \/* ================= PALETA DE COLORES Y VARIABLES ================= *\/\n        :root {\n            --title-purple: #3E276A;   \/* Morado Principal *\/\n            --primary-navy: #1F243B;   \/* Azul Marino *\/\n            --bg-light: #FFFFFF;       \/* Fondo Claro *\/\n            --white: #FFFFFF;\n            --font-serif: 'Playfair Display', serif;\n            --font-sans: 'Montserrat', sans-serif;\n        }\n\n        html {\n            scroll-behavior: smooth;\n            background-color: var(--title-purple); \n        }\n\n        html, body {\n            margin: 0 !important;\n            padding: 0 !important;\n            width: 100% !important;\n            max-width: 100% !important;\n            overflow-x: hidden !important; \n            font-family: var(--font-sans);\n            color: #444;\n        }\n\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box !important;\n        }\n\n        .vfm-fullpage-wrapper {\n            width: 100vw !important;\n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n            margin-top: -150px !important;\n            margin-bottom: -150px !important;\n            padding-top: 150px !important;\n            overflow-x: hidden;\n        }\n\n        a { text-decoration: none; color: inherit; }\n        ul { list-style: none; }\n\n        \/* Botones generales *\/\n        .btn {\n            display: inline-block;\n            padding: 12px 28px;\n            border-radius: 30px;\n            font-size: 0.75rem;\n            font-weight: 600;\n            letter-spacing: 1.5px;\n            text-transform: uppercase;\n            transition: all 0.3s ease;\n            cursor: pointer;\n            border: none;\n        }\n        .btn-sm {\n            padding: 8px 18px !important;\n            font-size: 0.65rem !important;\n            letter-spacing: 1px !important;\n        }\n        \n        .btn-outline-white { border: 1px solid var(--white); color: var(--white); background: transparent; }\n        .btn-outline-white:hover { background-color: var(--white); color: var(--title-purple); }\n\n        .btn-mapa-compact {\n            padding: 8px 20px !important;\n            font-size: 0.65rem !important;\n            letter-spacing: 1px !important;\n            width: fit-content !important;\n            align-self: flex-start;\n            border: 1px solid var(--title-purple);\n            color: var(--title-purple);\n        }\n        .btn-mapa-compact:hover {\n            background-color: var(--title-purple);\n            color: var(--white);\n        }\n\n        \/* Estilos de Encabezados *\/\n        .section-header { text-align: center; margin-bottom: 2.5rem; }\n        .section-header h2 {\n            font-family: var(--font-serif);\n            font-size: 2.2rem;\n            text-transform: uppercase;\n            letter-spacing: 2px;\n            font-weight: 400;\n            margin-bottom: 0.8rem;\n        }\n        .section-header p { font-size: 0.85rem; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }\n\n        \/* Encabezados en Secciones Claras *\/\n        .section-light .section-header h2 { color: var(--title-purple); }\n        .section-light .section-header p { color: var(--primary-navy); }\n\n        \/* Encabezados en Secciones Oscuras *\/\n        .section-dark .section-header h2 { color: var(--white); }\n        .section-dark .section-header p { color: var(--white); opacity: 0.85; }\n\n        \/* ================= 1. HERO ================= *\/\n        .hero {\n            position: relative;\n            margin-top: -300px !important; \n            padding-top: 300px !important;\n            height: calc(100vh + 300px) !important;\n            min-height: 700px;\n            width: 100%;\n            background-image: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.75)), url('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2026\/08\/ChatGPT-Image-11-ago-2026-10_51_39.png');\n            background-size: cover;\n            background-position: center;\n            color: var(--white);\n            display: flex;\n            flex-direction: column;\n        }\n\n        header {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            padding: 30px 5%;\n            width: 100%;\n            position: absolute;\n            top: 300px !important; \n            left: 0;\n            z-index: 10;\n        }\n\n        .logo img { height: 135px; object-fit: contain; filter: drop-shadow(0px 4px 6px rgba(0,0,0,0.6)); }\n\n        .hero-content {\n            flex-grow: 1;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            max-width: 800px;\n            padding-left: 5%;\n        }\n        .hero-content h1 { font-family: var(--font-serif); font-size: 4.8rem; font-weight: 400; margin-bottom: 20px; line-height: 1.1; }\n        .hero-content p { font-family: var(--font-serif); font-size: 1.3rem; font-style: italic; margin-bottom: 40px; max-width: 600px; line-height: 1.5; opacity: 0.95; }\n\n        \/* ================= 2. DESCRIPCI\u00d3N + AMENIDADES ================= *\/\n        .amenidades-section { \n            padding: 90px 5%; \n            background-color: var(--bg-light); \n            width: 100vw !important; \n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n        }\n\n        .amenidades-grid-container {\n            display: flex;\n            gap: 60px;\n            align-items: center;\n            width: 100%;\n            padding: 0 2%;\n        }\n\n        .proyecto-descripcion-col { flex: 1.2; }\n        .proyecto-descripcion-col h2 {\n            font-family: var(--font-serif);\n            font-size: 2.5rem;\n            color: var(--title-purple);\n            text-transform: uppercase;\n            letter-spacing: 1.5px;\n            font-weight: 400;\n            margin-bottom: 25px;\n            line-height: 1.2;\n        }\n        .proyecto-descripcion-col p { font-size: 1rem; line-height: 1.8; color: #555; margin-bottom: 20px; }\n        .proyecto-descripcion-col p strong { color: var(--title-purple); }\n\n        .amenidades-icons-col {\n            flex: 1;\n            background: #F9FAFC;\n            padding: 50px 40px;\n            border-radius: 12px;\n            box-shadow: 0 10px 30px rgba(0,0,0,0.05);\n            border-top: 4px solid var(--title-purple);\n        }\n        .amenidades-icons-col h3 {\n            font-family: var(--font-serif);\n            font-size: 1.5rem;\n            color: var(--title-purple);\n            text-transform: uppercase;\n            margin-bottom: 30px;\n            text-align: center;\n            letter-spacing: 1px;\n        }\n\n        .icons-grid {\n            display: grid;\n            grid-template-columns: repeat(3, 1fr);\n            gap: 35px 20px;\n            text-align: center;\n        }\n\n        .icon-box i { font-size: 2.5rem; color: var(--title-purple); margin-bottom: 12px; transition: transform 0.3s, color 0.3s; }\n        .icon-box:hover i { transform: translateY(-5px); color: var(--primary-navy); }\n        .icon-box h3 { font-size: 0.8rem; font-weight: 700; color: var(--title-purple); text-transform: uppercase; margin: 0; }\n\n        \/* ================= 3. PLANTAS ARQUITECT\u00d3NICAS (BARRITA DIVISORIA COMPLETA) ================= *\/\n        .vida-section { \n            background-color: var(--title-purple); \n            padding: 0; \n            width: 100vw !important; \n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n        }\n\n        \/* BARRITA DIVISORIA A LO LARGO DE LA P\u00c1GINA *\/\n        .planos-bar-trigger {\n            width: 100%;\n            padding: 25px 5%;\n            background-color: var(--title-purple);\n            border-top: 1px solid rgba(255, 255, 255, 0.15);\n            border-bottom: 1px solid rgba(255, 255, 255, 0.15);\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            cursor: pointer;\n            transition: background-color 0.3s ease;\n        }\n        .planos-bar-trigger:hover {\n            background-color: var(--primary-navy);\n        }\n\n        .planos-bar-content {\n            display: flex;\n            align-items: center;\n            gap: 15px;\n            color: var(--white);\n            font-family: var(--font-serif);\n            font-size: 1.2rem;\n            letter-spacing: 1.5px;\n            text-transform: uppercase;\n        }\n\n        .planos-bar-content i {\n            font-size: 1.2rem;\n            transition: transform 0.4s ease;\n        }\n\n        .planos-bar-trigger.open .planos-bar-content i {\n            transform: rotate(180deg);\n        }\n\n        \/* CONTENEDOR OCULTO DE PLANTAS *\/\n        .plan-submodels-wrapper {\n            max-height: 0;\n            overflow: hidden;\n            transition: max-height 0.8s cubic-bezier(0, 1, 0, 1);\n            background-color: var(--title-purple);\n            padding: 0 5%;\n        }\n\n        .plan-submodels-wrapper.open {\n            max-height: 2500px;\n            transition: max-height 1s ease-in-out;\n            padding: 50px 5% 80px 5%;\n        }\n\n        .modern-plans-grid {\n            display: grid;\n            grid-template-columns: repeat(5, 1fr);\n            gap: 20px;\n            width: 100%;\n            max-width: 1400px;\n            margin: 0 auto;\n        }\n\n        .plan-item {\n            position: relative;\n            background-color: var(--white);\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            align-items: center;\n            cursor: pointer;\n            border-radius: 8px;\n            padding: 15px;\n            box-shadow: 0 10px 25px rgba(0,0,0,0.2);\n            transition: transform 0.3s ease;\n        }\n        .plan-item:hover { transform: translateY(-5px); }\n        .plan-item img { width: 100%; height: 220px; object-fit: contain; }\n        .plan-item h4 {\n            margin-top: 10px;\n            font-size: 0.85rem;\n            color: var(--title-purple);\n            font-weight: 700;\n            text-transform: uppercase;\n        }\n\n        \/* ================= 4. GALER\u00cdA SLIDER 3D COVERFLOW ================= *\/\n        .galeria-section { \n            padding: 90px 0; \n            background-color: #F4F5F7; \n            width: 100vw !important; \n            position: relative; \n            left: 50%; \n            right: 50%; \n            margin-left: -50vw !important; \n            margin-right: -50vw !important; \n            overflow: hidden;\n        }\n        \n        .coverflow-wrapper {\n            position: relative;\n            width: 100%;\n            max-width: 1200px;\n            margin: 0 auto;\n            height: 480px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            perspective: 1200px;\n        }\n\n        .coverflow-slider {\n            position: relative;\n            width: 100%;\n            height: 100%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            transform-style: preserve-3d;\n        }\n\n        .coverflow-item {\n            position: absolute;\n            width: 550px;\n            height: 380px;\n            border-radius: 12px;\n            overflow: hidden;\n            transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1), box-shadow 0.7s ease;\n            cursor: pointer;\n            user-select: none;\n            background-color: #000;\n        }\n\n        .coverflow-item img {\n            width: 100%;\n            height: 100%;\n            object-fit: cover;\n            transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1), filter 0.6s ease;\n            filter: brightness(0.88);\n        }\n\n        .coverflow-item.active img { filter: brightness(1); }\n        .coverflow-item:hover img { transform: scale(1.04); }\n\n        .coverflow-caption {\n            position: absolute;\n            bottom: 0; left: 0; right: 0;\n            background: linear-gradient(transparent, rgba(0, 0, 0, 0.85));\n            color: #fff;\n            padding: 25px 20px 20px 20px;\n            font-family: var(--font-serif);\n            font-size: 1.15rem;\n            text-align: center;\n            letter-spacing: 1px;\n            opacity: 0;\n            transform: translateY(15px);\n            transition: opacity 0.5s ease 0.1s, transform 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0.1s;\n        }\n\n        .coverflow-item.active {\n            transform: translateX(0) scale(1.1) translateZ(120px);\n            z-index: 10;\n            opacity: 1;\n            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);\n        }\n\n        .coverflow-item.active .coverflow-caption { opacity: 1; transform: translateY(0); }\n\n        .coverflow-item.prev-1 {\n            transform: translateX(-260px) scale(0.86) translateZ(0px) rotateY(16deg);\n            z-index: 8;\n            opacity: 0.8;\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);\n        }\n\n        .coverflow-item.next-1 {\n            transform: translateX(260px) scale(0.86) translateZ(0px) rotateY(-16deg);\n            z-index: 8;\n            opacity: 0.8;\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);\n        }\n\n        .coverflow-item.prev-2 {\n            transform: translateX(-460px) scale(0.7) translateZ(-120px) rotateY(28deg);\n            z-index: 6;\n            opacity: 0.45;\n        }\n\n        .coverflow-item.next-2 {\n            transform: translateX(460px) scale(0.7) translateZ(-120px) rotateY(-28deg);\n            z-index: 6;\n            opacity: 0.45;\n        }\n\n        .coverflow-item.hidden {\n            transform: translateX(0) scale(0.4) translateZ(-250px);\n            opacity: 0;\n            z-index: 1;\n            pointer-events: none;\n        }\n\n        .coverflow-arrow {\n            position: absolute;\n            top: 50%;\n            transform: translateY(-50%);\n            background: #000000;\n            color: #ffffff;\n            border: none;\n            width: 50px;\n            height: 50px;\n            border-radius: 50%;\n            cursor: pointer;\n            z-index: 20;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            font-size: 1.1rem;\n            box-shadow: 0 6px 16px rgba(0,0,0,0.25);\n            transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);\n        }\n\n        .coverflow-arrow:hover { \n            transform: translateY(-50%) scale(1.12); \n            background-color: var(--title-purple); \n        }\n\n        .coverflow-arrow.prev { left: 30px; }\n        .coverflow-arrow.next { right: 30px; }\n\n        .coverflow-dots {\n            display: flex;\n            justify-content: center;\n            gap: 12px;\n            margin-top: 25px;\n        }\n\n        .cf-dot {\n            width: 10px;\n            height: 10px;\n            border-radius: 50%;\n            background-color: #000000;\n            opacity: 0.3;\n            cursor: pointer;\n            transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);\n        }\n\n        .cf-dot.active {\n            opacity: 1;\n            transform: scale(1.3);\n            background-color: var(--title-purple);\n            box-shadow: 0 0 0 3px rgba(62, 39, 106, 0.25);\n        }\n\n        \/* ================= 5. DETALLES Y FORMULARIO ================= *\/\n        .detalles-form-section {\n            background-color: var(--title-purple);\n            padding: 90px 5%;\n            width: 100vw !important;\n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n        }\n\n        .detalles-form-grid {\n            display: flex;\n            gap: 50px;\n            width: 100%;\n            background: var(--white);\n            border-radius: 12px;\n            box-shadow: 0 15px 35px rgba(0,0,0,0.3);\n            overflow: hidden;\n        }\n\n        .detalles-info-box {\n            flex: 1;\n            padding: 60px 5%;\n            background-color: #F9FAFC;\n            border-right: 1px solid rgba(0,0,0,0.05);\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n        }\n\n        .detalles-info-box h2 {\n            font-family: var(--font-serif);\n            font-size: 2.4rem;\n            color: var(--title-purple);\n            margin-bottom: 30px;\n            text-transform: uppercase;\n        }\n\n        .detalles-list {\n            list-style: none;\n            display: flex;\n            flex-direction: column;\n            gap: 20px;\n        }\n\n        .detalles-list li {\n            font-size: 1.05rem;\n            color: #444;\n            display: flex;\n            align-items: center;\n            gap: 15px;\n        }\n\n        .detalles-list li i {\n            color: var(--title-purple);\n            font-size: 1.3rem;\n            width: 30px;\n        }\n\n        .detalles-form-box {\n            flex: 1.3;\n            padding: 60px 5%;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n        }\n\n        .detalles-form-box h3 {\n            font-family: var(--font-serif);\n            font-size: 1.8rem;\n            color: var(--title-purple);\n            margin-bottom: 25px;\n        }\n\n        .vfm-form { display: flex; flex-direction: column; gap: 18px; }\n        .vfm-form-row { display: flex; gap: 20px; }\n        .vfm-input-group { flex: 1; display: flex; flex-direction: column; gap: 6px; }\n\n        .vfm-input-group label {\n            font-size: 0.75rem;\n            font-weight: 600;\n            color: var(--title-purple);\n            text-transform: uppercase;\n            letter-spacing: 0.5px;\n        }\n\n        .vfm-input-group input, \n        .vfm-input-group textarea {\n            width: 100%;\n            padding: 14px;\n            border: 1px solid #ddd;\n            border-radius: 6px;\n            font-family: var(--font-sans);\n            font-size: 0.95rem;\n            background-color: #F4F5F7;\n            color: #000000 !important;\n            opacity: 1;\n            transition: border-color 0.3s;\n        }\n\n        .vfm-input-group input::placeholder, \n        .vfm-input-group textarea::placeholder {\n            color: #777777 !important;\n            opacity: 0.8;\n        }\n\n        .vfm-input-group input:focus, \n        .vfm-input-group textarea:focus {\n            outline: none;\n            border-color: var(--title-purple);\n            background-color: var(--white);\n        }\n\n        .btn-submit {\n            background-color: var(--title-purple);\n            color: var(--white);\n            margin-top: 10px;\n            align-self: flex-start;\n        }\n        .btn-submit:hover { background-color: var(--primary-navy); }\n\n        \/* ================= 6. UBICACI\u00d3N ================= *\/\n        .ubicacion-section { \n            display: flex; \n            background-color: #ffffff; \n            min-height: 600px; \n            width: 100vw !important; \n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n        }\n        .ubicacion-text { flex: 0 0 45%; padding: 8% 6%; display: flex; flex-direction: column; justify-content: center; }\n        .ubicacion-text h2 { font-family: var(--font-serif); font-size: 3rem; color: var(--title-purple); margin-bottom: 30px; font-weight: 400; line-height: 1.2;}\n        .ubicacion-text p { font-size: 1rem; line-height: 1.8; margin-bottom: 40px; max-width: 500px; color: #555; }\n        .ubicacion-mapa { \n            flex: 1; \n            background-image: url('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2026\/08\/Captura-de-pantalla-2026-08-11-a-las-10.35.30-a.-m.png'); \n            background-size: cover; \n            background-position: center; \n        }\n\n        \/* ================= MODALES ================= *\/\n        .modal {\n            display: none; position: fixed; z-index: 9999; padding-top: 50px; \n            left: 0; top: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.92); \n        }\n        .modal-content { margin: auto; display: block; max-width: 90%; max-height: 85vh; object-fit: contain; }\n        \n        .map-container {\n            margin: auto; width: 90%; max-width: 900px; height: 70vh; \n            background-color: #fff; padding: 5px; border-radius: 8px;\n        }\n        .map-container iframe { width: 100%; height: 100%; border-radius: 4px; }\n        .close { position: absolute; top: 20px; right: 35px; color: #f1f1f1; font-size: 40px; font-weight: bold; cursor: pointer; z-index: 10000; }\n\n        \/* ================= 7. FOOTER ================= *\/\n        .vfm-main-footer {\n            width: 100vw !important;\n            position: relative;\n            left: 50%;\n            right: 50%;\n            margin-left: -50vw !important;\n            margin-right: -50vw !important;\n            background-color: #221C3B; \n            padding: 35px 5% 200px 5% !important; \n            border-top: 1px solid rgba(255, 255, 255, 0.08);\n        }\n        .vfm-footer-container { width: 100%; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding: 0 2%; }\n        .vfm-footer-brand img { height: 65px; object-fit: contain; }\n        .vfm-footer-social { display: flex; align-items: center; gap: 15px; }\n        .vfm-social-title { font-size: 10px; font-weight: 600; letter-spacing: 2px; color: rgba(255, 255, 255, 0.9); }\n        .vfm-social-icons { display: flex; align-items: center; gap: 15px; }\n        .vfm-social-icons a { color: rgba(255, 255, 255, 0.8); transition: color 0.3s; }\n        .vfm-social-icons a:hover { color: #ffffff; }\n        .vfm-footer-nav { display: flex; align-items: center; gap: 25px; }\n        .vfm-footer-nav a { color: rgba(255, 255, 255, 0.8); font-size: 10px; font-weight: 500; letter-spacing: 2px; transition: color 0.3s; }\n        .vfm-footer-nav a:hover { color: #ffffff; }\n        .vfm-footer-copyright { font-size: 10px; color: rgba(255, 255, 255, 0.4); }\n\n        \/* RESPONSIVE *\/\n        @media (max-width: 1024px) {\n            .amenidades-grid-container { flex-direction: column; }\n            .modern-plans-grid { grid-template-columns: repeat(2, 1fr); }\n            .detalles-form-grid { flex-direction: column; }\n            .ubicacion-section { flex-direction: column; }\n            .coverflow-item { width: 380px; height: 280px; }\n            .coverflow-item.prev-1 { transform: translateX(-150px) scale(0.85); }\n            .coverflow-item.next-1 { transform: translateX(150px) scale(0.85); }\n            .coverflow-item.prev-2, .coverflow-item.next-2 { opacity: 0; }\n        }\n        @media (max-width: 768px) {\n            .icons-grid { grid-template-columns: repeat(2, 1fr); }\n            .modern-plans-grid { grid-template-columns: 1fr; }\n            .hero-content h1 { font-size: 3.5rem; }\n            .vfm-form-row { flex-direction: column; }\n            .coverflow-arrow.prev { left: 10px; }\n            .coverflow-arrow.next { right: 10px; }\n            .coverflow-item { width: 280px; height: 220px; }\n            .planos-bar-content { font-size: 0.95rem; text-align: center; }\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <div class=\"vfm-fullpage-wrapper\">\n\n        <!-- 1. HERO -->\n        <section class=\"hero\">\n            <header>\n                <div class=\"logo\">\n                    <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png\" alt=\"Oasis Logo\">\n                <\/div>\n                <div class=\"header-actions\">\n                    <a href=\"#\" id=\"smart-back-btn\" class=\"btn btn-outline-white btn-sm\">\n                        <i class=\"fa-solid fa-arrow-left\" style=\"margin-right: 6px;\"><\/i> Volver\n                    <\/a>\n                <\/div>\n            <\/header>\n            <div class=\"hero-content\">\n                <h1>Oasis On The Bay<\/h1>\n                <p>Oasis on the Bay te invita a ser parte de un ambiente moderno y c\u00f3modo, un llamado a la perfecci\u00f3n. Una zona exclusiva con gran desarrollo inmobiliario.<\/p>\n                <div><a href=\"#detalles\" class=\"btn btn-outline-white\">Ver Detalles del Proyecto<\/a><\/div>\n            <\/div>\n        <\/section>\n\n        <!-- 2. DESCRIPCI\u00d3N + AMENIDADES -->\n        <section id=\"detalles\" class=\"amenidades-section section-light\">\n            <div class=\"amenidades-grid-container\">\n                <div class=\"proyecto-descripcion-col\">\n                    <h2>Vive una Joya Residencial Frente al Mar<\/h2>\n                    <p>Ubicado en la prestigiosa \u00e1rea de Punta Pac\u00edfica, <strong>Oasis On The Bay<\/strong> es una joya residencial de 59 pisos dise\u00f1ada para quienes quieren una aut\u00e9ntica vida frente al mar. A solo unos pasos del coraz\u00f3n de la Ciudad de Panam\u00e1 y al lado del ic\u00f3nico edificio The Ocean Club, este imponente rascacielos ofrece amplias residencias con excelente iluminaci\u00f3n, espacios para toda la familia y amplios balcones privados que ofrecen deslumbrantes vistas panor\u00e1micas al Oc\u00e9ano Pac\u00edfico.<\/p>\n                    <p>Aqu\u00ed, el estilo de vida sofisticado se complementa con amenidades que invitan al descanso y al bienestar, desde su espectacular piscina infinity frente al mar hasta su gimnasio reci\u00e9n remodelado. Adem\u00e1s, los peque\u00f1os tendr\u00e1n \u00e1reas verdes y salones de juego para disfrutar de manera segura. Todo esto, respaldado por una ubicaci\u00f3n privilegiada que conecta en minutos a sus residentes con el centro comercial Multiplaza, hospitales de nivel internacional y una excelente oferta gastron\u00f3mica a pasos del edificio.<\/p>\n                <\/div>\n\n                <div class=\"amenidades-icons-col\">\n                    <h3>Amenidades Exclusivas<\/h3>\n                    <div class=\"icons-grid\">\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-water-ladder\"><\/i><h3>Piscina<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-hot-tub-person\"><\/i><h3>Jacuzzi<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-basketball\"><\/i><h3>Cancha<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-champagne-glasses\"><\/i><h3>Sal\u00f3n de Fiesta<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-dumbbell\"><\/i><h3>Gimnasio<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-bell-concierge\"><\/i><h3>Lobby<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-elevator\"><\/i><h3>Elevadores<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-shield-halved\"><\/i><h3>Vigilancia<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-child-reaching\"><\/i><h3>\u00c1rea Ni\u00f1os<\/h3><\/div>\n                        <div class=\"icon-box\"><i class=\"fa-solid fa-fire-burner\"><\/i><h3>BBQ<\/h3><\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- 3. PLANTAS ARQUITECT\u00d3NICAS (BARRITA DIVISORIA DESPLEGABLE) -->\n        <section class=\"vida-section section-dark\">\n            <!-- BARRA INTERACTIVA A LO LARGO DE LA P\u00c1GINA -->\n            <div class=\"planos-bar-trigger\" id=\"planosBarTrigger\" onclick=\"togglePlanosBar()\">\n                <div class=\"planos-bar-content\">\n                    <span id=\"planosBarText\">Haz clic aqu\u00ed para ver las plantas arquitect\u00f3nicas<\/span>\n                    <i class=\"fa-solid fa-chevron-down\" id=\"planosBarIcon\"><\/i>\n                <\/div>\n            <\/div>\n\n            <!-- CONTENEDOR DESPLEGABLE DE PLANOS -->\n            <div class=\"plan-submodels-wrapper\" id=\"planosContainer\">\n                <div class=\"modern-plans-grid\">\n                    <div class=\"plan-item\" onclick=\"openSingleImageModal('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/03\/OASIS-MODELO-A-FINAL-044.png')\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/03\/OASIS-MODELO-A-FINAL-044.png\" alt=\"Plano General\">\n                        <h4>Plano General<\/h4>\n                    <\/div>\n                    <div class=\"plan-item\" onclick=\"openSingleImageModal('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/1-OASIS-TIPO-A-01.png')\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/1-OASIS-TIPO-A-01.png\" alt=\"Plano Tipo A\">\n                        <h4>Modelo A<\/h4>\n                    <\/div>\n                    <div class=\"plan-item\" onclick=\"openSingleImageModal('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/2-oasis_tipob-01.png')\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/2-oasis_tipob-01.png\" alt=\"Plano Tipo B\">\n                        <h4>Modelo B<\/h4>\n                    <\/div>\n                    <div class=\"plan-item\" onclick=\"openSingleImageModal('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/3-OASIS-TIPOc-01.png')\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/3-OASIS-TIPOc-01.png\" alt=\"Plano Tipo C\">\n                        <h4>Modelo C<\/h4>\n                    <\/div>\n                    <div class=\"plan-item\" onclick=\"openSingleImageModal('https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/3-OASIS-TIPOe-01.png')\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/3-OASIS-TIPOe-01.png\" alt=\"Plano Tipo E\">\n                        <h4>Modelo E<\/h4>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- 4. GALER\u00cdA SLIDER 3D COVERFLOW -->\n        <section class=\"galeria-section section-light\">\n            <div class=\"section-header\">\n                <h2>GALER\u00cdA DEL PROYECTO<\/h2>\n                <p>Explora los espacios de Oasis On The Bay<\/p>\n            <\/div>\n            \n            <div class=\"coverflow-wrapper\">\n                <button class=\"coverflow-arrow prev\" onclick=\"moveCoverflow(-1)\" title=\"Anterior\">\n                    <i class=\"fa-solid fa-chevron-left\"><\/i>\n                <\/button>\n                \n                <button class=\"coverflow-arrow next\" onclick=\"moveCoverflow(1)\" title=\"Siguiente\">\n                    <i class=\"fa-solid fa-chevron-right\"><\/i>\n                <\/button>\n\n                <div class=\"coverflow-slider\" id=\"coverflowSlider\">\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(0)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/02\/LOBBY-OASIS-.jpg\" alt=\"Lobby Oasis\">\n                        <div class=\"coverflow-caption\">Lobby Principal<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(1)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/01\/OASIS-SALA-MODELO-A_Opzd.jpg\" alt=\"Sala Modelo A\">\n                        <div class=\"coverflow-caption\">Sala Principal - Modelo A<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(2)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/01\/OASIS-PANORAMICA-AREA-SOCIAL_Opzd.jpg\" alt=\"\u00c1rea Social Panor\u00e1mica\">\n                        <div class=\"coverflow-caption\">\u00c1rea Social Panor\u00e1mica<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(3)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/02\/GYYM-OASIS.jpeg\" alt=\"Gimnasio\">\n                        <div class=\"coverflow-caption\">Gimnasio Equipado<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(4)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/01\/OASIS-SALA-COMEDOR-MODELO-A_Opzd.jpg\" alt=\"Sala Comedor Modelo A\">\n                        <div class=\"coverflow-caption\">Amplia Sala y Comedor<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(5)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/01\/OASIS-HAB-PPAL-MODELO-A_Opzd.jpg\" alt=\"Habitaci\u00f3n Principal\">\n                        <div class=\"coverflow-caption\">Habitaci\u00f3n Principal con Vista al Mar<\/div>\n                    <\/div>\n                    <div class=\"coverflow-item\" onclick=\"goToCoverflow(6)\">\n                        <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2021\/01\/OASIS-AREA-SOCIAL-1.jpg\" alt=\"\u00c1rea Social\">\n                        <div class=\"coverflow-caption\">Piscina Infinity Frente al Mar<\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <div class=\"coverflow-dots\" id=\"coverflowDots\"><\/div>\n        <\/section>\n\n        <!-- 5. DETALLES Y FORMULARIO -->\n        <section class=\"detalles-form-section section-dark\">\n            <div class=\"detalles-form-grid\">\n                <div class=\"detalles-info-box\">\n                    <h2>Especificaciones<\/h2>\n                    <ul class=\"detalles-list\">\n                        <li><i class=\"fa-solid fa-bed\"><\/i> <strong>Habitaciones:<\/strong> 2 o 3<\/li>\n                        <li><i class=\"fa-solid fa-bath\"><\/i> <strong>Ba\u00f1os:<\/strong> 2 o 3<\/li>\n                        <li><i class=\"fa-solid fa-user-gear\"><\/i> <strong>Habitaci\u00f3n de servicio:<\/strong> Disponible en modelo A<\/li>\n                        <li><i class=\"fa-solid fa-ruler-combined\"><\/i> <strong>Metrajes:<\/strong> 240 m\u00b2, 299 m\u00b2 y 529 m\u00b2<\/li>\n                        <li><i class=\"fa-solid fa-car\"><\/i> <strong>Estacionamientos:<\/strong> 2 por apartamento<\/li>\n                    <\/ul>\n                <\/div>\n\n                <div class=\"detalles-form-box\">\n                    <h3>Recibir m\u00e1s informaci\u00f3n sobre Oasis<\/h3>\n                    <form class=\"vfm-form\" onsubmit=\"sendEmail(event)\">\n                        <div class=\"vfm-form-row\">\n                            <div class=\"vfm-input-group\">\n                                <label for=\"form-nombre\">Nombre *<\/label>\n                                <input type=\"text\" id=\"form-nombre\" required placeholder=\"Tu nombre\">\n                            <\/div>\n                            <div class=\"vfm-input-group\">\n                                <label for=\"form-apellido\">Apellido *<\/label>\n                                <input type=\"text\" id=\"form-apellido\" required placeholder=\"Tu apellido\">\n                            <\/div>\n                        <\/div>\n                        <div class=\"vfm-form-row\">\n                            <div class=\"vfm-input-group\">\n                                <label for=\"form-telefono\">Tel\u00e9fono *<\/label>\n                                <input type=\"tel\" id=\"form-telefono\" required placeholder=\"Ej: +507 6000-0000\">\n                            <\/div>\n                            <div class=\"vfm-input-group\">\n                                <label for=\"form-correo\">Correo *<\/label>\n                                <input type=\"email\" id=\"form-correo\" required placeholder=\"ejemplo@correo.com\">\n                            <\/div>\n                        <\/div>\n                        <div class=\"vfm-input-group\">\n                            <label for=\"form-mensaje\">Mensaje<\/label>\n                            <textarea id=\"form-mensaje\" rows=\"4\" placeholder=\"\u00bfEn qu\u00e9 modelo o metraje est\u00e1s interesado?\"><\/textarea>\n                        <\/div>\n                        <button type=\"submit\" class=\"btn btn-submit\">Enviar Mensaje<\/button>\n                    <\/form>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <!-- 6. UBICACI\u00d3N -->\n        <section class=\"ubicacion-section section-light\">\n            <div class=\"ubicacion-text\">\n                <h2>UBICADO EN<br>PUNTA PAC\u00cdFICA<\/h2>\n                <p>Una zona exclusiva con gran desarrollo inmobiliario, a solo 15 minutos del Aeropuerto Internacional de Tocumen. Disfruta de la cercan\u00eda a centros comerciales, hospitales de primer nivel y la mejor gastronom\u00eda de Panam\u00e1.<\/p>\n                <a href=\"#\" class=\"btn btn-mapa-compact\" onclick=\"openMapModal(event)\">VER MAPA COMPLETO<\/a>\n            <\/div>\n            <div class=\"ubicacion-mapa\"><\/div>\n        <\/section>\n\n        <!-- 7. FOOTER -->\n        <footer class=\"vfm-main-footer\">\n            <div class=\"vfm-footer-container\">\n                <div class=\"vfm-footer-brand\">\n                    <img decoding=\"async\" src=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/10\/ad92598f-af3a-817e-8006-47872548ed72.png\" alt=\"Vivir Frente al Mar\">\n                <\/div>\n                <div class=\"vfm-footer-social\">\n                    <span class=\"vfm-social-title\">S\u00cdGUENOS<\/span>\n                    <div class=\"vfm-social-icons\">\n                        <a href=\"https:\/\/www.instagram.com\/vivirfrentealmar\/\" target=\"_blank\" rel=\"noopener noreferrer\">\n                            <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\"><rect x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\"><\/rect><path d=\"M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z\"><\/path><line x1=\"17.5\" y1=\"6.5\" x2=\"17.51\" y2=\"6.5\"><\/line><\/svg>\n                        <\/a>\n                        <a href=\"https:\/\/www.facebook.com\/VivirFrenteAlMarPanama\" target=\"_blank\" rel=\"noopener noreferrer\">\n                            <svg viewBox=\"0 0 24 24\" width=\"16\" height=\"16\" stroke=\"currentColor\" stroke-width=\"1.5\" fill=\"none\"><path d=\"M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z\"><\/path><\/svg>\n                        <\/a>\n                    <\/div>\n                <\/div>\n                <nav class=\"vfm-footer-nav\">\n                    <a href=\"#\">SOBRE VFM<\/a>\n                    <a href=\"#\">BLOG<\/a>\n                    <a href=\"#\">CONT\u00c1CTANOS<\/a>\n                <\/nav>\n                <div class=\"vfm-footer-copyright\">\n                    \u00a9 2026 VFM. Todos los derechos reservados.\n                <\/div>\n            <\/div>\n        <\/footer>\n\n    <\/div>\n\n    <!-- MODAL DE IM\u00c1GENES -->\n    <div id=\"imageModal\" class=\"modal\" onclick=\"closeImageModal(event)\">\n        <span class=\"close\" onclick=\"closeImageModal(event)\">&times;<\/span>\n        <img class=\"modal-content\" id=\"img01\">\n    <\/div>\n\n    <!-- MODAL DE MAPA -->\n    <div id=\"mapModal\" class=\"modal\" onclick=\"closeMapModal(event)\">\n        <span class=\"close\" onclick=\"closeMapModal(event)\">&times;<\/span>\n        <div class=\"map-container\" onclick=\"event.stopPropagation()\">\n            <iframe src=\"https:\/\/www.google.com\/maps\/embed?pb=!1m18!1m12!1m3!1d3940.970977203583!2d-79.50969012409061!3d8.974817589832966!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8faca91861c97feb%3A0x6990e779ce573098!2sOasis%20on%20the%20Bay!5e0!3m2!1ses-419!2spa!4v1786463882274!5m2!1ses-419!2spa\" style=\"border:0;\" allowfullscreen=\"\" loading=\"lazy\"><\/iframe>\n        <\/div>\n    <\/div>\n\n    <script>\n        \/* === DESPLIEGUE DE BARRITA DIVISORIA DE PLANOS === *\/\n        function togglePlanosBar() {\n            var trigger = document.getElementById('planosBarTrigger');\n            var container = document.getElementById('planosContainer');\n            var text = document.getElementById('planosBarText');\n            \n            if (container.classList.contains('open')) {\n                container.classList.remove('open');\n                trigger.classList.remove('open');\n                text.textContent = 'Haz clic aqu\u00ed para ver las plantas arquitect\u00f3nicas';\n            } else {\n                container.classList.add('open');\n                trigger.classList.add('open');\n                text.textContent = 'Ocultar plantas arquitect\u00f3nicas';\n            }\n        }\n\n        \/* === COVERFLOW 3D === *\/\n        var currentCoverflowIndex = 2; \n        var cfItems = document.querySelectorAll('.coverflow-item');\n        var cfDotsContainer = document.getElementById('coverflowDots');\n\n        cfItems.forEach((_, idx) => {\n            var dot = document.createElement('div');\n            dot.classList.add('cf-dot');\n            dot.addEventListener('click', () => goToCoverflow(idx));\n            cfDotsContainer.appendChild(dot);\n        });\n\n        var cfDots = document.querySelectorAll('.cf-dot');\n\n        function updateCoverflow() {\n            cfItems.forEach((item, idx) => {\n                item.className = 'coverflow-item'; \n\n                var diff = idx - currentCoverflowIndex;\n\n                if (diff === 0) {\n                    item.classList.add('active');\n                } else if (diff === -1) {\n                    item.classList.add('prev-1');\n                } else if (diff === 1) {\n                    item.classList.add('next-1');\n                } else if (diff === -2) {\n                    item.classList.add('prev-2');\n                } else if (diff === 2) {\n                    item.classList.add('next-2');\n                } else {\n                    item.classList.add('hidden');\n                }\n            });\n\n            cfDots.forEach((dot, idx) => {\n                dot.classList.toggle('active', idx === currentCoverflowIndex);\n            });\n        }\n\n        function moveCoverflow(step) {\n            currentCoverflowIndex += step;\n            if (currentCoverflowIndex >= cfItems.length) currentCoverflowIndex = 0;\n            if (currentCoverflowIndex < 0) currentCoverflowIndex = cfItems.length - 1;\n            updateCoverflow();\n        }\n\n        function goToCoverflow(index) {\n            currentCoverflowIndex = index;\n            updateCoverflow();\n        }\n\n        updateCoverflow();\n\n        \/* === MODAL DE PLANOS === *\/\n        var imgModal = document.getElementById(\"imageModal\");\n        var modalImg = document.getElementById(\"img01\");\n\n        function openSingleImageModal(src) {\n            imgModal.style.display = \"block\";\n            modalImg.src = src;\n        }\n\n        function closeImageModal(e) {\n            if (e.target === imgModal || e.target.className === 'close') {\n                imgModal.style.display = \"none\";\n            }\n        }\n\n        \/* === ENV\u00cdO REST API === *\/\n        function sendEmail(event) {\n            event.preventDefault();\n            var submitBtn = event.target.querySelector('button[type=\"submit\"]');\n            var originalText = submitBtn.innerText;\n            submitBtn.innerText = \"Enviando...\";\n            submitBtn.disabled = true;\n\n            var formData = new FormData();\n            formData.append('nombre', document.getElementById('form-nombre').value);\n            formData.append('apellido', document.getElementById('form-apellido').value);\n            formData.append('telefono', document.getElementById('form-telefono').value);\n            formData.append('correo', document.getElementById('form-correo').value);\n            formData.append('mensaje', document.getElementById('form-mensaje').value);\n\n            fetch('https:\/\/vivirfrentealmar.com\/wp-json\/vfm\/v1\/oasis-contacto\/', {\n                method: 'POST',\n                body: formData\n            })\n            .then(response => response.json())\n            .then(data => {\n                if(data.success) {\n                    alert(data.message);\n                    event.target.reset();\n                } else {\n                    alert(\"Atenci\u00f3n: \" + data.message);\n                }\n            })\n            .catch(error => {\n                console.error(\"Error:\", error);\n                alert(\"Ocurri\u00f3 un error de conexi\u00f3n al enviar. Por favor intenta m\u00e1s tarde.\");\n            })\n            .finally(() => {\n                submitBtn.innerText = originalText;\n                submitBtn.disabled = false;\n            });\n        }\n\n        \/* === MAPA Y BOT\u00d3N VOLVER === *\/\n        var mapModal = document.getElementById(\"mapModal\");\n        function openMapModal(e) { e.preventDefault(); mapModal.style.display = \"block\"; }\n        function closeMapModal(e) { if (e.target === mapModal || e.target.className === 'close') mapModal.style.display = \"none\"; }\n\n        document.getElementById('smart-back-btn').addEventListener('click', function(e) {\n            e.preventDefault();\n            if (window.history.length > 1 && document.referrer !== \"\") {\n                window.history.back();\n            } else {\n                window.location.href = 'https:\/\/vivirfrentealmar.com\/';\n            }\n        });\n    <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Oasis On The Bay &#8211; Vivir Frente al Mar Volver Oasis On The Bay Oasis on the Bay te invita a ser parte de un ambiente moderno y c\u00f3modo, un llamado a la perfecci\u00f3n. Una zona exclusiva con gran desarrollo inmobiliario. Ver Detalles del Proyecto Vive una Joya Residencial Frente al Mar Ubicado en la prestigiosa \u00e1rea de Punta Pac\u00edfica, Oasis On The Bay es una joya residencial de 59 pisos dise\u00f1ada para quienes quieren una aut\u00e9ntica vida frente al mar. A solo unos pasos del coraz\u00f3n de la Ciudad de Panam\u00e1 y al lado del ic\u00f3nico edificio The Ocean Club, este imponente rascacielos ofrece amplias residencias con excelente iluminaci\u00f3n, espacios para toda la familia y amplios balcones privados que ofrecen deslumbrantes vistas panor\u00e1micas al Oc\u00e9ano Pac\u00edfico. Aqu\u00ed, el estilo de vida sofisticado se complementa con amenidades que invitan al descanso y al bienestar, desde su espectacular piscina infinity frente al mar hasta su gimnasio reci\u00e9n remodelado. Adem\u00e1s, los peque\u00f1os tendr\u00e1n \u00e1reas verdes y salones de juego para disfrutar de manera segura. Todo esto, respaldado por una ubicaci\u00f3n privilegiada que conecta en minutos a sus residentes con el centro comercial Multiplaza, hospitales de nivel internacional y una excelente oferta gastron\u00f3mica a pasos del edificio. Amenidades Exclusivas Piscina Jacuzzi Cancha Sal\u00f3n de Fiesta Gimnasio Lobby Elevadores Vigilancia \u00c1rea Ni\u00f1os BBQ Haz clic aqu\u00ed para ver las plantas arquitect\u00f3nicas Plano General Modelo A Modelo B Modelo C Modelo E GALER\u00cdA DEL PROYECTO Explora los espacios de Oasis On The Bay Lobby Principal Sala Principal &#8211; Modelo A \u00c1rea Social Panor\u00e1mica Gimnasio Equipado Amplia Sala y Comedor Habitaci\u00f3n Principal con Vista al Mar Piscina Infinity Frente al Mar Especificaciones Habitaciones: 2 o 3 Ba\u00f1os: 2 o 3 Habitaci\u00f3n de servicio: Disponible en modelo A Metrajes: 240 m\u00b2, 299 m\u00b2 y 529 m\u00b2 Estacionamientos: 2 por apartamento Recibir m\u00e1s informaci\u00f3n sobre Oasis Nombre * Apellido * Tel\u00e9fono * Correo * Mensaje Enviar Mensaje UBICADO ENPUNTA PAC\u00cdFICA Una zona exclusiva con gran desarrollo inmobiliario, a solo 15 minutos del Aeropuerto Internacional de Tocumen. Disfruta de la cercan\u00eda a centros comerciales, hospitales de primer nivel y la mejor gastronom\u00eda de Panam\u00e1. VER MAPA COMPLETO S\u00cdGUENOS SOBRE VFM BLOG CONT\u00c1CTANOS \u00a9 2026 VFM. Todos los derechos reservados. &times; &times;<\/p>","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-1134","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Oasis - Vivir Frente al Mar<\/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:\/\/vivirfrentealmar.com\/en\/oasis\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Oasis - Vivir Frente al Mar\" \/>\n<meta property=\"og:description\" content=\"Oasis On The Bay &#8211; Vivir Frente al Mar Volver Oasis On The Bay Oasis on the Bay te invita a ser parte de un ambiente moderno y c\u00f3modo, un llamado a la perfecci\u00f3n. Una zona exclusiva con gran desarrollo inmobiliario. Ver Detalles del Proyecto Vive una Joya Residencial Frente al Mar Ubicado en la prestigiosa \u00e1rea de Punta Pac\u00edfica, Oasis On The Bay es una joya residencial de 59 pisos dise\u00f1ada para quienes quieren una aut\u00e9ntica vida frente al mar. A solo unos pasos del coraz\u00f3n de la Ciudad de Panam\u00e1 y al lado del ic\u00f3nico edificio The Ocean Club, este imponente rascacielos ofrece amplias residencias con excelente iluminaci\u00f3n, espacios para toda la familia y amplios balcones privados que ofrecen deslumbrantes vistas panor\u00e1micas al Oc\u00e9ano Pac\u00edfico. Aqu\u00ed, el estilo de vida sofisticado se complementa con amenidades que invitan al descanso y al bienestar, desde su espectacular piscina infinity frente al mar hasta su gimnasio reci\u00e9n remodelado. Adem\u00e1s, los peque\u00f1os tendr\u00e1n \u00e1reas verdes y salones de juego para disfrutar de manera segura. Todo esto, respaldado por una ubicaci\u00f3n privilegiada que conecta en minutos a sus residentes con el centro comercial Multiplaza, hospitales de nivel internacional y una excelente oferta gastron\u00f3mica a pasos del edificio. Amenidades Exclusivas Piscina Jacuzzi Cancha Sal\u00f3n de Fiesta Gimnasio Lobby Elevadores Vigilancia \u00c1rea Ni\u00f1os BBQ Haz clic aqu\u00ed para ver las plantas arquitect\u00f3nicas Plano General Modelo A Modelo B Modelo C Modelo E GALER\u00cdA DEL PROYECTO Explora los espacios de Oasis On The Bay Lobby Principal Sala Principal &#8211; Modelo A \u00c1rea Social Panor\u00e1mica Gimnasio Equipado Amplia Sala y Comedor Habitaci\u00f3n Principal con Vista al Mar Piscina Infinity Frente al Mar Especificaciones Habitaciones: 2 o 3 Ba\u00f1os: 2 o 3 Habitaci\u00f3n de servicio: Disponible en modelo A Metrajes: 240 m\u00b2, 299 m\u00b2 y 529 m\u00b2 Estacionamientos: 2 por apartamento Recibir m\u00e1s informaci\u00f3n sobre Oasis Nombre * Apellido * Tel\u00e9fono * Correo * Mensaje Enviar Mensaje UBICADO ENPUNTA PAC\u00cdFICA Una zona exclusiva con gran desarrollo inmobiliario, a solo 15 minutos del Aeropuerto Internacional de Tocumen. Disfruta de la cercan\u00eda a centros comerciales, hospitales de primer nivel y la mejor gastronom\u00eda de Panam\u00e1. VER MAPA COMPLETO S\u00cdGUENOS SOBRE VFM BLOG CONT\u00c1CTANOS \u00a9 2026 VFM. Todos los derechos reservados. &times; &times;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/vivirfrentealmar.com\/en\/oasis\/\" \/>\n<meta property=\"og:site_name\" content=\"Vivir Frente al Mar\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/VivirFrenteAlMarPanama\/\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-11T21:38:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/\",\"url\":\"https:\/\/vivirfrentealmar.com\/oasis\/\",\"name\":\"Oasis - Vivir Frente al Mar\",\"isPartOf\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png\",\"datePublished\":\"2021-01-04T22:21:51+00:00\",\"dateModified\":\"2026-08-11T21:38:29+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/vivirfrentealmar.com\/oasis\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage\",\"url\":\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png\",\"contentUrl\":\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/vivirfrentealmar.com\/oasis\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/vivirfrentealmar.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Oasis\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/vivirfrentealmar.com\/#website\",\"url\":\"https:\/\/vivirfrentealmar.com\/\",\"name\":\"Vivir Frente al Mar\",\"description\":\"Proyectos Inmobiliarios\",\"publisher\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/vivirfrentealmar.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/vivirfrentealmar.com\/#organization\",\"name\":\"Vivir Frente al Mar\",\"url\":\"https:\/\/vivirfrentealmar.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/vivirfrentealmar.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/LOGO-2-VIVIR-FRENTE-AL-MAR-01.png\",\"contentUrl\":\"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/LOGO-2-VIVIR-FRENTE-AL-MAR-01.png\",\"width\":4974,\"height\":3865,\"caption\":\"Vivir Frente al Mar\"},\"image\":{\"@id\":\"https:\/\/vivirfrentealmar.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/VivirFrenteAlMarPanama\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Oasis - Vivir Frente al Mar","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:\/\/vivirfrentealmar.com\/en\/oasis\/","og_locale":"en_US","og_type":"article","og_title":"Oasis - Vivir Frente al Mar","og_description":"Oasis On The Bay &#8211; Vivir Frente al Mar Volver Oasis On The Bay Oasis on the Bay te invita a ser parte de un ambiente moderno y c\u00f3modo, un llamado a la perfecci\u00f3n. Una zona exclusiva con gran desarrollo inmobiliario. Ver Detalles del Proyecto Vive una Joya Residencial Frente al Mar Ubicado en la prestigiosa \u00e1rea de Punta Pac\u00edfica, Oasis On The Bay es una joya residencial de 59 pisos dise\u00f1ada para quienes quieren una aut\u00e9ntica vida frente al mar. A solo unos pasos del coraz\u00f3n de la Ciudad de Panam\u00e1 y al lado del ic\u00f3nico edificio The Ocean Club, este imponente rascacielos ofrece amplias residencias con excelente iluminaci\u00f3n, espacios para toda la familia y amplios balcones privados que ofrecen deslumbrantes vistas panor\u00e1micas al Oc\u00e9ano Pac\u00edfico. Aqu\u00ed, el estilo de vida sofisticado se complementa con amenidades que invitan al descanso y al bienestar, desde su espectacular piscina infinity frente al mar hasta su gimnasio reci\u00e9n remodelado. Adem\u00e1s, los peque\u00f1os tendr\u00e1n \u00e1reas verdes y salones de juego para disfrutar de manera segura. Todo esto, respaldado por una ubicaci\u00f3n privilegiada que conecta en minutos a sus residentes con el centro comercial Multiplaza, hospitales de nivel internacional y una excelente oferta gastron\u00f3mica a pasos del edificio. Amenidades Exclusivas Piscina Jacuzzi Cancha Sal\u00f3n de Fiesta Gimnasio Lobby Elevadores Vigilancia \u00c1rea Ni\u00f1os BBQ Haz clic aqu\u00ed para ver las plantas arquitect\u00f3nicas Plano General Modelo A Modelo B Modelo C Modelo E GALER\u00cdA DEL PROYECTO Explora los espacios de Oasis On The Bay Lobby Principal Sala Principal &#8211; Modelo A \u00c1rea Social Panor\u00e1mica Gimnasio Equipado Amplia Sala y Comedor Habitaci\u00f3n Principal con Vista al Mar Piscina Infinity Frente al Mar Especificaciones Habitaciones: 2 o 3 Ba\u00f1os: 2 o 3 Habitaci\u00f3n de servicio: Disponible en modelo A Metrajes: 240 m\u00b2, 299 m\u00b2 y 529 m\u00b2 Estacionamientos: 2 por apartamento Recibir m\u00e1s informaci\u00f3n sobre Oasis Nombre * Apellido * Tel\u00e9fono * Correo * Mensaje Enviar Mensaje UBICADO ENPUNTA PAC\u00cdFICA Una zona exclusiva con gran desarrollo inmobiliario, a solo 15 minutos del Aeropuerto Internacional de Tocumen. Disfruta de la cercan\u00eda a centros comerciales, hospitales de primer nivel y la mejor gastronom\u00eda de Panam\u00e1. VER MAPA COMPLETO S\u00cdGUENOS SOBRE VFM BLOG CONT\u00c1CTANOS \u00a9 2026 VFM. Todos los derechos reservados. &times; &times;","og_url":"https:\/\/vivirfrentealmar.com\/en\/oasis\/","og_site_name":"Vivir Frente al Mar","article_publisher":"https:\/\/www.facebook.com\/VivirFrenteAlMarPanama\/","article_modified_time":"2026-08-11T21:38:29+00:00","og_image":[{"url":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/vivirfrentealmar.com\/oasis\/","url":"https:\/\/vivirfrentealmar.com\/oasis\/","name":"Oasis - Vivir Frente al Mar","isPartOf":{"@id":"https:\/\/vivirfrentealmar.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage"},"image":{"@id":"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage"},"thumbnailUrl":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png","datePublished":"2021-01-04T22:21:51+00:00","dateModified":"2026-08-11T21:38:29+00:00","breadcrumb":{"@id":"https:\/\/vivirfrentealmar.com\/oasis\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/vivirfrentealmar.com\/oasis\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/vivirfrentealmar.com\/oasis\/#primaryimage","url":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png","contentUrl":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/ColorLogo_Oasis.png"},{"@type":"BreadcrumbList","@id":"https:\/\/vivirfrentealmar.com\/oasis\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/vivirfrentealmar.com\/"},{"@type":"ListItem","position":2,"name":"Oasis"}]},{"@type":"WebSite","@id":"https:\/\/vivirfrentealmar.com\/#website","url":"https:\/\/vivirfrentealmar.com\/","name":"Vivir Frente al Mar","description":"Proyectos Inmobiliarios","publisher":{"@id":"https:\/\/vivirfrentealmar.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/vivirfrentealmar.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/vivirfrentealmar.com\/#organization","name":"Vivir Frente al Mar","url":"https:\/\/vivirfrentealmar.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/vivirfrentealmar.com\/#\/schema\/logo\/image\/","url":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/LOGO-2-VIVIR-FRENTE-AL-MAR-01.png","contentUrl":"https:\/\/vivirfrentealmar.com\/wp-content\/uploads\/2020\/11\/LOGO-2-VIVIR-FRENTE-AL-MAR-01.png","width":4974,"height":3865,"caption":"Vivir Frente al Mar"},"image":{"@id":"https:\/\/vivirfrentealmar.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/VivirFrenteAlMarPanama\/"]}]}},"_links":{"self":[{"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/pages\/1134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/comments?post=1134"}],"version-history":[{"count":150,"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/pages\/1134\/revisions"}],"predecessor-version":[{"id":5823,"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/pages\/1134\/revisions\/5823"}],"wp:attachment":[{"href":"https:\/\/vivirfrentealmar.com\/en\/wp-json\/wp\/v2\/media?parent=1134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}