diff --git a/src/Resources/app/storefront/src/scss/_font.scss b/src/Resources/app/storefront/src/scss/_font.scss
index b8d5ed9..f65b7c4 100644
--- a/src/Resources/app/storefront/src/scss/_font.scss
+++ b/src/Resources/app/storefront/src/scss/_font.scss
@@ -3,8 +3,8 @@
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 400;
-  src: url('../assets/font/google/montserrat-v24-latin-regular.woff2') format('woff2'),
-       url('../assets/font/google/montserrat-v24-latin-regular.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-regular.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-regular.woff') format('woff');
 }
 
 /* montserrat-600 - latin */
@@ -12,8 +12,8 @@
   font-family: 'Montserrat';
   font-style: normal;
   font-weight: 600;
-  src: url('../assets/font/google/montserrat-v24-latin-600.woff2') format('woff2'),
-       url('../assets/font/google/montserrat-v24-latin-600.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-600.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-600.woff') format('woff');
 }
 
 /* montserrat-italic - latin */
@@ -21,8 +21,8 @@
   font-family: 'Montserrat';
   font-style: italic;
   font-weight: 400;
-  src: url('../assets/font/google/montserrat-v24-latin-italic.woff2') format('woff2'),
-       url('../assets/font/google/montserrat-v24-latin-italic.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-italic.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-italic.woff') format('woff');
 }
 
 /* montserrat-600italic - latin */
@@ -30,8 +30,8 @@
   font-family: 'Montserrat';
   font-style: italic;
   font-weight: 600;
-  src: url('../assets/font/google/montserrat-v24-latin-600italic.woff2') format('woff2'),
-       url('../assets/font/google/montserrat-v24-latin-600italic.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-600italic.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/montserrat-v24-latin-600italic.woff') format('woff');
 }
 
 /* playfair-display-regular - latin */
@@ -39,8 +39,8 @@
   font-family: 'Playfair Display';
   font-style: normal;
   font-weight: 400;
-  src: url('../assets/font/google/playfair-display-v29-latin-regular.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-regular.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-regular.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-regular.woff') format('woff');
 }
 
 /* playfair-display-500 - latin */
@@ -48,8 +48,8 @@
   font-family: 'Playfair Display';
   font-style: normal;
   font-weight: 500;
-  src: url('../assets/font/google/playfair-display-v29-latin-500.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-500.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-500.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-500.woff') format('woff');
 }
 
 /* playfair-display-600 - latin */
@@ -57,8 +57,8 @@
   font-family: 'Playfair Display';
   font-style: normal;
   font-weight: 600;
-  src: url('../assets/font/google/playfair-display-v29-latin-600.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-600.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-600.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-600.woff') format('woff');
 }
 
 /* playfair-display-italic - latin */
@@ -66,8 +66,8 @@
   font-family: 'Playfair Display';
   font-style: italic;
   font-weight: 400;
-  src: url('../assets/font/google/playfair-display-v29-latin-italic.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-italic.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-italic.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-italic.woff') format('woff');
 }
 
 /* playfair-display-500italic - latin */
@@ -75,8 +75,8 @@
   font-family: 'Playfair Display';
   font-style: italic;
   font-weight: 500;
-  src: url('../assets/font/google/playfair-display-v29-latin-500italic.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-500italic.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-500italic.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-500italic.woff') format('woff');
 }
 
 /* playfair-display-600italic - latin */
@@ -84,6 +84,6 @@
   font-family: 'Playfair Display';
   font-style: italic;
   font-weight: 600;
-  src: url('../assets/font/google/playfair-display-v29-latin-600italic.woff2') format('woff2'),
-       url('../assets/font/google/playfair-display-v29-latin-600italic.woff') format('woff');
+  src: url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-600italic.woff2') format('woff2'),
+       url('#{$app-css-relative-asset-path}/font/google/playfair-display-v29-latin-600italic.woff') format('woff');
 }
diff --git a/src/Resources/app/storefront/src/scss/base.scss b/src/Resources/app/storefront/src/scss/base.scss
index c748316..34a02fc 100644
--- a/src/Resources/app/storefront/src/scss/base.scss
+++ b/src/Resources/app/storefront/src/scss/base.scss
@@ -20,7 +20,7 @@ strong {
   .head-hero {
     position: relative;
     aspect-ratio: 2500 / 625;
-    background: url("../assets/layout/header_bg.jpg") 50% 50% no-repeat;
+    background: url("#{$app-css-relative-asset-path}/layout/header_bg.jpg") 50% 50% no-repeat;
     background-size: cover;
     min-height: 200px;
   }