---
import BackgroundEffect from '@@/components/ui/BackgroundEffect.astro';
import Button from '@@/components/ui/Button.astro';
---

<section data-scheme="shift" class="relative">
  <BackgroundEffect
    gradientType="var(--gradient-top-fade-linear)"
    patternType="none"
    noiseType="none"
  />

  <div class="container flex flex-col items-center">
    <div class="mb-10 text-center">
      <div
        class="rounded-card mb-4 inline-flex items-center gap-2 px-4 py-2 text-sm"
        data-scheme="shift"

      >
        <span class="bg-accent h-2 w-2 rounded-full"></span>
        Get Started
      </div>
      <h2 class="h2 mb-4">
        Ready to Transform Your Business?
      </h2>
      <p
        class="text-fg-sub mx-auto max-w-3xl text-lg md:text-xl"

      >
        Join thousands of companies who are already using Pablo to create
        amazing websites. Start your journey today and see the difference.
      </p>
    </div>

    <Button size="lg">Get Started for Free</Button>
  </div>
</section>