diff --git a/client/bworg/site/css/style.css b/client/bworg/site/css/style.css
new file mode 100644
index 0000000000..6686a99c56
--- /dev/null
+++ b/client/bworg/site/css/style.css
@@ -0,0 +1,109 @@
+@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
+
+@font-face {
+  font-family: jetbrainsmono; /* set name */
+  src: url(../fonts/jetbrainsmono-tegular.woff2); /* url of the font */
+}
+
+:root {
+  --brand-200: #ACCDE4;
+  --brand-300: #69D3F5;
+  --brand-400: #69D3F5;
+  --brand-500: #2970FF;
+  --brand-600: #2971FF;
+  --brand-700: #0C1E3E;
+  --brand-800: #0B1B36;
+}
+
+
+*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
+html { font-family: "Source Sans 3", sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; overflow-x: hidden; scroll-behavior: smooth; }
+
+.dm-serif-text-regular { font-family: "DM Serif Text", serif; font-weight: 400; font-style: normal; }
+.dm-serif-text-regular-italic { font-family: "DM Serif Text", serif; font-weight: 400; font-style: italic; }
+.font-source-sans { font-family: "Source Sans 3", sans-serif; font-weight: 400; font-style: normal; }
+
+
+body{ font-family: "Source Sans 3", sans-serif; font-size: 18px; font-weight: 300; color: #fff; line-height: 1; background: #0B1E3E; }
+h1, h2, h3, h4, h5, h6{ margin:0 0 20px; margin:0; font-weight:400; font-family: "DM Serif Text", serif; }
+p { font-weight: 300; line-height: 180%; }
+a { color: #000000; }
+a:hover { color: #2970FF; }
+
+::-webkit-input-placeholder {  color: #000; }
+::-moz-placeholder {color: #000; }
+:-ms-input-placeholder { color: #000; }
+:-moz-placeholder { color: #000; }
+
+.logo { padding-top: 36px; position: relative; }
+.mainmenu {
+  text-transform: uppercase;
+  background: #09182D;
+  background: linear-gradient(0deg,rgba(9, 24, 45, 0.8) 0%, rgba(10, 27, 53, 0.32) 29%, rgba(12, 30, 62, 0) 77%);
+}
+.mainmenu li.active { position: relative; }
+.mainmenu li.active:before { content: ''; width: 12px; height: 12px; border-radius: 100%; background: var(--brand-300); position: absolute; bottom: -6px;  left: 50%; transform: translateX(-50%); }
+.backtotop { position: fixed; right: 60px; bottom: 60px; text-align: center; color: #44A1CB; font-size: 14px; display: none; }
+.backtotop:hover { color: #44A1CB; }
+.backtotop i { background: #44A1CB; width: 60px; height: 60px; border-radius: 100%; display: flex; margin: 0 auto 10px; font-size: 40px; align-items: center; justify-content: center; color: #fff; }
+
+.footerlink li a { color: var(--brand-500) }
+.footerlink li a:hover { color: #ffffff }
+.footercontent { background: url("../images/footercontentbg.png") no-repeat center top; min-height: 188px; }
+
+.herobanner { background: url("../images/bannerbg.jpg") no-repeat center top; background-size: cover; width: 100%; min-height: 1072px; display: flex; margin-top: -84px; position: relative; z-index: 30; }
+.herobanner:after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 200px; background: #0C1E3E;
+  background: linear-gradient(180deg,rgba(12, 30, 62, 0) 0%, rgba(11, 30, 62, 1) 100%); }
+.herobanner .desc { background: rgba(9, 24, 45, 76); width: 100%; max-width: 672px; border-radius: 18px; padding:36px 24px; position: absolute; bottom:0; left: 50%; transform: translateX(-50%); z-index: 40; display: flex; flex-direction: column; justify-content: center; }
+#downloads { scroll-margin-top: 80px; }
+
+.download-picker { position: relative; display: flex; width: fit-content; min-width: 350px; max-width: 100%; margin: 0 auto; border: 1px solid var(--brand-600); border-radius: 4px; background: #08172B; box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22); overflow: visible; }
+.download-picker.is-open { z-index: 60; }
+.download-picker__action { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; min-height: 36px; padding: 5px 10px 6px 18px; color: var(--brand-300); font-family: "DM Serif Text", serif; font-size: 22px; font-weight: 400; line-height: 1.1; text-align: center; }
+.download-picker__action:hover { color: #ffffff; }
+.download-picker__action span[data-download-label] { white-space: nowrap; }
+.download-picker__toggle { width: 46px; flex: 0 0 46px; display: flex; align-items: center; justify-content: center; color: var(--brand-300); background: transparent; }
+.download-picker__toggle:hover { color: #ffffff; }
+.download-picker__chevron { width: 12px; height: 12px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px); transition: transform 180ms ease; }
+.download-picker.is-open .download-picker__chevron { transform: rotate(225deg) translate(-2px, -2px); }
+.download-picker__menu { position: absolute; top: calc(100% - 1px); left: -1px; right: -1px; z-index: 20; display: none; padding: 6px 0; border: 1px solid #9CA3AF; border-radius: 0 0 4px 4px; background: #070707; box-shadow: 0 24px 50px rgba(0, 0, 0, 0.35); }
+.download-picker.is-open .download-picker__menu { display: block; }
+.download-picker__menu a { display: block; padding: 10px 18px; color: var(--brand-200); font-family: "Source Sans 3", sans-serif; font-size: 20px; font-weight: 300; line-height: 1.2; text-align: center; }
+.download-picker__menu a:hover, .download-picker__menu a:focus { color: var(--brand-300); background: #101B33; }
+.download-picker__menu a[aria-current="true"] { color: var(--brand-200); background: transparent; }
+
+.assetwrapper { position: relative; }
+/* .assetwrapper:before { content: ''; background: #09182D; background: radial-gradient(circle,rgba(9, 24, 45, 0) 57%, rgba(41, 112, 255, 0.6) 100%);
+position: absolute; left:50%; top: 50%; transform: translate(-50%, -50%) ; width: 1780px; height: 1780px; border-radius: 100%; z-index: -1; } */
+.assetwrapper .box { position: relative; z-index: 2; max-width: 1094px; height: 100vh; min-height: 768px; margin: 0 auto; background: url("../images/assetssupportedbg.png") no-repeat center center; background-size: auto 100%; display: flex; align-items: center; flex-direction: column; justify-content: space-around; padding: 100px 0; }
+.assetwrapper .box .cointag { border: 1px solid var(--brand-600); border-radius: 6px; padding: 0px 12px 0px 22px; color: var(--brand-300); font-size: 24px; text-transform: uppercase; font-family: "DM Serif Text", serif; display: flex; align-items: center; justify-content: space-between; }
+.assetwrapper .box .cointag img { margin-left: 30px; }
+
+.assetwrapper .box:before { content: ''; background: #09182D; background: radial-gradient(circle,rgba(9, 24, 45, 0) 57%, rgba(41, 112, 255, 0.6) 100%);
+  position: absolute; left:50%; top: -390px; transform: translate(-50%, 0%) ; width: 1780px; height: 1655px; border-radius: 100%; z-index: -1; }
+
+
+@media only screen and (max-width: 1499px) {
+  
+}
+@media only screen and (max-width: 1199px) {
+    .assetwrapper .box:before { top:-440px; width: 1780px; height: 1570px; }
+}
+
+@media only screen and (max-width: 1023px) {
+	.logo { padding-top: 20px; max-width: 180px; display: block; }
+  .mainmenu { position: absolute; left: 0; right: 0; background:var(--brand-700); border-radius: 0 !important; top: 84px; border-top:1px solid var(--brand-500); padding-top: 16px; }
+  .mainmenu li { margin-left: 0 !important; }
+  .assetwrapper .box { background-size: 100% auto; height: 768px;}
+}
+@media only screen and (max-width: 767px) {
+  .herobanner .desc { max-width: 94%; }
+  .download-picker { width: 100%; min-width: 0; }
+  .download-picker__action { min-height: 40px; padding: 5px 10px 6px 16px; font-size: 20px; }
+  .download-picker__action span[data-download-label] { white-space: normal; }
+  .download-picker__toggle { width: 44px; flex-basis: 44px; }
+  .download-picker__menu a { padding: 9px 12px; font-size: 16px; }
+  .assetwrapper .box { background-size: auto 100%;}
+  .assetwrapper .box .cointag  { padding: 0px 12px; font-size: 18px; }
+  .assetwrapper .box .cointag img { margin-left: 10px; }
+}
diff --git a/client/bworg/site/images/assetssupportedbg.png b/client/bworg/site/images/assetssupportedbg.png
new file mode 100644
index 0000000000..107d91b266
Binary files /dev/null and b/client/bworg/site/images/assetssupportedbg.png differ
diff --git a/client/bworg/site/images/bannerbg.jpg b/client/bworg/site/images/bannerbg.jpg
new file mode 100644
index 0000000000..9bc3d3b834
Binary files /dev/null and b/client/bworg/site/images/bannerbg.jpg differ
diff --git a/client/bworg/site/images/faqimg.png b/client/bworg/site/images/faqimg.png
new file mode 100644
index 0000000000..d69a1f5e7c
Binary files /dev/null and b/client/bworg/site/images/faqimg.png differ
diff --git a/client/bworg/site/images/favicon.png b/client/bworg/site/images/favicon.png
new file mode 100644
index 0000000000..05f22d353a
Binary files /dev/null and b/client/bworg/site/images/favicon.png differ
diff --git a/client/bworg/site/images/footercontentbg.png b/client/bworg/site/images/footercontentbg.png
new file mode 100644
index 0000000000..f3f2fe7206
Binary files /dev/null and b/client/bworg/site/images/footercontentbg.png differ
diff --git a/client/bworg/site/images/footerlogo.png b/client/bworg/site/images/footerlogo.png
new file mode 100644
index 0000000000..e7631b0c7e
Binary files /dev/null and b/client/bworg/site/images/footerlogo.png differ
diff --git a/client/bworg/site/images/icons/bch-icon.png b/client/bworg/site/images/icons/bch-icon.png
new file mode 100644
index 0000000000..5a48b40c79
Binary files /dev/null and b/client/bworg/site/images/icons/bch-icon.png differ
diff --git a/client/bworg/site/images/icons/bluesky-icon.png b/client/bworg/site/images/icons/bluesky-icon.png
new file mode 100644
index 0000000000..8590809a55
Binary files /dev/null and b/client/bworg/site/images/icons/bluesky-icon.png differ
diff --git a/client/bworg/site/images/icons/btc-icon.png b/client/bworg/site/images/icons/btc-icon.png
new file mode 100644
index 0000000000..8d209d4658
Binary files /dev/null and b/client/bworg/site/images/icons/btc-icon.png differ
diff --git a/client/bworg/site/images/icons/dash-icon.png b/client/bworg/site/images/icons/dash-icon.png
new file mode 100644
index 0000000000..8a28d31d54
Binary files /dev/null and b/client/bworg/site/images/icons/dash-icon.png differ
diff --git a/client/bworg/site/images/icons/dcr-icon.png b/client/bworg/site/images/icons/dcr-icon.png
new file mode 100644
index 0000000000..a8e9746d6d
Binary files /dev/null and b/client/bworg/site/images/icons/dcr-icon.png differ
diff --git a/client/bworg/site/images/icons/dgb-icon.png b/client/bworg/site/images/icons/dgb-icon.png
new file mode 100644
index 0000000000..fde44b6d03
Binary files /dev/null and b/client/bworg/site/images/icons/dgb-icon.png differ
diff --git a/client/bworg/site/images/icons/discord-icon.png b/client/bworg/site/images/icons/discord-icon.png
new file mode 100644
index 0000000000..b7777abe06
Binary files /dev/null and b/client/bworg/site/images/icons/discord-icon.png differ
diff --git a/client/bworg/site/images/icons/doge-icon.png b/client/bworg/site/images/icons/doge-icon.png
new file mode 100644
index 0000000000..2550d34ff5
Binary files /dev/null and b/client/bworg/site/images/icons/doge-icon.png differ
diff --git a/client/bworg/site/images/icons/eth-icon.png b/client/bworg/site/images/icons/eth-icon.png
new file mode 100644
index 0000000000..522443c0d3
Binary files /dev/null and b/client/bworg/site/images/icons/eth-icon.png differ
diff --git a/client/bworg/site/images/icons/firo-icon.png b/client/bworg/site/images/icons/firo-icon.png
new file mode 100644
index 0000000000..81d53d9e0d
Binary files /dev/null and b/client/bworg/site/images/icons/firo-icon.png differ
diff --git a/client/bworg/site/images/icons/github-icon.png b/client/bworg/site/images/icons/github-icon.png
new file mode 100644
index 0000000000..756abe7801
Binary files /dev/null and b/client/bworg/site/images/icons/github-icon.png differ
diff --git a/client/bworg/site/images/icons/litecoin-icon.png b/client/bworg/site/images/icons/litecoin-icon.png
new file mode 100644
index 0000000000..b32cbddb46
Binary files /dev/null and b/client/bworg/site/images/icons/litecoin-icon.png differ
diff --git a/client/bworg/site/images/icons/me-icon.png b/client/bworg/site/images/icons/me-icon.png
new file mode 100644
index 0000000000..07b48557d5
Binary files /dev/null and b/client/bworg/site/images/icons/me-icon.png differ
diff --git a/client/bworg/site/images/icons/moneycontrol-icon.png b/client/bworg/site/images/icons/moneycontrol-icon.png
new file mode 100644
index 0000000000..de57228f60
Binary files /dev/null and b/client/bworg/site/images/icons/moneycontrol-icon.png differ
diff --git a/client/bworg/site/images/icons/polygon-icon.png b/client/bworg/site/images/icons/polygon-icon.png
new file mode 100644
index 0000000000..18c269e266
Binary files /dev/null and b/client/bworg/site/images/icons/polygon-icon.png differ
diff --git a/client/bworg/site/images/icons/reddit-icon.png b/client/bworg/site/images/icons/reddit-icon.png
new file mode 100644
index 0000000000..aa69616292
Binary files /dev/null and b/client/bworg/site/images/icons/reddit-icon.png differ
diff --git a/client/bworg/site/images/icons/twitter-icon.png b/client/bworg/site/images/icons/twitter-icon.png
new file mode 100644
index 0000000000..632f2d89fc
Binary files /dev/null and b/client/bworg/site/images/icons/twitter-icon.png differ
diff --git a/client/bworg/site/images/icons/usdc-icon.png b/client/bworg/site/images/icons/usdc-icon.png
new file mode 100644
index 0000000000..7ab2fa40d9
Binary files /dev/null and b/client/bworg/site/images/icons/usdc-icon.png differ
diff --git a/client/bworg/site/images/icons/usdt-icon.png b/client/bworg/site/images/icons/usdt-icon.png
new file mode 100644
index 0000000000..7272826ee0
Binary files /dev/null and b/client/bworg/site/images/icons/usdt-icon.png differ
diff --git a/client/bworg/site/images/icons/youtube-icon.png b/client/bworg/site/images/icons/youtube-icon.png
new file mode 100644
index 0000000000..44bc9d8c56
Binary files /dev/null and b/client/bworg/site/images/icons/youtube-icon.png differ
diff --git a/client/bworg/site/images/liquidity.png b/client/bworg/site/images/liquidity.png
new file mode 100644
index 0000000000..c816756e7d
Binary files /dev/null and b/client/bworg/site/images/liquidity.png differ
diff --git a/client/bworg/site/images/logo.png b/client/bworg/site/images/logo.png
new file mode 100644
index 0000000000..74c2c93c88
Binary files /dev/null and b/client/bworg/site/images/logo.png differ
diff --git a/client/bworg/site/index.html b/client/bworg/site/index.html
index dfdaa7cfd9..7e52611115 100644
--- a/client/bworg/site/index.html
+++ b/client/bworg/site/index.html
@@ -1,889 +1,253 @@
 <!DOCTYPE html>
-<html lang="en">
+<html>
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Bison Wallet | Reliable Self-custodial Crypto Wallet</title>
-    <link rel="icon" href="/img/favicon.png" type="image/png">
-
-    <script src="/js/tailwinds.js"></script>
-
-    <style>
-      @font-face {
-        font-family: 'PT Sans Caption';
-        src: url('/font/PTSansCaption-Regular.ttf') format('truetype');
-        font-weight: normal;
-        font-style: normal;
-      }
-      @font-face {
-        font-family: 'PT Sans Caption';
-        src: url('/font/PTSansCaption-Bold.ttf') format('truetype');
-        font-weight: bold;
-        font-style: normal;
-      }
-      /* Basic styling */
-      html {
-        scroll-behavior: smooth;
-      }
-      body {
-        font-family: "PT Sans Caption", sans-serif;;
-        background-color: #111827; /* Gray-900 */
-        color: #d1d5db; /* Gray-300 - Default text slightly lighter */
-        overflow-x: hidden;
-      }
-      /* Custom gradient for hero - Made Subtler */
-      .hero-gradient {
-        background: linear-gradient(180deg, #1f2937 0%, #151e2b 100%); /* Gray-800 to darker Gray-850 */
-      }
-      /* Style for feature icons */
-      .feature-icon {
-          display: inline-flex;
-          align-items: center;
-          justify-content: center;
-          width: 3rem; /* 48px */
-          height: 3rem; /* 48px */
-          border-radius: 0.75rem; /* rounded-xl */
-          background-image: linear-gradient(to bottom right, #374151, #4b5563); /* Gray-700 to Gray-600 */
-          color: #93c5fd; /* Blue-300 */
-          margin-bottom: 1rem; /* 16px */
-          transition: all 0.3s ease;
-          box-shadow: 0 1px 3px rgba(0,0,0,0.2);
-      }
-       .feature-box:hover .feature-icon {
-           background-image: linear-gradient(to bottom right, #4b5563, #374151); /* Invert gradient on hover */
-           color: #ffffff; /* White */
-           transform: scale(1.05);
-       }
-      /* Style for Bento Grid Feature boxes */
-      .feature-box {
-          background-color: #1f2937; /* Gray-800 */
-          padding: 1.5rem; /* p-6 */
-          border-radius: 0.75rem; /* rounded-xl */
-          border: 1px solid #374151; /* Gray-700 */
-          transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
-      }
-      .feature-box:hover {
-          transform: translateY(-5px);
-          box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
-          border-color: #4b5563; /* Gray-600 */
-      }
-      /* Button Gradients */
-      .btn-primary {
-          background-color: #2563eb; /* Blue-600 */
-          background-image: linear-gradient(to bottom, #3b82f6, #2563eb);
-          color: #ffffff; /* White text */
-      }
-      .btn-primary:hover {
-           background-color: #1d4ed8; /* Blue-700 */
-           background-image: linear-gradient(to bottom, #2563eb, #1d4ed8);
-      }
-       .btn-secondary {
-           background-color: rgba(255, 255, 255, 0.1); /* white/10 */
-           border: 1px solid #4b5563; /* Gray-600 */
-           color: #e5e7eb; /* Gray-200 text */
-       }
-       .btn-secondary:hover {
-           background-color: rgba(255, 255, 255, 0.2); /* white/20 */
-           border-color: #6b7280; /* Gray-500 */
-           color: #ffffff; /* White text */
-       }
-
-      /* Image fitting */
-       .hero-image, .about-image {
-           width: 100%;
-           height: auto;
-           max-height: 450px;
-           object-fit: contain;
-           border-radius: 0.5rem; /* rounded-lg */
-       }
-       .about-image {
-           max-height: 350px;
-           border-radius: 0.5rem; /* rounded-lg */
-       }
-       .nav-logo {
-           height: 3.5rem; /* h-8 */
-           width: auto;
-           /* Removed margin-right as text is gone */
-           vertical-align: middle;
-       }
-
-       /* Scroll Animation Base Styles */
-       .scroll-animate {
-           opacity: 0;
-           transform: translateY(20px);
-           transition: opacity 0.6s ease-out, transform 0.6s ease-out;
-       }
-       .scroll-animate.visible {
-           opacity: 1;
-           transform: translateY(0);
-       }
-       /* Add delay variations if needed */
-       .delay-100 { transition-delay: 0.1s; }
-       .delay-200 { transition-delay: 0.2s; }
-       .delay-300 { transition-delay: 0.3s; }
-
-       /* Typography Refinements */
-       .body-text {
-           line-height: 1.75; /* leading-7 */
-           color: #d1d5db; /* Gray-300 */
-       }
-       .subheading {
-            letter-spacing: normal; /* tracking-normal */
-       }
-
-       /* Onboarding List Layout Fix */
-       #getting-started ol li {
-           padding-left: 2.5rem; /* Increased padding to make space for number */
-           position: relative; /* Ensure relative positioning for absolute child */
-       }
-       #getting-started ol li .list-number {
-            position: absolute;
-            left: -18px; /* Align to the new padded left edge */
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            width: 35px;
-            height: 35px;
-            padding: 7px 0;
-            border-radius: 9999px; /* rounded-full */
-            background-color: #2563eb; /* bg-blue-600 */
-            color: #ffffff; /* text-white */
-            font-size: 20px; /* text-xs */
-            font-weight: 600; /* font-semibold */
-            z-index: 10;
-            line-height: 1;
-            /* Removed ring as it might interfere with positioning */
-       }
-        #getting-started ol li:hover .list-number {
-          background-color: #1d4ed8; /* bg-blue-700 on hover */
-        }
-        .flex-grow-1 {
-          flex-grow: 1;
-        }
-        .border-left {
-          border-style: none none none solid;
-        }
-        #downloadDropdown {
-          position: absolute;
-          top: calc(100% + 2px);
-          background-color: rgb(15, 15, 15);
-          display: flex;
-          flex-direction: column;
-          align-items: stretch;
-          z-index: 10000;
-          border-style: none solid solid solid;
-          width: 100%;
-        }
-        #downloadDropdown > div {
-          padding: 0.5em;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          user-select: none;
-        }
-        #downloadDropdown > div:hover {
-          background-color: rgb(40, 40, 40);
-        }
-        #download {
-          position: relative;
-          z-index: 1000;
-          overflow: visible;
-        }
-        #download .hidden {
-          display: none !important;
-        }
-        .coin {
-          width: 25px;
-          height: 25px;
-          background-image: url('/img/coinbar.png');
-        }
-        #coins .coin {
-          margin-right: 0.5rem;
-        }
-        #coins > div {
-          display: flex;
-          justify-content: center;
-          align-items: center;
-        }
-        #coins > div > span {
-          text-wrap: nowrap;
-        }
-        .coin.dcr {
-          background-position: 0 0;
-        }
-        .coin.btc {
-          background-position: -27px 0;
-        }
-        .coin.eth {
-          width: 16px;
-          background-position: -56px 0;
-        }
-        .coin.usdt {
-          background-position: -72px 0;
-        }
-        .coin.usdc {
-          background-position: -100px 0;
-        }
-        .coin.ltc {
-          background-position: -128px 0;
-        }
-        .coin.zec {
-          background-position: -156px 0;
-        }
-        .coin.pol {
-          background-position: -182px 0;
-        }
-        .coin.dgb {
-          background-position: -210px 0;
-        }
-        .coin.firo {
-          background-position: -238px 0;
-        }
-        .coin.dash {
-          background-position: -265px 0;
-        }
-        .coin.bch {
-          width: 28px;
-          background-position: -292px 0;
-        }
-        .coin.doge {
-          background-position: -321px 0;
-        }
-        #downloadImg {
-          height: 30px;
-          margin-right: 10px;
-        }
-    </style>
-
-    <script>
-        function imageError(imgElement) {
-            imgElement.style.display = 'none';
-            const parent = imgElement.parentElement;
-            if (parent) {
-                const placeholder = parent.querySelector('.image-placeholder-text');
-                if (placeholder) {
-                    placeholder.style.display = 'block';
-                }
-            }
-        }
-
-        // Intersection Observer for Scroll Animations
-        function setupScrollAnimations() {
-            const observer = new IntersectionObserver((entries) => {
-                entries.forEach(entry => {
-                    if (entry.isIntersecting) {
-                        entry.target.classList.add('visible');
-                    }
-                });
-            }, {
-                threshold: 0.1 // Trigger when 10% of the element is visible
-            });
-
-            document.querySelectorAll('.scroll-animate').forEach(el => {
-                observer.observe(el);
-            });
-        }
-
-
-        document.addEventListener('DOMContentLoaded', () => {
-            // insertLucideIcons();
-            setupScrollAnimations();
-
-            // Mobile Menu Toggle Logic
-            const btn = document.querySelector('button[aria-controls="mobile-menu"]');
-            const menu = document.getElementById('mobile-menu');
-            const menuIcon = document.getElementById('menu-icon');
-            const closeIcon = document.getElementById('close-icon');
-
-            if (btn && menu && menuIcon && closeIcon) {
-                btn.addEventListener('click', () => {
-                  const isExpanded = btn.getAttribute('aria-expanded') === 'true';
-                  btn.setAttribute('aria-expanded', !isExpanded);
-                  menu.classList.toggle('hidden');
-                  menuIcon.classList.toggle('hidden');
-                  menuIcon.classList.toggle('block');
-                  closeIcon.classList.toggle('hidden');
-                  closeIcon.classList.toggle('block');
-                });
-            }
-        });
-    </script>
+<meta charset="utf-8">
+<title>Bison Wallet | Reliable Self-custodial Crypto Wallet</title>
+<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+
+<!--custom-css-->
+<link rel="icon" href="images/favicon.png" type="image/png">
+<link rel="preload" href="images/bannerbg.jpg" as="image">
+<link rel="stylesheet" href="css/style.css">
+<style>
+  html, body { margin: 0; background: #0B1E3E; }
+  .wrapper { overflow: hidden; }
+  header { position: relative; z-index: 50; }
+  .logo { display: block; padding-top: 36px; position: relative; }
+  .herobanner {
+    background: #0B1E3E url("images/bannerbg.jpg") no-repeat center top;
+    background-size: cover;
+    display: flex;
+    margin-top: -84px;
+    min-height: 1072px;
+    position: relative;
+    width: 100%;
+    z-index: 30;
+  }
+</style>
+<!-- Then Load Tailwind -->
+<script src="https://cdn.tailwindcss.com"></script>
 </head>
-<body class="antialiased">
-    <nav class="bg-gray-900/70 backdrop-blur-md sticky top-0 z-50 border-b border-gray-700/50">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="flex items-center justify-between h-24">
-                
-                <div class="flex items-center flex-shrink-0">
-                    
-                    <img src="/img/bisonwallet-full-dark.png" alt="Bison Wallet Logo" class="nav-logo" onerror="this.style.display='none';">
-                    
-                </div>
-                
-                <div class="hidden md:block">
-                    
-                    <div class="ml-10 flex items-baseline text-lg font-medium space-x-4">
-                        <a href="#features" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Features</a>
-                        <a href="#getting-started" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Get Started</a>
-                        <a href="#supported-assets" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Assets</a>
-                        <a href="#security" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Security</a>
-                        <a href="#download" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Download</a>
-                        <a href="#about-decred" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">About Decred</a>
-                        <a href="#support" class="text-gray-300 hover:text-white p-2 rounded-md transition-colors duration-200">Support</a>
-                    </div>
-                </div>
-                
-                <div class="-mr-2 flex md:hidden">
-                    
-                    <button type="button" class="bg-gray-800 inline-flex items-center justify-center p-2 rounded-lg text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white transition-all duration-200" aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <span id="menu-icon" class="block h-6 w-6" data-lucide="menu"></span>
-                        <span id="close-icon" class="hidden h-6 w-6" data-lucide="x"></span>
-                    </button>
-                </div>
-            </div>
-        </div>
-        
-        <div class="hidden" id="mobile-menu">
-             <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
-                <a href="#features" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Features</a>
-                <a href="#getting-started" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Get Started</a>
-                <a href="#supported-assets" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Assets</a>
-                <a href="#security" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Security</a>
-                <a href="#download" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Download</a>
-                <a href="#about-decred" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">About Decred</a>
-                <a href="#support" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium transition-colors duration-200">Support</a>
-            </div>
-        </div>
+<body>
+<div class="wrapper overflow-hidden">  
+  <header class="relative z-50">
+    <nav class="max-w-7xl mx-auto px-4 flex justify-between">
+      <!-- Logo -->
+      <a href="index.html" class="logo">
+        <img src="images/logo.png" alt="Bison Wallet" />
+      </a>
     </nav>
-
-    
-    <section class="hero-gradient pt-24 pb-16 sm:pt-36 sm:pb-24 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-            
-            
-            <h1 class="text-4xl font-bold tracking-tight text-white sm:text-4xl lg:text-5xl scroll-animate"> 
-                 Bison Wallet: Secure & Trustless Crypto Trading 
-            </h1>
-            
-            <p class="mt-6 text-lg max-w-3xl mx-auto scroll-animate delay-100 body-text">
-                Your self-custodial gateway to the premier blockchain assets. Experience peer-to-peer atomic swaps with the DCRDEX protocol, enhanced privacy, DCR staking, and more – all under your control.
-            </p>
-            
-            <div class="mt-10 flex items-center justify-center gap-x-4 sm:gap-x-6 flex-wrap gap-y-4 scroll-animate delay-200">
-                <a href="#download" class="btn-primary rounded-lg px-5 py-3 text-sm font-semibold shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500 transition duration-200 ease-in-out inline-flex items-center gap-2 transform hover:scale-105">
-                    <span data-lucide="download"></span> Download Now
+  </header>
+  <!-- header end -->
+
+  <div class="main">
+    <div class="herobanner">
+        <div class="container mx-auto flex justify-center items-start pt-[84px] px-4">
+            <div class="max-w-2xl text-center mt-80">
+                <h3 class="text-4xl text-gray-200 mb-4">Wallet Native</h3>
+                <h1 class="text-7xl text-gray-200">Markets </h1>
+            </div>
+            <div class="desc" id="downloads">
+              <p class="!leading-tight text-xl xl:text-2xl font-semibold text-center text-[var(--brand-200)] mb-9">Multi-coin self-custodial wallet with a trustless exchange built in.  Swap peer to peer. No accounts. No trading fees.</p>
+              <div class="download-picker" data-download-picker data-platform="mac">
+                <a href="#" class="download-picker__action" data-download-action>
+                  <span data-download-label>Download Bison Wallet</span>
                 </a>
-                <a href="#features" class="btn-secondary rounded-lg px-5 py-3 text-sm font-semibold transition duration-200 ease-in-out inline-flex items-center gap-2 transform hover:scale-105">
-                    Explore Features <span data-lucide="arrow-right"></span>
-                </a>
-            </div>
-            
-            
-            <div class="mt-16 scroll-animate delay-300">
-                <div class="mx-auto max-w-4xl p-2 bg-gray-800/50 rounded-lg border border-gray-700 shadow-lg">
-                    <span class="image-placeholder-text text-gray-400 italic hidden">Bison Wallet Interface Screenshot</span>
-                    <img src="https://pbs.twimg.com/media/GhfGi50W0AAZsfS?format=jpg&name=large"
-                         alt="Bison Wallet Interface Screenshot"
-                         class="hero-image"
-                         onerror="imageError(this)">
-                </div>
-            </div>
+                <button class="download-picker__toggle" type="button" aria-label="Choose download type" aria-expanded="false" aria-controls="download-options" data-download-toggle>
+                  <span class="download-picker__chevron" aria-hidden="true"></span>
+                </button>
+                <div class="download-picker__menu" id="download-options" role="menu" data-download-menu>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-desktop-windows-amd64-v1.0.4.msi" role="menuitem" data-download-option data-platform="windows" data-label="Download for Windows (installer)" aria-current="true">Windows (installer)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-desktop-linux-amd64-v1.0.4.deb" role="menuitem" data-download-option data-platform="linux" data-label="Download for Debian Linux AMD64">Debian Linux AMD64 (installer)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-linux-amd64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="linux" data-label="Download for Linux AMD64">Linux AMD64 (binary archive)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-linux-arm64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="linux" data-label="Download for Linux ARM64">Linux ARM64 (binary archive)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-desktop-darwin-arm64-v1.0.4.dmg" role="menuitem" data-download-option data-platform="mac" data-label="Download for Mac OS M-series/ARM">Mac OS M-series/ARM (installer)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-desktop-darwin-amd64-v1.0.4.dmg" role="menuitem" data-download-option data-platform="mac" data-label="Download for Mac OS AMD64">Mac OS AMD64 (installer)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-darwin-arm64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="mac" data-label="Download for Mac OS M-series/ARM">Mac OS M-series/ARM (binary archive)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-darwin-amd64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="mac" data-label="Download for Mac OS AMD64">Mac OS AMD64 (binary archive)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-freebsd-amd64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="freebsd" data-label="Download for FreeBSD AMD64">FreeBSD AMD64 (binary archive)</a>
+                  <a href="https://github.com/decred/dcrdex/releases/download/v1.0.4/bisonw-linux-riscv64-v1.0.4.tar.gz" role="menuitem" data-download-option data-platform="riscv" data-label="Download for RISC-V 64-bit">RISC-V 64-bit (binary archive)</a>
+                </div>
+              </div>
+            </div>
+        </div>    
+    </div>
+    <!-- banner end -->
+    <div class="max-w-7xl mx-auto py-14 md:pt-28 md:pb-6 px-4 relative z-10" id="features">
+      <h2 class="max-w-sm mx-auto text-3xl lg:text-5xl text-gray-200 text-center mb-10 lg:mb-32 relative z-10">What Bison unlocks</h2>
+      <div class="max-w-xl lg:max-w-none  mx-auto grid gird-cols-1 lg:grid-cols-[1fr_400px_1fr] xl:grid-cols-[1fr_525px_1fr] justify-center gap-5 mb-12">
+        <div class="">
+          <h3 class="text-2xl lg:text-3xl mb-4">Trade without giving up custody</h3>
+          <p class="leading-snug text-[var(--brand-200)]">Swap directly from your wallet using atomic swaps. No accounts. No custodians. No per-trade platform fees. You pay normal network fees. To enable trading, post a small time-locked, refundable DCR bond that deters spam.</p>
         </div>
-    </section>
-
-    
-    <section id="features" class="py-24 sm:py-32 bg-gray-900 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="mx-auto max-w-2xl lg:text-center scroll-animate">
-                <h2 class="text-base font-semibold leading-7 text-blue-400 subheading">Core Capabilities</h2>
-                <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">
-                    Empowering Your Decentralized Future
-                </p>
-                <p class="mt-6 text-lg body-text">
-                    Bison Wallet offers a robust suite of features built for security, privacy, and user control.
-                </p>
-            </div>
-            
-            <div class="mx-auto mt-16 max-w-6xl sm:mt-20 lg:mt-24">
-                
-                <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6">
-
-                    <div class="feature-box md:col-span-2 lg:col-span-2 flex flex-col scroll-animate">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="repeat"></span>
-                        </div>
-                        <dt class="mt-4 text-lg font-semibold leading-7 text-white subheading">Trustless P2P Trading</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">Trade directly peer-to-peer via atomic swaps on DCRDEX. No intermediaries, no custodial risk.</dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-100">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="key-round"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Self-Custodial Control</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">You hold your keys, you control your funds. True self-sovereignty.</dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-200">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="lock"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Enhanced Privacy</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">Built-in decentralized coin mixing for Decred transactions.</dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-100">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="coins"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Multi-Coin Support</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">Manage DCR, BTC, LTC, ETH, POL, stablecoins & more.</dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-200">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="vote"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Integrated DCR Staking</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">Stake Decred directly to earn rewards and participate in governance.</dd>
-                    </div>
-
-                    <div class="feature-box md:col-span-2 lg:col-span-2 flex flex-col scroll-animate delay-300">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="bot"></span>
-                        </div>
-                        <dt class="mt-4 text-lg font-semibold leading-7 text-white subheading">Market Maker Bots</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">
-                          Provide liquidity on DCRDEX with user-friendly, built-in bots via an intuitive GUI.
-                          Potential earnings through spreads.
-                          Link with your Binance or Binance.us account to perform arbitrage.
-                        </dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-300">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="cpu"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Lightweight & Fast</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">Uses SPV wallets for quick sync without full blockchain downloads.</dd>
-                    </div>
-
-                    <div class="feature-box flex flex-col scroll-animate delay-100">
-                        <div class="feature-icon self-start">
-                             <span data-lucide="tag"></span>
-                        </div>
-                        <dt class="mt-4 text-base font-semibold leading-7 text-white subheading">Cost-Effective Trading</dt>
-                        <dd class="mt-1 flex-auto text-base body-text">
-                          Ultra-low transaction fees on most chains. Trade stablecoins on Polygon for fractions of a penny per trade.
-                        </dd>
-                    </div>
-                </div>
-            </div>
+        <div class="lg:-mt-48"><img src="images/liquidity.png" alt="liquidity" class="mx-auto" /></div>
+        <div>
+          <h3 class="max-w-[156px] text-2xl lg:text-3xl mb-4">Privacy on your terms</h3>
+          <p class="leading-snug text-[var(--brand-200)]">Turn on mixing for Decred when you want it. Keep an audit trail when you need it. Privacy lives in the wallet, under your control.</p>
         </div>
-    </section>
-
-    <section id="getting-started" class="py-24 sm:py-32 bg-gray-800 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="mx-auto max-w-3xl text-center scroll-animate">
-                <h2 class="text-base font-semibold leading-7 text-blue-400 subheading">Onboarding</h2>
-                <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">
-                    Start Using Bison Wallet in Minutes
-                </p>
-                <p class="mt-6 text-lg body-text">
-                    Follow these simple steps to set up your wallet and begin your decentralized journey.
-                </p>
-            </div>
-            <div class="mt-16 max-w-4xl mx-auto scroll-animate delay-100">
-                
-                <ol id="onboardList" class="space-y-8 border-l-2 border-blue-500"> 
-                    <li class="group"> 
-                        <span class="list-number">1</span>
-                        <h3 class="text-lg font-semibold leading-8 text-white subheading">Download & Install</h3>
-                        <p class="mt-1 text-base body-text">Choose the correct version for your operating system (Windows, macOS, Linux) from the <a href="#download" class="text-blue-400 hover:text-blue-300 underline transition-colors">Download section</a> and install the application.</p>
-                    </li>
-                    <li class="group">
-                        <span class="list-number">2</span>
-                        <h3 class="text-lg font-semibold leading-8 text-white subheading">Create or Restore Wallet</h3>
-                        <p class="mt-1 text-base body-text">Launch Bison Wallet and follow the on-screen instructions to create a new wallet or restore an existing one using your seed phrase.</p>
-                    </li>
-                    <li class="group">
-                        <span class="list-number">3</span>
-                        <h3 class="text-lg font-semibold leading-8 text-white subheading">Secure Your Seed Phrase</h3>
-                        <p class="mt-1 text-base body-text"><strong class="text-red-400">Crucial Step:</strong> Write down your seed phrase accurately and store it securely offline. Never share it. This is the only way to recover your funds.</p>
-                    </li>
-                     <li class="group">
-                        <span class="list-number">4</span>
-                        <h3 class="text-lg font-semibold leading-8 text-white subheading">Configure Assets & Connect</h3>
-                        <p class="mt-1 text-base body-text">Enable the assets you wish to manage and trade. Connect to the DCRDEX markets to view trading pairs.</p>
-                    </li>
-                     <li class="group">
-                        <span class="list-number">5</span>
-                        <h3 class="text-lg font-semibold leading-8 text-white subheading">Understand Trading Bonds (DCRDEX)</h3>
-                        <p class="mt-1 text-base body-text">DCRDEX requires a small amount of DCR locked in a refundable on-chain bond to place orders, preventing spam. Understand this requirement before trading. More details in the <a href="#support" class="text-blue-400 hover:text-blue-300 underline transition-colors">Support/FAQ</a>.</p>
-                    </li>
-                </ol>
-                 <div class="mt-12 text-center">
-                     <a href="#support" class="text-sm font-semibold leading-6 text-blue-400 hover:text-blue-300 transition-colors">Need more help? Visit Support & FAQ <span data-lucide="arrow-right" class="inline-block"></span></a>
-                 </div>
-            </div>
+      </div>
+      <!-- row end -->
+      <div class="max-w-xl lg:max-w-none  mx-auto grid gird-cols-1 lg:grid-cols-[1fr_400px_1fr] xl:grid-cols-[1fr_525px_1fr] gap-5">
+        <div class="">
+          <h3 class="max-w-[156px] text-2xl lg:text-3xl mb-4">Start fast, stay light</h3>
+          <p class="leading-snug text-[var(--brand-200)]">Sync in minutes with SPV. No full‑chain downloads. Great on laptops and workstations.</p>
         </div>
-    </section>
-
-    <section id="supported-assets" class="py-24 sm:py-32 bg-gray-900 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="mx-auto max-w-7xl text-center scroll-animate">
-                <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">
-                    Supported Assets on DCRDEX
-                </h2>
-                <p class="mt-4 text-lg body-text">
-                    Trade a growing list of cryptocurrencies peer-to-peer using Bison Wallet.
-                </p>
-            </div>
-            <div class="mt-16 max-w-5xl mx-auto scroll-animate delay-100">
-                
-                <div id="coins" class="grid grid-cols-1 xs:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 text-center">
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105 flex place-content-center">
-                      <div class="coin dcr"></div>
-                      <span class="font-medium text-white">Decred (DCR)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin btc"></div>
-                      <span class="font-medium text-white">Bitcoin (BTC)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin ltc"></div>
-                      <span class="font-medium text-white">Litecoin (LTC)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin eth"></div>
-                      <span class="font-medium text-white">Ethereum (ETH)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin pol"></div>
-                      <span class="font-medium text-white">Polygon (POL)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin bch"></div>
-                      <span class="font-medium text-white">Bitcoin Cash (BCH)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin zec"></div>
-                      <span class="font-medium text-white">Zcash (ZEC)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin doge"></div>
-                      <span class="font-medium text-white">Dogecoin (DOGE)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin usdc"></div>
-                      <span class="font-medium text-white">USDC</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin usdt"></div>
-                      <span class="font-medium text-white">USDT</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin dgb"></div>
-                      <span class="font-medium text-white">Digibyte (DGB)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin firo"></div>
-                      <span class="font-medium text-white">Firo (FIRO)</span>
-                    </div>
-                    <div class="bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-all duration-200 transform hover:scale-105">
-                      <div class="coin dash"></div>
-                      <span class="font-medium text-white">Dash (DASH)</span>
-                    </div>
-                    <div class="bg-gray-700/50 p-4 rounded-lg flex items-center justify-center border border-dashed border-gray-600">
-                      <span class="font-medium text-gray-400 italic">More coming...</span>
-                    </div>
-                 </div>
-            </div>
+        <div>
+          <div class="max-w-none lg:max-w-xs mx-auto bg-[#09182D] rounded-2xl p-4 text-center">
+            <p class="text-[var(--brand-500)] text-2xl font-semibold max-w-xs mb-5">Automate liquidity (optional)</p>
+            <p class="text-[var(--brand-500)] leading-snug text-base italic">Agent‑ready market‑maker bots can provide liquidity on the built‑in DEX and help you capture spreads. You choose when they run and what they can do.</p>
+          </div>
         </div>
-    </section>
-
-    
-    <section id="security" class="py-24 sm:py-32 bg-gray-800 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-             <div class="mx-auto max-w-3xl text-center scroll-animate">
-                 <span class="text-blue-400 mb-4" data-lucide="shield-check"></span>
-                <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">
-                    Your Security is Paramount
-                </h2>
-                <p class="mt-4 text-lg body-text">
-                    Bison Wallet is designed with security at its core, empowering you with control.
-                </p>
-            </div>
-            <div class="mt-16 max-w-4xl mx-auto grid md:grid-cols-2 gap-8 lg:gap-12">
-                <div class="bg-gray-900 p-6 rounded-lg shadow-md border border-transparent hover:border-blue-500 transition-all duration-300 scroll-animate delay-100">
-                    <h3 class="text-lg font-semibold text-white flex items-center gap-2 subheading"><span class="text-blue-400" data-lucide="key-round"></span> Self-Custodial</h3>
-                    <p class="mt-2 text-base body-text">You, and only you, hold the private keys to your funds. Bison Wallet software never takes custody of your assets.</p>
-                </div>
-                 <div class="bg-gray-900 p-6 rounded-lg shadow-md border border-transparent hover:border-blue-500 transition-all duration-300 scroll-animate delay-200">
-                    <h3 class="text-lg font-semibold text-white flex items-center gap-2 subheading"><span class="text-blue-400" data-lucide="eye-off"></span> Private</h3>
-                    <p class="mt-2 text-base body-text">No KYC or AML. No registration. No names. DCRDEX does not track IPs when you retrieve or relay order info.</p>
-                </div>
-                 <div class="bg-gray-900 p-6 rounded-lg shadow-md border border-transparent hover:border-blue-500 transition-all duration-300 scroll-animate delay-300">
-                    <h3 class="text-lg font-semibold text-white flex items-center gap-2 subheading"><span class="text-blue-400" data-lucide="cpu"></span> Lightweight SPV Technology</h3>
-                    <p class="mt-2 text-base body-text">Simplified Payment Verification offers a balance of security and speed without needing full blockchain downloads.</p>
-                </div>
-                 <div class="bg-gray-900 p-6 rounded-lg shadow-md border border-red-500/50 scroll-animate delay-100">
-                    <h3 class="text-lg font-semibold text-red-400 flex items-center gap-2 subheading"><span class="text-red-400" data-lucide="info"></span> Your Responsibility</h3>
-                    <p class="mt-2 text-base body-text">Safeguarding your seed phrase is vital. Store it securely offline. Loss of your seed phrase means loss of access to your funds.</p>
-                     <p class="mt-4 text-xs text-gray-500">Always verify software sources and be cautious of phishing attempts.</p>
-                </div>
-            </div>
+        <div>
+          <h3 class="max-w-[246px] text-2xl lg:text-3xl mb-4">Self-custody, always</h3>
+          <p class="leading-snug text-[var(--brand-200)]">You hold the keys. Only you can move your coins. No sign‑ups. No withdrawal holds. No middlemen.</p>
         </div>
-    </section>
-
-    
-    <section id="fees" class="py-24 sm:py-32 bg-gray-900 overflow-hidden">
-         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-             <div class="mx-auto max-w-3xl text-center scroll-animate">
-                 <span class="text-blue-400 mb-4" data-lucide="tag"></span>
-                <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">
-                    Transparent Fee Structure
-                </h2>
-                <p class="mt-4 text-lg body-text">
-                    Understand the costs associated with using Bison Wallet and DCRDEX.
-                </p>
-            </div>
-             <div class="mt-16 max-w-2xl mx-auto bg-gradient-to-br from-gray-800 to-gray-900 p-8 rounded-lg shadow-lg text-center border border-gray-700 scroll-animate delay-100">
-                 <h3 class="text-xl font-semibold text-white mb-4 subheading">DCRDEX Trading Fees: <span class="text-green-400 font-bold">Zero</span></h3>
-                 <p class="text-gray-300 body-text">
-                     DCRDEX charges <strong class="text-white">no trading fees</strong> for executing swaps. You only pay the standard blockchain network fees required for the atomic swap transactions themselves (e.g., Bitcoin network fees for BTC swaps, Decred network fees for DCR swaps).
-                 </p>
-                 <p class="mt-4 text-gray-300 body-text">
-                     Trading stablecoins on Polygon typically results in very low network fees.
-                 </p>
-                 <p class="mt-6 text-sm text-gray-400">
-                     Bison Wallet itself does not add any extra fees for standard wallet operations or trading.
-                 </p>
-             </div>
+      </div>
+    </div>
+    <!-- sec 2 end -->
+    <div class="assetwrapper" id="assets">
+      <div class="box">
+        <h2 class="max-w-sm mx-auto text-3xl lg:text-5xl text-gray-200 text-center">Assets supported (today)</h2>
+        <div class="grid grid-cols-3 gap-3">
+          <div class="cointag">BTC <img src="images/icons/btc-icon.png" alt="BTC" /></div>
+          <div class="cointag">ETH <img src="images/icons/eth-icon.png" alt="ETH" /></div>
+          <div class="cointag">LTC <img src="images/icons/litecoin-icon.png" alt="LTC" /></div>
+          <div class="cointag">DCR <img src="images/icons/dcr-icon.png" alt="DCR" /></div>
+          <div class="cointag">POL <img src="images/icons/polygon-icon.png" alt="Polygon" /></div>
+          <div class="cointag">BCH <img src="images/icons/bch-icon.png" alt="BCH" /></div>
+          <div class="cointag">ZEC <img src="images/icons/btc-icon.png" alt="ZEC" /></div>
+          <div class="cointag">DOGE <img src="images/icons/doge-icon.png" alt="DOGE" /></div>
+          <div class="cointag">USDC <img src="images/icons/usdc-icon.png" alt="USDC" /></div>
+          <div class="cointag">USDT <img src="images/icons/usdt-icon.png" alt="USDT" /></div>
+          <div class="cointag">DGB <img src="images/icons/dgb-icon.png" alt="DGB" /></div>
+          <div class="cointag">FIRO <img src="images/icons/firo-icon.png" alt="Firo" /></div>
+          <div class="cointag col-start-2">Dash <img src="images/icons/dash-icon.png" alt="DASH" /></div>
         </div>
-    </section>
-
-    
-    <section id="about-decred" class="py-24 sm:py-32 bg-gray-800 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-            <div class="grid grid-cols-1 gap-x-12 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-center">
-                <div class="lg:pr-4 scroll-animate">
-                    <h2 class="text-base font-semibold leading-7 text-blue-400 subheading">The Foundation</h2>
-                    <p class="mt-2 text-3xl font-bold tracking-tight text-white sm:text-4xl">About Decred (DCR)</p>
-                    <p class="mt-6 text-lg body-text">
-                        Decred is a secure, adaptable, and self-funding cryptocurrency focused on community input, open governance, and sustainable development.
-                    </p>
-                    <ul class="mt-6 space-y-3 text-base body-text">
-                         <li class="flex gap-x-3">
-                            <span class="text-blue-400 flex-none mt-1" data-lucide="check-circle"></span>
-                            <span>Hybrid PoW/PoS consensus for robust security and stakeholder governance.</span>
-                        </li>
-                         <li class="flex gap-x-3">
-                            <span class="text-blue-400 flex-none mt-1" data-lucide="check-circle"></span>
-                            <span>On-chain voting empowers the community to direct the project's future.</span>
-                        </li>
-                         <li class="flex gap-x-3">
-                            <span class="text-blue-400 flex-none mt-1" data-lucide="check-circle"></span>
-                            <span>Treasury system funds development and ecosystem growth sustainably.</span>
-                        </li>
-                    </ul>
-                     <p class="mt-8 text-base body-text">
-                         Bison Wallet is a key component of the Decred ecosystem, providing seamless access to its features and the DCRDEX decentralized exchange.
-                     </p>
-                     <a href="https://decred.org/" target="_blank" rel="noopener noreferrer" class="mt-8 inline-flex items-center gap-x-2 rounded-lg btn-primary px-4 py-2.5 text-sm font-semibold shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500 transition duration-200 ease-in-out transform hover:scale-105">
-                        Visit Decred.org
-                        <span data-lucide="external-link"></span>
-                    </a>
-                </div>
-                
-                <div class="flex items-center justify-center bg-gray-700/50 rounded-lg p-8 min-h-[300px] lg:min-h-[400px] border border-gray-700 scroll-animate delay-100">
-                     <span class="image-placeholder-text text-gray-400 italic hidden">Decred Logo</span>
-                     <img src="https://dex.decred.org/images/decrediton-logo.svg"
-                          alt="Decred Logo"
-                          class="about-image h-40 w-auto"
-                          onerror="imageError(this)">
-                 </div>
-            </div>
+        <div class="flex items-center text-2xl font-semibold text-[var(--brand-200)]">More coming...</div>
+      </div>
+    </div>
+    <!-- sec 3 end -->
+    <div class="max-w-7xl mx-auto py-14 md:pt-28 md:pb-6 px-4 relative z-10">
+      <h2 class="max-w-sm mx-auto text-3xl lg:text-5xl text-gray-200 text-center mb-9 lg:mb-0">FAQ's</h2>
+      <div class="max-w-xl lg:max-w-none mx-auto grid grid-cols-1 lg:grid-cols-[1fr_400px_1fr] xl:grid-cols-[1fr_525px_1fr] gap-5 items-center mb-5">
+        <div class="max-w-none lg:max-w-xs">
+          <p class="font-bold text-[var(--brand-200)] leading-none mb-5">Do I need an account to trade?</p>
+          <p class="leading-snug text-[var(--brand-200)]">No. Trades are wallet-to-wallet via atomic swaps. No custodians and no exchange accounts.</p>
         </div>
-    </section>
-
-    
-    <section id="download" class="bg-gray-900 py-24 sm:py-32 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center scroll-animate">
-            <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">Get Bison Wallet Today</h2>
-            <p class="mt-4 text-lg body-text">
-                Download the latest version for your operating system and join the decentralized future.
-            </p>
-            <div class="mt-10 flex flex-wrap items-center justify-center gap-x-6 gap-y-4">
-                <div class="flex items-stretch border-solid border-gray-400 border-2 rounded-lg cursor-pointer relative">
-                  <a id="downloadLink" href="https://github.com/decred/dcrdex/releases/latest/download/bisonw-desktop-windows-amd64-v1.0.3.msi" class="flex py-2 px-6 justify-center items-center text-lg leading-none btn-primary">
-                    <img id="downloadImg">
-                    <span id="downloadText">Download for Windows (installer)</span>
-                  </a>
-                  <div id="downloadToggleDropdown" class="p-6 place-content-center border-left border-gray-400 border-2 btn-primary">
-                    <i data-lucide="chevron-down"></i>
-                  </div>
-                  <div id="downloadDropdown" class="border-2 border-gray-400 hidden">
-                    <div data-os-variant="windows" data-link="bisonw-desktop-windows-amd64-v1.0.3.msi">Windows (installer)</div>
-                    <div data-os-variant="linux-deb" data-link="bisonw-desktop-linux-amd64-v1.0.3.deb">Debian Linux AMD64 (installer)</div>
-                    <div data-os-variant="linux-amd" data-link="bisonw-linux-amd64-v1.0.3.tar.gz">Linux AMD64 (binary archive)</div>
-                    <div data-os-variant="linux-arm" data-link="bisonw-linux-arm64-v1.0.3.tar.gz">Linux ARM64 (binary archive)</div>
-                    <div data-os-variant="mac-arm-installer" data-link="bisonw-desktop-darwin-arm64-v1.0.3.dmg">Mac OS M-series/ARM (installer)</div>
-                    <div data-os-variant="mac-amd-installer" data-link="bisonw-desktop-darwin-amd64-v1.0.3.dmg">Mac OS AMD64 (installer)</div>
-                    <div data-os-variant="mac-arm" data-link="bisonw-darwin-arm64-v1.0.3.tar.gz">Mac OS M-series/ARM (binary archive)</div>
-                    <div data-os-variant="mac-amd" data-link="bisonw-darwin-amd64-v1.0.3.tar.gz">Mac OS AMD64 (binary archive)</div>
-                    <div data-os-variant="freebsd" data-link="bisonw-freebsd-amd64-v1.0.3.tar.gz">Free BSD AMD64 (binary archive)</div>
-                    <div data-os-variant="riscv" data-link="bisonw-linux-riscv64-v1.0.3.tar.gz">RISC-V 64-bit (binary archive)</div>
-                  </div>
-                </div>
-            </div>
-             <div class="mt-8">
-                 <a href="https://github.com/decred/dcrdex" target="_blank" rel="noopener noreferrer" class="text-sm font-semibold leading-6 text-gray-400 hover:text-white transition duration-200 ease-in-out inline-flex items-center gap-1">
-                    View Source Code on GitHub <span data-lucide="external-link"></span>
-                </a>
-            </div>
+        <div><img src="images/faqimg.png" alt="FAQs" class="mx-auto" /></div>
+        <div class="max-w-none lg:max-w-xs">
+          <p class="font-bold text-[var(--brand-200)] leading-none mb-5">Do I need an account to trade?</p>
+          <p class="leading-snug text-[var(--brand-200)]">No. Trades are wallet-to-wallet via atomic swaps. No custodians and no exchange accounts.</p>
         </div>
-    </section>
-
-    
-    <section id="support" class="py-24 sm:py-32 bg-gray-800 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center scroll-animate">
-            <span class="text-blue-400 mb-4" data-lucide="life-buoy"></span>
-            <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">Support & FAQ</h2>
-            <p class="mt-4 text-lg max-w-2xl mx-auto body-text">
-                Find answers to common questions and get help with Bison Wallet. Check our comprehensive FAQ or reach out to the active Decred community.
-            </p>
-             <div class="flex flex-col lg:flex-row mt-5 justify-center">
-              <a href="https://docs.decred.org/" class="btn-primary rounded-lg px-6 py-3 text-base font-semibold shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500 transition duration-200 ease-in-out inline-flex place-content-center gap-2 transform hover:scale-105 me-0 lg:me-5">
-                Documentation & FAQ
-              </a>
-              <a href="https://decred.org/matrix-support/" class="btn-primary rounded-lg px-6 py-3 text-base font-semibold shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500 transition duration-200 ease-in-out inline-flex place-content-center gap-2 transform hover:scale-105 mx-0 lg:mx-5 mt-5 lg:mt-0">
-                Live Support / Community on Matrix
-              </a>
-              <a href="https://discord.gg/decred" class="btn-primary rounded-lg px-6 py-3 text-base font-semibold shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500 transition duration-200 ease-in-out inline-flex place-content-center gap-2 transform hover:scale-105 ms-0 lg:ms-5 mt-5 lg:mt-0">
-                Live Support / Community on Discord
-              </a>
-            </div>
+      </div>
+      <div class="max-w-xl lg:max-w-none mx-auto grid grid-cols-1 lg:grid-cols-[1fr_400px_1fr] xl:grid-cols-[1fr_525px_1fr] gap-5 items-center">
+        <div class="max-w-none lg:max-w-xs">
+          <p class="font-bold text-[var(--brand-200)] leading-none mb-5">How fast is setup?</p>
+          <p class="leading-snug text-[var(--brand-200)]">Bison uses SPV so you can get going in minutes rather than downloading full chains.</p>
         </div>
-    </section>
-
-    
-    <section id="blog" class="py-24 sm:py-32 bg-gray-900 overflow-hidden">
-        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center scroll-animate">
-            <span class="text-blue-400 mb-4" data-lucide="newspaper"></span>
-            <h2 class="text-3xl font-bold tracking-tight text-white sm:text-4xl">Latest News & Updates</h2>
-            <p class="mt-4 text-lg max-w-2xl mx-auto body-text">
-                Stay informed about Bison Wallet development, new features, DCRDEX news, and educational content from the Decred ecosystem.
-            </p>
-             <div class="mt-10">
-              <a href="https://blog.decred.org/" class="btn-secondary rounded-lg px-6 py-3 text-base font-semibold transition duration-200 ease-in-out inline-flex items-center gap-2 transform hover:scale-105">
-                Visit the Blog <span data-lucide="arrow-right"></span>
-              </a>
-            </div>
+        <div  class="max-w-none lg:max-w-xs mx-auto">
+          <p class="font-bold text-[var(--brand-200)] leading-none mb-5">What are the fees?</p>
+          <p class="leading-snug text-[var(--brand-200)]">The DEX charges no trading fees. You pay normal on‑chain network fees. To enable trading, you post a refundable DCR bond that prevents spam.</p>
         </div>
-    </section>
-
-    
-    <footer class="bg-gray-800 border-t border-gray-700">
-        <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8 overflow-hidden">
-            <nav class="-mx-5 -my-2 flex flex-wrap justify-center scroll-animate" aria-label="Footer">
-
-                <div class="px-5 py-2">
-                    <a href="#features" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">Features</a>
-                </div>
-                 <div class="px-5 py-2">
-                    <a href="#getting-started" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">Get Started</a>
-                </div>
-                <div class="px-5 py-2">
-                    <a href="#security" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">Security</a>
-                </div>
-                 <div class="px-5 py-2">
-                    <a href="#support" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">Support</a>
-                </div>
-                <div class="px-5 py-2">
-                    <a href="https://github.com/decred/dcrdex" target="_blank" rel="noopener noreferrer" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">GitHub</a>
-                </div>
-                <div class="px-5 py-2">
-                  <a href="https://decred.org/" target="_blank" rel="noopener noreferrer" class="text-base text-gray-400 hover:text-gray-300 transition-colors duration-200">Decred.org</a>
-                </div>
-            </nav>
-
-            <div class="mt-8 text-center text-sm text-gray-400 max-w-2xl mx-auto scroll-animate delay-100">
-                <p>Bison Wallet is a community-driven project within the Decred ecosystem, focused on providing secure and private access to decentralized trading via DCRDEX.</p>
+        <div class="max-w-none lg:max-w-xs">
+          <p class="font-bold text-[var(--brand-200)] leading-none mb-5">Can I automate market making?</p>
+          <p class="leading-snug text-[var(--brand-200)]">Yes. Optional market‑maker bots can provide liquidity on the DEX and help capture spreads. You control when and how they run.</p>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- Main end -->
+
+
+
+  <!--footer-start-->
+  <footer class="page-footer relative px-4">
+    <div class="max-w-7xl mx-auto p-px bg-[linear-gradient(to_bottom,transparent_60%,#2970FF_100%)] rounded-[45px] ">
+      <div class="bg-[var(--brand-700)] rounded-[45px] p-6 lg:px-16 xl:px-28 pt-28 pb-20 relative">
+        <div class="flex flex-col sm:flex-row gap-10 sm:gap-0 text-center leading-loose">
+            <div class="flex-1 flex flex-col justify-center">
+              <p class="mb-2"><img src="images/icons/github-icon.png" alt="GitHub" class="mx-auto" /></p>
+              <p class="leading-snug font-bold text-[var(--brand-200)]">Open-source</p>
+              <p class="leading-snug text-[var(--brand-200)]">Built by the community</p>
+            </div>
+            <div class="sm:w-1/2 flex items-center footercontent">
+              <h3 class="text-lg sm:text-2xl sm:max-w-sm mx-auto">Funded by the Decred Treasury; governed by stakeholders.</h3>
+            </div>
+            <div class="flex-1">
+              <ul class="footerlink">
+                <li><a href="#features">Features</a></li>
+                <li><a href="#assets">Assets</a></li>
+                <li><a href="#downloads">Downloads</a></li>
+                <li><a href="https://docs.decred.org/" target="_blank" rel="noopener noreferrer">Docs</a></li>
+                <li><a href="https://decred.org/governance/" target="_blank" rel="noopener noreferrer">Governance</a></li>
+              </ul>
             </div>
-            <p class="mt-8 text-center text-base text-gray-500 scroll-animate delay-200">
-                &copy; 2025 Bison Wallet Contributors. Built by the Decred Community.
-            </p>
         </div>
-    </footer>
-    <script src="/js/lucide.min.js"></script>
-    <script>
-      lucide.createIcons()
-      const userAgent = navigator.userAgent || navigator.vendor || window.opera;
-      const platform = navigator.platform || "unknown";
-      let userOS = 'windows'
-      switch (true) {
-        case (/win/i.test(userAgent)):
-          userOS = "windows"
-          break
-        case (/Mac/i.test(userAgent)):
-          userOS = "mac"
-          break
-        case (/Linux/i.test(userAgent)):
-          userOS = "linux"
-          break
-        case (/freebsd/i.test(userAgent) || /freebsd/i.test(platform)):
-          userOS = "freebsd"
-          break
-        case (/riscv/i.test(userAgent) || /risc-v/i.test(userAgent)):imageError
-          userOS = "riscv"
-      }
-      let arch = "amd"
-      switch (true) {
-        case /aarch64|arm64|armv8/i:
-          arch = "arm"
-          break
-        case /x86_64|amd64|wow64/i:
-          arch = "amd"
-      }
-      const downloadToggleDropdown = document.getElementById("downloadToggleDropdown")
-      const downloadDropdown = document.getElementById("downloadDropdown")
-      const downloadLink = document.getElementById("downloadLink")
-      const downloadText = document.getElementById("downloadText")
-      const downloadImg = document.getElementById("downloadImg")
-      const changeDownloadLink = (bttn) => {
-          downloadText.textContent = `Download for ${bttn.textContent}`
-          downloadLink.href = `https://github.com/decred/dcrdex/releases/latest/download/${bttn.dataset.link}`
-          downloadDropdown.classList.add('hidden')
-          const osVar = bttn.dataset.osVariant.split("-")[0]
-          downloadImg.classList.remove('hidden')
-          switch (osVar) {
-            case 'windows':
-              downloadImg.src = '/img/winlogo.png'
-              break
-            case 'mac':
-              downloadImg.src = '/img/maclogo.png'
-              break
-            case 'linux':
-              downloadImg.src = '/img/linuxlogo.png'
-              break
-            default:
-              downloadImg.classList.add('hidden')
-          }
-      }
-      const downloadSelectBttns = {}
-      for (const bttn of downloadDropdown.querySelectorAll(':scope > div')) {
-        downloadSelectBttns[bttn.dataset.osVariant] = bttn
-        bttn.addEventListener("click", () => changeDownloadLink(bttn))
-      }      
-      downloadToggleDropdown.addEventListener("click", () => downloadDropdown.classList.toggle('hidden'))
-      let bestDownload = userOS
-      if (!(['windows', 'freebsd', 'riscv'].includes(userOS))) {
-        bestDownload += `-${arch}`
-        if (userOS === 'mac') bestDownload += '-installer'
+        <div class="absolute left-1/2 -translate-x-1/2 -bottom-14"><a href="https://decred.org/" target="_blank" rel="noopener noreferrer"><img src="images/footerlogo.png" alt="Decred" class="decred" /></a></div>
+      </div>
+    </div>
+    <div class="flex justify-center py-20 gap-6 sm:gap-16">
+      <a href="https://www.youtube.com/@DecredTV" target="_blank" rel="noopener noreferrer"><img src="images/icons/youtube-icon.png" alt="YouTube" /></a>
+      <a href="https://discord.gg/dXSmwvYury" target="_blank" rel="noopener noreferrer"><img src="images/icons/discord-icon.png" alt="Discord" /></a>
+      <a href="https://bisonrelay.org/" target="_blank" rel="noopener noreferrer"><img src="images/icons/bluesky-icon.png" alt="Bison Relay" /></a>
+      <a href="https://x.com/decredproject" target="_blank" rel="noopener noreferrer"><img src="images/icons/twitter-icon.png" alt="X" /></a>
+      <a href="https://reddit.com/r/decred" target="_blank" rel="noopener noreferrer"><img src="images/icons/reddit-icon.png" alt="Reddit" /></a>
+      <a href="https://chat.decred.org/" target="_blank" rel="noopener noreferrer"><img src="images/icons/moneycontrol-icon.png" alt="Decred Chat" /></a>
+      <a href="https://medium.com/decred" target="_blank" rel="noopener noreferrer"><img src="images/icons/me-icon.png" alt="Medium" /></a>
+    </div>
+  </footer>
+  <!--footer-end-->
+</div>
+<!-- wrapper end -->
+<script>
+  document.querySelectorAll('[data-download-picker]').forEach((picker) => {
+    const action = picker.querySelector('[data-download-action]');
+    const label = picker.querySelector('[data-download-label]');
+    const toggle = picker.querySelector('[data-download-toggle]');
+    const menu = picker.querySelector('[data-download-menu]');
+    const options = [...picker.querySelectorAll('[data-download-option]')];
+
+    const closeMenu = () => {
+      picker.classList.remove('is-open');
+      toggle.setAttribute('aria-expanded', 'false');
+    };
+
+    const toggleMenu = () => {
+      const isOpen = picker.classList.toggle('is-open');
+      toggle.setAttribute('aria-expanded', String(isOpen));
+    };
+
+    action.addEventListener('click', (event) => {
+      if (action.getAttribute('href') === '#') {
+        event.preventDefault();
+        toggleMenu();
       }
-      changeDownloadLink(downloadSelectBttns[bestDownload])
-    </script>
+    });
+
+    toggle.addEventListener('click', () => {
+      toggleMenu();
+    });
+
+    options.forEach((option) => {
+      option.addEventListener('click', (event) => {
+        event.preventDefault();
+        label.textContent = option.dataset.label;
+        action.href = option.href;
+        picker.dataset.platform = option.dataset.platform;
+        options.forEach((item) => item.removeAttribute('aria-current'));
+        option.setAttribute('aria-current', 'true');
+        closeMenu();
+      });
+    });
+
+    document.addEventListener('click', (event) => {
+      if (!picker.contains(event.target)) closeMenu();
+    });
+
+    picker.addEventListener('keydown', (event) => {
+      if (event.key === 'Escape') closeMenu();
+    });
+  });
+</script>
 </body>
-</html>
+</html>