{"id":371,"date":"2025-09-15T10:05:14","date_gmt":"2025-09-15T10:05:14","guid":{"rendered":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/?page_id=371"},"modified":"2026-06-13T10:59:06","modified_gmt":"2026-06-13T10:59:06","slug":"gallery","status":"publish","type":"page","link":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/gallery\/","title":{"rendered":"Gallery"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"371\" class=\"elementor elementor-371\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6b0e4197 e-con-full e-flex e-con e-parent\" data-id=\"6b0e4197\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3d4c80d elementor-widget elementor-widget-heading\" data-id=\"3d4c80d\" 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\">Gallery<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5e535d27 elementor-widget elementor-widget-heading\" data-id=\"5e535d27\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<p class=\"elementor-heading-title elementor-size-default\">A creative hub where cutting-edge<br>\narchitecture meets inspiring interior design. <br>\nWe bring fresh, bold ideas to life\u2014every single time.<\/p>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e83d046 elementor-widget elementor-widget-goarch_gallery\" data-id=\"e83d046\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"goarch_gallery.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t        <style>\r\n            .portfolio-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); \/* Auto responsive columns *\/\r\n    gap: 2rem;\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    padding: 1rem; \/* For spacing on small screens *\/\r\n}\r\n\r\n.architecture-card {\r\n    background: white;\r\n    border-radius: 16px;\r\n    overflow: hidden;\r\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);\r\n    transition: all 0.3s ease;\r\n    cursor: pointer;\r\n    position: relative;\r\n    display: flex;\r\n    flex-direction: column;\r\n}\r\n\r\n.architecture-card:hover {\r\n    transform: translateY(-4px) scale(1.02);\r\n    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);\r\n}\r\n\r\n.card-image {\r\n    width: 100%;\r\n    height: 240px;\r\n    object-fit: cover;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.architecture-card:hover .card-image {\r\n    transform: scale(1.05);\r\n}\r\n\r\n.card-content {\r\n    padding: 1.5rem;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n}\r\n\r\n.card-title {\r\n    font-size: 1.1rem;\r\n    font-weight: 500;\r\n    flex: 1;\r\n    margin-right: 10px;\r\n}\r\n\r\n.arrow-icon {\r\n    width: 16px;\r\n    height: 16px;\r\n    stroke: #666;\r\n    transition: transform 0.3s ease;\r\n}\r\n\r\n.architecture-card:hover .arrow-icon {\r\n    transform: translate(2px, -2px);\r\n}\r\n\r\n\/* Lightbox *\/\r\n.lightbox-overlay {\r\n    display: none;\r\n    position: fixed;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background: rgba(0, 0, 0, 0.8);\r\n    justify-content: center;\r\n    align-items: center;\r\n    z-index: 9999;\r\n}\r\n\r\n.lightbox-overlay img {\r\n    max-width: 90%;\r\n    max-height: 80%;\r\n    border-radius: 8px;\r\n}\r\n\r\n.lightbox-overlay.active {\r\n    display: flex;\r\n}\r\n\r\n\/* Responsive Adjustments *\/\r\n@media (max-width: 1024px) {\r\n    .card-image {\r\n        height: 200px;\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .card-image {\r\n        height: 180px;\r\n    }\r\n\r\n    .card-content {\r\n        padding: 1rem;\r\n    }\r\n\r\n    .card-title {\r\n        font-size: 1rem;\r\n    }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .card-image {\r\n        height: 160px;\r\n    }\r\n\r\n    .card-title {\r\n        font-size: 0.95rem;\r\n    }\r\n\r\n    .portfolio-grid {\r\n        gap: 1rem;\r\n    }\r\n}\r\n\r\n        <\/style>\r\n\r\n        <div class=\"portfolio-grid\">\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Modern-community-library-set-within-a-converted-1920s-power-plant.-Main-reading-hall.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Modern-community-library-set-within-a-converted-1920s-power-plant.-Main-reading-hall.jpg\" alt=\"Modern Communtiy Library\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Modern Communtiy Library<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Asymmetric-modern-residential-facade-with-highly-textural-rammed-earth-primary-.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Asymmetric-modern-residential-facade-with-highly-textural-rammed-earth-primary-.jpg\" alt=\"Modern Residential Facade\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Modern Residential Facade<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/lucid-origin_A_renovated_micro-apartment_in_a_converted_industrial_loft._The_image_captures_t-0.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/lucid-origin_A_renovated_micro-apartment_in_a_converted_industrial_loft._The_image_captures_t-0.jpg\" alt=\"Micro Apartment Converted Industrial Loft\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Micro Apartment Converted Industrial Loft<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/lucid-origin_A_vibrant_office_atrium._A_mature_twenty-foot_olive_tree_grows_upwards_from_a_su-0.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/lucid-origin_A_vibrant_office_atrium._A_mature_twenty-foot_olive_tree_grows_upwards_from_a_su-0.jpg\" alt=\"A Vibrant Office\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">A Vibrant Office<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Industrial-Spaces-into-Offices.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Industrial-Spaces-into-Offices.jpg\" alt=\"Industrial Spaces into Offices\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Industrial Spaces into Offices<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Home-Exteriors.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Home-Exteriors.jpg\" alt=\"Home Exteriors\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Home Exteriors<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Master-Bedroom-Suite.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Master-Bedroom-Suite.jpg\" alt=\"Master Bedroom Suite\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Master Bedroom Suite<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Designing-Clutter.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Designing-Clutter.jpg\" alt=\"Designing Clutter\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Designing Clutter<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                            <div class=\"architecture-card\" data-image=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Focus-with-Paint.jpg\">\r\n                    <img decoding=\"async\" src=\"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-content\/uploads\/2026\/06\/Focus-with-Paint.jpg\" alt=\"Focus with Paint\" class=\"card-image\">\r\n                    <div class=\"card-content\">\r\n                        <span class=\"card-title\">Focus with Paint<\/span>\r\n                        <svg class=\"arrow-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\r\n                            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M7 17L17 7M17 7H7M17 7V17\"\/>\r\n                        <\/svg>\r\n                    <\/div>\r\n                <\/div>\r\n                    <\/div>\r\n\r\n        <!-- Lightbox -->\r\n        <div class=\"lightbox-overlay\">\r\n            <img decoding=\"async\" src=\"\" alt=\"Lightbox Image\">\r\n        <\/div>\r\n\r\n        <script>\r\n        document.addEventListener(\"DOMContentLoaded\", function() {\r\n            const cards = document.querySelectorAll(\".architecture-card\");\r\n            const lightbox = document.querySelector(\".lightbox-overlay\");\r\n            const lightboxImg = lightbox.querySelector(\"img\");\r\n\r\n            cards.forEach(card => {\r\n                card.addEventListener(\"click\", function() {\r\n                    const imgSrc = this.getAttribute(\"data-image\");\r\n                    lightboxImg.src = imgSrc;\r\n                    lightbox.classList.add(\"active\");\r\n                });\r\n            });\r\n\r\n            lightbox.addEventListener(\"click\", function() {\r\n                lightbox.classList.remove(\"active\");\r\n            });\r\n        });\r\n        <\/script>\r\n        \t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Gallery A creative hub where cutting-edge architecture meets inspiring interior design. We bring fresh, bold ideas to life\u2014every single time. Modern Communtiy Library Modern Residential Facade Micro Apartment Converted Industrial Loft A Vibrant Office Industrial Spaces into Offices Home Exteriors Master Bedroom Suite Designing Clutter Focus with Paint<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-371","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/pages\/371","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/comments?post=371"}],"version-history":[{"count":28,"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/pages\/371\/revisions"}],"predecessor-version":[{"id":1641,"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/pages\/371\/revisions\/1641"}],"wp:attachment":[{"href":"https:\/\/theblackpearlspro.com\/goarch\/goarch-demo-3\/wp-json\/wp\/v2\/media?parent=371"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}