diff --git a/app/frontend/entrypoints/application.scss b/app/frontend/entrypoints/application.scss
index 5a15706c..47463002 100644
--- a/app/frontend/entrypoints/application.scss
+++ b/app/frontend/entrypoints/application.scss
@@ -1,14 +1,10 @@
-$govuk-images-path: "@govuk/assets/images/";
-$govuk-fonts-path: "@govuk/assets/fonts/";
+$govuk-assets-path: "@govuk/assets/";
 $govuk-global-styles: true;
 $govuk-suppressed-warnings: (
   ie8
 );
 
-@import "@govuk/all";
-
-@import "../styles/responsive-embed";
-@import "../styles/sub-navigation";
+@import "pkg:govuk-frontend";
 
 @import "../styles/borders";
 @import "../styles/breadcrumbs";
diff --git a/vite.config.ts b/vite.config.ts
index 2fba2135..e72442f1 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,16 +1,16 @@
 import * as path from 'node:path'
 import { defineConfig } from 'vite'
 import RubyPlugin from 'vite-plugin-ruby'
+import { NodePackageImporter } from 'sass'
 
 export default defineConfig({
-  plugins: [
-    RubyPlugin(),
-  ],
+  plugins: [RubyPlugin()],
   build: { emptyOutDir: true },
   css: {
     preprocessorOptions: {
       scss: {
-        includePaths: ['./node_modules/govuk-frontend/'],
+        api: 'modern',
+        importers: [new NodePackageImporter()],
         quietDeps: true
       },
       devSourcemaps: true
@@ -18,7 +18,10 @@ export default defineConfig({
   },
   resolve: {
     alias: {
-      '@govuk': path.resolve(__dirname, 'node_modules/govuk-frontend/dist/govuk'),
+      '@govuk': path.resolve(
+        __dirname,
+        'node_modules/govuk-frontend/dist/govuk'
+      ),
       '@images': path.resolve(__dirname, 'app/frontend/images')
     }
   }