.heading-xs {
    font-family: var(--font-family-primary);
    font-size: var(--text-20);
    line-height: var(--line-height-20);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

.heading-sm {
    font-family: var(--font-family-primary);
    font-size: var(--text-24);
    line-height: var(--line-height-24);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

.heading-md {
    font-family: var(--font-family-primary);
    font-size: var(--text-28);
    line-height: var(--line-height-28);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

.heading-lg {
    font-family: var(--font-family-primary);
    font-size: var(--text-32);
    line-height: var(--line-height-32);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

.heading-xl {
    font-family: var(--font-family-primary);
    font-size: var(--text-36);
    line-height: var(--line-height-36);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

.heading-2xl {
    font-family: var(--font-family-primary);
    font-size: var(--text-40);
    line-height: var(--line-height-40);
    font-weight: var(--weight-400);
    letter-spacing: var(--letter-spacing-0);
}

@media (min-width: 768px) {
    .heading-xs {
        font-family: var(--font-family-primary);
        font-size: var(--text-20);
        line-height: var(--line-height-20);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-sm {
        font-family: var(--font-family-primary);
        font-size: var(--text-24);
        line-height: var(--line-height-24);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-md {
        font-family: var(--font-family-primary);
        font-size: var(--text-28);
        line-height: var(--line-height-28);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-lg {
        font-family: var(--font-family-primary);
        font-size: var(--text-32);
        line-height: var(--line-height-32);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-xl {
        font-family: var(--font-family-primary);
        font-size: var(--text-36);
        line-height: var(--line-height-36);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-2xl {
        font-family: var(--font-family-primary);
        font-size: var(--text-40);
        line-height: var(--line-height-40);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
}    

@media (min-width: 1440px) {
    .heading-xs {
        font-family: var(--font-family-primary);
        font-size: var(--text-20);
        line-height: var(--line-height-20);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-sm {
        font-family: var(--font-family-primary);
        font-size: var(--text-24);
        line-height: var(--line-height-24);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-md {
        font-family: var(--font-family-primary);
        font-size: var(--text-28);
        line-height: var(--line-height-28);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-lg {
        font-family: var(--font-family-primary);
        font-size: var(--text-32);
        line-height: var(--line-height-32);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-xl {
        font-family: var(--font-family-primary);
        font-size: var(--text-36);
        line-height: var(--line-height-36);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
    
    .heading-2xl {
        font-family: var(--font-family-primary);
        font-size: var(--text-40);
        line-height: var(--line-height-40);
        font-weight: var(--weight-400);
        letter-spacing: var(--letter-spacing-0);
    }
}