@charset "utf-8";

/* ==========================================================================
   typography-base.css — 공통 타이포 컴포넌트 (폰트 무관)
   --------------------------------------------------------------------------
   - 폰트별 수치는 넣지 않는다. 테마 클래스(.font-ptd 등)의 CSS 변수를 소비한다.
   - Fluid 구간(--typo-vw-min/max)은 사이트 :root(setting.css)에서 선언.
   - 이 파일의 레벨 클래스는 font-* 속성만 정의한다.
     여백·색·정렬은 setting.css 유틸(u-m-*, u-txt-*, text-center 등)로 처리.
   - 가이드: typography_generation_guide.md
   - 테마별 명칭이 다름 — 클래스는 공통, 토큰은 각 font-*.css 에서 정의
     · font-ptd: headline-1~3, title-1~3, body-1~3
     · font-ptd-senior: headline-1, section-title, card-title (+ body, caption …)
     · font-mrb: headline-1~3, title-1~2 (+ body, caption …)
   ========================================================================== */

.headline-1 {
  font-size: var(--hl1-size, 2.75rem);
  line-height: var(--hl1-lh, 1.32);
  letter-spacing: var(--hl1-ls, -0.02em);
  font-weight: var(--hl1-weight, 700);
}

.headline-2 {
  font-size: var(--hl2-size, 2.5rem);
  line-height: var(--hl2-lh, 1.35);
  letter-spacing: var(--hl2-ls, -0.02em);
  font-weight: var(--hl2-weight, 700);
}

.headline-3 {
  font-size: var(--hl3-size, 2.25rem);
  line-height: var(--hl3-lh, 1.39);
  letter-spacing: var(--hl3-ls, -0.02em);
  font-weight: var(--hl3-weight, 700);
}

.title-1 {
  font-size: var(--t1-size, 2rem);
  line-height: var(--t1-lh, 1.44);
  letter-spacing: var(--t1-ls, -0.02em);
  font-weight: var(--t1-weight, 600);
}

.title-2 {
  font-size: var(--t2-size, 1.75rem);
  line-height: var(--t2-lh, 1.5);
  letter-spacing: var(--t2-ls, -0.02em);
  font-weight: var(--t2-weight, 600);
}

.title-3 {
  font-size: var(--t3-size, 1.5rem);
  line-height: var(--t3-lh, 1.5);
  letter-spacing: var(--t3-ls, -0.02em);
  font-weight: var(--t3-weight, 600);
}

/* Senior 전용 레벨 — font-ptd-senior 에서 --st-* / --ct-* 정의 */
.section-title {
  font-size: var(--st-size, 2rem);
  line-height: var(--st-lh, 1.208);
  letter-spacing: var(--st-ls, -0.02em);
  font-weight: var(--st-weight, 700);
}

.card-title {
  font-size: var(--ct-size, 2rem);
  line-height: var(--ct-lh, 1.125);
  letter-spacing: var(--ct-ls, -0.02em);
  font-weight: var(--ct-weight, 600);
}

.body-1 {
  font-size: var(--b1-size, 1.375rem);
  line-height: var(--b1-lh, 1.64);
  letter-spacing: var(--b1-ls, -0.02em);
  font-weight: var(--b1-weight, 400);
}

.body-1-medium {
  font-size: var(--b1-size, 1.375rem);
  line-height: var(--b1-lh, 1.64);
  letter-spacing: var(--b1-ls, -0.02em);
  font-weight: var(--b1-medium-weight, 500);
}

.body-2 {
  font-size: var(--b2-size, 1.125rem);
  line-height: var(--b2-lh, 1.78);
  letter-spacing: var(--b2-ls, -0.02em);
  font-weight: var(--b2-weight, 400);
}

.body-2-medium {
  font-size: var(--b2-size, 1.125rem);
  line-height: var(--b2-lh, 1.78);
  letter-spacing: var(--b2-ls, -0.02em);
  font-weight: var(--b2-medium-weight, 500);
}

.body-3 {
  font-size: var(--b3-size, 0.9375rem);
  line-height: var(--b3-lh, 1.73);
  letter-spacing: var(--b3-ls, -0.02em);
  font-weight: var(--b3-weight, 400);
}

.caption {
  font-size: var(--cap-size, 1rem);
  line-height: var(--cap-lh, 1.63);
  letter-spacing: var(--cap-ls, -0.02em);
  font-weight: var(--cap-weight, 400);
}

.tag {
  font-size: var(--tag-size, 1rem);
  line-height: var(--tag-lh, 1.5);
  letter-spacing: var(--tag-ls, -0.02em);
  font-weight: var(--tag-weight, 500);
}

.label {
  font-size: var(--lab-size, 1rem);
  line-height: var(--lab-lh, 1.5);
  letter-spacing: var(--lab-ls, -0.02em);
  font-weight: var(--lab-weight, 600);
}

.typo-button {
  font-size: var(--btn-size, 1.125rem);
  line-height: var(--btn-lh, 1.56);
  letter-spacing: var(--btn-ls, -0.02em);
  font-weight: var(--btn-weight, 600);
}

.nav-main {
  font-size: var(--nav-main-size, var(--nav-main-max, 1.125rem));
  line-height: var(--nav-main-lh, 1.33);
  letter-spacing: var(--nav-main-ls, -0.02em);
  font-weight: var(--nav-main-weight, 500);
}

.nav-sub {
  font-size: var(--nav-sub-size, var(--nav-sub-max, 1rem));
  line-height: var(--nav-sub-lh, 1.75);
  letter-spacing: var(--nav-sub-ls, -0.02em);
  font-weight: var(--nav-sub-weight, 400);
}
