@use './layout.scss' as layout;

/**
 * @sass-export-section="typography"
 */

$document-font-size: 16px;

// Typography
$font-size-9: 0.75rem !default; // 12px
$font-size-8: 0.875rem !default; // 14px
$font-size-7: 1rem !default; // 16px
$font-size-6: 1.125rem !default; // 18px
$font-size-5: 1.25rem !default; // 20px
$font-size-4: 1.5rem !default; // 24px
$font-size-3: 1.75rem !default; // 28px
$font-size-2: 2rem !default; // 32px
$font-size-1: 2.5rem !default; // 40px
$font-size-0: 3.375rem !default; // 54px

// Font Weight
$weight-light: 100;
$weight-semilight: 200;
$weight-normal: 400;
$weight-semibold: 600;
$weight-bold: 700;

// Letter spacing
$letter-spacing-medium: 0.125rem;
$letter-spacing-wide: 0.225rem;

// Line height
$line-height-normal: 1.3;

// Reading width
$optimal-reading-width: 688px !default;
$reading-width-padding: 24px !default;
$reading-width-padded: calc(
	#{$optimal-reading-width} + (var(#{layout.$layout-gap-custom-property-name}) * 2)
) !default;

//@end-sass-export-section
