---
import BaseLayout from '../../layouts/BaseLayout.astro'
import HeroSection from '../../components/product/cloud/HeroSection.vue'
import ReasonSection from '../../components/product/cloud/ReasonSection.vue'
import AIModelsSection from '../../components/product/shared/AIModelsSection.vue'
import AudienceSection from '../../components/product/cloud/AudienceSection.vue'
import PricingSection from '../../components/product/cloud/PricingSection.vue'
import ProductCardsSection from '../../components/product/cloud/ProductCardsSection.vue'
import FAQSection from '../../components/product/cloud/FAQSection.vue'
import { t } from '../../i18n/translations'
---

<BaseLayout
  title="Comfy Cloud — AI in the Cloud"
  description={t('cloud.hero.subtitle', 'en')}
  keywords={['comfyui web app', 'comfyui app', 'comfyui online', 'comfyui cloud', 'comfy cloud', 'comfy ui application', 'comfyui browser', 'cloud comfyui', 'managed comfyui']}
>
  <HeroSection />
  <ReasonSection />
  <AIModelsSection />
  <AudienceSection />
  <PricingSection />
  <ProductCardsSection />
  <FAQSection client:visible />
</BaseLayout>
