Y2K Chrome Revival

# Y2K Chrome Revival — web 디자인 팩

## 이 스타일의 정체성
2000년대 초 인터넷 미감의 부활. 거울처럼 반사하는 메탈릭 크롬 그라디언트, 홀로그램/펄 광택, 렌즈 플레어와 블롭 형태. 베벨(입체 돋움) 버튼, 은빛 반사 패널, 픽셀 장식. 미래를 상상하던 낙관적 사이버 키치 — 모든 표면이 빛을 받아 번쩍인다. "MP3 플레이어 UI 같은" 인상이 정답.

## 색
- 배경: `#c9d2e3` (콜드 실버블루) 또는 `radial-gradient(#e8edf6, #aab4cc)` 메탈 배경
- 크롬 표면 그라디언트(핵심): `linear-gradient(180deg, #ffffff 0%, #d4dae8 40%, #8b95ad 50%, #d4dae8 60%, #ffffff 100%)` — 위아래 흰 하이라이트 + 중앙 어두운 띠로 금속 반사 재현
- 홀로그램 강조: `linear-gradient(135deg, #ff9ed8, #9ed8ff, #c8ff9e, #ffe89e)` (펄 무지개)
- 텍스트: `#1a2238` (남색), 크롬 위에서는 `#ffffff` + 1px 다크 테두리(가독)
- 강조 솔리드: `#0a5cff`(일렉트릭 블루) · `#ff5ec8`(핫핑크) — 2개
- 그라디언트는 메탈/홀로그램 용도로 적극 사용(이 스타일의 핵심).

## 타이포그래피
- 디스플레이: `"Orbitron", "Audiowide", sans-serif` (Orbitron은 Google Fonts 공개 웹폰트 — 기하 사이버 디스플레이)
- 본문: `"Rajdhani", Inter, sans-serif` (Rajdhani도 Google Fonts — 콘덴스드 테크)
- H1: `clamp(2.5rem, 6vw, 5rem)`, weight 700, letter-spacing `0.02em`, line-height 1.05 — 크롬 그라디언트로 텍스트 채움(`background-clip: text`) 허용
- H2: `1.625rem`, weight 600
- 본문: `1rem`, weight 500, line-height 1.55
- 라벨: `0.8125rem`, weight 700, 대문자, letter-spacing `0.1em`

## 레이아웃 / 그리드
- 콘텐츠 최대 폭 `1120px`, 좌우 패딩 `20px`
- asymmetric — 패널을 어긋나게, 블롭과 플레어를 자유 배치. 정렬된 그리드를 일부러 피한다.
- 브레이크포인트: `<768px` 1열, `>768px` 다중 패널
- 섹션 간격 `72px` (dense — 요소를 빽빽이), 패널 내부 패딩 `24px`
- 화면 곳곳에 떠다니는 블롭/별/반짝임 장식을 배치(과하게).

## 형태 / 질감
- radius `14px` 카드, 버튼은 `9999px`(알약형 크롬 캡슐).
- 베벨: 버튼·패널에 `border-top: 2px solid rgba(255,255,255,0.9); border-bottom: 2px solid rgba(0,0,0,0.3)` — 위는 밝게 아래는 어둡게 입체 돋움.
- 크롬 표면: 위 메탈 그라디언트 + `box-shadow: inset 0 2px 4px rgba(255,255,255,0.8), 0 6px 16px rgba(0,0,0,0.35)`.
- 광택 하이라이트: 패널 상단에 `::before`로 반투명 흰 하이라이트 줄.
- 블롭: 유기적 둥근 도형에 홀로그램 그라디언트 채움, `filter: blur` 살짝.
- 아이콘: 글로시한 3D 느낌, 픽셀 또는 베벨 처리.

## 모션
- playful. 트랜지션 `200ms ease-out`.
- 호버 시 크롬 표면 그라디언트가 살짝 이동(반사가 움직이는 효과) 또는 홀로그램 hue-rotate.
- 버튼 호버: `translateY(-2px)` + 하이라이트 강조, active 시 베벨 반전(눌림).
- 블롭·반짝임 장식은 느린 부유 애니메이션(`6s ease-in-out infinite`).
- 렌즈 플레어가 마우스 따라 살짝 이동(선택적).

## 하지 말 것
- 평평한 단색 보라 그라디언트 금지 — 그라디언트는 반드시 메탈 크롬(다중 명도 띠) 또는 홀로그램 무지개.
- 무광택 플랫 디자인 금지 — 모든 표면에 광택/반사/베벨이 있어야 한다.
- 직각 모서리·하드 섀도 금지. 모던 미니멀 산세리프(Inter만 단독) 금지 — Orbitron/Rajdhani.
- 둥근 카드를 균일하게 3개 나열하는 SaaS 그리드 금지 — 패널은 어긋나게.
- 칙칙한 무채색만 쓰지 말 것 — 실버에 홀로그램·일렉트릭 컬러가 섞여야 한다.
- 이모지 금지(픽셀/베벨 아이콘으로). 차분한 미니멀 톤 금지 — 이 스타일은 일부러 과하다.

## 적용 예
- **헤더/네비**: 크롬 그라디언트 바, 베벨 처리, 로고는 Orbitron + 크롬 텍스트 채움. 메뉴는 알약형 크롬 캡슐 버튼.
- **히어로**: 실버블루 메탈 배경에 떠다니는 홀로그램 블롭 2~3개. 중앙보다 약간 좌측에 거대 Orbitron H1(크롬 그라디언트 텍스트). CTA는 일렉트릭 블루 베벨 캡슐 버튼.
- **카드/패널**: 크롬 메탈 그라디언트 표면, radius 14px, 베벨 보더(위 밝게/아래 어둡게), inset 하이라이트. 상단에 광택 줄. 어긋나게 배치.
- **푸터**: 어두운 크롬(`#3a4258` 메탈 그라디언트), 펄 무지개 구분선, 픽셀 장식.