/* ============================================================
   1hour (원아워) — Typography
   Korean/body: Pretendard Variable. Numerals + uppercase
   labels: Inter (tabular-nums). Feature settings global.
   ============================================================ */
:root {
  --font-kr:  "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
              system-ui, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  /* Numbers, prices, %, CP, uppercase labels — Inter, tabular. */
  --font-num: "Inter", "Pretendard Variable", -apple-system, system-ui, sans-serif;
}

/* ---------- Base ---------- */
html, body {
  margin: 0;
  font-family: var(--font-kr);
  font-feature-settings: "ss01", "ss02", "tnum", "case";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--text-1);
  background: var(--bg-page);
  text-rendering: optimizeLegibility;
}
* { box-sizing: border-box; }

/* Links — default to brand mint, darken on hover. */
a { color: var(--primary-dark); text-decoration: none; }
a:hover { color: var(--primary-pressed); text-decoration: underline; }

/* ============================================================
   Semantic type scale
   ============================================================ */
.h-display {
  font-family: var(--font-kr);
  font-size: clamp(40px, 4vw, 54px);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.05;
  color: var(--text-1);
}
.h1 {
  font-family: var(--font-kr);
  font-size: 40px;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.h2 {
  font-family: var(--font-kr);
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.25;
}
.h3 {
  font-family: var(--font-kr);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.3;
}
.plan-name {
  font-family: var(--font-kr);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.eyebrow,
.cat-label {
  font-family: var(--font-num);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--primary);
}
.body {
  font-family: var(--font-kr);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.55;
  color: var(--text-1);
}
.body-sub {
  font-family: var(--font-kr);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  color: var(--text-2);
}
.caption {
  font-family: var(--font-kr);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--text-2);
}

/* Numbers — always Inter, tabular, tight tracking. */
.num,
.num-lg,
.num-xl {
  font-family: var(--font-num);
  font-feature-settings: "tnum", "case";
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.num     { font-size: 16px; font-weight: 600; }
.num-lg  { font-size: 28px; font-weight: 800; }
.num-xl  { font-size: 48px; font-weight: 900; }
.num-unit {
  font-family: var(--font-kr);
  font-size: 14px;
  font-weight: 500;
  color: var(--text-2);
}
