/* =============================================================
   간다GO · 디자인 토큰 (Premium Palette)
   프리미엄 다크 팔레트 + 오렌지 액센트 · Pretendard 기반
   토큰만 교체하면 전 컴포넌트 색이 일괄 반영됩니다.
   ============================================================= */

:root {
  /* ---------- Brand / Accent (Orange) ---------- */
  --color-accent-50:  #FFF3E9;
  --color-accent-100: #FFE1C7;
  --color-accent-200: #FFC08C;
  --color-accent-300: #FBA05A;
  --color-accent-400: #FB923C;
  --color-accent-500: #F97316;   /* primary accent */
  --color-accent-600: #EA580C;
  --color-accent-700: #C2410C;
  --color-accent:     var(--color-accent-500);
  --color-accent-strong: var(--color-accent-600);

  /* ---------- Neutral / Surface (Premium Dark) ---------- */
  --color-bg:         #0B0F14;   /* page base */
  --color-bg-elev-1:  #10151B;
  --color-surface:    #161C24;   /* section surface */
  --color-surface-2:  #1B222C;
  --color-card:       #1E2530;   /* card base */
  --color-card-hover: #232C39;
  --color-border:     #2A3340;
  --color-border-soft:#232B36;

  /* ---------- Text ---------- */
  --color-text:       #F1F5F9;
  --color-text-soft:  #CBD5E1;
  --color-text-muted: #94A3B8;
  --color-text-faint: #64748B;
  --color-text-on-accent: #1A0E05;

  /* ---------- Semantic ---------- */
  --color-success: #34D399;
  --color-warning: #FBBF24;
  --color-danger:  #F87171;
  --color-focus:   var(--color-accent-400);

  /* ---------- Gradients / Overlays (Component overlays) ---------- */
  --grad-accent: linear-gradient(135deg, var(--color-accent-400) 0%, var(--color-accent-600) 100%);
  --grad-accent-soft: linear-gradient(135deg, rgba(249,115,22,.16), rgba(234,88,12,.06));
  --grad-surface: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,0) 60%);
  --grad-hero: radial-gradient(1200px 600px at 50% -10%, rgba(249,115,22,.20), transparent 60%),
               radial-gradient(900px 500px at 85% 10%, rgba(59,130,246,.08), transparent 55%);
  --overlay-glass: linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.01));
  --overlay-featured: radial-gradient(120% 140% at 50% 0%, rgba(249,115,22,.22), transparent 55%);

  /* ---------- Elevation / Shadow ---------- */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.35);
  --shadow-md: 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 20px 50px rgba(0,0,0,.45);
  --shadow-accent: 0 12px 34px rgba(249,115,22,.30);
  --ring-accent: 0 0 0 3px rgba(249,115,22,.35);

  /* ---------- Typography ---------- */
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
               system-ui, "Segoe UI", Roboto, "Apple SD Gothic Neo", "Noto Sans KR",
               "Malgun Gothic", sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --fs-xs: .8125rem;   /* 13 */
  --fs-sm: .9375rem;   /* 15 */
  --fs-base: 1rem;     /* 16 */
  --fs-md: 1.125rem;   /* 18 */
  --fs-lg: 1.375rem;   /* 22 */
  --fs-xl: 1.75rem;    /* 28 */
  --fs-2xl: 2.25rem;   /* 36 */
  --fs-3xl: 2.875rem;  /* 46 */
  --lh-tight: 1.25;
  --lh-snug: 1.4;
  --lh-normal: 1.7;

  /* ---------- Radius ---------- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-pill: 999px;

  /* ---------- Spacing ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* ---------- Layout ---------- */
  --container: 1120px;
  --container-narrow: 820px;

  /* ---------- Motion ---------- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur-fast: .16s;
  --dur: .28s;
}
