Merge version_1 into main #2
460
src/app/page.tsx
460
src/app/page.tsx
@@ -27,350 +27,138 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Why Us",
|
||||
id: "#why-us",
|
||||
},
|
||||
{
|
||||
name: "Process",
|
||||
id: "#process",
|
||||
},
|
||||
]}
|
||||
brandName="4th Dimension"
|
||||
button={{
|
||||
text: "Book a Call",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Why Us", id: "#why-us" },
|
||||
{ name: "Process", id: "#process" },
|
||||
]}
|
||||
brandName="4th Dimension"
|
||||
button={{
|
||||
text: "Book a Call", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "glowing-orb",
|
||||
}}
|
||||
title="Architects of Digital Revenue at Scale"
|
||||
description="We are a high-ticket agency providing done-for-you execution. From paid acquisition to full-stack funnel development, we engineer the systems that power your growth."
|
||||
tag="Performance-Driven Execution"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book a Call",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "View Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metallic-holographic-background_23-2148862196.jpg?_wi=1",
|
||||
imageAlt: "Digital Performance",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-background-with-flowing-cyber-lines_1048-16912.jpg",
|
||||
imageAlt: "Agency Systems",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-blue-smoke-swirls-white-background_272375-26333.jpg",
|
||||
imageAlt: "Abstract Light Blue Smoke Swirls on White Background",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-uv-light-background_53876-88806.jpg",
|
||||
imageAlt: "Blue UV light background",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/optical-fiber-background_23-2149301543.jpg",
|
||||
imageAlt: "Optical fiber background",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by scaling tech leaders"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "glowing-orb" }}
|
||||
title="Architects of Digital Revenue at Scale"
|
||||
description="We are a high-ticket agency providing done-for-you execution. From paid acquisition to full-stack funnel development, we engineer the systems that power your growth."
|
||||
tag="Performance-Driven Execution"
|
||||
buttons={[
|
||||
{ text: "Book a Call", href: "#contact" },
|
||||
{ text: "View Services", href: "#services" },
|
||||
]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/metallic-holographic-background_23-2148862196.jpg", imageAlt: "Digital Performance" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-background-with-flowing-cyber-lines_1048-16912.jpg", imageAlt: "Agency Systems" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by scaling tech leaders"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Paid Advertising",
|
||||
description: "Facebook/Instagram/TikTok ads. Includes strategy, creative direction, and full management. Ad spend managed separately.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038413.jpg",
|
||||
imageAlt: "Digital Marketing Interface",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169862.jpg",
|
||||
imageAlt: "Digital Marketing UI",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metallic-holographic-background_23-2148862196.jpg?_wi=2",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
{
|
||||
title: "SEO & Content",
|
||||
description: "Local GBP optimization or full Keyword/Content SEO. Strategy, briefs, and monthly performance reporting.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gradient-hex-backgrounds-networking_23-2149755779.jpg",
|
||||
imageAlt: "Abstract network connections",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-low-poly-abstract-background-with-connecting-lines-dots_1048-11673.jpg",
|
||||
imageAlt: "Network nodes",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345406.jpg",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
{
|
||||
title: "Web & Funnels",
|
||||
description: "Custom 5-10 page builds or high-converting funnels. Includes copy and mobile optimization. Bespoke performance funnels.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99785.jpg",
|
||||
imageAlt: "Web design interface mockup",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-aesthetic-background-with-3d-effect_23-2150644152.jpg",
|
||||
imageAlt: "Modern agency UI",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-device-connection-technology-concept_53876-31129.jpg",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
{
|
||||
title: "Video & Content",
|
||||
description: "Full promotional production or short-form content packages (Reels/TikTok). Scripting to distribution.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-cyber-network-visualization-design_1048-17445.jpg",
|
||||
imageAlt: "Video editing interface",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/asian-graphic-editor-working-editing-video-audio-footage-with-professional-software-create-film-content-post-production-using-movie-montage-edit-multimedia-movie_482257-49857.jpg",
|
||||
imageAlt: "Editing workflow",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-priest-with-puple-light_23-2149300865.jpg?_wi=1",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
{
|
||||
title: "Email Marketing",
|
||||
description: "Nurture campaigns and list reactivation sequences. End-to-end management from scheduling to reporting.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1",
|
||||
imageAlt: "Creative writing concept",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-desktop-with-notebook-top-agenda-laptop_23-2148430799.jpg",
|
||||
imageAlt: "Digital holographic text",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-working-as-interior-designer_23-2150346464.jpg?_wi=1",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
{
|
||||
title: "Automation & Integration",
|
||||
description: "CRM and workflow building (GoHighLevel/HubSpot). Lead routing and automation logic.",
|
||||
phoneOne: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5356.jpg?_wi=1",
|
||||
imageAlt: "Automation workflow",
|
||||
},
|
||||
phoneTwo: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background_1048-9652.jpg",
|
||||
imageAlt: "Interconnected nodes",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14781.jpg?_wi=1",
|
||||
imageAlt: "digital marketing interface",
|
||||
},
|
||||
]}
|
||||
showStepNumbers={false}
|
||||
title="End-to-End Execution Services"
|
||||
description="Our capabilities are built for performance. We handle the heavy lifting while you focus on the outcome."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Paid Advertising", description: "Facebook/Instagram/TikTok ads. Includes strategy, creative direction, and full management. Ad spend managed separately.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038413.jpg", imageAlt: "Digital Marketing Interface" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169862.jpg", imageAlt: "Digital Marketing UI" }
|
||||
},
|
||||
{
|
||||
title: "SEO & Content", description: "Local GBP optimization or full Keyword/Content SEO. Strategy, briefs, and monthly performance reporting.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/gradient-hex-backgrounds-networking_23-2149755779.jpg", imageAlt: "Abstract network connections" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/3d-low-poly-abstract-background-with-connecting-lines-dots_1048-11673.jpg", imageAlt: "Network nodes" }
|
||||
}
|
||||
]}
|
||||
showStepNumbers={false}
|
||||
title="End-to-End Execution Services"
|
||||
description="Our capabilities are built for performance. We handle the heavy lifting while you focus on the outcome."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why-us" data-section="why-us">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Systems over Freelancers"
|
||||
buttons={[
|
||||
{
|
||||
text: "Discuss Your Strategy",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="why-us" data-section="why-us">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Systems over Freelancers"
|
||||
buttons={[
|
||||
{ text: "Discuss Your Strategy", href: "#contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "01",
|
||||
description: "Deep-Dive Audit",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "02",
|
||||
description: "Strategic Alignment",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "03",
|
||||
description: "System Build",
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "04",
|
||||
description: "Scale & Optimize",
|
||||
},
|
||||
]}
|
||||
title="Our Precision Delivery Flow"
|
||||
description="A refined, done-for-you approach designed for predictable scaling."
|
||||
/>
|
||||
</div>
|
||||
<div id="process" data-section="process">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "01", description: "Deep-Dive Audit" },
|
||||
{ id: "m2", value: "02", description: "Strategic Alignment" },
|
||||
{ id: "m3", value: "03", description: "System Build" },
|
||||
{ id: "m4", value: "04", description: "Scale & Optimize" },
|
||||
]}
|
||||
title="Our Precision Delivery Flow"
|
||||
description="A refined, done-for-you approach designed for predictable scaling."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex Rivers",
|
||||
role: "CEO",
|
||||
company: "ScaleTech",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-priest-with-puple-light_23-2149300865.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah Chen",
|
||||
role: "Founder",
|
||||
company: "GrowthLabs",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "James Vol",
|
||||
role: "Director",
|
||||
company: "Venture",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-working-as-interior-designer_23-2150346464.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Mina Ross",
|
||||
role: "CMO",
|
||||
company: "LaunchPad",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5356.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David King",
|
||||
role: "COO",
|
||||
company: "DigitalSystems",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14781.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Proven Performance"
|
||||
description="Trusted by high-ticket founders across diverse industries."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alex Rivers", role: "CEO", company: "ScaleTech", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-priest-with-puple-light_23-2149300865.jpg" },
|
||||
{ id: "2", name: "Sarah Chen", role: "Founder", company: "GrowthLabs", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg" }
|
||||
]}
|
||||
title="Proven Performance"
|
||||
description="Trusted by high-ticket founders across diverse industries."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How is pricing structured?",
|
||||
content: "We offer bespoke proposals based on the scope and ROI potential. We specialize in high-ticket engagements.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Is ad spend included?",
|
||||
content: "Ad spend is always paid directly to the platforms to ensure full transparency and control.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "What's the onboarding process?",
|
||||
content: "Once booked, we perform a deep-dive audit and set up your environment within the first 48 hours.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Clear, concise answers to help you make informed decisions."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "How is pricing structured?", content: "We offer bespoke proposals based on the scope and ROI potential. We specialize in high-ticket engagements." },
|
||||
{ id: "f2", title: "Is ad spend included?", content: "Ad spend is always paid directly to the platforms to ensure full transparency and control." }
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Clear, concise answers to help you make informed decisions."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Booking Discovery"
|
||||
title="Are you ready to scale?"
|
||||
description="Book a discovery session to outline your growth roadmap."
|
||||
buttons={[
|
||||
{
|
||||
text: "Schedule Discovery",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Booking Discovery"
|
||||
title="Are you ready to scale?"
|
||||
description="Book a discovery session to outline your growth roadmap."
|
||||
buttons={[
|
||||
{ text: "Schedule Discovery", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Agency",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Process",
|
||||
href: "#process",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 4th Dimension Digital"
|
||||
bottomRightText="Premium Agency Execution"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Agency", items: [{ label: "Services", href: "#services" }, { label: "Process", href: "#process" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 4th Dimension Digital"
|
||||
bottomRightText="Premium Agency Execution"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user