@import "../common/var.scss";

// Large to Small Header types

//H1
.c-heading__page {
    font-size: 2.5rem; // 40px
    line-height: 1.1; // 44px
    font-weight: 300; // slightly thinner than regular
}

//H2
.c-heading__main {
    font-size: 1.875em; // 30px
    line-height: 1.2; // 36px
    font-weight: 400; // regular
}

//H3
.c-heading {
    color: $color-gray--070;
    font-size: 1.438rem; // ~23px
    line-height: 1.22; // ~28px
    font-weight: 500; // slightly bolder than regular
}

//H4
.c-heading__section {
    font-size: 1.25rem; // 20px
    font-weight: 400; // regular
    line-height: 1.3; // 26px
    letter-spacing: .04em;
}

//H5
.c-heading__sub {
    color: $color-gray--070;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5; // 24px
}

.c-heading__sm {
    color: $color-gray--070;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.57;
    letter-spacing: .01em;
}

.c-heading__eyebrow {
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.c-heading__eyebrow-sm {
    font-size: .875rem;
    font-weight: 400;
    letter-spacing: .04em;
    line-height: 1.57; // ~22px
    text-transform: uppercase;
}