From fc311bbb943a7921f35325db67750775768b589e Mon Sep 17 00:00:00 2001
From: gahusb <bgg8988@gmail.com>
Date: Thu, 16 Apr 2026 04:01:14 +0900
Subject: [PATCH] =?UTF-8?q?feat(nav):=20=ED=88=AC=EB=AA=85=20=EB=B0=B0?=
 =?UTF-8?q?=EA=B2=BD=20+=20=EC=8A=A4=ED=81=AC=EB=A1=A4=20=EC=8B=9C=20?=
 =?UTF-8?q?=EB=B8=94=EB=9F=AC=20+=20JSM=20=EB=A1=9C=EA=B3=A0=20+=20Try=20n?=
 =?UTF-8?q?ow=20CTA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 기본 상태: 배경·경계선 제거 (완전 투명)
- 스크롤 시: 반투명 + backdrop-blur로 영역 표출
- 로고 '쟁승메이드' → 'JSM'
- 샘플 활성 시 팩 상세 동시 활성화 제거 (정확 매칭)
- CTA '시작하기' → 'Try now'
---
 app/components/TopNav.tsx | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/app/components/TopNav.tsx b/app/components/TopNav.tsx
index 3eeaaf4..7c5ea35 100644
--- a/app/components/TopNav.tsx
+++ b/app/components/TopNav.tsx
@@ -33,8 +33,11 @@ export default function TopNav() {
     }
   }, [open]);
 
-  const isActive = (href: string) =>
-    href === '/' ? pathname === '/' : pathname.startsWith(href);
+  const isActive = (href: string) => {
+    if (href === '/') return pathname === '/';
+    if (href === '/services/music') return pathname === '/services/music';
+    return pathname.startsWith(href);
+  };
 
   return (
     <>
@@ -43,17 +46,17 @@ export default function TopNav() {
           scrolled ? 'backdrop-blur-md' : ''
         }`}
         style={{
-          background: scrolled ? 'rgba(6,14,32,0.85)' : 'rgba(6,14,32,0.55)',
-          borderBottom: '1px solid rgba(204,151,255,0.08)',
-          boxShadow: scrolled ? '0 8px 40px 0 rgba(156,72,234,0.12)' : 'none',
+          background: scrolled ? 'rgba(6,14,32,0.7)' : 'transparent',
+          borderBottom: 'none',
+          boxShadow: scrolled ? '0 8px 32px 0 rgba(6,14,32,0.35)' : 'none',
         }}
       >
         <Link
           href="/"
           className="kx-display text-2xl font-black tracking-tight kx-gradient-text"
-          style={{ textDecoration: 'none' }}
+          style={{ textDecoration: 'none', letterSpacing: '0.02em' }}
         >
-          쟁승메이드
+          JSM
         </Link>
 
         <div className="hidden md:flex items-center gap-8">
@@ -87,7 +90,7 @@ export default function TopNav() {
             className="kx-btn-primary hidden sm:inline-flex items-center px-5 py-2 rounded-full text-sm"
             style={{ textDecoration: 'none' }}
           >
-            시작하기
+            Try now
           </Link>
           <button
             onClick={() => setOpen(true)}
@@ -109,7 +112,7 @@ export default function TopNav() {
           style={{ background: 'rgba(6,14,32,0.98)', backdropFilter: 'blur(16px)' }}
         >
           <div className="flex items-center justify-between px-6 h-20">
-            <span className="kx-display text-2xl font-black kx-gradient-text">쟁승메이드</span>
+            <span className="kx-display text-2xl font-black kx-gradient-text" style={{ letterSpacing: '0.02em' }}>JSM</span>
             <button
               onClick={() => setOpen(false)}
               aria-label="메뉴 닫기"
@@ -148,7 +151,7 @@ export default function TopNav() {
                 className="kx-btn-primary flex-1 py-3 text-center rounded-full text-sm"
                 style={{ textDecoration: 'none' }}
               >
-                시작하기
+                Try now
               </Link>
             </div>
           </div>