feat: 랜딩 페이지 구현

[wjswlgh96]

작업 유형

• Feat: 새로운 기능 추가
• Fix: 버그 수정
• Docs: 문서 수정
• Refactor: 리팩토링
• Design: UI/CSS 수정
• Chore: 설정, 패키지, 기타 작업
• Hotfix: 긴급 수정

작업 내용

• Figma 디자인 기반 랜딩 페이지 구현
• 섹션 구성: 네비게이션 / 히어로 / 팀 유형 소개(3종) / 기능 소개(7종) / CTA / 푸터
• 데스크톱·모바일 반응형 대응

작업 배경

• 서비스 첫 진입 화면으로, 비로그인 사용자에게 Syncly의 가치(목적별 템플릿 기반 협업 워크스페이스)를 전달하고 로그인/시작 유도가 필요함
• User Flow 1단계(첫 사용자 진입)에 해당하는 화면

To Do

• 네비게이션 바 (로고, 로그인, 무료로 시작 버튼)
• 히어로 섹션 (배지, 그라데이션 헤딩, CTA 버튼 2종)
• 팀 유형 소개 섹션 (팀 프로젝트 / 사이드 프로젝트 / 매장 운영 카드)
• 기능 소개 섹션 (업무 관리, 캘린더, 공지, 회의록, 자료실, 채팅, 진행률 차트)
• 하단 CTA 섹션
• 푸터
• 모바일 반응형 대응

완료 기준

• Figma 디자인과 데스크톱/모바일 화면이 일치한다
• 반응형 브레이크포인트에서 레이아웃이 깨지지 않는다
• npm run check(lint, typecheck, format) 통과

참고 자료

• Figma: https://www.figma.com/design/MGUbA8bYzUb4WdjSm5KKkq/Syncly?node-id=0-1

예상 브랜치명

feat/#1/landing-page