Add Responsive Footer Widget Columns

style.css

@@ -977,6 +977,46 @@ h4 {
   background: var(--surface);
   color: var(--text);
 }
+.footer-widgets {
+  padding: clamp(2.5rem, 6vw, 5rem) 1.5rem;
+  border-top: 1px solid var(--line);
+  background: var(--surface);
+}
+
+.footer-widgets-inner {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: clamp(2rem, 5vw, 5rem);
+  max-width: var(--wide);
+  margin: auto;
+}
+
+.footer-widget {
+  min-width: 0;
+}
+
+.footer-widget-title {
+  margin: 0 0 1rem;
+  font-family: "Alpha Lyrae", sans-serif;
+  font-size: 1.4rem;
+  font-weight: 500;
+  line-height: 1.16;
+}
+
+.footer-widget > :last-child {
+  margin-bottom: 0;
+}
+
+.footer-widget ul,
+.footer-widget ol {
+  padding-left: 1.25rem;
+  margin: 0;
+}
+
+.footer-widget li + li {
+  margin-top: 0.4rem;
+}
+
 .site-footer {
   padding: 2.5rem 1.5rem;
   border-top: 1px solid var(--line);
@@ -1047,6 +1087,10 @@ h4 {
   .hero {
     min-height: 55vh;
   }
+  .footer-widgets-inner {
+    grid-template-columns: 1fr;
+    gap: 2.5rem;
+  }
   .footer-inner {
     flex-direction: column;
   }