OK
This commit is contained in:
		@@ -13,7 +13,8 @@ import { useCallback, useLayoutEffect, useRef, useState } from 'react'
 | 
			
		||||
import useMeasure from 'react-use-measure'
 | 
			
		||||
import { Container } from './Container'
 | 
			
		||||
import { Link } from './link'
 | 
			
		||||
import { Heading, Subheading } from './text'
 | 
			
		||||
import { Heading, Subheading, H2, P, PS, H3} from './text'
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
const testimonials = [
 | 
			
		||||
  {
 | 
			
		||||
@@ -100,7 +101,7 @@ function TestimonialCard({
 | 
			
		||||
      ref={ref}
 | 
			
		||||
      style={{ opacity }}
 | 
			
		||||
      {...props}
 | 
			
		||||
      className="w-72 shrink-0 snap-start scroll-ml-(--scroll-padding) bg-[#fffefa] rounded-3xl shadow-lg overflow-hidden sm:w-80 lg:w-96"
 | 
			
		||||
      className="w-72 shrink-0 snap-start scroll-ml-(--scroll-padding) bg-transparent shadow-sm overflow-hidden sm:w-80 lg:w-96"
 | 
			
		||||
    >
 | 
			
		||||
      {/* Image Section */}
 | 
			
		||||
      <div className="relative aspect-square overflow-hidden">
 | 
			
		||||
@@ -112,16 +113,16 @@ function TestimonialCard({
 | 
			
		||||
      </div>
 | 
			
		||||
      
 | 
			
		||||
      {/* Content Section Below Image */}
 | 
			
		||||
      <div className="p-6">
 | 
			
		||||
      <div className="py-2">
 | 
			
		||||
        <blockquote>
 | 
			
		||||
          <p className="text-2xl font-bold text-darkgr lg:text-3xl">
 | 
			
		||||
          <H3 className="">
 | 
			
		||||
            {children}
 | 
			
		||||
          </p>
 | 
			
		||||
          </H3>
 | 
			
		||||
        </blockquote>
 | 
			
		||||
        
 | 
			
		||||
        <p className="mt-2 lg:text-base text-sm text-gray-600 leading-6">
 | 
			
		||||
        <PS className="mt-2 lg:text-base text-sm text-gray-600 leading-6">
 | 
			
		||||
          {subtitle}
 | 
			
		||||
        </p>
 | 
			
		||||
        </PS>
 | 
			
		||||
        
 | 
			
		||||
        <Link
 | 
			
		||||
          href={href}
 | 
			
		||||
@@ -154,17 +155,17 @@ export function Boat() {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  return (
 | 
			
		||||
    <div className="pt-16 lg:pt-24 pb-12">
 | 
			
		||||
    <div className="pt-12 pb-12 bg-bg-sand">
 | 
			
		||||
      <Container>
 | 
			
		||||
        <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="font-display mt-2 text-3xl font-semibold tracking-[-0.05em] text-darkgr-700 lg:text-4xl">
 | 
			
		||||
            <H2 className="mt-2">
 | 
			
		||||
              Dahabiyas
 | 
			
		||||
            </h2>
 | 
			
		||||
            <p className="mt-4 text-xl/5 font-medium tracking-[-0.045em] lg:tracking-[-0.02em] leading-[1.3] lg:leading-[1.4] lg:text-2xl text-darkgr">
 | 
			
		||||
              Discover peaceful platforms where every detail ensures a truly memorable stay. 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. 
 | 
			
		||||
            </p>
 | 
			
		||||
            </H2>
 | 
			
		||||
            <PS className="mt-4">
 | 
			
		||||
              Discover peaceful platforms where every detail ensures a truly memorable stay.
 | 
			
		||||
            </PS>
 | 
			
		||||
          </div>
 | 
			
		||||
          
 | 
			
		||||
          {/* Carousel - Right Side */}
 | 
			
		||||
 
 | 
			
		||||
@@ -9,7 +9,7 @@ export function CallToAction() {
 | 
			
		||||
  return (
 | 
			
		||||
    <section
 | 
			
		||||
      id="about"
 | 
			
		||||
      className="relative overflow-hidden bg-bg-sand py-12"
 | 
			
		||||
      className="relative overflow-hidden bg-bg-sand py-24"
 | 
			
		||||
    >
 | 
			
		||||
      <Container className="relative">
 | 
			
		||||
        <div className="mx-auto max-w-3xl text-center">
 | 
			
		||||
 
 | 
			
		||||
@@ -1,6 +1,9 @@
 | 
			
		||||
'use client'
 | 
			
		||||
 | 
			
		||||
import { BuildingOffice2Icon, EnvelopeIcon } from '@heroicons/react/24/outline'
 | 
			
		||||
import { Button } from '@/components/Button'
 | 
			
		||||
import { Container } from '@/components/Container'
 | 
			
		||||
import { H2 } from '@/components/text'
 | 
			
		||||
import { useState } from 'react'
 | 
			
		||||
 | 
			
		||||
export function ContactHero() {
 | 
			
		||||
@@ -46,9 +49,9 @@ export function ContactHero() {
 | 
			
		||||
                />
 | 
			
		||||
              </div>
 | 
			
		||||
            </div>
 | 
			
		||||
            <h2 className="text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl">
 | 
			
		||||
            <H2 className="text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl">
 | 
			
		||||
              Get in Touch
 | 
			
		||||
            </h2>
 | 
			
		||||
            </H2>
 | 
			
		||||
            <p className="mt-6 text-lg/8 text-gray-600">
 | 
			
		||||
              At VEDA, we welcome your questions, ideas, and collaborations. Whether you’re curious about our retreats, interested in hosting a private gathering, or exploring partnership opportunities, we’re here to connect. Reach out to us today and let’s create transformative experiences along the timeless Nile.
 | 
			
		||||
            </p>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,6 +1,8 @@
 | 
			
		||||
 | 
			
		||||
import { Button } from '@/components/Button'
 | 
			
		||||
import { Container } from '@/components/Container'
 | 
			
		||||
import { H2 } from '@/components/text'
 | 
			
		||||
import { P } from '@/components/text'
 | 
			
		||||
import Image from 'next/image'
 | 
			
		||||
 | 
			
		||||
export function Hero() {
 | 
			
		||||
@@ -18,18 +20,16 @@ export function Hero() {
 | 
			
		||||
        </div>
 | 
			
		||||
      </div> 
 | 
			
		||||
      <div className="max-w-7xl ml-3 px-6 lg:px-8 mx-0">
 | 
			
		||||
          <h2 className="mt-8 text-2xl font-medium tracking-tight text-bg-darkbrown sm:text-3xl">
 | 
			
		||||
          <H2 className="mt-8">
 | 
			
		||||
            Nile Cruises, Reimagined.
 | 
			
		||||
          </h2>
 | 
			
		||||
          <p className="mt-4 text-lg/8 text-gray-600 font-extralight leading-tight">
 | 
			
		||||
          </H2>
 | 
			
		||||
          <P className="mt-4">
 | 
			
		||||
            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>
 | 
			
		||||
          <button className="mt-4 text-sm lg:text-sm tracking-wide">
 | 
			
		||||
            <Button variant="link" color="darkgr">
 | 
			
		||||
              Learn More
 | 
			
		||||
            </Button>
 | 
			
		||||
          </button>
 | 
			
		||||
          </P>
 | 
			
		||||
          <button className="mt-6 text-sm lg:text-sm tracking-wide" variant="link" color="darkgr">
 | 
			
		||||
            Learn More
 | 
			
		||||
            </button>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
  )
 | 
			
		||||
 
 | 
			
		||||
@@ -5,6 +5,17 @@ import { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react'
 | 
			
		||||
import clsx from 'clsx'
 | 
			
		||||
 | 
			
		||||
import { Container } from '@/components/Container'
 | 
			
		||||
import { PhoneFrame } from '@/components/PhoneFrame'
 | 
			
		||||
import { AppScreen } from '@/components/AppScreen'
 | 
			
		||||
import { H2 } from '@/components/text'
 | 
			
		||||
import logoBbc from '@/images/logos/bbc.svg'
 | 
			
		||||
import logoCbs from '@/images/logos/cbs.svg'
 | 
			
		||||
import logoCnn from '@/images/logos/cnn.svg'
 | 
			
		||||
import logoFastCompany from '@/images/logos/fast-company.svg'
 | 
			
		||||
import logoForbes from '@/images/logos/forbes.svg'
 | 
			
		||||
import logoHuffpost from '@/images/logos/huffpost.svg'
 | 
			
		||||
import logoTechcrunch from '@/images/logos/techcrunch.svg'
 | 
			
		||||
import logoWired from '@/images/logos/wired.svg'
 | 
			
		||||
 | 
			
		||||
const features = [
 | 
			
		||||
  {
 | 
			
		||||
@@ -61,9 +72,9 @@ export function PrimaryFeatures() {
 | 
			
		||||
      />
 | 
			
		||||
      <Container className="relative">
 | 
			
		||||
        <div className="max-w-2xl md:mx-auto md:text-center xl:max-w-none">
 | 
			
		||||
          <h2 className="font-display text-3xl tracking-tight text-white sm:text-4xl md:text-5xl">
 | 
			
		||||
          <H2 className="font-display text-3xl tracking-tight text-white sm:text-4xl md:text-5xl">
 | 
			
		||||
          What makes VEDA different?
 | 
			
		||||
          </h2>
 | 
			
		||||
          </H2>
 | 
			
		||||
          <p className="mt-6 text-lg tracking-tight text-blue-100">
 | 
			
		||||
            Well everything you need if you aren’t that picky about minor
 | 
			
		||||
            details like tax compliance.
 | 
			
		||||
 
 | 
			
		||||
@@ -2,9 +2,8 @@
 | 
			
		||||
 | 
			
		||||
import { useId } from 'react'
 | 
			
		||||
import { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react'
 | 
			
		||||
import clsx from 'clsx'
 | 
			
		||||
import { Button } from '@/components/Button'
 | 
			
		||||
import { Container } from '@/components/Container'
 | 
			
		||||
 | 
			
		||||
import { H2 } from '@/components/text'
 | 
			
		||||
 | 
			
		||||
const features = [
 | 
			
		||||
  {
 | 
			
		||||
@@ -264,10 +263,10 @@ 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="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">
 | 
			
		||||
            VEDA DAHABIYAS
 | 
			
		||||
          </h2>
 | 
			
		||||
          </H2>
 | 
			
		||||
          <p className="mt-6 max-w-3xl text-lg leading-8 text-gray-600">
 | 
			
		||||
            Discover peaceful platforms where every detail ensures a truly memorable stay.
 | 
			
		||||
          </p>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,6 +1,7 @@
 | 
			
		||||
import React from 'react';
 | 
			
		||||
import { Button } from '@/components/Button'
 | 
			
		||||
import { Container } from '@/components/Container'
 | 
			
		||||
import { H2 } from '@/components/text'
 | 
			
		||||
 | 
			
		||||
const people = [
 | 
			
		||||
    {
 | 
			
		||||
@@ -31,7 +32,7 @@ const people = [
 | 
			
		||||
      <div className="bg-creme-600 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="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">OUR PEOPLE</H2>
 | 
			
		||||
            <p className="mt-6 text-lg leading-8 text-gray-600">
 | 
			
		||||
            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>
 | 
			
		||||
 
 | 
			
		||||
@@ -14,6 +14,62 @@ export function Heading({ as: Component = 'h1', className, children, ...props })
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function H2({ className, children, ...props }) {
 | 
			
		||||
  return (
 | 
			
		||||
    <h2
 | 
			
		||||
      className={clsx(
 | 
			
		||||
        'mt-8 text-2xl font-medium tracking-tight text-bg-darkbrown sm:text-3xl',
 | 
			
		||||
        className
 | 
			
		||||
      )}
 | 
			
		||||
      {...props}
 | 
			
		||||
    >
 | 
			
		||||
      {children}
 | 
			
		||||
    </h2>
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function H3({ className, children, ...props }) {
 | 
			
		||||
  return (
 | 
			
		||||
    <h2
 | 
			
		||||
      className={clsx(
 | 
			
		||||
        'mt-8 text-xl font-medium tracking-tight text-bg-darkbrown sm:text-2xl',
 | 
			
		||||
        className
 | 
			
		||||
      )}
 | 
			
		||||
      {...props}
 | 
			
		||||
    >
 | 
			
		||||
      {children}
 | 
			
		||||
    </h2>
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function P({ className, children, ...props }) {
 | 
			
		||||
  return (
 | 
			
		||||
    <p
 | 
			
		||||
      className={clsx(
 | 
			
		||||
        'mt-4 text-lg/8 text-gray-700 font-extralight leading-tight',
 | 
			
		||||
        className
 | 
			
		||||
      )}
 | 
			
		||||
      {...props}
 | 
			
		||||
    >
 | 
			
		||||
      {children}
 | 
			
		||||
    </p>
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function PS({ className, children, ...props }) {
 | 
			
		||||
  return (
 | 
			
		||||
    <p
 | 
			
		||||
      className={clsx(
 | 
			
		||||
        'mt-4 text-base text-gray-700 font-extralight leading-snug',
 | 
			
		||||
        className
 | 
			
		||||
      )}
 | 
			
		||||
      {...props}
 | 
			
		||||
    >
 | 
			
		||||
      {children}
 | 
			
		||||
    </p>
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function Subheading({ className, children, ...props }) {
 | 
			
		||||
  return (
 | 
			
		||||
    <h3
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user