/* Design tokens: core variables used across the site */
:root{
  /* layout */
  --page-padding: 32px;
  --gap: 16px;

  /* colors */
  --bg: #e8e8e8;
  --muted: #666666;
  --accent: #333333;

  /* colors */
  --primary-color: #1a1a1a;
  --accent-color: #0b57d0;
  --text-color: #333333;
  --subtext-color: #555555;
  --border-color: #dddddd;
  --bg-color: var(--bg);
  --paper-bg: #ffffff;
  --cinza-1: #d4d4d4;
  --cinza-2: #aeaeae;
  --cinza-3: #8f8f8f;

  /* card tokens */
  --card-bg: #ffffff;
  --card-radius: 0px;

  /* typography scale */
  --text-size-small: 14px;
  --text-size-base: 16px;
  --text-size-lg: 18px;
  --heading-size-xlg: 48px;
  --heading-size-lg: 36px;
  --heading-size-md: 24px;
  --heading-size-sm: 20px;

  --leading-tight: 0.95;
  --leading-snug: 1.1;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-black: 900;

  /* spacing scale */
  --space-1: 0.25rem; /*  4px */
  --space-2: 0.5rem;  /*  8px */
  --space-3: 1rem;    /* 16px */
  --space-4: 1.5rem;  /* 24px */
  --space-5: 2rem;    /* 32px */
  --space-6: 4rem;    /* 64px */
  --space-7: 6rem;    /* 96px */
}