@font-face {
  font-family: Nunito;
  src: url('./assets/nunito.ttf') format('truetype');
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
}

:root {
  color-scheme: light;
  --color-cream: #FFF6E8;
  --color-coral: #F47760;
  --color-yellow: #F7C95D;
  --color-teal: #5BBEAE;
  --color-lavender: #A99CE2;
  --color-ink: #302C40;
  --color-text: var(--color-ink);
  --color-muted: #6B6374;
  --color-surface: #FFFCF6;
  --color-border: #E6DCCD;
  --color-focus: #5D468F;
  --color-error: #9B342F;
  --color-error-bg: #FFF0ED;
  --color-coral-hover: #F7816B;
  --color-lavender-soft: #E9E0F8;
  --color-yellow-soft: #FFE2A0;
  --color-teal-soft: #CFE9DF;
  --font-body: Nunito, 'Segoe UI', sans-serif;
  --font-display: Nunito, 'Segoe UI', sans-serif;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.5rem;
  --text-hero: clamp(54px, 5.65vw, 83px);
  --text-section: 38px;
  --text-card: 29px;
  --text-workspace: 31px;
  --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;
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 32px;
  --radius-pill: 100px;
  --shadow-soft: 0 12px 40px #70513C0A;
  --shadow-coral: 0 7px 0 #DB614B24, 0 12px 28px #D56B4321;
  --content-width: 1248px;
  --transition: 160ms ease;
}