14 Commits

Author SHA1 Message Date
49fed17402 Merge version_5 into main
Merge version_5 into main
2026-03-07 19:58:36 +00:00
31f63c019b Update src/app/page.tsx 2026-03-07 19:58:32 +00:00
f90864c701 Merge version_5 into main
Merge version_5 into main
2026-03-07 19:57:36 +00:00
e778020231 Update src/app/page.tsx 2026-03-07 19:57:25 +00:00
ef640338f7 Merge version_5 into main
Merge version_5 into main
2026-03-07 19:56:28 +00:00
8ac9f12617 Update src/app/page.tsx 2026-03-07 19:56:24 +00:00
78424ab89c Switch to version 1: modified src/app/styles/base.css 2026-03-07 19:55:15 +00:00
a5411bdc10 Switch to version 1: modified src/app/layout.tsx 2026-03-07 19:55:14 +00:00
dd802cf3c1 Switch to version 2: modified src/app/styles/base.css 2026-03-07 19:55:04 +00:00
40991bda53 Switch to version 2: modified src/app/page.tsx 2026-03-07 19:55:04 +00:00
413406e108 Switch to version 2: modified src/app/layout.tsx 2026-03-07 19:55:04 +00:00
cd7cbc6ec9 Switch to version 3: modified src/app/page.tsx 2026-03-07 19:54:51 +00:00
79389b9b27 Switch to version 3: modified src/app/layout.tsx 2026-03-07 19:54:51 +00:00
1a9c967c7c Merge version_4 into main
Merge version_4 into main
2026-03-07 19:51:37 +00:00
2 changed files with 101 additions and 152 deletions

View File

@@ -1,32 +1,54 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import "./styles/variables.css"; import { Halant } from "next/font/google";
import "./styles/base.css";
import { Inter } from "next/font/google"; import { Inter } from "next/font/google";
import { Manrope } from "next/font/google";
import { DM_Sans } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant", subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({ const inter = Inter({
variable: "--font-inter", subsets: ["latin"], variable: "--font-inter", subsets: ["latin"],
}); });
const manrope = Manrope({
variable: "--font-manrope", subsets: ["latin"],
});
const dmSans = DM_Sans({
variable: "--font-dm-sans", subsets: ["latin"],
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: "FGA Growth - Scale Your E-Commerce Performance", description: "Data-driven digital marketing agency specializing in e-commerce growth, Meta Ads, TikTok Ads, and Google Ads optimization."}; title: "Performance Marketing Results | FGA Growth", description: "See proven case studies with 17x+ ROAS. FGA Growth scales e-commerce brands through data-driven performance marketing strategies.", keywords: "performance marketing, ROAS, case studies, e-commerce growth, marketing agency", openGraph: {
title: "Performance Marketing Results That Scale", description: "17x+ ROAS case studies from FGA Growth. Data-driven strategies for e-commerce success.", siteName: "FGA Growth", type: "website", images: [
{
url: "http://img.b2bpic.net/free-vector/online-shopping-sales-landing-page-template_23-2148826283.jpg", alt: "FGA Growth case study results"},
],
},
twitter: {
card: "summary_large_image", title: "Performance Marketing Results | FGA Growth", description: "17x+ ROAS. Proven case studies from leading performance marketing agency.", images: ["http://img.b2bpic.net/free-vector/online-shopping-sales-landing-page-template_23-2148826283.jpg"],
},
};
export default function RootLayout({ export default function RootLayout({
children, children,
}: { }: Readonly<{
children: React.ReactNode; children: React.ReactNode;
}) { }>) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<body className={`${inter.variable} antialiased`}>
<ServiceWrapper> <ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${manrope.variable} ${dmSans.variable} antialiased`}
>
<Tag /> <Tag />
</ServiceWrapper>
{children} {children}
<script type="application/ld+json">
{JSON.stringify({
"@context": "https://schema.org", "@type": "LocalBusiness", "name": "FGA Growth", "description": "Data-driven digital marketing agency specializing in e-commerce growth"
})}
</script>
<script <script
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
@@ -1395,14 +1417,7 @@ export default function RootLayout({
}} }}
/> />
</body> </body>
</ServiceWrapper>
</html> </html>
); );
} }
function ServiceWrapper({ children }: { children: React.ReactNode }) {
return <>{children}</>;
}
function Tag() {
return null;
}

View File

@@ -1,6 +1,9 @@
"use client"; "use client";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextAbout from '@/components/sections/about/TextAbout';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm'; import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal'; import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
@@ -33,136 +36,67 @@ export default function LandingPage() {
/> />
</div> </div>
<div id="testimonial" data-section="testimonial" className="relative w-full py-20 bg-black"> <div id="hero" data-section="hero">
<div className="relative w-full max-w-7xl mx-auto px-6"> <HeroBillboard
{/* Section Header */} title="Scale Your Performance Marketing"
<div className="mb-16"> description="Data-driven strategies that turn advertising spend into predictable revenue growth. We help e-commerce brands 2-5x their ROAS."
<div className="inline-block mb-4"> tag="Growth Agency"
<span className="text-sm font-medium text-yellow-500 uppercase tracking-wider">Premium Case Studies</span> tagAnimation="slide-up"
</div> background={{ variant: "plain" }}
<h2 className="text-5xl md:text-7xl font-bold text-white mb-4" style={{ fontFamily: 'var(--font-playfair-display), serif' }}> buttons={[
Our Proven Results { text: "Book Strategy Call", href: "#contact" },
</h2> { text: "View Case Studies", href: "#testimonial" }
<p className="text-lg text-gray-400">Transforming e-commerce brands with data-driven strategies</p> ]}
buttonAnimation="slide-up"
mediaAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/people-analyzing-checking-finance-graphs-office_23-2150377179.jpg?_wi=2"
imageAlt="Marketing performance analytics and growth metrics"
/>
</div> </div>
{/* 2x2 Grid of Case Study Cards */} <div id="testimonial" data-section="testimonial">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16"> <TestimonialCardSix
{/* Card 1 */} title="Proven Results"
<div className="bg-gradient-to-br from-gray-900 to-black border border-yellow-600/30 rounded-lg p-8 hover:border-yellow-500/50 transition-all"> description="Numbers That Don't Lie"
<div className="flex items-center justify-between mb-6"> tag="Case Studies"
<h3 className="text-2xl font-bold text-white" style={{ fontFamily: 'var(--font-playfair-display), serif' }}>Streetwear Brand Argentina</h3> tagAnimation="slide-up"
<span className="text-4xl">🦁</span> textboxLayout="default"
</div> useInvertedBackground={false}
<div className="bg-yellow-500/10 border border-yellow-500/20 rounded-lg p-4 mb-6"> animationType="slide-up"
<div className="text-5xl font-bold text-yellow-400 mb-2">17x+</div> testimonials={[
<div className="text-sm text-gray-300">ROAS Achieved</div> {
</div> id: "1", name: "Streetwear Brand Argentina", handle: "ROAS 17x+ | $0 → $42M ARS", testimonial: "Scaled from $0 to $42M ARS in 4 months through precision Meta Ads targeting across customer archetypes. Meta Ads, TikTok Ads, Lead Gen", imageSrc: "http://img.b2bpic.net/free-vector/online-shopping-sales-landing-page-template_23-2148826283.jpg", imageAlt: "Case study 1 performance metrics"
<div className="mb-6"> },
<div className="flex justify-between items-center mb-2"> {
<span className="text-sm text-gray-400">Revenue Growth</span> id: "2", name: "Fashion Jewelry Store", handle: "ROAS 2.89 | $51K → $227K/mo", testimonial: "Grew monthly revenue from $51K to $227K through integrated Meta Ads and Google Ads campaigns with creative hook optimization. Meta Ads, Google Ads", imageSrc: "http://img.b2bpic.net/free-vector/admin-dashboard-panel-template_23-2147904141.jpg?_wi=1", imageAlt: "Case study 2 revenue growth"
<span className="text-sm font-medium text-yellow-400">$0 $42M ARS</span> },
</div> {
<div className="w-full bg-gray-800 rounded-full h-2"> id: "3", name: "High-End Jewelry Store", handle: "ROAS 3.27 | $9K → $32K/mo", testimonial: "Tripled monthly revenue through luxury-focused TikTok Ads and Google Ads strategy targeting high-value customer segments. TikTok Ads, Google Ads", imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-man-working-with-tablet_23-2147717389.jpg", imageAlt: "Case study 3 luxury targeting results"
<div className="bg-gradient-to-r from-yellow-500 to-yellow-400 h-2 rounded-full" style={{ width: '95%' }}></div> },
</div> {
</div> id: "4", name: "Gold Jewelry Store", handle: "ROAS 4.79 | $8K → $23K/mo", testimonial: "Nearly tripled revenue through data-driven Meta Ads campaigns and lead generation strategy with continuous testing framework. Meta Ads, Lead Gen", imageSrc: "http://img.b2bpic.net/free-vector/admin-dashboard-panel-template_23-2147904141.jpg?_wi=2", imageAlt: "Case study 4 jewelry performance"
<p className="text-sm text-gray-400">Scaled through precision Meta Ads targeting across customer archetypes in 4 months</p> },
{
id: "5", name: "Premium E-Commerce Brand", handle: "ROAS 5.2+ | Featured Results", testimonial: "Implemented comprehensive testing framework around customer archetypes and creative hooks enabling rapid scaling across all channels. Meta Ads, TikTok Ads, Google Ads", imageSrc: "http://img.b2bpic.net/free-photo/people-analyzing-checking-finance-graphs-office_23-2150377179.jpg?_wi=1", imageAlt: "Premium brand success metrics"
},
{
id: "6", name: "Luxury Fashion Retailer", handle: "ROAS 3.8+ | Scaling Success", testimonial: "Built resilient growth system through channel diversification and audience segmentation resulting in consistent 30% monthly growth. Meta Ads, Google Ads, Lead Gen", imageSrc: "http://img.b2bpic.net/free-photo/smiley-business-man-outdoor_23-2148479594.jpg", imageAlt: "Luxury retail brand growth"
}
]}
speed={40}
topMarqueeDirection="left"
/>
</div> </div>
{/* Card 2 */} <div id="featured-quote" data-section="featured-quote">
<div className="bg-gradient-to-br from-gray-900 to-black border border-yellow-600/30 rounded-lg p-8 hover:border-yellow-500/50 transition-all"> <TextAbout
<div className="flex items-center justify-between mb-6"> tag="Client Testimonial"
<h3 className="text-2xl font-bold text-white" style={{ fontFamily: 'var(--font-playfair-display), serif' }}>Fashion Jewelry Store</h3> title="Fran built a testing framework around customer archetypes and creative hooks that allowed us to scale faster than we thought possible."
<span className="text-4xl"></span> useInvertedBackground={true}
</div> buttons={[
<div className="bg-yellow-500/10 border border-yellow-500/20 rounded-lg p-4 mb-6"> { text: "Read Full Case Study", href: "#testimonial" }
<div className="text-5xl font-bold text-yellow-400 mb-2">2.89</div> ]}
<div className="text-sm text-gray-300">ROAS</div> />
</div>
<div className="mb-6">
<div className="flex justify-between items-center mb-2">
<span className="text-sm text-gray-400">Monthly Revenue</span>
<span className="text-sm font-medium text-yellow-400">$51K $227K</span>
</div>
<div className="w-full bg-gray-800 rounded-full h-2">
<div className="bg-gradient-to-r from-yellow-500 to-yellow-400 h-2 rounded-full" style={{ width: '80%' }}></div>
</div>
</div>
<p className="text-sm text-gray-400">Integrated Meta Ads and Google Ads with creative hook optimization</p>
</div>
{/* Card 3 */}
<div className="bg-gradient-to-br from-gray-900 to-black border border-yellow-600/30 rounded-lg p-8 hover:border-yellow-500/50 transition-all">
<div className="flex items-center justify-between mb-6">
<h3 className="text-2xl font-bold text-white" style={{ fontFamily: 'var(--font-playfair-display), serif' }}>High-End Jewelry Store</h3>
<span className="text-4xl">💎</span>
</div>
<div className="bg-yellow-500/10 border border-yellow-500/20 rounded-lg p-4 mb-6">
<div className="text-5xl font-bold text-yellow-400 mb-2">3.27</div>
<div className="text-sm text-gray-300">ROAS</div>
</div>
<div className="mb-6">
<div className="flex justify-between items-center mb-2">
<span className="text-sm text-gray-400">Monthly Revenue</span>
<span className="text-sm font-medium text-yellow-400">$9K $32K</span>
</div>
<div className="w-full bg-gray-800 rounded-full h-2">
<div className="bg-gradient-to-r from-yellow-500 to-yellow-400 h-2 rounded-full" style={{ width: '72%' }}></div>
</div>
</div>
<p className="text-sm text-gray-400">Luxury-focused TikTok Ads and Google Ads targeting high-value segments</p>
</div>
{/* Card 4 */}
<div className="bg-gradient-to-br from-gray-900 to-black border border-yellow-600/30 rounded-lg p-8 hover:border-yellow-500/50 transition-all">
<div className="flex items-center justify-between mb-6">
<h3 className="text-2xl font-bold text-white" style={{ fontFamily: 'var(--font-playfair-display), serif' }}>Gold Jewelry Store</h3>
<span className="text-4xl">👑</span>
</div>
<div className="bg-yellow-500/10 border border-yellow-500/20 rounded-lg p-4 mb-6">
<div className="text-5xl font-bold text-yellow-400 mb-2">4.79</div>
<div className="text-sm text-gray-300">ROAS</div>
</div>
<div className="mb-6">
<div className="flex justify-between items-center mb-2">
<span className="text-sm text-gray-400">Monthly Revenue</span>
<span className="text-sm font-medium text-yellow-400">$8K $23K</span>
</div>
<div className="w-full bg-gray-800 rounded-full h-2">
<div className="bg-gradient-to-r from-yellow-500 to-yellow-400 h-2 rounded-full" style={{ width: '65%' }}></div>
</div>
</div>
<p className="text-sm text-gray-400">Data-driven Meta Ads campaigns with lead generation and continuous testing</p>
</div>
</div>
{/* Featured Quote Block */}
<div className="relative bg-gradient-to-r from-yellow-600/20 to-yellow-500/10 border border-yellow-500/30 rounded-xl p-12 mb-12">
<div className="absolute top-6 right-8 text-6xl opacity-20">🦁</div>
<blockquote className="relative z-10">
<p className="text-3xl font-bold text-white mb-6" style={{ fontFamily: 'var(--font-playfair-display), serif' }}>
"Fran built a testing framework around customer archetypes and creative hooks that allowed us to scale faster than we thought possible."
</p>
<div className="flex items-center gap-4">
<div className="w-12 h-12 bg-yellow-500/20 border border-yellow-500/40 rounded-full flex items-center justify-center">
<span className="text-xl">👥</span>
</div>
<div>
<div className="text-white font-semibold">Premium E-Commerce Client</div>
<div className="text-sm text-gray-400">Featured Case Study</div>
</div>
</div>
</blockquote>
</div>
{/* Gold Gradient CTA Button */}
<div className="flex justify-center">
<button className="bg-gradient-to-r from-yellow-500 to-yellow-400 hover:from-yellow-400 hover:to-yellow-300 text-black font-bold py-4 px-12 rounded-lg transition-all shadow-lg hover:shadow-xl hover:shadow-yellow-500/50">
View All Case Studies
</button>
</div>
</div>
</div> </div>
<div id="cta" data-section="cta"> <div id="cta" data-section="cta">