📝 docs: 여러 문서 및 파일 삭제

.claude/skills/markup-promotion/SKILL.md

@@ -0,0 +1,138 @@
+---
+name: markup-promotion
+description: |
+  프로모션/랜딩 페이지용 표준 마크업을 생성합니다.
+  캠페인 유형별 섹션 템플릿(히어로, 특징, CTA, 이벤트 일정 등)을 제공하고
+  반응형·접근성·SEO 메타를 일관되게 적용합니다.
+
+  다음 상황에서 반드시 사용하세요:
+  - "프로모션 페이지 만들어줘", "랜딩 페이지 마크업해줘"
+  - "이벤트 페이지 퍼블리싱", "캠페인 HTML 만들어줘"
+  - 반복적인 프로모션 구조를 빠르게 구현해야 할 때
+---
+
+# 프로모션 마크업 가이드 (markup-promotion)
+
+캠페인 / 이벤트 / 랜딩 페이지의 표준 섹션 구조를 자동 생성합니다.
+
+## 언제 사용하는가
+
+- 신규 프로모션/이벤트 랜딩 페이지를 제작할 때
+- 기존 캠페인 구조를 재사용해 빠르게 개발할 때
+- 팀 표준 프로모션 레이아웃이 필요할 때
+
+## 입력
+
+- 캠페인 명칭, 기간, 주요 메시지
+- 포함할 섹션 목록 (없으면 기본 구성으로 제안)
+- 이미지/에셋 경로 또는 플레이스홀더 여부
+- 다국어 지원 여부
+
+---
+
+## 작업 순서
+
+### Phase 1: 캠페인 유형 분석
+
+1. 제공된 정보에서 아래 유형을 판별한다.
+
+   | 유형 | 특징 |
+   |---|---|
+   | 이벤트 | 기간, 참여 조건, CTA 버튼 |
+   | 상품 출시 | 제품 특징, 스펙, 구매 링크 |
+   | 신규 서비스 | 혜택 강조, 가입 유도 |
+   | 콘텐츠/미디어 | 영상/갤러리 중심, SNS 공유 |
+
+2. 필요한 섹션을 제안한다. 사용자가 별도 지정하지 않으면 기본 구성 사용.
+
+**기본 섹션 구성:**
+```
+Hero → 특징/혜택 → 이벤트 규칙/일정 → FAQ → CTA → Footer
+```
+
+### Phase 2: 섹션별 마크업 생성
+
+각 섹션은 독립 Vue 컴포넌트로 작성한다.
+
+#### Hero 섹션
+```vue
+<section class="relative w-full [height] bg-[color] ...">
+  <div class="...">
+    <h1 class="...">{{ title }}</h1>
+    <p class="...">{{ description }}</p>
+    <a :href="ctaLink" class="...">{{ ctaText }}</a>
+  </div>
+</section>
+```
+
+#### 특징/혜택 섹션
+```vue
+<section aria-labelledby="features-heading">
+  <h2 id="features-heading" class="...">{{ heading }}</h2>
+  <ul class="grid grid-cols-1 md:grid-cols-3 gap-6">
+    <li v-for="item in features" :key="item.id" class="...">
+      ...
+    </li>
+  </ul>
+</section>
+```
+
+#### CTA 섹션
+- 버튼 타입: `<a>` (외부 링크) 또는 `<NuxtLink>` (내부 라우팅)
+- `aria-label`로 버튼 목적 명시
+
+### Phase 3: 반응형 + SEO + 접근성
+
+**반응형**: 모바일 우선 (base → `md:` → `lg:`)
+
+**SEO 메타** (Nuxt `useSeoMeta`):
+```ts
+useSeoMeta({
+  title: '캠페인명 | 브랜드명',
+  description: '캠페인 한 줄 설명',
+  ogTitle: '...',
+  ogImage: '이미지 URL',
+})
+```
+
+**접근성**:
+- 이미지 `alt` 텍스트 (장식용이면 `alt=""`)
+- 섹션 제목 계층 (`h1` → `h2` → `h3`)
+- 카운트다운 타이머: `aria-live="polite"`
+
+### Phase 4: 다국어 처리
+
+다국어 지원 시 i18n 키로 텍스트 분리:
+```vue
+<h1>{{ $t('HERO-title') }}</h1>
+```
+
+키 명명은 `plan-translation-generator` 스킬의 카테고리 가이드 참조.
+
+---
+
+## 출력 형식
+
+```
+## 프로모션 마크업: <캠페인명>
+
+### 섹션 구성
+1. Hero
+2. 특징/혜택
+3. CTA
+
+### 파일 구조
+pages/promotion/<slug>.vue
+components/promotion/
+  ├── PromoHero.vue
+  ├── PromoFeatures.vue
+  └── PromoCta.vue
+
+### 코드
+[각 컴포넌트 코드]
+
+### 체크리스트
+- [ ] 이미지 alt 텍스트 확정
+- [ ] CTA 링크 URL 확정
+- [ ] useSeoMeta 값 확정
+```