/*  UTLITIES: TYPOGRAPHY
//////////////////////////////////////////////////////////////////////////////*/

@layer utilities {
    .text-xs,
    .text-xs * {
        font-size: var(--font-size-xs);
        line-height: var(--line-height-xs);
    }
    .text-s,
    .text-s * {
        font-size: var(--font-size-s);
        line-height: var(--line-height-s);
    }
    .text-m,
    .text-m * {
        font-size: var(--font-size-m);
        line-height: var(--line-height-m);
    }
    .text-l,
    .text-l * {
        font-size: var(--font-size-l);
        line-height: var(--line-height-l);
    }
    .text-xl,
    .text-xl * {
        font-size: var(--font-size-xl);
        line-height: var(--line-height-xl);
    }
    .text-xxl,
    .text-xxl * {
        font-size: var(--font-size-xxl);
        line-height: var(--line-height-xxl);
    }
    .text-xxxl,
    .text-xxxl * {
        font-size: var(--font-size-xxxl);
        line-height: var(--line-height-xxxl);
    }
    .text-align-right {
        text-align: right;
    }
}