Update src/app/page.tsx

Merge version_12 into main

src/app/globals.css

@@ -1,3 +1,5 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import "tailwindcss";
+@import "./styles/variables.css";
+@import "./styles/theme.css";
+@import "./styles/utilities.css";
+@import "./styles/base.css";

src/app/layout.tsx

@@ -1,13 +1,15 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
-import "./globals.css";
 import "./styles/variables.css";
 import "./styles/base.css";
+import "./globals.css";
 
-const inter = Inter({ subsets: ["latin"] });
+const inter = Inter({
+  subsets: ["latin"],
+});
 
 export const metadata: Metadata = {
-  title: "Taishan Construction | Premium Hardscape & Outdoor Design",  description: "Toronto's trusted source for luxury outdoor spaces. Custom driveways, patios, and hardscaping designed with precision and built to last."};
+  title: "Taishan Construction",  description: "Premium hardscape and outdoor design services in Toronto and the Greater Toronto Area"};
 
 export default function RootLayout({
   children,

src/app/page.tsx

@@ -2,7 +2,8 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
 import BlogCardThree from '@/components/sections/blog/BlogCardThree';
@@ -77,13 +78,13 @@ export default function LandingPage() {
 
   const beforeAfterPairs: BeforeAfterImagePair[] = [
     {
-      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=1",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=1",      title: "Rendering vs. Completed Project"
+      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=1",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=1",      title: "Modern Interlock Driveway – North York"
     },
     {
-      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=1",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=1",      title: "3D Design to Reality"
+      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=1",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=1",      title: "Contemporary Patio Design – Toronto"
     },
     {
-      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=2",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=2",      title: "Luxury Interlock Installation"
+      beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=2",      afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=2",      title: "Luxury Stone Entry – Vaughan"
     }
   ];
 
@@ -114,29 +115,30 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroSplitDualMedia
+        <HeroBillboardGallery
           title="Designing Outdoor Spaces Worth Coming Home To"
-          description="Architectural precision meets refined craftsmanship. Premium hardscaping and custom construction throughout the Greater Toronto Area, where every detail is thoughtfully designed and expertly executed."
-          tag="Luxury Outdoor Architecture"
+          description="Premium construction, landscaping, and renovation services designed to elevate homes across Toronto and the GTA."
+          tag="6 Year Workmanship Warranty"
           tagIcon={Building2}
-          background={{ variant: "plain" }}
-          mediaItems={[
-            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=1",              imageAlt: "Architectural outdoor space showcase"
-            },
-            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=1",              imageAlt: "Premium hardscape design detail"
-            }
-          ]}
-          rating={5}
-          ratingText="1000+ Projects Completed"
+          tagAnimation="slide-up"
           buttons={[
-            { text: "Start Your Project", href: "#contact" },
-            { text: "View Portfolio", href: "#gallery" }
+            { text: "Get Your Free 3D Design", href: "#contact" },
+            { text: "View Our Work", href: "#gallery" }
           ]}
           buttonAnimation="slide-up"
+          mediaItems={[
+            {
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749873463-dkhyfy2r.jpg",              imageAlt: "Premium project showcase"
+            },
+            {
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749880030-2ulagvhd.jpg",              imageAlt: "Luxury construction detail"
+            },
+            {
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749880031-v2m3ehoo.jpg",              imageAlt: "Contemporary design"
+            }
+          ]}
           mediaAnimation="slide-up"
-          tagAnimation="slide-up"
+          background={{ variant: "plain" }}
           textBoxClassName="max-w-2xl"
           titleClassName="text-5xl lg:text-6xl font-bold leading-tight tracking-tight"
           descriptionClassName="text-lg lg:text-xl leading-relaxed"
@@ -145,64 +147,52 @@ export default function LandingPage() {
       </div>
 
       <div id="taishan-effect" data-section="taishan-effect">
-        <SplitAbout
-          title="The Taishan Signature Approach"
-          description="A refined process combining strategic planning, photorealistic 3D visualization, and curated material selection. We design with intention, visualize with precision, and build with expertise."
-          tag="Our Methodology"
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          imagePosition="right"
-          mediaAnimation="slide-up"
-          bulletPoints={[
-            {
-              title: "Strategic Planning",              description: "Detailed site analysis and master planning that transforms your vision into a cohesive outdoor architecture",              icon: Eye
-            },
-            {
-              title: "3D Visualization",              description: "Photorealistic renderings allowing you to experience your project before construction, ensuring complete confidence in the design",              icon: CheckCircle2
-            },
-            {
-              title: "Material Curation",              description: "Carefully selected premium materials showcased in our outdoor showroom, chosen for both aesthetic excellence and lasting performance",              icon: Palette
-            },
-            {
-              title: "Expert Execution",              description: "Certified installation teams with years of experience in luxury hardscape and construction projects",              icon: Users
-            },
-            {
-              title: "Refined Communication",              description: "Transparent project management with detailed timelines and consistent updates throughout construction",              icon: MessageCircle
-            }
+        <HeroSplitKpi
+          title="The Taishan Approach"
+          description="A refined methodology combining architectural precision, cutting-edge visualization, and curated material expertise to create outdoor spaces of enduring beauty."
+          background={{ variant: "plain" }}
+          kpis={[
+            { value: "3D", label: "Project Visualization " },
+            { value: "Custom", label: "Designed Projects" },
+            { value: "6 Year", label: "Warranty Coverage" }
           ]}
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=1"
-          imageAlt="Premium material showcase and design consultation"
-          buttons={[{ text: "Explore Our Process", href: "#process" }]}
+          enableKpiAnimation={true}
+          tag="Our Process"
+          tagIcon={Eye}
+          tagAnimation="slide-up"
+          buttons={[{ text: "Explore Our Approach", href: "#contact" }]}
           buttonAnimation="slide-up"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749903650-czkpede9.jpg"
+          imageAlt="Material showroom display"
+          mediaAnimation="slide-up"
+          imagePosition="right"
           titleClassName="text-5xl font-bold mb-4"
           descriptionClassName="text-lg leading-relaxed mb-8"
-          bulletTitleClassName="text-xl font-semibold mb-2"
         />
       </div>
 
       <div id="3d-design" data-section="3d-design">
         <FeatureHoverPattern
-          title="Step Into Your Future Backyard"
-          description="Experience the emotional transformation before we build. Our complimentary 3D architectural renderings empower you to visualize every detail—from material textures to landscape integration—making confident design decisions with complete clarity."
+          title="See Your Project Before a Single Brick Is Laid"
+          description=""
           tag="Visualization Technology"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
           features={[
             {
               icon: Eye,
-              title: "Photorealistic 3D Renderings",              description: "Crystal-clear architectural visualizations showcasing materials, proportions, lighting, and surrounding landscape integration",              button: { text: "Get Free 3D Design", href: "#contact" }
+              title: "Professional 3D Visualization",              description: "We create realistic renderings that show layout, materials, elevation, and lighting so you can clearly see how your project will look before construction begins.",              button: { text: "Request Your Vision", href: "#contact" }
             },
             {
               icon: ArrowRightLeft,
-              title: "Before & After Experience",              description: "Side-by-side visualizations showing your current property and the completed outdoor sanctuary of your dreams"
+              title: "Design vs Final Result",              description: "Compare our 3D design with the completed project to see how accurate planning leads to beautiful finished results."
             }
           ]}
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
           buttonAnimation="slide-up"
-          buttons={[{ text: "Request Your Free 3D Design", href: "#contact" }]}
+          buttons={[{ text: "Begin Your Design Journey", href: "#contact" }]}
           cardTitleClassName="text-5xl font-bold mb-4"
         />
       </div>
@@ -211,37 +201,36 @@ export default function LandingPage() {
         <div className="px-6 lg:px-12 py-16 lg:py-24">
           <div className="max-w-7xl mx-auto">
             <div className="mb-12">
-              <p className="text-sm font-semibold uppercase tracking-wider text-primary-cta mb-2">Design-Focused Solutions</p>
-              <h2 className="text-4xl lg:text-5xl font-bold mb-4">Architectural Services</h2>
-              <p className="text-lg text-foreground/80">Premium hardscape architecture and construction services throughout Toronto and the Greater Toronto Area. Each project reflects refined design principles and masterful execution.
-              </p>
+              <p className="text-sm font-semibold uppercase tracking-wider text-primary-cta mb-2">Design + Craftsmanship</p>
+              <h2 className="text-4xl lg:text-5xl font-bold mb-4">What We Build.</h2>
+              <p className="text-lg text-foreground/80">We specialize in premium outdoor construction — including driveways, patios, walkways, entrances, retaining walls, and landscape lighting — helping homeowners across the GTA transform their properties.</p>
             </div>
 
             <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
               {[
                 {
                   id: "interlock",                  icon: Cog,
-                  title: "Architectural Interlock Driveways",                  description: "Custom interlock design with premium materials, proportional patterns, and professional installation"
+                  title: "Interlock Driveways",                  description: "Premium interlock paving systems designed with precision and executed with masterful craftsmanship"
                 },
                 {
                   id: "patios",                  icon: Palette,
-                  title: "Designer Backyard Patios",                  description: "Architectural patio design transforming outdoor living into refined entertaining spaces"
+                  title: "Outdoor Living Spaces",                  description: "Custom outdoor living areas designed for relaxing, entertaining, and extending the functionality of your backyard."
                 },
                 {
                   id: "walkways",                  icon: Footprints,
-                  title: "Architectural Walkways",                  description: "Thoughtfully designed pathways connecting properties with sophisticated material selection"
+                  title: "Signature Pathway Design",                  description: "Architecturally composed walkways connecting spaces with refined elegance and functionality"
                 },
                 {
                   id: "retaining",                  icon: Building2,
-                  title: "Structural Retaining Walls",                  description: "Engineering-focused wall design combining structure and aesthetic refinement"
+                  title: "Structural Stone Elements",                  description: "Engineered retaining walls combining aesthetic refinement with enduring structural integrity"
                 },
                 {
                   id: "porches",                  icon: Home,
-                  title: "Natural Stone Entry Porches",                  description: "Premium stone architectural features creating distinguished curb appeal"
+                  title: "Natural Stone Entry Statements",                  description: "Premium stone features creating commanding first impressions and architectural distinction"
                 },
                 {
                   id: "lighting",                  icon: Zap,
-                  title: "Architectural Landscape Lighting",                  description: "Professional outdoor lighting design enhancing ambiance and architectural details"
+                  title: "Curated Landscape Illumination",                  description: "Professional lighting design systems enhancing ambiance, function, and architectural character"
                 }
               ].map((service) => (
                 <div
@@ -258,8 +247,8 @@ export default function LandingPage() {
                   {servicesHoveredCard === service.id && (
                     <div className="absolute inset-0 rounded-lg bg-black/50 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300 pointer-events-none">
                       <div className="text-center text-white p-4">
-                        <p className="font-semibold">See examples of this service</p>
-                        <p className="text-sm text-white/80">in our project gallery</p>
+                        <p className="font-semibold">Explore our portfolio</p>
+                        <p className="text-sm text-white/80">of completed transformations</p>
                       </div>
                     </div>
                   )}
@@ -268,8 +257,8 @@ export default function LandingPage() {
             </div>
 
             <div className="bg-card rounded-lg p-8 border border-accent/20">
-              <h3 className="text-2xl font-bold mb-6">Architectural Interlock Showcase</h3>
-              <p className="text-foreground/80 mb-8">Hover over the slider to compare our 3D architectural renderings with completed installations:</p>
+              <h3 className="text-2xl font-bold mb-6">From Design to Reality.</h3>
+              <p className="text-foreground/80 mb-8">Compare our 3D designs with the finished construction:</p>
               <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
                 {beforeAfterPairs.map((pair, index) => (
                   <BeforeAfterCard
@@ -288,31 +277,30 @@ export default function LandingPage() {
         <div className="px-6 lg:px-12 py-16 lg:py-24">
           <div className="max-w-7xl mx-auto">
             <div className="mb-12">
-              <p className="text-sm font-semibold uppercase tracking-wider text-primary-cta mb-2">Portfolio Showcase</p>
-              <h2 className="text-4xl lg:text-5xl font-bold mb-4">Completed Projects</h2>
-              <p className="text-lg text-foreground/80">Explore our portfolio of architectural hardscape and construction projects throughout the Greater Toronto Area.
-              </p>
+              <p className="text-sm font-semibold uppercase tracking-wider text-primary-cta mb-2">Project Portfolio</p>
+              <h2 className="text-4xl lg:text-5xl font-bold mb-4">Featured Projects</h2>
+              <p className="text-lg text-foreground/80">Explore some of our recent driveway, patio, and backyard transformation projects across Toronto and the GTA.</p>
             </div>
 
             <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
               {[
                 {
-                  id: "project-1",                  title: "Luxury Architectural Installation",                  type: "Interlock Driveway",                  location: "North York, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=2",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=2",                  description: "Premium hardscape installation showcasing architectural precision and craftsmanship"
+                  id: "project-1",                  title: "Luxury Residential Development",                  category: "Modern Hardscape – Scarborough",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=2",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=2",                  description: "Precision-crafted hardscape showcasing refined design and meticulous execution"
                 },
                 {
-                  id: "project-2",                  title: "Contemporary Hardscape Design",                  type: "Patio Installation",                  location: "Vaughan, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=2",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=2",                  description: "Large format pavers with sophisticated design and professional finishing"
+                  id: "project-2",                  title: "Contemporary Hardscape Design",                  category: "Architectural Interlock – Toronto",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=2",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=2",                  description: "Large format architectural design with sophisticated material composition and refined finishing"
                 },
                 {
-                  id: "project-3",                  title: "Refined Outdoor Living Design",                  type: "Backyard Transformation",                  location: "Toronto, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=3",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=3",                  description: "Complete outdoor transformation with premium materials and expert installation"
+                  id: "project-3",                  title: "Luxury Outdoor Living Space",                  category: "Premium Patio – North York",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=3",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=3",                  description: "Complete outdoor transformation merging design vision with architectural precision"
                 },
                 {
-                  id: "project-4",                  title: "Luxury Entertainment Patio",                  type: "Architectural Patio",                  location: "Markham, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=3",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=3",                  description: "Multi-level design with integrated features and ambient lighting"
+                  id: "project-4",                  title: "Premium Patio Entertainment Area",                  category: "Multi-Level Design – Vaughan",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=3",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=3",                  description: "Sophisticated multi-level composition with integrated features and ambient illumination"
                 },
                 {
-                  id: "project-5",                  title: "Natural Stone Architectural Entry",                  type: "Stone Porch",                  location: "Richmond Hill, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=4",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=4",                  description: "Custom stone architectural work creating distinguished curb appeal"
+                  id: "project-5",                  title: "Natural Stone Entry Design",                  category: "Stone Architecture – Markham",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=4",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-uklcyhsf.jpg?_wi=4",                  description: "Bespoke stone elements creating architectural distinction and timeless curb appeal"
                 },
                 {
-                  id: "project-6",                  title: "Professional Landscape Integration",                  type: "Hardscape Design",                  location: "Scarborough, ON",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=4",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=4",                  description: "Complete landscape architecture enhancing property flow and design"
+                  id: "project-6",                  title: "Professional Landscape Installation",                  category: "Landscape Transformation – Richmond Hill",                  beforeSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-lbulq2e9.jpg?_wi=4",                  afterSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-ok3joqnq.jpg?_wi=4",                  description: "Comprehensive landscape composition enhancing property flow and spatial experience"
                 }
               ].map((project) => (
                 <div
@@ -339,8 +327,7 @@ export default function LandingPage() {
                           className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300"
                         />
                         <div className="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent p-4 flex flex-col justify-end">
-                          <p className="text-xs text-white/70 mb-1">{project.type}</p>
-                          <p className="text-xs text-white/60 mb-2">{project.location}</p>
+                          <p className="text-xs text-white/70 mb-2">{project.category}</p>
                           <h3 className="text-lg font-semibold text-white">{project.title}</h3>
                           <p className="text-sm text-white/80 mt-2">{project.description}</p>
                         </div>
@@ -356,9 +343,10 @@ export default function LandingPage() {
 
       <div id="showroom" data-section="showroom">
         <SplitAbout
-          title="Visit Our Outdoor Material Showroom"
-          description="Experience curated materials and design inspiration in person. Compare premium interlock, natural stone, and landscape lighting solutions with our expert team before finalizing your project."
-          tag="Showroom Experience"
+          title="Visit Our 
+10,000 SQFT Design Showroom"
+          description="Explore interlock, natural stone, lighting, and outdoor features in person. Our team helps you compare materials and make confident decisions before construction begins."
+          tag="10,000+ SQFT SHOWROOM "
           tagAnimation="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
@@ -366,21 +354,22 @@ export default function LandingPage() {
           mediaAnimation="slide-up"
           bulletPoints={[
             {
-              title: "Material Exploration",              description: "Touch and examine authentic materials, finishes, and color options for your architectural project",              icon: Eye
+              title: "Experience Materials In Person
+",              description: "See and feel real interlock, natural stone, lighting, and outdoor materials in our showroom so you can confidently choose what fits your home.",              icon: Eye
             },
             {
-              title: "Design Consultation",              description: "Our architectural team guides you through material selection aligned with your vision and investment",              icon: Users
+              title: "Design Consultation With Experts",              description: "Work with our team to plan layouts, materials, and features that balance design, durability, and budget.",              icon: Users
             },
             {
-              title: "Project Visualization",              description: "Combine showroom samples with 3D renderings to finalize your complete design concept",              icon: Lightbulb
+              title: "Render-to-Reality Visualization",              description: "View your project in 3D on a big screen and compare materials with real samples to ensure everything works together before construction begins.",              icon: Lightbulb
             },
             {
-              title: "Premium Collections",              description: "Exclusive access to high-end materials and professional-grade architectural lighting systems",              icon: Crown
+              title: "Live Design Configuration",              description: "Work 1:1 to adjust layouts, materials, and features in real time. We configure every detail together so your project is tailored exactly to your space.",              icon: Crown
             }
           ]}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=1"
-          imageAlt="Premium material showroom and design display"
-          buttons={[{ text: "Schedule Showroom Consultation", href: "#contact" }]}
+          imageAlt="Material showroom samples and display"
+          buttons={[{ text: "Schedule Your Consultation", href: "#contact" }]}
           buttonAnimation="slide-up"
           titleClassName="text-5xl font-bold mb-4"
           descriptionClassName="text-lg leading-relaxed mb-8"
@@ -389,22 +378,22 @@ export default function LandingPage() {
 
       <div id="process" data-section="process">
         <MetricCardTen
-          title="Our Architectural Process"
-          description="A refined methodology delivering premium hardscape projects with precision, transparency, and exceptional craftsmanship."
-          tag="Professional Execution"
+          title="The Design & Build Journey"
+          description="A collaborative process grounded in precision planning, transparent communication, and architectural excellence at every stage."
+          tag="Professional Process"
           tagAnimation="slide-up"
           metrics={[
             {
-              id: "1",              title: "Strategic Consultation",              subtitle: "Understanding your vision, site conditions, and architectural aspirations",              category: "Phase 1",              value: "Complimentary"
+              id: "1",              title: "Architectural Vision Discovery",              subtitle: "Understanding your lifestyle, aesthetic preferences, and project aspirations in depth",              category: "Step 1",              value: "Complimentary"
             },
             {
-              id: "2",              title: "Architectural Design & 3D Visualization",              subtitle: "Professional renderings and detailed architectural specifications",              category: "Phase 2",              value: "Included"
+              id: "2",              title: "Design Development & Rendering",              subtitle: "Photorealistic 3D visualizations revealing every detail before construction commences",              category: "Step 2",              value: "Included"
             },
             {
-              id: "3",              title: "Expert Installation",              subtitle: "Master craftsmen and certified teams with years of hardscape experience",              category: "Phase 3",              value: "Fully Insured"
+              id: "3",              title: "Master Craftsmanship Execution",              subtitle: "Specialized installation teams bringing architectural precision to every element of your project",              category: "Step 3",              value: "Fully Insured"
             },
             {
-              id: "4",              title: "Final Inspection & Warranty",              subtitle: "Comprehensive walkthrough, final touches, and project guarantees",              category: "Phase 4",              value: "Guaranteed"
+              id: "4",              title: "Final Realization & Stewardship",              subtitle: "Comprehensive walkthrough, final refinements, and warranty protection ensuring lasting beauty",              category: "Step 4",              value: "Guaranteed"
             }
           ]}
           textboxLayout="default"
@@ -417,28 +406,28 @@ export default function LandingPage() {
 
       <div id="testimonials" data-section="testimonials">
         <TestimonialCardTen
-          title="Trusted By Discerning Homeowners"
-          description="Hear from homeowners who invested in premium outdoor architecture and are thrilled with their Taishan experience."
+          title="Trusted By Discerning Homeowners Across the GTA"
+          description="Discover what our clients value most: architectural vision realized, transformative design, and uncompromising craftsmanship."
           tag="Client Testimonials"
           tagAnimation="slide-up"
           testimonials={[
             {
-              id: "1",              title: "Complete Driveway Transformation",              quote: "Taishan's approach to our driveway was genuinely architectural. The 3D renderings were photorealistic, and the team's attention to every detail was exceptional. This isn't just construction—it's craftsmanship. Highly recommended for anyone serious about their property investment.",              name: "Jennifer Chen",              role: "Toronto Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=2",              imageAlt: "Jennifer Chen"
+              id: "1",              title: "Complete Driveway Transformation",              quote: "Taishan elevated our driveway from ordinary to extraordinary. The 3D design process was revelatory—seeing the final vision before construction meant we could make truly confident decisions. The installation team's precision and professionalism exceeded every expectation.",              name: "Jennifer Chen",              role: "Toronto Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=2",              imageAlt: "Jennifer Chen"
             },
             {
-              id: "2",              title: "Outstanding Patio Project",              quote: "We couldn't be more pleased with our patio. The team listened intently to our vision, created stunning 3D visualizations, and delivered exactly as promised. The level of professional project management and design refinement exceeded our expectations.",              name: "Michael Rodriguez",              role: "Vaughan Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=3",              imageAlt: "Michael Rodriguez"
+              id: "2",              title: "Architectural Patio Masterpiece",              quote: "They didn't just build a patio—they created an outdoor sanctuary that transformed how we experience our property. The design process was collaborative, the vision brought to life with masterful precision. This is luxury redefined.",              name: "Michael Rodriguez",              role: "Vaughan Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=3",              imageAlt: "Michael Rodriguez"
             },
             {
-              id: "3",              title: "Professional & Refined",              quote: "From initial consultation through final inspection, Taishan demonstrated genuine professionalism and expertise. Their material showroom was instrumental in our selection process, and the finished result has truly transformed our property.",              name: "Sarah Thompson",              role: "North York Resident",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=4",              imageAlt: "Sarah Thompson"
+              id: "3",              title: "Design Sophistication & Excellence",              quote: "From consultation through completion, every interaction reflected true professionalism and architectural expertise. Their material showroom made material selection feel like an art form. The finished result is stunning—every detail matters.",              name: "Sarah Thompson",              role: "North York Resident",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=4",              imageAlt: "Sarah Thompson"
             },
             {
-              id: "4",              title: "Worth Every Investment",              quote: "This is clearly a luxury architectural firm, not just a contractor. The entire experience felt premium—from the design consultation to project completion. Our property value and curb appeal have both dramatically improved.",              name: "David Park",              role: "Markham Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=5",              imageAlt: "David Park"
+              id: "4",              title: "Transformative Architectural Vision",              quote: "This is clearly a design-focused architecture firm, not a conventional contractor. The entire journey felt premium—from the initial vision consultation through the final reveal. Our property has been architecturally transformed.",              name: "David Park",              role: "Markham Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=5",              imageAlt: "David Park"
             },
             {
-              id: "5",              title: "Exceptional Mastery",              quote: "We engaged Taishan for a complex multi-phase project and they handled every phase with sophistication. Their expertise was evident in every decision, and our backyard is now a true outdoor sanctuary.",              name: "Lisa Martinez",              role: "Richmond Hill Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=6",              imageAlt: "Lisa Martinez"
+              id: "5",              title: "Precision & Craftsmanship",              quote: "Exceptional expertise and meticulous attention to detail in every phase. The team's knowledge of materials and execution was evident in every interaction. Our foundation improvements are built to last for generations.",              name: "Lisa Martinez",              role: "Richmond Hill Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=6",              imageAlt: "Lisa Martinez"
             },
             {
-              id: "6",              title: "Complete Outdoor Architecture",              quote: "Taishan orchestrated our entire backyard redesign—patio, lighting, landscaping—with seamless coordination. The finished outdoor space is absolutely stunning and has become our favorite place to spend time.",              name: "Robert Williams",              role: "Scarborough Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=7",              imageAlt: "Robert Williams"
+              id: "6",              title: "Complete Outdoor Transformation",              quote: "Taishan coordinated our entire backyard renovation—patio, landscape architecture, and professional lighting—into a cohesive masterpiece. The transformation is breathtaking. We now have the outdoor sanctuary we've always envisioned.",              name: "Robert Williams",              role: "Scarborough Homeowner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXh5KliD4l7rWjrQZkOq7ZuPnH/uploaded-1772749929936-heyeujvs.jpg?_wi=7",              imageAlt: "Robert Williams"
             }
           ]}
           textboxLayout="default"
@@ -451,31 +440,31 @@ export default function LandingPage() {
       <div id="contact" data-section="contact">
         <ContactFaq
           ctaTitle="Let's Create Something Exceptional"
-          ctaDescription="Begin your outdoor architectural journey with a complimentary consultation and 3D project preview."
+          ctaDescription="Start planning your outdoor transformation today. Your first consultation includes a comprehensive site assessment and complimentary architectural concepts."
           ctaButton={{
-            text: "Start Your Project",            href: "mailto:info@taishanconstruction.com?subject=Project%20Consultation%20Request"
+            text: "Start Your Project",            href: "mailto:info@taishanconstruction.com?subject=Begin%20My%20Design%20Consultation"
           }}
           ctaIcon={Sparkles}
           useInvertedBackground={false}
           animationType="slide-up"
           faqs={[
             {
-              id: "1",              title: "What areas do you service?",              content: "We service the entire Greater Toronto Area (GTA), including Toronto, Scarborough, Markham, North York, Richmond Hill, Vaughan, Pickering, Ajax, and surrounding communities. Contact us to discuss your specific location."
+              id: "1",              title: "Which areas do you serve?",              content: "We serve the entire Greater Toronto Area (GTA), including Toronto, Scarborough, Markham, North York, Richmond Hill, Vaughan, Pickering, Ajax, and surrounding communities. Contact us to discuss your specific location and project vision."
             },
             {
-              id: "2",              title: "Do you offer complimentary consultations?",              content: "Yes, we provide free on-site consultations for all projects. During your visit, we assess your property, understand your architectural vision, and provide transparent project estimates."
+              id: "2",              title: "Are consultations and design quotes complimentary?",              content: "Yes, we provide comprehensive on-site consultations and detailed design proposals at no cost. During your consultation, we assess your property, discuss your architectural vision, and provide transparent, detailed pricing."
             },
             {
-              id: "3",              title: "What does the 3D design process include?",              content: "Our complimentary 3D design service includes photorealistic architectural renderings showing materials, lighting, landscaping, and design details. This allows you to visualize the complete project and make confident design decisions before construction."
+              id: "3",              title: "What's included in your 3D design service?",              content: "Our photorealistic 3D renderings showcase your complete project—materials, finishes, lighting, landscaping, and architectural details. This visualization process allows you to experience your finished project before construction begins, enabling confident decision-making."
             },
             {
-              id: "4",              title: "What are typical project timelines?",              content: "Project timelines vary by scope. Driveway installations typically require 1-2 weeks, patios 2-3 weeks, and larger architectural projects 4-6 weeks. We provide detailed project schedules during the planning phase."
+              id: "4",              title: "What is the typical project timeline?",              content: "Timelines vary by scope and complexity. Driveway projects typically require 1-2 weeks, patios 2-3 weeks, and larger architectural commissions may take 4-6 weeks. We provide detailed scheduling during the planning phase."
             },
             {
-              id: "5",              title: "Do you offer project warranties?",              content: "Absolutely. We stand behind our work with comprehensive warranties including workmanship guarantees and material-specific coverage. Full warranty details are provided with your project estimate."
+              id: "5",              title: "Do you provide warranties on completed work?",              content: "Absolutely. We stand behind our craftsmanship with comprehensive warranties covering all workmanship and materials. Details are included in your project estimate and final contract."
             },
             {
-              id: "6",              title: "Can we visit your material showroom?",              content: "We encourage all homeowners to visit our outdoor material showroom to explore interlock collections, natural stone options, and landscape lighting systems. Please contact us to schedule a convenient time."
+              id: "6",              title: "Can I visit your material showroom?",              content: "We encourage you to experience our curated showroom displaying premium interlock options, natural stone varieties, and professional landscape lighting systems. Contact us to schedule your personal consultation."
             }
           ]}
         />
@@ -486,19 +475,19 @@ export default function LandingPage() {
           columns={[
             {
               title: "Services",              items: [
-                { label: "Interlock Driveways", href: "#services" },
-                { label: "Backyard Patios", href: "#services" },
-                { label: "Walkways", href: "#services" },
-                { label: "Retaining Walls", href: "#services" },
-                { label: "Natural Stone Porches", href: "#services" }
+                { label: "Architectural Interlock", href: "#services" },
+                { label: "Outdoor Design", href: "#services" },
+                { label: "Stone Architecture", href: "#services" },
+                { label: "Retaining Structures", href: "#services" },
+                { label: "Premium Entries", href: "#services" }
               ]
             },
             {
               title: "Company",              items: [
                 { label: "Our Process", href: "#process" },
-                { label: "Gallery", href: "#gallery" },
-                { label: "Showroom", href: "#showroom" },
-                { label: "About", href: "#taishan-effect" },
+                { label: "Project Gallery", href: "#gallery" },
+                { label: "Design Showroom", href: "#showroom" },
+                { label: "Our Approach", href: "#taishan-effect" },
                 { label: "Contact", href: "#contact" }
               ]
             },
@@ -511,7 +500,7 @@ export default function LandingPage() {
               ]
             }
           ]}
-          copyrightText="© 2024 Taishan Construction. All rights reserved. Premium hardscape and architectural design services for the GTA."
+          copyrightText="© 2024 Taishan Construction. All rights reserved. Premium architectural design and hardscape services for the Greater Toronto Area."
         />
       </div>
     </ThemeProvider>

src/app/styles/base.css

@@ -1,14 +1,28 @@
-@layer base {
-  body {
-    font-family: var(--font-inter), sans-serif;
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-family: var(--font-inter), sans-serif;
-  }
+* {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 1) rgba(255, 255, 255, 0);
+}
+
+html {
+  overscroll-behavior: none;
+  overscroll-behavior-y: none;
+}
+
+body {
+  background-color: var(--background);
+  color: var(--foreground);
+  font-family: var(--font-open-sans), sans-serif;
+  position: relative;
+  min-height: 100vh;
+  overscroll-behavior: none;
+  overscroll-behavior-y: none;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: var(--font-inter), sans-serif;
 }