Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -6,13 +6,12 @@ import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import HeroBillboard from '@/components/sections/hero/HeroBillboard';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
 import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
-import { Clock, DollarSign, ShieldCheck } from "lucide-react";
+import { Clock, DollarSign, ShieldCheck, BarChart3, Search, LayoutDashboard, Settings } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -22,103 +21,46 @@ export default function LandingPage() {
         borderRadius="pill"
         contentWidth="compact"
         sizing="mediumLargeSizeLargeTitles"
-        background="grid"
-        cardStyle="glass-depth"
-        primaryButtonStyle="diagonal-gradient"
-        secondaryButtonStyle="radial-glow"
-        headingFontWeight="bold"
+        background="none"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingInline
       navItems={[
-        {
-          name: "System",
-          id: "#about",
-        },
-        {
-          name: "Features",
-          id: "#features",
-        },
-        {
-          name: "Pricing",
-          id: "#pricing",
-        },
-        {
-          name: "FAQ",
-          id: "#faq",
-        },
+        { name: "About", id: "#about" },
+        { name: "Metrics", id: "#metrics" },
+        { name: "Features", id: "#features" },
+        { name: "Testimonials", id: "#testimonials" },
+        { name: "FAQ", id: "#faq" },
+        { name: "Contact", id: "#contact" },
       ]}
       brandName="PROVA"
-      button={{
-        text: "Get Started",
-        href: "#contact",
-      }}
+      button={{ text: "Get Started", href: "#contact" }}
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboard
-      background={{
-        variant: "sparkles-gradient",
+      <HeroBillboardDashboard
+      background={{ variant: "sparkles-gradient" }}
+      title="Find your next profitable revenue stream in 30 days"
+      description="We test real market opportunities for your business and show you what actually works."
+      buttons={[{ text: "Get Started", href: "#contact" }, { text: "See How It Works", href: "#about" }]}
+      dashboard={{
+        title: "PROVA Analytics",        stats: [
+            { title: "Monthly Growth", values: [12, 18, 25], description: "Revenue acceleration" },
+            { title: "Conversion Rate", values: [2, 5, 8], description: "Visitor conversion" },
+            { title: "Test Volume", values: [5, 10, 15], description: "Active experiments" }
+        ],
+        logoIcon: BarChart3,
+        sidebarItems: [{ icon: LayoutDashboard, active: true }, { icon: Search }, { icon: Settings }],
+        buttons: [{ text: "Export Report", href: "#" }],
+        listItems: [{ icon: Clock, title: "Cycle 1: Validation", status: "Completed" }, { icon: ShieldCheck, title: "Cycle 2: Scaling", status: "Active" }],
+        imageSrc: "http://img.b2bpic.net/free-photo/abstract-dark-background-with-glowing-lines_23-2148816654.jpg"
       }}
-      title="Eliminate Guesswork. Scale Revenue."
-      description="PROVA is the Revenue Experimentation System that helps businesses discover, test, and validate growth opportunities every 30 days."
-      buttons={[
-        {
-          text: "Start Experimenting",
-          href: "#contact",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/business-man-with-beard-working-hard-his-desk-office-motivated-man_482257-18758.jpg"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-crossed-arms_23-2149008875.jpg",
-          alt: "Portrait 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/happy-bearded-man-standing-with-crossed-arms-near-desktop-office-with-loft-interior_613910-18715.jpg",
-          alt: "Portrait 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-smiling-freelance-worker-looking-away-while-standing-office_637285-2746.jpg",
-          alt: "Portrait 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-male-personal-shopper-working_23-2148924139.jpg",
-          alt: "Portrait 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/relaxed-man-office_1098-3794.jpg",
-          alt: "Portrait 5",
-        },
-      ]}
-      avatarText="Trusted by 500+ growth-focused founders"
-      marqueeItems={[
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/businessman-studying-infographics-performance-metrics_482257-122632.jpg",
-          alt: "Data metrics",
-        },
-        {
-          type: "text",
-          text: "Rapid Validation",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/modern-equipped-computer-lab_23-2149241197.jpg",
-          alt: "Lab data",
-        },
-        {
-          type: "text",
-          text: "Data-Driven Decisions",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126876.jpg",
-          alt: "Market signals",
-        },
-      ]}
     />
   </div>
 
@@ -126,57 +68,29 @@ export default function LandingPage() {
       <SplitAbout
       textboxLayout="split"
       useInvertedBackground={true}
-      title="The Revenue Experimentation Loop"
-      description="We replace blind spending with a 30-day cycle of finding demand signals, building offers, and testing them in real-time."
+      title="Engineered for Growth"
+      description="The PROVA Opportunity Report framework replaces intuition with rigorous testing. Our system identifies demand signals, builds lean offers, and validates performance with minimal spend in just 30 days."
       bulletPoints={[
-        {
-          title: "Signal Mining",
-          description: "Identify real demand from Reddit, TikTok, and forums.",
-        },
-        {
-          title: "Rapid Testing",
-          description: "Launch campaigns with $50-$150 to gauge interest.",
-        },
-        {
-          title: "Data Decisions",
-          description: "Scale what works, kill what doesn't. Zero fluff.",
-        },
+        { title: "Demand Mining", description: "Advanced signal identification across high-intent communities." },
+        { title: "Lean Validation", description: "Low-budget tactical tests to prove viability before scaling." },
+        { title: "Iterative Decisions", description: "Data-backed roadmap to optimize revenue consistently." },
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/business-network-background-connecting-dots-technology-design_53876-160210.jpg"
     />
   </div>
 
   <div id="metrics" data-section="metrics">
       <MetricCardOne
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
+      gridVariant="uniform-all-items-equal"
       metrics={[
-        {
-          id: "m1",
-          value: "30 Days",
-          title: "Experiment Cycle",
-          description: "Full validation loop.",
-          icon: Clock,
-        },
-        {
-          id: "m2",
-          value: "$150",
-          title: "Test Budget",
-          description: "Minimal risk validation.",
-          icon: DollarSign,
-        },
-        {
-          id: "m3",
-          value: "100%",
-          title: "Data Based",
-          description: "No opinion-based growth.",
-          icon: ShieldCheck,
-        },
+        { id: "m1", value: "30d", title: "Cycle", description: "Validation timeline", icon: Clock },
+        { id: "m2", value: "$150", title: "Risk", description: "Max test budget", icon: DollarSign },
+        { id: "m3", value: "100%", title: "Verified", description: "Data-based growth", icon: ShieldCheck },
       ]}
-      title="Quantified Certainty"
-      description="Proven results for ambitious businesses."
+      title="Performance Metrics"
+      description="Clear, measurable impact tracking for your growth cycles."
     />
   </div>
 
@@ -185,131 +99,27 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       features={[
-        {
-          title: "Speed to Market",
-          description: "30-day cycles versus months of planning.",
-          imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-asking-question-meeting_482257-115048.jpg",
-        },
-        {
-          title: "Real Market Data",
-          description: "Decisions based on actual consumer response.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-into-crypto-currency-stock-market_482257-2365.jpg",
-        },
-        {
-          title: "Systematic Growth",
-          description: "Repeatable, scalable engine, not random hacks.",
-          imageSrc: "http://img.b2bpic.net/free-photo/global-business-graph-growth-world-map-concept_53876-21165.jpg",
-        },
+        { title: "Rapid Market Testing", description: "Validate product-market fit in weeks, not months.", imageSrc: "http://img.b2bpic.net/free-photo/data-analysis-concept_23-2148785124.jpg" },
+        { title: "Deep Signal Mining", description: "Uncover latent demand hidden in high-intent market data.", imageSrc: "http://img.b2bpic.net/free-photo/digital-marketing-strategy-concept_23-2148784387.jpg" },
+        { title: "Scalable Growth Engine", description: "Repeatable architecture for sustainable, long-term revenue.", imageSrc: "http://img.b2bpic.net/free-photo/global-business-connectivity_23-2148816568.jpg" },
       ]}
-      title="Why PROVA?"
-      description="We don't just give advice. We build engines for decision-driven growth."
-    />
-  </div>
-
-  <div id="pricing" data-section="pricing">
-      <PricingCardEight
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      plans={[
-        {
-          id: "starter",
-          badge: "Entry",
-          price: "$1.5K",
-          subtitle: "Validation Phase",
-          features: [
-            "1 experiment/mo",
-            "Opportunity report",
-            "Basic data tracking",
-          ],
-          buttons: [
-            {
-              text: "Select Starter",
-            },
-          ],
-        },
-        {
-          id: "growth",
-          badge: "Popular",
-          price: "$4.5K",
-          subtitle: "Growth Phase",
-          features: [
-            "3 experiments/mo",
-            "Deep market insight",
-            "Revenue estimation",
-          ],
-          buttons: [
-            {
-              text: "Select Growth",
-            },
-          ],
-        },
-        {
-          id: "scale",
-          badge: "Scale",
-          price: "$10K+",
-          subtitle: "Expansion Phase",
-          features: [
-            "Unlimited experiments",
-            "Internal SOPs",
-            "Dedicated team",
-          ],
-          buttons: [
-            {
-              text: "Select Scale",
-            },
-          ],
-        },
-      ]}
-      title="Validation Tiers"
-      description="Choose the level of certainty you need."
+      title="Advanced Capabilities"
+      description="Tools designed to eliminate the uncertainty of scaling."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardTwo
-      animationType="slide-up"
+      animationType="blur-reveal"
       textboxLayout="default"
       useInvertedBackground={true}
       testimonials={[
-        {
-          id: "1",
-          name: "Alex Rivers",
-          role: "Founder",
-          testimonial: "PROVA changed our growth trajectory. We moved from guessing to knowing.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-signs-documents-businessman-sitting-table-manager-working-office_1157-42012.jpg",
-        },
-        {
-          id: "2",
-          name: "Sarah Chen",
-          role: "CMO",
-          testimonial: "Finally, a way to test revenue models without burning budget.",
-          imageSrc: "http://img.b2bpic.net/free-photo/face-casual-manager-communication-man_1157-3672.jpg",
-        },
-        {
-          id: "3",
-          name: "Mark Vane",
-          role: "CEO",
-          testimonial: "Fast, decisive, and data-backed. Exactly what we needed.",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-businesswoman-with-digital-tablet_1098-2087.jpg",
-        },
-        {
-          id: "4",
-          name: "Emily P.",
-          role: "VP Growth",
-          testimonial: "The 30-day cycle is the most efficient growth tool we've used.",
-          imageSrc: "http://img.b2bpic.net/free-photo/mid-adult-insurance-agent-talking-with-client-about-potential-financial-investments_637285-3769.jpg",
-        },
-        {
-          id: "5",
-          name: "Jordan S.",
-          role: "Startup founder",
-          testimonial: "A repeatable system that actually works for growth.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-red-haired-man_158595-3776.jpg",
-        },
+        { id: "1", name: "Alex R.", role: "Founder", testimonial: "PROVA turned our revenue unpredictability into a structured engine.", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-happy-office_1157-1907.jpg" },
+        { id: "2", name: "Jordan S.", role: "CMO", testimonial: "The 30-day testing cycle is exactly the discipline our marketing team needed.", imageSrc: "http://img.b2bpic.net/free-photo/man-working-laptop-office_1157-1845.jpg" },
+        { id: "3", name: "Sarah K.", role: "CEO", testimonial: "Data-backed decision making is finally effortless and actionable.", imageSrc: "http://img.b2bpic.net/free-photo/successful-young-businesswoman_1157-1909.jpg" },
       ]}
-      title="Proven Certainty"
-      description="Companies that stopped guessing and started growing."
+      title="Validated Results"
+      description="Partnering with teams that refuse to leave growth to chance."
     />
   </div>
 
@@ -318,98 +128,39 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       faqs={[
-        {
-          id: "q1",
-          title: "How does the experiment cycle work?",
-          content: "We identify demand, create a landing page, run targeted ads for $50-$150, and analyze the response data.",
-        },
-        {
-          id: "q2",
-          title: "What kind of companies is PROVA for?",
-          content: "Any business looking to scale revenue through data-backed decisions rather than marketing guesswork.",
-        },
-        {
-          id: "q3",
-          title: "Why do experiments take 30 days?",
-          content: "It allows us enough time for signal identification, build, launch, and analysis to ensure accurate data.",
-        },
+        { id: "q1", title: "How do we start a report?", content: "Fill out the contact form. We conduct an initial alignment call to audit your current growth state and identify high-opportunity experiments." },
+        { id: "q2", title: "Do I need a large team?", content: "Not at all. PROVA integrates seamlessly, acting as your dedicated external growth team during the validation cycle." },
+        { id: "q3", title: "What happens if a test fails?", content: "Failures are critical data points. We analyze the result and pivot to the next opportunity immediately to keep momentum high." },
       ]}
-      title="Common Questions"
-      description="Everything you need to know about PROVA."
+      title="Frequently Asked"
+      description="Common inquiries about the PROVA opportunity report system."
       faqsAnimation="slide-up"
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactSplitForm
-      useInvertedBackground={true}
-      title="Ready for Certainty?"
-      description="Start your first experiment in the next 30 days."
+      title="Get Your Opportunity Report"
+      description="Talk to our team about deploying your first 30-day growth cycle today and securing your competitive edge."
       inputs={[
-        {
-          name: "name",
-          type: "text",
-          placeholder: "Your Name",
-          required: true,
-        },
-        {
-          name: "email",
-          type: "email",
-          placeholder: "Your Email",
-          required: true,
-        },
+        { name: "name", type: "text", placeholder: "Full Name", required: true },
+        { name: "email", type: "email", placeholder: "Corporate Email", required: true }
       ]}
-      textarea={{
-        name: "message",
-        placeholder: "Briefly describe your growth challenge",
-        rows: 4,
-        required: true,
-      }}
-      imageSrc="http://img.b2bpic.net/free-photo/man-s-hands-using-tablet_1301-2038.jpg"
+      textarea={{ name: "message", placeholder: "Tell us about your current growth challenges...", rows: 5, required: true }}
+      useInvertedBackground={true}
+      buttonText="Submit Request"
+      imageSrc="http://img.b2bpic.net/free-photo/dark-office-with-glowing-screens_23-2148784120.jpg"
     />
   </div>
 
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
-      columns={[
-        {
-          items: [
-            {
-              label: "System",
-              href: "#about",
-            },
-            {
-              label: "Features",
-              href: "#features",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Pricing",
-              href: "#pricing",
-            },
-            {
-              label: "FAQ",
-              href: "#faq",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-            {
-              label: "Terms",
-              href: "#",
-            },
-          ],
-        },
-      ]}
       logoText="PROVA"
+      columns={[
+        { items: [{ label: "Home", href: "#" }, { label: "System", href: "#about" }] },
+        { items: [{ label: "Metrics", href: "#metrics" }, { label: "Features", href: "#features" }] },
+        { items: [{ label: "Testimonials", href: "#testimonials" }, { label: "Contact", href: "#contact" }] }
+      ]}
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
-  --card: #0c0c0c;
-  --foreground: #ffffff;
-  --primary-cta: #106EFB;
+  --background: #0a0a0a;
+  --card: #121212;
+  --foreground: #f0f0f0;
+  --primary-cta: #3b82f6;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #000000;
+  --secondary-cta: #1f1f1f;
   --secondary-cta-text: #ffffff;
-  --accent: #535353;
-  --background-accent: #106EFB;
+  --accent: #6366f1;
+  --background-accent: #1a1a1a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);