Update src/app/styles/variables.css

Merge version_3 into main

src/app/page.tsx

@@ -21,10 +21,10 @@ export default function LandingPage() {
         borderRadius="soft"
         contentWidth="mediumLarge"
         sizing="largeSmallSizeLargeTitles"
-        background="grid"
+        background="noise"
-        cardStyle="gradient-radial"
+        cardStyle="soft-shadow"
-        primaryButtonStyle="primary-glow"
+        primaryButtonStyle="flat"
-        secondaryButtonStyle="layered"
+        secondaryButtonStyle="solid"
         headingFontWeight="semibold"
     >
       <ReactLenis root>
@@ -44,11 +44,11 @@ export default function LandingPage() {
         {
           name: "Contact",          id: "#contact"},
       ]}
-      logoSrc="http://img.b2bpic.net/free-vector/monocolor-minimalist-total-plumbing-logo-template_742173-19081.jpg"
+      logoSrc="http://img.b2bpic.net/free-vector/barbershop-logo-template_23-2149303358.jpg"
-      logoAlt="Westside Plumbing & Rooter Logo"
+      logoAlt="Westside Barbershop Logo"
-      brandName="Westside Plumbing & Rooter"
+      brandName="Westside Barbershop"
       button={{
-        text: "Get a Free Estimate",        href: "#contact"}}
+        text: "Book an Appointment",        href: "#contact"}}
     />
   </div>
 
@@ -56,27 +56,27 @@ export default function LandingPage() {
       <HeroBillboardRotatedCarousel
       background={{
         variant: "rotated-rays-static-grid"}}
-      title="Your Trusted Partner for Westside Plumbing & Rooter Services"
+      title="Experience the Finest Cuts & Styles at Westside Barbershop"
-      description="Expert plumbing solutions, dependable rooter services, and emergency repairs. We keep your water flowing smoothly and efficiently."
+      description="Precision haircuts, classic shaves, and modern grooming services designed for the discerning gentleman. Step in for a fresh look."
       buttons={[
         {
-          text: "Schedule Service",          href: "#contact"},
+          text: "Book Now",          href: "#contact"},
         {
-          text: "Emergency Service",          href: "#contact"},
+          text: "View Services",          href: "#services"},
       ]}
       carouselItems={[
         {
-          id: "carousel-item-1",          imageSrc: "http://img.b2bpic.net/free-photo/manufacturer-teaching-new-employee-how-shape-wooden-bowl-disc-sander_482257-99053.jpg",          imageAlt: "Plumber fixing a leaky pipe"},
+          id: "carousel-item-1",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-barber-wearing-stylish-apron-standing-next-red-leather-chair_141793-71822.jpg?_wi=1",          imageAlt: "Barber working on client's hair"},
         {
-          id: "carousel-item-2",          imageSrc: "http://img.b2bpic.net/free-photo/profile-man-touching-socket-wall-with-screwdriver_259150-58245.jpg",          imageAlt: "Professional drain cleaning service"},
+          id: "carousel-item-2",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-barber-finishing-haircut-client_23-2151121014.jpg",          imageAlt: "Close-up of a finished haircut"},
         {
-          id: "carousel-item-3",          imageSrc: "http://img.b2bpic.net/free-photo/hands-preparing-machine-scanning_23-2149341559.jpg",          imageAlt: "Technician inspecting a water heater"},
+          id: "carousel-item-3",          imageSrc: "http://img.b2bpic.net/free-photo/barber-shaving-customer-beard_23-2148906644.jpg?_wi=1",          imageAlt: "Traditional hot shave"},
         {
-          id: "carousel-item-4",          imageSrc: "http://img.b2bpic.net/free-photo/automatic-electronic-switch-control-water-pump-pressure-controller_627829-7493.jpg",          imageAlt: "Smiling plumber with professional tools"},
+          id: "carousel-item-4",          imageSrc: "http://img.b2bpic.net/free-photo/fashionable-male-barber-with-haircut-posing_23-2148782343.jpg",          imageAlt: "Stylish barber with tools"},
         {
-          id: "carousel-item-5",          imageSrc: "http://img.b2bpic.net/free-photo/people-using-mobile-phone_53876-22973.jpg",          imageAlt: "Emergency plumbing situation"},
+          id: "carousel-item-5",          imageSrc: "http://img.b2bpic.net/free-photo/stylish-male-client-getting-haircut-barbershop_23-2148782352.jpg",          imageAlt: "Client enjoying a haircut"},
         {
-          id: "carousel-item-6",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-hands-washing-broccoli_23-2149722311.jpg",          imageAlt: "Modern bathroom plumbing fixtures"},
+          id: "carousel-item-6",          imageSrc: "http://img.b2bpic.net/free-photo/male-barber-stylish-apron-glasses-looking-camera_141793-71816.jpg",          imageAlt: "Clean and modern barbershop interior"},
       ]}
     />
   </div>
@@ -84,18 +84,18 @@ export default function LandingPage() {
   <div id="about" data-section="about">
       <MetricSplitMediaAbout
       useInvertedBackground={false}
-      title="Over 20 Years of Trusted Local Plumbing"
+      title="Crafting Styles for Over 20 Years in Westside"
-      description="At Westside Plumbing & Rooter, we pride ourselves on delivering top-quality plumbing and rooter services across the Westside. Our experienced technicians are dedicated to providing fast, reliable, and affordable solutions for residential and commercial clients."
+      description="Westside Barbershop is more than just a place for a haircut; it's a community staple where tradition meets modern style. Our master barbers are dedicated to providing precision cuts, classic shaves, and an unparalleled grooming experience for every client."
       metrics={[
         {
-          value: "20+",          title: "Years of Experience"},
+          value: "20+",          title: "Years of Expertise"},
         {
-          value: "10K+",          title: "Projects Completed"},
+          value: "5K+",          title: "Satisfied Clients"},
         {
-          value: "5-Star",          title: "Average Rating"},
+          value: "Master Barbers",          title: "Highly Skilled Team"},
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/pleased-young-male-builder-wearing-uniform-safety-helmet-showing-two-pink_141793-74761.jpg"
+      imageSrc="http://img.b2bpic.net/free-photo/barber-shaving-customer-beard_23-2148906644.jpg?_wi=2"
-      imageAlt="Experienced plumber giving a thumbs up"
+      imageAlt="Barber giving a classic shave"
       mediaAnimation="slide-up"
       metricsAnimation="slide-up"
     />
@@ -108,32 +108,32 @@ export default function LandingPage() {
       useInvertedBackground={true}
       features={[
         {
-          id: "drain-cleaning",          label: "Drain Cleaning",          title: "Clog-Free Drains Guaranteed",          items: [
+          id: "haircuts",          label: "Haircuts",          title: "Precision Haircuts & Styling",          items: [
-            "Advanced Rooter Technology",            "Sewer Line Clearing",            "Video Camera Inspections"],
+            "Classic & Modern Cuts",            "Fades & Tapers",            "Consultation & Style Advice"],
           buttons: [
             {
               text: "Learn More",              href: "#contact"},
           ],
         },
         {
-          id: "water-heater",          label: "Water Heater Services",          title: "Hot Water When You Need It",          items: [
+          id: "beard-grooming",          label: "Beard Grooming",          title: "Expert Beard Trims & Styling",          items: [
-            "Installation & Replacement",            "Repair & Maintenance",            "Tankless Water Heater Experts"],
+            "Beard Shaping & Trim",            "Hot Towel Treatment",            "Beard Oil Application"],
           buttons: [
             {
               text: "Learn More",              href: "#contact"},
           ],
         },
         {
-          id: "leak-detection",          label: "Leak Detection & Repair",          title: "Stop Leaks Before They Cost You",          items: [
+          id: "hot-shaves",          label: "Hot Shaves",          title: "Luxurious Hot Towel Shaves",          items: [
-            "Precise Electronic Detection",            "Slab Leak Repair",            "Pipe Repair & Repiping"],
+            "Traditional Razor Shave",            "Pre-Shave Prep & Post-Shave Balm",            "Relaxing Experience"],
           buttons: [
             {
               text: "Learn More",              href: "#contact"},
           ],
         },
       ]}
-      title="Our Comprehensive Plumbing & Rooter Services"
+      title="Our Premium Barbershop Services"
-      description="From routine maintenance to emergency interventions, we offer a full spectrum of services to keep your plumbing system in perfect working order."
+      description="From classic cuts to modern styles, beard grooming, and luxurious hot shaves, we offer a full range of services to refine your look."
     />
   </div>
 
@@ -144,31 +144,31 @@ export default function LandingPage() {
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "1",          name: "Sarah Johnson",          role: "Homeowner",          company: "Westside Resident",          rating: 5,
+          id: "1",          name: "Alex M.",          role: "Regular Client",          company: "Westside Local",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/modern-successful-senior-woman-holding-gadget_1262-5251.jpg",          imageAlt: "Sarah Johnson, a happy Westside homeowner"},
+          imageSrc: "http://img.b2bpic.net/free-photo/handsome-young-bearded-man-barber-shop_23-2149591965.jpg",          imageAlt: "Alex M., a regular client"},
         {
-          id: "2",          name: "Michael Chen",          role: "Small Business Owner",          company: "Local Cafe",          rating: 5,
+          id: "2",          name: "Ben L.",          role: "Entrepreneur",          company: "Tech Startup",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-tattooed-people_23-2149667347.jpg",          imageAlt: "Michael Chen, owner of a local cafe"},
+          imageSrc: "http://img.b2bpic.net/free-photo/guy-with-perfect-hairstyle-looking-away_171337-14282.jpg",          imageAlt: "Ben L., an entrepreneur"},
         {
-          id: "3",          name: "Emily Rodriguez",          role: "Property Manager",          company: "Westside Properties Inc.",          rating: 5,
+          id: "3",          name: "Chris T.",          role: "Artist",          company: "Local Gallery",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/couple-drinking-looking-each-other_23-2147742601.jpg",          imageAlt: "Emily Rodriguez, Property Manager"},
+          imageSrc: "http://img.b2bpic.net/free-photo/man-looking-mirror-barber-shop_23-2149591942.jpg",          imageAlt: "Chris T., an artist"},
         {
-          id: "4",          name: "David Kim",          role: "Contractor",          company: "Kim Construction",          rating: 5,
+          id: "4",          name: "Daniel P.",          role: "Student",          company: "UCLA",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/serious-beautiful-middle-aged-business-woman_1262-3072.jpg",          imageAlt: "David Kim, local contractor"},
+          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-brunette-girl-denim-jacket-holds-hand-face_176474-12445.jpg",          imageAlt: "Daniel P., a student"},
         {
-          id: "5",          name: "Jessica Lee",          role: "Realtor",          company: "Westside Estates",          rating: 5,
+          id: "5",          name: "Ethan R.",          role: "Professional",          company: "Finance Firm",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-young-handsome-smiling-man-casual-outfit-sitting-table-working-laptop_285396-1831.jpg",          imageAlt: "Jessica Lee, a realtor from Westside Estates"},
+          imageSrc: "http://img.b2bpic.net/free-photo/stylish-man-modern-haircut-barbershop_23-2149791404.jpg",          imageAlt: "Ethan R., a professional"},
       ]}
       kpiItems={[
         {
-          value: "99%",          label: "Customer Satisfaction"},
+          value: "5-Star",          label: "Average Rating"},
         {
-          value: "24/7",          label: "Emergency Availability"},
+          value: "99%",          label: "Client Satisfaction"},
         {
-          value: "Fast",          label: "Response Time"},
+          value: "Stylish",          label: "Transformations Daily"},
       ]}
-      title="What Our Happy Customers Say"
+      title="What Our Clients Say About Their Westside Barbershop Experience"
-      description="Hear directly from Westside residents and businesses who trust us with their plumbing and rooter needs."
+      description="Hear from gentlemen who leave our chairs feeling confident and looking their best."
     />
   </div>
 
@@ -179,14 +179,14 @@ export default function LandingPage() {
       useInvertedBackground={true}
       metrics={[
         {
-          id: "years-in-business",          value: "20+",          title: "Years in Business",          description: "Decades of experience serving the Westside community with dedication.",          imageSrc: "http://img.b2bpic.net/free-photo/desk-with-boss-day-calendar_23-2148636860.jpg",          imageAlt: "Calendar with years of experience"},
+          id: "years-crafting-styles",          value: "20+",          title: "Years Crafting Styles",          description: "Over two decades of dedication to the art of barbering.",          imageSrc: "http://img.b2bpic.net/free-photo/male-hairdresser-stylish-black-apron-gloves-holding-barber-scissors_176474-12499.jpg",          imageAlt: "Barber holding scissors and comb"},
         {
-          id: "completed-projects",          value: "10,000+",          title: "Completed Projects",          description: "Successfully resolved plumbing issues for thousands of satisfied clients.",          imageSrc: "http://img.b2bpic.net/free-photo/small-business-staff-members-organizing-shipments-checking-stock_482257-131423.jpg",          imageAlt: "Completed projects list"},
+          id: "happy-clients",          value: "5,000+",          title: "Happy Clients",          description: "Thousands of satisfied customers walk out with a fresh look every year.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-pleased-attractive-male-barber-holds-scissors-comb-ready-haircut-guy_273609-3286.jpg",          imageAlt: "Pleased barber with scissors and comb"},
         {
-          id: "certified-plumbers",          value: "Certified",          title: "Expert Plumbers",          description: "Our team consists of highly trained and fully certified plumbing professionals.",          imageSrc: "http://img.b2bpic.net/free-photo/young-female-standing-worker-uniform-looking-sad-front-view_176474-34533.jpg",          imageAlt: "Plumbing certification badge"},
+          id: "master-barbers",          value: "Master",          title: "Master Barbers",          description: "Our team consists of highly trained and fully certified barbering professionals.",          imageSrc: "http://img.b2bpic.net/free-photo/stylish-male-barber-with-trendy-haircut-posing-against-dark-wall-and-looking-away-camera_273609-3386.jpg",          imageAlt: "Stylish male barber"},
       ]}
-      title="Our Commitment to Quality & Service"
+      title="Westside Barbershop by the Numbers"
-      description="Proudly serving the Westside community with dedication and excellence. Our numbers speak for themselves."
+      description="See why our clients trust us for their grooming needs. Quality, experience, and satisfaction are at the heart of what we do."
     />
   </div>
 
@@ -196,14 +196,18 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "faq-1",          title: "What areas do you serve?",          content: "We proudly serve the entire Westside area, including [list specific neighborhoods/cities, e.g., Santa Monica, Venice, Culver City, Beverly Hills] and surrounding communities."},
+          id: "faq-1",          title: "What services do you offer?",          content: "We offer a full range of services including men's haircuts, beard trims, hot shaves, and styling. Check our Services section for more details."},
         {
-          id: "faq-2",          title: "Do you offer emergency plumbing services?",          content: "Yes, we understand that plumbing emergencies don't wait. We offer 24/7 emergency services for urgent repairs like burst pipes, major leaks, and severe clogs."},
+          id: "faq-2",          title: "How can I book an appointment?",          content: "You can book an appointment directly through our website using the online booking system in the Contact section, or by calling us at (555) 123-4567 during business hours."},
         {
-          id: "faq-3",          title: "How much does your service cost?",          content: "Our pricing varies depending on the type and complexity of the service. We provide transparent, upfront pricing with no hidden fees after a thorough assessment. Contact us for a free estimate!"},
+          id: "faq-3",          title: "Do you accept walk-ins?",          content: "While appointments are recommended to ensure availability, we do accept walk-ins based on our schedule. Feel free to call ahead to check current wait times."},
+        {
+          id: "faq-4",          title: "What are your operating hours?",          content: "We are open Tuesday to Saturday, from 9:00 AM to 7:00 PM. Closed on Sundays and Mondays."},
+        {
+          id: "faq-5",          title: "Where are you located?",          content: "Westside Barbershop is located at 123 Main Street, Westside, CA. We look forward to seeing you!"},
       ]}
-      title="Frequently Asked Questions"
+      title="Your Questions, Answered"
-      description="Find quick answers to common questions about our plumbing and rooter services."
+      description="Find quick answers to common questions about Westside Barbershop's services, appointments, and policies."
       faqsAnimation="slide-up"
     />
   </div>
@@ -213,9 +217,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       names={[
-        "Westside Builders Alliance",        "Property Management Solutions",        "AquaTech Fixtures",        "Community Homeowners Group",        "Commercial Contractors Inc.",        "Green Living Initiatives",        "SafeHome Insurance"]}
+        "Westside Community Collective",        "Local Business Network",        "Style & Grooming Co.",        "Barber's Guild West",        "Fresh Cuts Magazine",        "Urban Style Blog",        "Gentlemen's Choice Products"]}
-      title="Trusted by Westside Homes & Businesses"
+      title="Trusted by the Westside Community"
-      description="We're proud to serve a diverse range of residential and commercial clients and partner with leading brands in plumbing fixtures and local associations."
+      description="Proudly serving a diverse clientele and partnering with local businesses and style brands."
     />
   </div>
 
@@ -224,11 +228,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       background={{
         variant: "sparkles-gradient"}}
-      tag="Contact Us"
+      tag="Book Your Style"
-      title="Need Expert Plumbing Service? Call Westside Today!"
+      title="Ready for a Fresh Look? Contact Westside Barbershop!"
-      description="Fill out the form below or call us directly to schedule service or get a free estimate. We are here to help 24/7."
+      description="Visit us at 123 Main Street, Westside, CA. Call us at (555) 123-4567 for appointments or emergencies. Book your next haircut or shave online below. We are here to help you look your best!"
-      imageSrc="http://img.b2bpic.net/free-photo/plumber-checking-pipes_23-2150392301.jpg"
+      imageSrc="http://img.b2bpic.net/free-photo/handsome-young-barber-wearing-stylish-apron-standing-next-red-leather-chair_141793-71822.jpg?_wi=2"
-      imageAlt="Plumber checking pipes"
+      imageAlt="Barber standing in barbershop"
       mediaPosition="right"
       inputPlaceholder="Your Email"
       buttonText="Send Message"
@@ -239,8 +243,8 @@ export default function LandingPage() {
 
   <div id="footer" data-section="footer">
       <FooterLogoEmphasis
-      logoSrc="http://img.b2bpic.net/free-vector/monocolor-minimalist-total-plumbing-logo-template_742173-19081.jpg"
+      logoSrc="http://img.b2bpic.net/free-vector/barbershop-logo-template_23-2149303358.jpg"
-      logoAlt="Westside Plumbing & Rooter Logo"
+      logoAlt="Westside Barbershop Logo"
       columns={[
         {
           items: [
@@ -255,7 +259,7 @@ export default function LandingPage() {
         {
           items: [
             {
-              label: "Testimonials",              href: "#testimonials"},
+              label: "Booking",              href: "#contact"},
             {
               label: "FAQ",              href: "#faq"},
             {
@@ -271,7 +275,7 @@ export default function LandingPage() {
           ],
         },
       ]}
-      logoText="Westside Plumbing & Rooter"
+      logoText="Westside Barbershop"
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
+  --background: #f5f4f0;
-  --card: #f9f9f9;
+  --card: #ffffff;
-  --foreground: #120a00e6;
+  --foreground: #1a1a1a;
-  --primary-cta: #E34400;
+  --primary-cta: #2c2c2c;
-  --primary-cta-text: #ffffff;
+  --primary-cta-text: #f5f4f0;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #f5f4f0;
-  --secondary-cta-text: #120a00e6;
+  --secondary-cta-text: #1a1a1a;
-  --accent: #e2e2e2;
+  --accent: #8a8a8a;
-  --background-accent: #E34400;
+  --background-accent: #e8e6e1;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);