:root {
  /* Typography */
  --ss-font-family-sans: 'Manrope', Arial, sans-serif;
  --ss-font-size-1: 12px;
  --ss-font-size-2: 14px;
  --ss-font-size-3: 16px;
  --ss-font-size-4: 18px;
  --ss-font-size-5: 20px;
  --ss-font-size-6: 24px;
  --ss-font-size-7: 30px;

  --ss-font-size-h2: 14px;
  --ss-font-size-base: 16px;
  --ss-font-weight-regular: 400;
  --ss-font-weight-medium: 500;
  --ss-font-weight-semibold: 600;

  /* Radii / Shapes */
  --ss-radius-4: 4px;
  --ss-radius-6: 6px;
  --ss-radius-8: 8px;
  --ss-radius-16: 16px;
  --ss-radius-18: 18px;

  /* Spacing scale */
  --ss-space-xs: 4px;
  --ss-space-1: 8px;
  --ss-space-2: 12px;
  --ss-space-3: 16px;
  --ss-space-4: 24px;
  --ss-space-5: 32px;

  /* Borders & lines */
  --ss-border-1: 1px solid var(--sensera-gray-warm-800);
  --ss-border-2: 2px solid var(--sensera-gray-warm-400);
  --ss-border-3: 3px solid var(--sensera-gray-warm-400);

  /* Shadows */
  --ss-shadow-1: 0 4px 24px 0 rgba(0,0,0,0.10);

  /* Icon / svg sizing */
  --ss-icon-small: 18px;
  --ss-icon-medium: 24px;
}