import { CallToAction } from '@/components/CallToAction'
import { Faqs } from '@/components/Faqs'
import { Footer } from '@/components/Footer'
import { Hero } from '@/components/home/Hero'
import { HomePrinciples } from '@/components/home/HomePrinciples'
import { HomeMilestones } from '@/components/home/HomeMilestones'
import { HomeVentures } from '@/components/home/HomeVentures'
import { Quote } from '@/components/Quote'
import { HomeStickyHeader } from '@/components/home/HomeStickyHeader'
import { FadeInOnView } from '@/components/UI/FadeInOnView'
import { About } from '@/components/home/About'
import { Ventures } from '@/components/home/Ventures'
import { Foundation } from '@/components/home/Foundation'
import { Team } from '@/components/home/Team'
import { News } from '@/components/home/News'
import { CTA } from '@/components/home/CTA'

export default function Home() {
  return (
    <>
      <main>
        <HomeStickyHeader />
        <section className="relative min-h-screen">
          <Hero className="md:-mt-18 -mt-20" />
        </section>

        <FadeInOnView delayMs={100}>
          <About />
        </FadeInOnView>


        <FadeInOnView delayMs={200}>
          <Ventures />
        </FadeInOnView>

        <FadeInOnView delayMs={300}>
          <Foundation />
        </FadeInOnView>

        <FadeInOnView delayMs={400}>
          <Team />
        </FadeInOnView>

        <FadeInOnView delayMs={500}>
          <Quote />
        </FadeInOnView>

        <FadeInOnView delayMs={600}>
          <News />
        </FadeInOnView>

        <FadeInOnView delayMs={700}>
          <CTA />
        </FadeInOnView>

        <FadeInOnView delayMs={800}>
          <Faqs />
        </FadeInOnView>
      </main>
      <Footer />
    </>
  )
}