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

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

  h1 span {
    animation: shrink-hide 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);
    }
  }
}