diff --git a/website/app/globals.css b/website/app/globals.css
index e0f4e71..a482ff6 100644
--- a/website/app/globals.css
+++ b/website/app/globals.css
@@ -332,8 +332,12 @@ a { color: inherit; text-decoration: none; }
 .button:hover { filter: brightness(1.12); }
 .button:disabled { cursor: wait; opacity: .6; }
 .button-small { font-size: 13px; padding: 9px 13px; }
-main { margin: 0 auto; max-width: 1240px; padding: 72px 28px 100px; }
+main { margin: 0 auto; max-width: 1240px; padding: 6rem 28px 100px; }
 main:has(.flagship-landing), main:has(.flagship-page) { max-width: 100%; padding: 0; }
+.flagship-landing,
+.flagship-page {
+  padding-top: 5rem;
+}
 .hero { max-width: 780px; }
 .flagship-hero { align-items: center; background: linear-gradient(90deg, rgba(10,15,20,.96) 0%, rgba(10,15,20,.78) 48%, rgba(10,15,20,.28)), url('/images/motorsignal-hero.jpg') center/cover; border: 1px solid var(--line); border-radius: 8px; display: grid; gap: 48px; grid-template-columns: 1.05fr .95fr; min-height: 560px; overflow: hidden; padding: 72px; }
 .hero-copy { max-width: 720px; }
@@ -639,7 +643,16 @@ input:focus { border-color: var(--blue); outline: 2px solid color-mix(in srgb, v
 .hero-wrapper {
   position: relative;
   overflow: hidden;
-  padding: 4rem 0 2rem;
+  padding: 2rem 0 2rem;
+}
+
+@media (max-width: 768px) {
+  main {
+    padding: 5.5rem 18px 72px;
+  }
+  .hero-wrapper {
+    padding: 1.5rem 0 1.5rem;
+  }
 }
 
 .hero-glow-1 {