diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index d296af2..29f670c 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -34,17 +34,14 @@ export default function Home() {
       const currentScrollY = window.scrollY;
       setIsScrolled(currentScrollY > 100);
       
-      // Always hide menu when at the very top
       if (currentScrollY === 0) {
         setIsMenuVisible(false);
         return;
       }
       
-      // Show menu when scrolling up and past initial threshold
       if (currentScrollY < lastScrollY.current && currentScrollY > 100) {
         setIsMenuVisible(true);
       } 
-      // Hide menu when scrolling down
       else if (currentScrollY > lastScrollY.current) {
         setIsMenuVisible(false);
       }
@@ -53,7 +50,7 @@ export default function Home() {
     };
     
     window.addEventListener('scroll', updateScroll);
-    updateScroll(); // Initial check
+    updateScroll();
     
     return () => window.removeEventListener('scroll', updateScroll);
   }, []);
@@ -87,7 +84,6 @@ export default function Home() {
           exit={{ opacity: 0 }}
           transition={{ duration: 0.7, ease: [0.32, 0.72, 0, 1] }}
         >
-          {/* Skip Link */}
           <a 
             href="#main-content" 
             className={`
@@ -98,7 +94,6 @@ export default function Home() {
             Skip to main content
           </a>
 
-          {/* Menu Bar */}
           <header>
             <motion.nav
               className="fixed top-0 left-0 right-0 z-50 bg-black/90 backdrop-blur-md border-b border-white/10"
@@ -158,14 +153,11 @@ export default function Home() {
             </motion.nav>
           </header>
 
-          {/* Main Content */}
           <div id="main-content" tabIndex={-1}>
-            {/* Hero Section */}
             <section 
               className="relative h-[100svh] bg-black overflow-hidden"
               aria-label="Hero section"
             >
-              {/* Background Image */}
               <motion.div 
                 className="absolute inset-0 w-full md:w-[80%] left-0 md:left-[-15%]"
                 initial={{ opacity: 0, scale: 1.1 }}
@@ -173,7 +165,6 @@ export default function Home() {
                 transition={{ duration: 1.4, ease: [0.32, 0.72, 0, 1], delay: 0.3 }}
                 aria-hidden="true"
               >
-                {/* Mobile Image */}
                 <div className="relative w-full h-full md:hidden">
                   <Image
                     src="/images/hero-background.jpg"
@@ -194,7 +185,6 @@ export default function Home() {
                   />
                 </div>
 
-                {/* Desktop Image */}
                 <div className="relative w-full h-full hidden md:block">
                   <Image
                     src="/images/hero-background.jpg"
@@ -216,11 +206,9 @@ export default function Home() {
                 </div>
               </motion.div>
 
-              {/* Content Container */}
               <div className="absolute inset-0 flex items-center md:justify-start">
                 <div className="w-full md:w-[80%] px-6 sm:px-8 md:pl-[25%] md:pr-0 lg:pl-[50%]">
                   <div className="relative">
-                    {/* Main Title */}
                     <motion.div
                       className="relative z-20 text-center md:text-left"
                       initial={{ opacity: 0, y: 20 }}
@@ -253,7 +241,6 @@ export default function Home() {
                       </div>
                     </motion.div>
 
-                    {/* Bottom Content */}
                     <motion.div 
                       className="mt-8 md:mt-12 mix-blend-difference"
                       initial={{ opacity: 0, y: 20 }}
@@ -276,7 +263,6 @@ export default function Home() {
                       </div>
                     </motion.div>
 
-                    {/* Mobile Categories */}
                     <motion.div 
                       className="mt-8 text-center md:hidden"
                       initial={{ opacity: 0, y: 15 }}
@@ -291,7 +277,6 @@ export default function Home() {
                 </div>
               </div>
 
-              {/* Scroll Indicator/To Top Button */}
               <motion.div 
                 className="fixed bottom-6 md:bottom-8 right-6 md:right-8 z-50"
                 initial={{ opacity: 0 }}
@@ -306,7 +291,6 @@ export default function Home() {
                   aria-label="Scroll to top"
                   tabIndex={0}
                 >
-                  {/* Background */}
                   <motion.div
                     className="absolute right-0 bg-black/50 backdrop-blur-md rounded-full"
                     initial={{ opacity: 0, scale: 0.8 }}
@@ -321,7 +305,6 @@ export default function Home() {
                     }}
                   />
 
-                  {/* Scroll Text and Line */}
                   <motion.div
                     className="flex items-center gap-2 px-3"
                     animate={{ 
@@ -336,7 +319,6 @@ export default function Home() {
                     <div className="w-[40px] md:w-[50px] h-px bg-white/60 origin-right mix-blend-difference" />
                   </motion.div>
                   
-                  {/* Arrow Up */}
                   <motion.div
                     className="absolute right-0 flex items-center justify-center w-10 h-10"
                     initial={{ opacity: 0 }}
@@ -367,11 +349,9 @@ export default function Home() {
               </motion.div>
             </section>
 
-            {/* Details Section */}
             <section id="about" className="py-16 sm:py-20 md:py-24 lg:py-32 bg-black border-t border-white/10">
               <div className="container mx-auto px-4 sm:px-6 md:px-8">
                 <div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-16 lg:gap-24 max-w-7xl mx-auto">
-                  {/* Left Column - About */}
                   <motion.div
                     initial={{ opacity: 0, y: 30 }}
                     whileInView={{ opacity: 1, y: 0 }}
@@ -400,7 +380,6 @@ export default function Home() {
                     </div>
                   </motion.div>
 
-                  {/* Right Column - Measurements */}
                   <motion.div
                     initial={{ opacity: 0, y: 30 }}
                     whileInView={{ opacity: 1, y: 0 }}
@@ -457,7 +436,6 @@ export default function Home() {
               </div>
             </section>
 
-            {/* Categories Section */}
             <section className="relative py-16 sm:py-20 md:py-24 lg:py-32 bg-white">
               <div className="absolute inset-0" style={{ 
                 backgroundImage: `linear-gradient(to right, rgba(0, 0, 0, 0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.03) 1px, transparent 1px)`,
@@ -480,7 +458,6 @@ export default function Home() {
                 </motion.div>
 
                 <div className="grid grid-cols-1 md:grid-cols-3 gap-8 md:gap-12 max-w-5xl mx-auto">
-                  {/* Commercial */}
                   <motion.div
                     className="text-center space-y-4"
                   >
@@ -495,7 +472,6 @@ export default function Home() {
                     </p>
                   </motion.div>
 
-                  {/* Fitness */}
                   <motion.div
                     className="text-center space-y-4"
                   >
@@ -511,7 +487,6 @@ export default function Home() {
                     </p>
                   </motion.div>
 
-                  {/* Editorial */}
                   <motion.div
                     className="text-center space-y-4"
                   >
@@ -529,7 +504,6 @@ export default function Home() {
               </div>
             </section>
 
-            {/* Portfolio Section */}
             <section id="portfolio" className="relative py-16 sm:py-20 md:py-24 lg:py-32 bg-white">
               <div className="absolute inset-0" style={{ 
                 backgroundImage: `linear-gradient(to right, rgba(0, 0, 0, 0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(0, 0, 0, 0.03) 1px, transparent 1px)`,
@@ -586,7 +560,6 @@ export default function Home() {
               </div>
             </section>
 
-            {/* Contact Section */}
             <section id="contact" className="py-16 sm:py-20 md:py-24 lg:py-32 bg-black">
               <div className="container mx-auto px-4 sm:px-6 md:px-8">
                 <motion.div 
@@ -697,7 +670,6 @@ export default function Home() {
             </section>
           </div>
 
-          {/* Footer */}
           <footer 
             className="py-8 bg-black border-t border-white/10" 
             role="contentinfo"
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 3061f76..3f533fe 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -55,6 +55,7 @@ export default {
   		fontFamily: {
 			prompt:['Prompt', 'sans-serif'],
 			playfair: ['Playfair Display', 'serif'],
+			montserrat: ['Montserrat', 'sans-serif']
 		},
   		borderRadius: {
   			lg: 'var(--radius)',