Merge version_3 into main

Merge version_3 into main

src/app/page.tsx

@@ -1,65 +1,53 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import HeroPersonalLinks from "@/components/sections/hero/HeroPersonalLinks";
+import HeroSplit from "@/components/sections/hero/HeroSplit";
-import { Code, Users, Globe, MessageCircle, Sparkles } from "lucide-react";
+import FeatureCardEight from "@/components/sections/feature/FeatureCardEight";
+import { PawPrint, Heart, ShoppingBag } from "lucide-react";
 
-export default function PersonalGridTemplatePage() {
+export default function PersonalLinkInBioPage() {
-    const titleSegments = [
+  return (
-        { type: "text" as const, content: "I help founders" },
+    <ThemeProvider
-        { type: "image" as const, src: "/templates/personal-grid/grid1.webp", alt: "Damien Ghader" },
+      defaultButtonVariant="hover-magnetic"
-        { type: "text" as const, content: "build products" },
+      defaultTextAnimation="reveal-blur"
-        { type: "image" as const, src: "/templates/personal-grid/grid2.webp", alt: "" },
+      borderRadius="pill"
-        { type: "text" as const, content: "with AI" },
+      contentWidth="small"
-    ];
+      sizing="medium"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="bold"
+    >
+      <div id="hero">
+        <HeroSplit
+          title="Paws & Whiskers Collective"
+          description="Curated essentials, health tips, and community favorites for the happiest dogs and cats. Explore our top picks for your furry best friends."
+          background={{ variant: "sparkles-gradient" }}
+          imageSrc="https://images.unsplash.com/photo-1514888286974-6c03e2ca1dba?w=800&h=800&fit=crop"
+          imageAlt="Cute cat and dog"
+          buttons={[
+            { text: "Shop Favorites", href: "#products" },
+            { text: "Read Our Guides", href: "#guides" }
+          ]}
+          buttonAnimation="slide-up"
+          className="py-20"
+        />
+      </div>
 
-    const socialLinks = [
+      <div id="products">
-        { icon: Globe, label: "damienghader", href: "https://twitter.com" },
+        <FeatureCardEight
-        { icon: MessageCircle, label: "damienghader", href: "https://instagram.com" },
+          title="Essential Collections"
-        { icon: Sparkles, label: "damienghader", href: "https://linkedin.com" },
+          description="From organic treats to durable enrichment toys, we've hand-picked everything your pet needs to thrive."
-    ];
+          textboxLayout="default"
-
+          useInvertedBackground={false}
-    const linkCards = [
+          features={[
-        {
+            { id: 1, title: "Healthy Treats", description: "Nutrient-rich snacks for training and rewards.", imageSrc: "https://images.unsplash.com/photo-1585559895316-29177119f074?w=400&h=400&fit=crop" },
-            icon: Code,
+            { id: 2, title: "Enrichment Toys", description: "Mental stimulation to keep minds sharp.", imageSrc: "https://images.unsplash.com/photo-1544568100-847a9b858f65?w=400&h=400&fit=crop" },
-            title: "Work with my agency",
+            { id: 3, title: "Cozy Bedding", description: "Supreme comfort for dream-filled naps.", imageSrc: "https://images.unsplash.com/photo-1592194996308-7b43878e84a6?w=400&h=400&fit=crop" }
-            description: "Work with my agency to build your MVP",
+          ]}
-            button: { text: "Get started", href: "#" },
+        />
-        },
+      </div>
-        {
+    </ThemeProvider>
-            icon: Sparkles,
+  );
-            title: "20% off your Webild plan",
-            description: "Use my promo code to get Webild credits",
-            button: { text: "Get credits", href: "#" },
-        },
-        {
-            icon: Users,
-            title: "Join my community",
-            description: "Join the AI Founders Club",
-            button: { text: "Sign up", href: "#" },
-        },
-    ];
-
-    return (
-        <ThemeProvider
-            defaultButtonVariant="text-stagger"
-            defaultTextAnimation="entrance-slide"
-            borderRadius="rounded"
-            contentWidth="medium"
-            sizing="medium"
-            background="none"
-            cardStyle="gradient-bordered"
-            primaryButtonStyle="flat"
-            secondaryButtonStyle="solid"
-            headingFontWeight="medium"
-        >
-            <HeroPersonalLinks
-                background={{ variant: "downward-rays-animated-grid" }}
-                title="I help people design software with AI"
-                titleSegments={titleSegments}
-                socialLinks={socialLinks}
-                linkCards={linkCards}
-            />
-        </ThemeProvider>
-    );
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #0a0a0a;
+  --background: #ffffff;
-  --card: #1a1a1a;
+  --card: #f9f9f9;
-  --foreground: #ffffffe6;
+  --foreground: #000612e6;
-  --primary-cta: #e6e6e6;
+  --primary-cta: #15479c;
-  --primary-cta-text: #0a0a0a;
+  --primary-cta-text: #ffffff;
-  --secondary-cta: #1a1a1a;
+  --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #ffffffe6;
+  --secondary-cta-text: #000612e6;
-  --accent: #737373;
+  --accent: #e2e2e2;
-  --background-accent: #737373;
+  --background-accent: #c4c4c4;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);