/* ===== CSS 변수 — 전역 디자인 토큰 ===== */
/* 모든 커스텀 CSS보다 먼저 로드되어야 합니다 */
:root {
  /* ── Typography ── */
  --font-size:       1rem;          /* html 기준 폰트 크기 */
  --font-size-base: 16px;
  --font-pretendard: "Pretendard", -apple-system, BlinkMacSystemFont, sans-serif;

  /* ── Font Size Scale ── */
  /* Tier 1: Large  — 제목·헤딩   */ --fs-15: 1.5rem;
  /* Tier 2: Medium — 소제목·강조 */ --fs-13: 1.3rem;
  /* Tier 3: Body   — 본문        */ --fs-125: 1.25rem;
  /* Tier 3: Body   — 본문        */ --fs-11: 1.2rem;
  /* Tier 3: Body   — 본문        */ --fs-11: 1.1rem;
                                      --fs-10: 1rem;
  /* Tier 4: Small  — 캡션·보조   */ --fs-09: 0.9rem;
  /* Tier 4: Small  — 캡션·보조   */ --fs-08: 0.8rem;
  --fs-3:3rem;

  /* ── Line Height Scale ── */
  --lh-0 : 0;  
  --lh-09: 0.9rem;
  --lh-10:  1rem;
  --lh-12:  1.2rem;
  --lh-125: 1.25;
  --lh-13:  1.3rem;
  --lh-14:  1.4rem;
  --lh-15:  1.5rem;
  --lh-16:  1.6rem;
  --lh-18:  1.8rem;
  --lh-2: 2rem;
  --lh-23: 2.3rem;
  --lh-25: 2.5rem;
  --lh-3: 3rem;

  /* ── Brand Colors ── */
  --color-accent:       #f78e1e;
  --color-accent-light: #fdcc85;
  --color-accent-hover: #e07d0d;
  --color-accent-alpha: rgba(247, 142, 30, 0.8);

  /* ── Layout Colors ── */
  --color-header-bg: #3d3e42;
  --color-nav-bg:    #47484c;

  /* ── Content Colors ── */
  --color-bg:       #ffffff;
  --color-text: #363636;
  --color-card-bg:  #f2f3f8;
  --color-award-bg: #f8f9fe;

  /* ── Border Colors ── */
  --color-border:       #b7b9bd;
  --color-border-light: #d9d9d9;
  --color-muted:        #a7a4a4;

  /* ── Sizing ── */
  --max-width:  1500px;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-pill: 1000px;

  /* ── Padding ── */
  --pad-02: 0.2rem;
  --pad-04: 0.4rem;
  --pad-06: 0.6rem;
  --pad-08: 0.8rem;
  --pad-1: 1rem;
  --pad-2: 2rem;
  --pad-3: 3rem;
  --pad-4: 4rem;
  --pad-5: 5rem;
  --pad-6: 6rem;
  --pad-7: 7rem;
  --pad-8: 8rem;

  /* ── Margin ── */
  --mar-04: 0.4rem;
  --mar-06: 0.6rem;
  --mar-08: 0.8rem;
  --mar-1: 1rem;
  --mar-2: 2rem;
  --mar-3: 3rem;
  --mar-4: 4rem;
  --mar-5: 5rem;
  --mar-6: 6rem;
  --mar-7: 7rem;
  --mar-8: 8rem;

  .mg-top-0 { margin-top: 0; }  
  .pd-0 { padding: 0; }
}

/* ── Font Size — Mobile 반응형 ── */
@media (max-width: 768px) {
  :root {
    --fs-15: 1.3rem;
    --fs-13: 1.1rem;
    --fs-11: 0.9rem;
  }
}