feat: update layout in PrerenderProduct to match SPA design with invisible placeholders for SearchBar and ButtonGroup

src/PrerenderProduct.js

@@ -75,8 +75,8 @@ class PrerenderProduct extends React.Component {
           Toolbar,
           { sx: { minHeight: 64, py: { xs: 0.5, sm: 0 } } },
           React.createElement(
-            Box,
+            Container,
-            { sx: { display: 'flex', alignItems: 'center', px: { xs: 0, sm: 3 }, maxWidth: { xs: 'none', sm: '1200px' }, mx: { xs: 0, sm: 'auto' }, width: '100%' } },
+            { maxWidth: 'lg', sx: { display: 'flex', alignItems: 'center', px: { xs: 0, sm: 3 } } },
             // Desktop: simple layout, Mobile: column layout with SearchBar space
             React.createElement(
               Box,
@@ -88,7 +88,7 @@ class PrerenderProduct extends React.Component {
                   flexDirection: { xs: 'column', sm: 'row' }
                 }
               },
-              // First row: Logo (and ButtonGroup on mobile in SPA, but we don't need ButtonGroup in prerender)
+              // First row: Logo and invisible placeholders to match SPA layout
               React.createElement(
                 Box,
                 { 
@@ -96,12 +96,40 @@ class PrerenderProduct extends React.Component {
                     display: 'flex', 
                     alignItems: 'center', 
                     width: '100%',
-                    justifyContent: { xs: 'flex-start', sm: 'flex-start' }, // Keep desktop simple
+                    justifyContent: { xs: 'space-between', sm: 'flex-start' }, // Match SPA layout
                     minHeight: { xs: 52, sm: 'auto' },
                     px: { xs: 0, sm: 0 }
                   }
                 },
-                React.createElement(Logo)
+                React.createElement(Logo),
+                // Invisible SearchBar placeholder on desktop to match SPA spacing
+                React.createElement(
+                  Box,
+                  { 
+                    sx: { 
+                      display: { xs: 'none', sm: 'block' }, 
+                      flexGrow: 1,
+                      mx: { xs: 0, sm: 2, md: 4 },
+                      visibility: 'hidden',
+                      height: 40 // Match SearchBar height
+                    }
+                  }
+                ),
+                // Invisible ButtonGroup placeholder to match SPA spacing  
+                React.createElement(
+                  Box,
+                  { 
+                    sx: { 
+                      display: { xs: 'flex', sm: 'flex' },
+                      alignItems: { xs: 'flex-end', sm: 'center' },
+                      transform: { xs: 'translateY(4px) translateX(9px)', sm: 'none' },
+                      ml: { xs: 0, sm: 0 },
+                      visibility: 'hidden',
+                      width: { xs: 'auto', sm: '120px' }, // Approximate ButtonGroup width
+                      height: 40
+                    }
+                  }
+                )
               ),
               // Second row: SearchBar placeholder only on mobile
               React.createElement(