Gradient Hero CTA Section with Dual Buttons

<section class="sm:px-6 sm:ml-auto sm:mr-auto sm:mt-40 sm:mb-40 max-w-7xl mt-16 mr-auto mb-16 ml-auto pr-4 pl-4" data-element-locator="html &gt; body:nth-of-type(1) &gt; div:nth-of-type(2) &gt; section:nth-of-type(5)">
        <div class="relative overflow-hidden bg-white/5 backdrop-blur-xl border-gradient before:rounded-[40px] rounded-[40px]">
          <div class="absolute inset-0 bg-[radial-gradient(800px_400px_at_50%_50%,rgba(16,185,129,0.15),transparent_70%)]"></div>
          <div class="absolute -top-16 -right-10 h-72 w-72 rounded-full bg-emerald-400/10 blur-3xl pointer-events-none"></div>
          <div class="absolute -bottom-20 -left-10 h-80 w-80 rounded-full bg-cyan-400/10 blur-3xl pointer-events-none"></div>
          <div class="relative z-10 sm:p-16 pt-12 pr-8 pb-12 pl-8 text-center">
            <span class="inline-flex items-center gap-2 rounded-full border-gradient before:rounded-full bg-emerald-500/10 px-3 py-1.5 text-xs text-emerald-200 font-geist">
              <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="h-3.5 w-3.5">
                <path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z" class=""></path>
                <path d="M20 2v4" class=""></path>
                <path d="M22 4h-4" class=""></path>
                <circle cx="4" cy="20" r="2" class=""></circle>
              </svg>
              Ready to transform your finance operations?
            </span>
            <h2 class="mt-4 text-3xl sm:text-4xl lg:text-5xl tracking-tight font-geist font-medium text-white">
              Start your journey to financial clarity
            </h2>
            <p class="mt-4 text-base sm:text-lg text-white/70 max-w-2xl mx-auto font-geist">
              Join thousands of finance teams using Quantivo to streamline
              operations, forecast with confidence, and scale with ease.
            </p>
            <div class="mt-8 flex flex-col sm:flex-row items-center justify-center gap-3.5">
              <a href="#" class="inline-flex items-center gap-2 rounded-full bg-emerald-400 px-6 py-3 text-sm font-medium text-black hover:bg-emerald-300 transition font-geist shadow-lg shadow-emerald-900/25">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4">
                  <path d="M12 5v14" class=""></path>
                  <path d="M5 12h14" class=""></path>
                </svg>
                Get started free
              </a>
              <a href="#" class="inline-flex items-center gap-2 rounded-full border-gradient before:rounded-full bg-white/5 px-6 py-3 text-sm font-medium hover:bg-white/10 transition font-geist">
                Schedule a demo
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4">
                  <path d="M5 12h14" class=""></path>
                  <path d="m12 5 7 7-7 7" class=""></path>
                </svg>
              </a>
            </div>
          </div>
        </div>
      </section>