/* SimplicityPages Design Tokens */

:root {
  --brand-lavender-50:  #f3f2f8;
  --brand-lavender-100: #e6e4ee;
  --brand-lavender-200: #cdc9dd;
  --brand-lavender-300: #b4aecc;
  --brand-lavender-400: #a5a1c4;
  --brand-lavender-500: #8d87b0;
  --brand-lavender-600: #726c97;
  --brand-lavender-700: #5a5578;
  --brand-lavender-800: #403c56;
  --brand-lavender-900: #272434;

  --brand-brown-50:  #f5f2ef;
  --brand-brown-100: #e9e2db;
  --brand-brown-200: #d1c4b7;
  --brand-brown-300: #b5a392;
  --brand-brown-400: #8d7a68;
  --brand-brown-500: #6d5d4f;
  --brand-brown-600: #554740;
  --brand-brown-700: #3f3530;
  --brand-brown-800: #2a2321;
  --brand-brown-900: #161211;

  --brand-teal:      #41747a;
  --brand-teal-soft: #6e9ba0;
  --brand-red:       #a83244;
  --brand-red-soft:  #c45566;
  --brand-green:     #4c6e4a;
  --brand-green-soft:#7a9876;
  --brand-mushroom:  #a79e96;
  --brand-ink:       #3f3f3f;

  --neutral-0:   #ffffff;
  --neutral-50:  #fafaf8;
  --neutral-100: #f2f2f0;
  --neutral-200: #e6e5e2;
  --neutral-300: #d4d3ce;
  --neutral-400: #a9a8a3;
  --neutral-500: #7b7a75;
  --neutral-600: #55544f;
  --neutral-700: #3f3e3a;
  --neutral-800: #2a2a27;
  --neutral-900: #181816;

  --bg:          var(--neutral-0);
  --bg-subtle:   var(--neutral-50);
  --bg-muted:    var(--neutral-100);
  --bg-inverse:  var(--brand-brown-800);

  --fg:          var(--brand-ink);
  --fg-muted:    var(--neutral-600);
  --fg-subtle:   var(--neutral-500);
  --fg-inverse:  var(--neutral-50);
  --fg-brand:    var(--brand-brown-500);

  --border:         var(--neutral-200);
  --border-strong:  var(--neutral-300);
  --border-brand:   var(--brand-lavender-300);

  --primary:        var(--brand-lavender-400);
  --primary-hover:  var(--brand-lavender-500);
  --primary-press:  var(--brand-lavender-600);
  --primary-fg:     var(--neutral-0);

  --secondary:        var(--brand-brown-500);
  --secondary-hover:  var(--brand-brown-600);
  --secondary-press:  var(--brand-brown-700);
  --secondary-fg:     var(--neutral-50);

  --success: var(--brand-green);
  --danger:  var(--brand-red);
  --info:    var(--brand-teal);
  --warning: #c79a3a;

  --focus-ring: 0 0 0 3px rgb(165 161 196 / 0.45);

  --font-display: 'Nunito', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  1.875rem;
  --text-3xl:  2.25rem;
  --text-4xl:  3rem;
  --text-5xl:  3.75rem;

  --leading-tight:   1.15;
  --leading-snug:    1.3;
  --leading-normal:  1.55;
  --leading-relaxed: 1.7;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-caps:   0.12em;

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semi:    600;
  --weight-bold:    700;
  --weight-black:   800;

  --space-0:  0;
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-7:  2.5rem;
  --space-8:  3rem;
  --space-10: 4rem;
  --space-12: 6rem;
  --space-16: 8rem;

  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   22px;
  --radius-2xl:  32px;
  --radius-pill: 999px;

  --shadow-xs: 0 1px 2px rgb(45 38 34 / 0.05);
  --shadow-sm: 0 2px 4px rgb(45 38 34 / 0.06), 0 1px 2px rgb(45 38 34 / 0.04);
  --shadow-md: 0 6px 16px rgb(45 38 34 / 0.08), 0 2px 4px rgb(45 38 34 / 0.05);
  --shadow-lg: 0 12px 28px rgb(45 38 34 / 0.10), 0 4px 8px rgb(45 38 34 / 0.06);
  --shadow-xl: 0 24px 48px rgb(45 38 34 / 0.14), 0 8px 16px rgb(45 38 34 / 0.08);
  --shadow-inset: inset 0 1px 2px rgb(45 38 34 / 0.06);

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:   120ms;
  --dur-normal: 200ms;
  --dur-slow:   320ms;
}