301 lines
18 KiB
TypeScript
301 lines
18 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
import FeatureCardTwentyTwo from '@/components/sections/feature/FeatureCardTwentyTwo';
|
|
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import { CheckCircle, DollarSign, Eye, FileText, Handshake, MessageSquare, Shield, Users, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="small"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="aurora"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Construction Property LA"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Why Us", id: "why-us" },
|
|
{ name: "Portfolio", id: "portfolio" },
|
|
{ name: "Testimonials", id: "testimonials" }
|
|
]}
|
|
button={{
|
|
text: "Get Free Estimate", href: "#contact"
|
|
}}
|
|
className="fixed top-6 right-6 z-50"
|
|
buttonClassName="bg-primary-cta hover:bg-primary-cta/90"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
logoText="Construction Property LA"
|
|
description="Los Angeles' trusted full-service construction and remodeling team — delivering exceptional craftsmanship, transparent pricing, and seamless project management from design to completion."
|
|
buttons={[
|
|
{ text: "Get a Free Estimate", href: "#contact" },
|
|
{ text: "View Our Work", href: "#portfolio" }
|
|
]}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
imageSrc="https://img.b2bpic.net/free-photo/woman-man-working-laptop-home-modern-kitchen_651396-3535.jpg?_wi=1"
|
|
imageAlt="Luxury kitchen remodeling project"
|
|
mediaAnimation="slide-up"
|
|
frameStyle="card"
|
|
className="py-20"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
logoClassName="text-6xl md:text-8xl font-bold"
|
|
descriptionClassName="text-lg md:text-2xl text-foreground/80"
|
|
buttonContainerClassName="gap-4 mt-8 flex flex-col sm:flex-row justify-center md:justify-start"
|
|
/>
|
|
</div>
|
|
|
|
<div id="trust-bar" data-section="trust-bar">
|
|
<MetricCardTwo
|
|
metrics={[
|
|
{ id: "1", value: "5-Star", description: "Rated Across Los Angeles" },
|
|
{ id: "2", value: "100%", description: "Licensed & Insured" },
|
|
{ id: "3", value: "In-House", description: "Permit & Plans Management" },
|
|
{ id: "4", value: "On-Time", description: "Project Delivery" }
|
|
]}
|
|
title="Why Homeowners Trust Us"
|
|
description="We stand behind every project with transparency, expertise, and unwavering attention to detail."
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
className="py-16 bg-background"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
cardClassName="text-center p-8 rounded-lg bg-card"
|
|
valueClassName="text-4xl md:text-5xl font-bold text-primary-cta mb-2"
|
|
metricDescriptionClassName="text-sm md:text-base text-foreground/70"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<SplitAbout
|
|
title="Designed. Permitted. Built. Perfected."
|
|
description="From full-home renovations to kitchen remodels, ADUs, additions, structural upgrades, and emergency restoration — Construction Property LA handles every detail under one roof. No outsourcing chaos. No hidden costs. No miscommunication. Just flawless execution."
|
|
tag="Our Approach"
|
|
tagIcon={Shield}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
bulletPoints={[
|
|
{
|
|
title: "Clear Communication", description: "Clients consistently mention how responsive and organized our project managers are. Daily updates, quick responses, and transparent reporting.", icon: MessageSquare
|
|
},
|
|
{
|
|
title: "Fair & Transparent Pricing", description: "Detailed estimates with no surprises mid-project. We break down costs clearly and stand by our quotes.", icon: DollarSign
|
|
},
|
|
{
|
|
title: "Fast Turnaround", description: "Many full remodels completed in as little as 6 weeks. We respect your time and schedule efficiently.", icon: Zap
|
|
},
|
|
{
|
|
title: "Permit & Plan Handling", description: "We manage drawings, submissions, and city approvals in-house. No permit nightmares.", icon: FileText
|
|
}
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/medium-shot-people-working-construction_23-2150772878.jpg?_wi=1"
|
|
imageAlt="Construction Property LA team"
|
|
mediaAnimation="slide-up"
|
|
imagePosition="right"
|
|
className="py-20"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
descriptionClassName="text-lg text-foreground/80 mb-8"
|
|
bulletPointClassName="py-6 border-b border-accent last:border-b-0"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyTwo
|
|
title="Full-Service Remodeling & Construction"
|
|
description="We handle every aspect of your project with expertise and precision."
|
|
tag="Services"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
id: "1", category: ["Kitchen", "Renovation"],
|
|
title: "Kitchen Remodeling", imageSrc: "https://img.b2bpic.net/free-photo/corner-kitchen-open-drawers-cooking-zone_169016-69130.jpg?_wi=1", imageAlt: "Kitchen remodeling service"
|
|
},
|
|
{
|
|
id: "2", category: ["Bathroom", "Design"],
|
|
title: "Bathroom Remodeling", imageSrc: "https://img.b2bpic.net/free-photo/tidy-bathroom-with-shiny-tiles_1203-1501.jpg?_wi=1", imageAlt: "Bathroom remodeling service"
|
|
},
|
|
{
|
|
id: "3", category: ["ADU", "Construction"],
|
|
title: "ADU & Home Additions", imageSrc: "https://img.b2bpic.net/free-photo/man-train-wagon-outdoors_23-2148232296.jpg", imageAlt: "ADU construction service"
|
|
},
|
|
{
|
|
id: "4", category: ["Structural", "Engineering"],
|
|
title: "Structural Engineering", imageSrc: "https://img.b2bpic.net/free-photo/extreme-sports-ropejumping_1385-3151.jpg", imageAlt: "Structural work service"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
className="py-20"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
textBoxDescriptionClassName="text-lg text-foreground/80"
|
|
gridClassName="grid grid-cols-1 md:grid-cols-2 gap-8 mt-12"
|
|
cardTitleClassName="text-3xl font-bold text-foreground mb-4"
|
|
categoryClassName="inline-block text-sm font-semibold text-primary-cta mr-3"
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-us" data-section="why-us">
|
|
<SplitAbout
|
|
title="Why Clients Choose Construction Property LA"
|
|
description="Our reputation is built on reliability, expertise, and genuine care for every project."
|
|
tag="Differentiators"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
bulletPoints={[
|
|
{
|
|
title: "Expert Project Managers", description: "Jeffery, Andrew, Duane, Paul, Micah, Tristan, and Justin — each bringing years of experience and dedication to your home.", icon: Users
|
|
},
|
|
{
|
|
title: "Seamless Permitting", description: "We handle all city approvals and documentation. No delays, no confusion, no surprises.", icon: CheckCircle
|
|
},
|
|
{
|
|
title: "Attention to Detail", description: "We fix what others miss — even small issues you didn't know existed. Every corner matters.", icon: Eye
|
|
},
|
|
{
|
|
title: "Honest Pricing", description: "No hidden fees. No change orders out of nowhere. What we quote is what you pay.", icon: Handshake
|
|
}
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/medium-shot-people-working-construction_23-2150772878.jpg?_wi=2"
|
|
imageAlt="Expert project managers"
|
|
mediaAnimation="slide-up"
|
|
imagePosition="left"
|
|
className="py-20 bg-background-accent/10"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
descriptionClassName="text-lg text-foreground/80"
|
|
/>
|
|
</div>
|
|
|
|
<div id="portfolio" data-section="portfolio">
|
|
<BlogCardTwo
|
|
title="Featured Projects"
|
|
description="See the transformations we've delivered across Los Angeles."
|
|
tag="Portfolio"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
blogs={[
|
|
{
|
|
id: "1", category: ["Full Renovation", "Kitchen"],
|
|
title: "Luxury 4,000 Sq Ft Full Renovation", excerpt: "Complete transformation of a Los Angeles home including kitchen, bathrooms, flooring, windows, and structural reinforcement.", imageSrc: "https://img.b2bpic.net/free-photo/beautiful-kitchen-interior-design_23-2150976526.jpg", imageAlt: "Featured luxury renovation", authorName: "Construction Property LA", authorAvatar: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", date: "Completed in 6 weeks"
|
|
},
|
|
{
|
|
id: "2", category: ["Kitchen", "Modern Design"],
|
|
title: "Contemporary Kitchen Remodel", excerpt: "Custom cabinetry, premium finishes, and structural wall removal to create an open-concept culinary space.", imageSrc: "https://img.b2bpic.net/free-photo/corner-kitchen-open-drawers-cooking-zone_169016-69130.jpg?_wi=2", imageAlt: "Kitchen remodeling project", authorName: "Construction Property LA", authorAvatar: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", date: "Premium finishes"
|
|
},
|
|
{
|
|
id: "3", category: ["Bathroom", "Spa-Inspired"],
|
|
title: "Spa-Inspired Bathroom Design", excerpt: "Luxury tile work, expert plumbing, and sophisticated finishes create a serene personal retreat.", imageSrc: "https://img.b2bpic.net/free-photo/tidy-bathroom-with-shiny-tiles_1203-1501.jpg?_wi=2", imageAlt: "Bathroom renovation project", authorName: "Construction Property LA", authorAvatar: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", date: "Expert craftsmanship"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
carouselMode="buttons"
|
|
className="py-20"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
textBoxDescriptionClassName="text-lg text-foreground/80"
|
|
cardTitleClassName="text-2xl font-bold text-foreground mt-4 mb-3"
|
|
excerptClassName="text-base text-foreground/70 mb-4"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="What Los Angeles Homeowners Say"
|
|
description="Hear directly from families who've experienced our work."
|
|
tag="Testimonials"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
speed={40}
|
|
topMarqueeDirection="left"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", handle: "Los Angeles, CA", testimonial: "From start to finish, the experience was outstanding. The permit process went smoothly, communication was excellent, and the final result exceeded expectations.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "Sarah Johnson"
|
|
},
|
|
{
|
|
id: "2", name: "Michael Chen", handle: "Beverly Hills, CA", testimonial: "Completed exactly on time. No surprises, no delays, and the quality of work is exceptional. These are true professionals.", imageSrc: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg", imageAlt: "Michael Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Emily Rodriguez", handle: "Santa Monica, CA", testimonial: "Most affordable quote with no hidden fees. They even fixed small issues we didn't notice without being asked. Outstanding attention to detail.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "Emily Rodriguez"
|
|
},
|
|
{
|
|
id: "4", name: "David Park", handle: "Pasadena, CA", testimonial: "Responded within minutes to every question. The project managers are organized, transparent, and genuinely care about getting it right.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "David Park"
|
|
},
|
|
{
|
|
id: "5", name: "Jessica Martinez", handle: "Culver City, CA", testimonial: "They took the space down to the studs and rebuilt it beautifully. The transformation is incredible and the process was stress-free.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4", imageAlt: "Jessica Martinez"
|
|
},
|
|
{
|
|
id: "6", name: "Robert Thompson", handle: "Long Beach, CA", testimonial: "Working with this team has been the best decision we made for our home. Professional, reliable, and they deliver on every promise.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=5", imageAlt: "Robert Thompson"
|
|
}
|
|
]}
|
|
className="py-20 bg-background"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
textBoxTitleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
textBoxDescriptionClassName="text-lg text-foreground/80 mb-12"
|
|
testimonialClassName="p-6 rounded-lg bg-card border border-accent/30"
|
|
nameClassName="font-semibold text-foreground text-lg"
|
|
handleClassName="text-sm text-foreground/60"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Get Started"
|
|
title="Let's Build Something Exceptional"
|
|
description="Schedule your free on-site consultation today. Our team will assess your project, answer your questions, and provide a transparent estimate with no obligation."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
imageSrc="https://img.b2bpic.net/free-photo/woman-man-working-laptop-home-modern-kitchen_651396-3535.jpg?_wi=2"
|
|
imageAlt="Modern home interior"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email address"
|
|
buttonText="Request Consultation"
|
|
termsText="We respect your privacy. Unsubscribe at any time."
|
|
className="py-20"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
titleClassName="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
|
descriptionClassName="text-lg text-foreground/80 mb-8"
|
|
formClassName="flex flex-col gap-4"
|
|
inputClassName="px-4 py-3 rounded-lg border border-accent bg-background text-foreground placeholder-foreground/50"
|
|
buttonClassName="px-6 py-3 rounded-lg bg-primary-cta text-white font-semibold hover:bg-primary-cta/90 transition-all"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Construction Property LA"
|
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
|
rightLink={{ text: "Terms & Conditions", href: "#" }}
|
|
className="py-12 bg-foreground/5 border-t border-accent/30"
|
|
containerClassName="max-w-7xl mx-auto"
|
|
logoClassName="text-2xl font-bold text-foreground text-center mb-8"
|
|
linkClassName="text-sm text-foreground/70 hover:text-primary-cta transition-colors"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |