:root {
  --prototype-ff-base: "Inter", sans-serif;
}

/* prettier-ignore */
:root {
  /* font-sizes: heading */
  --prototype-fs-heading-h1: 2.75rem; /* 44px */
  --prototype-fs-heading-h2: 2rem; /* 32px */
  --prototype-fs-heading-h3: 1.5rem; /* 24px */
  --prototype-fs-heading-h4: 1.375rem; /* 22px */
  /* font-sizes: body */
  --prototype-fs-body-base: 0.875rem; /* 14px */
  --prototype-fs-body-18: 0.875rem; /* 14px */
  --prototype-fs-body-16: 0.875rem; /* 14px */
  /* font-sizes: label */
  --prototype-fs-label-18: 0.875rem; /* 14px */
  --prototype-fs-label-16: 0.875rem; /* 14px */
  --prototype-fs-label-14: 0.75rem; /* 12px */
  /* line-heights: heading */
  --prototype-lh-heading-h1: 1.1818181818; /* 52px */
  --prototype-lh-heading-h2: 1.125; /* 36px */
  --prototype-lh-heading-h3: 1.1666666667; /* 28px */
  --prototype-lh-heading-h4: 1.2727272727; /* 28px */
  /* line-heights: body */
  --prototype-lh-body-base: 1.5714285714; /* 22px */
  --prototype-lh-body-18: 1.5714285714; /* 22px */
  --prototype-lh-body-16: 1.5714285714; /* 22px */
  /* line-heights: label */
  --prototype-lh-label-18: 1.7142857143; /* 24px */
  --prototype-lh-label-16: 1.7142857143; /* 24px */
  --prototype-lh-label-14: 1.8333333333; /* 22px */
}
@media (min-width: 768px) {
  :root {
    /* font-sizes: heading */
    --prototype-fs-heading-h1: 3.25rem; /* 52px */
    --prototype-fs-heading-h2: 2.625rem; /* 42px */
    --prototype-fs-heading-h3: 1.75rem; /* 28px */
    --prototype-fs-heading-h4: 1.5rem; /* 24px */
    /* font-sizes: body */
    --prototype-fs-body-base: 1rem; /* 16px */
    --prototype-fs-body-18: 1rem; /* 16px */
    --prototype-fs-body-16: 1rem; /* 16px */
    /* font-sizes: label */
    --prototype-fs-label-18: 1rem; /* 16px */
    --prototype-fs-label-16: 1rem; /* 16px */
    --prototype-fs-label-14: 0.875rem; /* 14px */
    /* line-heights: heading */
    --prototype-lh-heading-h1: 1.1538461538; /* 60px */
    --prototype-lh-heading-h2: 1.1428571429; /* 48px */
    --prototype-lh-heading-h3: 1.1428571429; /* 32px */
    --prototype-lh-heading-h4: 1.1666666667; /* 28px */
    /* line-heights: body */
    --prototype-lh-body-base: 1.625; /* 26px */
    --prototype-lh-body-18: 1.625; /* 26px */
    --prototype-lh-body-16: 1.625; /* 26px */
    /* line-heights: label */
    --prototype-lh-label-18: 1.75; /* 28px */
    --prototype-lh-label-16: 1.5; /* 24px */
    --prototype-lh-label-14: 1.7142857143; /* 24px */
  }
}
@media (min-width: 1024px) {
  :root {
    /* font-sizes: heading */
    --prototype-fs-heading-h1: 4.5rem; /* 72px */
    --prototype-fs-heading-h2: 2.75rem; /* 44px */
    --prototype-fs-heading-h3: 2rem; /* 32px */
    --prototype-fs-heading-h4: 1.75rem; /* 28px */
    /* font-sizes: body */
    --prototype-fs-body-base: 1.125rem; /* 18px */
    --prototype-fs-body-18: 1.125rem; /* 18px */
    --prototype-fs-body-16: 1rem; /* 16px */
    /* font-sizes: label */
    --prototype-fs-label-18: 1.125rem; /* 18px */
    --prototype-fs-label-16: 1rem; /* 16px */
    /* line-heights: heading */
    --prototype-lh-heading-h1: 1; /* 72px */
    --prototype-lh-heading-h2: 1.1818181818; /* 52px */
    --prototype-lh-heading-h3: 1.125; /* 36px */
    --prototype-lh-heading-h4: 1.1428571429; /* 32px */
    /* line-heights: body */
    --prototype-lh-body-base: 1.5555555556; /* 28px */
    --prototype-lh-body-18: 1.5555555556; /* 28px */
    --prototype-lh-body-16: 1.625; /* 26px */
    /* line-heights: label */
    --prototype-lh-label-18: 1.5555555556; /* 28px */
    --prototype-lh-label-16: 1.75; /* 28px */
  }
}
@media (min-width: 1200px) {
  :root {
    /* font-sizes: heading */
    --prototype-fs-heading-h1: 6rem; /* 96px */
    --prototype-fs-heading-h2: 3.25rem; /* 52px */
    --prototype-fs-heading-h3: 2.75rem; /* 44px */
    --prototype-fs-heading-h4: 2rem; /* 32px */
    /* font-sizes: body */
    --prototype-fs-body-base: 1.125rem; /* 18px */
    --prototype-fs-body-18: 1.125rem; /* 18px */
    --prototype-fs-body-16: 1rem; /* 16px */
    /* line-heights: heading */
    --prototype-lh-heading-h1: 0.9583333333; /* 92px */
    --prototype-lh-heading-h2: 1.1538461538; /* 60px */
    --prototype-lh-heading-h3: 1.1818181818; /* 52px */
    --prototype-lh-heading-h4: 1.125; /* 36px */
    /* line-heights: body */
    --prototype-lh-body-base: 1.5555555556; /* 28px */
    --prototype-lh-body-18: 1.5555555556; /* 28px */
    --prototype-lh-body-16: 1.625; /* 26px */
  }
}

:root {
  --prototype-fw-thin: 100;
  --prototype-fw-light: 300;
  --prototype-fw-regular: 400;
  --prototype-fw-book: 400;
  --prototype-fw-medium: 500;
  --prototype-fw-semibold: 600;
  --prototype-fw-bold: 700;
}