8e3cdb0d3b
Some checks are pending
ci / build (push) Waiting to run
Measured convergence before: split hero 13/19, top-bar nav 19/19, one-line notice footer 14/19, body Pretendard 17/21, 10 similarity pairs above 0.78. Each showcase got a pre-assigned hero family, nav form, footer form, type pair, background, accent hue, radius, motion grammar and material from outputs/rework-2026-10-06/plan.md; direction cards and the chosen reason are recorded in every design.md. After: 0 similarity warnings, 19 distinct display faces, 7 hero families, 5 nav forms, 5 footer forms, no scroll reveals, 5 showcases with SVG filter materials. Example contact values replace bracket placeholders under the existing fictional-brand notices. Thumbnails, OG images, card copy and three e2e assertions updated; dead CSS in dure-enrollment and hannam-jari removed; similarity.mjs learns the new font families.
60 lines
2.9 KiB
CSS
60 lines
2.9 KiB
CSS
/* ==========================================================================
|
|
향연 — 디자인 토큰 (2026-10-06 재작업)
|
|
컨셉 한 문장: 침향을 찾는 손님이 돌 받침에 꽂힌 향 한 자루와 연기를 보고,
|
|
입고 연도·수지 함량 기록을 읽은 뒤 시향 시간을 확인한다.
|
|
배정(outputs/rework-2026-10-06/plan.md): 제품 단독 히어로 · 내비 없음 ·
|
|
큰 워드마크 푸터 · Gowun Batang / Noto Sans KR · 회보라 #e6e1ea ·
|
|
강조 LCh 10° · radius 2px · scroll-driven 연기 · feTurbulence 연기 재질.
|
|
하지 않은 것: 웜 페이퍼 바탕, 마루 부리, 적갈 강조, 상단 바, 스크롤 리빌 —
|
|
font-foundry·thursday·muwol·materia와 0.80~0.96으로 묶였던 군집의 축이다.
|
|
========================================================================== */
|
|
|
|
:root {
|
|
/* 타입 — 본문 17px(천천히 읽히는 페이지), 표제는 한 줄 큰 낱말 하나뿐이라
|
|
본문의 8배까지 올린다(1440에서 144px, 390에서 63px). */
|
|
--step--1: 0.8125rem; /* 13px — 캡션·표 머리 */
|
|
--step-0: 1.0625rem; /* 17px — 본문 */
|
|
--step-1: 1.25rem; /* 20px — 소제목·가격 */
|
|
--step-2: clamp(1.5rem, 1.25rem + 1.2vw, 2.125rem); /* 24~34px — 섹션 표제 */
|
|
--step-3: clamp(3.5rem, 2rem + 8vw, 9rem); /* 56~144px — h1 한 줄 */
|
|
--step-mark: clamp(5rem, 2rem + 22vw, 20rem); /* 푸터 워드마크 */
|
|
|
|
--leading-tight: 1.2;
|
|
--leading-normal: 1.8;
|
|
|
|
--font-display: "Gowun Batang", "Noto Serif KR", serif;
|
|
--font-body: "Noto Sans KR", "Apple SD Gothic Neo", sans-serif;
|
|
--weight-strong: 400; /* 폰트 전송량 때문에 웨이트는 패밀리당 하나(400)만 싣는다. 강조는 색·크기로 */
|
|
|
|
/* 색 — 회보라 바탕 2단계 + 먹 3단계 + 불씨 1. 강조는 링크·행동·표의 "숙성 중" 한 칸.
|
|
대비(실측 2026-10-06): ink 11.6:1, ink-muted 5.7:1, accent 4.8:1 (모두 #e6e1ea 위). */
|
|
--surface: #e6e1ea;
|
|
--surface-raised: #ddd7e2;
|
|
--ink: #2a2530;
|
|
--ink-muted: #5a5361;
|
|
--line: #c6bfcd;
|
|
--accent: #b62752; /* 불씨 — CIELAB LCh 10.7° (similarity.mjs 기준) */
|
|
--accent-deep: #8f1f40; /* hover·작은 글자 */
|
|
--smoke: #6f6678; /* 연기 — 먹을 바탕 쪽으로 눕힌 회보라 */
|
|
|
|
--space-1: 0.25rem;
|
|
--space-2: 0.5rem;
|
|
--space-3: 1rem;
|
|
--space-4: 1.5rem;
|
|
--space-5: 2.5rem;
|
|
--space-6: 4rem;
|
|
--space-7: 6.5rem;
|
|
--space-8: clamp(5rem, 3.4rem + 6vw, 10rem);
|
|
|
|
--radius: 2px;
|
|
|
|
--measure: 36em; /* 한글 본문 한 줄 32~40자 (typography §6-5) */
|
|
--container: 1160px;
|
|
--pad-inline: clamp(1.25rem, 1rem + 2.5vw, 4.5rem);
|
|
|
|
--dur-quick: 160ms;
|
|
--ease-soft: cubic-bezier(0.25, 1, 0.35, 1);
|
|
|
|
/* 연기 — 스크롤 0~40vh 동안 마스크가 올라가며 연기가 더 높이 보인다. */
|
|
--smoke-rest: 55%; /* 미지원·감소 모션에서 드러나는 높이 */
|
|
}
|