Files
79d2d09f-e59b-4f77-898e-0a2…/src/app/page.tsx
2026-03-04 09:05:55 +00:00

192 lines
11 KiB
TypeScript

"use client";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Layers, Palette, TrendingUp, RefreshCw } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="smallMedium"
sizing="mediumLarge"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Home", id: "hero" },
{ name: "Services", id: "features" },
{ name: "About", id: "about" },
{ name: "Clients", id: "testimonial" },
{ name: "Contact", id: "footer" }
]}
brandName="Layers"
bottomLeftText="Marketing Strategy"
bottomRightText="hello@layersmarketing.com"
/>
</div>
<div id="hero" data-section="hero">
<HeroOverlay
title="Strategic Marketing in Layers"
description="Build brand authority through our multi-layered marketing approach. From strategy to execution, we layer insights, creativity, and data to deliver results."
tag="Marketing Strategy"
tagAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-vector/abstract-background-with-geometric-shapes_91128-850.jpg"
imageAlt="Abstract layers representing strategic marketing depth"
textPosition="bottom-left"
showBlur={true}
showDimOverlay={true}
buttons={[
{ text: "Start Your Strategy", href: "#features" },
{ text: "Learn More", href: "#about" }
]}
buttonAnimation="slide-up"
ariaLabel="Hero section for Layers marketing business"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="Layered Approach to Marketing Excellence"
description="We believe the best marketing isn't one-dimensional. Our layered methodology combines strategic planning, creative execution, and data-driven optimization to create cohesive campaigns that resonate."
tag="Our Methodology"
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Strategic Foundation", description: "Deep market research and competitor analysis to build a solid strategic foundation", icon: Layers
},
{
title: "Creative Layer", description: "Compelling creative concepts that connect emotionally with your target audience", icon: Palette
},
{
title: "Data Integration", description: "Analytics and insights woven throughout to optimize performance and ROI", icon: TrendingUp
},
{
title: "Continuous Refinement", description: "Ongoing testing and optimization to ensure campaigns stay effective and competitive", icon: RefreshCw
}
]}
imageSrc="http://img.b2bpic.net/free-photo/team-diverse-coworkers-modern-office-discuss-their-project-together_93675-133516.jpg"
imageAlt="Team collaborating on marketing strategy"
mediaAnimation="slide-up"
imagePosition="right"
buttons={[
{ text: "Explore Our Services", href: "#features" }
]}
buttonAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
title="Our Services"
description="Comprehensive marketing solutions designed to layer success into every touchpoint"
tag="What We Offer"
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "01", title: "Brand Strategy & Positioning", description: "Build a distinctive brand identity that stands out in your market with our strategic positioning framework", imageSrc: "http://img.b2bpic.net/free-photo/multi-ethnic-business-team-sitting-table-office-center-speaking-about-project-meeting-broadroom_482257-5077.jpg?_wi=1", imageAlt: "Brand strategy visualization"
},
{
id: "02", title: "Digital & Content Marketing", description: "Create engaging content across all channels that drives traffic, engagement, and conversions", imageSrc: "http://img.b2bpic.net/free-photo/aerial-view-man-working-computer_53876-31625.jpg", imageAlt: "Content marketing and social media strategy"
},
{
id: "03", title: "Performance Marketing", description: "Data-driven campaigns optimized for measurable results and maximum ROI on your marketing investment", imageSrc: "http://img.b2bpic.net/free-photo/businessman-examining-graphs-digital-tablet-while-planning-with-coworkers-desk-office_662251-126.jpg", imageAlt: "Performance analytics and optimization"
},
{
id: "04", title: "Campaign Optimization", description: "Continuous testing and refinement to ensure your campaigns achieve peak performance and adapt to market changes", imageSrc: "http://img.b2bpic.net/free-photo/multi-ethnic-business-team-sitting-table-office-center-speaking-about-project-meeting-broadroom_482257-5077.jpg?_wi=2", imageAlt: "Campaign optimization process"
}
]}
gridVariant="two-columns-alternating-heights"
animationType="slide-up"
carouselMode="buttons"
buttons={[
{ text: "View All Services", href: "#contact" }
]}
buttonAnimation="slide-up"
/>
</div>
<div id="testimonial" data-section="testimonial">
<TestimonialCardThirteen
title="What Our Clients Say"
description="Hear from businesses that transformed their marketing with our layered approach"
tag="Client Success"
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
showRating={true}
testimonials={[
{
id: "1", name: "Sarah Chen", handle: "@sarahchen", testimonial: "Layers transformed our marketing strategy. Their multi-layered approach increased our lead generation by 300% in just 6 months.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "Sarah Chen, CEO"
},
{
id: "2", name: "Marcus Rodriguez", handle: "@mrodriguez", testimonial: "The team at Layers really understands how to build cohesive campaigns. Our brand awareness has never been stronger.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg", imageAlt: "Marcus Rodriguez, Founder"
},
{
id: "3", name: "Emily Watson", handle: "@ewatson", testimonial: "Professional, data-driven, and creative. Layers delivered exceptional results for our product launch across all channels.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=1", imageAlt: "Emily Watson, Marketing Director"
},
{
id: "4", name: "David Kim", handle: "@dkim_co", testimonial: "Working with Layers was a game-changer. Their strategic approach helped us capture market share and build lasting customer relationships.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=2", imageAlt: "David Kim, Business Owner"
}
]}
animationType="slide-up"
carouselMode="buttons"
buttons={[
{ text: "See More Success Stories", href: "#footer" }
]}
buttonAnimation="slide-up"
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
title="Trusted by Industry Leaders"
description="Partnering with innovative brands and ambitious companies to drive marketing success"
tag="Our Clients"
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
names={[
"TechVentures", "InnovateCo", "GrowthLabs", "DigitalFirst", "BrandBuilders", "FutureScale", "StrategyHub", "CreativeForce"
]}
logos={[
"http://img.b2bpic.net/free-vector/gradient-technology-logo-collection_23-2148163493.jpg", "http://img.b2bpic.net/free-vector/gradient-abstract-logo-template_23-2148161323.jpg", "http://img.b2bpic.net/free-vector/geometric-harmony-hills-private-school-logo-template_742173-18879.jpg", "http://img.b2bpic.net/free-vector/retro-labels-collection_1009-307.jpg", "http://img.b2bpic.net/free-vector/flat-minimal-technology-labels_23-2149083696.jpg", "http://img.b2bpic.net/free-vector/editable-business-card-template-modern-design-collection_53876-114878.jpg", "http://img.b2bpic.net/free-vector/gold-circle-luxury-fashion-infinity-loop-logo_126523-2808.jpg"
]}
speed={40}
showCard={true}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Layers"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Get Started", href: "#hero" }}
/>
</div>
</ThemeProvider>
);
}