import { AnimatedSection } from '../../components/AnimatedSection'
import { HomeHero } from './HomeHero'
import { StackSectionDark } from './StackSectionDark'
import { WorldMap } from './HomeGlobe'
import { HomeBenefits } from './HomeBenefits'
import { CallToAction } from './CallToAction'
import { HomeSlider } from './HomeSlider'
import { HomeHosting } from './HomeHosting'


export default function HomePage() {
  return (
    <div>
      <AnimatedSection>
        <HomeHero />
      </AnimatedSection>

      <AnimatedSection id="next-section">
        <WorldMap />
      </AnimatedSection>

      <AnimatedSection>
        <HomeHosting />
      </AnimatedSection>

      <AnimatedSection>
        <StackSectionDark />
      </AnimatedSection>

      <AnimatedSection>
        <HomeSlider />
      </AnimatedSection>

      <AnimatedSection>
       <HomeBenefits />
      </AnimatedSection>

      <AnimatedSection>
        <CallToAction />
      </AnimatedSection>
    </div>
  )
}