Compare commits
83 Commits
version_12
...
version_20
| Author | SHA1 | Date | |
|---|---|---|---|
| 9708909a0c | |||
| 234de6419c | |||
| 83414f666a | |||
| b0210d44ff | |||
| 4ddd0fae64 | |||
| 96cf8fe822 | |||
| 3c46b37f19 | |||
| 343dc3aa4b | |||
| fa739da65f | |||
| dd9f8dd11b | |||
| de7921dcf2 | |||
| aaa107a8f2 | |||
| d58e0f6db4 | |||
| 09f71fe071 | |||
| f741842e42 | |||
| e71f68d950 | |||
| b29a136927 | |||
| a334e75d98 | |||
| 4cd4563a81 | |||
| a2b7ffccfd | |||
| e7dd8cffb4 | |||
| 158598b397 | |||
| 4f288a7aa8 | |||
| f7957f64d5 | |||
| 7725cff7ee | |||
| 92a2671031 | |||
| 762a6b788d | |||
| 8c13acb37e | |||
| e654873cc1 | |||
| 582e372208 | |||
| b920d66603 | |||
| 28ea541a07 | |||
| ecb51cf35c | |||
| 1d1cb3e25e | |||
| cd43b2423c | |||
| bf14dde886 | |||
| 775c58dd5f | |||
| ca54c45148 | |||
| b8a60846fa | |||
| 7df6cb9adc | |||
| 92ed70cb51 | |||
| 2022cff594 | |||
| a3fb84396d | |||
| 3c2670e684 | |||
| ff5e4fc53b | |||
| 9b56793461 | |||
| 761cea35b5 | |||
| a9dd4797f0 | |||
| 1f8dcc0d2f | |||
| 4b299fa5eb | |||
| 1364284317 | |||
| 6ed9bf2554 | |||
| 27c0ba48c9 | |||
| b5f1ed8f9e | |||
| 327c83d2c6 | |||
| 47798547bb | |||
| bb0610599e | |||
| b74202f2b1 | |||
| 2e2b93e65c | |||
| e9f886752a | |||
| cbdd5bd21a | |||
| 5b0ad54dc3 | |||
| f0d015ede5 | |||
| 3c53b25ead | |||
| 1727e38d3c | |||
| 3e7815f595 | |||
| 0894ecbe8c | |||
| 07badd52e6 | |||
| ab1b99a53f | |||
| 98102d181f | |||
| 9b9f3354a8 | |||
| 0b12075419 | |||
| dad477b06e | |||
| ed40fec024 | |||
| 34db2ddbf0 | |||
| c08bfd11f8 | |||
| 681266e374 | |||
| df52fd53a5 | |||
| 7967ae572b | |||
| b4deea5982 | |||
| e489f74440 | |||
| 9a89f7be97 | |||
| 5548158ae2 |
@@ -1,8 +1,11 @@
|
||||
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 - 40% Average ROAS Increase—Get Professional Ad Creatives in 48 Hours, 50% Cheaper Than Agencies", description: "Launch winning campaigns in 48 hours instead of 3 weeks. Agency-quality video ads, static creatives, and full-funnel packs. 40% average ROAS increase. 50% cheaper than agencies."
|
||||
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({
|
||||
@@ -12,9 +15,7 @@ export default function RootLayout({
|
||||
}) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body>
|
||||
{children}
|
||||
|
||||
<body className={inter.className}>{children}
|
||||
<script
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: `
|
||||
|
||||
249
src/app/page.tsx
249
src/app/page.tsx
@@ -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, ArrowRight } 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="40% Average ROAS Increase—Get Professional Ad Creatives in 48 Hours, 50% Cheaper Than Agencies"
|
||||
description="Launch winning campaigns in 48 hours instead of 3 weeks. Agency-quality video ads, static creatives, and full-funnel packs. 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,14 +114,62 @@ 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 professional ad creatives 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"
|
||||
@@ -93,7 +190,7 @@ 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}
|
||||
@@ -208,21 +305,63 @@ export default function LandingPage() {
|
||||
]}
|
||||
buttonAnimation="opacity"
|
||||
/>
|
||||
|
||||
{/* Video Explainer Section */}
|
||||
<div className="mt-12 md:mt-16 px-4">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<div className="aspect-video bg-card rounded-lg border border-accent/20 flex items-center justify-center overflow-hidden">
|
||||
<iframe
|
||||
width="100%"
|
||||
height="100%"
|
||||
src="https://www.youtube.com/embed/dQw4w9WgXcQ"
|
||||
title="studio ads Demo"
|
||||
frameBorder="0"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allowFullScreen
|
||||
/>
|
||||
</div>
|
||||
<p className="text-center text-foreground/60 text-sm mt-4">60-90 second video explainer - See how our process works</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="free-offer" data-section="free-offer">
|
||||
<ContactCenter
|
||||
tag="Free Trial - Risk Free"
|
||||
title="Claim Your 3 Free Ads Now"
|
||||
description="Try our service risk-free. No credit card required upfront. Get agency-quality ad creatives delivered in 48 hours."
|
||||
tagIcon={Sparkles}
|
||||
background={{ variant: "downward-rays-static-grid" }}
|
||||
useInvertedBackground={true}
|
||||
inputPlaceholder="Enter your email address"
|
||||
buttonText="Claim Your 3 Free Ads Now"
|
||||
termsText="No credit card required. 30-day money-back guarantee on paid plans."
|
||||
ariaLabel="Free ad offer signup"
|
||||
/>
|
||||
<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">
|
||||
@@ -231,7 +370,7 @@ export default function LandingPage() {
|
||||
<button
|
||||
onClick={() => setShowComparison(!showComparison)}
|
||||
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="Claim your 3 free ads"
|
||||
aria-label="View plan comparison"
|
||||
>
|
||||
<CheckCircle size={20} />
|
||||
<span>View Plan Comparison</span>
|
||||
@@ -251,6 +390,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>
|
||||
@@ -300,25 +445,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" }
|
||||
],
|
||||
@@ -375,7 +520,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={[
|
||||
@@ -418,7 +563,7 @@ export default function LandingPage() {
|
||||
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 +578,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."
|
||||
tagIcon={Mail}
|
||||
background={{ variant: "downward-rays-static-grid" }}
|
||||
useInvertedBackground={true}
|
||||
inputPlaceholder="Enter your email address"
|
||||
buttonText="Claim Your 3 Free Ads Now"
|
||||
termsText="No credit card required. 30-day money-back guarantee on paid plans. Cancel anytime."
|
||||
buttonText="Get 3 Free Ads Now"
|
||||
termsText="No card required. 30-day guarantee. Cancel anytime."
|
||||
ariaLabel="Contact form and ad offer signup"
|
||||
/>
|
||||
</div>
|
||||
@@ -471,7 +616,7 @@ 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>
|
||||
|
||||
125
src/app/thank-you/page.tsx
Normal file
125
src/app/thank-you/page.tsx
Normal 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>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user