<script setup lang="ts">
import VPHomeHero from 'vitepress/dist/client/theme-default/components/VPHomeHero.vue'
import CustomHomeFeatures from './CustomHomeFeatures.vue';
import CustomHomeServices from './CustomHomeServices.vue';
</script>

<template>
  <div class="VPHome CustomHome">
    <slot name="home-hero-before" />
    <VPHomeHero>
      <template #home-hero-info>
        <slot name="home-hero-info" />
      </template>
      <template #home-hero-image>
        <slot name="home-hero-image" />
      </template>
    </VPHomeHero>
    <slot name="home-hero-after" />

    <slot name="home-features-before" />
    <CustomHomeFeatures />
    <slot name="home-features-after" />

    <CustomHomeServices />

    <Content />
  </div>
</template>

<style scoped>
.VPHome {
  padding-bottom: 96px;
}

.VPHome :deep(.VPHomeSponsors) {
  margin-top: 112px;
  margin-bottom: -128px;
}
</style>