Fix SiteTitle style on Footer

src/components/atoms/SiteTitle.svelte

@@ -1,9 +1,18 @@
 <script lang="ts">
     export let variant: string = 'lines'
+    export let type: string = 'title'
 </script>
 
-<h1 class="site-title {variant ? `site-title--${variant}` : ''}">
+{#if type === 'title'}
+    <h1 class="site-title {variant ? `site-title--${variant}` : ''}">
         <strong>Houses</strong>
         <span>Of The</span>
         <strong>World</strong>
-</h1>
+    </h1>
+{:else}
+    <div class="site-title {variant ? `site-title--${variant}` : ''}">
+        <strong>Houses</strong>
+        <span>Of The</span>
+        <strong>World</strong>
+    </div>
+{/if}

src/components/organisms/Footer.svelte

@@ -9,7 +9,9 @@
 
 <footer class="footer">
     <div class="container grid">
+        <a href="/" class="footer__title" sveltekit:prefetch>
             <SiteTitle />
+        </a>
 
         <nav class="footer__links">
             <ul>

src/style/atoms/_site-title.scss

@@ -32,7 +32,8 @@
             }
             &:last-child {
                 display: inline-block;
-                margin-left: -6px;
+                margin-left: -7px;
+                color: $color-secondary;
             }
         }
         span {

src/style/organisms/_footer.scss

@@ -14,22 +14,22 @@
         height: 100%;
     }
 
-    .site-title {
+    // Site title
+    &__title {
         grid-column: span var(--columns);
         grid-row: 1;
+        display: block;
         margin-bottom: 40px;
+        text-decoration: none;
 
         @include bp (sm) {
             grid-column: 2 / span 5;
             grid-row: 1;
-            margin: 0;
+            margin: -3px 0 0;
-        }
-
-        strong:nth-of-type(2) {
-            color: $color-secondary;
         }
     }
 
+    // Links
     &__links {
         grid-column: span var(--columns);
         grid-row: 2;