/* ============================================
   Design Tokens
   - Brand: 간병천국(naro) 앱 팔레트 (엔젤케어러스 Library)
   - Neutral: 토스 스타일 그레이 스케일
   ============================================ */

:root {
  /* Brand — Primary (Yellow, naro) */
  --primary-70: #997900;
  --primary-60: #cca100;
  --primary-50: #fdc800;
  --primary-40: #ffd433;
  --primary-30: #ffdf66;
  --primary-20: #ffea99;
  --primary-10: #fff4cc;
  --primary-5: #fffcf0;

  /* Brand — Secondary (Brown, naro) */
  --secondary-70: #734626;
  --secondary-60: #995d33;
  --secondary-50: #c0753f;

  /* Neutral — Toss gray scale */
  --gray-900: #191f28;
  --gray-800: #333d4b;
  --gray-700: #4e5968;
  --gray-600: #6b7684;
  --gray-500: #8b95a1;
  --gray-400: #b0b8c1;
  --gray-300: #d1d6db;
  --gray-200: #e5e8eb;
  --gray-100: #f2f4f6;
  --gray-50: #f9fafb;
  --white: #ffffff;

  /* Accent */
  --blue-50: #3182f6;
  --green-60: #23a931;
  --red-60: #cc0500;

  /* Semantic */
  --color-bg: var(--white);
  --color-bg-gray: var(--gray-50);
  --color-text: var(--gray-900);
  --color-text-sub: var(--gray-700);
  --color-text-subtle: var(--gray-600);
  --color-border: var(--gray-200);
  --color-accent: var(--primary-50);
  --color-accent-text: var(--primary-60);

  /* Typography — 토스형 대형 볼드 스케일 */
  --font-sans: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont,
    system-ui, 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
  --text-hero: clamp(2.5rem, 1.4rem + 5vw, 4.75rem);
  --text-display: clamp(1.875rem, 1.3rem + 2.6vw, 3.25rem);
  --text-heading: clamp(1.25rem, 1.1rem + 0.8vw, 1.75rem);
  --text-lead: clamp(1.0625rem, 1rem + 0.4vw, 1.375rem);
  --text-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1.0625rem);
  --text-small: 0.9375rem;
  --text-tiny: 0.8125rem;

  /* Spacing / Shape */
  --space-section: clamp(6rem, 4rem + 8vw, 13rem);
  --space-gutter: clamp(1.25rem, 4vw, 2.5rem);
  --container: 65rem;
  --container-narrow: 48rem;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Motion — 토스형 부드러운 등장 */
  --duration-fast: 200ms;
  --duration-normal: 450ms;
  --duration-reveal: 900ms;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);

  /* Elevation */
  --shadow-card: 0 4px 14px rgba(25, 31, 40, 0.06);
  --shadow-float: 0 20px 50px rgba(25, 31, 40, 0.12);
  --shadow-phone: 0 30px 60px rgba(25, 31, 40, 0.18);
}