/* =============================================================
 * 가족북톡 디자인 토큰 v1 (2026-10-18 · 프론트 디자이너)
 * - 기존 사이트 값(--c-*)을 기준으로, 대비가 모자란 글자색만 한 단계 진하게 고쳤다.
 * - 구현: 테마 config/site.php 의 colors 와 booktalk.css 의 .bt { --bt-* } 에 옮긴다.
 * - 모든 글자 대비는 흰 바탕 · 크림 바탕에서 4.5:1 이상 (진단서 B 표 참고)
 * ============================================================= */
:root {
  /* ── 바탕 · 면 ── */
  --bt-bg: #FBF7F1;          /* 페이지 크림 (기존 --c-bg) */
  --bt-card: #FFFFFF;        /* 카드 */
  --bt-panel: #F6EFE4;       /* 따뜻한 패널 (기존 --c-panel) */
  --bt-panel-2: #EFE5D6;     /* 패널 안의 패널 · 눌림 */
  --bt-night: #2B2622;       /* 어두운 면 (질문 섹션 · 푸터) */

  /* ── 글자 ── */
  --bt-ink: #2B2622;         /* 제목 · 본문  14.0:1 */
  --bt-sub: #4F4740;         /* 본문 보조     8.53:1 */
  --bt-mut: #6F665D;         /* 캡션 · 메타   5.27:1 (기존 #8A8178 3.58:1 → 교체) */
  --bt-on-night: #F4EDE3;
  --bt-on-night-mut: #CDC3B8; /* 어두운 면 위 보조 8.6:1 */

  /* ── 브랜드 코랄 ── */
  --bt-ac: #E0704F;          /* 장식 · 점 · 아이콘 · 큰 글자(24px+)만. 작은 글자 · 버튼 면 금지(3.18:1) */
  --bt-ac-ink: #B5462A;      /* 버튼 면(흰 글자 5.42:1) · 작은 강조 글자 · 영문 라벨 */
  --bt-ac-ink-hover: #9E3C23;
  --bt-ac-soft: #FBE4DA;     /* 연한 코랄 면 — 이 위 글자는 --bt-ac-ink-hover(5.51:1). --bt-ac-ink 는 4.44:1 이라 금지 */
  --bt-focus: #B5462A;

  /* ── 상태 ── */
  --bt-ok: #276B43;          /* 저장됨 · 완료 체크 (흰 6.42:1 · ok-soft 위 5.54:1) */
  --bt-ok-soft: #E3F2E8;
  --bt-err: #B3261E;
  --bt-err-soft: #FBE7E5;

  /* ── 6책장 색 — soft: 표지 · 카드 면 / tint: 넓은 바탕 / ink: 그 위 글자 (ink/soft 4.8~5.4:1) ── */
  --shelf-discover-self-soft: #F5D89A;          --shelf-discover-self-tint: #FBF0D6;          --shelf-discover-self-ink: #7A4F0E;
  --shelf-care-for-mind-soft: #F2C6D0;          --shelf-care-for-mind-tint: #FBEAEE;          --shelf-care-for-mind-ink: #963247;
  --shelf-grow-through-thinking-soft: #C9E0B8;  --shelf-grow-through-thinking-tint: #EEF6E7;  --shelf-grow-through-thinking-ink: #3B6527;
  --shelf-live-together-soft: #C4DAF0;          --shelf-live-together-tint: #EAF2FB;          --shelf-live-together-ink: #2A5888;
  --shelf-shape-my-life-soft: #D9CEF0;          --shelf-shape-my-life-tint: #F2EEFB;          --shelf-shape-my-life-ink: #58428E;
  --shelf-create-the-future-soft: #BFE3DE;      --shelf-create-the-future-tint: #E8F6F4;      --shelf-create-the-future-ink: #1C6560;

  /* ── 꼬리표: 나 · 우리 · 일상 (읽은 뒤 질문) ── */
  --tag-me: #7A4F0E;     --tag-me-bg: #FBF0D6;
  --tag-us: #963247;     --tag-us-bg: #FBEAEE;
  --tag-life: #1C6560;   --tag-life-bg: #E8F6F4;

  /* ── 글꼴 (기존 사이트와 같음 — 새 외부 글꼴 없음) ── */
  --font: "Noto Sans KR", -apple-system, "Malgun Gothic", sans-serif;
  --font-serif: "Noto Serif KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", serif; /* 표지 제목 · 큰 질문 */

  /* ── 글자 크기 (PC / 휴대폰은 clamp 하한) ── */
  --fs-display: clamp(30px, 3.4vw, 48px);  /* 히어로 h1 — 한글 14자가 한 줄에 들어가는 상한 */
  --fs-h2: clamp(25px, 3vw, 38px);         /* 섹션 제목 */
  --fs-h3: clamp(18px, 1.6vw, 21px);       /* 카드 제목 */
  --fs-quote: clamp(21px, 2.4vw, 30px);    /* 큰 질문 (세리프) */
  --fs-lead: clamp(16px, 1.3vw, 18px);     /* 리드 문단 */
  --fs-body: 16px;
  --fs-sm: 14px;
  --fs-xs: 13px;
  --fs-label: 12px;                        /* 영문 라벨 (대문자 · 자간 .14em) */
  --lh-body: 1.75;
  --lh-tight: 1.3;
  --ls-title: -0.025em;

  /* ── 간격 (8px 체계) ── */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px; --sp-5: 24px;
  --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px; --sp-10: 128px;
  --section-y: clamp(64px, 9vw, 120px);    /* 섹션 위아래 */
  --w: 1240px;                             /* 콘텐츠 최대 폭 (헤더와 같음) */
  --w-read: 760px;                         /* 읽는 폭 */
  --gutter: clamp(20px, 4vw, 40px);

  /* ── 모서리 · 그림자 ── */
  --r-s: 10px; --r-m: 16px; --r-l: 24px; --r-xl: 32px; --r-pill: 999px;
  --shadow-1: 0 2px 8px rgba(43, 38, 34, .06);
  --shadow-2: 0 14px 30px -20px rgba(43, 38, 34, .38);
  --shadow-3: 0 28px 50px -26px rgba(43, 38, 34, .5);
  --shadow-book: 0 18px 30px -16px rgba(43, 38, 34, .45);

  /* ── 움직임 ── */
  --ease: cubic-bezier(.22, .8, .24, 1);
  --t-fast: .15s;
  --t-mid: .35s;
  --t-slow: .6s;

  /* ── 터치 ── */
  --tap: 48px; /* 버튼 최소 높이 (44px 기준 + 여유) */
}

/* 책장 key → 공통 변수. 요소에 data-shelf="care-for-mind" 를 달면 --sh-* 가 그 책장 색이 된다 */
[data-shelf="discover-self"]         { --sh-soft: var(--shelf-discover-self-soft);         --sh-tint: var(--shelf-discover-self-tint);         --sh-ink: var(--shelf-discover-self-ink); }
[data-shelf="care-for-mind"]         { --sh-soft: var(--shelf-care-for-mind-soft);         --sh-tint: var(--shelf-care-for-mind-tint);         --sh-ink: var(--shelf-care-for-mind-ink); }
[data-shelf="grow-through-thinking"] { --sh-soft: var(--shelf-grow-through-thinking-soft); --sh-tint: var(--shelf-grow-through-thinking-tint); --sh-ink: var(--shelf-grow-through-thinking-ink); }
[data-shelf="live-together"]         { --sh-soft: var(--shelf-live-together-soft);         --sh-tint: var(--shelf-live-together-tint);         --sh-ink: var(--shelf-live-together-ink); }
[data-shelf="shape-my-life"]         { --sh-soft: var(--shelf-shape-my-life-soft);         --sh-tint: var(--shelf-shape-my-life-tint);         --sh-ink: var(--shelf-shape-my-life-ink); }
[data-shelf="create-the-future"]     { --sh-soft: var(--shelf-create-the-future-soft);     --sh-tint: var(--shelf-create-the-future-tint);     --sh-ink: var(--shelf-create-the-future-ink); }
