(112,'real estate company that must some graphics , main colors is black and red , no comparing, -  project','\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Project Portfolio | Visionary Living</title>\n    <style>\n        :root {\n            --primary-black: #222;\n            --primary-red: #8B0000;\n            --accent-light: #f8f8f8;\n            --text-color: #333;\n            --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n            --transition: all 0.3s ease;\n        }\n        \n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n        \n        body {\n            font-family: \'Montserrat\', \'Segoe UI\', Roboto, Arial, sans-serif;\n            line-height: 1.6;\n            color: var(--text-color);\n            overflow-x: hidden;\n            background-color: var(--accent-light);\n        }\n        \n        .container {\n            width: 100%;\n            max-width: 1200px;\n            margin: 0 auto;\n            padding: 0 20px;\n        }\n        \n        /* Header Styles */\n        header {\n            background-color: rgba(255, 255, 255, 0.95);\n            position: fixed;\n            width: 100%;\n            padding: 20px 0;\n            box-shadow: var(--shadow);\n            z-index: 1000;\n        }\n        \n        nav {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n        }\n        \n        .logo {\n            font-family: \'Playfair Display\', Georgia, serif;\n            font-weight: 700;\n            font-size: 1.8rem;\n            color: var(--primary-black);\n            letter-spacing: 1px;\n        }\n        \n        .logo span {\n            color: var(--primary-red);\n        }\n        \n        .nav-links {\n            display: flex;\n            gap: 30px;\n        }\n        \n        .nav-links a {\n            text-decoration: none;\n            color: var(--primary-black);\n            font-weight: 600;\n            transition: var(--transition);\n        }\n        \n        .nav-links a:hover {\n            color: var(--primary-red);\n        }\n        \n        .burger {\n            display: none;\n            cursor: pointer;\n        }\n        \n        .burger div {\n            width: 25px;\n            height: 3px;\n            background-color: var(--primary-black);\n            margin: 5px;\n            transition: var(--transition);\n        }\n        \n        /* Hero Section */\n        .hero {\n            background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), \n                        linear-gradient(45deg, var(--primary-black), var(--primary-red));\n            min-height: 100vh;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            text-align: center;\n            color: white;\n            padding: 150px 0 50px;\n        }\n        \n        .hero-content {\n            max-width: 800px;\n        }\n        \n        .hero h1 {\n            font-size: 3.5rem;\n            margin-bottom: 20px;\n            font-weight: 700;\n            line-height: 1.2;\n        }\n        \n        .hero p {\n            font-size: 1.4rem;\n            margin-bottom: 30px;\n            font-weight: 300;\n        }\n        \n        /* Projects Section */\n        .section {\n            padding: 100px 0;\n        }\n        \n        .section-title {\n            text-align: center;\n            margin-bottom: 60px;\n            position: relative;\n        }\n        \n        .section-title h2 {\n            font-size: 2.8rem;\n            color: var(--primary-black);\n            margin-bottom: 15px;\n            font-family: \'Playfair Display\', serif;\n        }\n        \n        .section-title::after {\n            content: \'\';\n            display: block;\n            width: 80px;\n            height: 4px;\n            background-color: var(--primary-red);\n            margin: 0 auto;\n        }\n        \n        .projects-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));\n            gap: 40px;\n        }\n        \n        .project-card {\n            background-color: white;\n            overflow: hidden;\n            border-radius: 8px;\n            box-shadow: var(--shadow);\n            transition: var(--transition);\n        }\n        \n        .project-card:hover {\n            transform: translateY(-10px);\n            box-shadow: 0 15px 20px rgba(0, 0, 0, 0.1);\n        }\n        \n        .project-image {\n            height: 280px;\n            background-color: #ddd;\n            overflow: hidden;\n            position: relative;\n        }\n        \n        .project-image::before {\n            content: \'Image Placeholder\';\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            height: 100%;\n            font-size: 1.2rem;\n            color: #999;\n        }\n        \n        .project-content {\n            padding: 25px;\n        }\n        \n        .project-content h3 {\n            font-size: 1.8rem;\n            margin-bottom: 15px;\n            color: var(--primary-black);\n        }\n        \n        .project-content p {\n            margin-bottom: 20px;\n            color: #666;\n        }\n        \n        .project-link {\n            display: inline-block;\n            padding: 12px 30px;\n            background-color: var(--primary-red);\n            color: white;\n            text-decoration: none;\n            border-radius: 4px;\n            font-weight: 600;\n            transition: var(--transition);\n            text-transform: uppercase;\n            letter-spacing: 1px;\n            font-size: 0.9rem;\n        }\n        \n        .project-link:hover {\n            background-color: #6a0000;\n            transform: translateY(-3px);\n        }\n        \n        /* About Section */\n        .about {\n            background-color: var(--primary-black);\n            color: white;\n            padding: 100px 0;\n        }\n        \n        .about-content {\n            display: flex;\n            gap: 40px;\n            align-items: center;\n        }\n        \n        .about-text {\n            flex: 1;\n        }\n        \n        .about-text h3 {\n            font-size: 2rem;\n            margin-bottom: 20px;\n        }\n        \n        .about-text p {\n            margin-bottom: 15px;\n            line-height: 1.8;\n        }\n        \n        .about-image {\n            flex: 1;\n            height: 400px;\n            background-color: #333;\n            border-radius: 8px;\n            overflow: hidden;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            color: white;\n        }\n        \n        /* Contact Section */\n        .contact-section {\n            padding: 100px 0;\n            text-align: center;\n        }\n        \n        .contact-container {\n            max-width: 600px;\n            margin: 0 auto;\n        }\n        \n        .contact-form {\n            display: flex;\n            flex-direction: column;\n            gap: 20px;\n        }\n        \n        .form-group {\n            display: flex;\n            flex-direction: column;\n            margin-bottom: 15px;\n        }\n        \n        .form-group label {\n            margin-bottom: 8px;\n            font-weight: 600;\n            color: var(--primary-black);\n        }\n        \n        .form-group input,\n        .form-group textarea {\n            padding: 12px;\n            border: 1px solid #ddd;\n            border-radius: 4px;\n            font-family: inherit;\n            font-size: 1rem;\n            transition: var(--transition);\n        }\n        \n        .form-group input:focus,\n        .form-group textarea:focus {\n            border-color: var(--primary-red);\n            outline: none;\n            box-shadow: 0 0 0 2px rgba(139, 0, 0, 0.2);\n        }\n        \n        .submit-btn {\n            background-color: var(--primary-red);\n            color: white;\n            padding: 15px 40px;\n            border: none;\n            border-radius: 4px;\n            font-size: 1.1rem;\n            font-weight: 600;\n            cursor: pointer;\n            transition: var(--transition);\n            text-transform: uppercase;\n            letter-spacing: 1px;\n        }\n        \n        .submit-btn:hover {\n            background-color: #6a0000;\n            transform: translateY(-3px);\n        }\n        \n        /* Footer */\n        footer {\n            background-color: var(--primary-black);\n            color: white;\n            padding: 50px 0 20px;\n        }\n        \n        .footer-content {\n            display: flex;\n            justify-content: space-between;\n            margin-bottom: 40px;\n        }\n        \n        .footer-section {\n            flex: 1;\n            padding: 0 15px;\n        }\n        \n        .footer-bottom {\n            text-align: center;\n            padding-top: 20px;\n            border-top: 1px solid rgba(255, 255, 255, 0.1);\n        }\n        \n        .social-icons {\n            display: flex;\n            gap: 15px;\n            margin-top: 20px;\n        }\n        \n        .social-icon {\n            display: inline-block;\n            height: 40px;\n            width: 40px;\n            background-color: rgba(255, 255, 255, 0.1);\n            border-radius: 50%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            color: white;\n            text-decoration: none;\n            transition: var(--transition);\n        }\n        \n        .social-icon:hover {\n            background-color: var(--primary-red);\n            transform: translateY(-3px);\n        }\n        \n        /* Responsive Design */\n        @media screen and (max-width: 900px) {\n            .hero h1 {\n                font-size: 2.8rem;\n            }\n            \n            .section-title h2 {\n                font-size: 2.5rem;\n            }\n            \n            .about-content {\n                flex-direction: column;\n            }\n            \n            .footer-content {\n                flex-wrap: wrap;\n                gap: 30px;\n            }\n        }\n        \n        /* Mobile Menu */\n        @media screen and (max-width: 768px) {\n            .burger {\n                display: block;\n            }\n            \n            .nav-links {\n                position: fixed;\n                left: -100%;\n                top: 70px;\n                flex-direction: column;\n                background-color: var(--primary-black);\n                width: 100%;\n                text-align: center;\n                transition: 0.3s;\n                box-shadow: var(--shadow);\n                padding: 20px 0;\n            }\n            \n            .nav-links.active {\n                left: 0;\n            }\n            \n            .nav-links a {\n                padding: 15px 0;\n                font-size: 1.2rem;\n            }\n            \n            .hero h1 {\n                font-size: 2.3rem;\n            }\n            \n            .hero p {\n                font-size: 1.2rem;\n            }\n            \n            .projects-grid {\n                grid-template-columns: 1fr;\n            }\n        }\n    </style>\n</head>\n<body>\n    <!-- Header -->\n    <header>\n        <div class=\"container\">\n            <nav>\n                <div class=\"logo\">Vision<span>Luxury</span></div>\n                <div class=\"burger\">\n                    <div class=\"line1\"></div>\n                    <div class=\"line2\"></div>\n                    <div class=\"line3\"></div>\n                </div>\n                <div class=\"nav-links\">\n                    <a href=\"#\">Home</a>\n                    <a href=\"#\">Projects</a>\n                    <a href=\"#\">Services</a>\n                    <a href=\"#\">About</a>\n                    <a href=\"#\">Contact</a>\n                </div>\n            </nav>\n        </div>\n    </header>\n\n    <!-- Hero Section -->\n    <section class=\"hero\">\n        <div class=\"hero-content\">\n            <h1>Discover Visionary Living</h1>\n            <p>Our Signature Real Estate Projects. Where architectural brilliance meets sophisticated design.</p>\n        </div>\n    </section>\n\n    <!-- Projects Section -->\n    <section class=\"section\">\n        <div class=\"container\">\n            <div class=\"section-title\">\n                <h2>Featured Projects</h2>\n            </div>\n            <div class=\"projects-grid\">\n                <!-- Project Card 1 -->\n                <div class=\"project-card\">\n                    <div class=\"project-image\"></div>\n                    <div class=\"project-content\">\n                        <h3>The Crimson Tower</h3>\n                        <p>A landmark high-rise offering breathtaking cityscapes and world-class amenities.</p>\n                        <a href=\"#\" class=\"project-link\">Explore Project</a>\n                    </div>\n                </div>\n\n                <!-- Project Card 2 -->\n                <div class=\"project-card\">\n                    <div class=\"project-image\"></div>\n                    <div class=\"project-content\">\n                        <h3>Blackwood Estates</h3>\n                        <p>A collection of bespoke homes set amidst lush landscapes for tranquility and refined living.</p>\n                        <a href=\"#\" class=\"project-link\">Explore Project</a>\n                    </div>\n                </div>\n\n                <!-- Project Card 3 -->\n                <div class=\"project-card\">\n                    <div class=\"project-image\"></div>\n                    <div class=\"project-content\">\n                        <h3>Horizon Residences</h3>\n                        <p>Modern luxury living with panoramic views, smart home technology, and unparalleled amenities.</p>\n                        <a href=\"#\" class=\"project-link\">Explore Project</a>\n                    </div>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <!-- About Section -->\n    <section class=\"about\">\n        <div class=\"container\">\n            <div class=\"about-content\">\n                <div class=\"about-text\">\n                    <h3>Our Commitment to Excellence</h3>\n                    <p>At the core of our brand lies a dedication to creating spaces that inspire and endure. Each project is a testament to innovative planning and meticulous execution.</p>\n                    <p>From exclusive residential enclaves to dynamic commercial hubs, our properties are thoughtfully designed to offer unparalleled value and lifestyle enhancements.</p>\n                    <p>Our commitment extends beyond construction; we envision communities and create environments where life flourishes.</p>\n                </div>\n                <div class=\"about-image\">\n                    <!-- Placeholder for about image -->\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <!-- Contact Section -->\n    <section class=\"contact-section\">\n        <div class=\"container\">\n            <div class=\"section-title\">\n                <h2>Get in Touch</h2>\n            </div>\n            <div class=\"contact-container\">\n                <form class=\"contact-form\">\n                    <div class=\"form-group\">\n                        <label for=\"name\">Name</label>\n                        <input type=\"text\" id=\"name\" placeholder=\"Your Name\">\n                    </div>\n                    <div class=\"form-group\">\n                        <label for=\"email\">Email</label>\n                        <input type=\"email\" id=\"email\" placeholder=\"Your Email\">\n                    </div>\n                    <div class=\"form-group\">\n                        <label for=\"message\">Message</label>\n                        <textarea id=\"message\" rows=\"5\" placeholder=\"Your Message\"></textarea>\n                    </div>\n                    <button type=\"submit\" class=\"submit-btn\">Send Message</button>\n                </form>\n            </div>\n        </div>\n    </section>\n\n    <!-- Footer -->\n    <footer>\n        <div class=\"container\">\n            <div class=\"footer-content\">\n                <div class=\"footer-section\">\n                    <h3>VisionLuxury</h3>\n                    <p>Creating exceptional spaces that define modern luxury and architectural innovation.</p>\n                    <div class=\"social-icons\">\n                        <a href=\"#\" class=\"social-icon\">FB</a>\n                        <a href=\"#\" class=\"social-icon\">IG</a>\n                        <a href=\"#\" class=\"social-icon\">TW</a>\n                    </div>\n                </div>\n                <div class=\"footer-section\">\n                    <h3>Quick Links</h3>\n                    <ul>\n                        <li><a href=\"#\">Home</a></li>\n                        <li><a href=\"#\">Projects</a></li>\n                        <li><a href=\"#\">Services</a></li>\n                        <li><a href=\"#\">About</a></li>\n                        <li><a href=\"#\">Contact</a></li>\n                    </ul>\n                </div>\n                <div class=\"footer-section\">\n                    <h3>Contact Us</h3>\n                    <ul>\n                        <li>123 Luxury Avenue, City</li>\n                        <li>+1 (555) 123-4567</li>\n                        <li>info@visionluxury.com</li>\n                    </ul>\n                </div>\n            </div>\n            <div class=\"footer-bottom\">\n                <p>&copy; 2023 VisionLuxury. All rights reserved.</p>\n            </div>\n        </div>\n    </footer>\n\n    <!-- Interaction JS -->\n    <script>\n        // Mobile menu toggle\n        const burger = document.querySelector(\'.burger\');\n        const nav = document.querySelector(\'.nav-links\');\n        const navLinks = document.querySelectorAll(\'.nav-links a\');\n        \n        burger.addEventListener(\'click\', () => {\n            nav.classList.toggle(\'active\');\n            burger.classList.toggle(\'toggle\');\n        });\n        \n        // Close mobile menu when clicking a link\n        navLinks.forEach(link => {\n            link.addEventListener(\'click\', () => {\n                nav.classList.remove(\'active\');\n                burger.classList.remove(\'toggle\');\n            });\n        });\n        \n        // Animated typing effect for hero section\n        const typeWriter = function(txtElement, words, wait = 3000) {\n            this.txtElement = txtElement;\n            this.words = words;\n            this.txt = \'\';\n            this.wordIndex = 0;\n            this.wait = parseInt(wait, 10);\n            this.currWait = 0;\n            this.createTextFromWord(0);\n        }\n        \n        // Type writer (in progress) class function\n        typeWriter.prototype.createTextFromWord = function(idx) {\n            const currentWord = this.words[idx].txt;\n            const currentArrChars = currentWord.split(\'\');\n            \n            this.txt = currentArrChars.slice(0, this.txt.length + 1).join(\'\');\n            this.txtElement.innerHTML = this.txt;\n            \n            setTimeout(() => this.createTextFromWord(idx + 1), this.wait);\n        }\n        \n        // TypeScript\n        document.addEventListener(\'DOMContentLoaded\', () => {\n            // For hero section\n            const txtElement = document.querySelector(\'.hero-content p\');\n            const words = [\n                {\n                    txt: \'Discover Visionary Living: Our Signature Real Estate Projects.\'\n                }\n            ];\n            \n            // Initialize typeWriter\n            const typeWriter = new typeWriter(txtElement, words, 3000);\n        });\n        \n        // Floating project cards on scroll\n        const projectCards = document.querySelectorAll(\'.project-card\');\n        \n        window.addEventListener(\'scroll\', () => {\n            const scrollPosition = window.scrollY + 300;\n            \n            projectCards.forEach((card) => {\n                const cardTop = card.getBoundingClientRect().top;\n                if (scrollPosition > cardTop) {\n                    card.style.opacity = \'1\';\n                    card.style.transform = \'translateY(-10px)\';\n                }\n            });\n        });\n        \n        // Project card animation\n        projectCards.forEach(card => {\n            card.style.opacity = \'0\';\n            card.style.transform = \'translateY(30px)\';\n            card.style.transition = \'opacity 0.5s ease, transform 0.5s ease\';\n        });\n    </script>\n</body>\n</html>\n','','2025-11-20 13:54:28','2025-11-20 13:54:28'),
(113,'real estate company that must some graphics , main colors is black and red , no comparing, -  career','\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Career Opportunities</title>\n    <style>\n        /* Reset and Base Styles */\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n            font-family: \'Segoe UI\', Tahoma, Geneva, Verdana, sans-serif;\n        }\n        \n        html {\n            scroll-behavior: smooth;\n        }\n        \n        body {\n            line-height: 1.6;\n            color: #333;\n            background-color: #f9f9f9;\n        }\n        \n        /* Container */\n        .container {\n            max-width: 1200px;\n            margin: 0 auto;\n            padding: 0 20px;\n        }\n        \n        /* Header */\n        header {\n            background-color: #fff;\n            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n            position: fixed;\n            width: 100%;\n            top: 0;\n            z-index: 1000;\n        }\n        \n        .header-container {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            padding: 15px 20px;\n        }\n        \n        .logo {\n            font-size: 1.8rem;\n            font-weight: bold;\n            color: #2c3e50;\n        }\n        \n        .nav-links {\n            display: flex;\n            list-style: none;\n        }\n        \n        .nav-links li {\n            margin-left: 30px;\n        }\n        \n        .nav-links a {\n            text-decoration: none;\n            color: #2c3e50;\n            font-weight: 500;\n            transition: color 0.3s;\n        }\n        \n        .nav-links a:hover {\n            color: #3498db;\n        }\n        \n        .menu-toggle {\n            display: none;\n            cursor: pointer;\n            font-size: 1.5rem;\n        }\n        \n        /* Hero Section */\n        .hero {\n            background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), \n                        url(\'data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 100 100\"><rect width=\"100\" height=\"100\" fill=\"%232c3e50\"/></svg>\');\n            background-size: cover;\n            background-position: center;\n            color: white;\n            text-align: center;\n            padding: 150px 20px 100px;\n            margin-top: 70px;\n        }\n        \n        .hero h1 {\n            font-size: 3rem;\n            margin-bottom: 20px;\n            font-weight: 700;\n        }\n        \n        .hero p {\n            font-size: 1.2rem;\n            max-width: 800px;\n            margin: 0 auto 40px;\n        }\n        \n        .btn {\n            display: inline-block;\n            background-color: #3498db;\n            color: white;\n            padding: 12px 30px;\n            border-radius: 30px;\n            text-decoration: none;\n            font-weight: bold;\n            transition: all 0.3s;\n            border: none;\n            cursor: pointer;\n        }\n        \n        .btn:hover {\n            background-color: #2980b9;\n            transform: translateY(-3px);\n            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);\n        }\n        \n        /* Sections General */\n        section {\n            padding: 80px 20px;\n        }\n        \n        .section-title {\n            text-align: center;\n            font-size: 2.5rem;\n            margin-bottom: 60px;\n            color: #2c3e50;\n        }\n        \n        /* About Section */\n        .about-content {\n            display: flex;\n            flex-wrap: wrap;\n            justify-content: space-between;\n            gap: 30px;\n            margin-top: 30px;\n        }\n        \n        .about-text {\n            flex: 1 1 300px;\n        }\n        \n        .about-text p {\n            margin-bottom: 20px;\n            font-size: 1.1rem;\n            color: #555;\n        }\n        \n        .values-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n            gap: 30px;\n            margin: 60px 0;\n        }\n        \n        .value-card {\n            background: white;\n            border-radius: 10px;\n            padding: 30px;\n            text-align: center;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);\n            transition: transform 0.3s;\n        }\n        \n        .value-card:hover {\n            transform: translateY(-10px);\n        }\n        \n        .value-card i {\n            font-size: 2.5rem;\n            color: #3498db;\n            margin-bottom: 20px;\n        }\n        \n        /* Hiring Section */\n        .hiring-criteria {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n            gap: 30px;\n        }\n        \n        . Criterion {\n            background: white;\n            padding: 30px;\n            border-radius: 10px;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);\n        }\n        \n        .criterion h3 {\n            margin-bottom: 15px;\n            color: #3498db;\n        }\n        \n        /* Jobs Section */\n        .jobs-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n            gap: 30px;\n        }\n        \n        .job-card {\n            background: white;\n            border-radius: 10px;\n            overflow: hidden;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);\n            transition: all 0.3s;\n            border: 1px solid rgba(0, 0, 0, 0.05);\n        }\n        \n        .job-card:hover {\n            transform: translateY(-5px);\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);\n        }\n        \n        .job-header {\n            background: #3498db;\n            color: white;\n            padding: 20px;\n        }\n        \n        .job-title {\n            font-size: 1.2rem;\n            margin-bottom: 5px;\n        }\n        \n        .job-department {\n            font-size: 0.9rem;\n            opacity: 0.9;\n        }\n        \n        .job-body {\n            padding: 20px;\n        }\n        \n        .job-description {\n            margin-bottom: 15px;\n            font-size: 0.95rem;\n        }\n        \n        .apply-btn {\n            display: block;\n            width: 100%;\n            background: #3498db;\n            color: white;\n            text-align: center;\n            padding: 10px;\n            text-decoration: none;\n            border-radius: 5px;\n            font-weight: bold;\n            margin-top: 20px;\n        }\n        \n        /* Form Section */\n        .contact-form {\n            max-width: 600px;\n            margin: 0 auto;\n            padding: 30px;\n            background: white;\n            border-radius: 10px;\n            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);\n        }\n        \n        .form-group {\n            margin-bottom: 20px;\n        }\n        \n        .form-group label {\n            display: block;\n            margin-bottom: 8px;\n            font-weight: 500;\n        }\n        \n        .form-group input,\n        .form-group textarea {\n            width: 100%;\n            padding: 12px;\n            border: 1px solid #ddd;\n            border-radius: 5px;\n            font-size: 1rem;\n        }\n        \n        .form-group textarea {\n            min-height: 120px;\n            resize: vertical;\n        }\n        \n        /* Footer */\n        footer {\n            background: #2c3e50;\n            color: white;\n            padding: 50px 0 20px;\n        }\n        \n        .footer-container {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n            gap: 40px;\n            margin-bottom: 40px;\n        }\n        \n        .footer-logo {\n            font-size: 1.5rem;\n            font-weight: bold;\n            margin-bottom: 20px;\n        }\n        \n        .footer-links h3 {\n            margin-bottom: 20px;\n            font-size: 1.2rem;\n        }\n        \n        .footer-links ul {\n            list-style: none;\n        }\n        \n        .footer-links li {\n            margin-bottom: 10px;\n        }\n        \n        .footer-links a {\n            color: #ccc;\n            text-decoration: none;\n            transition: color 0.3s;\n        }\n        \n        .footer-links a:hover {\n            color: #3498db;\n        }\n        \n        .social-icons {\n            display: flex;\n            gap: 15px;\n            margin-top: 15px;\n        }\n        \n        .social-icons a {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            width: 40px;\n            height: 40px;\n            background: rgba(255, 255, 255, 0.1);\n            border-radius: 50%;\n            color: white;\n            transition: all 0.3s;\n        }\n        \n        .social-icons a:hover {\n            background: #3498db;\n            transform: translateY(-3px);\n        }\n        \n        .copyright {\n            text-align: center;\n            padding-top: 20px;\n            border-top: 1px solid rgba(255, 255, 255, 0.1);\n            font-size: 0.9rem;\n            color: #aaa;\n        }\n        \n        /* Responsive Styles */\n        @media (max-width: 992px) {\n            .hero h1 {\n                font-size: 2.5rem;\n            }\n            \n            .section-title {\n                font-size: 2rem;\n            }\n        }\n        \n        @media (max-width: 768px) {\n            .menu-toggle {\n                display: block;\n            }\n            \n            .nav-links {\n                position: fixed;\n                top: 70px;\n                right: -100%;\n                background: white;\n                width: 80%;\n                max-width: 300px;\n                height: calc(100vh - 70px);\n                flex-direction: column;\n                align-items: center;\n                padding: 50px 0;\n                transition: right 0.3s;\n                box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);\n            }\n            \n            .nav-links.active {\n                right: 0;\n            }\n            \n            .nav-links li {\n                margin: 15px 0;\n            }\n            \n            .hero {\n                padding: 130px 20px 70px;\n            }\n            \n            .hero h1 {\n                font-size: 2rem;\n            }\n            \n            .hero p {\n                font-size: 1rem;\n            }\n            \n            section {\n                padding: 60px 20px;\n            }\n            \n            .section-title {\n                font-size: 1.8rem;\n            }\n            \n            .about-content {\n                flex-direction: column;\n            }\n        }\n        \n        /* Animation for page load */\n        @keyframes fadeIn {\n            from {\n                opacity: 0;\n                transform: translateY(20px);\n            }\n            to {\n                opacity: 1;\n                transform: translateY(0);\n            }\n        }\n        \n        .animate {\n            animation: fadeIn 0.8s ease forwards;\n        }\n    </style>\n</head>\n<body>\n    <!-- Header -->\n    <header>\n        <div class=\"header-container container\">\n            <div class=\"logo\">RealEstate Partners</div>\n            <div class=\"menu-toggle\">☰</div>\n            <ul class=\"nav-links\">\n                <li><a href=\"#hero\">Home</a></li>\n                <li><a href=\"#about\">About</a></li>\n                <li><a href=\"#careers\">Careers</a></li>\n                <li><a href=\"#contact\">Contact</a></li>\n            </ul>\n        </div>\n    </header>\n\n    <!-- Hero Section -->\n    <section class=\"hero\" id=\"hero\">\n        <div class=\"container\">\n            <h1 class=\"animate\">Forge Your Future with RealEstate Partners</h1>\n            <p class=\"animate\" style=\"animation-delay: 0.3s;\">We don\'t just facilitate transactions; we cultivate dreams, build legacies, and create communities.</p>\n            <a href=\"#jobs\" class=\"btn animate\" style=\"animation-delay: 0.6s;\">Explore Opportunities</a>\n        </div>\n    </section>\n\n    <!-- About Section -->\n    <section id=\"about\" class=\"container\">\n        <h2 class=\"section-title\">A Foundation for Unparalleled Growth and Success</h2>\n        <div class=\"about-content\">\n            <div class=\"about-text\">\n                <p>At RealEstate Partners, joining our team means becoming an integral part of an environment where innovation is celebrated, professional development is paramount, and your individual contributions are deeply valued.</p>\n                <p>Our robust support systems and cutting-edge resources empower you to excel, transforming every challenge into a powerful opportunity for triumph and recognition.</p>\n            </div>\n            <div class=\"values-grid\">\n                <div class=\"value-card\">\n                    <i>🎓</i>\n                    <h3>Continuous Learning</h3>\n                    <p>We provide extensive opportunities for professional development and growth.</p>\n                </div>\n                <div class=\"value-card\">\n                    <i>🚀</i>\n                    <h3>Career Advancement</h3>\n                    <p>Accelerated career paths in a vibrant and competitive market.</p>\n                </div>\n                <div class=\"value-card\">\n                    <i>🏆</i>\n                    <h3>Recognition</h3>\n                    <p>Your hard work and achievements are acknowledged and celebrated.</p>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <!-- Culture Section -->\n    <section class=\"container\">\n        <h2 class=\"section-title Our Culture\">Our Culture: Passion, Precision, and Partnership</h2>\n        <div class=\"about-content\">\n            <div class=\"about-text\">\n                <p>Our distinctive culture is meticulously crafted around a shared passion for real estate, an unwavering dedication to precision in every detail, and an intrinsic sense of partnership among all team members.</p>\n                <p>We foster an inclusive, energetic, and collaborative atmosphere where creativity flourishes, and collective ambition propels us forward. With a clear vision and an inspiring mission, we empower our professionals to consistently deliver exceptional results.</p>\n            </div>\n            <div class=\"values-grid\">\n                <div class=\"value-card\">\n                    <i>❤️</i>\n                    <h3>Inclusive Team</h3>\n                    <p>We celebrate diversity and create a welcoming work environment for all.</p>\n                </div>\n                <div class=\"value-card\">\n                    <i>🎯</i>\n                    <h3>Shared Vision</h3>\n                    <p>Every team member contributes to our collective success and mission.</p>\n                </div>\n                <div class=\"value-card\">\n                    <i>💡</i>\n                    <h3>Innovation</h3>\n                    <p>We encourage creativity and new ideas in everything we do.</p>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <!-- Hiring Section -->\n    <section id=\"hiring\" class=\"container\">\n        <h2 class=\"section-title Who We Are Looking For\" style=\"style: margin-top: 80px;\">Who We Are Looking For</h2>\n        <div class=\"hiring-criteria\">\n            <div class=\"criterion\">\n                <h3>We seek individuals who:</h3>\n                <p>• Embody unwavering integrity and professionalism</p>\n                <p>• Are client-centric and driven by success</p>\n                <p>• Have a passion for real estate</p>\n            </div>\n            <div class=\"criterion\">\n                <h3>Whether you\'re:</h3>\n                <p>• An experienced veteran with years of expertise</p>\n                <p>• A talented professional starting your career</p>\n                <p>• Seeking growth and advancement</p>\n            </div>\n        </div>\n        <p style=\"margin-top: 40px; text-align: center; font-style: italic; color: #666;\">\n            We invite you to join our distinguished team and explore the boundless possibilities with us.\n        </p>\n    </section>\n\n    <!-- Jobs Section -->\n    <section id=\"jobs\" class=\"container\">\n        <h2 class=\"section-title\">Explore Your Next Opportunity</h2>\n        <div class=\"jobs-grid\">\n            <div class=\"job-card\">\n                <div class=\"job-header\">\n                    <h3 class=\"job-title\">Senior Real Estate Agent</h3>\n                    <p class=\"job-department\">Sales & Client Management</p>\n                </div>\n                <div class=\"job-body\">\n                    <p class=\"job-description\">\n                        Experienced agent seeking to leverage extensive client relationships and market knowledge to drive sales and client satisfaction.\n                    </p>\n                    <a href=\"#\" class=\"apply-btn\">Apply Now</a>\n                </div>\n            </div>\n            <div class=\"job-card\">\n                <div class=\"job-header\">\n                    <h3 class=\"job-title\">Commercial Development Manager</h3>\n                    <p class=\"job-department\">Project Management</p>\n                </div>\n                <div class=\"job-body\">\n                    <p class=\"job-description\">\n                        Project lead responsible for overseeing commercial real estate development projects from inception to completion.\n                    </p>\n                    <a href=\"#\" class=\"apply-btn\">Apply Now</a>\n                </div>\n            </div>\n            <div class=\"job-card\">\n                <div class=\"job-header\">\n                    <h3 class=\"job-title\">Market Research Analyst</h3>\n                    <p class=\"job-department\">Business Intelligence</p>\n                </div>\n                <div class=\"job-body\">\n                    <p class=\"job-description\">\n                        Data-driven professional dedicated to analyzing market trends and providing strategic insights for business growth.\n                    </p>\n                    <a href=\"#\" class=\"apply-btn\">Apply Now</a>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <!-- Contact Form -->\n    <section id=\"contact\" class=\"container\">\n        <h2 class=\"section-title\">Have Questions? We\'re Here to Help</h2>\n        <div class=\"contact-form\">\n            <form id=\"career-form\">\n                <div class=\"form-group\">\n                    <label for=\"name\">Full Name</label>\n                    <input type=\"text\" id=\"name\" name=\"name\" required>\n                </div>\n                <div class=\"form-group\">\n                    <label for=\"email\">Email Address</label>\n                    <input type=\"email\" id=\"email\" name=\"email\" required>\n                </div>\n                <div class=\"form-group\">\n                    <label for=\"phone\">Phone Number</label>\n                    <input type=\"tel\" id=\"phone\" name=\"phone\">\n                </div>\n                <div class=\"form-group\">\n                    <label for=\"experience\">Professional Experience</label>\n                    <textarea id=\"experience\" name=\"experience\" placeholder=\"Years of experience and relevant skills...\"></textarea>\n                </div>\n                <div class=\"form-group\">\n                    <label for=\"message\">Cover Letter</label>\n                    <textarea id=\"message\" name=\"message\" placeholder=\"Tell us why you\'re interested in joining RealEstate Partners...\"></textarea>\n                </div>\n                <button type=\"submit\" class=\"btn\" id=\"submit-btn\">Submit Application</button>\n            </form>\n        </div>\n    </section>\n\n    <!-- Footer -->\n    <footer>\n        <div class=\"container\">\n            <div class=\"footer-container\">\n                <div class=\"footer-about\">\n                    <div class=\"footer-logo\">RealEstate Partners</div>\n                    <p style=\"color: #ccc; margin-bottom: 15px;\">Cultivating dreams, building legacies, creating communities.</p>\n                    <div class=\"social-icons\">\n                        <a href=\"#\"><span>📘</span></a>\n                        <a href=\"#\"><span>🐦</span></a>\n                        <a href=\"#\"><span>📸</span></a>\n                        <a href=\"#\"><span>▶️</span></a>\n                    </div>\n                </div>\n                <div class=\"footer-links\">\n                    <h3>Quick Links</h3>\n                    <ul>\n                        <li><a href=\"#hero\">Home</a></li>\n                        <li><a href=\"#about\">About Us</a></li>\n                        <li><a href=\"#careers\">Careers</a></li>\n                        <li><a href=\"#contact\">Contact</a></li>\n                        <li><a href=\"#\">Privacy Policy</a></li>\n                    </ul>\n                </div>\n                <div class=\"footer-links\">\n                    <h3>Career Paths</h3>\n                    <ul>\n                        <li><a href=\"#jobs\">Browse Jobs</a></li>\n                        <li><a href=\"#\">Agent Opportunities</a></li>\n                        <li><a href=\"#\">Management Roles</a></li>\n                        <li><a href=\"#\">Marketing Positions</a></li>\n                        <li><a href=\"#\">Finance & Administration</a></li>\n                    </ul>\n                </div>\n                <div class=\"footer-links\">\n                    <h3>Contact Us</h3>\n                    <ul>\n                        <li>1234 Market St, Suite 500</li>\n                        <li>San Francisco, CA 94103</li>\n                        <li>Phone: (123) 456-7890</li>\n                        <li>Email: careers@realestatepartners.com</li>\n                    </ul>\n                </div>\n            </div>\n            <div class=\"copyright\">\n                &copy; 2023 RealEstate Partners. All rights reserved.\n            </div>\n        </div>\n    </footer>\n\n    <script>\n        // Mobile menu toggle\n        document.addEventListener(\'DOMContentLoaded\', function() {\n            const menuToggle = document.querySelector(\'.menu-toggle\');\n            const navLinks = document.querySelector(\'.nav-links\');\n            \n            if (menuToggle && navLinks) {\n                menuToggle.addEventListener(\'click\', function() {\n                    navLinks.classList.toggle(\'active\');\n                });\n            }\n            \n            // Smooth scrolling for anchor links\n            document.querySelectorAll(\'a[href^=\"#\"]\').forEach(anchor => {\n                anchor.addEventListener(\'click\', function(e) {\n                    e.preventDefault();\n                    \n                    const targetId = this.getAttribute(\'href\');\n                    const targetElement = document.querySelector(targetId);\n                    \n                    if (targetElement) {\n                        document.querySelector(\'html, body\').animate({\n                            scrollTop: targetElement.offsetTop - 80\n                        }, 800);\n                        \n                        // Close mobile menu if open\n                        if (navLinks.classList.contains(\'active\')) {\n                            navLinks.classList.remove(\'active\');\n                        }\n                    }\n                });\n            });\n            \n            // Form submission handling\n            const careerForm = document.getElementById(\'career-form\');\n            \n            if (careerForm) {\n                careerForm.addEventListener(\'submit\', function(e) {\n                    e.preventDefault();\n                    alert(\'Thank you for your interest in joining RealEstate Partners! We will review your application shortly.\');\n                    careerForm.reset();\n                });\n            }\n            \n            // Animation on scroll\n            const animateOnScroll = function() {\n                const elements = document.querySelectorAll(\'.animate\');\n                \n                elements.forEach(element => {\n                    const elementTop = element.getBoundingClientRect().top;\n                    const elementVisible = 150;\n                    \n                    if (elementTop < window.innerHeight - elementVisible) {\n                        element.style.opacity = \'1\';\n                        element.style.transform = \'translateY(0)\';\n                    }\n                });\n            };\n            \n            // Set initial state for scroll animation\n            document.querySelectorAll(\'.animate\').forEach(el => {\n                el.style.opacity = \'0\';\n                el.style.transform = \'translateY(20px)\';\n                el.style.transition = \'opacity 0.6s ease, transform 0.6s ease\';\n            });\n            \n            // Initial check and add scroll event listener\n            window.addEventListener(\'scroll\', animateOnScroll);\n            animateOnScroll(); // Check on initial load\n            \n            // Resize handler for animations\n            window.addEventListener(\'resize\', animateOnScroll);\n        });\n    </script>\n</body>\n</html>\n','','2025-11-20 13:55:28','2025-11-20 13:55:28'),
(114,'real estate company that must some graphics , main colors is black and red , no comparing, -  about us ','','','2025-11-20 13:55:40','2025-11-20 13:55:40'),
(115,'real estate company that must some graphics , main colors is black and red , no comparing, -  services ','\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Services - REDEFINE Real Estate</title>\n    <style>\n        /* Reset & Base Styles */\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n        }\n        body {\n            font-family: \'Segoe UI\', Tahoma, Geneva, Verdana, sans-serif;\n            line-height: 1.6;\n            color: #333;\n            background-color: #f8f9fa;\n        }\n        a {\n            text-decoration: none;\n            color: inherit;\n        }\n\n        /* Typography */\n        h1, h2, h3, h4 {\n            font-weight: 700;\n            line-height: 1.2;\n            margin-bottom: 1rem;\n        }\n        p {\n            margin-bottom: 1.5rem;\n        }\n\n        /* Responsive Layout */\n        .container {\n            width: 100%;\n            max-width: 1200px;\n            margin: 0 auto;\n            padding: 0 20px;\n        }\n        .row {\n            display: flex;\n            flex-wrap: wrap;\n            margin: 0 -15px;\n        }\n        .col {\n            flex: 1;\n            padding: 15px;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n        }\n\n        /* Hero Section */\n        .hero {\n            background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url(\'https://images.unsplash.com/photo-1560448204-603b3fc33ddc?ixlib=rb-1.3.1&auto=format&fit=crop&w=1950&q=80\');\n            background-size: cover;\n            background-position: center;\n            color: white;\n            height: 100vh;\n            display: flex;\n            align-items: center;\n            position: relative;\n        }\n        .hero-content {\n            text-align: center;\n            max-width: 800px;\n            margin: 0 auto;\n            padding: 0 20px;\n            z-index: 1;\n        }\n        .hero h1 {\n            font-size: 3.5rem;\n            margin-bottom: 20px;\n            text-transform: uppercase;\n            letter-spacing: 3px;\n        }\n        .hero p {\n            font-size: 1.5rem;\n            margin-bottom: 30px;\n        }\n\n        /* Service Sections */\n        .service-section {\n            padding: 100px 0;\n            background-color: white;\n        }\n        .service-title {\n            font-size: 2.2rem;\n            text-align: center;\n            margin-bottom: 50px;\n        }\n        .service-text {\n            font-size: 1.1rem;\n            max-width: 800px;\n            margin: 0 auto;\n            text-align: center;\n            color: #555;\n        }\n\n        .service-grid {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));\n            gap: 30px;\n            margin-top: 70px;\n        }\n        .service-card {\n            background-color: #f8f9fa;\n            border-radius: 8px;\n            padding: 40px 30px;\n            box-shadow: 0 10px 30px rgba(0,0,0,0.05);\n            transition: transform 0.3s ease, box-shadow 0.3s ease;\n        }\n        .service-card:hover {\n            transform: translateY(-10px);\n            box-shadow: 0 15px 40px rgba(0,0,0,0.1);\n        }\n        .service-icon {\n            width: 80px;\n            height: 80px;\n            background-color: #ff3a3a;\n            border-radius: 12px;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            margin-bottom: 25px;\n            color: white;\n            font-size: 2rem;\n        }\n        .service-card h3 {\n            font-size: 1.8rem;\n            margin-bottom: 15px;\n        }\n        .service-card p {\n            margin-top: 15px;\n            color: #555;\n        }\n\n        /* CTA Section */\n        .cta {\n            background-color: #f5f5f5;\n            padding: 80px 0;\n            text-align: center;\n        }\n        .cta h2 {\n            font-size: 2.5rem;\n            margin-bottom: 20px;\n            text-transform: uppercase;\n            letter-spacing: 2px;\n        }\n        .cta p {\n            max-width: 700px;\n            margin: 0 auto 40px;\n            font-size: 1.2rem;\n            color: #444;\n        }\n        .cta-btn {\n            display: inline-block;\n            background-color: #ff3a3a;\n            color: white;\n            font-weight: 600;\n            font-size: 1.2rem;\n            padding: 15px 35px;\n            border-radius: 50px;\n            transition: background-color 0.3s ease, transform 0.3s ease;\n            text-transform: uppercase;\n            letter-spacing: 1px;\n            border: none;\n            cursor: pointer;\n        }\n        .cta-btn:hover {\n            background-color: #e23131;\n            transform: scale(1.05);\n        }\n\n        /* Mobile Adjustments */\n        @media (max-width: 768px) {\n            .hero {\n                height: auto;\n                padding: 120px 0;\n                text-align: center;\n                color: white;\n            }\n            .hero h1 {\n                font-size: 2.5rem;\n            }\n            .hero p {\n                font-size: 1.2rem;\n            }\n            .service-section {\n                padding: 50px 0;\n            }\n            .service-grid {\n                grid-template-columns: 1fr;\n            }\n            .service-title {\n                font-size: 1.8rem;\n            }\n            .service-text {\n                font-size: 1rem;\n            }\n        }\n    </style>\n</head>\n<body>\n    <div class=\"hero\">\n        <div class=\"hero-content\">\n            <h1>OUR SERVICES</h1>\n            <p>REDEFINING REAL ESTATE EXCELLENCE</p>\n        </div>\n    </div>\n\n    <section class=\"service-section\">\n        <div class=\"container\">\n            <h2 class=\"service-title\">Residential Sales & Acquisitions</h2>\n            <p class=\"service-text\">Unlock the full potential of your residential real estate ventures with our expert guidance.</p>\n            \n            <div class=\"service-grid\">\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🏠</div>\n                    <h3>Sell Your Home</h3>\n                    <p>Leverage deep market intelligence, innovative marketing strategies, and masterful negotiation skills to ensure your objectives are not just met, but exceeded.</p>\n                </div>\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🔑</div>\n                    <h3>Property Acquisition</h3>\n                    <p>Discover exceptional properties at optimal value. Our team provides an exceptional, personalized service to acquire the home of your dreams.</p>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <section class=\"service-section\" style=\"background-color: #f8f9fa;\">\n        <div class=\"container\">\n            <h2 class=\"service-title\">Commercial Real Estate Solutions</h2>\n            <p class=\"service-text\">Navigate the dynamic world of commercial real estate with a partner you can trust.</p>\n            \n            <div class=\"service-grid\">\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🏢</div>\n                    <h3>Retail Spaces</h3>\n                    <p>Securing prime retail spaces with comprehensive solutions for investors and businesses alike, leveraging market foresight and strategic counsel.</p>\n                </div>\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🏢</div>\n                    <h3>Office Complexes</h3>\n                    <p>Strategic solutions for office complexes, designed for investors seeking optimal returns and long-term success in the commercial market.</p>\n                </div>\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🏭</div>\n                    <h3>Industrial Properties</h3>\n                    <p>Expert handling of industrial properties, connecting investors with opportunities that maximize returns and support business growth.</p>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <section class=\"service-section\">\n        <div class=\"container\">\n            <h2 class=\"service-title\">Property Management Excellence</h2>\n            <p class=\"service-text\">Entrust your valuable real estate assets to our meticulous property management division.</p>\n            \n            <div class=\"service-grid\">\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🔒</div>\n                    <h3>Tenant Relations</h3>\n                    <p>Our proactive approach to tenant relations ensures high satisfaction, compliance, and optimal occupancy rates throughout your property lifecycle.</p>\n                </div>\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">🛠️</div>\n                    <h3>Maintenance & Repairs</h3>\n                    <p>Our maintenance division implements proactive monitoring and timely interventions to preserve property value and prevent costly issues.</p>\n                </div>\n                <div class=\"service-card\">\n                    <div class=\"service-icon\">📊</div>\n                    <h3>Financial Reporting</h3>\n                    <p>Transparent financial reporting simplifies property oversight, delivering clear insights on investment performance and allocation strategies.</p>\n                </div>\n            </div>\n        </div>\n    </section>\n\n    <section class=\"cta\">\n        <div class=\"container\">\n            <h2>READY TO ELEVATE YOUR REAL ESTATE EXPERIENCE?</h2>\n            <p>Connect with our team of dedicated professionals today. Let us demonstrate how our expertise, commitment, and distinctive service can empower your next real estate endeavor.</p>\n            <button class=\"cta-btn\">Schedule Consultation</button>\n        </div>\n    </section>\n\n    <script>\n        document.addEventListener(\'DOMContentLoaded\', function() {\n            // Smooth scrolling for anchor links\n            document.querySelectorAll(\'a[href^=\"#\"]\').forEach(anchor => {\n                anchor.addEventListener(\'click\', function(e) {\n                    e.preventDefault();\n                    const target = document.querySelector(this.getAttribute(\'href\'));\n                    if (target) {\n                        target.scrollIntoView({\n                            behavior: \'smooth\'\n                        });\n                    }\n                });\n            });\n\n            // Sticky header animation\n            const serviceSections = document.querySelectorAll(\'.service-section\');\n            const header = document.querySelector(\'.hero\');\n\n            // Function to update header styles on scroll\n            function updateHeaderOnScroll() {\n                const scrollPosition = window.scrollY;\n                const viewportHeight = window.innerHeight;\n                \n                serviceSections.forEach((section, index) => {\n                    if (scrollPosition >= section.offsetTop - viewportHeight / 3) {\n                        if (index === 0) {\n                            header.classList.add(\'active\');\n                        }\n                    }\n                });\n            }\n\n            // Initial update\n            updateHeaderOnScroll();\n\n            // Add scroll event listener\n            window.addEventListener(\'scroll\', updateHeaderOnScroll);\n        });\n    </script>\n</body>\n</html>\n','','2025-11-20 13:56:12','2025-11-20 13:56:12'),
(116,'real estate company that must some graphics , main colors is black and red , no comparing, -  real estate solutions','','','2025-11-20 13:56:22','2025-11-20 13:56:22'),
(117,'real estate company that must some graphics , main colors is black and red , no comparing, -  Blogs','','','2025-11-20 13:56:30','2025-11-20 13:56:30');

--
-- Table structure for table `user_roles`
--

CREATE TABLE `user_roles` (
  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
  `user_id` bigint(20) unsigned NOT NULL,
  `contactsF` tinyint(1) NOT NULL DEFAULT 0,
  `contactsA` tinyint(1) NOT NULL DEFAULT 0,
  `contactsE` tinyint(1) NOT NULL DEFAULT 0,
  `contactsD` tinyint(1) NOT NULL DEFAULT 0,
  `socialF` tinyint(1) NOT NULL DEFAULT 0,
  `socialA` tinyint(1) NOT NULL DEFAULT 0,
  `socialE` tinyint(1) NOT NULL DEFAULT 0,
  `socialD` tinyint(1) NOT NULL DEFAULT 0,
  `settingsF` tinyint(1) NOT NULL DEFAULT 0,
  `settingsE` tinyint(1) NOT NULL DEFAULT 0,
  `usersF` tinyint(1) NOT NULL DEFAULT 0,
  `usersA` tinyint(1) NOT NULL DEFAULT 0,
  `usersE` tinyint(1) NOT NULL DEFAULT 0,
  `usersD` tinyint(1) NOT NULL DEFAULT 0,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL,
  `contactsP` tinyint(1) NOT NULL DEFAULT 0,
  `dashboard` tinyint(1) NOT NULL DEFAULT 0,
  `pageA` tinyint(1) NOT NULL DEFAULT 0,
  `pageE` tinyint(1) NOT NULL DEFAULT 0,
  `pageD` tinyint(1) NOT NULL DEFAULT 0,
  `pageF` tinyint(1) NOT NULL DEFAULT 0,
  `pageP` tinyint(1) NOT NULL DEFAULT 0,
  `menuA` tinyint(1) NOT NULL DEFAULT 0,
  `menuE` tinyint(1) NOT NULL DEFAULT 0,
  `menuD` tinyint(1) NOT NULL DEFAULT 0,
  `menuF` tinyint(1) NOT NULL DEFAULT 0,
  `headerF` tinyint(1) NOT NULL DEFAULT 0,
  `headerE` tinyint(1) NOT NULL DEFAULT 0,
  `footerF` tinyint(1) NOT NULL DEFAULT 0,
  `languagesF` tinyint(1) NOT NULL DEFAULT 0,
  `languagesE` tinyint(1) NOT NULL DEFAULT 0,
  `languagesD` tinyint(1) NOT NULL DEFAULT 0,
  `languagesA` tinyint(1) NOT NULL DEFAULT 0,
  `templatesF` tinyint(1) NOT NULL DEFAULT 0,
  `templatesE` tinyint(1) NOT NULL DEFAULT 0,
  `templatesA` tinyint(1) NOT NULL DEFAULT 0,
  `templatesD` tinyint(1) NOT NULL DEFAULT 0,
  `backup` tinyint(1) NOT NULL DEFAULT 0,
  `underConstructionF` tinyint(1) NOT NULL DEFAULT 0,
  PRIMARY KEY (`id`),
  KEY `user_roles_user_id_foreign` (`user_id`)
) ENGINE=MyISAM AUTO_INCREMENT=52 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

--
-- Dumping data for table `user_roles`
--

INSERT INTO `user_roles` VALUES
(21,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,'2025-05-09 12:17:17','2025-05-09 12:17:17',1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(19,2,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:36:34','2025-04-04 11:36:34',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(50,3,0,0,0,0,0,0,0,0,1,1,1,1,1,1,'2025-09-26 14:40:00','2025-09-26 14:40:00',0,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),
(9,4,1,1,1,1,1,1,1,1,1,1,1,1,1,1,'2025-04-04 11:20:29','2025-04-04 11:20:29',1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(24,5,1,1,1,1,1,1,1,1,1,1,1,1,1,1,'2025-05-09 15:41:53','2025-05-09 15:41:53',1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(13,6,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:29:09','2025-04-04 11:29:09',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(14,7,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:30:56','2025-04-04 11:30:56',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(15,8,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:32:23','2025-04-04 11:32:23',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(16,9,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:33:30','2025-04-04 11:33:30',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(51,10,0,0,0,0,0,0,0,0,1,1,1,1,1,1,'2025-09-26 14:40:35','2025-09-26 14:40:35',0,0,1,1,1,1,0,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1),
(18,11,1,1,0,0,0,0,0,0,0,0,0,0,0,0,'2025-04-04 11:36:19','2025-04-04 11:36:19',0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0);

--
-- Table structure for table `users`
--

CREATE TABLE `users` (
  `id` bigint(20) unsigned NOT NULL AUTO_INCREMENT,
  `name` varchar(255) NOT NULL,
  `email` varchar(255) NOT NULL,
  `email_verified_at` timestamp NULL DEFAULT NULL,
  `password` varchar(255) NOT NULL,
  `remember_token` varchar(100) DEFAULT NULL,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL,
  `status` tinyint(1) NOT NULL DEFAULT 1,
  `managed_profiles` text NOT NULL DEFAULT '',
  PRIMARY KEY (`id`),
  UNIQUE KEY `users_email_unique` (`email`)
) ENGINE=InnoDB AUTO_INCREMENT=13 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

--
-- Dumping data for table `users`
--

INSERT INTO `users` VALUES
(1,'Admin','admin@gmail.com',NULL,'$2y$12$mioaL6ckJIKsBf4RYx3TR.UEXjtTHejd3L3mnXnw.5U1iJT3Cfl46',NULL,NULL,'2025-05-09 11:58:34',1,'1,55,56,58,59,60,61,62,63,64,220'),
(2,'Safa Chehab','safa@twister.tech',NULL,'$2y$12$LW8mfNfNz9ZLSsgzZ8T6Iuis9.diHep4R1h1NjibIJbFfOOWlDExK',NULL,'2025-03-20 11:40:05','2025-04-04 11:36:34',1,''),
(3,'Omar Itani','oitani@twister.tech',NULL,'$2y$12$9J9vUjLwSWhvUEipl0OCm.EuC14FK08hdVX3OUbmbjQcjeY8iCxlW',NULL,'2025-03-29 13:51:38','2025-04-04 11:21:46',1,''),
(4,'Mohamed Sabra','mohamedsabra@twister.tech',NULL,'$2y$12$1By0GbEz60bb0iIPm90YCeWxiLLZYZi0t0SbMGt7LAR2sTiwGeW62',NULL,'2025-04-04 11:20:29','2025-04-04 11:20:29',1,''),
(5,'Jad Farshukh','jadfarshuk@twister.tech',NULL,'$2y$12$meWxehWNt6YZaisDHcYNKuSglcIe6opMOaV1vm3NF/ZQtBaIq3Dze',NULL,'2025-04-04 11:27:33','2025-05-09 15:41:53',1,''),
(6,'Ola Hariri','ola@twister.tech',NULL,'$2y$12$Lqx6KLYos0pSs3GHuuLuouW.1uB6ond01EGvbjM9IOktrmX2SxpNG',NULL,'2025-04-04 11:29:09','2025-04-04 11:29:09',1,''),
(7,'Tarek Halawi','t.halawi@twister.tech',NULL,'$2y$12$SHQY.xIf/se9mDZ974DqyOx3vsXhWTeYoa3RAoP8rLvksqCnHDn9y',NULL,'2025-04-04 11:30:56','2025-04-04 11:30:56',1,''),
(8,'Arij Mougharbel','arij@twister.tech',NULL,'$2y$12$833D4rNQViB1aiD32T3SeOjfCnzKWHysE5Xf0q/.EtJmJNvAAyLLi',NULL,'2025-04-04 11:32:23','2025-04-04 11:32:23',1,''),
(9,'Dalin Dib','dalin@twister.tech',NULL,'$2y$12$ExJAVe.EcF0FZam73/HeEOf7415fKIfqPNjkHq/k9ulCmFws9.SCm',NULL,'2025-04-04 11:33:30','2025-04-04 11:33:30',1,''),
(10,'Mohammad Itani','mitani@twister.tech',NULL,'$2y$12$cjx9xqiNshl6I7iIohpi5O9AmUCEr1MFHUGnz9VRkaqKWaRb2Qu6e','zu81dnaRnnYnZMaGr6wsKgmEGmJj03UYdvEPtzbTrd8aDbjPAQ6HHlgCdKEW','2025-04-04 11:34:38','2025-06-30 10:02:38',1,'220'),
(11,'Mawada Zaatarieh','mawada@twister.tech',NULL,'$2y$12$eRc0hXX9Ewylm/utIURIYeMq03eeoUdLv5mHysB6eAyb5h5AMgK/2',NULL,'2025-04-04 11:36:19','2025-04-04 11:36:19',1,''),
(12,'Test User','test@example.com','2025-06-30 10:42:19','$2y$12$pytjVZoZ.i/5eXl40ZuwO.7j92lH4U82lSzYfY1Dhy5bYL/CySlUK','gYUOOJr4c3','2025-06-30 10:42:20','2025-06-30 10:42:20',1,'');


