diff --git a/app/assets/images/marketing_redesign/menu.svg b/app/assets/images/marketing_redesign/menu.svg
new file mode 100644
index 000000000..610aad5fc
--- /dev/null
+++ b/app/assets/images/marketing_redesign/menu.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5 17H13M5 12H19M5 7H13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/app/assets/images/thoughtbot_horizontal_default_red_on_light.png b/app/assets/images/thoughtbot_horizontal_default_red_on_light.png
new file mode 100644
index 000000000..45bc7fe5e
Binary files /dev/null and b/app/assets/images/thoughtbot_horizontal_default_red_on_light.png differ
diff --git a/app/assets/stylesheets/marketing_redesign/base/_layout.css b/app/assets/stylesheets/marketing_redesign/base/_layout.css
index 46a01aa75..781a67bc1 100644
--- a/app/assets/stylesheets/marketing_redesign/base/_layout.css
+++ b/app/assets/stylesheets/marketing_redesign/base/_layout.css
@@ -11,3 +11,13 @@ main {
 .grid-full {
   grid-column: 1 / -1;
 }
+
+@media screen and (max-width: 988px) {
+  main {
+    transition: transform var(--transition-timing--base)
+      var(--transition-duration--base);
+  }
+  header:has(input.menu-toggle:checked) + main {
+    transform: translateX(22rem);
+  }
+}
diff --git a/app/assets/stylesheets/marketing_redesign/components/_footer.css b/app/assets/stylesheets/marketing_redesign/components/_footer.css
index f0b733836..09d9bcdce 100644
--- a/app/assets/stylesheets/marketing_redesign/components/_footer.css
+++ b/app/assets/stylesheets/marketing_redesign/components/_footer.css
@@ -2,8 +2,9 @@ footer {
   border-top: var(--border--footer);
   display: flex;
   font-size: var(--font-size--small);
-  gap: var(--space--x-large);
-  padding: var(--space--large) Max(var(--space--base), (100% - var(--container--large)) / 2);
+  gap: var(--space--medium) var(--space--x-large);
+  padding: var(--space--large) 0;
+  flex-direction: column;
 
   .logo {
     font-family: var(--font-family--body);
@@ -22,8 +23,9 @@ footer {
 
   nav {
     display: flex;
+    justify-content: space-between;
     gap: var(--space--large);
-    margin-left: auto;
+    flex: 1;
 
     ul {
       --color--link: var(--color--footer-link);
@@ -43,3 +45,15 @@ footer {
     }
   }
 }
+
+@media screen and (min-width: 600px) {
+  footer {
+    flex-direction: row-reverse;
+    padding: var(--space--large)
+      Max(var(--space--base), (100% - var(--container--large)) / 2);
+
+    nav {
+      justify-content: flex-end;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/marketing_redesign/components/_header.css b/app/assets/stylesheets/marketing_redesign/components/_header.css
index e9833ff38..625d3d90a 100644
--- a/app/assets/stylesheets/marketing_redesign/components/_header.css
+++ b/app/assets/stylesheets/marketing_redesign/components/_header.css
@@ -1,14 +1,49 @@
 header {
+  height: 6rem;
+}
+
+.header-container {
   align-items: baseline;
+  background-color: var(--color--background-base);
   display: flex;
   font-family: var(--font-family--heading);
   font-size: var(--font-size--ui);
-  gap: var(--space--x-large);
-  padding: var(--space--base) Max(var(--space--base), (100% - var(--container--large)) / 2);
+  justify-content: space-between;
+  left: 0;
+  padding: 0 var(--space--base) var(--space--base) var(--space--base);
+  position: fixed;
+  top: 0;
+  width: 100%;
+  z-index: var(--z-index--ceiling);
+
+  label.menu-toggle,
+  .spacer {
+    display: inline-block;
+    height: var(--space--x-large);
+    padding: var(--space--small);
+    width: var(--space--x-large);
+  }
+
+  .spacer {
+    caret-color: transparent;
+    pointer-events: none;
+  }
+
+  input.menu-toggle {
+    display: none;
+  }
 
   .logo {
+    color: var(--color--text-base);
+    display: inline-block;
     font-family: var(--font-family--body);
     font-size: var(--font-size--body);
+    text-decoration: none;
+    width: auto;
+
+    .subtitle {
+      display: none;
+    }
 
     svg {
       height: var(--font-size--300);
@@ -18,16 +53,25 @@ header {
   }
 
   nav {
+    background-color: var(--color--background-dark);
+    bottom: 0;
+    box-shadow: -8px 8px 37.6px -12px var(--color--gray-400) inset;
     flex-grow: 1;
     font-weight: var(--font-weight--extrabold);
+    height: calc(100vh - 60px);
+    left: -100%;
+    padding: var(--space--base);
+    position: fixed;
+    transition: left var(--transition-timing--base)
+      var(--transition-duration--base);
 
     ul {
       --color--link: var(--color--header-link);
       --color--link-hover: var(--color--header-link-hover);
-
-      align-items: center;
+      align-items: flex-start;
       display: flex;
-      gap: var(--space--medium);
+      flex-direction: column;
+      gap: var(--space--small);
       margin: 0;
       padding: 0;
 
@@ -40,6 +84,15 @@ header {
           gap: var(--space--x-small);
           text-decoration: none;
 
+          &:not(.button) {
+            padding: var(--space--small);
+          }
+
+          &.button--secondary {
+            background-color: transparent;
+            margin-block-start: var(--space--medium);
+          }
+
           .icon--new-window {
             height: calc(var(--font-size--ui) * (17 / 16));
             position: relative;
@@ -51,3 +104,68 @@ header {
     }
   }
 }
+
+@media screen and (min-width: 988px) {
+  .header-container {
+    gap: var(--space--x-large);
+    padding: var(--space--base)
+      Max(var(--space--base), (100% - var(--container--large)) / 2);
+    input[type="checkbox"],
+    label.menu-toggle,
+    .spacer {
+      display: none;
+    }
+
+    .logo .subtitle {
+      display: inline;
+    }
+
+    nav {
+      background-color: transparent;
+      box-shadow: none;
+      flex-grow: 1;
+      font-weight: var(--font-weight--extrabold);
+      height: auto;
+      padding: 0;
+      position: static;
+
+      ul {
+        align-items: center;
+        flex-direction: row;
+        gap: var(--space--medium);
+        margin: 0;
+        padding: 0;
+
+        li {
+          list-style-type: none;
+
+          a {
+            align-items: center;
+            display: flex;
+            gap: var(--space--x-small);
+            text-decoration: none;
+
+            &.button--secondary {
+              margin-block-start: 0;
+
+              .icon--new-window {
+                height: calc(var(--font-size--ui) * (17 / 16));
+                position: relative;
+                top: calc((var(--font-size--ui) * (-1 / 16)) / 2);
+                width: auto;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+@media screen and (max-width: 988px) {
+  .header-container {
+    input[type="checkbox"]:checked ~ nav {
+      left: 0;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/marketing_redesign/components/_testimonial.css b/app/assets/stylesheets/marketing_redesign/components/_testimonial.css
index 0ab5348ae..903299a70 100644
--- a/app/assets/stylesheets/marketing_redesign/components/_testimonial.css
+++ b/app/assets/stylesheets/marketing_redesign/components/_testimonial.css
@@ -47,12 +47,12 @@
   flex-wrap: wrap;
   gap: var(--space--base);
   justify-content: center;
-}
 
-.logo {
-  opacity: 0.8;
-  scale: 0.7;
-  width: min-content;
+  .logo {
+    opacity: 0.8;
+    scale: 0.7;
+    width: min-content;
+  }
 }
 
 @media (min-width: 998px) {
@@ -75,9 +75,9 @@
   .logo-container {
     justify-content: space-between;
     padding: var(--space--x-large);
-  }
 
-  .logo {
-    scale: 1;
+    .logo {
+      scale: 1;
+    }
   }
 }
diff --git a/app/helpers/open_graph_helper.rb b/app/helpers/open_graph_helper.rb
index aa981b359..cd764de33 100644
--- a/app/helpers/open_graph_helper.rb
+++ b/app/helpers/open_graph_helper.rb
@@ -1,7 +1,7 @@
 module OpenGraphHelper
   def open_graph_tags
     raw [
-      tag("meta", property: "og:image", content: image_url("ralph-gradient.png")),
+      tag("meta", property: "og:image", content: image_url("thoughtbot_horizontal_default_red_on_light.png")),
       tag("meta", property: "og:url", content: url_for(only_path: false)),
       tag("meta", property: "og:title", content: page_title)
     ].join("\n")
diff --git a/app/views/layouts/marketing_redesign/_footer.html.erb b/app/views/layouts/marketing_redesign/_footer.html.erb
index 6522af471..e45d1426d 100644
--- a/app/views/layouts/marketing_redesign/_footer.html.erb
+++ b/app/views/layouts/marketing_redesign/_footer.html.erb
@@ -1,16 +1,7 @@
 <footer>
-  <div>
-    <span class="logo">
-      <%= inline_svg_tag("marketing/upcase-logo--small.svg") %>
-      <%= t("layouts.app_name_subtitle") %>
-    </span>
-
-    <p class="copyright"><%= t("layouts.copyright", current_year: Date.current.year) %></p>
-  </div>
-
   <nav>
     <div>
-      <%= t(".links_heading") %>
+      <strong><%= t(".links_heading") %></strong>
       <ul>
         <li>
           <%= link_to(
@@ -22,7 +13,7 @@
     </div>
 
     <div>
-      <%= t(".resources_heading") %>
+      <strong><%= t(".resources_heading") %></strong>
       <ul>
         <li>
           <%= link_to(
@@ -39,4 +30,12 @@
       </ul>
     </div>
   </nav>
+  <div>
+    <span class="logo">
+      <%= inline_svg_tag("marketing/upcase-logo--small.svg") %>
+      <%= t("layouts.app_name_subtitle") %>
+    </span>
+
+    <p class="copyright"><%= t("layouts.copyright", current_year: Date.current.year) %></p>
+  </div>
 </footer>
diff --git a/app/views/layouts/marketing_redesign/_header.html.erb b/app/views/layouts/marketing_redesign/_header.html.erb
index a255d9f89..74ea1564f 100644
--- a/app/views/layouts/marketing_redesign/_header.html.erb
+++ b/app/views/layouts/marketing_redesign/_header.html.erb
@@ -1,40 +1,50 @@
 <header>
-  <span class="logo">
-    <%= inline_svg_tag("marketing/upcase-logo--small.svg") %>
-    <%= t("layouts.app_name_subtitle") %>
-  </span>
+  <div class="header-container">
+    <input type="checkbox" name="menu-toggle" id="menu-toggle" class="menu-toggle" aria-label="hamburger" aria-controls="menu" aria-expanded="false" >
+    <label class="menu-toggle" for="menu-toggle" id="hamburger" aria-hidden="true">
+      <%= inline_svg_tag("marketing_redesign/menu.svg") %>
+    </label>
+    <%= link_to(
+      {controller: "/marketing_redesign/home", action: :show},
+      class: "logo"
+      ) do %>
+        <%= inline_svg_tag("marketing/upcase-logo--small.svg") %>
+        <span class="subtitle"><%= t("layouts.app_name_subtitle") %></span>
+    <% end %>
+    <span class="spacer"></span>
 
-  <nav>
-    <ul>
-      <li>
-        <%= link_to(
-          t(".nav.links.root"),
-          {controller: "/marketing_redesign/home", action: :show}
-        ) %>
-      </li>
-      <li>
-        <%= link_to(
-          t(".nav.links.about_show"),
-          {controller: "/marketing_redesign/about", action: :show}
-        ) %>
-      </li>
-      <li>
-        <%= link_to(
-          {controller: "/marketing", action: :show},
-          target: "_blank",
-          rel: "noopener"
-        ) do %>
-          <%= t(".nav.links.root_marketing_show") %>
-          <%= inline_svg_tag("marketing_redesign/new_window.svg", class: "icon--new-window") %>
-        <% end %>
-      </li>
-      <li style="margin-left: auto;">
-        <%= link_to(
-          t(".nav.links.contacts_new"),
-          {controller: "/marketing_redesign/opportunities", action: :new},
-          class: "button button--secondary"
-        ) %>
-      </li>
-    </ul>
-  </nav>
+    <nav>
+      <ul>
+        <li>
+          <%= link_to(
+            t(".nav.links.root"),
+            {controller: "/marketing_redesign/home", action: :show}
+          ) %>
+        </li>
+        <li>
+          <%= link_to(
+            t(".nav.links.about_show"),
+            {controller: "/marketing_redesign/about", action: :show}
+          ) %>
+        </li>
+        <li>
+          <%= link_to(
+            {controller: "/marketing", action: :show},
+            target: "_blank",
+            rel: "noopener"
+          ) do %>
+            <%= t(".nav.links.root_marketing_show") %>
+            <%= inline_svg_tag("marketing_redesign/new_window.svg", class: "icon--new-window") %>
+          <% end %>
+        </li>
+        <li style="margin-left: auto;">
+          <%= link_to(
+            t(".nav.links.contacts_new"),
+            {controller: "/marketing_redesign/opportunities", action: :new},
+            class: "button button--secondary"
+          ) %>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </header>
diff --git a/app/views/marketing_redesign/home/show.html.erb b/app/views/marketing_redesign/home/show.html.erb
index 7fa43a7fa..366e670d0 100644
--- a/app/views/marketing_redesign/home/show.html.erb
+++ b/app/views/marketing_redesign/home/show.html.erb
@@ -26,7 +26,7 @@
       <q class="quote text-xl"><%= t("marketing_redesign.home.show.testimonials.quotes.patrick_cushing_quote_html") %></q>
       <div class="author">
         <div class="author-avatar">
-          <%= image_tag "marketing_redesign/patrick.png", alt: "Vimeo logo", class: "avatar" %>
+          <%= image_tag "marketing_redesign/patrick.png", alt: "Patrick Cushing wearing a green polo shirt and smiling", class: "avatar" %>
         </div>
         <div class="author-info">
           <p class="author-name"><strong>Patrick Cushing</strong></p>