diff --git a/site/assets/scss/_footer.scss b/site/assets/scss/_footer.scss
index 0ff6882342..110025e031 100644
--- a/site/assets/scss/_footer.scss
+++ b/site/assets/scss/_footer.scss
@@ -2,18 +2,4 @@
 // Footer
 //
 
-.bd-footer {
-  @include font-size(.875rem);
-  position: sticky;
-  top: 100vh;
-  font-weight: 700;
-
-  a {
-    color: var(--#{$prefix}link-color); // Boosted mod: use CSS var instead of $link-color
-
-    &:hover,
-    &:focus {
-      color: var(--#{$prefix}link-hover-color); // Boosted mod: use CSS var instead of $link-hover-color
-    }
-  }
-}
+// Boosted mod: no .bd-footer
diff --git a/site/layouts/partials/footer.html b/site/layouts/partials/footer.html
index 659704024d..bed93a4388 100644
--- a/site/layouts/partials/footer.html
+++ b/site/layouts/partials/footer.html
@@ -1,56 +1,113 @@
-<footer class="bd-footer py-3 py-md-4 mt-5 bg-dark">
-  <div class="container-xxl py-1">
-    <div class="row">
-      <div class="col-lg-3 mb-3">
-        <p class="mb-1">This documentation is an adaptation made by Orange.</p>
-        <p class="mb-1">Original version designed and built with all the love in the world by the <a href="https://github.com/orgs/twbs/people">Bootstrap core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">their contributors</a>.</p>
-        <p class="mb-md-1">
-          Orange modified code licensed <a href="{{ .Site.Params.repo }}/blob/main/LICENSE" target="_blank" rel="license noopener">MIT</a>
-          —&nbsp;just like <a href="https://github.com/twbs/bootstrap/blob/main/LICENSE" target="_blank" rel="license noopener">Bootstrap</a>,
-          docs <a href="https://creativecommons.org/licenses/by/3.0/" target="_blank" rel="license noopener">CC BY 3.0</a>.
-        </p>
-        <ul class="bd-footer-links ps-0 mb-0">
-          <li class="list-inline-item me-3 mb-3 mb-md-0 d-block d-md-inline-block"><span>Currently v{{ .Site.Params.current_version }}</span></li>
-          <li class="list-inline-item mt-3 mt-md-0"><a href="https://www.netlify.com">
-            <img src="https://www.netlify.com/img/global/badges/netlify-dark.svg" alt="Deploys by Netlify" width="89" height="40"/>
-          </a></li>
-        </ul>
+<footer class="footer bg-dark navbar-dark bd-footer">
+  <h2 class="visually-hidden">Boosted sitemap & information</h2>
+  <div class="container-xxl footer-nav">
+    <nav class="accordion accordion-dark" id="sitemapAccordion" aria-label="Boosted sitemap footer">
+      <div class="row">
+        <div class="footer-column col-md-6 col-lg-2">
+          <h3 class="accordion-header footer-heading" id="headingLinks">
+            <button class="accordion-button collapsed container-xxl px-1 d-md-none" type="button"
+                    data-bs-toggle="collapse" data-bs-target="#collapseLinks" aria-expanded="true"
+                    aria-controls="collapseLinks">
+              Links
+            </button>
+            <span class="d-none d-md-flex">Links</span>
+          </h3>
+          <div id="collapseLinks" class="container-xxl accordion-collapse collapse" data-bs-parent="#sitemapAccordion">
+            <ul class="navbar-nav">
+              <li><a class="nav-link" href="/" aria-describedby="headingLinks">Home</a></li>
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/"
+                     aria-describedby="headingLinks">Docs</a></li>
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/examples/"
+                     aria-describedby="headingLinks">Examples</a></li>
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/guidelines/"
+                     aria-describedby="headingLinks">Design guidelines</a></li>
+              <!-- Boosted mod: removed .Site.Params.themes and .Site.Params.blog -->
+            </ul>
+          </div>
+        </div>
+        <div class="footer-column col-md-6 col-lg-2">
+          <h3 class="accordion-header footer-heading" id="headingGuides">
+            <button class="accordion-button collapsed container-xxl px-1 d-md-none" type="button"
+                    data-bs-toggle="collapse" data-bs-target="#collapseGuides" aria-expanded="true"
+                    aria-controls="collapseGuides">
+              Guides
+            </button>
+            <span class="d-none d-md-flex">Guides</span>
+          </h3>
+          <div id="collapseGuides" class="container-xxl accordion-collapse collapse" data-bs-parent="#sitemapAccordion">
+            <ul class="navbar-nav">
+
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/getting-started/"
+                     aria-describedby="headingGuides">Getting started</a></li>
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/getting-started/webpack/"
+                     aria-describedby="headingGuides">Webpack</a></li>
+              <li><a class="nav-link" href="/docs/{{ .Site.Params.docs_version }}/getting-started/parcel/"
+                     aria-describedby="headingGuides">Parcel</a></li>
+            </ul>
+          </div>
+        </div>
+        <div class="footer-column col-md-6 col-lg-2">
+          <h3 class="accordion-header footer-heading" id="headingProjects">
+            <button class="accordion-button collapsed container-xxl px-1 d-md-none" type="button"
+                    data-bs-toggle="collapse" data-bs-target="#collapseProjects" aria-expanded="true"
+                    aria-controls="collapseProjects">
+              Projects
+            </button>
+            <span class="d-none d-md-flex">Projects</span>
+          </h3>
+          <div id="collapseProjects" class="container-xxl accordion-collapse collapse" data-bs-parent="#sitemapAccordion">
+            <ul class="navbar-nav">
+              <li><a class="nav-link" href="{{ .Site.Params.repo }}" aria-describedby="headingProjects">Boosted 5</a>
+              </li>
+              <li><a class="nav-link" href="{{ .Site.Params.repo }}/tree/v4-dev" aria-describedby="headingProjects">Boosted
+                4</a></li>
+              <li><a class="nav-link" href="{{ .Site.Params.bootstrap }}"
+                     aria-describedby="headingProjects">Bootstrap</a></li>
+              <li><a class="nav-link" href="https://boosted.netlify.app" aria-describedby="headingGuides">Pre-release on
+                Netlify</a></li>
+            </ul>
+          </div>
+        </div>
+        <div class="footer-column col-md-6 col-lg-2">
+          <h3 class="accordion-header footer-heading" id="headingCommunity">
+            <button class="accordion-button collapsed container-xxl px-1 d-md-none" type="button"
+                    data-bs-toggle="collapse" data-bs-target="#collapseCommunity" aria-expanded="true"
+                    aria-controls="collapseCommunity">
+              Community
+            </button>
+            <span class="d-none d-md-flex">Community</span>
+          </h3>
+          <div id="collapseCommunity" class="container-xxl accordion-collapse collapse" data-bs-parent="#sitemapAccordion">
+            <ul class="navbar-nav">
+              <li><a class="nav-link" href="{{ .Site.Params.repo }}/issues" aria-describedby="headingCommunity">Issues</a>
+              </li>
+              <li><a class="nav-link" href="{{ .Site.Params.repo }}/discussions" aria-describedby="headingCommunity">Discussions</a>
+              </li>
+            </ul>
+          </div>
+        </div>
+        <div class="footer-column accordion-header col-md-12 col-lg-4 mb-3 pt-3 pt-lg-4 px-1 px-lg-0 fw-bold small">
+          <p class="mb-lg-1">This documentation is an adaptation made by Orange. Original version designed and built with
+            all the love in the world by the <a href="https://github.com/orgs/twbs/people">Bootstrap core team</a> with
+            the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">their contributors</a>.</p>
+          <p class="mb-lg-1">
+            Orange modified code licensed <a href="{{ .Site.Params.repo }}/blob/main/LICENSE" target="_blank"
+                                             rel="license noopener">MIT</a>
+            -&nbsp;just like <a href="https://github.com/twbs/bootstrap/blob/main/LICENSE" target="_blank"
+                                rel="license noopener">Bootstrap</a>,
+            docs <a href="https://creativecommons.org/licenses/by/3.0/" target="_blank" rel="license noopener">CC BY
+            3.0</a>.
+          </p>
+          <p class="mb-lg-1">Currently v{{ .Site.Params.current_version }}.</p>
+          <p class="mb-lg-1">
+            <a href="https://www.netlify.com">
+              <img src="https://www.netlify.com/img/global/badges/netlify-dark.svg" alt="Deployed by Netlify" width="89"
+                   height="40"/>
+            </a>
+          </p>
+        </div>
       </div>
-      <div class="col-6 col-lg-2 offset-lg-1 mb-1">
-        <h5>Links</h5>
-        <ul class="list-unstyled">
-          <li class="mb-2"><a href="/">Home</a></li>
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/">Docs</a></li>
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/examples/">Examples</a></li>
-          <!-- Boosted mod: removed .Site.Params.themes and .Site.Params.blog -->
-        </ul>
-      </div>
-      <div class="col-6 col-lg-2 mb-1">
-        <h5>Guides</h5>
-        <ul class="list-unstyled">
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/getting-started/">Getting started</a></li>
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/examples/starter-template/">Starter template</a></li>
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/getting-started/webpack/">Webpack</a></li>
-          <li class="mb-2"><a href="/docs/{{ .Site.Params.docs_version }}/getting-started/parcel/">Parcel</a></li>
-        </ul>
-      </div>
-      <div class="col-6 col-lg-2 mb-1">
-        <h5>Projects</h5>
-        <ul class="list-unstyled">
-          <li class="mb-2"><a href="{{ .Site.Params.repo }}">Boosted 5</a></li>
-          <li class="mb-2"><a href="{{ .Site.Params.repo }}/tree/v4-dev">Boosted 4</a></li>
-          <li class="mb-2"><a href="{{ .Site.Params.bootstrap }}">Bootstrap</a></li>
-          <li class=""><a href="https://boosted.netlify.app">Pre-release on Netlify</a></li>
-        </ul>
-      </div>
-      <div class="col-6 col-lg-2 mb-1">
-        <h5>Community</h5>
-        <ul class="list-unstyled">
-          <li class="mb-2"><a href="{{ .Site.Params.repo }}/issues">Issues</a></li>
-          <li class="mb-2"><a href="{{ .Site.Params.repo }}/discussions">Discussions</a></li>
-        </ul>
-      </div>
-    </div>
+    </nav>
   </div>
 </footer>
 <!-- Boosted mod: back-to-top component -->