ok

src/components/Boat.jsx

@@ -120,7 +120,7 @@ function TestimonialCard({
           </H4>
         </blockquote>
         
-        <PS className="mt-1 mb-2 text-xs lg:text-sm">
+        <PS className="mb-2 text-xs lg:text-sm">
           {subtitle}
         </PS>
         
@@ -128,7 +128,7 @@ function TestimonialCard({
           href={href}
           variant="link"
           color="darkgr"
-          className="mt-1 text-xs"
+          className="text-xs"
         >
           Learn More
         </Button>
@@ -167,13 +167,13 @@ export function Boat() {
         <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 lg:gap-12 items-start">
           {/* Text Content - Left Side */}
           <div ref={setReferenceWindowRef} className="lg:col-span-4">
-            <H2 className="mt-2">
+            <H2 className="">
               Dahabiyas
             </H2>
-            <PS className="mt-4">
+            <PS className="">
               Discover peaceful platforms where every detail ensures a truly memorable stay.
             </PS  >
-            <PS className="mt-2 mb-6">
+            <PS className="mb-6">
               Our fleet of traditional dahabiyas combines authentic Nile heritage with modern comfort, offering intimate sailing experiences that connect you with Egypt's timeless river culture.
             </PS>
             <Button href="/dahabiyas" variant="link" color="darkgr" className="mt-6">

src/components/Hero.jsx

@@ -20,10 +20,10 @@ export function Hero() {
         </div>
       </div> 
       <div className="max-w-7xl ml-3 px-6 lg:px-8 mx-0">
-          <H2 className="mt-8">
+          <H2 className="">
             Nile Cruises, Reimagined.
           </H2>
-          <P className="mt-4 mb-6">
+          <P className="mb-6">
             Veda welcomes you into her home providing unique wellness cruises blending cultural authentic experiences with unparalleled freedom and privacy.<br/>
             Our organic cuisine, cultural activities and dedicated warm hearted crew will make your veda cruise an unforgettable experience.
           </P>
@@ -34,4 +34,4 @@ export function Hero() {
     </div>
   )
 }
-1
+1

src/components/Route.jsx

@@ -17,7 +17,7 @@ export default function Route() {
           <div className="lg:pr-4 lg:pt-4">
             <div className="mx-auto max-w-2xl lg:mx-0 lg:max-w-lg">
               <H2 className="">Itinerary</H2>
-              <P className="mt-4 ">
+              <P className="">
               By following the natural flow of the Nile river you will discover some of the most sacred places of the world.</P>
               <P className="my-4">All our trips are designed according to your wishes. Your group's tailored itinerary will lead you to the locations and temples which fit your energy.
               </P>

src/components/SecondaryFeatures.jsx

@@ -264,7 +264,7 @@ export function SecondaryFeatures() {
       <Container>
         <div className="mx-auto max-w-3xl md:text-center">
           <H2 className="text-base font-semibold leading-7 text-gold-600">OUR OFFERS</H2>
-          <H2 className="font-display mt-2 text-3xl font-bold tracking-tight text-gray-800 sm:text-4xl">
+          <H2 className="font-display text-3xl font-bold tracking-tight text-gray-800 sm:text-4xl">
             VEDA DAHABIYAS
           </H2>
           <p className="mt-6 max-w-3xl text-lg leading-8 text-gray-200">

src/components/Story.jsx

@@ -9,7 +9,7 @@ export default function Story() {
         <div className="flex items-start justify-end lg:justify-start lg:order-first">
           <img
              alt="New Features"
-              src="/images/story1.png"
+              src="/images/story1.jpg"
             className="w-full max-w-[40rem] rounded-xl shadow-xl ring-1 ring-gray-400/10 object-cover"
             style={{ maxWidth: '40rem', height: 'auto' }}
           />

src/components/Story2.jsx

@@ -1,7 +1,6 @@
 import { SparklesIcon } from '@heroicons/react/20/solid'
-
+import { Button } from './Button'
-const features = [
+import { H2, H3, P, PXS, PS } from './text'
-]
 
 export default function NewFeatures2() {
   return (
@@ -13,7 +12,7 @@ export default function NewFeatures2() {
               <p className="mt-4 text-lg leading-7 font-light text-gray-500">
               Frequencies are the new currency. Our mission is to help you recognize and align with different frequencies, creating a deeply fulfilling life in tune with your soul's gifts. Self-knowledge and self-mastery are the keys to fully opening your heart. By understanding and resonating with these frequencies, you can achieve a life of harmony and fulfillment.
               </p>
-              <p className="mt-4 text-lg leading-7 italic font-normal text-gray-200">
+              <p className="mt-4 text-lg leading-7 italic font-normal text-gray-900">
               Are you ready to step out of your comfort zone and embrace these changes? Can you let the new energies flow through you and break free from outdated programs to welcome new wisdom?
               </p>
               <p className="mt-4 text-lg leading-7 font-light text-gray-500">
@@ -26,7 +25,7 @@ export default function NewFeatures2() {
           <div className="flex items-start justify-end lg:justify-start lg:order-last">
               <img
               alt="New Features"
-             src="/images/story2.png"
+             src="/images/story2.jpg"
              className="w-full max-w-[35rem] rounded-xl shadow-xl ring-1 ring-gray-400/10 object-cover"
              style={{ height: 'auto' }}
             />

src/components/Team.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Button } from '@/components/Button'
 import { Container } from '@/components/Container'
-import { H2 } from '@/components/text'
+import { H2, PS, PXS, H3, H4 } from '@/components/text'
 
 const people = [
     {
@@ -32,10 +32,10 @@ const people = [
       <div className="bg-bg-sand py-12 md:py-32 lg:py-12">
         <div className="mx-auto grid max-w-7xl grid-cols-1 gap-x-8 gap-y-20 px-6 lg:px-8 xl:grid-cols-3">
           <div className="mx-auto max-w-2xl lg:mx-0">
-            <H2 className="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">OUR PEOPLE</H2>
+            <H2 className="">Our People</H2>
-            <p className="mt-6 text-lg leading-8 text-gray-200">
+            <PS className="">
             We are a dynamic family of individuals from diverse cultural backgrounds and varied expertise, united by our passion in spirituality and dedication delivering heartfelt and authentic Nile experiences for our guests.
-            </p>
+            </PS>
           </div>
           <ul
             role="list"
@@ -44,27 +44,25 @@ const people = [
             {people.map((person) => (
               <li key={person.name}>
                 <img alt="" src={person.imageUrl} className="aspect-[4/4] w-full rounded-2xl object-cover" />
-                <h3 className="mt-6 text-lg font-semibold leading-8 text-gray-900">{person.name}</h3>
+                <div className="flex items-center gap-x-3 mt-6">
-                <p className="text-base leading-7 text-gray-200">{person.role}</p>
+                  <H3 className="flex-1">{person.name}</H3>
-                <p className="mt-4 text-base leading-7 text-gray-200">{person.bio}</p>
+                  <a href={person.Url} className="text-gray-400 hover:text-gray-500" target='_blank' rel="noopener noreferrer">
-                <p className="mt-2 text-base leading-7 text-gray-200">{person.bio2}</p>
+                    <span className="sr-only">Website</span>
-                <p className="mt-2 text-base leading-7 text-gray-200">{person.bio3}</p>
+                    <svg fill="none" stroke='gray' strokeWidth="3" viewBox="0 0 64 64" width="25" height="25">
-                <ul role="list" className="mt-6 flex gap-x-6">
+                    <path d="M39.93 55.72a24.86 24.86 0 1116.93-23.57 37.24 37.24 0 01-.73 6M37.86 51.1A47 47 0 0732 56.7"></path>
-                  <li>
+                    <path d="M32 7a34.14 34.14 0 0111.57 23 34.07 34.07 0 01.09 4.85M32 7a34.09 34.09 0 00-11.69 25.46c0 16.2 7.28 21 11.66 24.24"></path>
-                    <a href={person.Url} className="text-gray-400 hover:text-gray-500" target='_blank' rel="noopener noreferrer">
+                    <path d="M10.37 19.9L53.75 19.9"></path>
-                      <span className="sr-only">Website</span>
+                    <path d="M32 6.99L32 56.7"></path>
-                      <svg fill="none" stroke='gray' strokeWidth="3" viewBox="0 0 64 64" width="25" height="25">
+                    <path d="M11.05 45.48L37.04 45.48"></path>
-                      <path d="M39.93 55.72a24.86 24.86 0 1116.93-23.57 37.24 37.24 0 01-.73 6M37.86 51.1A47 47 0 0132 56.7"></path>
+                    <path d="M7.14 32.46L56.86 31.85"></path>
-                      <path d="M32 7a34.14 34.14 0 0111.57 23 34.07 34.07 0 01.09 4.85M32 7a34.09 34.09 0 00-11.69 25.46c0 16.2 7.28 21 11.66 24.24"></path>
+                    <path d="M53.57 57L58 52.56l-8-8 4.55-2.91a.38.38 0 00-.12-.7l-15.29-3.58a.39.39 0 00-.46.46L42 53.41a.39.39 0 00.71.13L45.57 49z"></path>
-                      <path d="M10.37 19.9L53.75 19.9"></path>
+                    </svg>
-                      <path d="M32 6.99L32 56.7"></path>
+                  </a>
-                      <path d="M11.05 45.48L37.04 45.48"></path>
+                </div>
-                      <path d="M7.14 32.46L56.86 31.85"></path>
+                <PS className="font-medium">{person.role}</PS>
-                      <path d="M53.57 57L58 52.56l-8-8 4.55-2.91a.38.38 0 00-.12-.7l-15.29-3.58a.39.39 0 00-.46.46L42 53.41a.39.39 0 00.71.13L45.57 49z"></path>
+                <PXS className="mt-4">{person.bio}</PXS>
-                      </svg>
+                <PXS className="mt-2">{person.bio2}</PXS>
-                    </a>
+                <PXS className="mt-2">{person.bio3}</PXS>
-                  </li>
-                </ul>
               </li>
             ))}
           </ul>
@@ -72,4 +70,3 @@ const people = [
       </div>
     )
   }
-  

src/components/Testimonials.jsx

@@ -94,7 +94,7 @@ export function Testimonials() {
           <H2 className="">
             Testimonials
           </H2>
-          <P className="mt-4">
+          <P className="">
           Discover the heartfelt stories of joy, relaxation, and adventure that make VEDA a cherished choice for travelers seeking unique and sophisticated experiences on the Nile.
           </P>
         </div>

src/components/text.jsx

@@ -18,7 +18,7 @@ export function H2({ className, children, ...props }) {
   return (
     <h2
       className={clsx(
-        'font-vollkorn text-2xl font-medium tracking-tight text-bg-darkbrown sm:text-3xl',
+        'mt-8 font-vollkorn text-2xl font-medium tracking-tight text-bg-darkbrown sm:text-3xl',
         className
       )}
       {...props}
@@ -32,7 +32,7 @@ export function H3({ className, children, ...props }) {
   return (
     <h3
       className={clsx(
-        'font-vollkorn text-xl font-medium tracking-tight text-bg-darkbrown lg:text-2xl',
+        'mt-6 font-vollkorn text-xl font-medium tracking-tight text-bg-darkbrown lg:text-2xl',
         className
       )}
       {...props}
@@ -46,7 +46,7 @@ export function H4({ className, children, ...props }) {
   return (
     <h4
       className={clsx(
-        'font-vollkorn text-base font-medium tracking-tight text-bg-darkbrown lg:text-lg',
+        'mt-4 font-vollkorn text-base font-medium tracking-tight text-bg-darkbrown lg:text-lg',
         className
       )}
       {...props}
@@ -60,7 +60,7 @@ export function P({ className, children, ...props }) {
   return (
     <p
       className={clsx(
-        'text-lg/8 text-gray-700 font-extralight leading-tight',
+        'mt-4 text-lg/8 text-gray-700 font-extralight leading-tight',
         className
       )}
       {...props}
@@ -88,7 +88,7 @@ export function PXS({ className, children, ...props }) {
   return (
     <p
       className={clsx(
-        'text-base/8 text-gray-700 font-extralight leading-snug',
+        'mt-3 text-base/8 text-gray-700 font-extralight leading-snug',
         className
       )}
       {...props}
@@ -102,7 +102,7 @@ export function PXXS({ className, children, ...props }) {
   return (
     <p
       className={clsx(
-        'text-sm text-gray-700 font-extralight leading-snug',
+        'mt-2 text-sm text-gray-700 font-extralight leading-snug',
         className
       )}
       {...props}
@@ -116,7 +116,7 @@ export function Subheading({ className, children, ...props }) {
   return (
     <h3
       className={clsx(
-        'text-lg font-medium text-gray-900',
+        'mt-6 text-lg font-medium text-gray-900',
         className
       )}
       {...props}