.typography {
    --font-weight: 400;
    --font-weight-bold: 600;
    font-family: var(--font-family-primary);
    font-style: normal;
    color: var(--color-text-basic);
    font-weight: var(--font-weight);
    overflow: hidden;
    text-overflow: ellipsis;

    &_no-spacing {
        margin: 0;
        padding: 0;
    }

    &_color-inherit {
        color: inherit;
    }

    &_color-basic {
        color: var(--color-text-basic);
    }

    &_color-secondary {
        color: var(--color-text-secondary);
    }

    &_color-headers {
        color: var(--color-text-headers);
    }

    &_color-disabled {
        color: var(--color-text-disabled);
    }

    &_color-brand {
        color: var(--color-text-brand);
    }

    &_color-brand-1 {
        color: var(--color-text-brand-1);
    }

    &_color-warning {
        color: var(--color-text-warning);
    }

    &_color-success {
        color: var(--color-text-success);
    }

    &_color-error {
        color: var(--color-text-error);
    }

    &_color-inverse {
        color: var(--color-text-inverse);
    }

    &_color-link {
        color: var(--color-text-link);
    }

    &_size-h1 {
        font-size: 50px;
        line-height: 56px;
        font-weight: var(--font-weight-bold);
    }

    &_size-h2 {
        font-size: 30px;
        line-height: 36px;
        font-weight: var(--font-weight-bold);
    }

    &_size-h3 {
        font-size: 24px;
        line-height: 28px;
        font-weight: var(--font-weight-bold);
    }

    &_size-h4 {
        font-size: 20px;
        line-height: 28px;
        font-weight: var(--font-weight-bold);
    }

    &_size-large {
        font-size: 18px;
        line-height: 24px;
    }

    &_size-large-bold {
        font-size: 18px;
        line-height: 24px;
        font-weight: var(--font-weight-bold);
    }

    &_size-body {
        font-size: 16px;
        line-height: 20px;
    }

    &_size-body-bold {
        font-size: 16px;
        line-height: 20px;
        font-weight: var(--font-weight-bold);
    }

    &_size-caption {
        font-size: 13px;
        line-height: 16px;
    }

    &_size-caption-bold {
        font-size: 13px;
        line-height: 16px;
        font-weight: var(--font-weight-bold);
    }
}