diff --git a/apps/landing/src/components/cta-primary-button.tsx b/apps/landing/src/components/cta-primary-button.tsx
index 285084679..81241a295 100644
--- a/apps/landing/src/components/cta-primary-button.tsx
+++ b/apps/landing/src/components/cta-primary-button.tsx
@@ -4,7 +4,11 @@ import Link from 'next/link';
 import { ReactNode, useId } from 'react';
 import { Platform } from '~/utils/current-platform';
 
-type CtaButtonProps = { iconComponent?: Icon; glow?: 'lg' | 'sm' | 'none' } & (
+type CtaButtonProps = {
+	iconComponent?: Icon;
+	glow?: 'lg' | 'sm' | 'none';
+	shrinksOnSmallScreen?: boolean;
+} & (
 	| {
 			href: string;
 			children: ReactNode;
@@ -17,6 +21,7 @@ type CtaButtonProps = { iconComponent?: Icon; glow?: 'lg' | 'sm' | 'none' } & (
 export function CtaPrimaryButton({
 	iconComponent: Icon = ArrowCircleDown,
 	glow = 'lg',
+	shrinksOnSmallScreen = false,
 	...props
 }: CtaButtonProps) {
 	const href =
@@ -30,7 +35,17 @@ export function CtaPrimaryButton({
 				: props.platform?.name
 			: undefined;
 	const children =
-		'children' in props ? props.children : `Download for ${platformName ?? 'Linux'}`;
+		'children' in props ? (
+			props.children
+		) : (
+			<>
+				Download
+				<span className={shrinksOnSmallScreen ? 'max-xl:hidden' : undefined}>
+					{' '}
+					for {platformName ?? 'Linux'}
+				</span>
+			</>
+		);
 
 	const id = useId();
 
@@ -38,9 +53,11 @@ export function CtaPrimaryButton({
 		<Link
 			href={href}
 			className={clsx(
-				'noise with-rounded-2px-border-images inline-flex w-52 cursor-pointer flex-row items-center justify-center gap-x-2 overflow-hidden rounded-xl px-3 py-2',
+				'noise with-rounded-2px-border-images inline-flex cursor-pointer flex-row items-center justify-center gap-x-2 overflow-hidden rounded-xl py-2 pe-4 ps-3',
 				'bg-gradient-to-b from-[#42B2FD] to-[#0078F0] [--border-image:linear-gradient(to_bottom,hsl(200_100%_77%/100%),hsl(200_0%_100%/5%)75%)]',
 				{
+					'xl:w-52': shrinksOnSmallScreen,
+					'w-52': !shrinksOnSmallScreen,
 					'shadow-[0_0px_2.5rem_hsl(207_100%_65%/50%)]': glow === 'lg',
 					'shadow-[0_0.125rem_1.25rem_hsl(207_50%_65%/50%)]': glow === 'sm'
 				}
diff --git a/apps/landing/src/components/global-nav-bar/index.tsx b/apps/landing/src/components/global-nav-bar/index.tsx
index 325a159fc..29238d53c 100644
--- a/apps/landing/src/components/global-nav-bar/index.tsx
+++ b/apps/landing/src/components/global-nav-bar/index.tsx
@@ -34,9 +34,8 @@ export function NavBar() {
 		<>
 			{/* Main Navbar */}
 			<motion.nav
-				// eslint-disable-next-line tailwindcss/no-contradicting-classname
 				className={clsx(
-					'fixed inset-x-0 top-0 z-[110] mx-auto mt-2 w-[calc(100%-2rem)] sm:px-0 md:max-w-[1440px]',
+					'fixed inset-x-0 top-0 z-[110] mx-auto mt-3 w-[calc(100%-2rem)] max-w-screen-xl sm:px-0',
 					'overflow-hidden rounded-xl bg-gradient-to-b from-[#141419] from-60% to-[#2886D5]/10 shadow-[0px_-10px_20px_0px_rgba(40,134,213,0.05)] backdrop-blur backdrop-saturate-[1.8]'
 				)}
 				style={{
@@ -50,7 +49,7 @@ export function NavBar() {
 				<div className="absolute top-0 h-px w-full bg-gradient-to-r from-transparent via-[#2D2D37]/80 to-transparent" />
 				<div className="absolute bottom-0 h-px w-full bg-gradient-to-r from-transparent via-[#2D2D37]/80 to-transparent" />
 				{/* End of Gradient Borders */}
-				<div className="noise noise-faded noise-sm flex flex-wrap items-center justify-between gap-x-8 overflow-hidden px-6 py-3">
+				<div className="noise noise-faded noise-sm flex flex-nowrap items-center justify-between gap-x-8 overflow-hidden px-6 py-3">
 					{/* Spacedrive Logo and Links */}
 					<div className="flex items-center gap-[1.125rem]">
 						<Link href="/">
@@ -63,7 +62,7 @@ export function NavBar() {
 							/>
 						</Link>
 
-						<div className="hidden items-center whitespace-nowrap xl:flex">
+						<div className="hidden items-center whitespace-nowrap lg:flex">
 							{NAVIGATION_ITEMS.map(({ label, href, adornment }) => (
 								<NavLink key={`nav-main-${label}-${href}`} href={href}>
 									{label}{' '}
@@ -78,12 +77,16 @@ export function NavBar() {
 					</div>
 
 					{/* Download Button */}
-					<div className="hidden items-center gap-[20px] xl:flex">
-						<CtaPrimaryButton platform={currentPlatform} glow={'sm'} />
+					<div className="hidden items-center gap-[20px] lg:flex">
+						<CtaPrimaryButton
+							shrinksOnSmallScreen
+							platform={currentPlatform}
+							glow={'sm'}
+						/>
 					</div>
 
 					{/* List Icon */}
-					<div className="flex items-center gap-[20px] xl:hidden">
+					<div className="flex items-center gap-[20px] lg:hidden">
 						<motion.button
 							className="block"
 							onClick={() => setIsMenuOpen(!isMenuOpen)}