/* CURRENT Q · type system · 5.13.0
   본문·숫자는 Pretendard(직접 호스팅), 제목은 Noto Serif KR.
   2026-09-16: 본문이 시스템 글꼴로 떨어지던 것을 고쳤습니다. 윈도우에서는 맑은 고딕,
   맥에서는 애플 SD 산돌고딕으로 갈려 같은 페이지가 기기마다 다르게 보였습니다.
   docs/design-upgrade-plan.md 3-2 1단계. */

/* 가변 글꼴 한 벌로 400~900 굵기를 모두 씁니다. KS X 1001 한글 2,350자 + 라틴 + 기호로 줄여 337KB.
   여기 없는 글자(희귀 음절, 한자, 이모지)는 아래 대체 글꼴로 자동으로 넘어갑니다.
   만든 방법은 docs/design-upgrade-plan.md 6절에 적어 두었습니다. */
@font-face{
  font-family:"Pretendard Variable";
  src:url("/assets/fonts/pretendard-variable-v513.woff2") format("woff2-variations");
  font-weight:400 900;font-style:normal;font-display:swap;
}
/* 제목 세리프도 직접 호스팅합니다(2026-09-16). 제목에만 쓰므로 굵기는 600~700 만 담아 379KB.
   이것으로 페이지의 바깥 요청이 글꼴 쪽은 0이 됐습니다(방침 8항). */
@font-face{
  font-family:"Noto Serif KR";
  src:url("/assets/fonts/noto-serif-kr-v513.woff2") format("woff2-variations");
  font-weight:600 700;font-style:normal;font-display:swap;
}

:root{
  --cq-editorial-font:"Noto Serif KR","Noto Serif CJK KR",Georgia,serif;
  --cq-body-font:"Pretendard Variable",-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR","Malgun Gothic",Roboto,Arial,sans-serif;
  /* 숫자도 본문과 같은 글꼴입니다. 예전 Manrope 는 한글 글리프가 없어 "7,483,875원"에서
     숫자와 "원"이 서로 다른 글꼴로 나왔습니다. */
  --cq-display-font:var(--cq-body-font);

  /* 글자 크기 7단계. 16px 아래로는 쓰지 않습니다(운영자 결정 2026-09-15). */
  --cq-fs-sm:16px;--cq-fs-base:18px;--cq-fs-lg:20px;--cq-fs-xl:24px;
  --cq-fs-2xl:30px;--cq-fs-3xl:38px;--cq-fs-4xl:48px;

  /* 간격 9단계. 새로 쓰는 규칙은 이 값만 씁니다. */
  --cq-sp-1:4px;--cq-sp-2:8px;--cq-sp-3:12px;--cq-sp-4:16px;--cq-sp-5:24px;
  --cq-sp-6:32px;--cq-sp-7:48px;--cq-sp-8:64px;--cq-sp-9:96px;

  /* 모서리 3단계. 입력·버튼 8, 카드·상자 14, 알약 999. */
  --cq-radius-sm:8px;--cq-radius-md:14px;--cq-radius-pill:999px;
}

.cq-v512{font-family:var(--cq-body-font)}
/* 한글 본문에 음수 자간을 주지 않습니다. 제목만 -0.02em 까지. */
.cq-v512 .cq-lead-copy h1,.cq-v512 .issue-mast h1,.cq-v512 .page-hero h1,.cq-v512 #lesson h1{font-family:var(--cq-editorial-font);font-weight:700;letter-spacing:-.02em;line-height:1.4}
.cq-v512 .cq-title-detail{font-family:var(--cq-body-font);font-weight:650;letter-spacing:-.02em;line-height:1.55}
.cq-v512 .cq-section-heading h2,.cq-v512 .section-head h2,.cq-v512 .cq-editorial-card h3{font-family:var(--cq-editorial-font);font-weight:700;line-height:1.55;letter-spacing:-.02em}
.cq-v512 .cq-brand strong,.cq-v512 .footer-brand-lockup strong{font-family:var(--cq-display-font);font-weight:800;letter-spacing:-.02em}
.cq-v512 .cq-eyebrow,.cq-v512 .cq-edition-line>span:first-child,.cq-v512 .cq-tagline,.cq-v512 .cq-zone-title small{font-family:var(--cq-display-font);font-weight:600;letter-spacing:.07em}
/* 숫자는 자릿수가 달라도 세로로 줄이 맞아야 합니다. */
.cq-v512 .cq-metric-reading>strong,.cq-v512 .cq-change,.cq-v512 .cq-radar-title>span,.cq-v512 .latest-metric>b,.cq-v512 #cov b,.cq-v512 .score-num{font-family:var(--cq-display-font);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"tnum";font-weight:700;letter-spacing:-.02em}
.cq-v512 .cq-metric-reading>strong{white-space:nowrap}
.cq-v512 .cq-deep h2,.cq-v512 .cq-comi h2{font-family:var(--cq-editorial-font);font-weight:700;letter-spacing:-.02em}
@media(max-width:600px){.cq-v512 .cq-lead-copy h1{font-size:30px;line-height:1.45}.cq-v512 .cq-title-detail{font-size:24px;margin-top:16px}.cq-v512 .issue-mast h1,.cq-v512 .page-hero h1,.cq-v512 #lesson h1{font-size:30px;line-height:1.5}.cq-v512 .cq-section-heading h2{font-size:24px}.cq-v512 .cq-metric-primary .cq-metric-reading>strong{font-size:30px}}
@media(max-width:359px){.cq-v512 .cq-lead-copy h1{font-size:28px}.cq-v512 .cq-title-detail{font-size:24px}.cq-v512 .cq-brand strong{font-size:18px}.cq-v512 .cq-metric-primary .cq-metric-reading>strong{font-size:24px}}
