// ==========================================================================
// Header
// ==========================================================================

header {
    padding-bottom: $spacing-base;
    text-align: center;

    h1 span {
        animation: shrinkHide 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) 2s forwards;
        display: inline-block;
        font-weight: $font-weight-light;
        opacity: 0.5;
    }

    .call-to-action {
        margin-top: ($spacing-base * 1.5);
    }

    @media only screen and (min-width: $screen-md) {
        margin-right: ($spacing-base * 3);
        max-width: 360px;
        padding-bottom: ($spacing-base * 2);
        text-align: left;

        p:first-of-type {
            @include font-size($font-size-base + 1);
        }
    }
}
