diff --git a/assets/tailwind-output.css b/assets/tailwind-output.css
index 0a2859085..ff8db588b 100644
--- a/assets/tailwind-output.css
+++ b/assets/tailwind-output.css
@@ -567,6 +567,16 @@ video {
   width: 100%;
 }
 
+@media (min-width: 600px) {
+  .\!container {
+    max-width: 600px !important;
+  }
+
+  .container {
+    max-width: 600px;
+  }
+}
+
 @media (min-width: 768px) {
   .\!container {
     max-width: 768px !important;
@@ -1014,6 +1024,10 @@ video {
   aspect-ratio: 1 / 1;
 }
 
+.aspect-\[327\/320\] {
+  aspect-ratio: 327/320;
+}
+
 .size-0 {
   width: 0px;
   height: 0px;
@@ -2957,7 +2971,7 @@ video {
             display: block;
             position: absolute;
             content: '';
-            background-image: url('../assets/right-arrow-light.svg');
+            background-image: var(--right-arrow-path);
             background-size: 1.5rem 1.5rem;
             height: 1.5rem;
             width: 1.5rem;
@@ -2994,7 +3008,7 @@ video {
           &:after {
             position: absolute;
             content: '';
-            background-image: url('../assets/right-arrow-dark.svg');
+            background-image: var(--right-arrow-path-dark);
             background-size: 1.5rem 1.5rem;
             height: 1.5rem;
             width: 1.5rem;
@@ -4054,13 +4068,52 @@ iframe#launcher {
     scaleY(var(--tw-scale-y));
 }
 
+@media (min-width: 600px) {
+  .xs\:-left-24 {
+    left: -6rem;
+  }
+
+  .xs\:-right-24 {
+    right: -6rem;
+  }
+
+  .xs\:-left-32 {
+    left: -8rem;
+  }
+
+  .xs\:-right-32 {
+    right: -8rem;
+  }
+
+  .xs\:block {
+    display: block;
+  }
+
+  .xs\:hidden {
+    display: none;
+  }
+
+  .xs\:aspect-auto {
+    aspect-ratio: auto;
+  }
+
+  .xs\:justify-between {
+    justify-content: space-between;
+  }
+
+  .xs\:py-\[3\.75rem\] {
+    padding-top: 3.75rem;
+    padding-bottom: 3.75rem;
+  }
+}
+
 @media (min-width: 768px) {
-  .sm\:left-0 {
-    left: 0px;
+  .sm\:-left-24 {
+    left: -6rem;
   }
 
-  .sm\:right-0 {
-    right: 0px;
+  .sm\:-right-24 {
+    right: -6rem;
   }
 
   .sm\:col-span-2 {
@@ -4245,6 +4298,14 @@ iframe#launcher {
 }
 
 @media (min-width: 1280px) {
+  .md\:left-0 {
+    left: 0px;
+  }
+
+  .md\:right-0 {
+    right: 0px;
+  }
+
   .md\:col-span-2 {
     grid-column: span 2 / span 2;
   }
diff --git a/manifest.json b/manifest.json
index 15f60e9e1..f3efe3399 100644
--- a/manifest.json
+++ b/manifest.json
@@ -1,7 +1,7 @@
 {
   "name": "Copenhagen",
-  "author": "Zendesk",
-  "version": "4.2.8",
+  "author": "Sanctuary Computer",
+  "version": "4.2.9",
   "api_version": 4,
   "default_locale": "en-us",
   "settings": [
diff --git a/src/modules/homepage/HeaderBackgroundMobile.tsx b/src/modules/homepage/HeaderBackgroundMobile.tsx
index 457f8b7da..1a3820552 100644
--- a/src/modules/homepage/HeaderBackgroundMobile.tsx
+++ b/src/modules/homepage/HeaderBackgroundMobile.tsx
@@ -13,7 +13,15 @@ export const HeaderBackgroundMobile: FC<{
             <rect x="271" y="253" width="24" height="24" rx="12" fill="#EDEDED" />
             <rect x="271" y="253" width="24" height="24" fill="url(#pattern1_5543_17009)" />
           </g>
-          <rect x="270.5" y="252.5" width="25" height="25" rx="12.5" stroke="#F50DB4" />
+          <rect
+            x="270.5"
+            y="252.5"
+            width="25"
+            height="25"
+            rx="12.5"
+            stroke="#F50DB4"
+            stroke-width="2"
+          />
         </g>
         <g>
           <g clipPath="url(#clip2_5543_17009)">
@@ -51,7 +59,15 @@ export const HeaderBackgroundMobile: FC<{
             <rect x="10" y="152" width="24" height="24" rx="12" fill="url(#pattern5_5543_17009)" />
             <rect x="10" y="152" width="24" height="24" fill="url(#pattern6_5543_17009)" />
           </g>
-          <rect x="9.5" y="151.5" width="25" height="25" rx="12.5" stroke="#F50DB4" />
+          <rect
+            x="9.5"
+            y="151.5"
+            width="25"
+            height="25"
+            rx="12.5"
+            stroke="#F50DB4"
+            stroke-width="2"
+          />
         </g>
         <g>
           <g clipPath="url(#clip5_5543_17009)">
@@ -77,7 +93,7 @@ export const HeaderBackgroundMobile: FC<{
             rx="18.375"
             transform="matrix(-1 0 0 1 107.75 25)"
             stroke="#F50DB4"
-            stroke-width="0.75"
+            stroke-width="2"
           />
         </g>
         <g>
@@ -107,7 +123,15 @@ export const HeaderBackgroundMobile: FC<{
             <rect x="265" y="4" width="24" height="24" rx="12" fill="#EDEDED" />
             <rect x="265" y="4" width="24" height="24" fill="url(#pattern10_5543_17009)" />
           </g>
-          <rect x="264.5" y="3.5" width="25" height="25" rx="12.5" stroke="#F50DB4" />
+          <rect
+            x="264.5"
+            y="3.5"
+            width="25"
+            height="25"
+            rx="12.5"
+            stroke="#F50DB4"
+            stroke-width="2"
+          />
         </g>
         <g>
           <g clipPath="url(#clip9_5543_17009)">
@@ -121,7 +145,15 @@ export const HeaderBackgroundMobile: FC<{
             <rect x="290" y="153" width="24" height="24" rx="12" fill="#EDEDED" />
             <rect x="290" y="153" width="24" height="24" fill="url(#pattern12_5543_17009)" />
           </g>
-          <rect x="289.5" y="152.5" width="25" height="25" rx="12.5" stroke="#F50DB4" />
+          <rect
+            x="289.5"
+            y="152.5"
+            width="25"
+            height="25"
+            rx="12.5"
+            stroke="#F50DB4"
+            stroke-width="2"
+          />
         </g>
         <g>
           <g clipPath="url(#clip11_5543_17009)">
diff --git a/src/modules/homepage/HomepageModule.tsx b/src/modules/homepage/HomepageModule.tsx
index 03315240b..48563e0c2 100644
--- a/src/modules/homepage/HomepageModule.tsx
+++ b/src/modules/homepage/HomepageModule.tsx
@@ -62,11 +62,11 @@ const Homepage: FC<Props> = ({ homepageData }) => {
   return (
     <div className="page-wrapper">
       {hero && (
-        <div className="Hero rounded-large py-[4.84375rem] sm:py-[3.75rem] px-padding-medium bg-light-surface-2 dark:bg-dark-surface-2 relative overflow-hidden aspect-square sm:aspect-auto h-auto flex flex-col items-center justify-center space-y-8">
-          <div className="size-full absolute top-0 left-0 pointer-events-none flex flex-row items-center justify-center sm:justify-between m-auto overflow-hidden">
-            <HeaderBackgroundLeft className="h-full object-contain absolute top-0 sm:left-0 sm:right-0 sm-md:right-auto bottom-0 m-auto sm:block hidden" />
-            <HeaderBackgroundRight className="h-full object-contain absolute top-0 right-0 bottom-0 sm:block hidden" />
-            <HeaderBackgroundMobile className="w-full object-contain absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 sm:hidden block" />
+        <div className="Hero rounded-large py-[4.84375rem] xs:py-[3.75rem] px-padding-medium bg-light-surface-2 dark:bg-dark-surface-2 relative overflow-hidden aspect-[327/320] xs:aspect-auto h-auto flex flex-col items-center justify-center space-y-8">
+          <div className="size-full absolute top-0 left-0 pointer-events-none flex flex-row items-center justify-center xs:justify-between m-auto overflow-hidden">
+            <HeaderBackgroundLeft className="h-full object-contain absolute top-0 xs:-left-32 sm:-left-24 md:left-0 sm-md:right-auto bottom-0 m-auto xs:block hidden" />
+            <HeaderBackgroundRight className="h-full object-contain absolute top-0 xs:-right-32 sm:-right-24 md:right-0 bottom-0 xs:block hidden" />
+            <HeaderBackgroundMobile className="w-full object-contain absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 xs:hidden block" />
           </div>
           <h2 className="flex flex-col items-center text-light-neutral-1 dark:text-dark-neutral-1 z-50 relative">
             <span
diff --git a/style.css b/style.css
index 5425a851b..d5f8ae212 100644
--- a/style.css
+++ b/style.css
@@ -197,8 +197,8 @@ template {
 }
 
 .avatar-wrapper g:nth-of-type(1) {
-  animation-duration: 5s;
-  animation-delay: 2s;
+  animation-duration: 6s;
+  animation-delay: 1s;
 }
 
 .avatar-wrapper g:nth-of-type(2) {
@@ -207,7 +207,7 @@ template {
 }
 
 .avatar-wrapper g:nth-of-type(3) {
-  animation-duration: 4s;
+  animation-duration: 6s;
   animation-delay: 1s;
 }
 
@@ -217,31 +217,31 @@ template {
 }
 
 .avatar-wrapper g:nth-of-type(5) {
-  animation-duration: 5s;
-  animation-delay: 2s;
+  animation-duration: 4s;
+  animation-delay: 1s;
 }
 
 .avatar-wrapper g:nth-of-type(6) {
-  animation-duration: 4s;
+  animation-duration: 6s;
   animation-delay: 2s;
 }
 
 .avatar-wrapper g:nth-of-type(7) {
-  animation-duration: 4s;
+  animation-duration: 5s;
   animation-delay: 2s;
 }
 
 .avatar-wrapper g:nth-of-type(8) {
-  animation-duration: 4s;
+  animation-duration: 6s;
   animation-delay: 1s;
 }
 
 .avatar-wrapper g:nth-of-type(9) {
-  animation-duration: 5s;
-  animation-delay: 2s;
+  animation-duration: 6s;
+  animation-delay: 1s;
 }
 
 .avatar-wrapper g:nth-of-type(10) {
-  animation-duration: 6s;
+  animation-duration: 4s;
   animation-delay: 1s;
 }
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 1382b8e44..80135b88e 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -35,6 +35,7 @@ const config: Config = {
       /* Max */
       lg: `${SCREEN_SIZE.XL_DESKTOP.min}px`,
       'sm-md': '900px',
+      xs: '600px',
     },
     extend: {
       borderRadius: {