diff --git a/website/src/components/HomepageHeader/index.js b/website/src/components/HomepageHeader/index.js
index 1459569a..8ff39a5c 100644
--- a/website/src/components/HomepageHeader/index.js
+++ b/website/src/components/HomepageHeader/index.js
@@ -36,7 +36,13 @@ export default function HomepageHeader() {
         <div>
           <div className={styles.quickNavigationButtons}>
             <Link className="button button--secondary button--lg" to="/docs/tutorials/quick-start/">
-              Quick Start - 5min ⏱️
+              Quick Start – 5min ⏱️
+            </Link>
+            <Link
+              className={clsx('button', 'button--secondary', 'button--lg', styles.adventButton)}
+              to="/blog/tags/advent-of-pbt-2024/"
+            >
+              Save Christmas – Play! 🎄
             </Link>
           </div>
         </div>
diff --git a/website/src/components/HomepageHeader/styles.module.css b/website/src/components/HomepageHeader/styles.module.css
index e6659f4e..a61009ca 100644
--- a/website/src/components/HomepageHeader/styles.module.css
+++ b/website/src/components/HomepageHeader/styles.module.css
@@ -42,6 +42,21 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  flex-direction: column;
+  flex-direction: row;
   gap: 0.25rem;
 }
+
+@media screen and (max-width: 996px) {
+  .quickNavigationButtons {
+    flex-direction: column;
+  }
+}
+
+.adventButton {
+  background-color: rgb(255, 150, 150);
+  border-color: rgb(255, 170, 170);
+}
+
+.adventButton:hover {
+  background-color: rgb(255, 31, 31);
+}