<div class="relative mt-24 bg-white/5">
    <main class="lg:relative">
        <div class="mx-auto w-full lg:grid lg:grid-cols-2 lg:gap-4 lg:items-center text-center lg:text-left">
            <!-- Text Section -->
            <div class="relative col-span-1 px-6 sm:px-8 xl:pr-16">
                <h2 class="fade-in text-balance lg:text-5xl text-4xl font-normal tracking-tight text-gray-50">
                    <span class="text-base/7 font-light text-black tracking-wide">PROJECT SITE</span>
                    <br>
                    <span class="block  text-black">Discover Fumba</span>
                </h2>
                <p class="text-left my-6 text-black max-w-4xl text-pretty lg:text-xl text-lg font-light fade-in">
                    Located in the heart of Zanzibar,Fumba offers a unique opportunity to merge modern development with cultural heritage and natural beauty.<br><br>
                    As part of the 2042 Fumba Free Economic Zone Master Plan, Fumba is set to become a key driver of economic growth and innovation in the region, making it the perfect location for a Cybercity.
                </p>
                <div class="mt-10 sm:flex sm:justify-center lg:justify-start">
                    <div class="rounded-md shadow">
                        <a href="#" class="fade-in flex w-full items-center justify-center rounded-xl border border-transparent px-6 py-2 text-base font-medium text-black bg-white hover:bg-indigo-700">
                            Learn More
                        </a>
                    </div>
                </div>
            </div>
            <!-- Image Section -->
            <div class="relative col-span-1">
                <img class="h-full w-full object-cover" src="/images/fumba.jpg" alt="Fumba">
            </div>
        </div>
    </main>
</div>
