From bb3e4c1f9c306e6d02246e15d304c78552c1f0a0 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Thu, 29 Jan 2026 21:40:24 +0000
Subject: [PATCH] Reverted to commit f66675d6e6dc3f7cdaac94bb97b25b126179e0fd

---
 src/pages/Index.tsx | 23 ++++-------------------
 1 file changed, 4 insertions(+), 19 deletions(-)

diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
index 9081136..b9d757c 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -1,4 +1,4 @@
-import { useState, useMemo, useEffect, useRef } from 'react';
+import { useState, useMemo, useEffect } from 'react';
 import { SearchBar } from '@/components/SearchBar';
 import { CategorySidebar } from '@/components/CategorySidebar';
 import { ProductCard } from '@/components/ProductCard';
@@ -6,7 +6,6 @@ import { FeatureBar } from '@/components/FeatureBar';
 import { QuoteRequestForm } from '@/components/QuoteRequestForm';
 import { products } from '@/data/products';
 import heroBg from '@/assets/hero-banner.png';
-import { ChevronDown } from 'lucide-react';
 import Fuse from 'fuse.js';
 
 // Animated counter hook
@@ -34,11 +33,6 @@ function useAnimatedCounter(end: number, duration: number = 2000) {
 const Index = () => {
   const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
   const [searchQuery, setSearchQuery] = useState('');
-  const shopRef = useRef<HTMLElement>(null);
-
-  const scrollToShop = () => {
-    shopRef.current?.scrollIntoView({ behavior: 'smooth' });
-  };
 
   // Animated stats
   const productsCount = useAnimatedCounter(1000, 2000);
@@ -79,18 +73,9 @@ const Index = () => {
   return <div className="min-h-screen bg-background">
       <section className="relative">
         {/* Hero Image - Full width with aspect ratio */}
-        <div className="relative w-full aspect-[16/9] md:aspect-[16/7] lg:aspect-[16/6] bg-cover bg-center bg-no-repeat bg-muted" style={{
+        <div className="w-full aspect-[16/9] md:aspect-[16/7] lg:aspect-[16/6] bg-cover bg-center bg-no-repeat bg-zinc-700" style={{
         backgroundImage: `url(${heroBg})`
-      }}>
-          {/* Shop Now Button */}
-          <button 
-            onClick={scrollToShop}
-            className="absolute bottom-4 left-1/2 -translate-x-1/2 flex flex-col items-center gap-1 text-primary-foreground bg-primary/90 hover:bg-primary px-6 py-2 rounded-full transition-all duration-300 hover:scale-105 shadow-lg animate-bounce"
-          >
-            <span className="text-sm font-semibold uppercase tracking-wide">Shop Now</span>
-            <ChevronDown className="h-5 w-5" />
-          </button>
-        </div>
+      }} />
         
         {/* Animated Stats Bar - Bottom of hero */}
         <div className="bg-zinc-700 py-4 border-0">
@@ -117,7 +102,7 @@ const Index = () => {
       <FeatureBar />
 
       {/* Main Content: Categories + Products */}
-      <section ref={shopRef} className="container mx-auto px-4 py-8 scroll-mt-4">
+      <section className="container mx-auto px-4 py-8">
         <div className="flex flex-col lg:flex-row gap-6 lg:gap-8">
           {/* Category Sidebar - Sticky */}
           <div className="lg:sticky lg:top-4 lg:self-start">