diff --git a/client/src/components/netflix-grid.tsx b/client/src/components/netflix-grid.tsx
index 55ad200..49d7153 100644
--- a/client/src/components/netflix-grid.tsx
+++ b/client/src/components/netflix-grid.tsx
@@ -136,20 +136,9 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
 
   const scroll = (direction: 'left' | 'right') => {
     if (scrollRef.current) {
-      // Responsive scroll amount - different sizes for mobile/tablet/desktop
-      const width = window.innerWidth;
-      let scrollAmount;
-      
-      if (width < 640) {
-        // Mobile: smaller cards (176px + gap)
-        scrollAmount = 192;
-      } else if (width < 768) {
-        // Small tablet: medium cards (224px + gap)
-        scrollAmount = 240;
-      } else {
-        // Desktop: large cards (320px + gap)
-        scrollAmount = 336;
-      }
+      // Viewport-based scroll amount for full-width cards
+      const containerWidth = scrollRef.current.clientWidth;
+      const scrollAmount = containerWidth * 0.8; // Scroll 80% of visible area
       
       const currentScroll = scrollRef.current.scrollLeft;
       const targetScroll = direction === 'left' 
@@ -188,14 +177,14 @@ function CategoryRow({ category, onVideoClick }: CategoryRowProps) {
           <ChevronRight className="w-5 h-5" />
         </Button>
 
-        {/* Scrollable video row */}
+        {/* Scrollable video row - full width edge to edge */}
         <div
           ref={scrollRef}
-          className="flex space-x-4 overflow-x-auto scrollbar-hide pb-4"
+          className="flex space-x-3 overflow-x-auto scrollbar-hide pb-4 px-4"
           style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }}
         >
           {category.videos.map((video, index) => (
-            <div key={video.id} className="flex-shrink-0 w-44 sm:w-56 md:w-80 relative group">
+            <div key={video.id} className="flex-shrink-0 w-[45vw] sm:w-[35vw] md:w-[22vw] lg:w-[18vw] relative group">
               {/* Top 10 Number overlay for first category */}
               {category.title.includes("Top 10") && index < 10 && (
                 <div className="absolute top-2 left-2 z-20 text-white font-black text-4xl sm:text-5xl md:text-7xl drop-shadow-2xl"