✨feature: Refactor footer layout and styles for improved design consistency

styles/blocks/buttons.css

@@ -76,24 +76,6 @@
 
 .btn:active, .button:active { transform: scale(99%); }
 
-/* Back To Top Button */
-#backToTopBtn {
-    background: var(--color-primary);
-    border: none;
-    border-radius: 2em;
-    bottom: 2rem;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
-    color: #fff;
-    cursor: pointer;
-    display: none;
-    font-size: 1.1rem;
-    padding: 0.75em 1.5em;
-    position: fixed;
-    right: 2rem;
-    transition: opacity 0.2s;
-    z-index: 1000;
-}
-
 /**
  * Variants
  *
@@ -159,21 +141,35 @@ x-button:has(.button[data-button-width="full"]) { @apply w-full; }
     --button-hover-color:        var(--color-dark);
 }
 
-.back-to-top {
-    background: var(--color-primary, #3857BC);
-    border: none;
-    border-radius: 2em;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
-    color: #fff;
+/* Back To Top Button */
+#backToTopBtn {
+    align-items: center;
+    background: var(--color-secondary);
+    border: 1px solid transparent;
+    border-radius: 100%;
+    color: var(--color-white);
     cursor: pointer;
-    font-size: 1.1rem;
-    opacity: 0.85;
-    padding: 0.75em 1.5em;
+    display: flex;
+    font-size: 1rem;
+    height: 1rem;
+    justify-content: center;
+    line-height: 1;
+    outline: 1px solid transparent;
+    padding: 1rem;
     transition: opacity 0.2s, background 0.2s;
-}
+    width: 1rem;
 
-.back-to-top:hover, .back-to-top:focus {
-    background: var(--color-info, #233a7a);
-    opacity: 1;
-    outline: 2px solid var(--color-info, #233a7a);
+    i {
+        font-weight: bold;
+        display: inline-block;
+        margin: -4px 0 0 0;
+    }
+
+    &:hover, &:focus {
+        background: var(--color-secondary-800);
+        border: 1px solid var(--color-secondary);
+        color: var(--color-white);
+        opacity: 1;
+        outline: 1px solid var(--color-secondary);
+    }
 }