/* =====================================================================
   Base — 리셋 · 기본 글자 · 텍스트 스타일 클래스
   텍스트 스타일 클래스(.t-*)는 Figma의 KP26/* 텍스트 스타일과 같은 이름입니다.
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--c-paper);
  color: var(--c-ink);
  font-family: var(--font-kr);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, figure, dl, dd { margin: 0; }
:focus-visible { outline: 2px solid var(--c-accent-deep); outline-offset: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- 텍스트 스타일 (Figma KP26/*) ---------------------------- */
.t-display-xl { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-display-xl); line-height: var(--lh-display-xl); letter-spacing: var(--ls-display-xl); }
.t-display-l  { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-display-l);  line-height: var(--lh-display-l);  letter-spacing: var(--ls-display-l); }
.t-section    { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-section);    line-height: var(--lh-section); }
.t-stat-l     { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-stat-l);     line-height: var(--lh-stat); letter-spacing: var(--ls-stat-l); font-variant-numeric: tabular-nums; }
.t-stat-m     { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-stat-m);     line-height: var(--lh-stat); font-variant-numeric: tabular-nums; }
.t-nav        { font-family: var(--font-display); font-weight: 400; font-size: var(--fs-nav);        line-height: 1; }
.t-label-en   { font-family: var(--font-display); font-weight: 500; font-size: var(--fs-label-en);   line-height: 1.3; letter-spacing: var(--ls-label-en); }
.t-heading    { font-family: var(--font-kr); font-weight: 600; font-size: var(--fs-heading); line-height: var(--lh-heading); letter-spacing: var(--ls-heading); }
.t-title      { font-family: var(--font-kr); font-weight: 600; font-size: var(--fs-title);   line-height: var(--lh-title);   letter-spacing: var(--ls-title); }
.t-body       { font-family: var(--font-kr); font-weight: 400; font-size: var(--fs-body);    line-height: var(--lh-body);    letter-spacing: var(--ls-body); }
.t-caption    { font-family: var(--font-kr); font-weight: 500; font-size: var(--fs-caption); line-height: var(--lh-caption); }
.t-unit       { font-family: var(--font-kr); font-weight: 500; font-size: var(--fs-unit);    line-height: 1; }

/* ---------- 색 도우미 ---------------------------------------------- */
.c-accent { color: var(--c-accent-text); }
.c-muted  { color: var(--c-muted); }
.pre-line { white-space: pre-line; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
