diff --git a/modules/swag/components/folk-swag-designer.ts b/modules/swag/components/folk-swag-designer.ts
index 03535b8..00b058f 100644
--- a/modules/swag/components/folk-swag-designer.ts
+++ b/modules/swag/components/folk-swag-designer.ts
@@ -389,8 +389,8 @@ class FolkSwagDesigner extends HTMLElement {
 			</div>` : ""}
 		</section>
 
-		<!-- Step 2: Design Mockup -->
-		<section class="step-section ${this.demoStep >= 2 ? 'visible' : ''}">
+		<!-- Step 2: Design Mockup (always visible alongside product selection) -->
+		<section class="step-section visible">
 			<div class="mockup-area">
 				<div class="mockup-svg">${this.getMockupSvg()}</div>
 				<div class="mockup-info">
@@ -401,8 +401,8 @@ class FolkSwagDesigner extends HTMLElement {
 			</div>
 		</section>
 
-		<!-- Generate button (between step 2 and 3) -->
-		${this.demoStep === 2 && this.usedSampleDesign ? `
+		<!-- Generate button (visible once sample design is loaded) -->
+		${this.usedSampleDesign && this.demoStep < 3 ? `
 		<div class="generate-row">
 			<button class="btn btn-primary generate-btn">Generate Print-Ready Files</button>
 		</div>` : ""}