{"id":13,"date":"2026-05-26T11:21:43","date_gmt":"2026-05-26T11:21:43","guid":{"rendered":"https:\/\/www.myproteaglen.co.za\/?page_id=13"},"modified":"2026-05-26T12:33:41","modified_gmt":"2026-05-26T12:33:41","slug":"home","status":"publish","type":"page","link":"https:\/\/www.myproteaglen.co.za\/","title":{"rendered":"MPG"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"13\" class=\"elementor elementor-13\">\n\t\t\t\t<div class=\"elementor-element elementor-element-589381c e-flex e-con-boxed e-con e-parent\" data-id=\"589381c\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-03351e2 elementor-widget elementor-widget-html\" data-id=\"03351e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <meta name=\"description\" content=\"MY Protea Glen - Your Community Hub for Housing, Jobs, Businesses, and Local Connections\">\r\n    <meta name=\"keywords\" content=\"Protea Glen, rentals, jobs, businesses, community, Soweto\">\r\n    <meta name=\"author\" content=\"MY Protea Glen\">\r\n    <title>MY Protea Glen - Community Hub | Rentals, Jobs & Opportunities<\/title>\r\n    \r\n    <!-- Google AdSense -->\r\n    <script async src=\"https:\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-6943304898639392\"\r\n     crossorigin=\"anonymous\"><\/script>\r\n    \r\n    <!-- Google Fonts -->\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@700&family=Montserrat:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n    \r\n    <style>\r\n        * {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n        \r\n        :root {\r\n            --primary-blue: #0066FF;\r\n            --dark-navy: #001F5C;\r\n            --light-blue: #4D94FF;\r\n            --white: #FFFFFF;\r\n            --light-gray: #F5F5F5;\r\n            --dark-gray: #333333;\r\n            --border-color: #E0E0E0;\r\n            --success: #4CAF50;\r\n            --warning: #FF9800;\r\n            --error: #F44336;\r\n        }\r\n        \r\n        body {\r\n            font-family: 'Montserrat', sans-serif;\r\n            line-height: 1.6;\r\n            color: var(--dark-gray);\r\n            background-color: var(--white);\r\n        }\r\n        \r\n        \/* Header & Navigation *\/\r\n        header {\r\n            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-navy) 100%);\r\n            color: var(--white);\r\n            padding: 1rem 0;\r\n            position: sticky;\r\n            top: 0;\r\n            z-index: 1000;\r\n            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\r\n        }\r\n        \r\n        .container {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n            padding: 0 20px;\r\n        }\r\n        \r\n        .header-content {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            flex-wrap: wrap;\r\n            gap: 1rem;\r\n        }\r\n        \r\n        .logo {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 0.5rem;\r\n            font-size: 1.5rem;\r\n            font-weight: 700;\r\n            text-decoration: none;\r\n            color: var(--white);\r\n        }\r\n        \r\n        .logo-icon {\r\n            width: 40px;\r\n            height: 40px;\r\n            background: var(--white);\r\n            border-radius: 50%;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: var(--primary-blue);\r\n            font-weight: bold;\r\n            font-size: 1.2rem;\r\n        }\r\n        \r\n        nav ul {\r\n            display: flex;\r\n            list-style: none;\r\n            gap: 2rem;\r\n            flex-wrap: wrap;\r\n            align-items: center;\r\n        }\r\n        \r\n        nav a {\r\n            color: var(--white);\r\n            text-decoration: none;\r\n            font-weight: 600;\r\n            transition: color 0.3s;\r\n            font-size: 0.95rem;\r\n        }\r\n        \r\n        nav a:hover {\r\n            color: var(--light-blue);\r\n        }\r\n        \r\n        .auth-buttons {\r\n            display: flex;\r\n            gap: 1rem;\r\n            align-items: center;\r\n        }\r\n        \r\n        .btn {\r\n            padding: 0.75rem 1.5rem;\r\n            border: none;\r\n            border-radius: 5px;\r\n            font-weight: 600;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n            text-decoration: none;\r\n            display: inline-block;\r\n            font-size: 0.95rem;\r\n        }\r\n        \r\n        .btn-primary {\r\n            background: var(--white);\r\n            color: var(--primary-blue);\r\n        }\r\n        \r\n        .btn-primary:hover {\r\n            background: var(--light-gray);\r\n            transform: translateY(-2px);\r\n        }\r\n        \r\n        .btn-secondary {\r\n            background: var(--light-blue);\r\n            color: var(--white);\r\n        }\r\n        \r\n        .btn-secondary:hover {\r\n            background: var(--primary-blue);\r\n            transform: translateY(-2px);\r\n        }\r\n        \r\n        \/* Hero Section *\/\r\n        .hero {\r\n            background: linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-navy) 100%);\r\n            color: var(--white);\r\n            padding: 80px 20px;\r\n            text-align: center;\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n        \r\n        .hero::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            bottom: 0;\r\n            background: url('data:image\/svg+xml,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 1200 600\"><defs><pattern id=\"grid\" width=\"40\" height=\"40\" patternUnits=\"userSpaceOnUse\"><path d=\"M 40 0 L 0 0 0 40\" fill=\"none\" stroke=\"rgba(255,255,255,0.05)\" stroke-width=\"1\"\/><\/pattern><\/defs><rect width=\"1200\" height=\"600\" fill=\"url(%23grid)\" \/><\/svg>');\r\n            opacity: 0.5;\r\n        }\r\n        \r\n        .hero-content {\r\n            position: relative;\r\n            z-index: 1;\r\n            max-width: 800px;\r\n            margin: 0 auto;\r\n        }\r\n        \r\n        .hero h1 {\r\n            font-family: 'Playfair Display', serif;\r\n            font-size: 3.5rem;\r\n            margin-bottom: 1rem;\r\n            line-height: 1.2;\r\n        }\r\n        \r\n        .hero p {\r\n            font-size: 1.25rem;\r\n            margin-bottom: 2rem;\r\n            opacity: 0.95;\r\n        }\r\n        \r\n        .hero-buttons {\r\n            display: flex;\r\n            gap: 1rem;\r\n            justify-content: center;\r\n            flex-wrap: wrap;\r\n        }\r\n        \r\n        \/* Stats Section *\/\r\n        .stats {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\r\n            gap: 2rem;\r\n            padding: 40px 20px;\r\n            background: var(--light-gray);\r\n        }\r\n        \r\n        .stat-item {\r\n            text-align: center;\r\n        }\r\n        \r\n        .stat-number {\r\n            font-size: 2.5rem;\r\n            font-weight: 700;\r\n            color: var(--primary-blue);\r\n            margin-bottom: 0.5rem;\r\n        }\r\n        \r\n        .stat-label {\r\n            color: var(--dark-gray);\r\n            font-weight: 600;\r\n        }\r\n        \r\n        \/* Features Section *\/\r\n        .features {\r\n            padding: 60px 20px;\r\n        }\r\n        \r\n        .section-title {\r\n            font-family: 'Playfair Display', serif;\r\n            font-size: 2.5rem;\r\n            text-align: center;\r\n            margin-bottom: 3rem;\r\n            color: var(--dark-navy);\r\n        }\r\n        \r\n        .features-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n            gap: 2rem;\r\n            margin-bottom: 3rem;\r\n        }\r\n        \r\n        .feature-card {\r\n            background: var(--light-gray);\r\n            padding: 2rem;\r\n            border-radius: 10px;\r\n            text-align: center;\r\n            transition: all 0.3s;\r\n            border: 2px solid transparent;\r\n        }\r\n        \r\n        .feature-card:hover {\r\n            transform: translateY(-5px);\r\n            border-color: var(--primary-blue);\r\n            box-shadow: 0 10px 30px rgba(0, 102, 255, 0.1);\r\n        }\r\n        \r\n        .feature-icon {\r\n            font-size: 3rem;\r\n            margin-bottom: 1rem;\r\n        }\r\n        \r\n        .feature-card h3 {\r\n            color: var(--dark-navy);\r\n            margin-bottom: 1rem;\r\n            font-size: 1.3rem;\r\n        }\r\n        \r\n        .feature-card p {\r\n            color: var(--dark-gray);\r\n            line-height: 1.6;\r\n        }\r\n        \r\n        \/* Listings Section *\/\r\n        .listings {\r\n            padding: 60px 20px;\r\n            background: var(--light-gray);\r\n        }\r\n        \r\n        .listings-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\r\n            gap: 2rem;\r\n        }\r\n        \r\n        .listing-card {\r\n            background: var(--white);\r\n            border-radius: 10px;\r\n            overflow: hidden;\r\n            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);\r\n            transition: all 0.3s;\r\n        }\r\n        \r\n        .listing-card:hover {\r\n            transform: translateY(-5px);\r\n            box-shadow: 0 8px 25px rgba(0, 102, 255, 0.15);\r\n        }\r\n        \r\n        .listing-image {\r\n            width: 100%;\r\n            height: 200px;\r\n            background: linear-gradient(135deg, var(--primary-blue), var(--light-blue));\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: var(--white);\r\n            font-size: 3rem;\r\n        }\r\n        \r\n        .listing-content {\r\n            padding: 1.5rem;\r\n        }\r\n        \r\n        .listing-title {\r\n            font-weight: 700;\r\n            color: var(--dark-navy);\r\n            margin-bottom: 0.5rem;\r\n            font-size: 1.1rem;\r\n        }\r\n        \r\n        .listing-location {\r\n            color: var(--primary-blue);\r\n            font-size: 0.9rem;\r\n            margin-bottom: 1rem;\r\n        }\r\n        \r\n        .listing-price {\r\n            font-size: 1.5rem;\r\n            font-weight: 700;\r\n            color: var(--primary-blue);\r\n            margin-bottom: 1rem;\r\n        }\r\n        \r\n        .listing-description {\r\n            color: var(--dark-gray);\r\n            font-size: 0.9rem;\r\n            margin-bottom: 1rem;\r\n            line-height: 1.5;\r\n        }\r\n        \r\n        \/* Categories Section *\/\r\n        .categories {\r\n            padding: 60px 20px;\r\n        }\r\n        \r\n        .categories-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\r\n            gap: 1.5rem;\r\n        }\r\n        \r\n        .category-btn {\r\n            padding: 1.5rem;\r\n            border: 2px solid var(--primary-blue);\r\n            background: var(--white);\r\n            color: var(--primary-blue);\r\n            border-radius: 10px;\r\n            font-weight: 700;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n            text-align: center;\r\n            font-size: 1rem;\r\n        }\r\n        \r\n        .category-btn:hover {\r\n            background: var(--primary-blue);\r\n            color: var(--white);\r\n            transform: scale(1.05);\r\n        }\r\n        \r\n        \/* Footer *\/\r\n        footer {\r\n            background: var(--dark-navy);\r\n            color: var(--white);\r\n            padding: 40px 20px;\r\n        }\r\n        \r\n        .footer-content {\r\n            display: grid;\r\n            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\r\n            gap: 2rem;\r\n            margin-bottom: 2rem;\r\n        }\r\n        \r\n        .footer-section h4 {\r\n            margin-bottom: 1rem;\r\n            font-size: 1.1rem;\r\n        }\r\n        \r\n        .footer-section ul {\r\n            list-style: none;\r\n        }\r\n        \r\n        .footer-section a {\r\n            color: var(--light-blue);\r\n            text-decoration: none;\r\n            transition: color 0.3s;\r\n            display: block;\r\n            margin-bottom: 0.5rem;\r\n        }\r\n        \r\n        .footer-section a:hover {\r\n            color: var(--white);\r\n        }\r\n        \r\n        .footer-bottom {\r\n            border-top: 1px solid rgba(255, 255, 255, 0.1);\r\n            padding-top: 2rem;\r\n            text-align: center;\r\n            color: var(--light-blue);\r\n        }\r\n        \r\n        \/* Social Links *\/\r\n        .social-links {\r\n            display: flex;\r\n            gap: 1rem;\r\n            margin-top: 1rem;\r\n        }\r\n        \r\n        .social-link {\r\n            display: inline-flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            width: 40px;\r\n            height: 40px;\r\n            background: var(--primary-blue);\r\n            color: var(--white);\r\n            border-radius: 50%;\r\n            text-decoration: none;\r\n            transition: all 0.3s;\r\n        }\r\n        \r\n        .social-link:hover {\r\n            background: var(--light-blue);\r\n            transform: translateY(-3px);\r\n        }\r\n        \r\n        \/* Search Bar *\/\r\n        .search-bar {\r\n            display: flex;\r\n            gap: 0.5rem;\r\n            margin-bottom: 2rem;\r\n            flex-wrap: wrap;\r\n        }\r\n        \r\n        .search-bar input {\r\n            flex: 1;\r\n            min-width: 200px;\r\n            padding: 0.75rem 1rem;\r\n            border: 2px solid var(--border-color);\r\n            border-radius: 5px;\r\n            font-size: 1rem;\r\n            transition: border-color 0.3s;\r\n        }\r\n        \r\n        .search-bar input:focus {\r\n            outline: none;\r\n            border-color: var(--primary-blue);\r\n        }\r\n        \r\n        .search-bar button {\r\n            padding: 0.75rem 1.5rem;\r\n            background: var(--primary-blue);\r\n            color: var(--white);\r\n            border: none;\r\n            border-radius: 5px;\r\n            font-weight: 600;\r\n            cursor: pointer;\r\n            transition: all 0.3s;\r\n        }\r\n        \r\n        .search-bar button:hover {\r\n            background: var(--dark-navy);\r\n        }\r\n        \r\n        \/* Chat Widget *\/\r\n        .chat-widget {\r\n            position: fixed;\r\n            bottom: 20px;\r\n            right: 20px;\r\n            width: 350px;\r\n            max-height: 500px;\r\n            background: var(--white);\r\n            border-radius: 10px;\r\n            box-shadow: 0 5px 40px rgba(0, 0, 0, 0.16);\r\n            display: flex;\r\n            flex-direction: column;\r\n            z-index: 999;\r\n        }\r\n        \r\n        .chat-header {\r\n            background: linear-gradient(135deg, var(--primary-blue), var(--dark-navy));\r\n            color: var(--white);\r\n            padding: 1rem;\r\n            border-radius: 10px 10px 0 0;\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n        }\r\n        \r\n        .chat-close {\r\n            background: none;\r\n            border: none;\r\n            color: var(--white);\r\n            font-size: 1.5rem;\r\n            cursor: pointer;\r\n        }\r\n        \r\n        .chat-messages {\r\n            flex: 1;\r\n            overflow-y: auto;\r\n            padding: 1rem;\r\n            display: flex;\r\n            flex-direction: column;\r\n            gap: 1rem;\r\n        }\r\n        \r\n        .chat-message {\r\n            padding: 0.75rem 1rem;\r\n            border-radius: 5px;\r\n            max-width: 80%;\r\n        }\r\n        \r\n        .chat-message.bot {\r\n            background: var(--light-gray);\r\n            color: var(--dark-gray);\r\n            align-self: flex-start;\r\n        }\r\n        \r\n        .chat-message.user {\r\n            background: var(--primary-blue);\r\n            color: var(--white);\r\n            align-self: flex-end;\r\n        }\r\n        \r\n        .chat-input {\r\n            padding: 1rem;\r\n            border-top: 1px solid var(--border-color);\r\n            display: flex;\r\n            gap: 0.5rem;\r\n        }\r\n        \r\n        .chat-input input {\r\n            flex: 1;\r\n            padding: 0.5rem;\r\n            border: 1px solid var(--border-color);\r\n            border-radius: 5px;\r\n            font-size: 0.9rem;\r\n        }\r\n        \r\n        .chat-input button {\r\n            padding: 0.5rem 1rem;\r\n            background: var(--primary-blue);\r\n            color: var(--white);\r\n            border: none;\r\n            border-radius: 5px;\r\n            cursor: pointer;\r\n        }\r\n        \r\n        \/* Responsive *\/\r\n        @media (max-width: 768px) {\r\n            .hero h1 {\r\n                font-size: 2rem;\r\n            }\r\n            \r\n            nav ul {\r\n                gap: 1rem;\r\n            }\r\n            \r\n            nav a {\r\n                font-size: 0.85rem;\r\n            }\r\n            \r\n            .hero-buttons {\r\n                flex-direction: column;\r\n            }\r\n            \r\n            .chat-widget {\r\n                width: calc(100% - 40px);\r\n                right: 20px;\r\n                left: 20px;\r\n            }\r\n            \r\n            .header-content {\r\n                flex-direction: column;\r\n                gap: 1rem;\r\n            }\r\n        }\r\n        \r\n        \/* Modal *\/\r\n        .modal {\r\n            display: none;\r\n            position: fixed;\r\n            z-index: 2000;\r\n            left: 0;\r\n            top: 0;\r\n            width: 100%;\r\n            height: 100%;\r\n            background-color: rgba(0, 0, 0, 0.5);\r\n            animation: fadeIn 0.3s;\r\n        }\r\n        \r\n        .modal.active {\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n        }\r\n        \r\n        .modal-content {\r\n            background-color: var(--white);\r\n            padding: 2rem;\r\n            border-radius: 10px;\r\n            width: 90%;\r\n            max-width: 500px;\r\n            animation: slideIn 0.3s;\r\n        }\r\n        \r\n        .modal-close {\r\n            float: right;\r\n            font-size: 2rem;\r\n            font-weight: bold;\r\n            color: var(--dark-gray);\r\n            cursor: pointer;\r\n            transition: color 0.3s;\r\n        }\r\n        \r\n        .modal-close:hover {\r\n            color: var(--primary-blue);\r\n        }\r\n        \r\n        @keyframes fadeIn {\r\n            from { opacity: 0; }\r\n            to { opacity: 1; }\r\n        }\r\n        \r\n        @keyframes slideIn {\r\n            from { transform: translateY(-50px); opacity: 0; }\r\n            to { transform: translateY(0); opacity: 1; }\r\n        }\r\n        \r\n        \/* Form Styles *\/\r\n        .form-group {\r\n            margin-bottom: 1rem;\r\n        }\r\n        \r\n        .form-group label {\r\n            display: block;\r\n            margin-bottom: 0.5rem;\r\n            font-weight: 600;\r\n            color: var(--dark-navy);\r\n        }\r\n        \r\n        .form-group input,\r\n        .form-group textarea,\r\n        .form-group select {\r\n            width: 100%;\r\n            padding: 0.75rem;\r\n            border: 1px solid var(--border-color);\r\n            border-radius: 5px;\r\n            font-family: inherit;\r\n            font-size: 1rem;\r\n        }\r\n        \r\n        .form-group textarea {\r\n            resize: vertical;\r\n            min-height: 100px;\r\n        }\r\n        \r\n        .form-group input:focus,\r\n        .form-group textarea:focus,\r\n        .form-group select:focus {\r\n            outline: none;\r\n            border-color: var(--primary-blue);\r\n            box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <!-- Header -->\r\n    <header>\r\n        <div class=\"container\">\r\n            <div class=\"header-content\">\r\n                <a href=\"#\" class=\"logo\">\r\n                    <div class=\"logo-icon\">MPG<\/div>\r\n                    <span>MY Protea Glen<\/span>\r\n                <\/a>\r\n                <nav>\r\n                    <ul>\r\n                        <li><a href=\"#home\">Home<\/a><\/li>\r\n                        <li><a href=\"#rentals\">Rentals<\/a><\/li>\r\n                        <li><a href=\"#jobs\">Jobs<\/a><\/li>\r\n                        <li><a href=\"#business\">Business<\/a><\/li>\r\n                        <li><a href=\"#community\">Community<\/a><\/li>\r\n                        <li><a href=\"#blog\">Blog<\/a><\/li>\r\n                        <li><a href=\"#contact\">Contact<\/a><\/li>\r\n                    <\/ul>\r\n                <\/nav>\r\n                <div class=\"auth-buttons\">\r\n                    <button class=\"btn btn-primary\" onclick=\"showLoginModal()\">Sign In<\/button>\r\n                    <button class=\"btn btn-secondary\" onclick=\"showSignupModal()\">Sign Up<\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/header>\r\n\r\n    <!-- Hero Section -->\r\n    <section class=\"hero\" id=\"home\">\r\n        <div class=\"hero-content\">\r\n            <h1>Welcome to MY Protea Glen<\/h1>\r\n            <p>Your trusted community hub for housing, jobs, businesses, and local connections. Discover opportunities and connect with your neighbors.<\/p>\r\n            <div class=\"hero-buttons\">\r\n                <button class=\"btn btn-primary\" onclick=\"scrollToSection('rentals')\">Browse Rentals<\/button>\r\n                <button class=\"btn btn-secondary\" onclick=\"scrollToSection('jobs')\">View Jobs<\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Stats Section -->\r\n    <section class=\"stats\">\r\n        <div class=\"stat-item\">\r\n            <div class=\"stat-number\">500+<\/div>\r\n            <div class=\"stat-label\">Active Listings<\/div>\r\n        <\/div>\r\n        <div class=\"stat-item\">\r\n            <div class=\"stat-number\">200+<\/div>\r\n            <div class=\"stat-label\">Businesses<\/div>\r\n        <\/div>\r\n        <div class=\"stat-item\">\r\n            <div class=\"stat-number\">150+<\/div>\r\n            <div class=\"stat-label\">Job Openings<\/div>\r\n        <\/div>\r\n        <div class=\"stat-item\">\r\n            <div class=\"stat-number\">10K+<\/div>\r\n            <div class=\"stat-label\">Community Members<\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Features Section -->\r\n    <section class=\"features\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Why Choose MY Protea Glen?<\/h2>\r\n            <div class=\"features-grid\">\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\u2713<\/div>\r\n                    <h3>Verified Listings<\/h3>\r\n                    <p>All landlords and businesses are verified with ID and proof of residence for your safety.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\u2b50<\/div>\r\n                    <h3>Community Driven<\/h3>\r\n                    <p>Real reviews and ratings from verified community members you can trust.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udccd<\/div>\r\n                    <h3>Location Based<\/h3>\r\n                    <p>Filter by extension to find opportunities near you in Protea Glen.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udd12<\/div>\r\n                    <h3>Secure Transactions<\/h3>\r\n                    <p>Safe and secure booking and payment system with buyer protection.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udcac<\/div>\r\n                    <h3>24\/7 Support<\/h3>\r\n                    <p>Get immediate assistance through our live chat widget available anytime.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\ude80<\/div>\r\n                    <h3>Easy Posting<\/h3>\r\n                    <p>Post your listings, job openings, or business services in minutes.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Categories Section -->\r\n    <section class=\"categories\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Explore Protea Glen<\/h2>\r\n            <div class=\"categories-grid\">\r\n                <button class=\"category-btn\" onclick=\"filterListings('rentals')\">\ud83c\udfe0 Rentals<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('jobs')\">\ud83d\udcbc Jobs<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('internships')\">\ud83c\udf93 Internships<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('learnerships')\">\ud83d\udcda Learnerships<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('bursaries')\">\ud83d\udcb0 Bursaries<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('business')\">\ud83c\udfe2 Business<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('events')\">\ud83c\udf89 Events<\/button>\r\n                <button class=\"category-btn\" onclick=\"filterListings('services')\">\ud83d\udd27 Services<\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Rentals Section -->\r\n    <section class=\"listings\" id=\"rentals\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Featured Rentals<\/h2>\r\n            <div class=\"search-bar\">\r\n                <input type=\"text\" id=\"searchInput\" placeholder=\"Search rentals...\">\r\n                <button onclick=\"searchListings()\">Search<\/button>\r\n            <\/div>\r\n            <div class=\"listings-grid\">\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udfe0<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Modern 2-Bedroom Apartment<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Protea Glen Central<\/div>\r\n                        <div class=\"listing-price\">R3,500\/month<\/div>\r\n                        <div class=\"listing-description\">Spacious apartment with modern amenities, fully furnished kitchen, and secure parking.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showListingDetail('apartment-1')\">View Details<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udfe1<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Spacious 3-Bedroom House<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Extension 5<\/div>\r\n                        <div class=\"listing-price\">R5,200\/month<\/div>\r\n                        <div class=\"listing-description\">Beautiful family home with garden, garage, and modern security features.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showListingDetail('house-1')\">View Details<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udfe2<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Cozy 1-Bedroom Studio<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Extension 2<\/div>\r\n                        <div class=\"listing-price\">R2,000\/month<\/div>\r\n                        <div class=\"listing-description\">Perfect starter apartment with open plan design and modern finishes.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showListingDetail('studio-1')\">View Details<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n            <div style=\"text-align: center; margin-top: 2rem;\">\r\n                <button class=\"btn btn-secondary\" onclick=\"scrollToSection('rentals')\">View All Rentals<\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Jobs Section -->\r\n    <section class=\"listings\" id=\"jobs\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Job Opportunities<\/h2>\r\n            <div class=\"search-bar\">\r\n                <input type=\"text\" placeholder=\"Search jobs...\">\r\n                <button onclick=\"searchListings()\">Search<\/button>\r\n            <\/div>\r\n            <div class=\"listings-grid\">\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\udcbc<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Marketing Manager<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Protea Glen<\/div>\r\n                        <div class=\"listing-price\">Competitive Salary<\/div>\r\n                        <div class=\"listing-description\">Experienced marketing professional needed for growing business. Full-time position.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showJobDetail('job-1')\">Apply Now<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udf93<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Software Developer Internship<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Soweto<\/div>\r\n                        <div class=\"listing-price\">Stipend Provided<\/div>\r\n                        <div class=\"listing-description\">6-month internship for recent graduates. Learn from industry experts.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showJobDetail('job-2')\">Apply Now<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\udcda<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Learnerships - Various Fields<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Multiple Locations<\/div>\r\n                        <div class=\"listing-price\">Fully Funded<\/div>\r\n                        <div class=\"listing-description\">Government-funded learnerships in construction, hospitality, and IT.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showJobDetail('job-3')\">Learn More<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Business Section -->\r\n    <section class=\"listings\" id=\"business\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Local Businesses<\/h2>\r\n            <div class=\"listings-grid\">\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udf7d\ufe0f<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Local Restaurant<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Protea Glen Central<\/div>\r\n                        <div class=\"listing-price\">Open Daily<\/div>\r\n                        <div class=\"listing-description\">Authentic South African cuisine with friendly service and great atmosphere.<\/div>\r\n                        <button class=\"btn btn-primary\">View Menu<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\udc87<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Hair & Beauty Salon<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Extension 3<\/div>\r\n                        <div class=\"listing-price\">Book Now<\/div>\r\n                        <div class=\"listing-description\">Professional hair styling, beauty treatments, and wellness services.<\/div>\r\n                        <button class=\"btn btn-primary\">Book Appointment<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83c\udfcb\ufe0f<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Fitness Center<\/div>\r\n                        <div class=\"listing-location\">\ud83d\udccd Extension 1<\/div>\r\n                        <div class=\"listing-price\">Membership Plans<\/div>\r\n                        <div class=\"listing-description\">Modern gym with personal training, group classes, and wellness programs.<\/div>\r\n                        <button class=\"btn btn-primary\">Join Now<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Community Section -->\r\n    <section class=\"features\" id=\"community\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Community Hub<\/h2>\r\n            <div class=\"features-grid\">\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udcf0<\/div>\r\n                    <h3>Local News<\/h3>\r\n                    <p>Stay updated with the latest news and events happening in Protea Glen.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83c\udf89<\/div>\r\n                    <h3>Events<\/h3>\r\n                    <p>Discover community events, workshops, and networking opportunities.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udc65<\/div>\r\n                    <h3>Networking<\/h3>\r\n                    <p>Connect with other community members and build valuable relationships.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83c\udf93<\/div>\r\n                    <h3>Learning<\/h3>\r\n                    <p>Access educational resources and skill development opportunities.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83d\udcaa<\/div>\r\n                    <h3>Support Groups<\/h3>\r\n                    <p>Join support groups and community initiatives that matter to you.<\/p>\r\n                <\/div>\r\n                <div class=\"feature-card\">\r\n                    <div class=\"feature-icon\">\ud83c\udf1f<\/div>\r\n                    <h3>Success Stories<\/h3>\r\n                    <p>Read inspiring stories from community members who achieved their goals.<\/p>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Blog Section -->\r\n    <section class=\"listings\" id=\"blog\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Latest Blog Posts<\/h2>\r\n            <div class=\"listings-grid\">\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\udcdd<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Tips for Finding Your Perfect Rental<\/div>\r\n                        <div class=\"listing-location\">Posted 2 days ago<\/div>\r\n                        <div class=\"listing-description\">Learn expert tips on how to find the perfect rental property in Protea Glen.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showBlogPost('blog-1')\">Read More<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\udcbc<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Career Development Guide<\/div>\r\n                        <div class=\"listing-location\">Posted 5 days ago<\/div>\r\n                        <div class=\"listing-description\">Comprehensive guide to advancing your career in today's job market.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showBlogPost('blog-2')\">Read More<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"listing-card\">\r\n                    <div class=\"listing-image\">\ud83d\ude80<\/div>\r\n                    <div class=\"listing-content\">\r\n                        <div class=\"listing-title\">Starting Your Own Business<\/div>\r\n                        <div class=\"listing-location\">Posted 1 week ago<\/div>\r\n                        <div class=\"listing-description\">Step-by-step guide to launching your entrepreneurial journey successfully.<\/div>\r\n                        <button class=\"btn btn-primary\" onclick=\"showBlogPost('blog-3')\">Read More<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Contact Section -->\r\n    <section class=\"features\" id=\"contact\">\r\n        <div class=\"container\">\r\n            <h2 class=\"section-title\">Get in Touch<\/h2>\r\n            <div style=\"max-width: 600px; margin: 0 auto;\">\r\n                <form onsubmit=\"handleContactSubmit(event)\">\r\n                    <div class=\"form-group\">\r\n                        <label for=\"name\">Full Name<\/label>\r\n                        <input type=\"text\" id=\"name\" name=\"name\" required>\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"email\">Email Address<\/label>\r\n                        <input type=\"email\" id=\"email\" name=\"email\" required>\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"phone\">Phone Number<\/label>\r\n                        <input type=\"tel\" id=\"phone\" name=\"phone\">\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"subject\">Subject<\/label>\r\n                        <input type=\"text\" id=\"subject\" name=\"subject\" required>\r\n                    <\/div>\r\n                    <div class=\"form-group\">\r\n                        <label for=\"message\">Message<\/label>\r\n                        <textarea id=\"message\" name=\"message\" required><\/textarea>\r\n                    <\/div>\r\n                    <button type=\"submit\" class=\"btn btn-secondary\" style=\"width: 100%;\">Send Message<\/button>\r\n                <\/form>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <!-- Footer -->\r\n    <footer>\r\n        <div class=\"container\">\r\n            <div class=\"footer-content\">\r\n                <div class=\"footer-section\">\r\n                    <h4>MY Protea Glen<\/h4>\r\n                    <p>Connecting the Protea Glen community and empowering local growth.<\/p>\r\n                    <div class=\"social-links\">\r\n                        <a href=\"https:\/\/www.facebook.com\/profile.php?id=100054622231594\" class=\"social-link\" target=\"_blank\">f<\/a>\r\n                        <a href=\"#\" class=\"social-link\">\ud835\udd4f<\/a>\r\n                        <a href=\"#\" class=\"social-link\">\ud83d\udcf7<\/a>\r\n                        <a href=\"#\" class=\"social-link\">\u25b6\ufe0f<\/a>\r\n                    <\/div>\r\n                <\/div>\r\n                <div class=\"footer-section\">\r\n                    <h4>Quick Links<\/h4>\r\n                    <ul>\r\n                        <li><a href=\"#rentals\">Rentals<\/a><\/li>\r\n                        <li><a href=\"#jobs\">Jobs<\/a><\/li>\r\n                        <li><a href=\"#business\">Businesses<\/a><\/li>\r\n                        <li><a href=\"#community\">Community<\/a><\/li>\r\n                        <li><a href=\"#blog\">Blog<\/a><\/li>\r\n                    <\/ul>\r\n                <\/div>\r\n                <div class=\"footer-section\">\r\n                    <h4>Support<\/h4>\r\n                    <ul>\r\n                        <li><a href=\"#contact\">Contact Us<\/a><\/li>\r\n                        <li><a href=\"#\">FAQ<\/a><\/li>\r\n                        <li><a href=\"#\">Safety Tips<\/a><\/li>\r\n                        <li><a href=\"#\">How It Works<\/a><\/li>\r\n                    <\/ul>\r\n                <\/div>\r\n                <div class=\"footer-section\">\r\n                    <h4>Legal<\/h4>\r\n                    <ul>\r\n                        <li><a href=\"#\">Privacy Policy<\/a><\/li>\r\n                        <li><a href=\"#\">Terms of Service<\/a><\/li>\r\n                        <li><a href=\"#\">Cookie Policy<\/a><\/li>\r\n                        <li><a href=\"#\">Disclaimer<\/a><\/li>\r\n                    <\/ul>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"footer-bottom\">\r\n                <p>&copy; 2026 MY Protea Glen. All rights reserved. Empowering Protea Glen Community.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/footer>\r\n\r\n    <!-- Chat Widget -->\r\n    <div class=\"chat-widget\" id=\"chatWidget\">\r\n        <div class=\"chat-header\">\r\n            <span>\ud83d\udcac Chat Support<\/span>\r\n            <button class=\"chat-close\" onclick=\"toggleChat()\">\u00d7<\/button>\r\n        <\/div>\r\n        <div class=\"chat-messages\" id=\"chatMessages\">\r\n            <div class=\"chat-message bot\">\r\n                <strong>Support:<\/strong> Hello! How can we help you today?\r\n            <\/div>\r\n        <\/div>\r\n        <div class=\"chat-input\">\r\n            <input type=\"text\" id=\"chatInput\" placeholder=\"Type your message...\" onkeypress=\"handleChatKeypress(event)\">\r\n            <button onclick=\"sendChatMessage()\">Send<\/button>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- Login Modal -->\r\n    <div class=\"modal\" id=\"loginModal\">\r\n        <div class=\"modal-content\">\r\n            <span class=\"modal-close\" onclick=\"closeModal('loginModal')\">&times;<\/span>\r\n            <h2>Sign In<\/h2>\r\n            <form onsubmit=\"handleLogin(event)\">\r\n                <div class=\"form-group\">\r\n                    <label for=\"loginEmail\">Email<\/label>\r\n                    <input type=\"email\" id=\"loginEmail\" required>\r\n                <\/div>\r\n                <div class=\"form-group\">\r\n                    <label for=\"loginPassword\">Password<\/label>\r\n                    <input type=\"password\" id=\"loginPassword\" required>\r\n                <\/div>\r\n                <button type=\"submit\" class=\"btn btn-secondary\" style=\"width: 100%; margin-bottom: 1rem;\">Sign In<\/button>\r\n                <button type=\"button\" class=\"btn btn-primary\" style=\"width: 100%;\" onclick=\"signInWithGoogle()\">\r\n                    \ud83d\udd35 Sign In with Google\r\n                <\/button>\r\n            <\/form>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- Signup Modal -->\r\n    <div class=\"modal\" id=\"signupModal\">\r\n        <div class=\"modal-content\">\r\n            <span class=\"modal-close\" onclick=\"closeModal('signupModal')\">&times;<\/span>\r\n            <h2>Create Account<\/h2>\r\n            <form onsubmit=\"handleSignup(event)\">\r\n                <div class=\"form-group\">\r\n                    <label for=\"signupName\">Full Name<\/label>\r\n                    <input type=\"text\" id=\"signupName\" required>\r\n                <\/div>\r\n                <div class=\"form-group\">\r\n                    <label for=\"signupEmail\">Email<\/label>\r\n                    <input type=\"email\" id=\"signupEmail\" required>\r\n                <\/div>\r\n                <div class=\"form-group\">\r\n                    <label for=\"signupPassword\">Password<\/label>\r\n                    <input type=\"password\" id=\"signupPassword\" required>\r\n                <\/div>\r\n                <button type=\"submit\" class=\"btn btn-secondary\" style=\"width: 100%; margin-bottom: 1rem;\">Create Account<\/button>\r\n                <button type=\"button\" class=\"btn btn-primary\" style=\"width: 100%;\" onclick=\"signUpWithGoogle()\">\r\n                    \ud83d\udd35 Sign Up with Google\r\n                <\/button>\r\n            <\/form>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        \/\/ Modal Functions\r\n        function showLoginModal() {\r\n            document.getElementById('loginModal').classList.add('active');\r\n        }\r\n\r\n        function showSignupModal() {\r\n            document.getElementById('signupModal').classList.add('active');\r\n        }\r\n\r\n        function closeModal(modalId) {\r\n            document.getElementById(modalId).classList.remove('active');\r\n        }\r\n\r\n        function handleLogin(event) {\r\n            event.preventDefault();\r\n            alert('Login functionality would be implemented with backend authentication');\r\n            closeModal('loginModal');\r\n        }\r\n\r\n        function handleSignup(event) {\r\n            event.preventDefault();\r\n            alert('Signup functionality would be implemented with backend authentication');\r\n            closeModal('signupModal');\r\n        }\r\n\r\n        function signInWithGoogle() {\r\n            alert('Google Sign-In would be implemented with Google OAuth');\r\n        }\r\n\r\n        function signUpWithGoogle() {\r\n            alert('Google Sign-Up would be implemented with Google OAuth');\r\n        }\r\n\r\n        \/\/ Chat Functions\r\n        function toggleChat() {\r\n            const widget = document.getElementById('chatWidget');\r\n            widget.style.display = widget.style.display === 'none' ? 'flex' : 'none';\r\n        }\r\n\r\n        function sendChatMessage() {\r\n            const input = document.getElementById('chatInput');\r\n            const message = input.value.trim();\r\n            if (message) {\r\n                const messagesDiv = document.getElementById('chatMessages');\r\n                \r\n                \/\/ Add user message\r\n                const userMsg = document.createElement('div');\r\n                userMsg.className = 'chat-message user';\r\n                userMsg.textContent = message;\r\n                messagesDiv.appendChild(userMsg);\r\n                \r\n                \/\/ Add bot response\r\n                setTimeout(() => {\r\n                    const botMsg = document.createElement('div');\r\n                    botMsg.className = 'chat-message bot';\r\n                    botMsg.innerHTML = '<strong>Support:<\/strong> Thank you for your message. Our team will respond shortly!';\r\n                    messagesDiv.appendChild(botMsg);\r\n                    messagesDiv.scrollTop = messagesDiv.scrollHeight;\r\n                }, 500);\r\n                \r\n                input.value = '';\r\n                messagesDiv.scrollTop = messagesDiv.scrollHeight;\r\n            }\r\n        }\r\n\r\n        function handleChatKeypress(event) {\r\n            if (event.key === 'Enter') {\r\n                sendChatMessage();\r\n            }\r\n        }\r\n\r\n        \/\/ Listing Functions\r\n        function showListingDetail(id) {\r\n            alert('Listing detail page for: ' + id);\r\n        }\r\n\r\n        function showJobDetail(id) {\r\n            alert('Job detail page for: ' + id);\r\n        }\r\n\r\n        function showBlogPost(id) {\r\n            alert('Blog post for: ' + id);\r\n        }\r\n\r\n        function filterListings(category) {\r\n            alert('Filtering listings by: ' + category);\r\n        }\r\n\r\n        function searchListings() {\r\n            const searchInput = document.getElementById('searchInput');\r\n            if (searchInput && searchInput.value) {\r\n                alert('Searching for: ' + searchInput.value);\r\n            }\r\n        }\r\n\r\n        function scrollToSection(sectionId) {\r\n            const section = document.getElementById(sectionId);\r\n            if (section) {\r\n                section.scrollIntoView({ behavior: 'smooth' });\r\n            }\r\n        }\r\n\r\n        \/\/ Contact Form\r\n        function handleContactSubmit(event) {\r\n            event.preventDefault();\r\n            alert('Thank you for your message! We will get back to you soon.');\r\n            event.target.reset();\r\n        }\r\n\r\n        \/\/ Close modals when clicking outside\r\n        window.onclick = function(event) {\r\n            const loginModal = document.getElementById('loginModal');\r\n            const signupModal = document.getElementById('signupModal');\r\n            \r\n            if (event.target === loginModal) {\r\n                closeModal('loginModal');\r\n            }\r\n            if (event.target === signupModal) {\r\n                closeModal('signupModal');\r\n            }\r\n        }\r\n    <\/script>\r\n<\/body>\r\n<\/html>\r\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>MY Protea Glen &#8211; Community Hub | Rentals, Jobs &#038; Opportunities MPG MY Protea Glen Home Rentals Jobs Business Community Blog Contact Sign In Sign Up Welcome to MY Protea&hellip;<\/p>\n","protected":false},"author":1,"featured_media":16,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-13","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>MPG - My Protea Glen<\/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:\/\/www.myproteaglen.co.za\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"MPG - My Protea Glen\" \/>\n<meta property=\"og:description\" content=\"MY Protea Glen &#8211; Community Hub | Rentals, Jobs &#038; Opportunities MPG MY Protea Glen Home Rentals Jobs Business Community Blog Contact Sign In Sign Up Welcome to MY Protea&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.myproteaglen.co.za\/\" \/>\n<meta property=\"og:site_name\" content=\"My Protea Glen\" \/>\n<meta property=\"article:modified_time\" content=\"2026-05-26T12:33:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/website_header-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1680\" \/>\n\t<meta property=\"og:image:height\" content=\"720\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/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=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\",\"url\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\",\"name\":\"MPG - My Protea Glen\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/website_header-1.png\",\"datePublished\":\"2026-05-26T11:21:43+00:00\",\"dateModified\":\"2026-05-26T12:33:41+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.myproteaglen.co.za\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/website_header-1.png\",\"contentUrl\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/website_header-1.png\",\"width\":1680,\"height\":720,\"caption\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"MPG\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#website\",\"url\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\",\"name\":\"My Protea Glen\",\"description\":\"MPG\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#organization\",\"name\":\"My Protea Glen\",\"url\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/cropped-website_header-1.png\",\"contentUrl\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/cropped-website_header-1.png\",\"width\":1547,\"height\":255,\"caption\":\"My Protea Glen\"},\"image\":{\"@id\":\"https:\\\/\\\/www.myproteaglen.co.za\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"MPG - My Protea Glen","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:\/\/www.myproteaglen.co.za\/","og_locale":"en_US","og_type":"article","og_title":"MPG - My Protea Glen","og_description":"MY Protea Glen &#8211; Community Hub | Rentals, Jobs &#038; Opportunities MPG MY Protea Glen Home Rentals Jobs Business Community Blog Contact Sign In Sign Up Welcome to MY Protea&hellip;","og_url":"https:\/\/www.myproteaglen.co.za\/","og_site_name":"My Protea Glen","article_modified_time":"2026-05-26T12:33:41+00:00","og_image":[{"width":1680,"height":720,"url":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/website_header-1.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.myproteaglen.co.za\/","url":"https:\/\/www.myproteaglen.co.za\/","name":"MPG - My Protea Glen","isPartOf":{"@id":"https:\/\/www.myproteaglen.co.za\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.myproteaglen.co.za\/#primaryimage"},"image":{"@id":"https:\/\/www.myproteaglen.co.za\/#primaryimage"},"thumbnailUrl":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/website_header-1.png","datePublished":"2026-05-26T11:21:43+00:00","dateModified":"2026-05-26T12:33:41+00:00","breadcrumb":{"@id":"https:\/\/www.myproteaglen.co.za\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.myproteaglen.co.za\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.myproteaglen.co.za\/#primaryimage","url":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/website_header-1.png","contentUrl":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/website_header-1.png","width":1680,"height":720,"caption":"https:\/\/www.myproteaglen.co.za\/"},{"@type":"BreadcrumbList","@id":"https:\/\/www.myproteaglen.co.za\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.myproteaglen.co.za\/"},{"@type":"ListItem","position":2,"name":"MPG"}]},{"@type":"WebSite","@id":"https:\/\/www.myproteaglen.co.za\/#website","url":"https:\/\/www.myproteaglen.co.za\/","name":"My Protea Glen","description":"MPG","publisher":{"@id":"https:\/\/www.myproteaglen.co.za\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.myproteaglen.co.za\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.myproteaglen.co.za\/#organization","name":"My Protea Glen","url":"https:\/\/www.myproteaglen.co.za\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.myproteaglen.co.za\/#\/schema\/logo\/image\/","url":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/cropped-website_header-1.png","contentUrl":"https:\/\/www.myproteaglen.co.za\/wp-content\/uploads\/2026\/05\/cropped-website_header-1.png","width":1547,"height":255,"caption":"My Protea Glen"},"image":{"@id":"https:\/\/www.myproteaglen.co.za\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13"}],"version-history":[{"count":8,"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":34,"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions\/34"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=\/wp\/v2\/media\/16"}],"wp:attachment":[{"href":"https:\/\/www.myproteaglen.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}