diff --git a/apps/website/package.json b/apps/website/package.json
index 0437215..f197e21 100644
--- a/apps/website/package.json
+++ b/apps/website/package.json
@@ -20,7 +20,7 @@
     "embla-carousel": "^8.3.1",
     "focus-visible": "^5.2.1",
     "lenis": "^1.1.16",
-    "motion": "^10.18.0",
+    "motion": "^10",
     "ogl": "^1.0.9",
     "sanitize.css": "^13.0.0",
     "swell-js": "^4.2.4",
@@ -30,7 +30,7 @@
   "devDependencies": {
     "@sveltejs/adapter-auto": "^3.3.1",
     "@sveltejs/adapter-cloudflare": "^4.7.4",
-    "@sveltejs/kit": "^2.8.0",
+    "@sveltejs/kit": "^2.8.1",
     "@typescript-eslint/eslint-plugin": "^8.14.0",
     "@typescript-eslint/parser": "^8.14.0",
     "base-64": "^1.0.0",
@@ -44,8 +44,8 @@
     "postcss-normalize": "^13.0.1",
     "postcss-preset-env": "^10.1.0",
     "postcss-sort-media-queries": "^5.2.0",
-    "sass": "^1.80.6",
-    "svelte": "^5.1.15",
+    "sass": "^1.80.7",
+    "svelte": "^5.1.16",
     "svelte-check": "^4.0.7",
     "svelte-preprocess": "^6.0.3",
     "tslib": "^2.8.1",
diff --git a/apps/website/src/routes/+layout.svelte b/apps/website/src/routes/+layout.svelte
index 9d79536..899c649 100644
--- a/apps/website/src/routes/+layout.svelte
+++ b/apps/website/src/routes/+layout.svelte
@@ -15,6 +15,7 @@
 </style>
 
 <script lang="ts">
+    import 'sanitize.css'
     import '../style/global.scss'
 
     import { PUBLIC_ANALYTICS_DOMAIN } from '$env/static/public'
@@ -94,7 +95,7 @@
 <svelte:window bind:innerHeight />
 
 <svelte:head>
-    <link rel="canonical" href={$page.url.href} />
+    <link rel="canonical" href={$page.url.href.split('#')[0]} />
 
     {#each fonts as font}
         <link rel="preload" href="/fonts/{font}.woff2" as="font" type="font/woff2" crossorigin="anonymous">
diff --git a/apps/website/src/style/_animations.scss b/apps/website/src/style/animations.scss
similarity index 89%
rename from apps/website/src/style/_animations.scss
rename to apps/website/src/style/animations.scss
index 33f9e1b..fc08f19 100644
--- a/apps/website/src/style/_animations.scss
+++ b/apps/website/src/style/animations.scss
@@ -1,3 +1,6 @@
+@use "imports" as *;
+
+
 /*
 ** Earth icon
 */
diff --git a/apps/website/src/style/atoms/_photo.scss b/apps/website/src/style/atoms/photo.scss
similarity index 95%
rename from apps/website/src/style/atoms/_photo.scss
rename to apps/website/src/style/atoms/photo.scss
index 3a2bbfd..563fe8b 100644
--- a/apps/website/src/style/atoms/_photo.scss
+++ b/apps/website/src/style/atoms/photo.scss
@@ -1,3 +1,6 @@
+@use "../imports" as *;
+
+
 .photo {
     overflow: hidden;
     background: $color-primary-tertiary20;
diff --git a/apps/website/src/style/_base.scss b/apps/website/src/style/base.scss
similarity index 99%
rename from apps/website/src/style/_base.scss
rename to apps/website/src/style/base.scss
index 943138f..a698ad7 100644
--- a/apps/website/src/style/_base.scss
+++ b/apps/website/src/style/base.scss
@@ -1,3 +1,6 @@
+@use "imports" as *;
+
+
 html {
     font: #{$base-font-size}/1.2 $font-sans;
     font-weight: 400;
diff --git a/apps/website/src/style/_effects.scss b/apps/website/src/style/effects.scss
similarity index 98%
rename from apps/website/src/style/_effects.scss
rename to apps/website/src/style/effects.scss
index d162df4..d9d261c 100644
--- a/apps/website/src/style/_effects.scss
+++ b/apps/website/src/style/effects.scss
@@ -1,3 +1,6 @@
+@use "imports" as *;
+
+
 /*
 ** Box shadows
 */
diff --git a/apps/website/src/style/_fonts.scss b/apps/website/src/style/fonts.scss
similarity index 83%
rename from apps/website/src/style/_fonts.scss
rename to apps/website/src/style/fonts.scss
index e47561e..1b66b7f 100644
--- a/apps/website/src/style/_fonts.scss
+++ b/apps/website/src/style/fonts.scss
@@ -1,3 +1,5 @@
+@use "imports" as *;
+
 /* Fonts list
 ========================================================================== */
 @include font-face("Garnett", "G-Light", 200);
@@ -5,4 +7,4 @@
 @include font-face("Garnett", "G-Medium", 500);
 @include font-face("Garnett", "G-Semibold", 600);
 @include font-face("Jazmin", "J-Extralight", 200);
-@include font-face("Jazmin", "J-Light", 300);
\ No newline at end of file
+@include font-face("Jazmin", "J-Light", 300);
diff --git a/apps/website/src/style/global.scss b/apps/website/src/style/global.scss
index 94b332b..c79dc7e 100644
--- a/apps/website/src/style/global.scss
+++ b/apps/website/src/style/global.scss
@@ -1,25 +1,22 @@
 @charset "UTF-8";
 
-// Dependencies
-@import "sanitize.css/sanitize";
-
 // Tools
-@import "tools/helpers";
+@forward "tools/helpers";
 
 // Base
-@import "variables-css";
-@import "base";
-@import "fonts";
-@import "typography";
-@import "effects";
+@forward "variables-css";
+@forward "base";
+@forward "fonts";
+@forward "typography";
 
 // Layout
-@import "layout/grid";
-@import "layout/modules";
+@forward "layout/grid";
+@forward "layout/modules";
 
 // Misc
-@import "animations";
+@forward "animations";
+@forward "effects";
 
 // Components (Atomic Design System)
 // Atoms
-@import "atoms/photo";
+@forward "atoms/photo";
diff --git a/apps/website/src/style/imports.scss b/apps/website/src/style/imports.scss
index f7e0648..660ce0b 100644
--- a/apps/website/src/style/imports.scss
+++ b/apps/website/src/style/imports.scss
@@ -1,4 +1,3 @@
-// Tools
-@import "variables";
-@import "tools/mixins";
-@import "tools/functions";
\ No newline at end of file
+@forward "variables";
+@forward "tools/mixins";
+@forward "tools/functions";
diff --git a/apps/website/src/style/layout/_grid.scss b/apps/website/src/style/layout/grid.scss
similarity index 90%
rename from apps/website/src/style/layout/_grid.scss
rename to apps/website/src/style/layout/grid.scss
index 52a88c7..9df3818 100644
--- a/apps/website/src/style/layout/_grid.scss
+++ b/apps/website/src/style/layout/grid.scss
@@ -1,3 +1,6 @@
+@use "../imports" as *;
+
+
 /*
 ** Grid
 */
diff --git a/apps/website/src/style/layout/_modules.scss b/apps/website/src/style/layout/modules.scss
similarity index 96%
rename from apps/website/src/style/layout/_modules.scss
rename to apps/website/src/style/layout/modules.scss
index 8e5f2d2..82462c6 100644
--- a/apps/website/src/style/layout/_modules.scss
+++ b/apps/website/src/style/layout/modules.scss
@@ -1,3 +1,6 @@
+@use "../imports" as *;
+
+
 .grid-modules {
     padding-bottom: 40px;
 
diff --git a/apps/website/src/style/tools/_functions.scss b/apps/website/src/style/tools/functions.scss
similarity index 85%
rename from apps/website/src/style/tools/_functions.scss
rename to apps/website/src/style/tools/functions.scss
index b03ef0f..06b9edb 100644
--- a/apps/website/src/style/tools/_functions.scss
+++ b/apps/website/src/style/tools/functions.scss
@@ -1,4 +1,7 @@
 @use "sass:math";
+@use "sass:color";
+@use "../variables" as *;
+
 
 /* PX to REM
 ========================================================================== */
@@ -39,5 +42,5 @@
 /* HEX color to RGB
 ========================================================================== */
 @function hexToRGB($color) {
-    @return red($color), green($color), blue($color);
-}
\ No newline at end of file
+    @return color.channel($color, "red", $space: rgb), color.channel($color, "green", $space: rgb), color.channel($color, "blue", $space: rgb);
+}
diff --git a/apps/website/src/style/tools/_helpers.scss b/apps/website/src/style/tools/helpers.scss
similarity index 95%
rename from apps/website/src/style/tools/_helpers.scss
rename to apps/website/src/style/tools/helpers.scss
index 6707ac7..e648f9f 100644
--- a/apps/website/src/style/tools/_helpers.scss
+++ b/apps/website/src/style/tools/helpers.scss
@@ -1,3 +1,6 @@
+@use "../imports" as *;
+
+
 /* Classes
 ========================================================================== */
 .clear {
diff --git a/apps/website/src/style/tools/_mixins.scss b/apps/website/src/style/tools/mixins.scss
similarity index 98%
rename from apps/website/src/style/tools/_mixins.scss
rename to apps/website/src/style/tools/mixins.scss
index b1361ca..688c091 100644
--- a/apps/website/src/style/tools/_mixins.scss
+++ b/apps/website/src/style/tools/mixins.scss
@@ -1,5 +1,7 @@
 @use "sass:math";
 @use "sass:map";
+@use "../variables" as *;
+
 
 // Hide text
 %hide-text {
diff --git a/apps/website/src/style/_typography.scss b/apps/website/src/style/typography.scss
similarity index 99%
rename from apps/website/src/style/_typography.scss
rename to apps/website/src/style/typography.scss
index 95fbe61..662b880 100644
--- a/apps/website/src/style/_typography.scss
+++ b/apps/website/src/style/typography.scss
@@ -1,3 +1,6 @@
+@use "imports" as *;
+
+
 /* ==========================================================================
    TITLES
 ========================================================================== */
diff --git a/apps/website/src/style/_variables-css.scss b/apps/website/src/style/variables-css.scss
similarity index 94%
rename from apps/website/src/style/_variables-css.scss
rename to apps/website/src/style/variables-css.scss
index 79e3641..833e05f 100644
--- a/apps/website/src/style/_variables-css.scss
+++ b/apps/website/src/style/variables-css.scss
@@ -1,3 +1,6 @@
+@use "imports" as *;
+
+
 :root {
     // Sizes
     --container-width: #{$container-width};
diff --git a/apps/website/src/style/_variables.scss b/apps/website/src/style/variables.scss
similarity index 100%
rename from apps/website/src/style/_variables.scss
rename to apps/website/src/style/variables.scss
diff --git a/apps/website/svelte.config.js b/apps/website/svelte.config.js
index d397208..390154d 100644
--- a/apps/website/svelte.config.js
+++ b/apps/website/svelte.config.js
@@ -1,18 +1,16 @@
-import { sveltePreprocess } from 'svelte-preprocess'
-import adapter from '@sveltejs/adapter-cloudflare'
 import { fileURLToPath } from 'url'
 import { dirname } from 'path'
+import { sveltePreprocess } from 'svelte-preprocess'
+import adapter from '@sveltejs/adapter-cloudflare'
 
-const stylePath = `${dirname(fileURLToPath(import.meta.url))}/src/style`
-export const scssImports = `@use "${stylePath}/imports.scss" as *;`
+export const globalStyles = `@use "${dirname(fileURLToPath(import.meta.url))}/src/style/imports" as *;`
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
     // Preprocessors docs: https://github.com/sveltejs/svelte-preprocess
     preprocess: sveltePreprocess({
         scss: {
-            prependData: scssImports,
-            renderSync: true,
+            prependData: globalStyles,
         }
     }),
 
diff --git a/apps/website/vite.config.ts b/apps/website/vite.config.ts
index 6f4fa4b..c878005 100644
--- a/apps/website/vite.config.ts
+++ b/apps/website/vite.config.ts
@@ -1,15 +1,16 @@
-import type { UserConfig } from 'vite'
+import { defineConfig } from 'vite'
 import { sveltekit } from '@sveltejs/kit/vite'
-import { scssImports } from './svelte.config'
+import { globalStyles } from './svelte.config'
 
-const config: UserConfig = {
+export default defineConfig({
     plugins: [
         sveltekit()
     ],
     css: {
         preprocessorOptions: {
             scss: {
-                additionalData: scssImports,
+                additionalData: globalStyles,
+                api: 'modern',
             }
         }
     },
@@ -18,6 +19,4 @@ const config: UserConfig = {
             transformMixedEsModules: true,
         }
     },
-}
-
-export default config
+})
diff --git a/bun.lockb b/bun.lockb
index b6f3688..822cc3b 100755
Binary files a/bun.lockb and b/bun.lockb differ