fix: deployment issue

app/(website)/_components/CoreServicesSection.tsx

@@ -61,9 +61,9 @@ export const defaultCoreServices: ServiceItem[] = [
   },
   {
     icon: FaProjectDiagram,
-    title: "IT Implementation",
+    title: "Project Management",
     description:
-      "Empowering your business through seamless IT rollouts—delivered on time and on budget. We turn complex systems into powerful solutions that drive transformation, reduce risk, and unlock real results. ",
+      "Expert management ensuring on-time, within-budget delivery with superior results, risk mitigation, and maximum efficiency.",
   },
   {
     icon: FaCode,

app/(website)/_components/HeroSection.tsx

@@ -17,7 +17,7 @@ const HeroSection: React.FC<HeroSectionProps> = ({
   subtitle,
   buttonText,
   buttonHref,
-  imageUrl = "/hero-bg-2.jpg", // Default background image
+  imageUrl = "/hero-bg.jpg", // Default background image
 }) => {
   return (
     <section className="relative h-[70vh] md:h-[85vh] flex items-center justify-center text-center bg-gradient-to-b from-black/10 to-black/40 text-white overflow-hidden">

app/(website)/_components/HeroSectionDynamic.tsx

@@ -17,7 +17,7 @@ const HeroSectionDynamic: React.FC<HeroSectionProps> = ({
   subtitle,
   buttonText,
   buttonHref,
-  imageUrl = "/hero-bg-2.jpg", // Ensure this high-quality image exists
+  imageUrl = "/hero-bg.jpg", // Ensure this high-quality image exists
 }) => {
   return (
     <section className="relative flex items-center bg-background min-h-screen overflow-hidden">

app/(website)/_components/HeroSectionModern.tsx

@@ -17,7 +17,7 @@ const HeroSectionModern: React.FC<HeroSectionProps> = ({
   subtitle,
   buttonText,
   buttonHref,
-  imageUrl = "/hero-bg-2.jpg", // Default background image - MAKE SURE THIS EXISTS
+  imageUrl = "/hero-bg.jpg", // Default background image - MAKE SURE THIS EXISTS
 }) => {
   return (
     // Use min-h-screen for full viewport height adjust if needed

app/(website)/about/page.tsx

@@ -125,8 +125,7 @@ const industryExpertise = [
   {
     icon: FaBriefcase,
     industry: "Retail/E-commerce",
-    details:
+    details: "Describe experience in this sector.",
-      "Experience in building scalable e-commerce platforms, optimizing digital customer journeys, enabling secure payment integrations, and leveraging data analytics to drive personalized shopping experiences and operational efficiency.",
   },
 ];
 
@@ -192,7 +191,7 @@ export default function AboutUsPage() {
             <div className="relative h-64 md:h-80 rounded-lg overflow-hidden shadow-lg">
               {/* Replace with a relevant, high-quality image representing innovation or teamwork */}
               <Image
-                src="/about-2.jpg" // Ensure this image exists in your public folder
+                src="/images/team.svg"
                 alt="Team collaborating on innovative solutions"
                 layout="fill"
                 objectFit="cover"
@@ -242,12 +241,12 @@ export default function AboutUsPage() {
                 style={{ color: "#e1c44a" }}
               />
               <h3 className="text-2xl font-bold mb-4 font-poppins text-gray-900 dark:text-white">
-                Our Purpose
+                Our Mission
               </h3>
               <p className="text-gray-700 dark:text-gray-300 leading-relaxed font-poppins flex-grow">
                 &quot;Our purpose is to help our clients drive transformative
                 growth and innovation to propel their business forward –
-                redefining what&apos;s possible.&quot;
+                redefining whats possible.&quot;
               </p>
             </div>
           </div>
@@ -300,9 +299,10 @@ export default function AboutUsPage() {
                 Deep Domain Knowledge
               </h2>
               <p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed font-poppins">
-                We combine broad technological capabilities with specialized
+                Retail/E-commerce: Experience in building scalable e-commerce
-                expertise across key industries, understanding the unique
+                platforms, optimizing digital customer journeys, enabling secure
-                challenges and opportunities within each sector.
+                payment integrations, and leveraging data analytics to drive
+                personalized shopping experiences and operational efficiency.
               </p>
             </div>
             <div className="lg:col-span-2 grid grid-cols-1 md:grid-cols-2 gap-6">
@@ -324,7 +324,6 @@ export default function AboutUsPage() {
           </div>
         </div>
       </section>
-      
       {/* Section 6: Technology Philosophy */}
       <section className="py-16 md:py-24 bg-gray-800 text-white">
         <div className="container mx-auto px-6 text-center">
@@ -379,8 +378,6 @@ export default function AboutUsPage() {
           </div>
         </div>
       </section>
-
-
       {/* Section 7: Core Values (Reusing previous structure, adjusting background) */}
       <section className="py-16 md:py-24 bg-gray-100 dark:bg-gray-800">
         <div className="container mx-auto px-6">
@@ -408,8 +405,6 @@ export default function AboutUsPage() {
           </div>
         </div>
       </section>
-
-      
       {/* Section 8: The OMS Partnership */}
       <section className="py-16 md:py-24 bg-white dark:bg-gray-900">
         <div className="container mx-auto px-6">
@@ -522,7 +517,7 @@ export default function AboutUsPage() {
           <p className="text-lg md:text-xl max-w-3xl mx-auto leading-relaxed font-poppins text-gray-800">
             Ultimately, our success is measured by yours. We are committed to
             creating solutions that ignite momentum, unlock potential, and turn
-            ambition into achievement,empowering you to rise above challenges
+            ambition into achievement — empowering you to rise above challenges
             and lead with confidence into the future. Together, let&apos;s build
             a future where your success is not just a possibility, but a
             reality.

app/(website)/obse/page.tsx

@@ -2,11 +2,9 @@ import Image from "next/image";
 import Link from "next/link";
 import { Metadata } from "next"; // Added import
 import {
-  FaArrowRight,
   FaCheckCircle,
   FaCogs,
   FaDatabase,
-  FaEnvelope,
   FaExclamationTriangle,
   FaFileAlt,
   FaFileInvoiceDollar,
@@ -16,7 +14,6 @@ import {
   FaLaptopCode,
   FaLayerGroup,
   FaLightbulb,
-  FaPhone,
   FaPlayCircle,
   FaPuzzlePiece,
   FaSearchDollar,
@@ -31,7 +28,7 @@ import {
   FaWrench,
 } from "react-icons/fa";
 import { COLORS } from "@/constants"; // Assuming COLORS constant is available
-import ContactForm from "@/components/ContactForm"; // Assuming ContactForm is available
+// import ContactForm from "@/components/ContactForm"; // Assuming ContactForm is available
 
 // SEO Metadata
 export const metadata: Metadata = {
@@ -110,16 +107,16 @@ const keyFeatures: FeatureItem[] = [
   },
   {
     icon: FaSearchDollar,
-    title: "Intelligent Income Detection",
+    title: "Intelligent Income & Salaried Detection",
     description:
-      "Identifies salaried/non-salaried income, provides explanations, and filters out transfers.",
+      "Accurately detects both salaried and non-salaried income, explains findings, and intelligently filters out internal transfers for clearer financial insights. ",
   },
   {
     icon: FaFingerprint,
     title: "Enhanced Fraud Detection",
     description:
       "Detects document tampering, fraudulent insertions, and developing behavioral profiling.",
-    isComingSoon: true,
+    isComingSoon: false,
   },
   {
     icon: FaSyncAlt,
@@ -245,9 +242,9 @@ export default function ObsePage() {
           {/* <Image src="/oms-logo-white.png" alt="OMS Logo" width={150} height={50} className="mx-auto mb-6" /> */}
           <h1
             className="text-3xl md:text-5xl lg:text-6xl font-bold mb-4 font-poppins drop-shadow-md leading-tight"
-            style={{ color: COLORS.primary }} // Use gold color
+            style={{ color: COLORS.primary }}
           >
-            Revolutionize Your Lending and <br />Credit Processes with OBSE
+            Revolutionize Your Lending and Credit Processes with OBSE
           </h1>
           <p className="text-lg md:text-xl max-w-4xl mx-auto leading-relaxed text-gray-200 dark:text-gray-300 mb-8">
             Automate data extraction, enhance accuracy, detect fraud, and
@@ -324,9 +321,7 @@ export default function ObsePage() {
                 className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md text-center transform transition duration-300 hover:-translate-y-1 hover:shadow-lg"
               >
                 <item.icon
-                  className="text-4xl 0 mx-auto mb-4"
+                  className="text-4xl text-red-500 dark:text-red-400 mx-auto mb-4" // Using red to signify pain points
-                  style={{ color: "#e1c44a" }} // Using red to signify pain points
-                  //text-red-500 dark:text-red-40
                 />
                 <h4 className="text-xl font-semibold mb-2 font-poppins dark:text-white">
                   {item.title}
@@ -472,11 +467,11 @@ export default function ObsePage() {
                 className="relative bg-gray-50 dark:bg-gray-800 p-6 rounded-lg shadow-sm border-t-4 border-gold-500 dark:border-gold-400 transition-shadow hover:shadow-md"
                 style={{ borderColor: COLORS.primary }}
               >
-                {/*feature.isComingSoon && (
+                {feature.isComingSoon && (
                   <span className="absolute top-2 right-2 px-3 py-1 text-sm font-bold bg-cyan-700 text-white rounded-full shadow-lg z-10 font-poppins">
                     Coming Soon
                   </span>
-                )*/}
+                )}
                 <feature.icon
                   className="text-3xl mb-3 text-gold-500 dark:text-gold-400"
                   style={{ color: COLORS.primary }}
@@ -693,10 +688,10 @@ export default function ObsePage() {
         </div>
       </section>
 
-      {/* 11. About OMS Section (Brief) */}
+      {/* 11. About OMS Section (Brief) 
       <section className="py-16 md:py-24 bg-white dark:bg-gray-900">
         <div className="container mx-auto px-6 text-center">
-          {/* Optional: OMS Logo */}
+          { Optional: OMS Logo }
           <h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
             Your Experienced Partner in Financial Technology
           </h2>
@@ -716,6 +711,7 @@ export default function ObsePage() {
           </Link>
         </div>
       </section>
+      /}
 
       {/* 12. Call to Action (CTA) Section */}
       <section
@@ -755,6 +751,7 @@ export default function ObsePage() {
       </section>
 
       {/* 13. Contact Information Section */}
+      {/*}
       <section className="py-16 md:py-24 bg-gray-100 dark:bg-gray-800">
         <div className="container mx-auto px-6">
           <div className="text-center mb-12">
@@ -769,7 +766,10 @@ export default function ObsePage() {
             </p>
           </div>
           <div className="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-8 items-center">
-            {/* Contact Details */}
+            { -----Contact Details */}
+
+      {/* Optional: Add a contact form component here if available ---
+            
             <div className="space-y-6">
               <div className="flex items-center space-x-4">
                 <FaPhone
@@ -798,14 +798,16 @@ export default function ObsePage() {
                     Email
                   </h3>
                   <a
-                    href="mailto:hello@oms.africa" // Updated email  //
+                    href="mailto:Zanelem@oms.africa" // Updated email
                     className="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
                   >
-                    hello@oms.africa
+                    Zanelem@oms.africa
                   </a>
                 </div>
               </div>
-              {/* Optional: Link to main contact page */}
+
+              {--- Optional: Link to main contact page */}
+      {/* --- comment out if not needed}
               <Link
                 href="/contact"
                 className="inline-flex items-center text-gold-600 dark:text-gold-400 hover:text-gold-700 dark:hover:text-gold-300 font-semibold transition-colors duration-300"
@@ -814,6 +816,7 @@ export default function ObsePage() {
                 Go to Full Contact Page <FaArrowRight className="ml-2" />
               </Link>
             </div>
+              */}
 
       {/* Optional: Simple Contact Form (if ContactForm component is not used/available) */}
       {/* <form className="space-y-4">
@@ -834,7 +837,7 @@ export default function ObsePage() {
               </button>
             </form> */}
 
-            {/* OR Use the ContactForm Component */}
+      {/* OR Use the ContactForm Component 
             <div className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md">
               <h3 className="text-xl font-semibold font-poppins text-gray-900 dark:text-white mb-4">
                 Send a Quick Inquiry
@@ -844,6 +847,9 @@ export default function ObsePage() {
           </div>
         </div>
       </section>
+      */}
+
+      {/* 14. Footer Section */}
     </div>
   );
 }

app/(website)/offerings/page.tsx

@@ -1,285 +0,0 @@
-import Image from "next/image";
-import Link from "next/link";
-import { Metadata } from "next";
-import {
-  FaArrowRight,
-  FaBriefcase,
-  FaCogs,
-  FaHandshake,
-  FaLaptopCode,
-  FaProjectDiagram,
-  FaUsers,
-  FaWrench,
-  FaShippingFast,
-} from "react-icons/fa";
-import { COLORS } from "@/constants"; // Assuming COLORS constant is available
-
-// SEO Metadata
-export const metadata: Metadata = {
-  title: "IT Services & Solutions | OMS South Africa",
-  description:
-    "Explore IT services by Owethu Managed Services (OMS): Custom Software Development, IT Resource Augmentation, and the OBSE Bank Statement Extractor. Partner with us for innovative solutions.",
-  keywords: [
-    "IT services South Africa",
-    "custom software development",
-    "IT resource augmentation",
-    "managed IT services",
-    "OBSE",
-    "bank statement automation",
-    "fintech solutions",
-    "IT consulting",
-    "OMS",
-    "Owethu Managed Services",
-    "Centurion",
-    "Gauteng",
-  ],
-  openGraph: {
-    title: "Comprehensive IT Services & Solutions | OMS South Africa",
-    description:
-      "OMS offers tailored IT solutions including custom development, resource augmentation, and specialized products like OBSE.",
-    url: "https://oms.africa/services", // Update with the final URL
-    images: [
-      {
-        url: "/images/oms-services-og.png", // Replace with an appropriate OG image URL
-        width: 1200,
-        height: 630,
-        alt: "OMS IT Services",
-      },
-    ],
-    locale: "en_ZA",
-    type: "website",
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "Comprehensive IT Services & Solutions | OMS South Africa",
-    description:
-      "Partner with OMS for expert IT services, from custom builds to resource scaling.",
-    // images: ['/images/oms-services-twitter.png'], // Replace if needed
-  },
-};
-
-// Data for Service Areas
-const serviceAreas = [
-  {
-    title: "Custom Software Development & Consulting",
-    icon: FaLaptopCode,
-    description:
-      "We design, build, and implement bespoke software solutions tailored to your unique business challenges and objectives. Our consulting services help align technology with your strategic goals.",
-    imageUrl: "/custome-software-3.png", // Reusing image from Custom Software Development
-    //imageUrl: "/images/team.svg", // Reusing image from About
-    link: "/contact?subject=Custom Development Inquiry", // Link to contact or a future dedicated page
-    linkText: "Discuss Your Project",
-  },
-  {
-    title: "IT Resource Augmentation",
-    icon: FaUsers,
-    description:
-      "Scale your team effectively with our flexible resource augmentation model. Access skilled IT professionals (BAs, Testers, Developers, Designers) on demand or via managed milestone-based projects.",
-    imageUrl: "/images/team-collaborative-2.png", // Reusing image from Resource Augmentation
-    link: "/services/resource-augmentation",
-    linkText: "Explore Augmentation",
-  },
-  {
-    title: "OBSE - Bank Statement Extractor",
-    icon: FaShippingFast,
-    description:
-      "Automate bank statement processing with OBSE. Our intelligent OCR solution extracts data accurately and quickly, enhancing efficiency, reducing risk, and speeding up financial assessments.",
-    imageUrl: "/images/obse.svg", // Reusing image from OBSE
-    link: "/obse",
-    linkText: "Learn About OBSE",
-  },
-];
-
-const ourApproachItems = [
-  {
-    icon: FaProjectDiagram,
-    title: "Strategic Alignment",
-    description: "Understanding your goals to ensure solutions deliver value.",
-  },
-  {
-    icon: FaHandshake,
-    title: "Client-Centric Collaboration",
-    description: "Working as true partners, involving you throughout.",
-  },
-  {
-    icon: FaCogs,
-    title: "Agile & Adaptive Delivery",
-    description: "Flexible methodologies for faster, relevant results.",
-  },
-  {
-    icon: FaWrench,
-    title: "Technical Excellence",
-    description: "Building robust, scalable, and maintainable solutions.",
-  },
-];
-
-export default function ServicesPage() {
-  return (
-    <div className="bg-white text-gray-800 overflow-x-hidden dark:bg-gray-900 dark:text-gray-200 font-poppins">
-      {/* 1. Hero Section */}
-      <section className="relative bg-gradient-to-r from-gray-800 via-gray-700 to-gray-900 text-white py-20 md:py-32">
-        <div className="absolute inset-0 bg-black opacity-50 dark:opacity-70"></div>
-        <div className="container mx-auto px-6 text-center relative z-10">
-          <h1
-            className="text-3xl md:text-5xl lg:text-6xl font-bold mb-4 font-poppins drop-shadow-md"
-            style={{ color: COLORS.primary }}
-          >
-            Tailored IT Services & Solutions
-          </h1>
-          <p className="text-lg md:text-xl max-w-4xl mx-auto leading-relaxed text-gray-200 dark:text-gray-300 mb-8">
-            Owethu Managed Services empowers businesses through innovative
-            technology solutions, strategic consulting, flexible resource
-            augmentation, and specialized product offerings.
-          </p>
-          <Link
-            href="#core-services"
-            className="inline-flex items-center justify-center bg-gold-500 text-gray-900 font-bold py-3 px-8 rounded-md hover:bg-gold-600 transition-colors duration-300"
-            style={{ backgroundColor: COLORS.primary }}
-          >
-            Explore Our Services <FaArrowRight className="ml-2" />
-          </Link>
-        </div>
-      </section>
-
-      {/* 2. Core Service Areas Section */}
-      <section
-        id="core-services"
-        className="py-16 md:py-24 bg-white dark:bg-gray-900"
-      >
-        <div className="container mx-auto px-6">
-          <div className="text-center mb-12 md:mb-16">
-            <h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
-              Our Expertise, Your Advantage
-            </h2>
-            <p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
-              We offer a comprehensive suite of services designed to address
-              your specific IT needs and drive business growth.
-            </p>
-          </div>
-          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-            {serviceAreas.map((service) => (
-              <div
-                key={service.title}
-                className="flex flex-col bg-gray-50 dark:bg-gray-800 rounded-lg shadow-md overflow-hidden transform transition duration-300 hover:shadow-xl hover:-translate-y-1"
-              >
-                <div className="relative h-48 w-full">
-                  <Image
-                    src={service.imageUrl}
-                    alt={`${service.title} illustration`}
-                    layout="fill"
-                    objectFit="contain" // Changed to contain for SVG/Illustrations
-                    className="p-4 bg-gray-100 dark:bg-gray-700 z-10" // Added padding and bg
-                  />
-                </div>
-                <div className="p-6 flex flex-col flex-grow">
-                  <div className="flex items-center mb-3">
-                    <service.icon
-                      className="text-2xl mr-3 flex-shrink-0"
-                      style={{ color: COLORS.primary }}
-                    />
-                    <h3 className="text-xl font-semibold font-poppins text-gray-900 dark:text-white">
-                      {service.title}
-                    </h3>
-                  </div>
-                  <p className="text-gray-600 dark:text-gray-300 text-sm mb-4 flex-grow">
-                    {service.description}
-                  </p>
-                  <Link
-                    href={service.link}
-                    className="inline-flex items-center mt-auto text-gold-600 dark:text-gold-400 hover:text-gold-700 dark:hover:text-gold-300 font-semibold transition-colors duration-300 text-sm"
-                    style={{ color: COLORS.primary }}
-                  >
-                    {service.linkText} <FaArrowRight className="ml-2" />
-                  </Link>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-      </section>
-
-      {/* 3. Our Approach Section */}
-      <section className="py-16 md:py-24 bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-800 dark:to-gray-700">
-        <div className="container mx-auto px-6">
-          <div className="text-center mb-14">
-            <h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
-              How We Deliver Excellence
-            </h2>
-            <p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto font-poppins">
-              Our methodology ensures collaboration, precision, and impactful
-              results tailored to your project needs.
-            </p>
-          </div>
-          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
-            {ourApproachItems.map((item) => (
-              <div
-                key={item.title}
-                className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md text-center transform transition duration-300 hover:-translate-y-2 hover:shadow-xl dark:hover:shadow-gold-500/20"
-              >
-                <item.icon
-                  className="text-4xl text-gold-500 mx-auto mb-5"
-                  style={{ color: COLORS.primary }}
-                />
-                <h4 className="text-xl font-semibold mb-3 font-poppins dark:text-white">
-                  {item.title}
-                </h4>
-                <p className="text-gray-600 dark:text-gray-300 font-poppins text-sm leading-relaxed">
-                  {item.description}
-                </p>
-              </div>
-            ))}
-          </div>
-        </div>
-      </section>
-
-      {/* 4. Industry Expertise Snippet (Optional) */}
-      <section className="py-16 md:py-24 bg-white dark:bg-gray-900">
-        <div className="container mx-auto px-6 text-center">
-          <FaBriefcase
-            className="text-5xl text-gold-500 mx-auto mb-4"
-            style={{ color: COLORS.primary }}
-          />
-          <h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
-            Serving Diverse Industries
-          </h2>
-          <p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto mb-8">
-            We apply our technical expertise across various sectors,
-            understanding the unique challenges and opportunities within each.
-            Key areas include Financial Services, Automotive, Technology, and
-            more.
-          </p>
-          <Link
-            href="/about#industry-expertise" // Assuming you add an ID to the section in about page
-            className="text-gold-600 dark:text-gold-400 hover:text-gold-700 dark:hover:text-gold-300 font-semibold transition-colors duration-300 inline-flex items-center"
-            style={{ color: COLORS.primary }}
-          >
-            Learn More About Our Industry Focus{" "}
-            <FaArrowRight className="ml-2" />
-          </Link>
-        </div>
-      </section>
-
-      {/* 5. Call to Action (CTA) Section */}
-      <section
-        className="py-16 md:py-24 bg-gold-500 text-gray-900"
-        style={{ backgroundColor: COLORS.primary }}
-      >
-        <div className="container mx-auto px-6 text-center">
-          <h2 className="text-3xl md:text-4xl font-bold mb-4 font-poppins">
-            Let&apos;s Build Your Solution
-          </h2>
-          <p className="text-lg md:text-xl max-w-3xl mx-auto leading-relaxed mb-8 font-poppins text-gray-800">
-            Ready to discuss how OMS can help you achieve your technology goals?
-            Contact us today for a consultation.
-          </p>
-          <Link
-            href="/contact"
-            className="inline-block bg-gray-800 text-white font-bold py-3 px-8 rounded-md hover:bg-gray-900 dark:bg-gray-900 dark:hover:bg-black transition-colors duration-300"
-          >
-            Get in Touch
-          </Link>
-        </div>
-      </section>
-    </div>
-  );
-}

app/(website)/page.tsx

@@ -39,10 +39,9 @@ export default async function HomePage() {
         buttonText={data.hero_buttons?.[0]?.label || "Learn More"} // Use optional chaining and provide a default
         buttonHref={data.hero_buttons?.[0]?.link || "/about"} // Use optional chaining and provide a default
         imageUrl={
-          // data.hero_cover
+          data.hero_cover
-           // ? `${process.env.DIRECTUS_API_ENDPOINT}/assets/${data.hero_cover}`
+            ? `${process.env.DIRECTUS_API_ENDPOINT}/assets/${data.hero_cover}`
-           // : "/hero-bg-2.jpg"
+            : "/hero-bg.jpg"
-            "/banner-1.jpeg"
         } // Use optional chaining and provide a default
       />
       <CoreServicesSection

app/(website)/services/product-development/page.tsx

@@ -312,12 +312,12 @@ export default function ProductDevelopmentPage() {
             Product Development
           </h1>
           <p className="text-lg md:text-xl max-w-4xl mx-auto leading-relaxed text-gray-200 dark:text-gray-300 mb-8">
-            At OMS, we don’t just create products—we build digital solutions
+            At OMS, we don&apos;t just create products—we build digital
-            that accelerate business growth and transform industries. We
+            solutions that accelerate business growth and transform industries.
-            understand that great products are the result of careful planning,
+            We understand that great products are the result of careful
-            technical expertise, and a deep understanding of user needs. From
+            planning, technical expertise, and a deep understanding of user
-            concept to launch, our product development services deliver
+            needs. From concept to launch, our product development services
-            innovative, tailored solutions that help businesses enhance
+            deliver innovative, tailored solutions that help businesses enhance
             efficiency, reduce complexity, and unlock new revenue streams.
           </p>
           <div className="flex flex-col sm:flex-row justify-center items-center gap-4">
@@ -347,25 +347,27 @@ export default function ProductDevelopmentPage() {
         <div className="container mx-auto px-6">
           <SectionTitle>How OMS Delivers Market-Ready Products</SectionTitle>
           {/* No intro paragraph provided for this specific subtitle in the source */}
-          <div className="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-5xl mx-auto">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
             {howOmsDeliversItems.map((item) => (
               <div
                 key={item.title}
-                className="bg-white dark:bg-gray-700 p-4 rounded-lg shadow-md"
+                className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md flex items-start space-x-4"
               >
                 {item.icon && (
                   <item.icon
-                    className="text-3xl mb-3"
+                    className="text-3xl text-gold-500 dark:text-gold-400 mt-1 flex-shrink-0"
                     style={{ color: COLORS.primary }}
                   />
                 )}
-                <h4 className="text-lg font-semibold mb-2 font-poppins dark:text-white">
+                <div>
+                  <h4 className="text-lg font-semibold mb-1 font-poppins dark:text-white">
                     {item.title}
                   </h4>
                   <p className="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
                     {item.description}
                   </p>
                 </div>
+              </div>
             ))}
           </div>
         </div>
@@ -382,28 +384,7 @@ export default function ProductDevelopmentPage() {
             designed and built to meet your current needs, but is also ready for
             future growth and evolution.
           </SectionParagraph>
-           <div className="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-5xl mx-auto">
+          <FeatureGrid items={endToEndItems} />
-            {endToEndItems.map((item) => (
-              <div
-                key={item.title}
-                className="bg-white dark:bg-gray-700 p-4 rounded-lg shadow-md"
-              >
-                {item.icon && (
-                  <item.icon
-                    className="text-3xl mb-3"
-                    style={{ color: COLORS.primary }}
-                  />
-                )}
-                <h4 className="text-lg font-semibold mb-2 font-poppins dark:text-white">
-                  {item.title}
-                </h4>
-                <p className="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
-                  {item.description}
-                </p>
-              </div>
-            ))}
-          </div>
-         {/* <FeatureGrid items={endToEndItems} /> */}
         </div>
       </section>
 

app/(website)/services/resource-augmentation/page.tsx

@@ -46,7 +46,7 @@ export const metadata: Metadata = {
     "UX/UI Designer",
     "Process Engineer",
     "Salesforce Partner",
-    "time and material IT",
+   // "time and material IT",
     "milestone-based projects",
     "IT outsourcing",
     "flexible IT resources",
@@ -380,10 +380,11 @@ export default function ResourceAugmentationPage() {
           {/* Consider adding OMS Logo here if desired */}
           {/* <Image src="/oms-logo-white.png" alt="OMS Logo" width={150} height={50} className="mx-auto mb-6" /> */}
           <h1
-            className="text-3xl md:text-5xl lg:text-6xl font-bold mb-4 font-poppins drop-shadow-md leading-<1.5>"
+            className="text-3xl md:text-5xl lg:text-6xl font-bold mb-4 font-poppins drop-shadow-md leading-tight"
             style={{ color: COLORS.primary }} // Use gold color
           >
-            Flexible IT Resource <br />Augmentation & Managed Services
+            Flexible IT Resource <br />
+            Augmentation & Managed Services
           </h1>
           <p className="text-lg md:text-xl max-w-4xl mx-auto leading-relaxed text-gray-200 dark:text-gray-300 mb-8">
             Scale your IT capabilities effectively with Owethu Managed Services.
@@ -422,29 +423,28 @@ export default function ResourceAugmentationPage() {
               businesses today.
             </p>
           </div>
-          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-8 items-stretch">
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
             {[
               {
                 icon: FaPuzzlePiece,
-                title: "Access Specialised Expertise",
+                title: "Skill Gaps",
-                desc: "Get experienced professionals in software development, business analysis, cybersecurity, cloud computing, data science, and more — bringing the right skills to your project, exactly when you need them.",
+                desc: "Struggling to find specialized IT talent for specific project needs or new technologies.",
               },
               {
                 icon: FaChartLine,
-                title: "Flexibility & Scalability",
+                title: "Fluctuating Demand",
-                desc: "Easily scale your team in response to changing project needs — expanding or reducing resources without long-term obligations, while maintaining agility and control.",
+                desc: "Need to scale development or testing teams quickly for peak periods without long-term overhead.",
               },
               {
                 icon: FaClock,
-                title: "Faster Onboarding & Deployment",
+                title: "Project Delays",
-                desc: "Our experts are project-ready, helping you accelerate delivery timelines and reduce the overhead typically associated with recruitment and training.",
+                desc: "Lack of internal resources causing bottlenecks and delaying critical project timelines.",
               },
               {
                 icon: FaFileInvoiceDollar,
-                title: "Cost-Effective Hiring",
+                title: "Cost Control",
-                desc: "Maximize impact, minimize overhead — allowing you to scale your team according to project needs while managing costs efficiently and without compromising on quality. .",
+                desc: "Wanting to manage IT personnel costs effectively, avoiding expensive recruitment and full-time hires.",
               },
-              /*
               {
                 icon: FaBriefcase,
                 title: "Focus on Core Business",
@@ -454,16 +454,14 @@ export default function ResourceAugmentationPage() {
                 icon: FaSyncAlt,
                 title: "Need for Flexibility",
                 desc: "Requiring adaptable staffing solutions that can change as project requirements evolve.",
-              },*/
+              },
             ].map((item) => (
               <div
                 key={item.title}
-                className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md text-center transform transition duration-300 hover:-translate-y-1 hover:shadow-lgflex flex-col h-full"
+                className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md text-center transform transition duration-300 hover:-translate-y-1 hover:shadow-lg"
               >
                 <item.icon
-                  className="text-4xl mx-auto mb-4"
+                  className="text-4xl text-red-500 dark:text-red-400 mx-auto mb-4" // Using red to signify challenges/needs
-                  // Using red to signify challenges/needs
-                  style={{ color: COLORS.primary }} // Use gold color
                 />
                 <h4 className="text-xl font-semibold mb-2 font-poppins dark:text-white">
                   {item.title}
@@ -486,7 +484,7 @@ export default function ResourceAugmentationPage() {
                 Your Strategic Partner for IT Talent
               </h2>
               <p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4">
-                Owethu Managed Services (OMS) provides high-caliber IT
+                Owethu Managed Services provides high-caliber IT
                 professionals through flexible engagement models tailored to
                 your specific project requirements and business objectives. As a
                 100% Black female-owned organization based in Centurion,
@@ -642,7 +640,6 @@ export default function ResourceAugmentationPage() {
       </section>
 
       {/* 6. Benefits of Partnering with OMS Section */}
-      {/* Benefits of Resource Augmentation 
       <section className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800">
         <div className="container mx-auto px-6">
           <div className="text-center mb-12 md:mb-16">
@@ -679,9 +676,9 @@ export default function ResourceAugmentationPage() {
           </div>
         </div>
       </section>
-            */}
+
       {/* 7. Proven Experience / Past Projects (High Level) */}
-      <section className="py-16 md:py-24 bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-800 dark:to-gray-700">
+      <section className="py-16 md:py-24 bg-white dark:bg-gray-900">
         <div className="container mx-auto px-6">
           <div className="text-center mb-12 md:mb-16">
             <FaBusinessTime
@@ -722,7 +719,7 @@ export default function ResourceAugmentationPage() {
               </h4>
               <p className="text-sm text-gray-600 dark:text-gray-300">
                 Crafting seamless, data-driven onboarding experiences through
-                straight-through processing, enhanced customer journeys,
+                straight-through processing, enhanced customer journeys,<br/>
                 real-time insights, and a 360-degree customer view.
               </p>
             </div>

components/HeaderClient.tsx

@@ -45,7 +45,6 @@ const HeaderClient = () => {
   const [servicesDropdownOpen, setServicesDropdownOpen] = useState(false);
   const [productsDropdownOpen, setProductsDropdownOpen] = useState(false);
   const [joinUsDropdownOpen, setJoinUsDropdownOpen] = useState(false);
-  const [offeringsDropdownOpen, setOfferingsDropdownOpen] = useState(false);
 
   const handleServicesMouseEnter = () => setServicesDropdownOpen(true);
   const handleServicesMouseLeave = () => setServicesDropdownOpen(false);
@@ -56,9 +55,6 @@ const HeaderClient = () => {
   const handleJoinUsMouseEnter = () => setJoinUsDropdownOpen(true);
   const handleJoinUsMouseLeave = () => setJoinUsDropdownOpen(false);
 
-  const handleOfferingsMouseEnter = () => setOfferingsDropdownOpen(true);
-  const handleOfferingsMouseLeave = () => setOfferingsDropdownOpen(false);
-
   const pathname = usePathname(); // Get current path
 
   // Helper function to check if a path is active (exact match for simple links, startsWith for base paths)
@@ -221,7 +217,7 @@ const HeaderClient = () => {
                     `}
                   >
                     <div className="container mx-auto px-4 sm:px-6 lg:px-8 py-5">
-                      <div className="grid grid-cols-1 md:grid-cols-2 gap-x-8 gap-y-6 max-w-xl">
+                      <div className="grid grid-cols-1 md:grid-cols-3 gap-x-8 gap-y-6">
                         <Link
                           href="/services/resource-augmentation"
                           className={`${megaMenuItemClasses} ${
@@ -237,7 +233,6 @@ const HeaderClient = () => {
                             </p>
                           </div>
                         </Link>
-                        {/* Add more service links here 
                         <Link
                           href="/services/project-management"
                           className={`${megaMenuItemClasses} ${
@@ -253,7 +248,6 @@ const HeaderClient = () => {
                             </p>
                           </div>
                         </Link>
-                        */}
                         <Link
                           href="/services/product-development"
                           className={`${megaMenuItemClasses} ${
@@ -398,50 +392,9 @@ const HeaderClient = () => {
                     </div>
                   </div>
                 </div>
-                <div
-                  className={`group ${isActive("/offerings") ? "active" : ""}`}
-                  onMouseEnter={handleOfferingsMouseEnter}
-                  onMouseLeave={handleOfferingsMouseLeave}
-                >
-                  <button
-                    className={`${megaMenuTriggerClasses} ${
-                      isActive("/offerings") ? "after:w-full" : ""
-                    }`}
-                  >
-                    Explore Our Offerings
-                    <FiChevronDown className="w-4 h-4 ml-1.5 opacity-70 transition-transform duration-200" />
-                  </button>
-                  <div
-                    className={`
-      absolute left-0 top-full w-full shadow-lg z-1000
-      bg-card border-x border-b border-border rounded-b-lg
-      opacity-0 invisible translate-y-[-10px]
-      ${offeringsDropdownOpen ? "opacity-100 visible translate-y-0" : ""}
-      transition-all duration-300 ease-out transform
-    `}
-                  >
-                    <div className="container mx-auto px-4 sm:px-6 lg:px-8 py-5">
-                      <div className="max-w-md">
-                        <Link
-                          href="/offerings"
-                          className={`${megaMenuItemClasses} ${
-                            isActive("/offerings") ? "text-primary" : ""
-                          }`}
-                        >
-                          <FiBox className={megaMenuIconClasses} />
-                          <div className={megaMenuTextWrapperClasses}>
-                            <p className={megaMenuTitleClasses}>
-                              Our Offerings
-                            </p>
-                          </div>
-                        </Link>
-                      </div>
-                    </div>
-                  </div>
-                </div>
               </nav>
 
-              {/* ← Here’s the Explore Our Offerings link, back in its original spot 
+              {/* ← Here’s the Explore Our Offerings link, back in its original spot */}
               <Link
                 href="/services" // Assuming this link goes to the main services page
                 className={`flex items-center text-sm font-medium hover:opacity-80 transition-opacity group ${
@@ -453,7 +406,6 @@ const HeaderClient = () => {
                 Explore Our Offerings
                 <FiArrowRight className="w-4 h-4 ml-1.5 transition-transform duration-200 group-hover:translate-x-1" />
               </Link>
-              */}
             </div>{" "}
             {/* Close the new flex container */}
           </div>
@@ -476,7 +428,6 @@ const HeaderClient = () => {
           <DropdownLink href="/about" onClick={handleMobileLinkClick}>
             About Us
           </DropdownLink>
-
           <span className="pt-3 pb-1 text-xs uppercase text-muted-foreground">
             Services
           </span>
@@ -486,20 +437,24 @@ const HeaderClient = () => {
           >
             Resource Augmentation
           </DropdownLink>
+          <DropdownLink
+            href="/services/project-management"
+            onClick={handleMobileLinkClick}
+          >
+            Project Management
+          </DropdownLink>
           <DropdownLink
             href="/services/product-development"
             onClick={handleMobileLinkClick}
           >
             Product Development
           </DropdownLink>
-
           <span className="pt-3 pb-1 text-xs uppercase text-muted-foreground">
             Products
           </span>
           <DropdownLink href="/obse" onClick={handleMobileLinkClick}>
             OBSE
           </DropdownLink>
-
           <span className="pt-3 pb-1 text-xs uppercase text-muted-foreground">
             Join Us
           </span>
@@ -509,18 +464,9 @@ const HeaderClient = () => {
           <DropdownLink href="/portal" onClick={handleMobileLinkClick}>
             Recruitment Portal
           </DropdownLink>
-
           <DropdownLink href="/contact" onClick={handleMobileLinkClick}>
             Contact Us
           </DropdownLink>
-
-          <span className="pt-3 pb-1 text-xs uppercase text-muted-foreground">
-            Explore Our Offerings
-          </span>
-          <DropdownLink href="/offerings" onClick={handleMobileLinkClick}>
-            Our Offerings
-          </DropdownLink>
-
           <div className="pt-4">
             <Link
               href="/request-demo"
@@ -531,7 +477,6 @@ const HeaderClient = () => {
               <FiClipboard className="w-4 h-4 mr-1.5" /> Request OBSE Demo
             </Link>
           </div>
-
           <div className="pt-4 border-t border-border mt-4"></div>
         </nav>
       </div>

oms-website.code-workspace

@@ -0,0 +1,7 @@
+{
+    "folders": [
+        {
+            "path": "."
+        }
+    ]
+}