/* Nafas · design tokens (v2 : Headspace / I Am Sober philosophy) */
:root {
  /* surfaces */
  --bg: #F9F4EE;
  --bg-2: #F1EAE0;
  --surface: #FFFFFF;
  --night: #2D2C2B;
  --night-2: #3A3836;
  --footer: #141313;

  /* ink */
  --ink: #2D2C2B;
  --ink-2: #44423F;
  --ink-3: #7A7672;
  --ink-inverse: #FFFFFF;
  --ink-inverse-2: rgba(255, 255, 255, .78);
  --ink-inverse-3: rgba(255, 255, 255, .5);

  /* lines */
  --line: #E2DED9;
  --line-strong: #C6C1B9;
  --line-inverse: rgba(255, 255, 255, .18);

  /* brand */
  --blue: #0F5FE0;
  --blue-deep: #0A47B0;
  --blue-soft: #DCE7FF;
  --teal: #1481B6;
  --violet: #6876D5;
  --sun: #FFCE00;
  --sun-soft: #FFF1B3;
  --saffron: #F4842A;
  --peach: #FCDFCC;
  --peach-soft: #FDEFE6;
  --mint: #CDEDE0;
  --green: #1E9E6A;
  --green-deep: #167A51;
  --lavender: #E4E2FA;
  --clay: #D9573B;
  --clay-soft: #FADDD5;
  --whatsapp: #25D366;

  /* aliases kept for existing components */
  --paper: var(--bg);
  --paper-2: var(--bg-2);
  --paper-3: #E6DFD3;
  --white: var(--surface);
  --safran: var(--saffron);
  --safran-deep: #C9631A;
  --safran-soft: var(--peach);
  --palm: var(--green);
  --palm-deep: var(--green-deep);
  --palm-soft: var(--mint);
  --night-3: #4A4744;

  /* type */
  --font-sans: 'Plus Jakarta Sans', 'Helvetica Neue', system-ui, sans-serif;
  --font-display: var(--font-sans);
  --font-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --font-arabic: 'Amiri', 'Noto Naskh Arabic', serif;
  --font-arabic-ui: 'IBM Plex Sans Arabic', 'Noto Naskh Arabic', sans-serif;

  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: clamp(1.5rem, 2.2vw, 1.8rem);
  --text-2xl: clamp(1.8rem, 3vw, 2.25rem);
  --text-3xl: clamp(2.25rem, 4vw, 3.25rem);
  --text-4xl: clamp(2.75rem, 5.4vw, 4.5rem);
  --text-num: clamp(4rem, 10vw, 7.5rem);

  /* rhythm */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6rem;
  --space-10: 8rem;

  --container: 72.5rem;
  --container-narrow: 47.4rem;
  --gutter: clamp(1.25rem, 4vw, 3rem);

  --radius-xs: .5rem;
  --radius-sm: 1rem;
  --radius-md: 1.5rem;
  --radius-lg: 2rem;
  --radius-pill: 2rem;

  /* motion */
  --ease-out: cubic-bezier(.32, .94, .6, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-fast: 150ms;
  --dur-base: 250ms;
  --dur-slow: 450ms;

  --shadow-btn: 0 .125rem 0 rgba(65, 61, 69, .2);
  --shadow-sm: 0 1px 8px rgba(20, 19, 19, .12);
  --shadow-md: 0 12px 32px -12px rgba(20, 19, 19, .25);
  --shadow-lg: 0 24px 60px -24px rgba(20, 19, 19, .35);

  --header-h: 4.5rem;
}
