Gradient CTA Button with Icon

<div class="inline-flex">
  <style>
    @import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700&display=swap'); .font-geist { font-family: 'Geist', 'Inter', sans-serif; }
  </style>
  <a href="#" class="inline-flex items-center space-x-2 rounded-md text-base font-medium focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 cursor-pointer pt-3 pr-6 pb-3 pl-6 bg-gradient-to-r from-[#59c8ff] via-[#4e7ff3] to-[#3390ff] text-white shadow-[rgba(71,184,255,0.5)_0px_0px_20px,rgba(58,125,233,0.25)_0px_5px_5px_-1px,rgba(175,230,255,0.5)_4px_4px_8px_inset,rgba(19,95,216,0.35)_-4px_-4px_8px_inset] hover:from-[#4e7ff3] hover:via-[#59c8ff] hover:to-[#4e7ff3] transition-all duration-150 min-w-[120px] min-h-[44px] font-medium" style="background-size: 280%; background-position: left top;" onmouseover="this.style.backgroundPosition='right top';" onmouseout="this.style.backgroundPosition='left top';">
    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-4 h-4">
      <path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z"></path>
      <path d="m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z"></path>
      <path d="M9 12H4s.55-3.03 2-4c1.62-1.08"></path>
      <path d="M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5"></path>
    </svg>
    <span class="font-geist">Get Started</span>
  </a>
</div>