Update src/app/page.tsx

Merge version_1 into main

src/app/layout.tsx

@@ -7,43 +7,28 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
 import Tag from "@/tag/Tag";
 
 const halant = Halant({
-  variable: "--font-halant",
+  variable: "--font-halant",  subsets: ["latin"],
-  subsets: ["latin"],
   weight: ["300", "400", "500", "600", "700"],
 });
 
 const inter = Inter({
-  variable: "--font-inter",
+  variable: "--font-inter",  subsets: ["latin"],
-  subsets: ["latin"],
 });
 
 const poppins = Poppins({
-  variable: "--font-poppins",
+  variable: "--font-poppins",  subsets: ["latin"],
-  subsets: ["latin"],
   weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
 });
 
 export const metadata: Metadata = {
-  title: "Flavia - Contemporary Abstract Art Gallery",
+  title: "Flavia - Contemporary Abstract Art Gallery",  description: "Discover investment-quality contemporary abstract paintings by Flavia. Museum-quality artwork for collectors, designers, and art professionals.",  keywords: "contemporary art, abstract paintings, art gallery, artist portfolio, original artwork, art collector, contemporary abstract",  openGraph: {
-  description: "Discover investment-quality contemporary abstract paintings by Flavia. Museum-quality artwork for collectors, designers, and art professionals.",
+    title: "Flavia - Contemporary Abstract Art",    description: "Explore original contemporary abstract paintings curated for collectors.",    type: "website",    siteName: "Flavia Contemporary Art",    images: [
-  keywords: "contemporary art, abstract paintings, art gallery, artist portfolio, original artwork, art collector, contemporary abstract",
-  openGraph: {
-    title: "Flavia - Contemporary Abstract Art",
-    description: "Explore original contemporary abstract paintings curated for collectors.",
-    type: "website",
-    siteName: "Flavia Contemporary Art",
-    images: [
       {
-        url: "http://img.b2bpic.net/free-photo/creative-view-indoors-window-curtains_23-2149657515.jpg",
+        url: "http://img.b2bpic.net/free-photo/creative-view-indoors-window-curtains_23-2149657515.jpg",        alt: "Flavia's contemporary abstract artwork"},
-        alt: "Flavia's contemporary abstract artwork",
-      },
     ],
   },
   twitter: {
-    card: "summary_large_image",
+    card: "summary_large_image",    title: "Flavia - Contemporary Abstract Art",    description: "Discover investment-quality contemporary abstract paintings.",    images: ["http://img.b2bpic.net/free-photo/creative-view-indoors-window-curtains_23-2149657515.jpg"],
-    title: "Flavia - Contemporary Abstract Art",
-    description: "Discover investment-quality contemporary abstract paintings.",
-    images: ["http://img.b2bpic.net/free-photo/creative-view-indoors-window-curtains_23-2149657515.jpg"],
   },
   robots: {
     index: true,
@@ -1435,4 +1420,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -5,24 +5,25 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import MediaAbout from "@/components/sections/about/MediaAbout";
 import ProductCardFour from "@/components/sections/product/ProductCardFour";
+import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
 import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
 import PricingCardNine from "@/components/sections/pricing/PricingCardNine";
 import ContactText from "@/components/sections/contact/ContactText";
 import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { Sparkles, Palette, Brush, Lightbulb } from "lucide-react";
 
 export default function HomePage() {
   const navItems = [
     { name: "Gallery", id: "gallery" },
+    { name: "Process", id: "process" },
     { name: "About", id: "about" },
-    { name: "Works", id: "works" },
     { name: "Contact", id: "contact" },
     { name: "Inquire", id: "inquire" },
   ];
 
   const footerColumns = [
     {
-      title: "Gallery",
+      title: "Gallery",      items: [
-      items: [
         { label: "View All Works", href: "/gallery" },
         { label: "Featured Pieces", href: "#gallery" },
         { label: "Collection", href: "/gallery" },
@@ -30,8 +31,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "About",
+      title: "About",      items: [
-      items: [
         { label: "Artist Bio", href: "/" },
         { label: "Studio Practice", href: "/" },
         { label: "Commissions", href: "#pricing" },
@@ -39,8 +39,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Contact",
+      title: "Contact",      items: [
-      items: [
         { label: "Get in Touch", href: "/" },
         { label: "Commission Inquiry", href: "/" },
         { label: "Email", href: "mailto:hello@flavia-art.com" },
@@ -49,6 +48,39 @@ export default function HomePage() {
     },
   ];
 
+  const processSteps = [
+    {
+      id: "1",      title: "Creative Discovery",      description: "We begin with an in-depth consultation to understand your vision, space, and aesthetic preferences. This collaborative process ensures the final artwork perfectly complements your collection and environment.",      media: {
+        imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZyB3ZFfTTE8DAACFhZ0bscJsy/uploaded-1772815746914-5npc4xl7.jpg?_wi=1",        imageAlt: "Studio consultation workspace with color palettes and design sketches"},
+      items: [
+        { icon: Sparkles, text: "Vision alignment" },
+        { icon: Palette, text: "Color exploration" },
+        { icon: Lightbulb, text: "Concept development" },
+      ],
+      reverse: false,
+    },
+    {
+      id: "2",      title: "Artistic Execution",      description: "Flavia's studio practice combines traditional techniques with contemporary materials. Each piece undergoes multiple refinement rounds to achieve the perfect balance of form, color, and emotional resonance.",      media: {
+        imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZyB3ZFfTTE8DAACFhZ0bscJsy/uploaded-1772815746914-5npc4xl7.jpg?_wi=2",        imageAlt: "Artist at work in the studio with canvas and paint"},
+      items: [
+        { icon: Brush, text: "Hands-on creation" },
+        { icon: Palette, text: "Material mastery" },
+        { icon: Lightbulb, text: "Quality assurance" },
+      ],
+      reverse: true,
+    },
+    {
+      id: "3",      title: "Final Presentation",      description: "Every artwork is carefully prepared with museum-quality materials and professional finishing. We provide installation consultation and detailed care instructions to ensure your piece maintains its beauty for generations.",      media: {
+        imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AZyB3ZFfTTE8DAACFhZ0bscJsy/uploaded-1772815746914-5npc4xl7.jpg?_wi=3",        imageAlt: "Finished artwork displayed in gallery setting"},
+      items: [
+        { icon: Sparkles, text: "Premium finishing" },
+        { icon: Palette, text: "Professional framing" },
+        { icon: Brush, text: "Installation support" },
+      ],
+      reverse: false,
+    },
+  ];
+
   return (
     <ThemeProvider
       defaultButtonVariant="text-shift"
@@ -65,7 +97,7 @@ export default function HomePage() {
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
           navItems={navItems}
-          brandName="Flavia"
+          brandName=""
           bottomLeftText="Contemporary Abstract Art"
           bottomRightText="hello@flavia-art.com"
         />
@@ -93,37 +125,13 @@ export default function HomePage() {
           tag="Gallery"
           products={[
             {
-              id: "artwork-01",
+              id: "artwork-01",              name: "Emergence No. 3",              price: "$2,800",              variant: "Canvas  48\" × 60\"  Oil & Acrylic",              imageSrc: "http://img.b2bpic.net/free-vector/gradient-minimal-hand-drawn-cover-collection_23-2149015394.jpg?_wi=1",              imageAlt: "Emergence No. 3 - Contemporary abstract painting"},
-              name: "Emergence No. 3",
-              price: "$2,800",
-              variant: "Canvas  48\" × 60\"  Oil & Acrylic",
-              imageSrc: "http://img.b2bpic.net/free-vector/gradient-minimal-hand-drawn-cover-collection_23-2149015394.jpg?_wi=1",
-              imageAlt: "Emergence No. 3 - Contemporary abstract painting",
-            },
             {
-              id: "artwork-02",
+              id: "artwork-02",              name: "Resonance",              price: "$3,200",              variant: "Canvas  60\" × 72\"  Mixed Media",              imageSrc: "http://img.b2bpic.net/free-photo/concrete-wall-with-rough-surface_23-2148399167.jpg?_wi=1",              imageAlt: "Resonance - Modern abstract artwork"},
-              name: "Resonance",
-              price: "$3,200",
-              variant: "Canvas  60\" × 72\"  Mixed Media",
-              imageSrc: "http://img.b2bpic.net/free-photo/concrete-wall-with-rough-surface_23-2148399167.jpg?_wi=1",
-              imageAlt: "Resonance - Modern abstract artwork",
-            },
             {
-              id: "artwork-03",
+              id: "artwork-03",              name: "Confluence",              price: "$2,500",              variant: "Canvas  42\" × 54\"  Oil on Canvas",              imageSrc: "http://img.b2bpic.net/free-vector/modern-memphis-background-with-colorful-shapes_1017-9383.jpg?_wi=1",              imageAlt: "Confluence - Abstract contemporary art"},
-              name: "Confluence",
-              price: "$2,500",
-              variant: "Canvas  42\" × 54\"  Oil on Canvas",
-              imageSrc: "http://img.b2bpic.net/free-vector/modern-memphis-background-with-colorful-shapes_1017-9383.jpg?_wi=1",
-              imageAlt: "Confluence - Abstract contemporary art",
-            },
             {
-              id: "artwork-04",
+              id: "artwork-04",              name: "Metamorphosis Series I",              price: "$3,500",              variant: "Canvas  60\" × 48\"  Acrylic & Ink",              imageSrc: "http://img.b2bpic.net/free-vector/hand-painted-watercolor-abstract-art-cover-collection_23-2148985063.jpg?_wi=1",              imageAlt: "Metamorphosis Series I - Contemporary abstract"},
-              name: "Metamorphosis Series I",
-              price: "$3,500",
-              variant: "Canvas  60\" × 48\"  Acrylic & Ink",
-              imageSrc: "http://img.b2bpic.net/free-vector/hand-painted-watercolor-abstract-art-cover-collection_23-2148985063.jpg?_wi=1",
-              imageAlt: "Metamorphosis Series I - Contemporary abstract",
-            },
           ]}
           gridVariant="uniform-all-items-equal"
           textboxLayout="default"
@@ -133,6 +141,18 @@ export default function HomePage() {
         />
       </div>
 
+      <div id="process" data-section="process">
+        <FeatureCardTen
+          features={processSteps}
+          title="The Creative Process"
+          description="From initial concept to final installation, we guide you through every step of bringing your vision to life. Our collaborative approach ensures authenticity and excellence in every commissioned piece."
+          tag="Studio"
+          textboxLayout="default"
+          animationType="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
       <div id="about" data-section="about">
         <MediaAbout
           title="About Flavia"
@@ -152,59 +172,23 @@ export default function HomePage() {
           tag="Testimonials"
           testimonials={[
             {
-              id: "testimonial-1",
+              id: "testimonial-1",              name: "Sarah Mitchell",              handle: "Collector, New York",              testimonial: "Flavia's paintings have transformed my collection. Each piece invites deeper contemplation with every viewing. Her commitment to authentic contemporary art is evident in every brushstroke.",              rating: 5,
-              name: "Sarah Mitchell",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5399.jpg?_wi=1",              imageAlt: "Sarah Mitchell"},
-              handle: "Collector, New York",
-              testimonial: "Flavia's paintings have transformed my collection. Each piece invites deeper contemplation with every viewing. Her commitment to authentic contemporary art is evident in every brushstroke.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5399.jpg?_wi=1",
-              imageAlt: "Sarah Mitchell",
-            },
             {
-              id: "testimonial-2",
+              id: "testimonial-2",              name: "James Chen",              handle: "Art Curator, Los Angeles",              testimonial: "Working with Flavia on gallery placements has been seamless. Her professionalism and the investment quality of her work make her one of the most sought-after contemporary artists in the current market.",              rating: 5,
-              name: "James Chen",
+              imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1",              imageAlt: "James Chen"},
-              handle: "Art Curator, Los Angeles",
-              testimonial: "Working with Flavia on gallery placements has been seamless. Her professionalism and the investment quality of her work make her one of the most sought-after contemporary artists in the current market.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1",
-              imageAlt: "James Chen",
-            },
             {
-              id: "testimonial-3",
+              id: "testimonial-3",              name: "Elena Rodriguez",              handle: "Interior Designer, Miami",              testimonial: "I've sourced multiple pieces from Flavia for high-end residential and corporate projects. Her abstract works provide the perfect balance of sophistication and visual impact. Her communication throughout the commission process was exceptional.",              rating: 5,
-              name: "Elena Rodriguez",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-blue-jacket_23-2149020777.jpg?_wi=1",              imageAlt: "Elena Rodriguez"},
-              handle: "Interior Designer, Miami",
-              testimonial: "I've sourced multiple pieces from Flavia for high-end residential and corporate projects. Her abstract works provide the perfect balance of sophistication and visual impact. Her communication throughout the commission process was exceptional.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-blue-jacket_23-2149020777.jpg?_wi=1",
-              imageAlt: "Elena Rodriguez",
-            },
             {
-              id: "testimonial-4",
+              id: "testimonial-4",              name: "Marcus Williams",              handle: "Corporate Art Buyer, Boston",              testimonial: "Flavia created a custom installation for our corporate headquarters. The process was professional, and the final work exceeded our expectations. Her abstract pieces elevate the entire space.",              rating: 5,
-              name: "Marcus Williams",
+              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1569.jpg",              imageAlt: "Marcus Williams"},
-              handle: "Corporate Art Buyer, Boston",
-              testimonial: "Flavia created a custom installation for our corporate headquarters. The process was professional, and the final work exceeded our expectations. Her abstract pieces elevate the entire space.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1569.jpg",
-              imageAlt: "Marcus Williams",
-            },
             {
-              id: "testimonial-5",
+              id: "testimonial-5",              name: "Isabella Rossi",              handle: "Gallery Director, Toronto",              testimonial: "Flavia's work consistently sells well in our gallery. Collectors appreciate the authenticity and intentionality behind each piece. She's a true contemporary artist with investment potential.",              rating: 5,
-              name: "Isabella Rossi",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-brunette-woman-model-pink-costume-with-no-makeup-isolated-gray_158538-12800.jpg",              imageAlt: "Isabella Rossi"},
-              handle: "Gallery Director, Toronto",
-              testimonial: "Flavia's work consistently sells well in our gallery. Collectors appreciate the authenticity and intentionality behind each piece. She's a true contemporary artist with investment potential.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-brunette-woman-model-pink-costume-with-no-makeup-isolated-gray_158538-12800.jpg",
-              imageAlt: "Isabella Rossi",
-            },
             {
-              id: "testimonial-6",
+              id: "testimonial-6",              name: "David Park",              handle: "Art Investor, Vancouver",              testimonial: "I've been collecting Flavia's work for three years. The value appreciation combined with the pure aesthetic pleasure of owning her pieces makes her one of my best art acquisitions.",              rating: 5,
-              name: "David Park",
+              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-posing-holding-tablet-computers-stairs_1262-20054.jpg",              imageAlt: "David Park"},
-              handle: "Art Investor, Vancouver",
-              testimonial: "I've been collecting Flavia's work for three years. The value appreciation combined with the pure aesthetic pleasure of owning her pieces makes her one of my best art acquisitions.",
-              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/colleagues-posing-holding-tablet-computers-stairs_1262-20054.jpg",
-              imageAlt: "David Park",
-            },
           ]}
           showRating={true}
           textboxLayout="default"
@@ -223,55 +207,22 @@ export default function HomePage() {
           useInvertedBackground={false}
           plans={[
             {
-              id: "small-commission",
+              id: "small-commission",              title: "Small Canvas",              price: "$1,500",              period: "starting at",              features: [
-              title: "Small Canvas",
+                "Up to 24\" × 36\" canvas",                "2 revision rounds",                "Initial consultation included",                "Gallery-quality materials"],
-              price: "$1,500",
-              period: "starting at",
-              features: [
-                "Up to 24\" × 36\" canvas",
-                "2 revision rounds",
-                "Initial consultation included",
-                "Gallery-quality materials",
-              ],
               button: {
-                text: "Request Commission",
+                text: "Request Commission",                href: "#contact"},
-                href: "#contact",
-              },
             },
             {
-              id: "medium-commission",
+              id: "medium-commission",              title: "Medium Canvas",              price: "$3,000",              period: "starting at",              features: [
-              title: "Medium Canvas",
+                "Up to 48\" × 60\" canvas",                "Unlimited revisions",                "Extended consultation process",                "Premium materials & framing",                "Installation guidance"],
-              price: "$3,000",
-              period: "starting at",
-              features: [
-                "Up to 48\" × 60\" canvas",
-                "Unlimited revisions",
-                "Extended consultation process",
-                "Premium materials & framing",
-                "Installation guidance",
-              ],
               button: {
-                text: "Request Commission",
+                text: "Request Commission",                href: "#contact"},
-                href: "#contact",
-              },
             },
             {
-              id: "large-commission",
+              id: "large-commission",              title: "Large Installation",              price: "$5,000",              period: "starting at",              features: [
-              title: "Large Installation",
+                "Custom size & format",                "Full creative collaboration",                "Multiple revision rounds",                "Museum-quality presentation",                "Professional installation support",                "Certificate of authenticity"],
-              price: "$5,000",
-              period: "starting at",
-              features: [
-                "Custom size & format",
-                "Full creative collaboration",
-                "Multiple revision rounds",
-                "Museum-quality presentation",
-                "Professional installation support",
-                "Certificate of authenticity",
-              ],
               button: {
-                text: "Request Commission",
+                text: "Request Commission",                href: "#contact"},
-                href: "#contact",
-              },
             },
           ]}
         />
@@ -301,4 +252,4 @@ export default function HomePage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-poppins), sans-serif;
+  font-family: var(--font-playfair-display), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-poppins), sans-serif;
+  font-family: var(--font-playfair-display), sans-serif;
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
+  --background: #f6f0e9;
-  --card: #f9f9f9;
+  --card: #efe7dd;
-  --foreground: #000f06e6;
+  --foreground: #2b180a;
-  --primary-cta: #0a7039;
+  --primary-cta: #2b180a;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #efe7dd;
   --secondary-cta-text: #000f06e6;
-  --accent: #e2e2e2;
+  --accent: #94877c;
-  --background-accent: #c4c4c4;
+  --background-accent: #afa094;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);