:root {
  /* Colors — paper palette */
  --primary: #0036FF;
  --primary-dark: #002bcc;
  --primary-light: #eef2fa;
  --accent-gradient: linear-gradient(135deg, #1a56ff, #00c2ff);
  --dark: #0a0a0a;
  --gray-900: #1a1a1a;
  --gray-600: #6b6b6b;
  --gray-400: #9a9a9a;
  --gray-200: #e0dfd6;
  --gray-100: #eae9e1;
  --gray-50: #F4F3EB;
  --white: #FCFCFB;

  /* Paper-specific */
  --paper-light: #FCFCFB;
  --paper-mid: #F4F3EB;
  --paper-dark: #eae8dd;
  --paper-border: #d8d6cb;
  --ink: #2c2c2c;
  --ink-light: #5a5a56;
  --ink-faint: #8a8a82;

  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fs-hero: clamp(2.2rem, 4vw, 3.5rem);
  --fs-h1: clamp(1.8rem, 3vw, 2.8rem);
  --fs-h2: clamp(1.5rem, 2.5vw, 2.2rem);
  --fs-h3: clamp(1.1rem, 1.5vw, 1.4rem);
  --fs-body: clamp(0.95rem, 1vw, 1.05rem);
  --fs-small: 0.875rem;
  --fs-caption: 0.8rem;

  /* Spacing */
  --section-padding: clamp(3rem, 6vw, 6rem) 0;
  --container-width: 1200px;
  --container-padding: 0 clamp(1rem, 3vw, 2rem);
  --gap-sm: 0.75rem;
  --gap-md: 1.5rem;
  --gap-lg: 3rem;
  --gap-xl: 4.5rem;

  /* Borders & Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;
  --border-color: var(--paper-border);

  /* Shadows — softer, warmer */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.06);
  --shadow-xl: 0 16px 50px rgba(0,0,0,0.08);

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s ease;
  --transition-slow: 0.4s ease;

  /* Header */
  --header-height: 72px;
}
