/*
 * THEME: legend  (SPEC §3.2)
 * 출신: _inbox/legend/tokens.css  (+ README.md "Visual foundations")
 *
 * 톤: light/minimal/editorial · "architectural blueprint on white marble"
 * 모노톤 그레이 시스템 + 단 하나의 액센트 보라(#8931c4) — 단, 보라는 PRIMARY CTA 색이 아니다.
 * README 명시: "Primary CTA is --color-button-gray. Do not promote violet to a CTA fill."
 * 그래서 --c-action 은 button-gray(#2d2d2d), --c-accent 가 violet 을 가져간다.
 *
 * canvas 는 #fff 가 아니라 warm off-white #ededed — README 가 굵게 못 박은 부분이라
 * 어떤 부품도 raw #fff 로 치환되면 안 된다.
 *
 * 매핑표 (키트 변수 → 계약 변수):
 *   --color-canvas-white     (#ededed) → --c-canvas             (load-bearing warm off-white)
 *   --color-background-gray  (#dedddc) → --c-surface-soft       (살짝 다른 표면, 섹션 구분)
 *   --color-canvas-white     (#ededed) → --c-surface            (light 카드 기본 — Newsletter 등)
 *   --color-deep-gray        (#131313) → --c-surface-dark       (Stats/CTA bg, Footer, Pricing dark card, Code block)
 *   --color-button-gray      (#2d2d2d) → --c-surface-dark-elev  (dark 위 한 단 elev — pm 토글 pill)
 *
 *   --color-ink-black        (#000000) → --c-ink                (헤드라인/본문 ink)
 *   --color-muted-gray       (#6c6c6c) → --c-body               (body 가독 본문)
 *   --color-medium-gray      (#949494) → --c-muted              (caption/eyebrow mute)
 *   --color-canvas-white     (#ededed) → --c-on-dark            (dark surface 위 텍스트)
 *   --color-light-gray       (#b2b2b2) → --c-on-dark-muted      (dark 위 흐린 — Footer link, code gutter 등)
 *   --color-ink-black        (#000000) → --c-link               (인라인 a)
 *
 *   --color-button-gray      (#2d2d2d) → --c-action             (Legend PRIMARY CTA — README 가 violet 금지 명시)
 *   #222                     (Newsletter hover) → --c-action-hover (button-gray 한 단 아래)
 *   --color-canvas-white     (#ededed) → --c-on-action          (button-gray 위 텍스트)
 *   --color-accent-violet    (#8931c4) → --c-accent             (focus ring · 단일 인라인 keyword · "Q" 마커)
 *
 *   --color-light-gray       (#b2b2b2) → --c-hairline           (light 위 soft separator — README 'borders --color-light-gray')
 *   --color-ink-black        (#000000) → --c-border-strong      (hover/active 강한 경계선)
 *
 *   --color-accent-violet    (#8931c4) → --c-success            (성공/긍정 — Legend는 의미색 없음, accent 재사용)
 *   #c13515                  (도출)            → --c-danger     (키트 미정의, 차분한 burnt brick)
 *
 * 누락 / 도출:
 *   - hover/success/danger 는 키트가 정의 안 함. README 'achromatic by design + accent rationed' 원칙
 *     따라 success 는 accent-violet 재사용, danger 는 톤 충돌 없는 burnt brick (#c13515) 도출.
 *   - 그라데이션 두 개 (--gradient-muted-forest / --gradient-charcoal-dawn) 는 브랜드 시그니처 장식 —
 *     계약하지 않고 hero/cta/blog 부품에서 raw gradient 로 박힘 (decorative_hex_ok: true).
 *   - rgba(137,49,196, 0.10~0.18) — 다크 surface 위 보라 atmospheric overlay. 의도된 장식.
 *
 * 폰트:
 *   tokens.css 안 @import 없음 (키트 자체가 host-loaded 가정). 폰트 변수는
 *   registry/fontsets/legend.{css,json} 에서 분리 — knapp→Inter, diatypeMono→Space Mono substitute.
 *
 * 타입 스케일:
 *   키트가 명시한 6단 + 2단 mono: caption 11 / body 16 / heading 20 / heading-lg 22 /
 *   display-sm 44 / display 56 / mono-xs 11 / mono-sm 13.
 *   "Display sizes are exact" — README 가 못 박았으므로 그대로 보존.
 *   --t-display 는 키트 display 56 (Legend 의 hero 가 80+ 안 가는 게 시그니처).
 *   --t-h1 는 키트 display-sm 44 (display 와 분리해 한 단 작은 헤딩 자리).
 *   --t-h2 는 도출 32 (44 ↔ 22 사이 — Blog featured ttl 에서 키트가 쓴 32px 와 일관).
 *   --t-h3 는 키트 heading-lg 22 (FeatureGrid card title, Steps title 모두 이 값).
 *
 * 간격:
 *   키트 4 px base · 4/8/12/16/20/24/32/48/52/64/68/96/128/192 — 의도된 52·68 단계가 시그니처.
 *   역할 스케일은 site-factory 표준 4/8/12/16/24/32/48/64 로 정렬.
 *   --s-section 은 키트 spacing-96 (랜딩 섹션 vertical rhythm) 채택.
 *   --s-container 는 키트 page-max-width 1416px — 다른 키트 1200 보다 와이드한 게 시그니처.
 *
 * Radius:
 *   키트: buttons/general 4 / nav-items 12 / cards 32 / pill 9999.
 *   --r-sm 4 (buttons), --r-md 12 (nav-items), --r-lg 32 (cards — Legend Product Display Card 시그니처).
 *   "Never invent intermediate radii (no 6, no 16, no 24)" — README 명시.
 *
 * 그림자:
 *   키트는 exactly ONE shadow: --shadow-subtle: 0 2px 2px rgba(0,0,0,0.05) — nav 에만 사용.
 *   --shadow-card 는 그대로 동일 (Legend 의 카드는 shadow 없이 surface 차이로만 elev — 키트 정신).
 *   --shadow-float 는 nav 시그니처 그대로.
 */

:root {
  /* ===== 색: 액션 ===== */
  --c-action:            #2d2d2d;         /* button-gray — Legend PRIMARY CTA (violet 금지) */
  --c-action-hover:      #222222;         /* Newsletter send hover (키트 명시) */
  --c-on-action:         #ededed;         /* canvas-white on button-gray */
  --c-accent:            #8931c4;         /* accent-violet — focus ring, 'Q' 마커, 단일 인라인 keyword */

  /* ===== 색: 텍스트 ===== */
  --c-ink:               #000000;         /* ink-black — 헤드라인/본문 강조 */
  --c-body:              #6c6c6c;         /* muted-gray — README 가 body sub/desc 에 광범위 사용 */
  --c-muted:             #949494;         /* medium-gray — eyebrow/caption/footer meta */
  --c-on-dark:           #ededed;         /* canvas-white on dark surface */
  --c-on-dark-muted:     #b2b2b2;         /* light-gray — Footer link 기본, code gutter, stats desc */
  --c-link:              #000000;         /* 기본 a 색 ink-black, 밑줄/border 로 강조 */

  /* ===== 색: 배경/표면 ===== */
  --c-canvas:            #ededed;         /* warm off-white — 절대 #fff 로 substitute 금지 */
  --c-surface:           #ededed;         /* light 카드 기본 (Newsletter field 등) — canvas 와 같음 */
  --c-surface-soft:      #dedddc;         /* background-gray — Steps/Newsletter/Testimonials light card */
  --c-surface-dark:      #131313;         /* deep-gray — Stats/CTA/Footer/Pricing dark card/Code block */
  --c-surface-dark-elev: #2d2d2d;         /* button-gray — dark 위 한 단 elev (FAQ pm 토글) */

  /* ===== 색: 경계 ===== */
  --c-hairline:          #b2b2b2;         /* light-gray — README 'soft separators on white' */
  --c-border-strong:     #000000;         /* ink-black — hover/active 강한 경계 (README 'strongest separation') */

  /* ===== 색: 의미 ===== */
  --c-success:           #8931c4;         /* 도출: Legend 의미색 없음 — accent 재사용 (achromatic by design) */
  --c-danger:            #c13515;         /* 도출 — burnt brick, monotone 시스템과 충돌 없음 */

  /* ===== 폰트 / 폰트 두께 ===== */
  /* SPEC §3.1.5: 폰트는 테마 영역 아님 — registry/fontsets/legend.{css,json} 참조. */

  /* ===== 타입 스케일 =====
     README 명시 'Display sizes are exact': 11 / 16 / 20 / 22 / 44 / 56 + mono 11/13.
     Legend 의 hero 는 80+ 안 감 — display 56 이 시그니처. 그대로 보존. */
  --t-display:           56px;            /* 키트 text-display */
  --t-h1:                44px;            /* 키트 text-display-sm */
  --t-h2:                32px;            /* 도출 (44 ↔ 22 사이; Blog featured ttl 과 일관) */
  --t-h3:                22px;            /* 키트 text-heading-lg */
  --t-body:              16px;            /* 키트 text-body */
  --t-body-sm:           14px;            /* 도출 (키트 ad-hoc 14·15 sizes 의 정규화) */
  --t-caption:           11px;            /* 키트 text-caption / text-mono-xs */

  /* ===== 간격 =====
     키트 4 px base · 의도된 52·68 단계 시그니처. site-factory 표준 8단으로 정렬. */
  --s-1:                 4px;
  --s-2:                 8px;
  --s-3:                 12px;
  --s-4:                 16px;
  --s-5:                 24px;
  --s-6:                 32px;
  --s-7:                 48px;
  --s-8:                 64px;
  --s-section:           96px;            /* 키트 spacing-96 — 랜딩 섹션 vertical rhythm */
  --s-container:         1416px;          /* 키트 --page-max-width — Legend 시그니처 와이드 */

  /* ===== radius =====
     "Never invent intermediate radii" — README 명시. */
  --r-sm:                4px;             /* 키트 radius-buttons / radius-general */
  --r-md:                12px;            /* 키트 radius-navitems */
  --r-lg:                32px;            /* 키트 radius-cards — Product Display Card 시그니처 */
  --r-pill:              9999px;          /* 키트 radius-pill */

  /* ===== 그림자 =====
     README 명시 'Exactly one shadow exists'. 카드엔 shadow 없이 surface 차이로 elev. */
  --shadow-card:         0 2px 2px rgba(0, 0, 0, 0.05);  /* 키트 --shadow-subtle — nav 만 사용 */
  --shadow-float:        0 2px 2px rgba(0, 0, 0, 0.05);  /* 동일 — Legend 는 float 도 nav 톤 */
}