/* ============================================================
   타이포그래피 — Pretendard 폰트 가이드 (전 페이지 공통)
   base.html · service/index.html 이 app.css/floorplan.css 보다 먼저 읽는다.
   엄격 CSP(default-src 'self')를 지키기 위해 폰트는 self 호스팅한다.

   Name            Size  Line Height  Spacing
   Headline L      40px  130%         0
   Headline M      32px  130%         0
   Title L         24px  140%         0
   Title M         20px  140%         0
   Title S         18px  150%         0
   Heading M       16px  150%         0
   Heading S       14px  150%         0
   Body            14px  160%         0
   Caption/Meta M  12px  130%         0
   Caption/Meta S  10px  130%         0
   Weight: Regular 400 · Medium 500 · SemiBold 600 (그 이상은 쓰지 않는다)
   ============================================================ */

@font-face {
  font-family: "Pretendard";
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
  /* 가변 폰트 한 파일로 400/500/600을 모두 낸다. 내용이 바뀌지 않으므로 v는 폰트 버전 고정 */
  src: url("/static/fonts/PretendardVariable.woff2?v=1.3.9") format("woff2-variations"),
       url("/static/fonts/PretendardVariable.woff2?v=1.3.9") format("woff2");
}

:root {
  --font-sans: "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
               "Noto Sans KR", "Malgun Gothic", "Segoe UI", sans-serif;

  /* 굵기 */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* 크기 / 행간 */
  --fs-headline-l: 40px; --lh-headline-l: 1.3;
  --fs-headline-m: 32px; --lh-headline-m: 1.3;
  --fs-title-l:    24px; --lh-title-l:    1.4;
  --fs-title-m:    20px; --lh-title-m:    1.4;
  --fs-title-s:    18px; --lh-title-s:    1.5;
  --fs-heading-m:  16px; --lh-heading-m:  1.5;
  --fs-heading-s:  14px; --lh-heading-s:  1.5;
  --fs-body:       14px; --lh-body:       1.6;
  --fs-caption-m:  12px; --lh-caption-m:  1.3;
  --fs-caption-s:  10px; --lh-caption-s:  1.3;
}

/* 기본 요소 — 클래스 없이 쓴 제목·강조는 여기서 가이드 크기를 받는다.
   (.page-head h1, .modal-head h2 처럼 클래스가 있는 규칙이 우선한다) */
h1, h2, h3, h4, h5, h6 { font-weight: var(--fw-semibold); letter-spacing: 0; }
h1 { font-size: var(--fs-title-l);   line-height: var(--lh-title-l); }
h2 { font-size: var(--fs-title-m);   line-height: var(--lh-title-m); }
h3 { font-size: var(--fs-heading-m); line-height: var(--lh-heading-m); }
h4, h5, h6 { font-size: var(--fs-heading-s); line-height: var(--lh-heading-s); }
b, strong, th { font-weight: var(--fw-semibold); }   /* 가이드 최대 굵기는 600 */

/* 유틸 클래스 — 템플릿에서 바로 쓸 때 */
.t-headline-l { font-size: var(--fs-headline-l); line-height: var(--lh-headline-l); letter-spacing: 0; }
.t-headline-m { font-size: var(--fs-headline-m); line-height: var(--lh-headline-m); letter-spacing: 0; }
.t-title-l    { font-size: var(--fs-title-l);    line-height: var(--lh-title-l);    letter-spacing: 0; }
.t-title-m    { font-size: var(--fs-title-m);    line-height: var(--lh-title-m);    letter-spacing: 0; }
.t-title-s    { font-size: var(--fs-title-s);    line-height: var(--lh-title-s);    letter-spacing: 0; }
.t-heading-m  { font-size: var(--fs-heading-m);  line-height: var(--lh-heading-m);  letter-spacing: 0; }
.t-heading-s  { font-size: var(--fs-heading-s);  line-height: var(--lh-heading-s);  letter-spacing: 0; }
.t-body       { font-size: var(--fs-body);       line-height: var(--lh-body);       letter-spacing: 0; }
.t-caption-m  { font-size: var(--fs-caption-m);  line-height: var(--lh-caption-m);  letter-spacing: 0; }
.t-caption-s  { font-size: var(--fs-caption-s);  line-height: var(--lh-caption-s);  letter-spacing: 0; }
.fw-regular  { font-weight: var(--fw-regular); }
.fw-medium   { font-weight: var(--fw-medium); }
.fw-semibold { font-weight: var(--fw-semibold); }
