From babf06105b2fbe513bae08263f9722a8588b6174 Mon Sep 17 00:00:00 2001
From: Chen Hui Jing <1461498+huijing@users.noreply.github.com>
Date: Sat, 20 Jan 2024 14:00:20 +0800
Subject: [PATCH] Update dependencies and splash page

---
 package.json                                |   8 +-
 src/components/Header.astro                 |   2 +-
 src/components/pages/Footer.astro           |   4 +-
 src/components/pages/FoundationFooter.astro | 159 ++++++++++++++------
 src/components/pages/FoundationHeader.astro |  49 +++---
 src/components/pages/LanderHeader.astro     |   5 +-
 src/layouts/HomeLayout.astro                |   1 +
 src/layouts/LanderLayout.astro              |   1 +
 src/pages/hackathon-2023.astro              |  30 ++--
 src/pages/hacktoberfest.astro               |  13 +-
 src/pages/index.astro                       |   9 +-
 src/styles/interledger.css                  |  20 +--
 src/styles/pages.css                        |  13 +-
 13 files changed, 188 insertions(+), 126 deletions(-)

diff --git a/package.json b/package.json
index 7437d62..b3a2ba7 100644
--- a/package.json
+++ b/package.json
@@ -9,12 +9,12 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/starlight": "^0.15.0",
+    "@astrojs/starlight": "^0.16.0",
     "@interledger/docs-design-system": "^0.2.1",
     "@types/showdown": "^2.0.6",
-    "astro": "^4.0.3",
-    "node-html-parser": "^6.1.11",
-    "sharp": "^0.33.0",
+    "astro": "^4.2.1",
+    "node-html-parser": "^6.1.12",
+    "sharp": "^0.33.2",
     "showdown": "^2.1.0"
   }
 }
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 532a66d..808931d 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -60,7 +60,7 @@ import DevelopersLogo from "../components/DevelopersLogo.astro";
     overflow: hidden;
     max-width: 100%;
     white-space: nowrap;
-    margin-left: auto;
+    margin-inline-start: auto;
     height: 1.5em;
   }
 
diff --git a/src/components/pages/Footer.astro b/src/components/pages/Footer.astro
index 55969bd..75ed781 100644
--- a/src/components/pages/Footer.astro
+++ b/src/components/pages/Footer.astro
@@ -31,7 +31,7 @@ const currentYear = new Date().getFullYear();
     gap: 1.5em;
     justify-content: center;
     padding: 0;
-    margin-top: var(--space-2xs);
+    margin-block-start: var(--space-2xs);
   }
 
   @media screen and (min-width: 480px) {
@@ -41,7 +41,7 @@ const currentYear = new Date().getFullYear();
     }
 
     ul {
-      margin-top: 0;
+      margin-block-start: 0;
     }
   }
 
diff --git a/src/components/pages/FoundationFooter.astro b/src/components/pages/FoundationFooter.astro
index a661cb8..db2bd7d 100644
--- a/src/components/pages/FoundationFooter.astro
+++ b/src/components/pages/FoundationFooter.astro
@@ -2,38 +2,61 @@
 const currentYear = new Date().getFullYear();
 ---
 <footer class="site-footer" role="contentinfo">
-  <ul class="social-links">
-    <li>
-      <a href="/contact-us" aria-label="Contact form">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 253 178"><title>Mail</title><path fill-rule="evenodd" d="M253 46v109c0 3 0 5-1 8l-64-64 65-53ZM23 0h207c13 0 23 10 23 23v4l-102 84c-18 15-30 15-48 0L0 27v-4C0 10 10 0 23 0Zm218 175c-3 2-7 3-11 3H23c-4 0-8-1-11-3l66-66 15 13c24 19 44 19 67 0l15-13 66 66ZM1 163c0-3-1-5-1-8V46l65 53-64 64Z" clip-rule="evenodd"/></svg>
-      </a>
-    </li>
-    <li>
-      <a href="https://interledger.social/about" aria-label="Interledger's Mastadon instance">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 217 232"><title>Mastadon</title><path fill="#000" fill-rule="evenodd" d="M154.245 176.836c29.07-3.471 54.382-21.382 57.562-37.748 5.013-25.782 4.599-62.916 4.599-62.916 0-50.33-32.975-65.082-32.975-65.082C166.804 3.454 138.254.242 108.594 0h-.729c-29.661.242-58.193 3.454-74.82 11.09 0 0-32.976 14.753-32.976 65.083 0 3.051-.016 6.26-.032 9.601-.046 9.279-.096 19.573.172 30.317 1.197 49.22 9.023 97.729 54.531 109.774 20.982 5.554 38.997 6.716 53.507 5.919 26.31-1.459 41.08-9.39 41.08-9.39l-.867-19.09s-18.803 5.929-39.919 5.206c-20.921-.718-43.007-2.256-46.391-27.943-.313-2.256-.469-4.668-.469-7.202 0 0 20.538 5.02 46.565 6.212 15.915.73 30.84-.932 45.999-2.741Zm23.265-35.818v-60.94c0-12.456-3.171-22.354-9.54-29.676-6.57-7.323-15.173-11.076-25.85-11.076-12.356 0-21.713 4.75-27.898 14.247l-6.015 10.082-6.013-10.082c-6.187-9.499-15.543-14.247-27.898-14.247-10.679 0-19.281 3.754-25.85 11.076-6.37 7.323-9.541 17.22-9.541 29.675v60.941h24.144v-59.15c0-12.469 5.246-18.797 15.74-18.797 11.602 0 17.418 7.507 17.418 22.352V117.8h24.002V85.423c0-14.845 5.815-22.352 17.417-22.352 10.494 0 15.74 6.328 15.74 18.797v59.15h24.144Z" clip-rule="evenodd"/></svg>
-      </a>
-    </li>
-    <li>
-      <a href="https://twitter.com/interledger" aria-label="Interledger's Twitter account">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 1227"><title>Twitter</title><path d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"/></svg>
-      </a>
-    </li>
-    <li>
-      <a href="https://github.com/interledger" aria-label="Interledger's Github account">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34.875 34.004"><title>Github</title><path d="M11.665 27.379c0 .141-.162.253-.366.253-.232.021-.394-.091-.394-.253 0-.141.162-.253.366-.253.211-.021.394.091.394.253Zm-2.187-.316c-.049.141.091.3.3.345a.33.33 0 0 0 .436-.141c.042-.141-.091-.3-.3-.366a.361.361 0 0 0-.436.162Zm3.108-.12c-.2.049-.345.183-.323.345.021.141.2.232.415.183s.345-.183.323-.323-.211-.226-.415-.205ZM17.212 0A16.86 16.86 0 0 0 0 17.156a17.628 17.628 0 0 0 11.918 16.818c.9.162 1.216-.394 1.216-.851 0-.436-.021-2.841-.021-4.317 0 0-4.922 1.055-5.955-2.1 0 0-.8-2.046-1.955-2.573 0 0-1.61-1.1.113-1.083a3.711 3.711 0 0 1 2.714 1.819 3.717 3.717 0 0 0 5.126 1.47 3.908 3.908 0 0 1 1.125-2.37c-3.93-.436-7.9-1.005-7.9-7.77a5.329 5.329 0 0 1 1.659-4.141 6.643 6.643 0 0 1 .183-4.774c1.47-.457 4.852 1.9 4.852 1.9a16.611 16.611 0 0 1 8.831 0s3.382-2.363 4.852-1.9a6.64 6.64 0 0 1 .183 4.774 5.466 5.466 0 0 1 1.814 4.141c0 6.785-4.141 7.327-8.072 7.77a4.158 4.158 0 0 1 1.2 3.263c0 2.37-.021 5.3-.021 5.878 0 .457.323 1.013 1.216.851a17.466 17.466 0 0 0 11.8-16.8C34.875 7.403 26.965 0 17.212 0ZM6.834 24.25c-.091.07-.07.232.049.366.113.112.274.162.366.07.091-.07.07-.232-.049-.366-.113-.112-.274-.161-.366-.07Zm-.759-.57c-.049.091.021.2.162.274a.209.209 0 0 0 .3-.049c.049-.091-.021-.2-.162-.274-.138-.042-.251-.021-.3.05Zm2.278 2.5c-.113.091-.07.3.091.436.162.162.366.183.457.07.091-.091.049-.3-.091-.436-.155-.158-.365-.179-.457-.066Zm-.8-1.034c-.113.07-.113.253 0 .415s.3.232.394.162a.321.321 0 0 0 0-.436c-.1-.158-.283-.228-.395-.137Z"/></svg>
-      </a>
-    </li>
-    <li>
-      <a href="https://www.linkedin.com/company/interledger-foundation/" aria-label="Interledger's Linkedin account">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.378 35.377"><title>Linkedin</title><path d="M7.919 35.377H.584v-23.62h7.335ZM4.248 8.535A4.268 4.268 0 1 1 8.5 4.247a4.284 4.284 0 0 1-4.252 4.288ZM35.37 35.377h-7.319V23.879c0-2.74-.055-6.254-3.813-6.254-3.813 0-4.4 2.977-4.4 6.057v11.7h-7.325V11.757h7.034v3.222h.1a7.707 7.707 0 0 1 6.94-3.814c7.423 0 8.788 4.888 8.788 11.237v12.975Z"></path></svg>
-      </a>
-    </li>
-    <li>
-      <a href="https://communityinviter.com/apps/interledger/interledger-working-groups-slack" aria-label="Interledger Community Slack">
-        <svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 35.377 35.377"><title>Slack</title><path d="M7.432 22.355a3.716 3.716 0 1 1-3.716-3.716h3.716Zm1.873 0a3.716 3.716 0 0 1 7.432 0v9.305a3.716 3.716 0 1 1-7.432 0Zm3.717-14.923a3.716 3.716 0 1 1 3.716-3.716v3.716h-3.716Zm0 1.873a3.716 3.716 0 1 1 0 7.432H3.716a3.716 3.716 0 1 1 0-7.432h9.305Zm14.923 3.716a3.716 3.716 0 1 1 3.716 3.716h-3.716Zm-1.873 0a3.716 3.716 0 0 1-7.432 0V3.716a3.716 3.716 0 1 1 7.432 0Zm-3.717 14.924a3.716 3.716 0 1 1-3.716 3.716v-3.716Zm0-1.873a3.716 3.716 0 1 1 0-7.432h9.305a3.716 3.716 0 0 1 0 7.432Z"></path></svg>
-      </a>
-    </li>
-  </ul>
+  <div class="connect-wrapper">
+    <div class="mailing-list">
+      <h4>Join our mailing list</h4>
+      <form action="https://interledger.us1.list-manage.com/subscribe/post?u=9ced7a326efbb158ae84d30cc&amp;id=7466ff6b0c&amp;f_id=0066e3e5f0" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_self" novalidate="">
+        <div class="mc-field-group">
+          <label for="mce-EMAIL" class="visually-hidden">Email Address</label>
+          <input type="email" name="EMAIL" class="required email" id="mce-EMAIL" required="" value="" placeholder="Email address">
+        </div>
+        <div aria-hidden="true" style="position: absolute; left: -5000px;">
+          <input type="text" name="b_9ced7a326efbb158ae84d30cc_7466ff6b0c" tabindex="-1" value="">
+        </div>
+        <input type="submit" name="subscribe" id="mc-embedded-subscribe" class="button" value="Subscribe">
+      </form>
+    </div>
+    <div class="social-links">
+      <h4>Connect with us</h4>
+      <ul>
+        <li>
+          <a href="/contact" aria-label="Contact form">
+            <svg role="img" viewBox="0 0 253 178"><title>Mail</title><path fill-rule="evenodd" d="M253 46v109c0 3 0 5-1 8l-64-64 65-53ZM23 0h207c13 0 23 10 23 23v4l-102 84c-18 15-30 15-48 0L0 27v-4C0 10 10 0 23 0Zm218 175c-3 2-7 3-11 3H23c-4 0-8-1-11-3l66-66 15 13c24 19 44 19 67 0l15-13 66 66ZM1 163c0-3-1-5-1-8V46l65 53-64 64Z" clip-rule="evenodd"/></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://interledger.social/about" aria-label="Interledger's Mastadon instance">
+            <svg role="img" fill="none" viewBox="0 0 217 232"><title>Mastadon</title><path fill="#000" fill-rule="evenodd" d="M154.245 176.836c29.07-3.471 54.382-21.382 57.562-37.748 5.013-25.782 4.599-62.916 4.599-62.916 0-50.33-32.975-65.082-32.975-65.082C166.804 3.454 138.254.242 108.594 0h-.729c-29.661.242-58.193 3.454-74.82 11.09 0 0-32.976 14.753-32.976 65.083 0 3.051-.016 6.26-.032 9.601-.046 9.279-.096 19.573.172 30.317 1.197 49.22 9.023 97.729 54.531 109.774 20.982 5.554 38.997 6.716 53.507 5.919 26.31-1.459 41.08-9.39 41.08-9.39l-.867-19.09s-18.803 5.929-39.919 5.206c-20.921-.718-43.007-2.256-46.391-27.943-.313-2.256-.469-4.668-.469-7.202 0 0 20.538 5.02 46.565 6.212 15.915.73 30.84-.932 45.999-2.741Zm23.265-35.818v-60.94c0-12.456-3.171-22.354-9.54-29.676-6.57-7.323-15.173-11.076-25.85-11.076-12.356 0-21.713 4.75-27.898 14.247l-6.015 10.082-6.013-10.082c-6.187-9.499-15.543-14.247-27.898-14.247-10.679 0-19.281 3.754-25.85 11.076-6.37 7.323-9.541 17.22-9.541 29.675v60.941h24.144v-59.15c0-12.469 5.246-18.797 15.74-18.797 11.602 0 17.418 7.507 17.418 22.352V117.8h24.002V85.423c0-14.845 5.815-22.352 17.417-22.352 10.494 0 15.74 6.328 15.74 18.797v59.15h24.144Z" clip-rule="evenodd"/></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://twitter.com/interledger" aria-label="Interledger's Twitter account">
+            <svg role="img" viewBox="0 0 1200 1227"><title>Twitter</title><path d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"/></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://github.com/interledger" aria-label="Interledger's Github account">
+            <svg role="img" viewBox="0 0 34.875 34.004"><title>Github</title><path d="M11.665 27.379c0 .141-.162.253-.366.253-.232.021-.394-.091-.394-.253 0-.141.162-.253.366-.253.211-.021.394.091.394.253Zm-2.187-.316c-.049.141.091.3.3.345a.33.33 0 0 0 .436-.141c.042-.141-.091-.3-.3-.366a.361.361 0 0 0-.436.162Zm3.108-.12c-.2.049-.345.183-.323.345.021.141.2.232.415.183s.345-.183.323-.323-.211-.226-.415-.205ZM17.212 0A16.86 16.86 0 0 0 0 17.156a17.628 17.628 0 0 0 11.918 16.818c.9.162 1.216-.394 1.216-.851 0-.436-.021-2.841-.021-4.317 0 0-4.922 1.055-5.955-2.1 0 0-.8-2.046-1.955-2.573 0 0-1.61-1.1.113-1.083a3.711 3.711 0 0 1 2.714 1.819 3.717 3.717 0 0 0 5.126 1.47 3.908 3.908 0 0 1 1.125-2.37c-3.93-.436-7.9-1.005-7.9-7.77a5.329 5.329 0 0 1 1.659-4.141 6.643 6.643 0 0 1 .183-4.774c1.47-.457 4.852 1.9 4.852 1.9a16.611 16.611 0 0 1 8.831 0s3.382-2.363 4.852-1.9a6.64 6.64 0 0 1 .183 4.774 5.466 5.466 0 0 1 1.814 4.141c0 6.785-4.141 7.327-8.072 7.77a4.158 4.158 0 0 1 1.2 3.263c0 2.37-.021 5.3-.021 5.878 0 .457.323 1.013 1.216.851a17.466 17.466 0 0 0 11.8-16.8C34.875 7.403 26.965 0 17.212 0ZM6.834 24.25c-.091.07-.07.232.049.366.113.112.274.162.366.07.091-.07.07-.232-.049-.366-.113-.112-.274-.161-.366-.07Zm-.759-.57c-.049.091.021.2.162.274a.209.209 0 0 0 .3-.049c.049-.091-.021-.2-.162-.274-.138-.042-.251-.021-.3.05Zm2.278 2.5c-.113.091-.07.3.091.436.162.162.366.183.457.07.091-.091.049-.3-.091-.436-.155-.158-.365-.179-.457-.066Zm-.8-1.034c-.113.07-.113.253 0 .415s.3.232.394.162a.321.321 0 0 0 0-.436c-.1-.158-.283-.228-.395-.137Z"/></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://www.instagram.com/interledgerfoundation/" aria-label="Interledger's Instagram account">
+            <svg role="img" viewBox="0 0 360 360"><title>Instagram</title><path d="M180.006 359.582c-16.387 0-32.774.209-49.203-.084-14.711-.25-29.422-.418-44.007-2.717-17.938-2.843-34.577-8.862-48.953-20.442-17.351-14.005-27.955-32.19-32.984-53.761-2.18-9.322-3.227-18.812-3.688-28.343C-.631 217.447.207 180.659.123 143.829c-.042-13.67.461-27.34 1.132-41.052.754-16.345 3.73-32.356 10.939-47.197C23.508 32.337 41.53 16.493 66.007 8.007 76.863 4.244 88.01 2.07 99.495 1.569 115.756.9 132.018.315 148.238.148c25.314-.21 50.545-.21 75.859.083 13.789.126 27.62.71 41.367 1.84 17.561 1.421 34.283 6.228 49.162 15.969 20.159 13.168 33.11 31.688 39.438 54.89 2.85 10.492 4.191 21.152 4.736 31.979 1.928 39.965.964 79.931.922 119.896 0 13.544-.628 27.131-1.802 40.592-1.634 19.146-7.083 37.164-18.483 52.882-14.543 20.025-34.283 31.939-58.298 37.164-11.861 2.592-23.848 3.428-35.918 3.637-21.711.377-43.463.669-65.173.92-.042-.125-.042-.293-.042-.418Zm-.041-32.398v.292c20.201-.292 40.318-.501 60.52-.92 10.477-.209 20.997-.543 31.349-2.591 9.514-1.882 18.567-4.933 26.614-10.577 14.543-10.158 22.381-24.497 25.692-41.595 2.179-11.413 2.389-23.035 2.724-34.573.377-10.743.503-21.487.419-32.189-.126-28.511-.293-57.021-.629-85.532-.125-10.493-.545-20.986-2.556-31.353-2.012-10.242-5.449-19.899-11.777-28.343-10.646-14.172-25.273-21.32-42.289-24.289-10.729-1.881-21.626-2.048-32.481-2.383-11.526-.376-23.052-.46-34.577-.46-31.811.042-63.622-.46-95.474 1.046-8.634.376-17.226 1.38-25.608 3.595-16.345 4.347-29.254 13.419-37.888 28.092-6.496 10.995-9.136 23.202-9.89 35.785-.755 13.126-1.342 26.253-1.426 39.38-.168 27.382-.042 54.763.126 82.104.042 8.82.377 17.641.629 26.462.251 8.904 1.047 17.725 3.059 26.42 4.107 17.6 13.37 31.479 29.17 40.592 10.855 6.229 22.8 8.863 35.164 9.573 13.286.753 26.614 1.171 39.941 1.422 13.077.251 26.153.042 39.188.042Z"/><path fill="#000" d="M180.065 87.558c50.922-.376 93.378 42.097 92.414 94.227-.964 49.413-41.366 89.796-91.073 90.59-51.97.795-95.097-42.097-93.881-94.645 1.173-49.789 42.33-90.59 92.54-90.172Zm59.724 92.263c0-32.942-26.824-59.697-59.766-59.697-33.026 0-59.849 26.755-59.849 59.78 0 32.984 26.739 59.78 59.681 59.78 33.11.042 59.934-26.754 59.934-59.863ZM297.58 84.01c0 11.998-9.639 21.655-21.584 21.697-11.945.042-21.836-9.866-21.794-21.78.042-12.04 9.724-21.571 21.92-21.571 12.028 0 21.458 9.531 21.458 21.655Z"/></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://www.linkedin.com/company/interledger-foundation/" aria-label="Interledger's Linkedin account">
+            <svg role="img" viewBox="0 0 35.378 35.377"><title>Linkedin</title><path d="M7.919 35.377H.584v-23.62h7.335ZM4.248 8.535A4.268 4.268 0 1 1 8.5 4.247a4.284 4.284 0 0 1-4.252 4.288ZM35.37 35.377h-7.319V23.879c0-2.74-.055-6.254-3.813-6.254-3.813 0-4.4 2.977-4.4 6.057v11.7h-7.325V11.757h7.034v3.222h.1a7.707 7.707 0 0 1 6.94-3.814c7.423 0 8.788 4.888 8.788 11.237v12.975Z"></path></svg>
+          </a>
+        </li>
+        <li>
+          <a href="https://communityinviter.com/apps/interledger/interledger-working-groups-slack" aria-label="Interledger Community Slack">
+            <svg role="img" viewBox="0 0 35.377 35.377"><title>Slack</title><path d="M7.432 22.355a3.716 3.716 0 1 1-3.716-3.716h3.716Zm1.873 0a3.716 3.716 0 0 1 7.432 0v9.305a3.716 3.716 0 1 1-7.432 0Zm3.717-14.923a3.716 3.716 0 1 1 3.716-3.716v3.716h-3.716Zm0 1.873a3.716 3.716 0 1 1 0 7.432H3.716a3.716 3.716 0 1 1 0-7.432h9.305Zm14.923 3.716a3.716 3.716 0 1 1 3.716 3.716h-3.716Zm-1.873 0a3.716 3.716 0 0 1-7.432 0V3.716a3.716 3.716 0 1 1 7.432 0Zm-3.717 14.924a3.716 3.716 0 1 1-3.716 3.716v-3.716Zm0-1.873a3.716 3.716 0 1 1 0-7.432h9.305a3.716 3.716 0 0 1 0 7.432Z"></path></svg>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
   <p>Copyright © Interledger Foundation. All rights reserved.</p>
   <ul class="footer-links">
     <li><a href="/">Terms & conditions</a></li>
@@ -45,11 +68,21 @@ const currentYear = new Date().getFullYear();
 <style>
   .site-footer {
     padding: var(--space-m) 0;
-    margin-left: var(--space-m);
-    margin-right: var(--space-m);
+    margin-inline: var(--space-m);
     text-align: center;
-    border-block-start: 1px solid var(--color-primary-fallback);
-    border-block-start: 1px solid var(--color-primary);
+    border-block-start: 1px solid var(--color-black);
+  }
+
+  @media screen and (min-width: 780px) {
+    .connect-wrapper {
+      display: flex;
+      gap: var(--space-2xl);
+      justify-content: center;
+    }
+
+    .site-footer h4 {
+      text-align: left;
+    }
   }
 
   .site-footer ul {
@@ -59,19 +92,30 @@ const currentYear = new Date().getFullYear();
     padding: 0;
   }
 
+  .site-footer h4 {
+    font-size: var(--step--1);
+    color: currentColor;
+    margin-block-end: var(--space-3xs);
+  }
+
   .site-footer a {
-    text-decoration: none;
-    color: var(--color-primary-fallback);
-    color: var(--color-primary);
+    text-decoration: underline;
+    text-decoration-style: dotted;
+    text-underline-offset: 2px;
   }
 
   .site-footer a:hover {
     text-decoration: underline;
+    color: currentColor;
   }
 
-  .social-links {
+  .social-links ul {
     gap: var(--space-s);
-    margin-bottom: var(--space-s);
+    margin-block-end: var(--space-s);
+  }
+
+  .social-links li {
+    flex: none;
   }
 
   .social-links svg {
@@ -80,7 +124,36 @@ const currentYear = new Date().getFullYear();
   }
 
   .site-footer p {
-    margin-bottom: var(--space-s);
+    margin-block-end: var(--space-3xs);
+  }
+
+  .site-footer form {
+    display: flex;
+    margin-block-end: var(--space-s);
+    justify-content: center;
+  }
+
+  .site-footer input {
+    border: 1px solid;
+    padding-inline: var(--space-2xs);
+    padding-block: var(--space-3xs);
+    background-color: var(--color-frost);
+    max-width: 100%;
+    font-size: var(--step--1);
+  }
+
+  .site-footer input[type="email"] {
+    border-start-start-radius: var(--border-radius);
+    border-end-start-radius: var(--border-radius);
+  }
+
+  .site-footer input[type="submit"] {
+    border-start-end-radius: var(--border-radius);
+    border-end-end-radius: var(--border-radius);
+    background-color: var(--color-gray);
+    color: var(--color-white);
+    border: 1px solid var(--color-gray);
+    cursor: pointer;
   }
 
   .footer-links a {
@@ -101,7 +174,7 @@ const currentYear = new Date().getFullYear();
     }
 
     .footer-links li {
-      margin-bottom: var(--space-2xs);
+      margin-block-end: var(--space-2xs);
     }
   }
 </style>
diff --git a/src/components/pages/FoundationHeader.astro b/src/components/pages/FoundationHeader.astro
index bbde50d..49376d1 100644
--- a/src/components/pages/FoundationHeader.astro
+++ b/src/components/pages/FoundationHeader.astro
@@ -109,17 +109,14 @@ import FoundationLogo from "../FoundationLogo.astro";
   position: sticky;
   top: 0;
   z-index: 1;
-  border-block-start: 2px solid var(--color-primary-fallback);
-  border-block-start: 2px solid var(--color-primary);
-  box-shadow: 0px 0px 12px -4px var(--color-primary-fallback);
-  box-shadow: 0px 0px 12px -4px var(--color-primary);
+  border-block-start: 2px solid var(--color-header-accent);
+  box-shadow: var(--box-shadow);
 }
 
 .site-nav {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: var(--site-header-height);
 }
 
 .site-nav ul {
@@ -142,11 +139,13 @@ import FoundationLogo from "../FoundationLogo.astro";
 .site-nav__links a {
   text-decoration: underline 1.5px transparent;
   padding: var(--space-s) var(--space-2xs);
+  color: var(--color-black);
 }
 
 .site-nav__links a:hover {
-  background-color: var(--color-primary-bg-fallback);
-  background-color: var(--color-primary-bg);
+  background-color: var(--color-header-accent);
+  color: currentColor;
+  text-decoration-color: currentColor;
 }
 
 .menu-item--level-1 > a {
@@ -165,11 +164,6 @@ import FoundationLogo from "../FoundationLogo.astro";
   text-decoration: none;
 }
 
-a.switch-link {
-  color: var(--color-primary-fallback);
-  color: var(--color-primary);
-}
-
 a.switch-link:hover {
   text-decoration: underline;
 }
@@ -187,13 +181,17 @@ a.switch-link:hover {
 }
 
 @media screen and (max-width: 1059px) {
+  .site-nav {
+    height: var(--site-header-height);
+  }
+  
   .site-links-wrapper {
     position: absolute;
     background-color: var(--color-header-bg);
     top: var(--site-header-height);
     right: 0;
     transition: transform 300ms ease-in-out;
-    border-block-start: 1px solid var(--color-primary);
+    border-block-start: 1px solid var(--color-header-accent);
   }
 
   .site-links-wrapper.offscreen {
@@ -213,8 +211,7 @@ a.switch-link:hover {
   }
 
   .menu-item--level-1 > .is-active {
-    border-inline-start: 2px solid var(--color-primary-fallback);
-    border-inline-start: 2px solid var(--color-primary);
+    border-inline-start: 2px solid var(--color-header-accent);
   }
 
   .menu-item--level-2 > .is-active {
@@ -222,8 +219,7 @@ a.switch-link:hover {
   }
 
   .switch-link:hover {
-    background-color: var(--color-primary-bg-fallback);
-    background-color: var(--color-primary-bg);
+    background-color: var(--color-header-accent);
   }
 
   .site-nav__toggle {
@@ -246,8 +242,7 @@ a.switch-link:hover {
     position: absolute;
     height: 4px;
     width: 100%;
-    background: var(--color-primary-fallback);
-    background: var(--color-primary);
+    background: currentColor;
     border-radius: 4px;
     opacity: 1;
     left: 0;
@@ -315,13 +310,6 @@ a.switch-link:hover {
     align-items: center;
   }
 
-  .site-nav__links .is-active {
-    text-decoration-color: var(--color-primary-fallback);
-    text-decoration-color: var(--color-primary);
-    color: var(--color-primary-fallback);
-    color: var(--color-primary);
-  }
-
   .has-submenu {
     position: relative;
   }
@@ -329,8 +317,7 @@ a.switch-link:hover {
   .site-nav .menu--level-2 {
     background-color: var(--color-header-bg);
     position: absolute;
-    border-inline-start: 2px solid var(--color-primary-fallback);
-    border-inline-start: 2px solid var(--color-primary);
+    border-inline-start: 2px solid var(--color-header-accent);
     transition: opacity 150ms ease-in;
   }
 
@@ -349,9 +336,9 @@ a.switch-link:hover {
     width: max-content;
     min-width: 100%;
     left: 0;
-    top: calc(1.3em + var(--space-s) * 2);
-    box-shadow: 0px 0px 12px -4px var(--color-primary-fallback);
-    box-shadow: 0px 0px 12px -4px var(--color-primary);
+    top: calc(1.4em + var(--space-s) * 2);
+    box-shadow: 2px 3px 6px -3px hsla(0, 0%, 0%, 0.06),
+    -2px 3px 6px -3px hsla(0, 0%, 0%, 0.06);
   }
 
   .site-nav__toggle {
diff --git a/src/components/pages/LanderHeader.astro b/src/components/pages/LanderHeader.astro
index cf5e20d..b696c67 100644
--- a/src/components/pages/LanderHeader.astro
+++ b/src/components/pages/LanderHeader.astro
@@ -35,8 +35,7 @@ import DevelopersLogo from "../DevelopersLogo.astro";
     justify-content: space-between;
     align-items: center;
     max-width: 95rem;
-    margin-left: auto;
-    margin-right: auto;
+    margin-inline: auto;
     gap: var(--space-s);
   }
 
@@ -62,7 +61,7 @@ import DevelopersLogo from "../DevelopersLogo.astro";
     overflow: hidden;
     max-width: 100%;
     white-space: nowrap;
-    margin-left: auto;
+    margin-inline-start: auto;
     height: 1.5em;
     font-size: var(--step--1);
   }
diff --git a/src/layouts/HomeLayout.astro b/src/layouts/HomeLayout.astro
index 170b9cb..0a28f40 100644
--- a/src/layouts/HomeLayout.astro
+++ b/src/layouts/HomeLayout.astro
@@ -43,6 +43,7 @@ const { title, description } = Astro.props;
 		min-height: 100%;
 		min-width: 360px;
 		font-family: "Titillium", Arial, sans-serif;
+		overflow-x: hidden;
 	}
 
 	/* Background swirl */
diff --git a/src/layouts/LanderLayout.astro b/src/layouts/LanderLayout.astro
index 89f95a6..33679ef 100644
--- a/src/layouts/LanderLayout.astro
+++ b/src/layouts/LanderLayout.astro
@@ -48,6 +48,7 @@ const { title, description, gradient = "option1" } = Astro.props;
 		background-image: var(--gradient);
 		background-repeat: no-repeat;
 		background-attachment: fixed;
+		overflow-x: hidden;
 	}
 
 	main {
diff --git a/src/pages/hackathon-2023.astro b/src/pages/hackathon-2023.astro
index e026393..cd7bf8d 100644
--- a/src/pages/hackathon-2023.astro
+++ b/src/pages/hackathon-2023.astro
@@ -263,8 +263,8 @@ import AnimatedSummitLogo from '../components/pages/AnimatedSummitLogo.astro';
 			color: var(--color-text);
 			cursor: pointer;
 			opacity: 0.75;
-			border-bottom-left-radius: var(--border-radius);
-			border-top-left-radius: var(--border-radius);
+			border-end-start-radius: var(--border-radius);
+			border-start-start-radius: var(--border-radius);
 			transition: opacity 300ms ease-in-out;
 		}
 
@@ -299,11 +299,11 @@ import AnimatedSummitLogo from '../components/pages/AnimatedSummitLogo.astro';
 	}
 
 	aside li {
-		margin-bottom: var(--space-3xs);
+		margin-block-end: var(--space-3xs);
 	}
 
 	aside li ul {
-		margin-top:  var(--space-3xs);
+		margin-block-start:  var(--space-3xs);
 	}
 
 	aside a {
@@ -322,7 +322,7 @@ import AnimatedSummitLogo from '../components/pages/AnimatedSummitLogo.astro';
 		display: flex;
 		gap: 1em;
 		justify-content: center;
-		margin-bottom: var(--space-m)
+		margin-block-end: var(--space-m)
 	}
 
 	.summit-logo__animate {
@@ -340,38 +340,36 @@ import AnimatedSummitLogo from '../components/pages/AnimatedSummitLogo.astro';
 
 	.testnet-logo {
 		max-width: 10em;
-		margin-top: var(--space-s);
-		margin-bottom: var(--space-s);
+		margin-block: var(--space-s);
 	}
 
 	.opp-snippets {
 		max-width: 15em;
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 
 	.opp-logo {
 		max-width: 18em;
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 
 	.webm-logo {
 		max-width: 16em;
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 
 	.interledger-logo {
 		max-width: 12em;
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 
 	.tigerbeetle-logo {
 		max-width: 12em;
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 
 	.padding--large {
-		padding-top: var(--space-3xl);
-		padding-bottom: var(--space-3xl);
+		padding-block: var(--space-3xl);
 	}
 
 	.align--center {
@@ -379,11 +377,11 @@ import AnimatedSummitLogo from '../components/pages/AnimatedSummitLogo.astro';
 	}
 
 	h2, h3 {
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 	
 	p, .content ul, ol {
-		margin-bottom: var(--space-xs);
+		margin-block-end: var(--space-xs);
 	}
 </style>
 
diff --git a/src/pages/hacktoberfest.astro b/src/pages/hacktoberfest.astro
index 303a933..60c84a9 100644
--- a/src/pages/hacktoberfest.astro
+++ b/src/pages/hacktoberfest.astro
@@ -102,8 +102,7 @@ import Section from '../components/pages/Section.astro';
 
 	.vision {
 		max-width: 38em;
-		margin-left: auto;
-		margin-right: auto;
+		margin-inline: auto;
 	}
 
 	.intro-grid {
@@ -160,13 +159,11 @@ import Section from '../components/pages/Section.astro';
 	}
 
 	.padding--small {
-		padding-top: var(--space-s);
-		padding-bottom: var(--space-s);
+		padding-block: var(--space-s);
 	}
 
 	.padding--large {
-		padding-top: var(--space-xl);
-		padding-bottom: var(--space-xl);
+		padding-block: var(--space-xl);
 	}
 
 	.align--center {
@@ -174,10 +171,10 @@ import Section from '../components/pages/Section.astro';
 	}
 
 	h2, h3 {
-		margin-bottom: var(--space-s);
+		margin-block-end: var(--space-s);
 	}
 	
 	p {
-		margin-bottom: var(--space-xs);
+		margin-block-end: var(--space-xs);
 	}
 </style>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 64f8126..bf5a379 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -49,8 +49,8 @@ import HomeLayout from '../layouts/HomeLayout.astro';
     background-repeat: no-repeat;
     background-size: cover;
     background-position: bottom right;
-    background-image: linear-gradient(90deg, #057972 0%, #93944C 52.08%, #FF7A4E 100%);
-    background-image: linear-gradient(to right, oklch(51.95% 0.089 187.7) 0%, oklch(64.96% 0.095 109.48) 52.08%, oklch(72.76% 0.173 38.66) 100%);
+    background-image: linear-gradient(90deg, #007777 0%, #69BCC3 100%);
+    background-image: linear-gradient(to right, oklch(51.54% 0.088 194.77), oklch(74.53% 0.082 202.65));
     min-height: 60vh;
     padding-block: var(--space-m);
     color: var(--color-white);
@@ -60,7 +60,6 @@ import HomeLayout from '../layouts/HomeLayout.astro';
 
   .content-wrapper {
     display: flex;
-    align-items: center;
     justify-content: start;
     gap: var(--space-m);
   }
@@ -87,6 +86,10 @@ import HomeLayout from '../layouts/HomeLayout.astro';
     .hero {
       min-height: 70vh;
     }
+
+    .content-wrapper {
+      align-items: center;
+    }
   }
 
   
diff --git a/src/styles/interledger.css b/src/styles/interledger.css
index 8c6d624..9f398ab 100644
--- a/src/styles/interledger.css
+++ b/src/styles/interledger.css
@@ -56,7 +56,7 @@
 /* Site header overrides */
 header.header {
   background-color: var(--sl-color-black);
-  border-bottom: 0;
+  border-block-end: 0;
   font-family: "Titillium Web";
 }
 
@@ -71,11 +71,11 @@ header.header {
 
 .sl-container .sl-markdown-content astro-island > h1 + p,
 .sl-container .sl-markdown-content astro-island > h1 + blockquote {
-  margin-top: 0;
+  margin-block-start: 0;
 }
 
 .content-panel + .content-panel {
-  padding-top: 0;
+  padding-block-start: 0;
 }
 
 /* Navigation sidebar font issue */
@@ -95,16 +95,16 @@ header.header {
 }
 
 .sl-markdown-content > :first-child {
-  margin-top: var(--space-s);
+  margin-block-start: var(--space-s);
 }
 
 /* Markdown content layout styles */
 div.overview-item.overview-item p {
-  margin-top: var(--space-2xs);
+  margin-block-start: var(--space-2xs);
 }
 
 div.overview-item.overview-item div {
-  margin-top: 0;
+  margin-block-start: 0;
 }
 
 @media screen and (max-width: 599px),
@@ -125,12 +125,12 @@ div.overview-item.overview-item div {
   }
 
   div.overview-item.overview-item.overview-item {
-    margin-top: 0;
+    margin-block-start: 0;
     text-align: center;
   }
 
   div.overview-item.overview-item p {
-    margin-top: var(--space-3xs);
+    margin-block-start: var(--space-3xs);
   }
 
   div.overview-item img {
@@ -140,7 +140,7 @@ div.overview-item.overview-item div {
 }
 
 div.community.community p {
-  margin-top: var(--space-2xs);
+  margin-block-start: var(--space-2xs);
 }
 
 @media screen and (min-width: 600px) {
@@ -151,7 +151,7 @@ div.community.community p {
   }
 
   div.community.community div {
-    margin-top: 0;
+    margin-block-start: 0;
   }
 }
 
diff --git a/src/styles/pages.css b/src/styles/pages.css
index b44bdda..7270584 100644
--- a/src/styles/pages.css
+++ b/src/styles/pages.css
@@ -42,21 +42,24 @@
   --space-3xl: clamp(6.75rem, 5.8696rem + 3.913vw, 9rem);
   --border-radius: 6px;
   --max-content-width: 1160px;
-  --site-header-height: 4.275rem;
+  --site-header-height: 4.375rem;
 
   --box-shadow: 0px 1px 1px hsla(0, 0%, 0%, 0.06),
     0px 2px 2px hsla(0, 0%, 0%, 0.06);
   --color-white: #fff;
   --color-black: #000;
+  --color-gray: #444;
+  --color-frost: rgba(255, 255, 255, 0.5);
 
-  --color-primary-fallback: #057972;
-  --color-primary: oklch(51.95% 0.089 187.7);
+  --color-primary-fallback: #007777;
+  --color-primary: oklch(51.54% 0.088 194.77);
   --color-primary-bg-fallback: rgba(7, 121, 114, 0.1);
   --color-primary-bg: oklch(51.95% 0.089 187.7 / 0.1);
-  --filter-primary: invert(33%) sepia(60%) saturate(1165%) hue-rotate(139deg)
-    brightness(89%) contrast(96%);
+  --filter-primary: invert(18%) sepia(85%) saturate(4735%) hue-rotate(172deg)
+    brightness(93%) contrast(101%);
 
   --color-header-bg: var(--color-white);
+  --color-header-accent: #eee;
   --color-btn-bg: var(--color-white);
 }