From 51fcf6dad75b3d51d0d6b6b6da222ef03de4b014 Mon Sep 17 00:00:00 2001
From: Randall Naar <rnd.naar@gmail.com>
Date: Fri, 31 Jul 2026 16:31:48 -0400
Subject: [PATCH] Updated footer.

---
 client/src/views/footer.js            | 165 +++++++++++++----
 client/src/views/network-selection.js |   2 +-
 flavors/blockstream/config.env        |   8 +-
 flavors/blockstream/extras.css        |  27 +--
 www/img/icons/fb.svg                  |   3 +
 www/img/icons/linkedin.svg            |   3 +
 www/img/icons/telegram.svg            |   3 +
 www/img/icons/x.svg                   |   3 +
 www/img/icons/yt.svg                  |   3 +
 www/style.css                         | 256 +++++++++++++++++++++++---
 10 files changed, 380 insertions(+), 93 deletions(-)
 create mode 100644 www/img/icons/fb.svg
 create mode 100644 www/img/icons/linkedin.svg
 create mode 100644 www/img/icons/telegram.svg
 create mode 100644 www/img/icons/x.svg
 create mode 100644 www/img/icons/yt.svg

diff --git a/client/src/views/footer.js b/client/src/views/footer.js
index 8292b3a94..e82bded9f 100644
--- a/client/src/views/footer.js
+++ b/client/src/views/footer.js
@@ -1,51 +1,140 @@
+import { ChevronDownIcon } from '../components/icons'
+
 const staticRoot = process.env.STATIC_ROOT || ''
-const links = process.env.FOOTER_LINKS ? JSON.parse(process.env.FOOTER_LINKS) : { [staticRoot+'img/github_blue.png']: 'https://github.com/blockstream/esplora' }
 
+const productLinks = [
+  ['Blockstream App', 'https://blockstream.com/app/'],
+  ['Blockstream Jade', 'https://blockstream.com/jade/'],
+  ['Blockstream Enterprise', 'https://blockstream.com/enterprise/'],
+  ['Blockstream AMP', 'https://blockstream.com/amp/'],
+  ['Blockstream Explorer', 'https://blockstream.info/'],
+  ['Greenlight', 'https://blockstream.com/lightning/greenlight/'],
+  ['Cryptocurrency Data Feed', 'https://blockstream.com/cryptofeed/'],
+  ['Liquid Network', 'https://blockstream.com/liquid/'],
+  ['Core Lightning', 'https://blockstream.com/lightning/'],
+  ['Elements', 'https://blockstream.com/elements/'],
+  ['Simplicity', 'https://simplicity-lang.org/']
+]
 
-export default ({ t, page }) =>
-  <footer className="footer">
-    <div className="container">
-      <div className="footer_container_content">
-        <div className="language">
-          <form className="footer-form" method="get">
-            { !process.browser && Object.entries(page.query).map(([k, v]) =>
-              k != 'lang' && <input type="hidden" name={k} value={v} />
-            ) }
-            <select className="language-selector font-h4" name="lang">
-              { Object.entries(t.langs).map(([ lang_id, lang_t ]) =>
-                <option value={lang_id} attrs={lang_id == t.lang_id ? { selected: true } : {}}>{lang_t`lang_name`}</option>
-              ) }
-            </select>
-            { !process.browser && <input type="submit" className="language-submit" value={t`Go`} /> }
-          </form>
-        </div>
-        <div className="footer_container_content_row">
+const developerLinks = [
+  ['Engineering', 'https://blog.blockstream.com/blockstream-research/'],
+  ['Liquid Documentation', 'https://docs.liquid.net/docs/'],
+  ['Core Lightning Documentation', 'https://docs.corelightning.org/docs/']
+]
+
+const companyLinks = [
+  ['Research', 'https://research.blockstream.com/'],
+  ['About', 'https://blockstream.com/about/'],
+  ['Careers', 'https://blockstream.com/careers/']
+]
+
+const resourceLinks = [
+  ['Help Center', 'https://help.blockstream.com/'],
+  ['Bitcoin Education', 'https://help.blockstream.com/education/'],
+  ['Glossary', 'https://help.blockstream.com/education/glossary/'],
+  ['Local', 'https://blockstream.com/local/'],
+  ['Brand Assets', 'https://design.blockstream.com/styleguide/branding/overview/']
+]
+
+const socialLinks = [
+  ['X', 'https://x.com/Blockstream', 'x.svg'],
+  ['LinkedIn', 'https://ca.linkedin.com/company/blockstream', 'linkedin.svg'],
+  ['Facebook', 'https://www.facebook.com/Blockstream/', 'fb.svg'],
+  ['Telegram', 'https://t.me/blockstream', 'telegram.svg'],
+  ['YouTube', 'https://www.youtube.com/channel/UCZNt3fZazX9cwWcC9vjDJ4Q', 'yt.svg']
+]
 
-          <div className="footer_container_content_row_social-media_container">
-            { Object.entries(links).map(([ imgSrc, url ]) =>
-                <a className="footer_container_content_row_social-media_link" href={url} target="_blank">
-                  <img className="footer_container_content_row_social-media_item" alt="" src={imgSrc} />
-                </a>
+const externalLink = ([ label, href ]) => <a href={href}>{label}</a>
+
+const linkSection = (title, sectionLinks, className = '') =>
+  <section className={`blockstream-footer-section ${className}`}>
+    <h2>{title}</h2>
+    <div className="blockstream-footer-links">
+      { sectionLinks.map(externalLink) }
+    </div>
+  </section>
+
+const productSection = () =>
+  <section className="blockstream-footer-section blockstream-footer-products">
+    <h2>Products</h2>
+    <div className="blockstream-footer-product-columns">
+      <div className="blockstream-footer-links">
+        { productLinks.slice(0, 6).map(externalLink) }
+      </div>
+      <div className="blockstream-footer-links">
+        { productLinks.slice(6).map(externalLink) }
+      </div>
+    </div>
+  </section>
+
+const languageForm = ({ t, page }) =>
+  <form className="language-form" method="get">
+    { !process.browser && Object.entries(page.query).map(([ k, v ]) =>
+      k != 'lang' && <input type="hidden" name={k} value={v} />
+    ) }
+    <select className="language-selector" name="lang">
+      { Object.entries(t.langs).map(([ lang_id, lang_t ]) =>
+        <option value={lang_id} attrs={lang_id == t.lang_id ? { selected: true } : {}}>{lang_t`lang_name`}</option>
+      ) }
+    </select>
+    <ChevronDownIcon className="language-selector-arrow" />
+    { !process.browser && <input type="submit" className="language-submit" value={t`Go`} /> }
+  </form>
+
+const blockstreamFooter = opt =>
+  <footer className="footer blockstream-footer">
+    <div className="container blockstream-footer-container">
+      <div className="blockstream-footer-content">
+        <section className="blockstream-footer-brand">
+          <a
+            className="blockstream-footer-logo"
+            href="https://blockstream.com/"
+            aria-label="Blockstream"
+          >
+            <img src={staticRoot + 'img/icons/logo.svg'} alt="Blockstream" />
+          </a>
+
+          <div className="blockstream-footer-socials">
+            { socialLinks.map(([ label, href, icon ]) =>
+              <a href={href} rel="noopener noreferrer" aria-label={label}>
+                <img src={staticRoot + 'img/icons/' + icon} alt="" />
+              </a>
             ) }
           </div>
 
-          { (process.env.ONION_V3) &&
-            <div className="footer_container_content_row_onion_container">
-              <div className="footer_container_content_row_onion_icon"></div>
-              <div className="footer_container_content_row_onion_link-container">
-                { process.env.ONION_V3 && <a className="footer_container_content_row_onion_link font-p4" href={ process.env.ONION_V3 } target="_blank">Onion V3</a> }
-              </div>
-            </div>
-          }
+          <div className="language">
+            { languageForm(opt) }
+          </div>
+
+          <a
+            className="blockstream-footer-contact"
+            href="https://blockstream.com/contact/"
+            rel="noopener noreferrer"
+          >
+            Contact us
+          </a>
+        </section>
 
+        <div className="blockstream-footer-product-sections">
+        { productSection() }
+        { linkSection('Developers', developerLinks, 'blockstream-footer-developers') }
+        { linkSection('Company', companyLinks, 'blockstream-footer-company') }
+        { linkSection('Resources', resourceLinks, 'blockstream-footer-resources') }
         </div>
-        <div className="footer_container_content_copyright font-p3">
-          <div>
-          { process.env.TERMS && <span><a href={ process.env.TERMS } target="_blank">Terms &amp; </a></span> }
-          { process.env.PRIVACY && <span><a href={ process.env.PRIVACY } target="_blank">Privacy</a></span> }
-          </div>
-          <div>{ process.env.SITE_FOOTER || t`Powered by esplora` }</div>
+      </div>
+
+      <div className="blockstream-footer-legal">
+        <div className="blockstream-footer-policies">
+          <a href={process.env.TERMS || 'https://blockstream.com/terms/'}>Terms</a>
+          <span aria-hidden="true"></span>
+          <a href={process.env.PRIVACY || 'https://blockstream.com/privacy/'}>Privacy</a>
         </div>
+        <p>
+          { process.env.SITE_FOOTER ||
+            `© ${new Date().getFullYear()} Blockstream Corporation Inc. All rights reserved.` }
+        </p>
       </div>
     </div>
   </footer>
+
+export default blockstreamFooter;
diff --git a/client/src/views/network-selection.js b/client/src/views/network-selection.js
index f885d5f57..deae09ba2 100644
--- a/client/src/views/network-selection.js
+++ b/client/src/views/network-selection.js
@@ -18,7 +18,7 @@ export default ({ t, page }) => (
       <ul className="main-nav">
         <li id={activeId} className={`nav-item active`}>
           <button
-            className="nav-link font-h4 network-selector-toggle"
+            className="nav-link network-selector-toggle"
             type="button"
             aria-haspopup="true"
             aria-expanded="false"
diff --git a/flavors/blockstream/config.env b/flavors/blockstream/config.env
index 4e411ac10..bae7fb439 100755
--- a/flavors/blockstream/config.env
+++ b/flavors/blockstream/config.env
@@ -23,15 +23,9 @@ export MENU_ITEMS='{
 , "Liquid Testnet": "/liquidtestnet/"
 }'
 
-export FOOTER_LINKS='{
-  "/img/x-white.svg": "https://x.com/Blockstream"
-, "/img/linkedin_blue.png": "https://ca.linkedin.com/company/blockstream"
-, "/img/f1b_blue.png": "https://www.facebook.com/Blockstream/"
-, "/img/github_blue.png": "https://github.com/Blockstream/esplora"
-}'
-
 export SITE_TITLE="$SITE_TITLE - Blockstream.info"
 
+# Currently unused by the footer; kept for posterity.
 export ONION_V3="http://explorerzydxu5ecjrkwceayqybizmpjjznk5izmitf2modhcusuqlid.onion"
 
 export CUSTOM_ASSETS="$CUSTOM_ASSETS flavors/blockstream/www/*"
diff --git a/flavors/blockstream/extras.css b/flavors/blockstream/extras.css
index 4b7e496b8..4f230f914 100644
--- a/flavors/blockstream/extras.css
+++ b/flavors/blockstream/extras.css
@@ -1,31 +1,6 @@
-.footer-logo::before {
-  width: 220px;
-  height: 93px;
-  background-image: url(img/blockstream-full-logo.png);
-  background-size: 100%;
-  content: ' ';
-  display: block;
-}
-.footer-logo {
-  margin-right: 0px;
-}
-.footer-links {
-  margin-top: 5px;
-}
-@media only screen and (max-width: 1000px) {
-  .footer-logo::before {
-    width: 200px;
-    height: 83px;
-  }
-}
-
 @media only screen and (max-width: 900px) {
-  .footer-logo::before {
-    margin-top: 30px;
-  }
-
   .navbar-brand::before {
     width: 45px;
     background-repeat: no-repeat;
   }
-}
\ No newline at end of file
+}
diff --git a/www/img/icons/fb.svg b/www/img/icons/fb.svg
new file mode 100644
index 000000000..92729e15d
--- /dev/null
+++ b/www/img/icons/fb.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.75 0C7.82164 0 5.93657 0.571828 4.33319 1.64317C2.72982 2.71451 1.48013 4.23726 0.742179 6.01884C0.00422452 7.80042 -0.188858 9.76082 0.187348 11.6521C0.563554 13.5434 1.49215 15.2807 2.85571 16.6443C4.21928 18.0079 5.95656 18.9365 7.84787 19.3127C9.73919 19.6889 11.6996 19.4958 13.4812 18.7578C15.2627 18.0199 16.7855 16.7702 17.8568 15.1668C18.9282 13.5634 19.5 11.6784 19.5 9.75C19.4973 7.16498 18.4692 4.68661 16.6413 2.85872C14.8134 1.03084 12.335 0.00272983 9.75 0ZM10.5 17.9653V12H12.75C12.9489 12 13.1397 11.921 13.2803 11.7803C13.421 11.6397 13.5 11.4489 13.5 11.25C13.5 11.0511 13.421 10.8603 13.2803 10.7197C13.1397 10.579 12.9489 10.5 12.75 10.5H10.5V8.25C10.5 7.85218 10.658 7.47064 10.9393 7.18934C11.2206 6.90804 11.6022 6.75 12 6.75H13.5C13.6989 6.75 13.8897 6.67098 14.0303 6.53033C14.171 6.38968 14.25 6.19891 14.25 6C14.25 5.80109 14.171 5.61032 14.0303 5.46967C13.8897 5.32902 13.6989 5.25 13.5 5.25H12C11.2044 5.25 10.4413 5.56607 9.87868 6.12868C9.31608 6.69129 9 7.45435 9 8.25V10.5H6.75C6.55109 10.5 6.36033 10.579 6.21967 10.7197C6.07902 10.8603 6 11.0511 6 11.25C6 11.4489 6.07902 11.6397 6.21967 11.7803C6.36033 11.921 6.55109 12 6.75 12H9V17.9653C6.88575 17.7723 4.92728 16.7717 3.53198 15.1715C2.13667 13.5714 1.41195 11.4949 1.50855 9.37409C1.60515 7.25324 2.51564 5.25127 4.05064 3.7846C5.58563 2.31793 7.62696 1.49947 9.75 1.49947C11.8731 1.49947 13.9144 2.31793 15.4494 3.7846C16.9844 5.25127 17.8949 7.25324 17.9915 9.37409C18.0881 11.4949 17.3633 13.5714 15.968 15.1715C14.5727 16.7717 12.6143 17.7723 10.5 17.9653Z" fill="#FAFAFA"/>
+</svg>
diff --git a/www/img/icons/linkedin.svg b/www/img/icons/linkedin.svg
new file mode 100644
index 000000000..e87bfd32c
--- /dev/null
+++ b/www/img/icons/linkedin.svg
@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 0H1.5C1.10218 0 0.720644 0.158035 0.43934 0.43934C0.158035 0.720644 0 1.10218 0 1.5V18C0 18.3978 0.158035 18.7794 0.43934 19.0607C0.720644 19.342 1.10218 19.5 1.5 19.5H18C18.3978 19.5 18.7794 19.342 19.0607 19.0607C19.342 18.7794 19.5 18.3978 19.5 18V1.5C19.5 1.10218 19.342 0.720644 19.0607 0.43934C18.7794 0.158035 18.3978 0 18 0ZM18 18H1.5V1.5H18V18ZM6.75 8.25V14.25C6.75 14.4489 6.67098 14.6397 6.53033 14.7803C6.38968 14.921 6.19891 15 6 15C5.80109 15 5.61032 14.921 5.46967 14.7803C5.32902 14.6397 5.25 14.4489 5.25 14.25V8.25C5.25 8.05109 5.32902 7.86032 5.46967 7.71967C5.61032 7.57902 5.80109 7.5 6 7.5C6.19891 7.5 6.38968 7.57902 6.53033 7.71967C6.67098 7.86032 6.75 8.05109 6.75 8.25ZM15 10.875V14.25C15 14.4489 14.921 14.6397 14.7803 14.7803C14.6397 14.921 14.4489 15 14.25 15C14.0511 15 13.8603 14.921 13.7197 14.7803C13.579 14.6397 13.5 14.4489 13.5 14.25V10.875C13.5 10.3777 13.3025 9.90081 12.9508 9.54918C12.5992 9.19754 12.1223 9 11.625 9C11.1277 9 10.6508 9.19754 10.2992 9.54918C9.94754 9.90081 9.75 10.3777 9.75 10.875V14.25C9.75 14.4489 9.67098 14.6397 9.53033 14.7803C9.38968 14.921 9.19891 15 9 15C8.80109 15 8.61032 14.921 8.46967 14.7803C8.32902 14.6397 8.25 14.4489 8.25 14.25V8.25C8.25093 8.06629 8.31925 7.88931 8.44201 7.75264C8.56477 7.61596 8.73342 7.5291 8.91598 7.50852C9.09853 7.48794 9.28229 7.53508 9.43239 7.641C9.5825 7.74691 9.68851 7.90423 9.73031 8.08313C10.2377 7.73894 10.8292 7.53947 11.4414 7.50611C12.0536 7.47276 12.6633 7.60679 13.205 7.89381C13.7468 8.18083 14.2001 8.61 14.5164 9.13523C14.8326 9.66046 14.9998 10.2619 15 10.875ZM7.125 5.625C7.125 5.8475 7.05902 6.06501 6.9354 6.25002C6.81179 6.43502 6.63609 6.57922 6.43052 6.66436C6.22495 6.74951 5.99875 6.77179 5.78052 6.72838C5.56229 6.68498 5.36184 6.57783 5.2045 6.4205C5.04717 6.26316 4.94002 6.06271 4.89662 5.84448C4.85321 5.62625 4.87549 5.40005 4.96064 5.19448C5.04578 4.98891 5.18998 4.81321 5.37498 4.6896C5.55999 4.56598 5.7775 4.5 6 4.5C6.29837 4.5 6.58452 4.61853 6.7955 4.8295C7.00647 5.04048 7.125 5.32663 7.125 5.625Z" fill="#FAFAFA"/>
+</svg>
diff --git a/www/img/icons/telegram.svg b/www/img/icons/telegram.svg
new file mode 100644
index 000000000..90edc1eb0
--- /dev/null
+++ b/www/img/icons/telegram.svg
@@ -0,0 +1,3 @@
+<svg width="21" height="19" viewBox="0 0 21 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.7081 0.20514C20.5919 0.104798 20.4505 0.0380637 20.2992 0.0121272C20.1479 -0.0138094 19.9923 0.00203484 19.8494 0.0579529L0.849978 7.49327C0.580714 7.59797 0.35275 7.78731 0.200407 8.03279C0.0480643 8.27826 -0.0204126 8.56658 0.00528593 8.85434C0.0309844 9.1421 0.149467 9.41373 0.342897 9.62832C0.536327 9.84292 0.794234 9.98887 1.07779 10.0442L6.0006 11.0108V16.4998C5.99963 16.7988 6.08848 17.0912 6.25564 17.3391C6.4228 17.587 6.66056 17.779 6.9381 17.8901C7.21522 18.0033 7.51997 18.0305 7.81274 17.9681C8.1055 17.9057 8.37272 17.7567 8.57967 17.5405L10.9534 15.0786L14.7194 18.3748C14.9911 18.6158 15.3415 18.7492 15.7047 18.7498C15.8638 18.7497 16.022 18.7247 16.1734 18.6758C16.4209 18.5972 16.6434 18.4553 16.8189 18.264C16.9944 18.0727 17.1168 17.8387 17.1737 17.5855L20.979 1.03108C21.0131 0.88178 21.0058 0.726034 20.9581 0.580534C20.9104 0.435035 20.824 0.305267 20.7081 0.20514ZM14.9762 3.58014L6.57717 9.59514L1.92717 8.68295L14.9762 3.58014ZM7.5006 16.4998V12.0486L9.82467 14.0867L7.5006 16.4998ZM15.7065 17.2498L7.95529 10.453L19.1115 2.45702L15.7065 17.2498Z" fill="#FAFAFA"/>
+</svg>
diff --git a/www/img/icons/x.svg b/www/img/icons/x.svg
new file mode 100644
index 000000000..645af7e2e
--- /dev/null
+++ b/www/img/icons/x.svg
@@ -0,0 +1,3 @@
+<svg width="17" height="19" viewBox="0 0 17 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.3889 16.8478L10.5201 7.62469L16.311 1.25438C16.442 1.10674 16.5095 0.913434 16.4989 0.716365C16.4883 0.519295 16.4005 0.334346 16.2544 0.201615C16.1084 0.0688843 15.9159 -0.00092985 15.7187 0.00730857C15.5215 0.015547 15.3355 0.101174 15.201 0.245625L9.6848 6.31312L5.88886 0.347813C5.82117 0.24127 5.72769 0.153535 5.61707 0.0927355C5.50645 0.0319361 5.38227 3.91221e-05 5.25605 8.87202e-08H0.756048C0.621574 -6.53095e-05 0.489556 0.0360256 0.373817 0.104494C0.258079 0.172962 0.162878 0.271288 0.0981828 0.389177C0.0334877 0.507066 0.00167865 0.64018 0.00608614 0.774582C0.0104936 0.908984 0.0509556 1.03973 0.123235 1.15313L5.99199 10.3753L0.201048 16.7503C0.133423 16.823 0.0808886 16.9083 0.0464895 17.0014C0.0120905 17.0945 -0.00348926 17.1935 0.000653776 17.2927C0.00479681 17.3918 0.0285803 17.4892 0.0706251 17.5791C0.11267 17.669 0.17214 17.7496 0.245589 17.8164C0.319038 17.8831 0.405005 17.9346 0.498507 17.9679C0.592008 18.0012 0.691186 18.0156 0.79029 18.0103C0.889395 18.0049 0.986456 17.98 1.07585 17.9369C1.16524 17.8937 1.24518 17.8333 1.31105 17.7591L6.8273 11.6916L10.6232 17.6569C10.6915 17.7625 10.7852 17.8494 10.8958 17.9093C11.0064 17.9693 11.1303 18.0005 11.256 18H15.756C15.8904 18 16.0222 17.9638 16.1378 17.8954C16.2534 17.827 16.3485 17.7288 16.4132 17.611C16.4779 17.4933 16.5097 17.3604 16.5054 17.2261C16.5012 17.0918 16.4609 16.9612 16.3889 16.8478ZM11.6676 16.5L2.12199 1.5H4.84074L14.3901 16.5H11.6676Z" fill="#FAFAFA"/>
+</svg>
diff --git a/www/img/icons/yt.svg b/www/img/icons/yt.svg
new file mode 100644
index 000000000..328808e5f
--- /dev/null
+++ b/www/img/icons/yt.svg
@@ -0,0 +1,3 @@
+<svg width="21" height="17" viewBox="0 0 21 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.9163 7.62563L9.41625 4.62563C9.30327 4.55025 9.17195 4.50697 9.03629 4.5004C8.90064 4.49382 8.76575 4.52421 8.64601 4.58831C8.52628 4.65241 8.4262 4.74783 8.35645 4.86436C8.2867 4.9809 8.24991 5.11419 8.25 5.25V11.25C8.24991 11.3858 8.2867 11.5191 8.35645 11.6356C8.4262 11.7522 8.52628 11.8476 8.64601 11.9117C8.76575 11.9758 8.90064 12.0062 9.03629 11.9996C9.17195 11.993 9.30327 11.9498 9.41625 11.8744L13.9163 8.87438C14.0191 8.80592 14.1035 8.71309 14.1618 8.60417C14.2202 8.49524 14.2507 8.37358 14.2507 8.25C14.2507 8.12643 14.2202 8.00477 14.1618 7.89584C14.1035 7.78691 14.0191 7.69409 13.9163 7.62563ZM9.75 9.84844V6.65625L12.1481 8.25L9.75 9.84844ZM20.4684 2.7675C20.3801 2.42189 20.2109 2.10224 19.9747 1.83491C19.7385 1.56758 19.4421 1.36024 19.11 1.23C15.8962 -0.0112465 10.7812 3.56619e-06 10.5 3.56619e-06C10.2188 3.56619e-06 5.10375 -0.0112465 1.89 1.23C1.5579 1.36024 1.26153 1.56758 1.02534 1.83491C0.789145 2.10224 0.619899 2.42189 0.531563 2.7675C0.28875 3.70313 0 5.41313 0 8.25C0 11.0869 0.28875 12.7969 0.531563 13.7325C0.619767 14.0783 0.788954 14.3981 1.02515 14.6656C1.26136 14.9331 1.5578 15.1406 1.89 15.2709C4.96875 16.4588 9.7875 16.5 10.4381 16.5H10.5619C11.2125 16.5 16.0341 16.4588 19.11 15.2709C19.4422 15.1406 19.7386 14.9331 19.9748 14.6656C20.211 14.3981 20.3802 14.0783 20.4684 13.7325C20.7113 12.795 21 11.0869 21 8.25C21 5.41313 20.7113 3.70313 20.4684 2.7675ZM19.0163 13.3613C18.9877 13.4763 18.9323 13.5829 18.8545 13.6724C18.7768 13.7618 18.679 13.8316 18.5691 13.8759C15.6019 15.0216 10.5553 15.0009 10.5066 15.0009H10.5C10.4494 15.0009 5.40656 15.0197 2.4375 13.8759C2.3276 13.8316 2.22977 13.7618 2.15204 13.6724C2.07431 13.5829 2.01888 13.4763 1.99031 13.3613C1.7625 12.5053 1.5 10.9284 1.5 8.25C1.5 5.57157 1.7625 3.99469 1.98375 3.14344C2.01179 3.02774 2.06697 2.92037 2.14473 2.83022C2.2225 2.74007 2.3206 2.66972 2.43094 2.625C5.29219 1.51969 10.0866 1.5 10.4794 1.5H10.5047C10.5553 1.5 15.6028 1.48313 18.5672 2.625C18.6771 2.66936 18.7749 2.73913 18.8526 2.82859C18.9304 2.91806 18.9858 3.02467 19.0144 3.13969C19.2375 3.99469 19.5 5.57157 19.5 8.25C19.5 10.9284 19.2375 12.5053 19.0163 13.3566V13.3613Z" fill="#FAFAFA"/>
+</svg>
diff --git a/www/style.css b/www/style.css
index 8a3cb0aa3..26eb96253 100644
--- a/www/style.css
+++ b/www/style.css
@@ -204,14 +204,6 @@ ul {
   }
 }
 
-.font-h4 { font-size: 20px; font-weight: 700; font-family: "Chakra Petch", sans-serif; line-height: normal; letter-spacing: normal; font-style: normal; }
-
-@media only screen and (max-width: 475px) {
-  .font-h4 {
-    font-size: 16px;
-  }
-}
-
 .font-h5 { font-size: 16px; font-weight: 700; font-family: "Rigid Square", sans-serif; line-height: normal; letter-spacing: normal; font-style: normal; }
 
 @media only screen and (max-width: 475px) {
@@ -1493,25 +1485,41 @@ table th {
   width: 100%;
 }
 
-.footer-logo {
-  min-width: 215px;
-  margin-right: 15px;
+.language {
+  margin-top: 12px;
 }
 
-.footer-links {
-  text-align: center;
-  margin-top: -29px;
+.language-form {
+  position: relative;
 }
 
 .language-selector, .language-submit {
   color: #FFF;
   background-color: var(--background-color);
-  border: 1px solid #22242c;
-  border-radius: 4px;
+  border: 1px solid var(--surface-secondary-color);
+  border-radius: 8px;
 }
+
 .language-selector {
-  padding: 3px 0 3px 5px;
+  appearance: none;
+  -webkit-appearance: none;
+  font-family: "Inter";
+  padding: 12px 8px;
+  font-size: 14px;
+  font-weight: 400;
+  background-color: var(--surface-primary-color);
+  color: var(--foreground-muted);
+  width: 100%;
+  cursor: pointer;
 }
+
+.language-selector-arrow {
+  position: absolute;
+  right: 15px;
+  top: 20px;
+  pointer-events: none;
+}
+
 .language-submit {
   padding: 4px 10px 3px;
   line-height: normal;
@@ -1531,10 +1539,6 @@ table th {
   margin-bottom: 30px;
 }
 
-.footer-form {
-  width: auto;
-}
-
 .footer_container_content_row {
   display: flex;
   justify-content: space-between;
@@ -4699,3 +4703,213 @@ a.back-link img{
     animation: none;
   }
 }
+
+/* Keep main content and its sibling footer aligned to the same parent width. */
+.explorer-container > .explorer-main,
+.explorer-container > .footer {
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.explorer-container > .explorer-main {
+  padding-bottom: 0;
+}
+
+.explorer-container > .blockstream-footer {
+  height: auto;
+  color: #fff;
+  background: var(--background-color);
+  border-top: 0;
+  align-items: stretch;
+  flex: 0 0 auto;
+}
+
+.explorer-container > .blockstream-footer > .blockstream-footer-container {
+  width: 100%;
+  margin-top: 100px;
+  padding-bottom: 80px;
+  box-sizing: border-box;
+  display: block;
+}
+
+.blockstream-footer-content {
+  display: flex;
+  column-gap: 32px;
+  align-items: flex-start;
+  width: 100%;
+}
+
+.blockstream-footer a,
+.blockstream-footer a:link,
+.blockstream-footer a:visited {
+  color: #f5f2fa;
+}
+
+.blockstream-footer a:hover,
+.blockstream-footer a:focus-visible  {
+  color: var(--accent-color);
+}
+
+.blockstream-footer-brand {
+  min-width: 0;
+}
+
+.blockstream-footer-logo {
+  display: block;
+  width: 128px;
+}
+
+.blockstream-footer-logo img {
+  display: block;
+  width: 100%;
+  height: auto;
+  filter: grayscale(1) brightness(0) invert(1);
+}
+
+.blockstream-footer-socials {
+  display: flex;
+  gap: 10px;
+  margin-top: 16px;
+}
+
+.blockstream-footer-socials a {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  box-sizing: border-box;
+  color: #fff;
+  border: 1px solid #4f4268;
+  border-radius: 5px;
+  transition: border-color 0.2s ease, background-color 0.2s ease;
+}
+
+.blockstream-footer-socials a:hover,
+.blockstream-footer-socials a:focus {
+  color: #fff;
+  background: var(--accent-color);
+  border-color: var(--accent-color);
+}
+
+.blockstream-footer-socials img {
+  display: block;
+  width: 17px;
+  height: 17px;
+  object-fit: contain;
+  filter: grayscale(1) brightness(0) invert(1);
+}
+
+a.blockstream-footer-contact,
+a.blockstream-footer-contact:link,
+a.blockstream-footer-contact:visited,
+a.blockstream-footer-contact:hover,
+a.blockstream-footer-contact:focus {
+  display: inline-block;
+  margin-top: 12px;
+  color: var(--foreground-link-color);
+  font-size: 16px;
+  text-decoration: underline;
+  text-underline-offset: 5px;
+}
+
+.blockstream-footer-legal {
+  margin-top: var(--page-gap);
+  color: #f5f2fa;
+  font-size: 12px;
+  display: flex;
+  justify-content: space-between;
+}
+
+.blockstream-footer-policies {
+  display: flex;
+  align-items: center;
+  gap: 15px;
+}
+
+.blockstream-footer-policies span {
+  width: 1px;
+  height: 22px;
+  background: #f5f2fa;
+}
+
+.blockstream-footer-section {
+  padding-top: 14px;
+}
+
+.blockstream-footer-product-sections {
+  display: flex;
+  margin-left: auto;
+  gap: 44px;
+}
+
+.blockstream-footer-section h2 {
+  margin: 0;
+  color: #fff;
+  font-family: "Inter", sans-serif;
+  font-size: 18px;
+  font-weight: 400;
+  line-height: 1.2;
+}
+
+.blockstream-footer-links {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 12px;
+  margin-top: 32px;
+}
+
+.blockstream-footer-links a {
+  font-size: 11px;
+  font-weight: 400;
+  line-height: 1.5;
+  white-space: nowrap;
+}
+
+.blockstream-footer-product-columns {
+  display: flex;
+  column-gap: 44px;
+  margin-top: 32px;
+}
+
+.blockstream-footer-product-columns .blockstream-footer-links {
+  min-width: 0;
+  margin-top: 0;
+}
+
+@media only screen and (max-width: 790px) {
+  .blockstream-footer-product-sections {
+    flex-wrap: wrap;
+    margin-left: auto;
+  }
+}
+
+@media only screen and (max-width: 1328px) {
+  .explorer-container > .blockstream-footer > .blockstream-footer-container {
+    margin-top: 0;
+    padding-top: 72px;
+    padding-bottom: 56px;
+  }
+
+  .blockstream-footer-content {
+    flex-wrap: wrap;
+    column-gap: 32px;
+    row-gap: 42px;
+  }
+
+  .blockstream-footer-brand,
+  .blockstream-footer-products {
+    flex-basis: 100%;
+  }
+
+  .blockstream-footer-developers,
+  .blockstream-footer-company,
+  .blockstream-footer-resources {
+    flex: 1 1 calc(50% - 16px);
+  }
+
+  .blockstream-footer-product-columns {
+    column-gap: 24px;
+  }
+}