cloud-hosting-platform/site-builder
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add templates, tests, and miscellaneous project files

Browse Source 
Includes new page templates (fitness-gym, nonprofit, online-course,
photography-studio, real-estate, startup-company, travel-blog,
wedding-invitation) with thumbnail SVGs, test specs, documentation
files, and minor updates to index.html, router.php, and playwright config.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Josh Knapp
2026-03-01 14:15:58 -08:00
parent 03f573b451
commit b511a6684d
61 changed files with 6919 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
templates/real-estate/about.html Normal file
View File

@@ -0,0 +1,87 @@
<!-- Navigation -->
<nav style="display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background-color:#0f172a;font-family:'Inter',sans-serif;">
<a style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;text-decoration:none;">Prestige Realty</a>
<div style="display:flex;align-items:center;gap:32px;">
<a href="listings.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Listings</a>
<a href="about.html" style="color:#0ea5e9;text-decoration:none;font-size:15px;font-weight:600;">About Us</a>
<a href="contact.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Contact</a>
<span style="color:#0ea5e9;font-size:15px;font-weight:600;">(555) 123-4567</span>
</div>
</nav>
<!-- About Section -->
<section style="background-color:#ffffff;padding:80px 48px;font-family:'Inter',sans-serif;">
<div style="display:flex;gap:48px;max-width:1050px;margin:0 auto;align-items:center;flex-wrap:wrap;">
<div style="flex:1;min-width:300px;">
<h1 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0f172a;margin:0 0 20px;">About Prestige Realty</h1>
<p style="font-size:16px;color:#475569;line-height:1.7;margin:0 0 16px;">Founded in 2011, Prestige Realty has grown from a small neighborhood office to one of Southern California's most trusted real estate agencies. Our journey began with a simple belief: every client deserves personalized, expert guidance through the biggest transaction of their life.</p>
<p style="font-size:16px;color:#475569;line-height:1.7;margin:0 0 16px;">Our mission is to make the home buying and selling experience seamless, transparent, and rewarding. We combine cutting-edge market analytics with genuine care for our clients' goals.</p>
<p style="font-size:16px;color:#475569;line-height:1.7;margin:0;">With over 500 properties sold and a 98% client satisfaction rate, our track record speaks for itself. We don't just close deals -- we build lasting relationships.</p>
</div>
<div style="flex:1;min-width:300px;">
<img src="https://images.unsplash.com/photo-1560518883-ce09059eeffa?w=600" style="width:100%;border-radius:12px;display:block;box-shadow:0 4px 20px rgba(0,0,0,0.1);" alt="Real estate office" />
</div>
</div>
</section>
<!-- Team Section -->
<section style="background-color:#f8fafc;padding:80px 48px;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:36px;font-weight:700;color:#0f172a;text-align:center;margin:0 0 8px;">Meet Our Team</h2>
<p style="text-align:center;color:#64748b;font-size:16px;margin:0 0 48px;">Dedicated professionals ready to help you</p>
<div style="display:flex;gap:32px;max-width:1000px;margin:0 auto;flex-wrap:wrap;justify-content:center;">
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:300px;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1560250097-0b93528c311a?w=400" style="width:100%;height:280px;object-fit:cover;display:block;" alt="James Mitchell" />
<div style="padding:24px;">
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 4px;">James Mitchell</h3>
<div style="font-size:14px;color:#0ea5e9;font-weight:600;margin-bottom:12px;">Lead Agent &amp; Founder</div>
<p style="font-size:13px;color:#64748b;line-height:1.6;margin:0;">Specializing in luxury residential properties with 15+ years of market experience in greater Los Angeles.</p>
</div>
</div>
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:300px;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=400" style="width:100%;height:280px;object-fit:cover;display:block;" alt="Sarah Chen" />
<div style="padding:24px;">
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 4px;">Sarah Chen</h3>
<div style="font-size:14px;color:#0ea5e9;font-weight:600;margin-bottom:12px;">Senior Sales Agent</div>
<p style="font-size:13px;color:#64748b;line-height:1.6;margin:0;">Expert in first-time homebuyer programs and residential sales across Orange County and San Diego markets.</p>
</div>
</div>
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:300px;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=400" style="width:100%;height:280px;object-fit:cover;display:block;" alt="David Rodriguez" />
<div style="padding:24px;">
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 4px;">David Rodriguez</h3>
<div style="font-size:14px;color:#0ea5e9;font-weight:600;margin-bottom:12px;">Commercial Specialist</div>
<p style="font-size:13px;color:#64748b;line-height:1.6;margin:0;">Focused on commercial real estate, office leasing, and investment properties with a strong analytics background.</p>
</div>
</div>
</div>
</section>
<!-- Values Section -->
<section style="background-color:#ffffff;padding:80px 48px;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:36px;font-weight:700;color:#0f172a;text-align:center;margin:0 0 8px;">Our Values</h2>
<p style="text-align:center;color:#64748b;font-size:16px;margin:0 0 48px;">The principles that guide everything we do</p>
<div style="display:flex;gap:32px;max-width:1000px;margin:0 auto;flex-wrap:wrap;justify-content:center;">
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:36px 28px;background-color:#f8fafc;border-radius:12px;">
<div style="width:56px;height:56px;background-color:#0ea5e9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:24px;color:#ffffff;">&#9829;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Integrity</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">We believe in honest communication and transparent dealings. Our clients always know exactly where they stand.</p>
</div>
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:36px 28px;background-color:#f8fafc;border-radius:12px;">
<div style="width:56px;height:56px;background-color:#0ea5e9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:24px;color:#ffffff;">&#9733;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Excellence</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">We set high standards for ourselves and continuously improve our skills, tools, and processes to serve you better.</p>
</div>
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:36px 28px;background-color:#f8fafc;border-radius:12px;">
<div style="width:56px;height:56px;background-color:#0ea5e9;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:24px;color:#ffffff;">&#9823;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Client-First</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">Your goals are our priority. We listen, adapt, and go the extra mile to ensure your real estate experience exceeds expectations.</p>
</div>
</div>
</section>
<!-- Footer -->
<footer style="background-color:#0f172a;padding:40px 48px;text-align:center;font-family:'Inter',sans-serif;">
<div style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">Prestige Realty</div>
<div style="font-size:14px;color:#94a3b8;margin-bottom:8px;">123 Real Estate Blvd, Suite 200, Los Angeles, CA 90001</div>
<div style="font-size:13px;color:#64748b;">&copy; 2026 Prestige Realty. All rights reserved.</div>
</footer>

98
templates/real-estate/contact.html Normal file
View File

@@ -0,0 +1,98 @@
<!-- Navigation -->
<nav style="display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background-color:#0f172a;font-family:'Inter',sans-serif;">
<a style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;text-decoration:none;">Prestige Realty</a>
<div style="display:flex;align-items:center;gap:32px;">
<a href="listings.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Listings</a>
<a href="about.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">About Us</a>
<a href="contact.html" style="color:#0ea5e9;text-decoration:none;font-size:15px;font-weight:600;">Contact</a>
<span style="color:#0ea5e9;font-size:15px;font-weight:600;">(555) 123-4567</span>
</div>
</nav>
<!-- Contact Section -->
<section style="background-color:#ffffff;padding:80px 48px;font-family:'Inter',sans-serif;">
<h1 style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0f172a;text-align:center;margin:0 0 8px;">Get In Touch</h1>
<p style="text-align:center;color:#64748b;font-size:17px;margin:0 0 56px;">We'd love to hear from you. Reach out and our team will respond within 24 hours.</p>
<div style="display:flex;gap:48px;max-width:1050px;margin:0 auto;flex-wrap:wrap;">
<!-- Contact Details -->
<div style="flex:1;min-width:300px;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color:#0f172a;margin:0 0 28px;">Contact Information</h2>
<div style="margin-bottom:24px;">
<div style="font-size:13px;font-weight:600;color:#0ea5e9;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Office Address</div>
<div style="font-size:15px;color:#475569;line-height:1.6;">123 Real Estate Blvd, Suite 200<br />Los Angeles, CA 90001</div>
</div>
<div style="margin-bottom:24px;">
<div style="font-size:13px;font-weight:600;color:#0ea5e9;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Phone</div>
<div style="font-size:15px;color:#475569;">(555) 123-4567</div>
</div>
<div style="margin-bottom:24px;">
<div style="font-size:13px;font-weight:600;color:#0ea5e9;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Email</div>
<div style="font-size:15px;color:#475569;">info@prestigerealty.com</div>
</div>
<div>
<div style="font-size:13px;font-weight:600;color:#0ea5e9;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Office Hours</div>
<div style="font-size:15px;color:#475569;line-height:1.6;">Monday - Friday: 9:00 AM - 6:00 PM<br />Saturday: 10:00 AM - 4:00 PM<br />Sunday: By Appointment</div>
</div>
</div>
<!-- Contact Form -->
<div style="flex:1;min-width:300px;">
<form style="background-color:#f8fafc;padding:32px;border-radius:12px;">
<div style="margin-bottom:16px;">
<label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Full Name</label>
<input type="text" placeholder="John Smith" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:'Inter',sans-serif;box-sizing:border-box;" />
</div>
<div style="margin-bottom:16px;">
<label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Email Address</label>
<input type="email" placeholder="john@example.com" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:'Inter',sans-serif;box-sizing:border-box;" />
</div>
<div style="margin-bottom:16px;">
<label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Phone Number</label>
<input type="tel" placeholder="(555) 000-0000" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:'Inter',sans-serif;box-sizing:border-box;" />
</div>
<div style="margin-bottom:16px;">
<label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Property Interest</label>
<select style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:'Inter',sans-serif;background-color:#ffffff;box-sizing:border-box;">
<option value="">Select an option...</option>
<option value="buying">Buying a Home</option>
<option value="selling">Selling a Home</option>
<option value="renting">Renting</option>
<option value="commercial">Commercial Property</option>
<option value="other">Other</option>
</select>
</div>
<div style="margin-bottom:20px;">
<label style="display:block;font-size:13px;font-weight:600;color:#0f172a;margin-bottom:6px;">Message</label>
<textarea placeholder="Tell us about what you're looking for..." rows="4" style="width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px;font-family:'Inter',sans-serif;resize:vertical;box-sizing:border-box;"></textarea>
</div>
<button type="submit" style="width:100%;padding:12px;background-color:#0ea5e9;color:#ffffff;border:none;border-radius:6px;font-size:15px;font-weight:600;font-family:'Inter',sans-serif;cursor:pointer;">Send Message</button>
</form>
</div>
</div>
</section>
<!-- Office Locations -->
<section style="background-color:#f8fafc;padding:72px 48px;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:32px;font-weight:700;color:#0f172a;text-align:center;margin:0 0 8px;">Our Offices</h2>
<p style="text-align:center;color:#64748b;font-size:16px;margin:0 0 40px;">Visit us at either of our convenient locations</p>
<div style="display:flex;gap:32px;max-width:800px;margin:0 auto;flex-wrap:wrap;justify-content:center;">
<div style="flex:1;min-width:320px;background-color:#ffffff;padding:32px;border-radius:12px;border:1px solid #e2e8f0;">
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 4px;">Los Angeles Office</h3>
<div style="font-size:14px;color:#0ea5e9;font-weight:600;margin-bottom:16px;">Main Headquarters</div>
<p style="font-size:14px;color:#64748b;line-height:1.7;margin:0 0 8px;">123 Real Estate Blvd, Suite 200<br />Los Angeles, CA 90001</p>
<p style="font-size:14px;color:#64748b;margin:0;">Phone: (555) 123-4567</p>
</div>
<div style="flex:1;min-width:320px;background-color:#ffffff;padding:32px;border-radius:12px;border:1px solid #e2e8f0;">
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 4px;">San Diego Office</h3>
<div style="font-size:14px;color:#0ea5e9;font-weight:600;margin-bottom:16px;">Branch Office</div>
<p style="font-size:14px;color:#64748b;line-height:1.7;margin:0 0 8px;">456 Coastal Drive, Suite 100<br />San Diego, CA 92101</p>
<p style="font-size:14px;color:#64748b;margin:0;">Phone: (555) 987-6543</p>
</div>
</div>
</section>
<!-- Footer -->
<footer style="background-color:#0f172a;padding:40px 48px;text-align:center;font-family:'Inter',sans-serif;">
<div style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">Prestige Realty</div>
<div style="font-size:14px;color:#94a3b8;margin-bottom:8px;">123 Real Estate Blvd, Suite 200, Los Angeles, CA 90001</div>
<div style="font-size:13px;color:#64748b;">&copy; 2026 Prestige Realty. All rights reserved.</div>
</footer>

120
templates/real-estate/home.html Normal file
View File

@@ -0,0 +1,120 @@
<!-- Navigation -->
<nav style="display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background-color:#0f172a;font-family:'Inter',sans-serif;">
<a style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;text-decoration:none;">Prestige Realty</a>
<div style="display:flex;align-items:center;gap:32px;">
<a href="listings.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Listings</a>
<a href="about.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">About Us</a>
<a href="contact.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Contact</a>
<span style="color:#0ea5e9;font-size:15px;font-weight:600;">(555) 123-4567</span>
</div>
</nav>
<!-- Hero -->
<section style="background:linear-gradient(rgba(15,23,42,0.85),rgba(15,23,42,0.85)),url('https://images.unsplash.com/photo-1600596542815-ffad4c1539a9?w=1400') center/cover no-repeat;padding:100px 48px;text-align:center;font-family:'Inter',sans-serif;">
<h1 style="font-family:'Montserrat',sans-serif;font-size:52px;font-weight:800;color:#ffffff;margin:0 0 16px;">Find Your Dream Home</h1>
<p style="font-size:20px;color:#cbd5e1;margin:0 0 40px;max-width:600px;margin-left:auto;margin-right:auto;">Discover exceptional properties in the most desirable neighborhoods. Your perfect home is just a search away.</p>
<div style="display:inline-flex;align-items:center;gap:12px;background-color:rgba(255,255,255,0.1);padding:12px 16px;border-radius:8px;border:1px solid rgba(255,255,255,0.15);">
<span style="color:#94a3b8;font-size:15px;">Search by city, neighborhood, or ZIP...</span>
<a href="listings.html" style="background-color:#0ea5e9;color:#ffffff;padding:12px 28px;border-radius:6px;text-decoration:none;font-weight:600;font-size:15px;">Browse Listings</a>
</div>
</section>
<!-- Stats -->
<section style="background-color:#ffffff;padding:60px 48px;font-family:'Inter',sans-serif;">
<div style="display:flex;justify-content:center;gap:64px;flex-wrap:wrap;max-width:960px;margin:0 auto;">
<div style="text-align:center;">
<div style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0ea5e9;">500+</div>
<div style="font-size:14px;color:#64748b;margin-top:4px;font-weight:500;">Properties Sold</div>
</div>
<div style="text-align:center;">
<div style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0ea5e9;">15</div>
<div style="font-size:14px;color:#64748b;margin-top:4px;font-weight:500;">Years Experience</div>
</div>
<div style="text-align:center;">
<div style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0ea5e9;">98%</div>
<div style="font-size:14px;color:#64748b;margin-top:4px;font-weight:500;">Client Satisfaction</div>
</div>
<div style="text-align:center;">
<div style="font-family:'Montserrat',sans-serif;font-size:40px;font-weight:800;color:#0ea5e9;">50+</div>
<div style="font-size:14px;color:#64748b;margin-top:4px;font-weight:500;">Expert Agents</div>
</div>
</div>
</section>
<!-- Featured Properties -->
<section style="background-color:#f8fafc;padding:80px 48px;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:36px;font-weight:700;color:#0f172a;text-align:center;margin:0 0 8px;">Featured Properties</h2>
<p style="text-align:center;color:#64748b;font-size:16px;margin:0 0 48px;">Hand-picked listings from our top agents</p>
<div style="display:flex;gap:24px;max-width:1100px;margin:0 auto;flex-wrap:wrap;justify-content:center;">
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Modern family home" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">$750,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Modern Family Home</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>4 Beds</span><span>3 Baths</span><span>2,800 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;">Westwood, Los Angeles, CA</div>
</div>
</div>
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Luxury villa" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">$1,250,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Luxury Villa with Pool</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>5 Beds</span><span>4 Baths</span><span>4,200 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;">Beverly Hills, CA</div>
</div>
</div>
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600566753086-00f18fb6b3ea?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Downtown condo" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">$425,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Downtown Penthouse Condo</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>2 Beds</span><span>2 Baths</span><span>1,400 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;">Downtown, San Diego, CA</div>
</div>
</div>
</div>
</section>
<!-- Why Choose Us -->
<section style="background-color:#ffffff;padding:80px 48px;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:36px;font-weight:700;color:#0f172a;text-align:center;margin:0 0 8px;">Why Choose Us</h2>
<p style="text-align:center;color:#64748b;font-size:16px;margin:0 0 48px;">What sets Prestige Realty apart</p>
<div style="display:flex;gap:32px;max-width:1000px;margin:0 auto;flex-wrap:wrap;justify-content:center;">
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:32px;border:1px solid #e2e8f0;border-radius:12px;">
<div style="font-size:36px;margin-bottom:16px;">&#127968;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Expert Agents</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">Our licensed professionals bring decades of combined experience and deep local market expertise to every transaction.</p>
</div>
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:32px;border:1px solid #e2e8f0;border-radius:12px;">
<div style="font-size:36px;margin-bottom:16px;">&#128200;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Market Knowledge</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">Data-driven pricing strategies and neighborhood insights ensure you get the best value whether buying or selling.</p>
</div>
<div style="flex:1;min-width:280px;max-width:300px;text-align:center;padding:32px;border:1px solid #e2e8f0;border-radius:12px;">
<div style="font-size:36px;margin-bottom:16px;">&#128273;</div>
<h3 style="font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:#0f172a;margin:0 0 12px;">Full Service</h3>
<p style="font-size:14px;color:#64748b;line-height:1.6;margin:0;">From your first viewing to closing day, we handle inspections, negotiations, paperwork, and everything in between.</p>
</div>
</div>
</section>
<!-- CTA -->
<section style="background:linear-gradient(135deg,#0ea5e9,#0369a1);padding:72px 48px;text-align:center;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:36px;font-weight:700;color:#ffffff;margin:0 0 16px;">Ready to Find Your Home?</h2>
<p style="font-size:18px;color:rgba(255,255,255,0.85);margin:0 0 32px;">Let our team guide you to the perfect property. Get in touch today.</p>
<a href="contact.html" style="display:inline-block;background-color:#ffffff;color:#0ea5e9;padding:14px 36px;border-radius:8px;text-decoration:none;font-weight:700;font-size:16px;">Contact Us</a>
</section>
<!-- Footer -->
<footer style="background-color:#0f172a;padding:40px 48px;text-align:center;font-family:'Inter',sans-serif;">
<div style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">Prestige Realty</div>
<div style="font-size:14px;color:#94a3b8;margin-bottom:8px;">123 Real Estate Blvd, Suite 200, Los Angeles, CA 90001</div>
<div style="font-size:13px;color:#64748b;">&copy; 2026 Prestige Realty. All rights reserved.</div>
</footer>

124
templates/real-estate/listings.html Normal file
View File

@@ -0,0 +1,124 @@
<!-- Navigation -->
<nav style="display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background-color:#0f172a;font-family:'Inter',sans-serif;">
<a style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;text-decoration:none;">Prestige Realty</a>
<div style="display:flex;align-items:center;gap:32px;">
<a href="listings.html" style="color:#0ea5e9;text-decoration:none;font-size:15px;font-weight:600;">Listings</a>
<a href="about.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">About Us</a>
<a href="contact.html" style="color:#f8fafc;text-decoration:none;font-size:15px;font-weight:500;">Contact</a>
<span style="color:#0ea5e9;font-size:15px;font-weight:600;">(555) 123-4567</span>
</div>
</nav>
<!-- Page Header -->
<section style="background-color:#0f172a;padding:64px 48px;text-align:center;font-family:'Inter',sans-serif;">
<h1 style="font-family:'Montserrat',sans-serif;font-size:44px;font-weight:800;color:#ffffff;margin:0 0 12px;">Our Properties</h1>
<p style="font-size:18px;color:#94a3b8;margin:0;">Browse our curated selection of homes, apartments, and commercial spaces</p>
</section>
<!-- Filter Bar -->
<section style="background-color:#ffffff;padding:24px 48px;border-bottom:1px solid #e2e8f0;font-family:'Inter',sans-serif;">
<div style="display:flex;justify-content:center;gap:12px;flex-wrap:wrap;">
<span style="display:inline-block;padding:10px 24px;background-color:#0ea5e9;color:#ffffff;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;">All</span>
<span style="display:inline-block;padding:10px 24px;background-color:#f1f5f9;color:#475569;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;">Houses</span>
<span style="display:inline-block;padding:10px 24px;background-color:#f1f5f9;color:#475569;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;">Apartments</span>
<span style="display:inline-block;padding:10px 24px;background-color:#f1f5f9;color:#475569;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;">Commercial</span>
</div>
</section>
<!-- Property Grid -->
<section style="background-color:#f8fafc;padding:64px 48px;font-family:'Inter',sans-serif;">
<div style="display:flex;flex-wrap:wrap;gap:24px;max-width:1100px;margin:0 auto;justify-content:center;">
<!-- Property 1 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Modern family home" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$750,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Modern Family Home</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>4 Beds</span><span>3 Baths</span><span>2,800 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Westwood, Los Angeles, CA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
<!-- Property 2 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Luxury villa" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$1,250,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Luxury Villa with Pool</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>5 Beds</span><span>4 Baths</span><span>4,200 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Beverly Hills, CA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
<!-- Property 3 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600566753086-00f18fb6b3ea?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Downtown condo" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$425,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Downtown Penthouse Condo</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>2 Beds</span><span>2 Baths</span><span>1,400 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Downtown, San Diego, CA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
<!-- Property 4 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600047509807-ba8f99d2cdde?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Suburban home" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$580,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Suburban Family Retreat</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>3 Beds</span><span>2 Baths</span><span>2,100 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Pasadena, CA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
<!-- Property 5 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1512917774080-9991f1c4c750?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Contemporary house" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$890,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Contemporary Hillside Home</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>4 Beds</span><span>3 Baths</span><span>3,100 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Hollywood Hills, CA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
<!-- Property 6 -->
<div style="background-color:#ffffff;border-radius:12px;overflow:hidden;width:340px;box-shadow:0 2px 12px rgba(0,0,0,0.08);">
<img src="https://images.unsplash.com/photo-1600573472550-8090b5e0745e?w=680" style="width:100%;height:220px;object-fit:cover;display:block;" alt="Commercial space" />
<div style="padding:20px;">
<div style="font-family:'Montserrat',sans-serif;font-size:22px;font-weight:700;color:#0ea5e9;margin-bottom:4px;">$1,800,000</div>
<div style="font-size:16px;font-weight:600;color:#0f172a;margin-bottom:8px;">Prime Commercial Space</div>
<div style="display:flex;gap:16px;font-size:13px;color:#64748b;margin-bottom:8px;">
<span>--</span><span>2 Baths</span><span>5,500 sqft</span>
</div>
<div style="font-size:13px;color:#94a3b8;margin-bottom:16px;">Santa Monica Blvd, LA</div>
<a href="#" style="color:#0ea5e9;text-decoration:none;font-size:14px;font-weight:600;">View Details &rarr;</a>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section style="background:linear-gradient(135deg,#0ea5e9,#0369a1);padding:64px 48px;text-align:center;font-family:'Inter',sans-serif;">
<h2 style="font-family:'Montserrat',sans-serif;font-size:32px;font-weight:700;color:#ffffff;margin:0 0 12px;">Can't Find What You're Looking For?</h2>
<p style="font-size:17px;color:rgba(255,255,255,0.85);margin:0 0 28px;">Our agents have access to exclusive off-market listings. Reach out and we'll find the perfect match.</p>
<a href="contact.html" style="display:inline-block;background-color:#ffffff;color:#0ea5e9;padding:14px 36px;border-radius:8px;text-decoration:none;font-weight:700;font-size:16px;">Contact Us</a>
</section>
<!-- Footer -->
<footer style="background-color:#0f172a;padding:40px 48px;text-align:center;font-family:'Inter',sans-serif;">
<div style="font-family:'Montserrat',sans-serif;font-size:18px;font-weight:700;color:#0ea5e9;margin-bottom:8px;">Prestige Realty</div>
<div style="font-size:14px;color:#94a3b8;margin-bottom:8px;">123 Real Estate Blvd, Suite 200, Los Angeles, CA 90001</div>
<div style="font-size:13px;color:#64748b;">&copy; 2026 Prestige Realty. All rights reserved.</div>
</footer>