$title-color: v("text-strong") !default
$title-family: inherit !default
$title-size: v("size-3") !default
$title-weight: v("weight-semibold") !default
$title-line-height: 1.125 !default
$title-strong-color: inherit !default
$title-strong-weight: inherit !default
$title-sub-size: 0.75em !default
$title-sup-size: 0.75em !default

$subtitle-color: v("text") !default
$subtitle-family: inherit !default
$subtitle-size: v("size-5") !default
$subtitle-weight: v("weight-normal") !default
$subtitle-line-height: 1.25 !default
$subtitle-strong-color: v("text-strong") !default
$subtitle-strong-weight: v("weight-semibold") !default
$subtitle-negative-margin: -1.25rem !default

+register(title-sub-size,$title-sub-size, true)
+register(title-sup-size,$title-sup-size, true)
+register(title-color,$title-color, true)
+register(title-size,$title-size, true)
+register(title-weight,$title-weight, true)
+register(title-line-height,$title-line-height, true)
+register(title-strong-color,$title-strong-color, true)
+register(title-strong-weight,$title-strong-weight, true)
+register(title-family,$title-family, true)
+register(subtitle-family,$subtitle-family, true)


+register(subtitle-negative-margin,$subtitle-negative-margin, true)
+register(subtitle-color,$subtitle-color, true)
+register(subtitle-size,$subtitle-size, true)
+register(subtitle-weight,$subtitle-weight, true)
+register(subtitle-line-height,$subtitle-line-height, true)
+register(subtitle-strong-color,$subtitle-strong-color, true)
+register(subtitle-strong-weight,$subtitle-strong-weight, true)

.title,
.subtitle
  @extend %block
  word-break: break-word
  em,
  span
    font-weight: inherit
  sub
    font-size: v("title-sub-size")
  sup
    font-size: v("title-sup-size")
  .tag
    vertical-align: middle

.title
  color: v("title-color")
  font-family: v("title-family")
  font-size: v("title-size")
  font-weight: v("title-weight")
  line-height: v("title-line-height")
  strong
    color: v("title-strong-color")
    font-weight: v("title-strong-weight")
  & + .highlight
    margin-top: -0.75rem
  &:not(.is-spaced) + .subtitle
    margin-top: v("subtitle-negative-margin")
  // Sizes
  @each $size in $sizes
    $i: index($sizes, $size)
    &.is-#{$i}
      font-size: $size

.subtitle
  color: v("subtitle-color")
  font-family: v("subtitle-family")
  font-size: v("subtitle-size")
  font-weight: v("subtitle-weight")
  line-height: v("subtitle-line-height")
  strong
    color: v("subtitle-strong-color")
    font-weight: v("subtitle-strong-weight")
  &:not(.is-spaced) + .title
    margin-top: v("subtitle-negative-margin")
  // Sizes
  @each $size in $sizes
    $i: index($sizes, $size)
    &.is-#{$i}
      font-size: $size