From 49a385d3668bfbdb771f4748418a2923e59f9a8c Mon Sep 17 00:00:00 2001
From: sasha-astiadi <sasha@incubaid.com>
Date: Mon, 28 Jul 2025 13:18:54 +0200
Subject: [PATCH] add faq

---
 src/app/contact/page.tsx          |  33 ++++++
 src/components/ContactHero.tsx    | 164 ++++++++++++++++++++++++++++++
 src/components/Faqs.tsx           |  42 ++++----
 src/components/Header.tsx         |   2 -
 src/components/Header_darkbg.tsx  |   3 +-
 src/components/PersonTemplate.tsx |   6 +-
 src/components/Quote.tsx          |   2 +-
 7 files changed, 224 insertions(+), 28 deletions(-)
 create mode 100644 src/app/contact/page.tsx
 create mode 100644 src/components/ContactHero.tsx

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
new file mode 100644
index 0000000..2fa797f
--- /dev/null
+++ b/src/app/contact/page.tsx
@@ -0,0 +1,33 @@
+import { CallToAction } from '@/components/CallToAction'
+import { Faqs } from '@/components/Faqs'
+import { Footer } from '@/components/Footer'
+import { Header_darkbg } from '@/components/Header_darkbg'
+import { HomeAbout } from '@/components/HomeAbout'
+import { Hero } from '@/components/Hero'
+import { Pricing } from '@/components/Pricing'
+import { PrimaryFeatures } from '@/components/PrimaryFeatures'
+import { SecondaryFeatures } from '@/components/SecondaryFeatures'
+import { Testimonials } from '@/components/Testimonials'
+import { HomePrinciples } from '@/components/HomePrinciples'
+import { HomeMilestones } from '@/components/HomeMilestones'
+import { HomeVentures } from '@/components/HomeVentures'
+import { Quote } from '@/components/Quote'
+import { AboutHero } from '@/components/AboutHero'
+import { AboutMission } from '@/components/AboutMission'
+import { AboutExperience } from '@/components/AboutExperience'
+import { ContactHero } from '@/components/ContactHero'
+
+export default function Contact() {
+  return (
+    <>
+      <Header_darkbg />
+      <main>
+        <ContactHero />
+        <Quote />
+        <CallToAction />
+        <Faqs />
+      </main>
+      <Footer />
+    </>
+  )
+}
diff --git a/src/components/ContactHero.tsx b/src/components/ContactHero.tsx
new file mode 100644
index 0000000..0378c8a
--- /dev/null
+++ b/src/components/ContactHero.tsx
@@ -0,0 +1,164 @@
+import { BuildingOffice2Icon, EnvelopeIcon, PhoneIcon } from '@heroicons/react/24/outline'
+
+export function ContactHero() {
+  return (
+    <div className="relative isolate bg-white">
+      <div className="mx-auto grid max-w-7xl grid-cols-1 lg:grid-cols-2">
+        <div className="relative px-6 pt-24 pb-20 lg:static lg:px-8 lg:py-32">
+          <div className="mx-auto max-w-xl lg:mx-0 lg:max-w-lg">
+            <div className="absolute inset-y-0 left-0 -z-10 w-full overflow-hidden bg-gray-100 ring-1 ring-gray-900/10 lg:w-1/2">
+              <svg
+                aria-hidden="true"
+                className="absolute inset-0 size-full mask-[radial-gradient(100%_100%_at_top_right,white,transparent)] stroke-gray-200"
+              >
+                <defs>
+                  <pattern
+                    x="100%"
+                    y={-1}
+                    id="83fd4e5a-9d52-42fc-97b6-718e5d7ee527"
+                    width={200}
+                    height={200}
+                    patternUnits="userSpaceOnUse"
+                  >
+                    <path d="M130 200V.5M.5 .5H200" fill="none" />
+                  </pattern>
+                </defs>
+                <rect width="100%" height="100%" strokeWidth={0} className="fill-white" />
+                <svg x="100%" y={-1} className="overflow-visible fill-gray-50">
+                  <path d="M-470.5 0h201v201h-201Z" strokeWidth={0} />
+                </svg>
+                <rect fill="url(#83fd4e5a-9d52-42fc-97b6-718e5d7ee527)" width="100%" height="100%" strokeWidth={0} />
+              </svg>
+              <div
+                aria-hidden="true"
+                className="absolute top-[calc(100%-13rem)] -left-56 hidden transform-gpu blur-3xl lg:top-[calc(50%-7rem)] lg:left-[max(-14rem,calc(100%-59rem))]"
+              >
+                <div
+                  style={{
+                    clipPath:
+                      'polygon(74.1% 56.1%, 100% 38.6%, 97.5% 73.3%, 85.5% 100%, 80.7% 98.2%, 72.5% 67.7%, 60.2% 37.8%, 52.4% 32.2%, 47.5% 41.9%, 45.2% 65.8%, 27.5% 23.5%, 0.1% 35.4%, 17.9% 0.1%, 27.6% 23.5%, 76.1% 2.6%, 74.1% 56.1%)',
+                  }}
+                  className="aspect-1155/678 w-288.75 bg-linear-to-br from-[#80caff] to-[#4f46e5] opacity-10"
+                />
+              </div>
+            </div>
+            <h2 className="text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl">
+              Get in Touch
+            </h2>
+            <p className="mt-6 text-lg/8 text-gray-600">
+              At OurWorld, we value your feedback and inquiries. Whether you're interested in our ventures, have questions about our technologies, or want to collaborate, we're here to connect. Reach out to us today and let's build a better digital future together.
+            </p>
+            <dl className="mt-10 space-y-4 text-base/7 text-gray-600">
+              <div className="flex gap-x-4">
+                <dt className="flex-none">
+                  <span className="sr-only">Address</span>
+                  <BuildingOffice2Icon aria-hidden="true" className="h-7 w-6 text-gray-400" />
+                </dt>
+                <dd>
+                  Nexus Global Financial Services Limited,
+                  <br />
+                  Ebene, Mauritius.
+                </dd>
+              </div>
+              <div className="flex gap-x-4">
+                <dt className="flex-none">
+                  <span className="sr-only">Email</span>
+                  <EnvelopeIcon aria-hidden="true" className="h-7 w-6 text-gray-400" />
+                </dt>
+                <dd>
+                  <a href="mailto:hello@example.com" className="hover:text-gray-900">
+                    info@ourworld.tf
+                  </a>
+                </dd>
+              </div>
+            </dl>
+          </div>
+        </div>
+        <form action="#" method="POST" className="px-6 pt-20 pb-24 sm:pb-32 lg:px-8 lg:py-48">
+          <div className="mx-auto max-w-xl lg:mr-0 lg:max-w-lg">
+            <div className="grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2">
+              <div>
+                <label htmlFor="first-name" className="block text-sm/6 font-semibold text-gray-900">
+                  First name
+                </label>
+                <div className="mt-2.5">
+                  <input
+                    id="first-name"
+                    name="first-name"
+                    type="text"
+                    autoComplete="given-name"
+                    className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
+                  />
+                </div>
+              </div>
+              <div>
+                <label htmlFor="last-name" className="block text-sm/6 font-semibold text-gray-900">
+                  Last name
+                </label>
+                <div className="mt-2.5">
+                  <input
+                    id="last-name"
+                    name="last-name"
+                    type="text"
+                    autoComplete="family-name"
+                    className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
+                  />
+                </div>
+              </div>
+              <div className="sm:col-span-2">
+                <label htmlFor="email" className="block text-sm/6 font-semibold text-gray-900">
+                  Email
+                </label>
+                <div className="mt-2.5">
+                  <input
+                    id="email"
+                    name="email"
+                    type="email"
+                    autoComplete="email"
+                    className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
+                  />
+                </div>
+              </div>
+              <div className="sm:col-span-2">
+                <label htmlFor="phone-number" className="block text-sm/6 font-semibold text-gray-900">
+                  Phone number
+                </label>
+                <div className="mt-2.5">
+                  <input
+                    id="phone-number"
+                    name="phone-number"
+                    type="tel"
+                    autoComplete="tel"
+                    className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
+                  />
+                </div>
+              </div>
+              <div className="sm:col-span-2">
+                <label htmlFor="message" className="block text-sm/6 font-semibold text-gray-900">
+                  Message
+                </label>
+                <div className="mt-2.5">
+                  <textarea
+                    id="message"
+                    name="message"
+                    rows={4}
+                    className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
+                    defaultValue={''}
+                  />
+                </div>
+              </div>
+            </div>
+            <div className="mt-8 flex justify-end">
+              <button
+                type="submit"
+                className="rounded-md bg-indigo-600 px-3.5 py-2.5 text-center text-sm font-semibold text-white shadow-xs hover:bg-indigo-500 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
+              >
+                Send message
+              </button>
+            </div>
+          </div>
+        </form>
+      </div>
+    </div>
+  )
+}
diff --git a/src/components/Faqs.tsx b/src/components/Faqs.tsx
index e579354..cc4d66c 100644
--- a/src/components/Faqs.tsx
+++ b/src/components/Faqs.tsx
@@ -6,57 +6,59 @@ import backgroundImage from '@/images/background-faqs.jpg'
 const faqs = [
   [
     {
-      question: 'Does OurWorld handle VAT?',
+      question: 'What is OurWorld?',
       answer:
-        'Well no, but if you move your company offshore you can probably ignore it.',
+        'OurWorld is a venture creator focused on building decentralized digital infrastructure for a more sovereign, inclusive, and regenerative future.',
     },
     {
-      question: 'Can I pay for my subscription via purchase order?',
-      answer: 'Absolutely, we are happy to take your money in all forms.',
+      question: 'Who is OurWorld for?',
+      answer:
+        'We collaborate with entrepreneurs, investors, governments, and changemakers who want to build systems beyond Big Tech and traditional finance.',
     },
     {
-      question: 'How do I apply for a job at OurWorld?',
+      question: 'How does OurWorld support ventures?',
       answer:
-        'We only hire our customers, so subscribe for a minimum of 6 months and then let’s talk.',
+        'We co-create projects by providing capital, strategy, governance, technical infrastructure, and access to a global network of collaborators.',
     },
   ],
   [
     {
-      question: 'What was that testimonial about tax fraud all about?',
+      question: 'What kinds of projects are in the OurWorld ecosystem?',
       answer:
-        'OurWorld is just a software application, ultimately your books are your responsibility.',
+        'Our portfolio includes decentralized cloud (ThreeFold), tokenized economies (TF9), digital jurisdictions (FreeZone), and open education (Sikana).',
     },
     {
-      question:
-        'OurWorld sounds horrible but why do I still feel compelled to purchase?',
+      question: 'Where does OurWorld operate?',
       answer:
-        'This is the power of excellent visual design. You just can’t resist it, no matter how poorly it actually functions.',
+        'We’re active in strategic hubs like Mauritius, Zanzibar, UAE, Belgium, and expanding across Europe, Africa, and the Middle East.',
     },
     {
-      question:
-        'I found other companies called OurWorld, are you sure you can use this name?',
+      question: 'Is this a blockchain company?',
       answer:
-        'Honestly not sure at all. We haven’t actually incorporated or anything, we just thought it sounded cool and made this website.',
+        'We use blockchain when it’s useful, but OurWorld is much broader—it’s about real-world infrastructure and long-term systemic change.',
     },
   ],
   [
     {
-      question: 'How do you generate reports?',
+      question: 'How can I get involved with OurWorld?',
       answer:
-        'You just tell us what data you need a report for, and we get our kids to create beautiful charts for you using only the finest crayons.',
+        'Whether you’re a founder, funder, builder or policymaker—if you resonate with our mission, reach out to start a conversation.',
     },
     {
-      question: 'Can we expect more inventory features?',
-      answer: 'In life it’s really better to never expect anything at all.',
+      question: 'What is the Digital Freezone?',
+      answer:
+        'It’s a sovereign digital jurisdiction enabling remote company creation, tokenized commerce, and flexible digital residency.',
     },
     {
-      question: 'I lost my password, how do I get into my account?',
+      question: 'Where can I learn more or contact the team?',
       answer:
-        'Send us an email and we will send you a copy of our latest password spreadsheet so you can find your information.',
+        'Visit www.ourworld.tf or email us at info@ourworld.tf to explore opportunities and collaborations. Visit www.ourworld.tf/ventures to see our current initiatives.',
     },
   ],
 ]
 
+
+
 export function Faqs() {
   return (
     <section
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index e71ae44..e4c9cb7 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -74,7 +74,6 @@ function MobileNavigation() {
       >
         <MobileNavLink href="/about">About</MobileNavLink>
         <MobileNavLink href="/ventures">Ventures</MobileNavLink>
-        <MobileNavLink href="/News">News</MobileNavLink>
         <hr className="m-2 border-slate-300/40" />
         <MobileNavLink href="/contact">Contact Us</MobileNavLink>
       </PopoverPanel>
@@ -95,7 +94,6 @@ export function Header() {
               <NavLink href="/about">About</NavLink>
               <NavLink href="/ventures">Ventures</NavLink>
               <NavLink href="/people">People</NavLink>
-              <NavLink href="/news">News</NavLink>
             </div>
           </div>
           <div className="flex items-center gap-x-5 md:gap-x-8">
diff --git a/src/components/Header_darkbg.tsx b/src/components/Header_darkbg.tsx
index 5145600..1426fbd 100644
--- a/src/components/Header_darkbg.tsx
+++ b/src/components/Header_darkbg.tsx
@@ -89,7 +89,6 @@ function MobileNavigation() {
       >
         <MobileNavLink href="/about">About</MobileNavLink>
         <MobileNavLink href="/ventures">Ventures</MobileNavLink>
-        <MobileNavLink href="/News">News</MobileNavLink>
         <hr className="m-2 border-white/20" />
         <MobileNavLink href="/contact">Contact Us</MobileNavLink>
       </PopoverPanel>
@@ -117,7 +116,7 @@ export function Header_darkbg() {
               <NavLinkDark href="/about">About</NavLinkDark>
               <NavLinkDark href="/ventures">Ventures</NavLinkDark>
               <NavLinkDark href="/people">People</NavLinkDark>
-              <NavLinkDark href="/news">News</NavLinkDark>
+
             </div>
           </div>
           <div className="flex items-center gap-x-5 md:gap-x-8">
diff --git a/src/components/PersonTemplate.tsx b/src/components/PersonTemplate.tsx
index 65af286..96d4256 100644
--- a/src/components/PersonTemplate.tsx
+++ b/src/components/PersonTemplate.tsx
@@ -45,9 +45,9 @@ export function PersonTemplate({ personData, biography }: PersonTemplateProps) {
                 <img
                   alt={personData.name}
                   src={personData.imageUrl}
-                  width={1184}
-                  height={1376}
-                  className="aspect-12/7 w-full rounded-lg object-cover shadow-lg lg:aspect-auto"
+                  width={592}
+                  height={688}
+                  className="aspect-12/7 w-1/2 mx-auto rounded-lg object-cover shadow-lg lg:aspect-auto"
                 />
               </figure>
             </div>
diff --git a/src/components/Quote.tsx b/src/components/Quote.tsx
index f7e0bcf..16f84f5 100644
--- a/src/components/Quote.tsx
+++ b/src/components/Quote.tsx
@@ -1,6 +1,6 @@
 export function Quote() {
   return (
-    <section className="relative isolate overflow-hidden bg-white px-6 pt-12 pb-32  lg:px-8">
+    <section className="relative isolate overflow-hidden bg-white px-6 pt-24 pb-32 lg:px-8">
       <div className="mx-auto max-w-2xl lg:max-w-4xl">
         <img
           alt=""