/* 디자인 토큰 — 모든 작품이 이 파일을 상속하고, 각 작품 style.css에서 색만 덮어쓴다. */

:root {
  /* ---- 색 : 작품마다 덮어쓰는 5개 ---- */
  --brand:        #1E4635;   /* 주색 */
  --brand-ink:    #FFFFFF;   /* 주색 위 글자 */
  --accent:       #C4622D;   /* 강조 */
  --surface:      #F6F4EF;   /* 바탕 */
  --ink:          #16191A;   /* 본문 글자 */

  /* ---- 색 : 위에서 파생, 보통 그대로 ---- */
  --surface-alt:  #FFFFFF;
  --ink-2:        #4A5150;   /* 보조 텍스트 */
  --ink-3:        #858B8A;   /* 캡션·라벨 */
  --line:         rgba(22, 25, 26, .12);
  --line-strong:  rgba(22, 25, 26, .28);

  /* ---- 타이포 ---- */
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
               system-ui, "Segoe UI", "Malgun Gothic", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

  /* 모바일 기준. clamp로 데스크탑까지 자연스럽게 */
  --fs-xs:   .75rem;                        /* 12 */
  --fs-sm:   .8125rem;                      /* 13 */
  --fs-base: .9375rem;                      /* 15 */
  --fs-md:   1.0625rem;                     /* 17 */
  --fs-lg:   clamp(1.25rem, 3.2vw, 1.5rem);
  --fs-xl:   clamp(1.5rem,  4.4vw, 2rem);
  --fs-2xl:  clamp(1.875rem, 6vw, 2.75rem);
  --fs-3xl:  clamp(2.25rem, 8vw, 3.5rem);

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-base:  1.65;

  --ls-tight:  -.02em;
  --ls-snug:   -.01em;
  --ls-wide:    .04em;
  --ls-widest:  .12em;

  --fw-normal:   400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* ---- 간격 (4px 배수) ---- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 24px;  --sp-6: 32px;  --sp-7: 40px;  --sp-8: 56px;
  --sp-9: 72px;  --sp-10: 96px;

  --section-y: clamp(48px, 9vw, 88px);
  --gutter:    clamp(20px, 5vw, 32px);
  --container: 560px;          /* CARD·LP 유형 기준 폭 */

  /* ---- 모양 ---- */
  --r-sm: 4px;  --r-md: 8px;  --r-lg: 14px;  --r-full: 999px;

  /* ---- 고정 CTA 바 높이 (본문 하단 여백 계산에 씀) ---- */
  --cta-h: 64px;
}