✨ Use smooth scroll function to navigate to anchor

Using a eased RAF function to scroll to a specific target
Avoid using `scrollIntoView` or smooth behavior as it doesn't work on Safari and others.

src/routes/index.svelte

@@ -7,7 +7,7 @@
     import { getContext, onMount } from 'svelte'
     import anime, { type AnimeTimelineInstance } from 'animejs'
     import { DELAY } from '$utils/contants'
-    import { sleep } from '$utils/functions'
+    import { sleep, smoothScroll } from '$utils/functions'
     import { reveal, fade as animeFade } from '$animations/index'
     // Components
     import Metas from '$components/Metas.svelte'
@@ -95,7 +95,7 @@
                 {settings.description}
             </p>
 
-            <Button text="Explore locations" url="#locations">
+            <Button text="Explore locations" on:click={() => smoothScroll('locations')}>
                 <IconEarth animate={true} />
             </Button>
         </div>
@@ -111,10 +111,11 @@
         <ListCTAs>
             <li>
                 <BoxCTA
-                    url="{$page.url.pathname}#locations"
+                    url="{$page.url.pathname}"
                     icon="globe"
                     label="Discover locations"
                     alt="Globe"
+                    on:click={() => smoothScroll('locations')}
                 />
             </li>
             <li>