:root {
  --ink: #0E0E0C;
  --bone: #F5F3EC;
  --chartreuse: #B8D432;
  --forest: #1F3A2E;
  --sand: #E8E3D4;

  --neutral-50: #FAF9F4;
  --neutral-100: #EFEDE4;
  --neutral-200: #DDDACE;
  --neutral-300: #B8B5A8;
  --neutral-400: #8A8779;
  --neutral-500: #5C5A50;
  --neutral-700: #2E2D28;
  --neutral-900: #0E0E0C;

  --success: #2F7D5B;
  --error: #C1432A;
  --warning: #D49C2E;
  --info: #3A5C8C;

  --font-display: "Space Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-editorial: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;

  --fs-display-xl: clamp(40px, 6vw, 72px);
  --lh-display-xl: 1.06;
  --fs-display-l: clamp(36px, 5vw, 56px);
  --lh-display-l: 1.08;
  --fs-h1: clamp(28px, 3.5vw, 40px);
  --lh-h1: 1.15;
  --fs-h2: clamp(24px, 2.5vw, 32px);
  --lh-h2: 1.19;
  --fs-h3: 24px;
  --lh-h3: 1.25;
  --fs-h4: 20px;
  --lh-h4: 1.3;
  --fs-body-l: 18px;
  --lh-body-l: 1.55;
  --fs-body: 16px;
  --lh-body: 1.625;
  --fs-body-s: 14px;
  --lh-body-s: 1.57;
  --fs-caption: 12px;
  --lh-caption: 1.5;
  --fs-editorial: clamp(32px, 4vw, 40px);
  --lh-editorial: 1.25;

  --tracking-display: -0.02em;
  --tracking-h3: -0.01em;
  --tracking-body: 0;
  --tracking-caption-upper: 0.08em;
  --tracking-editorial: -0.015em;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-128: 128px;
  --space-160: 160px;
  --space-192: 192px;

  --radius-button: 6px;
  --radius-card: 8px;
  --radius-image: 4px;

  --shadow-card-hover: 0 4px 24px rgba(14, 14, 12, 0.06);
  --shadow-dropdown: 0 8px 24px rgba(14, 14, 12, 0.08);
  --shadow-modal: 0 24px 64px rgba(14, 14, 12, 0.12);

  --duration-100: 100ms;
  --duration-150: 150ms;
  --duration-200: 200ms;
  --duration-300: 300ms;
  --duration-400: 400ms;

  --easing-entry: cubic-bezier(0.2, 0, 0, 1);
  --easing-exit: cubic-bezier(0.4, 0, 0.6, 1);

  --max-content: 1280px;
  --max-editorial: 720px;

  --header-height: 72px;
  --header-height-mobile: 60px;

  --gutter-mobile: 16px;
  --gutter-tablet: 24px;
  --gutter-desktop: 32px;
  --margin-mobile: 20px;
  --margin-tablet: 32px;
  --margin-desktop: 64px;
}
