diff --git a/assets/css/styles_override.css b/assets/css/styles_override.css
index 1c48fd7..ef8a8b8 100644
--- a/assets/css/styles_override.css
+++ b/assets/css/styles_override.css
@@ -1,95 +1,258 @@
-#backtotop a:after {
-    content: "⇧";
+/* Back to top – colour override to match footer theme */
+#backtotop a {
+  background-color: #0b214a;
+  border: 2px solid rgba(255, 255, 255, 0.25);
 }
+
+#backtotop.visible a:hover {
+  background-color: #1a3a7a;
+}
+
 .hero-title-content {
-    max-width: 1200px;
-    margin: 1vh auto;
+  max-width: 1200px;
+  margin: 1vh auto;
 }
 
 .hero-logo {
-    max-height: 200px;
+  max-height: 200px;
 }
 
 .navbar.is-fresh .navbar-item.has-dropdown .navbar-link {
-    color: var(--colorPrimaryDark);
+  color: var(--colorPrimaryDark);
 }
 
 .navbar.is-fresh .navbar-brand img {
-    max-height: 50px !important;
-    height: 50px;
+  max-height: 50px !important;
+  height: 50px;
 }
 
 @media only screen and (max-width: 850px) {
-    .social-media-icons {
-        width: 100%;
-    }
+  .social-media-icons {
+    width: 100%;
+  }
 }
 
 @media only screen and (max-width: 600px) {
-    .hero-logo {
-        max-height: 150px;
-    }
+  .hero-logo {
+    max-height: 150px;
+  }
 }
 
 @media only screen and (max-width: 400px) {
-    .hero-logo {
-        max-height: 120px;
-    }
+  .hero-logo {
+    max-height: 120px;
+  }
 }
 
 @media only screen and (max-width: 320px) {
-    .hero-logo {
-        max-height: 100px;
-    }
+  .hero-logo {
+    max-height: 100px;
+  }
 }
 
-/* Footer */
-@media (max-width: 850px){
-    .footer-column > ul.link-list {
-        padding-left: unset;
-    }
+/* =============================================
+   FOOTER — REDESIGN
+   ============================================= */
 
-    .footer-column {
-        padding-left: unset;
-    }
+.footer-redesign {
+  background-color: #0b214a;
+  color: #e2e8f0;
+  padding: 3rem 0 0;
+  font-family: inherit;
 }
 
-.footer-logo-column {
-    display: flex;
-    justify-content: flex-start;
-    flex-direction: column;
-    padding: 0.5rem;
+/* ---- Inner wrapper (brand + link grid) ---- */
+.footer-inner {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 2rem 2.5rem;
+  display: flex;
+  gap: 3rem;
+  align-items: flex-start;
 }
 
-.footer-column {
-    padding-left: 30px;
+/* ---- Brand block ---- */
+.footer-brand {
+  flex: 0 0 200px;
 }
 
-.social-media-icons {
-    display: flex;
+.footer-title {
+  font-size: 1.75rem;
+  font-weight: 800;
+  color: #ffffff;
+  margin-bottom: 1.5rem;
+  letter-spacing: -0.3px;
 }
 
-@media (max-width: 400px) {
-    ul {
-      padding-left: 0px !important;
-      padding-right: 30px;
-    }
-  }
+/* ---- Partner logo row ---- */
+.footer-partners {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1.25rem;
+  align-items: center;
+  /* Removed container-level opacity */
+}
 
-/* Icon size slightly enlargened for footer */
-#footer .social-media-icons {
-  font-size: 1.5em;
+.footer-partners a {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 44px;
+  /* Ensure touch target is large enough */
+  min-height: 44px;
 }
 
-#footer svg.icon {
-  fill: #1e87f0;
+.footer-link-group ul li a:focus-visible,
+.footer-socials a:focus-visible {
+  color: #ffffff;
+  outline: 2px solid rgba(255, 255, 255, 0.45);
+  outline-offset: 4px;
 }
 
-/* For information ⓘ, when icon is missing */
-#footer .icon {
-  color: #1e87f0;
+.footer-partners img {
+  max-height: 36px;
+  width: auto;
+  object-fit: contain;
+  filter: brightness(0) invert(1);
+  opacity: 0.7;
+  /* Individual logo is dimmed */
+  transition: opacity 0.2s ease;
 }
 
-.img-fit {
-    object-fit: contain;
+.footer-partners a:hover img,
+.footer-partners a:focus-visible img {
+  opacity: 1;
+  /* Lights up to full brightness on hover/focus */
+}
+
+/* ---- Link columns grid ---- */
+.footer-links {
+  flex: 1;
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 2rem;
+}
+
+/* ---- Column heading ---- */
+.footer-group-heading {
+  font-size: 0.68rem;
+  font-weight: 700;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: rgba(255, 255, 255, 0.45);
+  margin: 0 0 0.875rem 0;
+  padding: 0;
+}
+
+/* ---- Link list ---- */
+.footer-link-group ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.footer-link-group ul li a {
+  color: #c8d4e8;
+  text-decoration: none;
+  font-size: 0.9rem;
+  display: flex;
+  align-items: center;
+  min-height: 44px;
+  transition: color 0.2s ease;
+}
+
+.footer-link-group ul li a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+
+/* ---- Bottom bar ---- */
+.footer-bottom {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 1.25rem 2rem;
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 1rem;
+}
+
+/* ---- Social icons ---- */
+.footer-socials {
+  display: flex;
+  gap: 0.75rem;
+  align-items: center;
 }
+
+.footer-socials a {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 44px;
+  min-height: 44px;
+  color: #c8d4e8;
+  transition: color 0.2s ease;
+}
+
+.footer-socials a:hover {
+  color: #ffffff;
+}
+
+.footer-socials svg.icon {
+  width: 1.4rem;
+  height: 1.4rem;
+  fill: currentColor;
+}
+
+/* ---- Copyright ---- */
+.footer-copyright {
+  color: rgba(255, 255, 255, 0.45);
+  font-size: 0.85rem;
+}
+
+/* =============================================
+   FOOTER — MOBILE  (max-width: 768px)
+   ============================================= */
+@media (max-width: 768px) {
+  .footer-inner {
+    flex-direction: column;
+    gap: 2rem;
+    padding: 0 1.25rem 2rem;
+  }
+
+  .footer-brand {
+    flex: unset;
+    width: 100%;
+  }
+
+  .footer-partners {
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 1rem;
+  }
+
+  .footer-links {
+    width: 100%;
+    grid-template-columns: repeat(2, 1fr);
+    gap: 1.25rem 1rem;
+  }
+
+  .footer-link-group ul li a {
+    text-align: left;
+  }
+
+  .footer-bottom {
+    padding: 1.25rem;
+    flex-direction: column;
+    align-items: flex-start;
+  }
+}
+
+/* =============================================
+   UTILITIES
+   ============================================= */
+.img-fit {
+  object-fit: contain;
+}
\ No newline at end of file
diff --git a/config.yaml b/config.yaml
index 508ce79..489d717 100644
--- a/config.yaml
+++ b/config.yaml
@@ -137,6 +137,7 @@ languages:
             icon: discord
         quicklinks:
           column1:
+            heading: RESOURCES
             links:
               - text: Install
                 link: https://openms.readthedocs.io/en/latest/about/installation.html
@@ -145,6 +146,7 @@ languages:
               - text: Citing OpenMS
                 link: /citing-openms
           column2:
+            heading: COMMUNITY
             links:
               - text: Community
                 link: /communication
@@ -155,6 +157,7 @@ languages:
               - text: Core Developers
                 link: /core_developers
           column3:
+            heading: ABOUT
             links:
               - text: OpenMS Inc.
                 link: /about
@@ -165,6 +168,7 @@ languages:
               - text: Jobs
                 link: /jobs
           column4:
+            heading: LEGAL
             links:
               - text: Help
                 link: /help
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 6eb5884..d219add 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,60 +1,68 @@
-{{- $footer      := .Site.Params.footer }}
-{{- $title       := index $footer "title" }}
-{{- $deployedBy  := index $footer "deployedBy" }}
+{{- $footer := .Site.Params.footer }}
+{{- $title := index $footer "title" }}
+{{- $deployedBy := index $footer "deployedBy" }}
 {{- $sponsorLogo1 := index $footer "sponsorLogo1" }}
 {{- $sponsorLogo2 := index $footer "sponsorLogo2" }}
 {{- $sponsorLogo3 := index $footer "sponsorLogo3" }}
-{{- $quickLinks  := index $footer "quicklinks" }}
+{{- $quickLinks := index $footer "quicklinks" }}
 {{- $socialMedia := index $footer "socialmedia" }}
-{{- $logo        := index $footer "logo" }}
-{{- $navbarLogo  := .Site.Params.navbarlogo }}
 
-<footer id="footer" class="footer">
-  <div class="container is-max-widescreen">
-    <div id="footer-columns" class="columns">
-      <div class="footer-logo-column">
-        <!-- <img id="footer-logo" src="{{ printf "/images/%s" $logo | relURL }}" alt="{{ $title }} logo. {{ $navbarLogo.altText }}"> -->
-        <div><p style="font-weight: bolder; font-size: xx-large; color: aliceblue;">{{ $title }}</p></div>
-        <div><a href="https://www.netlify.com"> <img src="{{ $deployedBy }}" alt="Deploys by Netlify" style="width: 6rem;" /> </a></div>
-      </div>
-      <div class="footer-logo-column">
-        <div><a href="https://www.denbi.de"> <img src="{{ $sponsorLogo1 }}" alt="Supported by deNBI" style="width: 5rem;" /> </a></div>
-        <div><a href="https://elixir-europe.org/platforms/data/core-data-resources"> <img src="{{ $sponsorLogo2 }}" alt="Supported by Elixir" style="width: 3rem;" /> </a></div>
-        <div><a href="https://libis.uni-heidelberg.de/"> <img src="{{ $sponsorLogo3 }}" alt="Supported by LiBiS" style="width: 3rem;" /> </a></div>
+<footer id="footer" class="footer-redesign">
+  <div class="footer-inner">
+
+    <!-- Brand + Partner logos -->
+    <div class="footer-brand">
+      <div class="footer-title">{{ $title }}</div>
+      <div class="footer-partners">
+        <a href="https://www.netlify.com" target="_blank" rel="noopener noreferrer">
+          <img src="{{ $deployedBy }}" alt="Deployed by Netlify" />
+        </a>
+        <a href="https://www.denbi.de" target="_blank" rel="noopener noreferrer">
+          <img src="{{ $sponsorLogo1 }}" alt="Supported by deNBI" />
+        </a>
+        <a href="https://elixir-europe.org/platforms/data/core-data-resources" target="_blank"
+          rel="noopener noreferrer">
+          <img src="{{ $sponsorLogo2 }}" alt="Supported by Elixir" />
+        </a>
+        <a href="https://libis.uni-heidelberg.de/" target="_blank" rel="noopener noreferrer">
+          <img src="{{ $sponsorLogo3 }}" alt="Supported by LiBiS" />
+        </a>
       </div>
+    </div>
+
+    <!-- Link columns -->
+    <nav class="footer-links" aria-label="Footer navigation">
       {{- range $quickLinks }}
-        <div class="link-column">
-          <div class="footer-column">
-            <div class="footer-header">
-            </div>
-            <ul class="link-list">
-              {{- range .links }}
-              <li class="link-list">
-                <a class="footer-link" href="{{ .link }}">
-                  {{ .text }}
-                </a>
-              </li>
-              {{- end }}
-            </ul>
-          </div>
-        </div>
+      <div class="footer-link-group">
+        {{- if .heading }}
+        <h4 class="footer-group-heading">{{ .heading }}</h4>
+        {{- end }}
+        <ul>
+          {{- range .links }}
+          <li>
+            <a href="{{ .link }}">{{ .text }}</a>
+          </li>
+          {{- end }}
+        </ul>
+      </div>
+      {{- end }}
+    </nav>
+
+  </div>
+
+  <!-- Bottom bar: socials + copyright -->
+  <div class="footer-bottom">
+    <div class="footer-socials">
+      {{- range $socialMedia }}
+      <a href="{{ .link }}" aria-label="{{ .icon | humanize }}" target="_blank" rel="noopener noreferrer">
+        {{if .icon -}}
+        {{- partial "svg-icon" .icon -}}
+        {{- else -}}
+        <span class="icon">ⓘ</span>
+        {{- end }}
+      </a>
       {{- end }}
-        <div class="footer-actions">
-          <nav class="level is-mobile">
-            <div class="social-media-icons">
-              {{- range $socialMedia }}
-              <a class="level-item" href="{{ .link }}" aria-label="{{ .link }}">
-                {{if .icon -}}
-                {{- partial "svg-icon" .icon -}}
-                {{- else -}}
-                <span class="icon">ⓘ</span>
-                {{- end }}
-              </a>
-              {{- end }}
-            </div>
-          </nav>
-          <div class="copyright">&copy; {{ now.Year}} {{ $title }}. All rights reserved.</div>
-        </div>
     </div>
+    <div class="footer-copyright">&copy; {{ now.Year }} {{ $title }}. All rights reserved.</div>
   </div>
-</footer>
+</footer>
\ No newline at end of file