ok

src/components/Button.jsx

@@ -34,6 +34,8 @@ const variantStyles = {
       'text-slate-900 hover:text-slate-700 focus-visible:outline-gold-600 border-b border-slate-900 hover:border-slate-700',
     white:
       'text-white hover:text-slate-300 focus-visible:outline-white border-b border-white hover:border-slate-300',
+    darkgr:
+      'text-darkgr-900 hover:text-darkgr-700 focus-visible:outline-darkgr-600 border-b border-darkgr-900 hover:border-darkgr-700',
   },
 }
 

src/components/CallToAction.jsx

@@ -9,25 +9,14 @@ export function CallToAction() {
   return (
     <section
       id="about"
-      className="relative overflow-hidden bg-bg-stone py-12"
+      className="relative overflow-hidden bg-bg-sand py-12"
     >
-      <img
-        className="absolute left-1/2 top-1/2 max-w-none -translate-x-1/2 -translate-y-1/2"
-        src="./images/daha1.jpg"
-        alt=""
-        width={2347}
-        height={1244}
-       
-      />
       <Container className="relative">
         <div className="mx-auto max-w-3xl text-center">
-        <div className="flex items-center justify-center">
-          <Logo className="h-18 w-auto mt-6" />
-        </div>
-          <h2 className="font-display lg:text-3xl text-xl tracking-tight text-white pt-4 lg:pt-6">
+          <h2 className="lg:text-2xl font-light text-xl tracking-tight text-bg-darkbrown pt-4 lg:pt-6">
           VEDA provides an unparalleled cruise experience on the Nile, blending authenticity with sophistication. Enjoy private journeys featuring organic cuisine, hollistic activities, and a dedicated, warm-hearted crew. 
           </h2>
-          <p className="mt-4 text-xl lg:text-2xl italic tracking-tight text-white pb-6">
+          <p className="mt-4 text-lg lg:text-xl italic tracking-tight text-darkgr-900 pb-6">
           Discover a cruise like no other with us on the Nile.
           </p>
         </div>

src/components/Hero.jsx

@@ -5,7 +5,7 @@ import Image from 'next/image'
 
 export function Hero() {
   return (
-    <div className=" max-w-8xl px-6 lg:px-8 -z-10 -mt-5 mx-0 bg-bg-sand pb-24">
+    <div className=" max-w-8xl px-6 lg:px-8 -z-10 -mt-5 mx-0 bg-bg-sand pb-12">
       {/* Background Image with opacity to show sand background */}
       <div className="relative overflow-hidden">
         <div className="mx-auto max-w-7xl">
@@ -26,7 +26,7 @@ export function Hero() {
             Our organic cuisine, cultural activities and dedicated warm hearted crew will make your veda cruise an unforgettable experience.
           </p>
           <button className="mt-4 text-sm lg:text-sm tracking-wide">
-            <Button variant="link" color="slate">
+            <Button variant="link" color="darkgr">
               Learn More
             </Button>
           </button>