/* ============================================================
   tokens.css — design tokens for SOLE STUDIO
   Single source of truth: colors, fonts, spacing, radii, z-index
   ============================================================ */

:root {
  /* Colors */
  --color-bg: #FFFFFF;
  --color-bg-soft: #F5F5F5;
  --color-text: #0A0A0A;
  --color-text-soft: #888888;
  --color-text-mid: #555555;
  --color-border: #EAEAEA;
  --color-accent: #FFD400;
  --color-footer-bg: #0A0A0A;
  --color-footer-text: #FFFFFF;
  --color-footer-text-soft: #888888;

  /* Typography */
  --font-sans: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-pill: 999px;

  /* Shadow */
  --shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-header: 0 2px 12px rgba(0, 0, 0, 0.04);

  /* Spacing */
  --section-padding: 120px;
  --container-max: 1440px;
  --container-pad: 64px;

  /* Z-index */
  --z-header: 100;
  --z-modal: 1000;
  --z-modal-backdrop: 999;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 200ms;
  --dur-med: 400ms;
}

@media (max-width: 1024px) {
  :root {
    --section-padding: 80px;
    --container-pad: 32px;
  }
}

@media (max-width: 767px) {
  :root {
    --section-padding: 64px;
    --container-pad: 20px;
  }
}