Update src/app/page.tsx

Merge version_32 into main
2026-03-12 15:44:49 +00:00 · 2026-03-12 15:38:46 +00:00 · 2026-03-12 15:38:42 +00:00 · 2026-03-10 06:00:37 +00:00 · 2026-03-09 23:54:28 +00:00 · 2026-03-09 23:54:24 +00:00
2 changed files with 262 additions and 309 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,12 +1,19 @@
 import type { Metadata } from "next";
-import { Inter } from "next/font/google";
+import { Lora, Inter } from "next/font/google";
 import "./globals.css";

-const inter = Inter({ subsets: ["latin"] });
+const lora = Lora({
+  variable: "--font-lora",  subsets: ["latin"],
+  weight: ["400", "500", "600", "700"],
+});
+
+const inter = Inter({
+  variable: "--font-inter",  subsets: ["latin"],
+  weight: ["400", "500", "600", "700"],
+});

 export const metadata: Metadata = {
-  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."
-};
+  title: "studio ads - Agency-Quality Ad Creatives in 48 Hours",  description: "Get professional video ads and static creatives delivered in 48 hours. 40% average ROAS increase. Half the cost of traditional agencies."};

 export default function RootLayout({
  children,
@@ -14,8 +21,38 @@ export default function RootLayout({
  children: React.ReactNode;
 }) {
  return (
-    <html lang="en">
-      <body className={inter.className}>{children}
+    <html lang="en" suppressHydrationWarning>
+      <body
+        className={`${lora.variable} ${inter.variable} antialiased`}
+        suppressHydrationWarning
+      >
+        {children}
+        <script
+          async
+          src="https://cdn.jsdelivr.net/npm/lenis@1.1.13/dist/lenis.min.js"
+        ></script>
+        <script>
+          {`
+            const lenis = new Lenis({
+              duration: 1.2,
+              easing: (t) => Math.min(1, 1.001 - Math.pow(2, -10 * t)),
+              direction: 'vertical',
+              gestureDirection: 'vertical',
+              smooth: true,
+              mouseMultiplier: 1,
+              smoothTouch: false,
+              touchMultiplier: 2,
+              infinite: false,
+            });
+
+            function raf(time) {
+              lenis.raf(time);
+              requestAnimationFrame(raf);
+            }
+            requestAnimationFrame(raf);
+          `}
+        </script>
+      
        <script
          dangerouslySetInnerHTML={{
            __html: `
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,13 +6,12 @@ import HeroCentered from "@/components/sections/hero/HeroCentered";
 import FeatureBento from "@/components/sections/feature/FeatureBento";
 import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
 import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
-import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
 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 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 { 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, Award, Bolt, Target, Rocket, Flame } from "lucide-react";
 import { useState, useEffect } from "react";
 import Link from "next/link";

@@ -58,13 +57,12 @@ export default function LandingPage() {
            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: "Claim 3 Free Ads",              href: "#free-offer"
+              text: "Get Your Free Ads → See 48-Hour Results",              href: "#free-offer"
            }}
            animateOnLoad={true}
          />
@@ -91,15 +89,15 @@ export default function LandingPage() {
            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"
          >
-            Claim 3 Free Ads
+            Get Your Free Ads
          </button>
        </div>
      )}

      <div id="hero" data-section="hero">
        <HeroCentered
-          title="40% ROAS Increase in 48 Hours"
-          description="Turn 48-hour briefs into conversion-ready creatives. Professional ad creatives delivered in 48 hours instead of 3 weeks. Agency-quality video ads and static creatives, 50% cheaper than traditional agencies."
+          title="48-Hour Ad Creatives That Drive 40% ROAS"
+          description="Cut production time from weeks to 2 days. Launch high-converting ads in 48 hours at half the cost of agencies. Get agency-quality video ads and static creatives faster, smarter, and cheaper."
          background={{ variant: "downward-rays-animated" }}
          avatars={[
            {
@@ -114,7 +112,7 @@ export default function LandingPage() {
          ]}
          avatarText="Trusted by 100+ agencies and brands"
          buttons={[
-            { text: "Claim 3 Free Ads", href: "#free-offer" },
+            { text: "Start Free Project", href: "#free-offer" },
            { text: "See Our Work", href: "#features" }
          ]}
          buttonAnimation="slide-up"
@@ -188,45 +186,89 @@ export default function LandingPage() {
        />
      </div>

-      <div id="pain-points" data-section="pain-points">
-        <FeatureBorderGlow
-          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: "3 Weeks Production Time vs 48 Hours",              description: "Traditional agencies take weeks for approvals and revisions. We deliver in 48 hours."
-            },
-            {
-              icon: Users,
-              title: "Managing Multiple Vendors",              description: "Juggling designers, videographers, and copywriters. We handle everything under one roof."
-            },
-            {
-              icon: Palette,
-              title: "Limited Creative Variations",              description: "You get one option and hope it works. We create 10+ variations to maximize ROI."
-            },
-            {
-              icon: TrendingUp,
-              title: "40% Average ROAS Increase",              description: "Guessing which creatives will perform best. We optimize based on real data insights."
-            },
-            {
-              icon: CreditCard,
-              title: "50% Cheaper Than Agencies",              description: "Hidden fees and scope creep add up fast. Our pricing is transparent and fixed."
-            },
-            {
-              icon: Sparkles,
-              title: "Poor Quality at Scale",              description: "Agencies cut corners when scaling. We maintain premium quality every single time."
-            }
-          ]}
-          animationType="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          buttons={[
-            { text: "Experience the Difference", href: "#features" }
-          ]}
-        />
+      <div id="pain-points" data-section="pain-points" className="relative py-16 md:py-24 px-4 bg-gradient-to-br from-primary-cta/10 via-background to-accent/5 overflow-hidden">
+        <div className="absolute inset-0 opacity-30">
+          <div className="absolute top-10 left-10 w-72 h-72 bg-primary-cta/20 rounded-full blur-3xl"></div>
+          <div className="absolute bottom-10 right-10 w-96 h-96 bg-accent/20 rounded-full blur-3xl"></div>
+        </div>
+        <div className="max-w-6xl mx-auto relative z-10">
+          <div className="text-center mb-12 md:mb-16">
+            <div className="inline-block mb-4 animate-pulse">
+              <span className="px-4 py-2 rounded-full bg-primary-cta text-primary-cta-text text-sm font-bold flex items-center gap-2 shadow-lg">
+                <Flame size={16} />
+                Why Switch Now
+              </span>
+            </div>
+            <h2 className="text-4xl md:text-6xl font-black text-foreground mb-4 leading-tight">The Old Way vs. The studio ads Way</h2>
+            <p className="text-foreground/70 text-lg md:text-xl max-w-2xl mx-auto">Stop wasting weeks and thousands of dollars on ad production. Here's how we're revolutionizing creative delivery.</p>
+          </div>
+
+          {/* Enhanced Comparison Chart */}
+          <div className="overflow-x-auto rounded-2xl border border-primary-cta/30 shadow-2xl">
+            <table className="w-full text-sm md:text-base">
+              <thead>
+                <tr className="border-b-2 border-primary-cta/40 bg-gradient-to-r from-primary-cta/20 to-accent/20">
+                  <th className="text-left py-5 px-4 md:px-8 font-black text-foreground text-base md:text-lg">Feature</th>
+                  <th className="text-center py-5 px-4 md:px-8 font-bold text-foreground/70 text-base md:text-lg">Traditional Agencies</th>
+                  <th className="text-center py-5 px-4 md:px-8 font-black text-primary-cta text-base md:text-lg">⚡ studio ads</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">⏱️ Production Time</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 strikethrough opacity-60">3-4 Weeks</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">🚀 48 Hours</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">💰 Cost per Ad</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 strikethrough opacity-60">$2,500-5,000</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">✨ $500-1,500</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">🎨 Creative Variations</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">1-3 Concepts</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">💎 10+ Included</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">🔄 Revision Rounds</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">Limited / Extra $</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">∞ Unlimited</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">📱 Platform Coverage</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">Limited Formats</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">🌐 All Platforms</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">📈 Average ROAS Lift</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">20-25%</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">🔥 40% Guaranteed</td>
+                </tr>
+                <tr className="border-b border-primary-cta/20 hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">👥 Account Manager</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">Always Included</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">⭐ Growth+ Plans</td>
+                </tr>
+                <tr className="hover:bg-primary-cta/10 transition-all duration-300 group">
+                  <td className="py-5 px-4 md:px-8 font-bold text-foreground">🚀 Onboarding</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-foreground/70 opacity-60">2-4 Weeks</td>
+                  <td className="text-center py-5 px-4 md:px-8 text-primary-cta font-black text-lg">⚡ Instant</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div className="mt-12 text-center">
+            <button
+              onClick={() => document.getElementById('features')?.scrollIntoView({ behavior: 'smooth' })}
+              className="inline-flex items-center gap-2 px-8 py-4 rounded-full bg-gradient-to-r from-primary-cta to-accent text-primary-cta-text hover:shadow-2xl hover:scale-105 transition-all font-black text-lg shadow-lg"
+              aria-label="View features"
+            >
+              <span>Experience the Difference</span>
+              <ArrowRight size={20} className="group-hover:translate-x-1 transition-transform" />
+            </button>
+          </div>
+        </div>
      </div>

      <div id="features" data-section="features">
@@ -238,7 +280,7 @@ export default function LandingPage() {
          features={[
            {
              title: "Video Ads",              description: "Professional 15-60 second video ads optimized for every platform. Cinematic, conversion-focused, and brand-consistent.",              bentoComponent: "media-stack",              items: [
-                { videoSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png?_wi=1" },
+                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png", imageAlt: "Video ad sample" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-female-creati-1772624560954-fe3f44ea.png", imageAlt: "Creative sample" },
                { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-male-entrepre-1772624561085-2e00132e.png", imageAlt: "Creative sample" }
              ]
@@ -301,292 +343,165 @@ export default function LandingPage() {
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
-            { text: "Start Your First Project", href: "#pricing" }
+            { text: "Start Your First Project", href: "#book-now" }
          ]}
          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">
-        <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"
-              >
-                Claim 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 id="book-now" data-section="book-now" className="relative py-16 md:py-20 px-4 bg-gradient-to-br from-primary-cta/10 via-background to-accent/5 overflow-hidden">
+        <div className="absolute inset-0 opacity-20">
+          <div className="absolute top-0 left-1/4 w-96 h-96 bg-primary-cta/30 rounded-full blur-3xl"></div>
+          <div className="absolute bottom-0 right-1/4 w-80 h-80 bg-accent/30 rounded-full blur-3xl"></div>
        </div>
-      </div>
+        <div className="max-w-2xl mx-auto relative z-10">
+          <div className="text-center mb-8">
+            <h2 className="text-4xl md:text-5xl font-black text-foreground mb-4 leading-tight">Ready to Book Your First Project?</h2>
+            <p className="text-foreground/70 mb-2 text-lg">Get started with a clean booking process. Let's create something amazing together.</p>
+          </div>

-      <div id="pricing" data-section="pricing">
-        <div className="relative">
-          <div className="flex justify-center mb-8">
+          <div className="flex flex-col gap-4 max-w-lg mx-auto">
            <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="View plan comparison"
+              onClick={() => window.open('https://calendly.com/randorfalconer-/chat-intro-with-randor', '_blank')}
+              className="w-full py-4 px-6 bg-gradient-to-r from-primary-cta to-accent text-primary-cta-text font-black rounded-full hover:opacity-90 transition-opacity text-lg shadow-lg"
            >
-              <CheckCircle size={20} />
-              <span>View Plan Comparison</span>
+              Schedule a Call
            </button>
          </div>
-          {showComparison && (
-            <div className="mb-8 p-6 rounded-lg bg-gradient-to-br from-accent/10 to-accent/5 border border-accent/20">
-              <h3 className="text-lg font-semibold mb-4 text-foreground">Feature Comparison</h3>
-              <div className="overflow-x-auto">
-                <table className="w-full text-sm">
-                  <thead>
-                    <tr className="border-b border-accent/20">
-                      <th className="text-left py-2 px-3 font-semibold">Feature</th>
-                      <th className="text-center py-2 px-3 font-semibold">Starter</th>
-                      <th className="text-center py-2 px-3 font-semibold">Growth</th>
-                      <th className="text-center py-2 px-3 font-semibold">Enterprise</th>
-                    </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>
-                      <td className="text-center py-3 px-3">Unlimited</td>
-                      <td className="text-center py-3 px-3">Unlimited</td>
-                    </tr>
-                    <tr className="border-b border-accent/10">
-                      <td className="py-3 px-3">Creatives/Month</td>
-                      <td className="text-center py-3 px-3">Included</td>
-                      <td className="text-center py-3 px-3">30+</td>
-                      <td className="text-center py-3 px-3">Unlimited</td>
-                    </tr>
-                    <tr className="border-b border-accent/10">
-                      <td className="py-3 px-3">Turnaround Time</td>
-                      <td className="text-center py-3 px-3">48 hours</td>
-                      <td className="text-center py-3 px-3">24 hours</td>
-                      <td className="text-center py-3 px-3">24 hours</td>
-                    </tr>
-                    <tr className="border-b border-accent/10">
-                      <td className="py-3 px-3">Account Manager</td>
-                      <td className="text-center py-3 px-3">-</td>
-                      <td className="text-center py-3 px-3">✓</td>
-                      <td className="text-center py-3 px-3">✓</td>
-                    </tr>
-                    <tr className="border-b border-accent/10">
-                      <td className="py-3 px-3">API Access</td>
-                      <td className="text-center py-3 px-3">-</td>
-                      <td className="text-center py-3 px-3">-</td>
-                      <td className="text-center py-3 px-3">✓</td>
-                    </tr>
-                    <tr>
-                      <td className="py-3 px-3">24/7 Support</td>
-                      <td className="text-center py-3 px-3">-</td>
-                      <td className="text-center py-3 px-3">-</td>
-                      <td className="text-center py-3 px-3">✓</td>
-                    </tr>
-                  </tbody>
-                </table>
-              </div>
-            </div>
-          )}
+
+          <p className="text-center text-foreground/60 text-xs md:text-sm mt-4 font-semibold">
+            ✅ Quick consultation • 🔒 No commitment • ⚡ 48-hour delivery
+          </p>
        </div>
-        <PricingCardEight
-          title="Simple, Transparent Pricing"
-          description="Choose the plan that fits your creative needs. Upgrade anytime."
-          tag="Plans"
-          tagIcon={CreditCard}
-          plans={[
-            {
-              id: "growth",              badge: "Growth - Most Popular - 40% ROAS Lift",              badgeIcon: ZapIcon,
-              price: "$5,000",              subtitle: "For high-volume, results-driven marketing teams",              buttons: [
-                { 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: "starter",              badge: "Starter - 20% Average ROAS Lift",              badgeIcon: Sparkles,
-              price: "$1,500",              subtitle: "Perfect for growing brands testing ad creation",              buttons: [
-                { text: "Claim 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: "For agencies and enterprises with unique needs",              buttons: [
-                { text: "Book Appointment", href: "#contact" }
-              ],
-              features: [
-                "✓ Unlimited everything",                "✓ Custom creative strategy sessions",                "✓ Unlimited team members",                "✓ API access",                "✓ White-label options",                "✓ Custom integrations",                "✓ 24/7 dedicated support",                "✓ Quarterly strategy reviews"
-              ]
-            }
-          ]}
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          buttonAnimation="opacity"
-        />
      </div>

-      <div id="who-its-for" data-section="who-its-for">
-        <FeatureBorderGlow
-          title="Who We Help"
-          description="Whether you're a growing brand, creative agency, or in-house marketing team, we've got the perfect solution."
-          tag="Ideal For"
-          tagIcon={Users}
-          features={[
-            {
-              icon: ShoppingCart,
-              title: "E-commerce Brands",              description: "Product ads, promotional content, and conversion-focused creatives that drive sales."
-            },
-            {
-              icon: Package,
-              title: "SaaS Companies",              description: "Feature demonstrations, benefit-focused ads, and explainer videos that educate and convert."
-            },
-            {
-              icon: Briefcase,
-              title: "Marketing Agencies",              description: "Scale your creative output without hiring. Deliver more to your clients faster."
-            },
-            {
-              icon: Users,
-              title: "Digital Creators",              description: "Professional ad content, sponsorship pitches, and promotional materials for your audience."
-            },
-            {
-              icon: Palette,
-              title: "Startups & Brands",              description: "Launch campaigns quickly. Build brand presence with polished, professional ads."
-            },
-            {
-              icon: TrendingUp,
-              title: "Growth Teams",              description: "Test campaigns faster. Optimize with unlimited variations and performance insights."
-            }
-          ]}
-          animationType="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          carouselMode="buttons"
-        />
+      <div id="who-its-for" data-section="who-its-for" className="relative py-16 md:py-24 px-4 bg-gradient-to-b from-background to-primary-cta/5 overflow-hidden">
+        <div className="absolute inset-0 opacity-20">
+          <div className="absolute top-1/2 left-0 w-96 h-96 bg-primary-cta/30 rounded-full blur-3xl"></div>
+          <div className="absolute top-1/4 right-0 w-80 h-80 bg-accent/30 rounded-full blur-3xl"></div>
+        </div>
+        <div className="max-w-6xl mx-auto relative z-10">
+          <FeatureBorderGlow
+            title="Who We Help"
+            description="Whether you're a growing brand, creative agency, or in-house marketing team, we've got the perfect solution."
+            tag="Ideal For"
+            tagIcon={Users}
+            features={[
+              {
+                icon: ShoppingCart,
+                title: "E-commerce Brands",                description: "Product ads, promotional content, and conversion-focused creatives that drive sales."
+              },
+              {
+                icon: Package,
+                title: "SaaS Companies",                description: "Feature demonstrations, benefit-focused ads, and explainer videos that educate and convert."
+              },
+              {
+                icon: Briefcase,
+                title: "Marketing Agencies",                description: "Scale your creative output without hiring. Deliver more to your clients faster."
+              },
+              {
+                icon: Users,
+                title: "Digital Creators",                description: "Professional ad content, sponsorship pitches, and promotional materials for your audience."
+              },
+              {
+                icon: Palette,
+                title: "Startups & Brands",                description: "Launch campaigns quickly. Build brand presence with polished, professional ads."
+              },
+              {
+                icon: TrendingUp,
+                title: "Growth Teams",                description: "Test campaigns faster. Optimize with unlimited variations and performance insights."
+              }
+            ]}
+            animationType="blur-reveal"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            carouselMode="buttons"
+          />
+        </div>
      </div>

      <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%. studio ads is a game-changer for our agency."
          rating={5}
-          author="Emma Rodriguez, Creative Director"
+          author="Marcus Chen, Founder"
          avatars={[
            {
-              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png",              alt: "Emma Rodriguez"
+              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-male-entrepre-1772624561085-2e00132e.png",              alt: "Marcus Chen"
            },
            {
-              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-female-creati-1772624560954-fe3f44ea.png",              alt: "Team member"
+              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-young-marketi-1772624560922-a81a2ec0.png",              alt: "Team member"
            }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="blur-reveal"
          useInvertedBackground={true}
-          ariaLabel="Customer testimonial from Emma Rodriguez"
+          ariaLabel="Customer testimonial from Marcus Chen"
        />
      </div>

-      <div id="faq" data-section="faq">
-        <FaqSplitMedia
-          faqs={[
-            {
-              id: "1",              title: "How do you deliver in 48 hours?",              content: "We deliver 3 premium ad creatives with a guaranteed 48-hour turnaround. Our streamlined workflow combines creative strategy, production, and revisions into a single efficient process. We have dedicated creative teams working around the clock to ensure your project gets the attention it deserves while meeting our 48-hour promise."
-            },
-            {
-              id: "2",              title: "What if I need revisions?",              content: "Revisions are part of our process. We build in time for feedback and iterations within your 48-hour window. For changes after delivery, we have a simple revision policy—typically one round of revisions is included in your plan."
-            },
-            {
-              id: "3",              title: "Do you work with all industries?",              content: "Absolutely. We work with e-commerce, SaaS, real estate, services, finance, healthcare, nonprofits, and everything in between. Every project gets customized strategy based on your industry, audience, and objectives."
-            },
-            {
-              id: "4",              title: "What formats and specs do you deliver?",              content: "We deliver files optimized for Instagram, Facebook, TikTok, LinkedIn, YouTube, Google Ads, and more. All formats include proper sizing, aspect ratios, captions, and platform-specific optimization. You get everything ready to post."
-            },
-            {
-              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."
-            }
-          ]}
-          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 studio ads."
-          tag="Help"
-          tagIcon={HelpCircle}
-          mediaAnimation="slide-up"
-          faqsAnimation="blur-reveal"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          mediaPosition="left"
-        />
+      <div id="faq" data-section="faq" className="py-16 md:py-24 px-4 bg-gradient-to-b from-background via-primary-cta/5 to-background">
+        <div className="max-w-6xl mx-auto">
+          <FaqSplitMedia
+            faqs={[
+              {
+                id: "1",                title: "How do you deliver in 48 hours?",                content: "We deliver 3-5 premium ad creatives with a guaranteed 48-hour turnaround. Our streamlined workflow combines creative strategy, production, and revisions into a single efficient process. We have dedicated creative teams working around the clock to ensure your project gets the attention it deserves while meeting our 48-hour promise."
+              },
+              {
+                id: "2",                title: "What if I need revisions?",                content: "Revisions are part of our process. We build in time for feedback and iterations within your 48-hour window. For changes after delivery, we have a simple revision policy—typically one round of revisions is included in your plan. Growth plans include unlimited revisions during the project window."
+              },
+              {
+                id: "3",                title: "Do you work with all industries?",                content: "Absolutely. We work with e-commerce, SaaS, real estate, services, finance, healthcare, nonprofits, and everything in between. Every project gets customized strategy based on your industry, audience, and objectives. Our team has experience across 50+ verticals."
+              },
+              {
+                id: "4",                title: "What formats and specs do you deliver?",                content: "We deliver files optimized for Instagram, Facebook, TikTok, LinkedIn, YouTube, Google Ads, and more. All formats include proper sizing, aspect ratios, captions, and platform-specific optimization. You get everything ready to post immediately."
+              },
+              {
+                id: "5",                title: "Can I get unlimited revisions?",                content: "Yes! 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. Starter plans include 2 revision rounds."
+              },
+              {
+                id: "6",                title: "How do I book a project?",                content: "Simply schedule a quick consultation call with us, and we'll discuss your project needs, timeline, and budget. From there, we'll send you a creative brief form to fill out. Once we have all the details, we get started immediately and deliver your creatives in 48 hours."
+              }
+            ]}
+            imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ATkkwMdD0iTY5cZ1obi8rWoV7q/professional-headshot-of-a-male-entrepre-1772624561085-2e00132e.png?_wi=2"
+            imageAlt="FAQ support team"
+            title="Frequently Asked Questions"
+            description="Everything you need to know about working with studio ads."
+            tag="Help"
+            tagIcon={HelpCircle}
+            mediaAnimation="slide-up"
+            faqsAnimation="blur-reveal"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            mediaPosition="left"
+            containerClassName="max-w-6xl mx-auto"
+            contentClassName="grid grid-cols-1 md:grid-cols-2 gap-8 md:gap-12 items-center"
+            mediaWrapperClassName="order-2 md:order-1"
+            faqsContainerClassName="order-1 md:order-2"
+          />
+        </div>
      </div>

-      <div id="contact" data-section="contact">
-        <ContactCenter
-          tag="Get Started"
-          title="Ready to Scale Your Creative Output?"
-          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 3 Free Ads Now"
-          termsText="No card required. 30-day guarantee. Cancel anytime."
-          ariaLabel="Contact form and ad offer signup"
-        />
+      <div id="contact" data-section="contact" className="py-16 md:py-24 px-4 relative overflow-hidden">
+        <div className="absolute inset-0 opacity-20">
+          <div className="absolute top-0 right-0 w-96 h-96 bg-primary-cta/30 rounded-full blur-3xl"></div>
+          <div className="absolute bottom-0 left-1/4 w-80 h-80 bg-accent/30 rounded-full blur-3xl"></div>
+        </div>
+        <div className="max-w-4xl mx-auto relative z-10">
+          <ContactCenter
+            tag="Get Started"
+            title="Ready to Scale Your Creative Output?"
+            description="Join 100+ brands and agencies already transforming their ad production with studio ads. Book a call today."
+            tagIcon={Mail}
+            background={{ variant: "downward-rays-static-grid" }}
+            useInvertedBackground={true}
+            inputPlaceholder="Enter your email address"
+            buttonText="Schedule a Call"
+            termsText="✅ Quick consultation • 🚀 48-hour guarantee • ⚡ Cancel anytime"
+            ariaLabel="Contact form and booking"
+            containerClassName="max-w-2xl mx-auto"
+          />
+        </div>
      </div>

      <div id="footer" data-section="footer">
@@ -595,9 +510,9 @@ export default function LandingPage() {
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
-                { label: "Pricing", href: "#pricing" },
                { label: "How It Works", href: "#how-it-works" },
-                { label: "Testimonials", href: "#testimonials" }
+                { label: "Testimonials", href: "#testimonials" },
+                { label: "FAQ", href: "#faq" }
              ]
            },
            {
@@ -618,8 +533,9 @@ export default function LandingPage() {
          ]}
          copyrightText="© 2025 studio ads. All rights reserved."
          ariaLabel="Footer navigation and company information"
+          containerClassName="max-w-6xl mx-auto px-4"
        />
      </div>
    </ThemeProvider>
  );
-}
+}
Author	SHA1	Message	Date
bender	f7465ba933	Update src/app/page.tsx	2026-03-12 15:44:49 +00:00
bender	7213f0e4d2	Merge version_32 into main Merge version_32 into main	2026-03-12 15:38:46 +00:00
bender	c085f7173b	Update src/app/page.tsx	2026-03-12 15:38:42 +00:00
bender	ba5b66e90b	Switch to version 30: modified src/app/page.tsx	2026-03-10 06:00:37 +00:00
bender	3420d7b27f	Merge version_31 into main Merge version_31 into main	2026-03-09 23:54:28 +00:00
bender	6c9cb6767a	Update src/app/page.tsx	2026-03-09 23:54:24 +00:00
bender	7ba7bfe966	Merge version_31 into main Merge version_31 into main	2026-03-09 23:53:43 +00:00
bender	3117bfa553	Update src/app/page.tsx	2026-03-09 23:53:33 +00:00
bender	67511c98ab	Merge version_31 into main Merge version_31 into main	2026-03-09 23:52:28 +00:00
bender	fcbc5d79e3	Update src/app/page.tsx	2026-03-09 23:52:24 +00:00
bender	83784db2d4	Merge version_30 into main Merge version_30 into main	2026-03-09 15:53:18 +00:00
bender	bb036a71c1	Update src/app/layout.tsx	2026-03-09 15:53:14 +00:00
bender	f805b5f5da	Merge version_30 into main Merge version_30 into main	2026-03-09 15:52:13 +00:00
bender	e3cfb26532	Update src/app/page.tsx	2026-03-09 15:52:09 +00:00
bender	ae02074a75	Update src/app/layout.tsx	2026-03-09 15:52:09 +00:00
bender	cce55dc6d8	Merge version_29 into main Merge version_29 into main	2026-03-09 13:53:57 +00:00
bender	60de093eed	Update src/app/page.tsx	2026-03-09 13:53:53 +00:00
bender	51fea41093	Merge version_28 into main Merge version_28 into main	2026-03-09 13:47:37 +00:00
bender	0caadc2db6	Update src/app/page.tsx	2026-03-09 13:47:33 +00:00
bender	60041290b4	Merge version_27 into main Merge version_27 into main	2026-03-09 13:40:21 +00:00
bender	662dde5c2e	Update src/app/page.tsx	2026-03-09 13:40:17 +00:00
bender	75fc83bab8	Update src/app/layout.tsx	2026-03-09 13:40:16 +00:00
bender	1576cdc334	Merge version_26 into main Merge version_26 into main	2026-03-09 13:36:42 +00:00
bender	0b3045eda6	Update src/app/page.tsx	2026-03-09 13:36:38 +00:00
bender	8ddb5d7b64	Update src/app/layout.tsx	2026-03-09 13:36:37 +00:00
bender	dedf4b0752	Merge version_25 into main Merge version_25 into main	2026-03-07 07:29:09 +00:00
bender	f33b1d8ff5	Update src/app/page.tsx	2026-03-07 07:29:05 +00:00
bender	8060f0dc6f	Update src/app/layout.tsx	2026-03-07 07:29:04 +00:00
bender	033937a08c	Switch to version 23: modified src/app/page.tsx	2026-03-07 07:26:21 +00:00
bender	1b63d1b19b	Switch to version 23: modified src/app/layout.tsx	2026-03-07 07:26:20 +00:00
bender	fc373efcec	Merge version_24 into main Merge version_24 into main	2026-03-07 07:23:55 +00:00
bender	1df41c0c1e	Update src/app/page.tsx	2026-03-07 07:23:50 +00:00
bender	342d16373c	Update src/app/layout.tsx	2026-03-07 07:23:50 +00:00
bender	fa55e77820	Merge version_23 into main Merge version_23 into main	2026-03-07 02:32:56 +00:00
bender	1930d06fe2	Update src/app/page.tsx	2026-03-07 02:32:52 +00:00
bender	9e8c6e67d1	Merge version_23 into main Merge version_23 into main	2026-03-07 02:31:06 +00:00
bender	6093c0b799	Update src/app/page.tsx	2026-03-07 02:31:02 +00:00
bender	a2f8453fe9	Merge version_22 into main Merge version_22 into main	2026-03-07 02:25:28 +00:00
bender	73efafef66	Update src/app/page.tsx	2026-03-07 02:25:18 +00:00
bender	3e77d4ef4e	Merge version_21 into main Merge version_21 into main	2026-03-07 02:20:55 +00:00
bender	1582bd7bfc	Merge version_21 into main Merge version_21 into main	2026-03-06 05:33:31 +00:00
bender	768bfa6ce3	Merge version_21 into main Merge version_21 into main	2026-03-06 05:32:46 +00:00
bender	4764ffea99	Merge version_21 into main Merge version_21 into main	2026-03-05 13:54:12 +00:00