feat(footer): Carbon Blue surface + cleaner widget rendering

styles/components/site-footer.css

@@ -1,41 +1,27 @@
 /* Footer styles */
 
 .site-footer {
-  #footRight {
-    div {
-      @apply col-span-1 md:col-span-4 lg:col-span-1;
-
-      h3 {
-        @apply font-bold text-secondary-300 text-20px mb-4 pb-2 border-b border-b-secondary-300
-      }
-
-      a {
-        @apply text-footlinks hover:opacity-60;
-      }
-    }
-
-    .widget {
-      li {
-        @apply text-16px my-1 mb-2 leading-4;
-      }
-
-      h4 {
-        @apply font-bold text-18px text-secondary mb-2;
-      }
-
-      a {
-        @apply transition-colors duration-300 hover:text-success focus-visible:text-success;
-      }
-    }
-
-    .menu-footer-menu-container {
-      @apply grow;
-    }
-  }
-
-  .copyright {
-    p { @apply leading-none m-0 p-0; }
-
-    a { @apply text-white hover:text-primary-500 underline underline-offset-2; }
-  }
+	background: var(--color-surface, #121318);
+	color: var(--color-on-surface, #e3e1e9);
+	border-top: 1px solid var(--color-outline-variant, #444651);
+}
+.site-footer__title a { color: var(--color-on-surface, #e3e1e9); text-decoration: none; }
+.site-footer__desc { color: var(--color-on-surface-variant, #c5c5d3); }
+.site-footer__area h3,
+.site-footer__nav h3 {
+	color: var(--color-on-surface, #e3e1e9);
+	font-family: var(--font-sans);
+	font-weight: 700;
+	margin: 0 0 0.75rem;
+	padding-bottom: 0.5rem;
+	border-bottom: 1px solid var(--color-outline-variant, #444651);
+}
+.site-footer a { color: var(--color-primary, #b6c4ff); }
+.site-footer a:hover { text-decoration: underline; }
+.site-footer__copyright {
+	background: var(--color-surface-container-lowest, #0d0e13);
+	color: var(--color-on-surface-variant, #c5c5d3);
+	text-align: center;
+	padding: 0.75rem;
+	font-size: 0.875rem;
 }