Update src/app/styles/variables.css

Merge version_2 into main

src/app/page.tsx

@@ -8,7 +8,7 @@ import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import FeatureBento from '@/components/sections/feature/FeatureBento';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import { Award, CheckCircle, Heart, MapPin, Shield, Sparkles, Star, Users, Zap, Phone, MessageCircle } from 'lucide-react';
 
@@ -192,7 +192,8 @@ export default function LandingPage() {
       </div>
 
       <div id="contact" data-section="contact">
-        <ContactSplitForm
+        <ContactSplit
+          tag="Location & Contact"
           title="Visit Our Location"
           description="Unit 12, First Floor, Al Barsha Mall, 23rd Street, Al Barsha 2, Dubai — Beside Al Barsha Pond Park. We're open to welcome you with authentic Japanese hospitality."
           mediaPosition="left"
@@ -200,21 +201,11 @@ export default function LandingPage() {
           useInvertedBackground={false}
           imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AT21DDEbCUKElwIvjwYyyd5jJX/uploaded-1773735263329-p8fqropj.jpg"
           imageAlt="Ginza Beauty Salon Location"
-          inputs={[
+          background={{ variant: "plain" }}
-            {
+          tagIcon={MapPin}
-              name: "name",              type: "text",              placeholder: "Your Name",              required: true
+          tagAnimation="slide-up"
-            },
+          buttonText="Get In Touch"
-            {
+          onSubmit={() => {}}
-              name: "phone",              type: "tel",              placeholder: "Your Phone Number",              required: true
-            }
-          ]}
-          buttonText="Get Appointment Info"
-          onSubmit={(data) => {
-            const phone = data.phone.replace(/\D/g, '');
-            const name = encodeURIComponent(data.name);
-            const message = encodeURIComponent(`Hi! I'm ${data.name} and I'd like to book an appointment at Ginza Beauty.`);
-            window.open(`https://wa.me/971434071171?text=${message}`, '_blank');
-          }}
         />
       </div>
 

src/app/styles/variables.css

@@ -13,12 +13,12 @@
   --background: #fffafa;
   --card: #fff7f7;
   --foreground: #1a0000;
-  --primary-cta: #e63946;
+  --primary-cta: #ebb4ba;
   --primary-cta-text: #fffafa;
   --secondary-cta: #ffffff;
   --secondary-cta-text: #1a0000;
-  --accent: #f5c4c7;
+  --accent: #ebb4ba;
-  --background-accent: #f09199;
+  --background-accent: #ebb4ba;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);