Fix "Try it out" button (#2287)

The anchor doesn't seem to work.

Author: martinbonnin

src/components/index-page/hero/index.tsx

@@ -29,7 +29,7 @@ export function Hero() {
           </ul>
 
           <div className="flex items-center gap-4">
-            <Button href="/#try-it-out">Try it out</Button>
+            <Button href="/#how-it-works">Try it out</Button>
             <Button href="/learn" variant="secondary">
               <span className="sr-only">Read the </span> Docs
             </Button>

src/components/index-page/how-it-works/index.tsx

@@ -32,6 +32,7 @@ export function HowItWorks() {
   return (
     <section
       ref={sectionRef}
+      id="how-it-works"
       className="gql-container gql-section xl:py-20"
       // this is mostly for Playwright, we're not getting a hydration warning normally
       suppressHydrationWarning