86 Commits

Author SHA1 Message Date
b0210d44ff Update src/app/thank-you/page.tsx 2026-03-05 13:42:49 +00:00
4ddd0fae64 Update src/app/page.tsx 2026-03-05 13:42:48 +00:00
96cf8fe822 Update src/app/layout.tsx 2026-03-05 13:42:48 +00:00
3c46b37f19 Merge version_18 into main
Merge version_18 into main
2026-03-05 13:35:39 +00:00
343dc3aa4b Update src/app/page.tsx 2026-03-05 13:35:35 +00:00
fa739da65f Update src/app/layout.tsx 2026-03-05 13:35:34 +00:00
dd9f8dd11b Merge version_17 into main
Merge version_17 into main
2026-03-05 13:31:46 +00:00
de7921dcf2 Update src/app/page.tsx 2026-03-05 13:31:42 +00:00
aaa107a8f2 Update src/app/layout.tsx 2026-03-05 13:31:41 +00:00
d58e0f6db4 Switch to version 15: modified src/app/styles/variables.css 2026-03-05 13:06:25 +00:00
09f71fe071 Switch to version 15: modified src/app/page.tsx 2026-03-05 13:06:25 +00:00
f741842e42 Switch to version 15: modified src/app/layout.tsx 2026-03-05 13:06:24 +00:00
e71f68d950 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 13:01:59 +00:00
b29a136927 Switch to version 16: modified src/app/page.tsx 2026-03-05 13:01:58 +00:00
a334e75d98 Switch to version 16: modified src/app/layout.tsx 2026-03-05 13:01:58 +00:00
4cd4563a81 Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:59:05 +00:00
a2b7ffccfd Switch to version 15: modified src/app/page.tsx 2026-03-05 12:59:04 +00:00
e7dd8cffb4 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:59:03 +00:00
158598b397 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:57:12 +00:00
4f288a7aa8 Switch to version 16: modified src/app/page.tsx 2026-03-05 12:57:11 +00:00
f7957f64d5 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:57:10 +00:00
7725cff7ee Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:56:26 +00:00
92a2671031 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:56:26 +00:00
762a6b788d Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:56:25 +00:00
8c13acb37e Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:56:13 +00:00
e654873cc1 Switch to version 16: modified src/app/page.tsx 2026-03-05 12:56:12 +00:00
582e372208 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:56:11 +00:00
b920d66603 Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:55:52 +00:00
28ea541a07 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:55:52 +00:00
ecb51cf35c Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:55:51 +00:00
1d1cb3e25e Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:21:26 +00:00
cd43b2423c Switch to version 14: modified src/app/page.tsx 2026-03-05 12:21:25 +00:00
bf14dde886 Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:21:25 +00:00
775c58dd5f Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:21:12 +00:00
ca54c45148 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:21:12 +00:00
b8a60846fa Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:21:11 +00:00
7df6cb9adc Merge version_16 into main
Merge version_16 into main
2026-03-05 12:20:42 +00:00
92ed70cb51 Update theme colors 2026-03-05 12:20:35 +00:00
2022cff594 Switch to version 16: modified src/app/styles/variables.css 2026-03-05 12:19:29 +00:00
a3fb84396d Switch to version 16: modified src/app/page.tsx 2026-03-05 12:19:28 +00:00
3c2670e684 Switch to version 16: modified src/app/layout.tsx 2026-03-05 12:19:28 +00:00
ff5e4fc53b Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:19:18 +00:00
9b56793461 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:19:17 +00:00
761cea35b5 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:19:17 +00:00
a9dd4797f0 Switch to version 14: modified src/app/page.tsx 2026-03-05 12:19:00 +00:00
1f8dcc0d2f Switch to version 13: modified src/app/page.tsx 2026-03-05 12:18:17 +00:00
4b299fa5eb Switch to version 12: modified src/app/page.tsx 2026-03-05 12:17:31 +00:00
1364284317 Switch to version 13: modified src/app/page.tsx 2026-03-05 12:17:14 +00:00
6ed9bf2554 Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:16:50 +00:00
27c0ba48c9 Switch to version 14: modified src/app/page.tsx 2026-03-05 12:16:49 +00:00
b5f1ed8f9e Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:16:48 +00:00
327c83d2c6 Switch to version 15: added src/app/thank-you/page.tsx 2026-03-05 12:15:53 +00:00
47798547bb Switch to version 15: modified src/app/page.tsx 2026-03-05 12:15:53 +00:00
bb0610599e Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:15:52 +00:00
b74202f2b1 Switch to version 14: remove src/app/thank-you/page.tsx 2026-03-05 12:15:42 +00:00
2e2b93e65c Switch to version 14: modified src/app/page.tsx 2026-03-05 12:15:42 +00:00
e9f886752a Switch to version 14: modified src/app/layout.tsx 2026-03-05 12:15:42 +00:00
cbdd5bd21a Switch to version 15: modified src/app/styles/variables.css 2026-03-05 12:15:37 +00:00
5b0ad54dc3 Switch to version 15: modified src/app/page.tsx 2026-03-05 12:15:36 +00:00
f0d015ede5 Switch to version 15: modified src/app/layout.tsx 2026-03-05 12:15:36 +00:00
3c53b25ead Merge version_16 into main
Merge version_16 into main
2026-03-05 12:15:13 +00:00
1727e38d3c Update theme colors 2026-03-05 12:15:07 +00:00
3e7815f595 Merge version_16 into main
Merge version_16 into main
2026-03-05 12:14:23 +00:00
0894ecbe8c Update theme colors 2026-03-05 12:14:16 +00:00
07badd52e6 Merge version_16 into main
Merge version_16 into main
2026-03-05 12:14:06 +00:00
ab1b99a53f Update theme colors 2026-03-05 12:13:59 +00:00
98102d181f Merge version_16 into main
Merge version_16 into main
2026-03-05 12:11:51 +00:00
9b9f3354a8 Update src/app/page.tsx 2026-03-05 12:11:46 +00:00
0b12075419 Update src/app/layout.tsx 2026-03-05 12:11:46 +00:00
dad477b06e Merge version_15 into main
Merge version_15 into main
2026-03-05 06:39:59 +00:00
ed40fec024 Add src/app/thank-you/page.tsx 2026-03-05 06:39:55 +00:00
34db2ddbf0 Update src/app/page.tsx 2026-03-05 06:39:54 +00:00
c08bfd11f8 Update src/app/layout.tsx 2026-03-05 06:39:54 +00:00
681266e374 Merge version_14 into main
Merge version_14 into main
2026-03-05 05:15:06 +00:00
df52fd53a5 Update src/app/page.tsx 2026-03-05 05:15:01 +00:00
7967ae572b Merge version_14 into main
Merge version_14 into main
2026-03-05 05:13:34 +00:00
b4deea5982 Update src/app/page.tsx 2026-03-05 05:13:30 +00:00
e489f74440 Merge version_13 into main
Merge version_13 into main
2026-03-05 05:10:36 +00:00
9a89f7be97 Update src/app/page.tsx 2026-03-05 05:10:32 +00:00
5548158ae2 Merge version_12 into main
Merge version_12 into main
2026-03-05 05:07:09 +00:00
6f11ebac09 Update src/app/page.tsx 2026-03-05 05:07:05 +00:00
45e956d16a Update src/app/layout.tsx 2026-03-05 05:07:05 +00:00
ff8938ec0f Merge version_11 into main
Merge version_11 into main
2026-03-05 05:04:11 +00:00
98f7cb8ba6 Update src/app/page.tsx 2026-03-05 05:04:07 +00:00
fe1b84e4d2 Update src/app/layout.tsx 2026-03-05 05:04:07 +00:00
2a8616b144 Merge version_10 into main
Merge version_10 into main
2026-03-05 05:01:16 +00:00
3 changed files with 396 additions and 71 deletions

View File

@@ -1,8 +1,12 @@
import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
const inter = Inter({ subsets: ["latin"] });
export const metadata: Metadata = {
title: "Efficient Ads - Agency-Quality Ad Creatives in 48 Hours", description: "Get professional ad creatives delivered in 48 hours at half the traditional cost. 40% faster, 50% cheaper. Perfect for agencies, brands, and creators."};
title: "studio ads - Professional Ad Creatives in 48 Hours", description: "Get agency-quality ad creatives delivered in 48 hours. 40% ROAS increase, 50% cheaper than traditional agencies."
};
export default function RootLayout({
children,
@@ -11,9 +15,7 @@ export default function RootLayout({
}) {
return (
<html lang="en">
<body>
{children}
<body className={inter.className}>{children}
<script
dangerouslySetInnerHTML={{
__html: `
@@ -1383,4 +1385,4 @@ export default function RootLayout({
</body>
</html>
);
}
}

View File

@@ -11,11 +11,31 @@ import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import { BarChart3, Briefcase, CreditCard, Mail, Package, Palette, Shield, ShoppingCart, TrendingUp, Users, Zap, Sparkles, Database, Crown, Play, Image, Layers, Clock, CheckCircle, HelpCircle, Calendar } from "lucide-react";
import { useState } from "react";
import Input from "@/components/form/Input";
import { BarChart3, Briefcase, CreditCard, Mail, Package, Palette, Shield, ShoppingCart, TrendingUp, Users, Zap, Sparkles, Database, Crown, Play, Image, Layers, Clock, CheckCircle, HelpCircle, Calendar, ArrowRight, MessageCircle, Zap as ZapIcon } from "lucide-react";
import { useState, useEffect } from "react";
import Link from "next/link";
export default function LandingPage() {
const [showComparison, setShowComparison] = useState(false);
const [urlInput, setUrlInput] = useState("");
const [isScrolled, setIsScrolled] = useState(false);
const [showMobileCTA, setShowMobileCTA] = useState(false);
useEffect(() => {
const handleScroll = () => {
setIsScrolled(window.scrollY > 100);
setShowMobileCTA(window.scrollY > 500);
};
window.addEventListener("scroll", handleScroll);
return () => window.removeEventListener("scroll", handleScroll);
}, []);
const handleUrlSubmit = () => {
if (urlInput.trim()) {
window.location.href = `/thank-you?url=${encodeURIComponent(urlInput)}`;
}
};
return (
<ThemeProvider
@@ -31,26 +51,55 @@ export default function LandingPage() {
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Efficient Ads"
navItems={[
{ name: "How it Works", id: "how-it-works" },
{ name: "Pricing", id: "pricing" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Claim Your 3 Free Ads Now", href: "#free-offer"
}}
animateOnLoad={true}
/>
<div className={`fixed top-0 left-0 right-0 z-50 transition-all duration-300 ${
isScrolled ? 'bg-background/95 backdrop-blur-md shadow-lg' : 'bg-transparent'
}`}>
<NavbarLayoutFloatingInline
brandName="studio ads"
navItems={[
{ name: "How it Works", id: "how-it-works" },
{ name: "Pricing", id: "pricing" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" }
]}
button={{
text: "Get 3 Free Ads Now", href: "#free-offer"
}}
animateOnLoad={true}
/>
</div>
</div>
{/* Floating WhatsApp Chat Button */}
<div className="fixed bottom-6 right-6 z-40">
<a
href="https://wa.me/1234567890"
target="_blank"
rel="noopener noreferrer"
className="flex items-center justify-center w-14 h-14 rounded-full bg-primary-cta text-primary-cta-text hover:scale-110 transition-transform shadow-lg"
aria-label="Chat on WhatsApp"
>
<MessageCircle size={24} />
</a>
</div>
{/* Mobile-only CTA Bar */}
{showMobileCTA && (
<div className="fixed bottom-0 left-0 right-0 z-40 md:hidden bg-primary-cta text-primary-cta-text p-4 shadow-lg">
<button
onClick={() => document.getElementById('free-offer')?.scrollIntoView({ behavior: 'smooth' })}
className="w-full py-3 px-4 bg-white text-primary-cta font-semibold rounded-full hover:opacity-90 transition-opacity"
>
Get 3 Free Ads
</button>
</div>
)}
<div id="hero" data-section="hero">
<HeroCentered
title="Agency-Quality Ad Creatives. Delivered in 48 Hours."
description="40% faster delivery and 50% cheaper than traditional agencies—get stunning video ads, static creatives, and full-funnel packs in 48 hours. Launch winning campaigns 3x faster. Perfect for agencies, brands, and creators who refuse to compromise on quality."
title="40% ROAS Increase in 48 Hours"
description="Professional ad creatives delivered in 48 hours instead of 3 weeks. Agency-quality video ads and static creatives, 50% cheaper than traditional agencies."
background={{ variant: "downward-rays-animated" }}
avatars={[
{
@@ -65,21 +114,69 @@ export default function LandingPage() {
]}
avatarText="Trusted by 100+ agencies and brands"
buttons={[
{ text: "Claim Your 3 Free Ads Now", href: "#free-offer" },
{ text: "Get 3 Free Ads Now", href: "#free-offer" },
{ text: "See Our Work", href: "#features" }
]}
buttonAnimation="slide-up"
ariaLabel="Hero section - Efficient Ads agency-quality ads in 48 hours"
ariaLabel="Hero section - studio ads professional ad creatives in 48 hours"
/>
</div>
{/* Metrics Strip Section */}
<div id="metrics" data-section="metrics" className="py-12 md:py-16 bg-card border-y border-accent/10">
<div className="max-w-6xl mx-auto px-4">
<div className="grid grid-cols-1 md:grid-cols-4 gap-6 md:gap-8">
<div className="text-center">
<div className="text-3xl md:text-4xl font-bold text-primary-cta mb-2">$2.3M+</div>
<p className="text-foreground/70 text-sm md:text-base">Ad Spend Managed</p>
</div>
<div className="text-center">
<div className="text-3xl md:text-4xl font-bold text-primary-cta mb-2">34%</div>
<p className="text-foreground/70 text-sm md:text-base">Avg CPC Reduction</p>
</div>
<div className="text-center">
<div className="text-3xl md:text-4xl font-bold text-primary-cta mb-2">48hr</div>
<p className="text-foreground/70 text-sm md:text-base">Delivery Time</p>
</div>
<div className="text-center">
<div className="text-3xl md:text-4xl font-bold text-primary-cta mb-2">200+</div>
<p className="text-foreground/70 text-sm md:text-base">Creatives Delivered</p>
</div>
</div>
</div>
</div>
{/* Platform Logo Strip */}
<div id="platforms" data-section="platforms" className="py-8 md:py-12 bg-background">
<div className="max-w-6xl mx-auto px-4">
<p className="text-center text-foreground/60 text-sm md:text-base mb-6 md:mb-8">We create ads optimized for all major platforms</p>
<div className="flex flex-wrap justify-center items-center gap-6 md:gap-10">
<div className="flex items-center gap-2 text-foreground/70 font-semibold">
<span className="text-lg">f</span> Meta
</div>
<div className="flex items-center gap-2 text-foreground/70 font-semibold">
<span className="text-lg"></span> TikTok
</div>
<div className="flex items-center gap-2 text-foreground/70 font-semibold">
<span className="text-lg"></span> YouTube
</div>
<div className="flex items-center gap-2 text-foreground/70 font-semibold">
<span className="text-lg">G</span> Google
</div>
<div className="flex items-center gap-2 text-foreground/70 font-semibold">
<span className="text-lg"></span> Display
</div>
</div>
</div>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
title="Proven Results for Growing Brands"
description="Real numbers from real clients achieving real results"
description="40% Average ROAS Increase. 3 Weeks Production Time Cut to 48 Hours. Real numbers from real clients achieving real results."
tag="Social Proof"
tagIcon={TrendingUp}
names={["200+ Ad Variations", "48-Hour Turnaround", "95% Client Satisfaction", "10M+ Impressions Generated", "3x Faster Production"]}
names={["40% Average ROAS Increase", "3 Weeks Production Time Cut to 48 Hours", "95% Client Satisfaction", "10M+ Impressions Generated", "50% Cost Savings vs Agencies"]}
textboxLayout="default"
useInvertedBackground={true}
speed={40}
@@ -93,14 +190,14 @@ export default function LandingPage() {
<div id="pain-points" data-section="pain-points">
<FeatureBorderGlow
title="The Old Way vs. The Efficient Ads Way"
title="The Old Way vs. The studio ads Way"
description="Stop wasting weeks on ad production. Here's how we're different."
tag="Why Switch"
tagIcon={Zap}
features={[
{
icon: Clock,
title: "Weeks of Back-and-Forth", description: "Traditional agencies take weeks for approvals and revisions. We deliver in 48 hours."
title: "3 Weeks Production Time vs 48 Hours", description: "Traditional agencies take weeks for approvals and revisions. We deliver in 48 hours."
},
{
icon: Users,
@@ -112,11 +209,11 @@ export default function LandingPage() {
},
{
icon: TrendingUp,
title: "Unknown Performance", description: "Guessing which creatives will perform best. We optimize based on real data insights."
title: "40% Average ROAS Increase", description: "Guessing which creatives will perform best. We optimize based on real data insights."
},
{
icon: CreditCard,
title: "Unpredictable Costs", description: "Hidden fees and scope creep add up fast. Our pricing is transparent and fixed."
title: "50% Cheaper Than Agencies", description: "Hidden fees and scope creep add up fast. Our pricing is transparent and fixed."
},
{
icon: Sparkles,
@@ -208,18 +305,128 @@ export default function LandingPage() {
]}
buttonAnimation="opacity"
/>
{/* Comparison Chart Section */}
<div className="mt-12 md:mt-16 px-4">
<div className="max-w-5xl mx-auto">
<div className="mb-8 text-center">
<h3 className="text-2xl md:text-3xl font-bold text-foreground mb-3">studio ads vs Traditional Agencies</h3>
<p className="text-foreground/70">See how we stack up against the competition</p>
</div>
<div className="bg-card rounded-lg border border-accent/20 overflow-hidden">
<div className="overflow-x-auto">
<table className="w-full text-sm">
<thead>
<tr className="bg-primary-cta/10 border-b border-accent/20">
<th className="text-left py-4 px-4 font-semibold text-foreground">Feature</th>
<th className="text-center py-4 px-4 font-semibold text-primary-cta">studio ads</th>
<th className="text-center py-4 px-4 font-semibold text-foreground/60">Traditional Agencies</th>
</tr>
</thead>
<tbody>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Turnaround Time</td>
<td className="text-center py-4 px-4 text-primary-cta font-semibold">48 Hours</td>
<td className="text-center py-4 px-4 text-foreground/70">2-3 Weeks</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Cost per Creative</td>
<td className="text-center py-4 px-4 text-primary-cta font-semibold">50% Less</td>
<td className="text-center py-4 px-4 text-foreground/70">$2,000-$5,000+</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Creative Variations</td>
<td className="text-center py-4 px-4 text-primary-cta font-semibold">10+ Options</td>
<td className="text-center py-4 px-4 text-foreground/70">1-3 Options</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Revision Process</td>
<td className="text-center py-4 px-4 text-primary-cta font-semibold">24hr Revisions</td>
<td className="text-center py-4 px-4 text-foreground/70">1-2 Weeks</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Unlimited Projects</td>
<td className="text-center py-4 px-4"><CheckCircle size={20} className="inline text-primary-cta" /></td>
<td className="text-center py-4 px-4 text-foreground/40">-</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Dedicated Account Manager</td>
<td className="text-center py-4 px-4"><CheckCircle size={20} className="inline text-primary-cta" /></td>
<td className="text-center py-4 px-4 text-foreground/40">-</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Platform Optimization</td>
<td className="text-center py-4 px-4"><CheckCircle size={20} className="inline text-primary-cta" /></td>
<td className="text-center py-4 px-4 text-foreground/40">-</td>
</tr>
<tr className="border-b border-accent/10 hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Average ROAS Lift</td>
<td className="text-center py-4 px-4 text-primary-cta font-semibold">40%</td>
<td className="text-center py-4 px-4 text-foreground/70">15-25%</td>
</tr>
<tr className="hover:bg-accent/5 transition-colors">
<td className="py-4 px-4 text-foreground font-medium">Performance Tracking</td>
<td className="text-center py-4 px-4"><CheckCircle size={20} className="inline text-primary-cta" /></td>
<td className="text-center py-4 px-4 text-foreground/40">-</td>
</tr>
</tbody>
</table>
</div>
</div>
<p className="text-center text-foreground/60 text-sm mt-6">Comparison based on industry averages and typical agency practices. Results may vary.</p>
</div>
</div>
</div>
<div id="free-offer" data-section="free-offer">
<div className="relative py-16 md:py-20 px-4 bg-gradient-to-br from-primary-cta/5 to-accent/5">
<div className="max-w-2xl mx-auto">
<div className="text-center mb-8">
<h2 className="text-3xl md:text-4xl font-bold text-foreground mb-3">Claim Your 3 Free Ads Now</h2>
<p className="text-foreground/70 mb-6">Try our service risk-free. No credit card required upfront. Get agency-quality ad creatives delivered in 48 hours.</p>
</div>
<div className="flex flex-col gap-4 max-w-lg mx-auto">
<div className="flex gap-2">
<Input
value={urlInput}
onChange={setUrlInput}
type="url"
placeholder="e.g. yourbrand.com"
required
/>
<button
onClick={handleUrlSubmit}
className="px-6 py-3 bg-primary-cta text-primary-cta-text font-semibold rounded-full hover:opacity-90 transition-opacity whitespace-nowrap"
>
Submit
</button>
</div>
<button
onClick={handleUrlSubmit}
className="w-full py-4 px-6 bg-primary-cta text-primary-cta-text font-semibold rounded-full hover:opacity-90 transition-opacity text-lg"
>
Get 3 Free Ads Now
</button>
</div>
<p className="text-center text-foreground/60 text-xs md:text-sm mt-4">
No credit card required. 30-day money-back guarantee on paid plans.
</p>
</div>
</div>
</div>
<div id="pricing" data-section="pricing">
<div className="relative">
<div className="flex justify-center mb-6">
<div className="flex justify-center mb-8">
<button
onClick={() => setShowComparison(!showComparison)}
className="inline-flex items-center gap-2 px-4 py-2 rounded-full bg-primary-button text-primary hover:opacity-80 transition-opacity"
aria-label="Toggle feature comparison"
className="inline-flex items-center gap-2 px-6 py-3 rounded-full bg-primary-cta text-primary-cta-text hover:opacity-80 transition-opacity font-semibold"
aria-label="View plan comparison"
>
<CheckCircle size={18} />
<span>{showComparison ? "Hide Comparison" : "Show Plan Comparison"}</span>
<CheckCircle size={20} />
<span>View Plan Comparison</span>
</button>
</div>
{showComparison && (
@@ -236,6 +443,12 @@ export default function LandingPage() {
</tr>
</thead>
<tbody>
<tr className="border-b border-accent/10">
<td className="py-3 px-3">Average ROAS Lift</td>
<td className="text-center py-3 px-3">20%</td>
<td className="text-center py-3 px-3">40%</td>
<td className="text-center py-3 px-3">Custom</td>
</tr>
<tr className="border-b border-accent/10">
<td className="py-3 px-3">Projects/Month</td>
<td className="text-center py-3 px-3">4</td>
@@ -285,25 +498,25 @@ export default function LandingPage() {
tagIcon={CreditCard}
plans={[
{
id: "starter", badge: "Starter", badgeIcon: Sparkles,
price: "$1,500", subtitle: "Per Month (Recurring)", buttons: [
{ text: "Get Started", href: "#free-offer" }
],
features: [
"✓ 4 ad projects per month", "✓ Video ads (up to 3 variations each)", "✓ Static creatives (10+ variations)", "✓ Full-funnel packs", "✓ 48-hour turnaround", "✓ Brand consistency maintained", "✓ Email support"
]
},
{
id: "growth", badge: "Most Popular", badgeIcon: Zap,
id: "growth", badge: "Growth - Most Popular - 40% ROAS Lift", badgeIcon: ZapIcon,
price: "$5,000", subtitle: "Per Month (Recurring)", buttons: [
{ text: "Get Started", href: "#free-offer" }
{ text: "Start Your 48-Hour Project", href: "#free-offer" }
],
features: [
"✓ Unlimited ad projects", "✓ 30 ad creatives (video & static mix)", "✓ Full-funnel packs included", "✓ 24-hour turnaround available", "✓ A/B testing variations", "✓ Performance analytics", "✓ Priority support", "✓ Dedicated account manager"
]
},
{
id: "enterprise", badge: "Enterprise", badgeIcon: Calendar,
id: "starter", badge: "Starter - 20% Average ROAS Lift", badgeIcon: Sparkles,
price: "$1,500", subtitle: "Per Month (Recurring)", buttons: [
{ text: "Get 3 Free Ads Now", href: "#free-offer" }
],
features: [
"✓ 4 ad projects per month", "✓ Video ads (up to 3 variations each)", "✓ Static creatives (10+ variations)", "✓ Full-funnel packs", "✓ 48-hour turnaround", "✓ Brand consistency maintained", "✓ Email support"
]
},
{
id: "enterprise", badge: "Enterprise - Custom ROAS", badgeIcon: Calendar,
price: "Custom", subtitle: "Schedule a Call", buttons: [
{ text: "Book Appointment", href: "#contact" }
],
@@ -319,21 +532,6 @@ export default function LandingPage() {
/>
</div>
<div id="free-offer" data-section="free-offer">
<ContactCenter
tag="Free Trial - Risk Free"
title="See Results in 48 Hours"
description="Try our service risk-free. No credit card required upfront. Get agency-quality ad creatives delivered in 48 hours. Plus, enjoy a 30-day money-back guarantee on paid plans. No follow-up sales calls. No obligations."
tagIcon={Sparkles}
background={{ variant: "downward-rays-static-grid" }}
useInvertedBackground={true}
inputPlaceholder="Enter your email address"
buttonText="Claim Your 3 Free Ads Now"
termsText="By claiming your free ads, you agree to our Terms and Conditions. No credit card required. 30-day money-back guarantee on paid plans. No follow-up calls. No obligations."
ariaLabel="Free ad offer signup"
/>
</div>
<div id="who-its-for" data-section="who-its-for">
<FeatureBorderGlow
title="Who We Help"
@@ -375,7 +573,7 @@ export default function LandingPage() {
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
testimonial="We went from spending 3 weeks on ad production to 48 hours. The quality is exceptional and our ROAS improved by 40%. Efficient Ads is a game-changer for our agency."
testimonial="We went from spending 3 weeks on ad production to 48 hours. The quality is exceptional and our ROAS improved by 40%. studio ads is a game-changer for our agency."
rating={5}
author="Emma Rodriguez, Creative Director"
avatars={[
@@ -412,13 +610,13 @@ export default function LandingPage() {
id: "5", title: "Can I get unlimited revisions?", content: "Revision allowances vary by plan. Our Growth and Enterprise plans include comprehensive revision options. We work with you until you're happy with the results—we succeed when you succeed."
},
{
id: "6", title: "What's included in the free 3 ads offer?", content: "You get three custom ad creatives tailored to your business. This might be a mix of video ads, static creatives, or a full-funnel sample. No credit card needed, no follow-up sales calls—just quality work to show what we can do."
id: "6", title: "What's included in the free 3 ads offer?", content: "You get three custom ad creatives tailored to your business. This might be a mix of video ads, static creatives, or a full-funnel sample. No credit card needed."
}
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png?_wi=2"
imageAlt="FAQ support team"
title="Frequently Asked Questions"
description="Everything you need to know about working with Efficient Ads."
description="Everything you need to know about working with studio ads."
tag="Help"
tagIcon={HelpCircle}
mediaAnimation="slide-up"
@@ -433,13 +631,13 @@ export default function LandingPage() {
<ContactCenter
tag="Get Started"
title="Ready to Scale Your Creative Output?"
description="Join 100+ brands and agencies already transforming their ad production with Efficient Ads. Start with your free 3 ads today. 30-day money-back guarantee. No credit card required. Cancel anytime."
description="Join 100+ brands and agencies already transforming their ad production with studio ads. Start with your free 3 ads today. 30-day money-back guarantee. No credit card required. Cancel anytime."
tagIcon={Mail}
background={{ variant: "downward-rays-static-grid" }}
useInvertedBackground={true}
inputPlaceholder="Enter your email address"
buttonText="Claim Your 3 Free Ads Now"
termsText="By claiming your free ads, you're confirming that you agree with our Terms and Conditions. No credit card required. 30-day money-back guarantee on paid plans. Cancel anytime, no questions asked."
buttonText="Get 3 Free Ads Now"
termsText="No credit card required. 30-day money-back guarantee on paid plans. Cancel anytime."
ariaLabel="Contact form and ad offer signup"
/>
</div>
@@ -471,10 +669,10 @@ export default function LandingPage() {
]
}
]}
copyrightText="© 2025 Efficient Ads. All rights reserved."
copyrightText="© 2025 studio ads. All rights reserved."
ariaLabel="Footer navigation and company information"
/>
</div>
</ThemeProvider>
);
}
}

125
src/app/thank-you/page.tsx Normal file
View File

@@ -0,0 +1,125 @@
"use client";
import { useSearchParams } from "next/navigation";
import { CheckCircle, ArrowRight } from "lucide-react";
import Link from "next/link";
export default function ThankYouPage() {
const searchParams = useSearchParams();
const url = searchParams.get("url") || "";
return (
<div className="min-h-screen bg-background flex items-center justify-center px-4 py-20">
<div className="max-w-2xl w-full">
<div className="text-center mb-8">
<div className="inline-flex items-center justify-center w-16 h-16 rounded-full bg-primary-cta/20 mb-6">
<CheckCircle size={32} className="text-primary-cta" />
</div>
<h1 className="text-4xl md:text-5xl font-bold text-foreground mb-4">
Thank You!
</h1>
<p className="text-lg text-foreground/70 mb-2">
Your free 3 ad creatives are on the way.
</p>
{url && (
<p className="text-base text-foreground/60 mb-8">
We've received your website: <span className="font-semibold text-foreground">{url}</span>
</p>
)}
</div>
<div className="bg-card border border-accent/20 rounded-lg p-8 mb-8">
<h2 className="text-2xl font-bold text-foreground mb-6">What's Next?</h2>
<div className="space-y-6">
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
1
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Check Your Email</h3>
<p className="text-foreground/70">
Within 1-2 hours, you'll receive a welcome email with next steps and our creative brief form.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
2
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Fill Out the Brief</h3>
<p className="text-foreground/70">
Tell us about your product, target audience, and campaign goals. Upload any brand guidelines or reference materials.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
3
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Sit Back & Relax</h3>
<p className="text-foreground/70">
Our creative team will craft 3 premium ad creatives optimized for your platforms. You'll have them in 48 hours.
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<div className="flex items-center justify-center h-10 w-10 rounded-full bg-primary-cta text-primary-cta-text font-bold">
4
</div>
</div>
<div>
<h3 className="font-semibold text-foreground mb-1">Review & Iterate</h3>
<p className="text-foreground/70">
Get your creatives and review them. We'll incorporate feedback within 24 hours. Once happy, deploy and start seeing results.
</p>
</div>
</div>
</div>
</div>
<div className="bg-gradient-to-br from-primary-cta/10 to-accent/10 border border-primary-cta/20 rounded-lg p-6 mb-8">
<h3 className="font-semibold text-foreground mb-3">💡 Pro Tips:</h3>
<ul className="space-y-2 text-foreground/70">
<li> Be specific about your target audience demographics and interests</li>
<li> Share examples of ads you like (from competitors or other brands)</li>
<li> Provide clear brand guidelines and any assets you want us to use</li>
<li> Let us know your primary conversion goal (clicks, sales, signups, etc.)</li>
</ul>
</div>
<div className="flex flex-col md:flex-row gap-4 justify-center">
<Link
href="/"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-card border border-accent/20 text-foreground font-semibold rounded-full hover:bg-accent/5 transition-colors"
>
Back to Home
</Link>
<a
href="https://wa.me/1234567890"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-primary-cta text-primary-cta-text font-semibold rounded-full hover:opacity-90 transition-opacity"
>
Chat with Us <ArrowRight size={18} />
</a>
</div>
<p className="text-center text-foreground/60 text-sm mt-8">
Questions? Chat with us on WhatsApp or reply to your confirmation email.
</p>
</div>
</div>
);
}