.site-meta {
  flex-grow: 1;
  text-align: center;

  @include mobile() {
    text-align: center;
  }
}

.custom-logo-image {
  margin-top: 20px;

  @include tablet-mobile() {
    display: none;
  }
}

.brand {
  border-bottom: 0;
  color: var(--brand-color);
  display: inline-block;
  padding: 0 40px;

  &:hover {
    color: var(--brand-hover-color);
  }
}

.site-title {
  font-family: $font-family-logo;
  font-size: $font-size-title;
  font-weight: normal;
  line-height: 1.5;
  margin: 0;
}

.site-subtitle {
  color: $subtitle-color;
  font-size: $font-size-subtitle;
  margin: 10px 0;
}

.use-motion {
  .site-title, .site-subtitle, .custom-logo-image {
    opacity: 0;
    position: relative;
    top: -10px;
  }
}