From 56656821a66c9e1cdd7e5076cd0cb63eb0893347 Mon Sep 17 00:00:00 2001
From: Abiram070207 <abiram.r1010@gmail.com>
Date: Wed, 17 Jun 2026 09:18:52 +0530
Subject: [PATCH] Mobile accessible

---
 src/components/Hero.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 500d93a..177a03a 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -68,12 +68,12 @@ export const Hero: React.FC<HeroProps> = ({ onScrollToSection }) => {
       <motion.nav 
         animate={{ opacity: isIntro ? 0 : 1, y: isIntro ? -20 : 0 }}
         transition={{ duration: 0.8, ease: [0.16, 1, 0.3, 1] }}
-        className="w-full max-w-7xl mx-auto flex items-center justify-between px-6 py-4 rounded-2xl glassmorphism shadow-premium z-50"
+        className="w-full max-w-7xl mx-auto flex items-center justify-between px-3.5 sm:px-6 py-3 sm:py-4 rounded-2xl glassmorphism shadow-premium z-50"
         style={{ pointerEvents: isIntro ? 'none' : 'auto' }}
       >
-        <div className="flex items-center gap-3.5 cursor-pointer" onClick={() => onScrollToSection('hero')}>
+        <div className="flex items-center gap-3 cursor-pointer" onClick={() => onScrollToSection('hero')}>
           <div className="relative">
-            <img src={raiseLogo} alt="RAISE Incubator Logo" className="h-11 w-auto object-contain rounded-lg" />
+            <img src={raiseLogo} alt="RAISE Incubator Logo" className="h-9 sm:h-11 w-auto object-contain rounded-lg" />
             <div className="absolute -top-1 -right-1 w-3 h-3 rounded-full bg-emerald-500 border-2 border-white animate-pulse" />
           </div>
         </div>
@@ -107,10 +107,10 @@ export const Hero: React.FC<HeroProps> = ({ onScrollToSection }) => {
         </div>
 
         {/* Call to Action Button & RIT Logo */}
-        <div className="flex items-center gap-4">
+        <div className="flex items-center gap-2 sm:gap-4">
           <button
             onClick={() => onScrollToSection('pitch')}
-            className="relative px-5 py-2.5 rounded-xl bg-neutral-950 hover:bg-neutral-850 text-white font-sans text-sm font-bold shadow-lg shadow-neutral-950/10 transition-all duration-300 hover:scale-[1.02] active:scale-[0.98]"
+            className="relative px-3.5 sm:px-5 py-2 sm:py-2.5 rounded-xl bg-neutral-950 hover:bg-neutral-850 text-white font-sans text-xs sm:text-sm font-bold shadow-lg shadow-neutral-950/10 transition-all duration-300 hover:scale-[1.02] active:scale-[0.98] whitespace-nowrap"
           >
             Pitch Your Idea
           </button>
@@ -126,7 +126,7 @@ export const Hero: React.FC<HeroProps> = ({ onScrollToSection }) => {
             <img 
               src={collegeLogo} 
               alt="RIT College Logo" 
-              className="h-10 w-auto object-contain rounded-lg" 
+              className="h-8 sm:h-10 w-auto object-contain rounded-lg" 
               onError={(e) => {
                 // Hide broken image frame if RIT logo is missing or placeholder is empty
                 (e.target as HTMLElement).style.display = 'none';