From 9b9745e6e2ba1bbdea2aae6d47432da627b041d8 Mon Sep 17 00:00:00 2001
From: Andymick <andymick03@yahoo.com>
Date: Sun, 19 Jul 2026 06:38:14 +0100
Subject: [PATCH] Add: Prominent 'Shop plain items' section to homepage

Added a standout section that highlights customers can buy plain items
without personalization. Features:
- Eye-catching orange gradient background
- Clear messaging about skipping the design step
- Direct link to plain items collection
- Positioned between path choice and gallery sections
---
 .claude/settings.local.json |  3 ++-
 src/app/page.tsx            | 35 +++++++++++++++++++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/.claude/settings.local.json b/.claude/settings.local.json
index 9005789..a6be3b7 100644
--- a/.claude/settings.local.json
+++ b/.claude/settings.local.json
@@ -84,7 +84,8 @@
       "Bash(git commit -m 'Fix: Route photo requests to design canvas instead of approval upload *)",
       "Bash(git commit -m 'Fix: Pass photo request ID instead of data URL *)",
       "Bash(git commit -m 'Feature: Add product selection when starting design from photo request *)",
-      "Bash(git commit -m 'Refactor: Move start design server action to separate file *)"
+      "Bash(git commit -m 'Refactor: Move start design server action to separate file *)",
+      "Bash(git commit -m 'Add: Prominent '\\\\''Shop plain items'\\\\'' section to homepage *)"
     ]
   }
 }
diff --git a/src/app/page.tsx b/src/app/page.tsx
index cc9615c..04e0783 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -188,6 +188,41 @@ export default async function HomePage() {
         </Reveal>
       </section>
 
+      {/* Shop plain items — stand-out section */}
+      <section className="mx-auto max-w-6xl px-6 py-16">
+        <Reveal>
+          <div className="relative overflow-hidden rounded-lg border-2 border-splash-orange bg-gradient-to-br from-splash-orange/5 to-splash-pink/5 p-12">
+            <div className="absolute -right-20 -top-20 h-60 w-60 rounded-full bg-splash-orange opacity-10 blur-3xl" />
+            <div className="absolute -bottom-10 -left-10 h-40 w-40 rounded-full bg-splash-pink opacity-10 blur-2xl" />
+
+            <div className="relative z-10">
+              <p className="tag-label text-splash-orange">Skip the design step</p>
+              <h2 className="mt-3 font-display text-4xl">Just want to buy plain items?</h2>
+              <p className="mt-4 max-w-2xl text-base text-muted">
+                Not everyone wants to personalize. We offer a range of plain, ready-to-wear items with no
+                customization needed — perfect if you just love the style as-is. Pick a color, choose your size,
+                and you're done. It's that simple.
+              </p>
+
+              <div className="mt-8 flex flex-wrap gap-4">
+                <Link
+                  href="/products"
+                  className="bg-splash-orange px-8 py-4 text-base font-medium text-paper transition-colors hover:bg-splash-orange/90"
+                >
+                  Browse plain items
+                </Link>
+                <Link
+                  href="/#how-it-works"
+                  className="border-2 border-splash-orange px-8 py-4 text-base font-medium text-splash-orange transition-colors hover:bg-splash-orange/10"
+                >
+                  How it works
+                </Link>
+              </div>
+            </div>
+          </div>
+        </Reveal>
+      </section>
+
       {/* Gallery preview — completed work, prominent placement near the top. Always
           shown (with a "coming soon" state when empty) so it never disappears
           entirely — a link this prominent shouldn't come and go with photo count. */}