Dark Luxury

# Dark Luxury — web 디자인 팩

## 이 스타일의 정체성
깊은 차콜·먹빛 배경에 금·샴페인 메탈릭 강조와 얇은 하이콘트라스트 세리프 디스플레이가 놓이는 다크 럭셔리 웹이다. 광활한 여백, 풀블리드 고급 이미지, 느리고 우아한 페이드. 무엇을 보면 이 스타일임을 아는가 — 거의 검정에 가까운 배경에 가느다란 디드로 세리프 헤드라인이 떠 있고, 유일한 색 액센트가 금빛 한 톤이며, 모든 모션이 느리게 흐른다.

## 색
- 배경: `#121110` (먹빛 차콜). 섹션 교차로 `#1b1917`(살짝 밝은 차콜).
- 표면(카드): `#1b1917`, 호버 시 `#222020`.
- 텍스트: `#ece7dd` (웜 오프화이트, 본문), 부제·메타는 `#9b948a`.
- 강조: 금 단 하나 — `#c9a55c` (샴페인 골드). 링크·키커·헤어라인·CTA 보더에만, 면적 5% 이하. 금을 면(배경)으로 칠하지 않는다.
- 다크 위 본문 대비: `#ece7dd` on `#121110` ≈ 13:1 (WCAG AAA 만족).

## 타이포그래피
- 디스플레이: `Cormorant Garamond`(Google Fonts) weight 300~500, 대체 `Georgia, serif`. 헤드라인 `clamp(2.6rem, 5.5vw, 5rem)`, weight 300, `letter-spacing: 0.01em`, line-height 1.12. 가늘게 — 럭셔리는 무게가 아니라 우아함.
- 키커/라벨: `Jost`(Google Fonts) `0.72rem`, weight 400, 대문자, `letter-spacing: 0.3em`, 색 `#c9a55c`.
- 본문: `Jost` `1.0rem`, weight 300, line-height 1.85, `letter-spacing: 0.02em`, 측정 60~70자.
- 풀퀘이트: `Cormorant Garamond` italic, `1.8rem`, weight 400.

## 레이아웃 / 그리드
- 콘텐츠 최대 폭: 본문 텍스트 760px, 히어로·이미지는 풀블리드.
- 브레이크포인트: 768px, 1200px. 좌우 패딩 모바일 24px / 데스크탑 72px.
- `full-bleed` — 풀블리드 이미지가 화면을 지배, 텍스트 컬럼은 그 위/사이에 좁게.
- 섹션 수직 리듬: 섹션 간 `clamp(120px, 14vw, 200px)`(airy).
- 12열 그리드는 이미지+텍스트 분할(이미지 7열 / 텍스트 5열, 거터 80px)에만.

## 형태 / 질감
- 모서리: radius `0` — 직각의 정제된 톤.
- 보더: 헤어라인 `1px solid #c9a55c` (디바이더·CTA) 또는 `1px solid rgba(236,231,221,0.12)`(카드 가장자리).
- 그림자: 다크 배경에서는 그림자 대신 표면 명도 차(`#1b1917`)로 깊이. 풀블리드 이미지 위 텍스트 영역엔 `linear-gradient` 어두운 비네트.
- 버튼: 배경 없음, `1px solid #c9a55c`, 금빛 텍스트, 패딩 `18px 44px`, 대문자 `letter-spacing 0.26em`. 호버 시 금빛으로 채워지고 텍스트 `#121110`.
- 이미지: 채도 -15%, 약간 어둡게(`brightness 0.92`), 보더·radius 없음.

## 모션
- 전환: `subtle` — `700ms cubic-bezier(0.22, 1, 0.36, 1)` (느린 우아한 이징).
- 스크롤 진입: `opacity 0 → 1` + `translateY(20px → 0)`, 900ms.
- 호버: 링크 밑줄(금빛)이 좌→우 `width 0 → 100%` 500ms. 버튼 금빛 채움 600ms. 이미지 `scale 1.0 → 1.04` 1100ms.
- translate·bounce·빠른 모션 금지. 모든 것이 느리게 흐른다.

## 하지 말 것
- 보라 그라디언트 금지. 다색 그라디언트 금지 — 배경은 단색 차콜, 어둠 비네트만 허용.
- 금 외 강조색 추가 금지. 금을 면(背景)으로 칠하지 말 것 — 선·텍스트로만.
- 둥근 모서리(radius > 0)·박스 섀도 금지.
- 굵은 헤드라인(weight ≥ 600) 금지 — 디스플레이는 weight 300~500의 가는 세리프.
- 네온·발광 효과 금지(다크지만 사이버 테크가 아님 — 그건 web-dark-terminal 담당).
- 이모지·일러스트·blob 금지.
- 빠르고 통통 튀는 모션(< 400ms, bounce) 금지.

## 적용 예
- **히어로:** 풀블리드 어두운 고급 이미지 + 하단 비네트. 그 위 좌측 정렬 금빛 키커(대문자 넓은 자간) + 가는 세리프 초대형 헤드라인 + 금빛 보더 CTA.
- **카드(컬렉션/서비스):** `#1b1917` 표면, `1px rgba(236,231,221,0.12)` 가장자리. 안에 금빛 키커 + 가는 세리프 제목 + 본문. 호버 시 표면 `#222020` + 금빛 헤어라인 하단에 그어짐.
- **푸터:** `#0d0c0b` 더 깊은 차콜, 상단 금빛 1px 헤어라인. 가는 세리프 사이트명, 대문자 넓은 자간 메뉴, 금빛 소셜 링크 텍스트. 광활한 패딩.