// Connect fonts here
// Cabin
@include font-face('Cabin', 'Cabin/Cabin-Regular', 400, normal);
@include font-face('Cabin', 'Cabin/Cabin-Italic', 400, italic);
@include font-face('Cabin', 'Cabin/Cabin-SemiBold', 600, normal);
@include font-face('Cabin', 'Cabin/Cabin-Bold', 700, normal);

// Open Sans
@include font-face('Open Sans', 'OpenSans/OpenSans-Light', 300, normal);

/*
 * Styles below should be used for general typography styles across whole project
 */
%base-styles-headings {
    font-family: var(--rocket-font-primary);
    font-weight: 400;
    line-height: 1.21;
}

%base-styles-h1 {
    @extend %base-styles-headings;

    font-size: 2.5rem;

    @include breakpoint(md) {
        font-size: 4.12rem;
    }
}

%base-styles-h2 {
    @extend %base-styles-headings;

    font-size: 2.5rem;

    @include breakpoint(md) {
        font-size: 4.12rem;
    }
}

%base-styles-h3 {
    @extend %base-styles-headings;

    font-size: 1.875rem;

    @include breakpoint(sm) {
        font-size: 2.5rem;
    }
}

%base-styles-text {
    font-size: 1.5625rem;
    font-weight: var(--rocket-body-font-weight);
    line-height: 1.4;
}

%base-styles-text-lg {
    @extend %base-styles-text;

    font-size: 1.875rem;
    line-height: 1.33;
}

%base-styles-text-sm {
    @extend %base-styles-text;

    font-size: 1.25rem;
    line-height: 1.2;
}

%base-styles-text-xs {
    @extend %base-styles-text;

    font-size: 1.0625rem;
    line-height: 1.2;

    @include breakpoint(sm) {
        font-size: 1.125rem;
    }
}