.pagetitle {
    position: relative;
    font-size: $larger-font;
    .pagetitle__wrapper--title & {
        border: 1px solid $border-color;
        @include crosshatchBg;
        margin-bottom: $spacing * 2;
    }
    .pagetitle__wrapper--pagination & {
        border-top: 1px dashed $border-color;
        padding-top: $spacing;
        margin-bottom: $spacing;
    }
}

.pagetitle__inner {
    text-align: center;
    z-index: 10;
    position: relative;
    @include medium-large {
        @include flex-center;
        justify-content: space-between;
    }
    .pagetitle__wrapper--title & {
        padding: $spacing;
        background: $bg-color;
    }
}

.pagetitle__main {
    margin-bottom: 0;
    @include small {
        margin-bottom: $spacing/2;
    }
    @include small-medium {
        font-size: $large-font;
        line-height: 1.4;
    }
    @include large {
        font-size: $largest-font;
        flex-grow: 1;
    }
}

.pagination__link {
    display: block;
    @include secondary-font;
    white-space: nowrap;
    @include small {
        font-size: $small-font;
    }
    @include medium-large {
        font-size: $medium-font;
    }
}

.pagination__link__label {
    @include small {
        display: inline-block;
    }
    @include medium-large {
        .pagetitle__wrapper--title & {
            display: none;
        }
    }
}
.pagination__previous {
    @include small-medium {
        text-align: center;
        margin-bottom: $spacing/2;
    }
    @include large {
        text-align: left;
        margin-right: $spacing;
    }
}

.pagination__next {
    @include small-medium {
        text-align: center;
    }
    @include large {
        text-align: right;
        margin-left: $spacing;
    }
}
