.display-2xlarge {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-92);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-100);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00)
}

.display-xlarge {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-72);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-78);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.display-large {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-64);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-70);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.display-medium {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-56);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-64);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.display-small {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-48);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-56);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.display-xsmall {
    font-family: var(--typography-typefaces-display);
    font-size: var(--fz-size-42);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-50);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h1, h1 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-40);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-46);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h2, h2 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-32);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-38);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h3, h3 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-24);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-32);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h4, h4 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-20);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-26);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h5, h5 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-18);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-24);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.h6, h6 {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-16);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-20);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--paragraph-spacing-00);
}

.sub-heading-large {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-18);
    font-weight: var(--fw-700);
    line-height: var(--lineheight-26);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    text-transform: uppercase;
}

.subheading-medium {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-16);
    font-weight: var(--fw-700);
    line-height: var(--lineheight-24);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    text-transform: uppercase;
}

.subheading-small {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-14);
    font-weight: var(--fw-700);
    line-height: var(--lineheight-20);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    text-transform: uppercase;
}

.accent-large {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-18);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-26);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    /* text-transform: uppercase; */
}

.accent-medium {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-16);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-24);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    /* text-transform: uppercase; */
}

.accent-small {
    font-family: var(--typography-typefaces-heading);
    font-size: var(--fz-size-14);
    font-weight: var(--fw-600);
    line-height: var(--lineheight-20);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    /* text-transform: uppercase; */
}

.body-large {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-16);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-24);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.body-medium {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-14);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-20);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.body-small {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-12);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-18);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.body-xsmall {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-11);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-16);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.boday-2xsmall {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-10);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-14);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.caption-medium {
    font-family: var(--typography-typefaces-body);
    font-size: var(--fz-size-14);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-16);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
    font-style: italic;
}

.code-medium {
    font-family: var(--typography-typefaces-code);
    font-size: var(--fz-size-12);
    font-weight: var(--fw-700);
    line-height: var(--lineheight-18);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}

.code-small {
    font-family: var(--typography-typefaces-code);
    font-size: var(--fz-size-10);
    font-weight: var(--fw-400);
    line-height: var(--lineheight-14);
    color: var(--interactive-text-gray-normal);
    letter-spacing: var(--spacing-00);
}