ppwebtest1 / index.html
Suicynic's picture
that's pretty decent but there are still some errors and issues with formatting, please ensure the mobile versiuon is optimized as well - Initial Deployment
eb07bd2 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pinkerton Properties – Real People, Creative Solutions</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#e6007e',
secondary: '#f8f8f8',
accent: '#ff6b00',
dark: '#333333'
}
}
}
}
</script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Open+Sans:wght@300;400;600&display=swap');
body {
font-family: 'Open Sans', sans-serif;
color: #333;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Montserrat', sans-serif;
}
.hero-bg {
background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80') center/cover no-repeat;
}
.section-divider {
height: 4px;
background: linear-gradient(to right, #e6007e, #ff6b00);
width: 100px;
margin: 2rem auto;
}
.card-hover {
transition: all 0.3s ease;
}
.card-hover:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}
.btn-primary {
background: linear-gradient(to right, #e6007e, #ff6b00);
transition: all 0.3s ease;
}
.btn-primary:hover {
background: linear-gradient(to right, #cc0070, #e65f00);
transform: translateY(-2px);
box-shadow: 0 4px 15px rgba(230, 0, 126, 0.3);
}
.feature-icon {
width: 70px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: linear-gradient(135deg, #e6007e, #ff6b00);
color: white;
font-size: 1.8rem;
margin-bottom: 1rem;
}
.contact-form input, .contact-form textarea {
border: 1px solid #ddd;
border-radius: 4px;
padding: 0.8rem 1rem;
transition: all 0.3s ease;
}
.contact-form input:focus, .contact-form textarea:focus {
border-color: #e6007e;
box-shadow: 0 0 0 3px rgba(230, 0, 126, 0.1);
outline: none;
}
.testimonial-card {
background: white;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
padding: 2rem;
position: relative;
}
.testimonial-card:before {
content: """;
position: absolute;
top: -30px;
left: 20px;
font-size: 5rem;
color: #e6007e;
opacity: 0.2;
font-family: Georgia, serif;
}
.stats-number {
font-size: 2.5rem;
font-weight: 700;
color: #e6007e;
margin-bottom: 0.5rem;
}
.footer-link:hover {
color: #ff6b00;
}
</style>
</head>
<body class="bg-gray-50">
<!-- Header -->
<header class="bg-white shadow-md sticky top-0 z-50">
<div class="container mx-auto px-4 py-4 flex flex-col md:flex-row justify-between items-center">
<div class="flex items-center mb-4 md:mb-0">
<div class="bg-primary w-12 h-12 rounded-full flex items-center justify-center mr-3">
<i class="fas fa-home text-white text-2xl"></i>
</div>
<h1 class="text-2xl font-bold text-dark">
<span class="text-primary">Pinkerton</span> Properties
</h1>
</div>
<nav class="flex flex-wrap justify-center gap-6">
<a href="#sell" class="font-medium hover:text-primary transition">Sell Your Home</a>
<a href="#lending" class="font-medium hover:text-primary transition">Private Lending</a>
<a href="#financing" class="font-medium hover:text-primary transition">Owner Financing</a>
<a href="#contact" class="font-medium hover:text-primary transition">Contact</a>
</nav>
<div class="mt-4 md:mt-0">
<a href="#contact" class="btn-primary text-white font-bold py-2 px-6 rounded-full inline-block">
Get Cash Offer
</a>
</div>
</div>
</header>
<!-- Hero Section -->
<section class="hero-bg text-white py-20 md:py-28">
<div class="container mx-auto px-4 text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-4">Real People, Creative Solutions</h1>
<p class="text-xl md:text-2xl max-w-3xl mx-auto mb-8">Turning Properties into Opportunities in Nashville</p>
<div class="flex flex-col sm:flex-row justify-center gap-4">
<a href="#contact" class="btn-primary text-white font-bold py-3 px-8 rounded-full text-lg">
Get Your Free Cash Offer
</a>
<a href="#services" class="bg-white text-primary font-bold py-3 px-8 rounded-full text-lg hover:bg-gray-100 transition">
Learn More
</a>
</div>
</div>
</section>
<!-- Stats Section -->
<section class="py-12 bg-secondary">
<div class="container mx-auto px-4">
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
<div>
<div class="stats-number">500+</div>
<p class="text-gray-600">Homes Sold</p>
</div>
<div>
<div class="stats-number">15+</div>
<p class="text-gray-600">Years Experience</p>
</div>
<div>
<div class="stats-number">$25M+</div>
<p class="text-gray-600">Properties Sold</p>
</div>
<div>
<div class="stats-number">98%</div>
<p class="text-gray-600">Client Satisfaction</p>
</div>
</div>
</div>
</section>
<!-- Main Content -->
<main class="container mx-auto px-4 py-16">
<!-- Sell Your Home Section -->
<section id="sell" class="mb-20">
<div class="text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Nashville Real Estate Solutions</h2>
<h3 class="text-2xl font-semibold text-primary mb-6">Sell Your Home Fast in Tennessee</h3>
<div class="section-divider"></div>
<p class="max-w-3xl mx-auto text-lg text-gray-700">
Welcome to Pinkerton Properties. We're real people offering real solutions in Middle Tennessee.
Whether you're facing foreclosure, bankruptcy, or need a fresh start, tell us about your property
and we'll craft a fast cash offer or creative financing plan—always tailored to your needs.
</p>
</div>
<div class="grid md:grid-cols-2 gap-12 items-center mb-16">
<div>
<h3 class="text-2xl font-bold text-dark mb-6">Need to Sell Fast? We're Here to Help</h3>
<p class="mb-4 text-gray-700">
If you're dealing with foreclosure, probate, bankruptcy, an inherited home, or just tight timelines,
you're not alone. Pinkerton Properties buys homes as-is (no cleaning, repairs, or fees required)
and offers both cash purchases and flexible terms tailored to your needs.
</p>
<p class="mb-6 text-gray-700">
We listen to your story, explain every option, and move quickly when time matters.
</p>
<div class="bg-white p-6 rounded-lg shadow-md border-l-4 border-primary">
<h4 class="text-xl font-bold text-dark mb-4">What You Can Expect:</h4>
<ul class="space-y-3">
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span><strong>No repairs or clean-up:</strong> We buy properties in any condition.</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span><strong>Straight talk:</strong> You'll understand every option before making a decision.</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span><strong>Fast closings:</strong> Close on your schedule—sometimes in as little as a week.</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span><strong>No fees or commissions:</strong> We cover closing costs so you keep more of your proceeds.</span>
</li>
</ul>
</div>
</div>
<div class="bg-white p-8 rounded-xl shadow-lg">
<h3 class="text-2xl font-bold text-center text-dark mb-6">Get Your Free Cash Offer</h3>
<form class="contact-form space-y-4">
<div>
<label for="name" class="block text-gray-700 mb-1">Full Name</label>
<input type="text" id="name" class="w-full" placeholder="Your name">
</div>
<div>
<label for="phone" class="block text-gray-700 mb-1">Phone Number</label>
<input type="tel" id="phone" class="w-full" placeholder="Your phone number">
</div>
<div>
<label for="email" class="block text-gray-700 mb-1">Email Address</label>
<input type="email" id="email" class="w-full" placeholder="Your email address">
</div>
<div>
<label for="property" class="block text-gray-700 mb-1">Property Address</label>
<input type="text" id="property" class="w-full" placeholder="Property address">
</div>
<div>
<label for="message" class="block text-gray-700 mb-1">Tell Us About Your Situation</label>
<textarea id="message" rows="3" class="w-full" placeholder="Briefly describe your situation"></textarea>
</div>
<button type="submit" class="btn-primary w-full text-white font-bold py-3 rounded-lg">
Get My Free Cash Offer
</button>
<p class="text-center text-gray-600 text-sm mt-3">
We'll respond within 24 hours with your no-obligation offer
</p>
</form>
</div>
</div>
</section>
<!-- Private Lending Section -->
<section id="lending" class="mb-20">
<div class="text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Nashville Investment Opportunities</h2>
<h3 class="text-2xl font-semibold text-primary mb-6">Secure Private Lending</h3>
<div class="section-divider"></div>
<p class="max-w-3xl mx-auto text-lg text-gray-700">
Have capital you'd like to put to work? We partner with private lenders and investors to fund
purchases and projects in Middle Tennessee. Our borrowers are carefully vetted, and your
investment is secured by real estate for predictable returns.
</p>
</div>
<div class="grid md:grid-cols-2 gap-12 items-center">
<div class="order-2 md:order-1">
<div class="grid grid-cols-2 gap-6">
<div class="bg-white p-6 rounded-lg shadow-md card-hover">
<div class="feature-icon mx-auto">
<i class="fas fa-handshake"></i>
</div>
<h4 class="text-xl font-bold text-center mb-3">Transparent Communication</h4>
<p class="text-gray-600 text-center">
Trustworthy, family-run team with clear communication throughout the investment process.
</p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md card-hover">
<div class="feature-icon mx-auto">
<i class="fas fa-shield-alt"></i>
</div>
<h4 class="text-xl font-bold text-center mb-3">Secured Investments</h4>
<p class="text-gray-600 text-center">
All loans are collateralized by real estate for added security and peace of mind.
</p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md card-hover">
<div class="feature-icon mx-auto">
<i class="fas fa-chart-line"></i>
</div>
<h4 class="text-xl font-bold text-center mb-3">Predictable Returns</h4>
<p class="text-gray-600 text-center">
Stable, consistent returns backed by real estate assets in a growing market.
</p>
</div>
<div class="bg-white p-6 rounded-lg shadow-md card-hover">
<div class="feature-icon mx-auto">
<i class="fas fa-sliders-h"></i>
</div>
<h4 class="text-xl font-bold text-center mb-3">Flexible Terms</h4>
<p class="text-gray-600 text-center">
Investment structures tailored to meet your specific financial goals and timeline.
</p>
</div>
</div>
</div>
<div class="order-1 md:order-2">
<div class="bg-white p-8 rounded-xl shadow-lg">
<h3 class="text-2xl font-bold text-center text-dark mb-6">Become a Private Lender</h3>
<p class="text-gray-700 mb-6">
Ready to put your capital to work with secure, real estate-backed returns?
Contact us today to receive an information packet and discuss how you can
partner with Pinkerton Properties.
</p>
<ul class="space-y-3 mb-8">
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span>Comprehensive due diligence on all borrowers and properties</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span>Regular updates and transparent reporting</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span>Professional loan servicing and management</span>
</li>
<li class="flex items-start">
<i class="fas fa-check-circle text-primary mt-1 mr-3"></i>
<span>Customizable investment structures</span>
</li>
</ul>
<a href="#contact" class="btn-primary w-full text-white font-bold py-3 rounded-lg text-center block">
Request Information Packet
</a>
</div>
</div>
</div>
</section>
<!-- Owner Financing Section -->
<section id="financing" class="mb-20">
<div class="text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Creative Real Estate Financing</h2>
<h3 class="text-2xl font-semibold text-primary mb-6">Nashville Owner-Financed Homes</h3>
<div class="section-divider"></div>
<p class="max-w-3xl mx-auto text-lg text-gray-700">
Dreaming of owning a home but blocked by strict bank criteria? Our owner-financed properties
make homeownership accessible—even if you're self-employed, rebuilding credit, or new to the area.
</p>
</div>
<div class="grid md:grid-cols-2 gap-12 items-center">
<div>
<div class="bg-white p-8 rounded-xl shadow-lg">
<h3 class="text-2xl font-bold text-center text-dark mb-6">Owner Financing Benefits</h3>
<ul class="space-y-4">
<li class="flex items-start">
<div class="feature-icon flex-shrink-0">
<i class="fas fa-credit-card"></i>
</div>
<div class="ml-4">
<h4 class="text-xl font-bold text-dark mb-1">No Credit Hassles</h4>
<p class="text-gray-600">
We evaluate your situation holistically, not just your credit score.
</p>
</div>
</li>
<li class="flex items-start">
<div class="feature-icon flex-shrink-0">
<i class="fas fa-wallet"></i>
</div>
<div class="ml-4">
<h4 class="text-xl font-bold text-dark mb-1">Flexible Terms</h4>
<p class="text-gray-600">
Payment plans designed around your budget and financial situation.
</p>
</div>
</li>
<li class="flex items-start">
<div class="feature-icon flex-shrink-0">
<i class="fas fa-bolt"></i>
</div>
<div class="ml-4">
<h4 class="text-xl font-bold text-dark mb-1">Quick Approvals</h4>
<p class="text-gray-600">
In-house RMLO services eliminate long bank delays for faster closings.
</p>
</div>
</li>
</ul>
</div>
</div>
<div>
<h3 class="text-2xl font-bold text-dark mb-6">Home Ownership Made Simple</h3>
<p class="mb-4 text-gray-700">
Traditional bank financing can be restrictive and time-consuming. Our owner-financed
properties provide an alternative path to homeownership that's designed to work for you.
</p>
<p class="mb-6 text-gray-700">
Whether you're self-employed, rebuilding credit, or new to the Nashville area, we
offer flexible financing options that consider your whole financial picture.
</p>
<div class="bg-primary bg-opacity-10 p-6 rounded-lg border border-primary">
<h4 class="text-xl font-bold text-dark mb-3">Our Financing Process:</h4>
<ol class="list-decimal pl-5 space-y-2 text-gray-700">
<li>Submit your application with basic financial information</li>
<li>Property viewing and selection</li>
<li>Terms negotiation (interest rate, down payment, term length)</li>
<li>Contract signing and closing</li>
<li>Move into your new home!</li>
</ol>
</div>
<div class="mt-8">
<a href="#" class="btn-primary text-white font-bold py-3 px-8 rounded-lg inline-block">
View Available Owner-Financed Homes
</a>
</div>
</div>
</div>
</section>
<!-- Testimonials -->
<section class="py-16 bg-secondary rounded-2xl mb-20">
<div class="container mx-auto px-4">
<div class="text-center mb-12">
<h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">What Our Clients Say</h2>
<div class="section-divider"></div>
</div>
<div class="grid md:grid-cols-3 gap-8">
<div class="testimonial-card">
<div class="flex items-center mb-4">
<div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" />
<div class="ml-4">
<h4 class="font-bold text-lg">Sarah Johnson</h4>
<p class="text-gray-600">Sold her home in 10 days</p>
</div>
</div>
<p class="text-gray-700 italic">
"I was facing foreclosure and had no idea what to do. Pinkerton Properties listened to my situation and made the whole process stress-free. They bought my house as-is and closed in just 10 days. I'm forever grateful!"
</p>
</div>
<div class="testimonial-card">
<div class="flex items-center mb-4">
<div class="bg-gray-200 border-2 border-dashed rounded-xl w-16 h-16" />
<div class="ml-4">
<h4 class="font-bold text-lg">Michael Torres</h4>
<p class="text-gray-600">Private lender since 2018</p>
</div>
</div>
<p class="text-gray-700 italic">
"As a private lender, I appreciate the transparency and professionalism of the Pinkerton team. They've consistently
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Suicynic/ppwebtest1" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>