---
import Layout from "../layouts/Layout.astro";
---
<Layout title="">
    <main>
        <div>
            <section class="container-fluid gradintBack">
				<div class="container mx-auto px-4 flex flex-col-reverse lg:flex-row gap-x-4 place-items-center">
					<div class="w-full">
						<img class="w-full " src="/img/image3.png" alt="">
					</div>
					<div class="flex flex-col w-full">
						<h1 class="text-3xl md:text-4xl lg:text-5xl text-[#47ae6a]">Discover Our Story</h1>
						<h2 class="text-2xl md:text-3xl text-[#3084b5] py-4">Nurturing Young Minds at Holywisdom Preschool</h2>
						<h3 class="text-xl text-justify pb-4">A testament to our Montessori-inspired vision, dedicated educators, and vibrant learning spaces. Your child's journey starts here!</h3>
						<div class="flex flex-row place-content-between">
							<a href="#" class="text-sm xl:text-lg rounded-lg shadow-2xl text-[#FFFFFF] px-4 md:px-8 p-3 bg-[#3084b5] border-2 border-[#3084b5] transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300">Get in Touch</a>
						</div>
					</div>
				</div>
			</section>
            <section class="container mx-auto px-4 my-10">
                <div class="">
                    <h1 class="text-2xl">Enter Our Virtual Preschool World!</h1>
                    <p>Welcome to the digital gateway of Holywisdom Public School's newest preschool! Explore the essence of early childhood education with our online platform, offering a glimpse into the vibrant and enriching world we've created for your child. Delve into our programs, meet our dedicated educators, and virtually tour our stimulating facilities. Stay connected with our community, receive updates on upcoming events, and embark on the exciting journey of discovery and growth that awaits your little one at Holywisdom Preschool. Start the adventure now!</p>
                </div>
            </section>
        </div>
    </main>
</Layout>
<style>
    .gradintBack {
        background: linear-gradient(0deg, rgb(71, 174, 106) 0%, rgba(255, 255, 255) 40%);
    }
</style>