@use '../utils' as *;

.tpsection {
    & p {
        font-weight: 400;
        font-size: 15px;
        line-height: 22px;
        color: var(--tp-text-body);
        & a {
            color: var(--tp-heading-secondary);
        }
    }
    &__sub-title {
        color: var(--tp-heading-secondary);
        font-family: 'Schoolbell';
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        line-height: 1.4;
    }
    &__title {
        font-weight: 700;
        font-size: 30px;
        line-height: 38px;
        color: var(--tp-heading-primary);
        letter-spacing: -.3px;
        @media #{$xs} {
            font-size: 28px;
        }
    }
}

.section {
    &__content {
        & p {
            color: var(--tp-common-white);
            & br {
                @media #{$xs} {
                    display: none;
                }
            }
        }
    }
    &__sub-title {
        font-family: "Schoolbell", Sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 25px;
        color: var(--tp-common-white);
        display: block;
    }
    &__title {
        font-size: 40px;
        font-weight: 700;
        line-height: 43px;
        letter-spacing: -0.5px;
        color: var(--tp-common-white);
        @media #{$xs} {
            font-size: 28px;
        }
        & br {
            @media #{$xs} {
                display: none;
            }
        }
    }
}