/* ============================================================
   Design Tokens — M's Studio
   스펙 5·6항 그대로 반영. --primary만 실제 AI 업무자동화 앱의
   기존 UI 액센트(flowfolder src/index.css --accent: #6366f1)와
   조화시켜 조정함 (스펙 5항 "실제 브랜드 컬러 우선" 조건 적용).
   ============================================================ */
:root {
  /* Layout */
  --page-max-width: 1160px;
  --page-padding-desktop: 24px;
  --page-padding-tablet: 24px;
  --page-padding-mobile: 20px;

  /* Background */
  --background: #ffffff;
  --background-soft: #f8f9fc;
  --surface: #ffffff;

  /* Text */
  --text-primary: #111318;
  --text-secondary: #5f6470;
  --text-muted: #6b6b6b; /* #8A8A8A였으나 흰 배경 대비 3.45:1로 WCAG AA 미달 → 5.7:1로 조정 */
  --text-on-dark: #ffffff;
  --text-on-dark-soft: rgba(255, 255, 255, 0.68);

  /* Border */
  --border-light: #e9e9e9;
  --border-medium: #e5e7eb;

  /* Primary — flowfolder 실제 accent(#6366f1)와 조화 */
  --primary: #6366f1;
  --primary-hover: #4f46e5;
  --primary-soft: #eef0ff;
  --primary-border: #dce0ff;

  /* Dark CTA */
  --button-dark: #111318;
  --button-dark-hover: #25272d;

  /* Bottom CTA band */
  --band-bg: #f2f4ff;
  --band-border: #dfe3ff;

  /* Focus */
  --focus-ring: #6366f1;

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

  /* Shadow — 매우 약하게, 시안 기준 border가 주 경계이고 shadow는 보조 */
  --shadow-card: 0 8px 24px rgba(17, 19, 24, 0.06);
  --shadow-soft: 0 1px 2px rgba(17, 17, 17, 0.04);

  /* Font families */
  --font-sans:
    "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  color-scheme: light;
}