.a-short-text
  h3
    +text-block(1.25em 1.4 .75em)
  &.is-sm
    +media-breakpoint-up(md)
      font-size: .8125rem
    +media-breakpoint-down(sm)
      font-size: .75rem
  p
    +text-block(1em 1.6 .75em)
  li
    +text-block(1em 1.6)
  ol,
  ul
    margin-left: 1.25em
    margin-top: .75em
  ol
    list-style-type: decimal
  >ul
    list-style-type: disc
  >ol
    list-style-type: decimal
  li
    ul,
    ol
      margin-block: .375em
      &:first-child
        margin-top: .375em
      &:last-child
        margin-bottom: .375em
    >ul
      list-style-type: circle
      >li
        >ul
          list-style-type: square
  a
    +hover-link-reversal
    +default-link
  hr
    display: block
    +size(100% 0)
    border: none
    border-top: dashed 1px var(--border)
    margin-block: 1.25em
  strong,
  b
    font-weight: 700
  h1
    +text-block(1.75em 1.4 0 .5em, 600)
    color: var(--main-text)
    padding-bottom: .25em
    border-bottom: 3px solid var(--border)
  h2
    +text-block(1.5em 1.4 0 .5em, 600)
    padding-bottom: .25em
    border-bottom: 1px solid var(--border)
  * + h2,
  * + h3,
  * + h4,
  * + h5
    margin-top: .75em
  h3
    +text-block(1.25em 1.4, 600)
    margin-bottom: .625em
    & + *
      margin-top: 0 !important
  h4
    +text-block(1.125em 1.5, 600)
    margin-bottom: .625em
    & + *
      margin-top: 0 !important
  h5
    +text-block(1em 1.5, 600)
    margin-bottom: .625em
    & + *
      margin-top: 0 !important
  h6
    +text-block(.875rem 1.5, 600)
    margin-bottom: .625em
    & + *
      margin-top: 0 !important

  // header-anchor
  h1,
  h2,
  h3,
  h4,
  h5,
  h6
    scroll-snap-align: start
    scroll-snap-stop: always
    position: relative
    outline-style: none
    &:hover
      .header-anchor
        opacity: 1

  .header-anchor
    display: flex
    +text-block(.75rem, 400)
    float: left
    +position(absolute)
    margin-left: -1.5rem
    text-decoration: none !important
    +size(1.5rem 100%)
    align-items: center
    justify-content: center
    transition: all .2s ease-out
    opacity: 0
    &:link,
    &:visited
      color: var(--main)

  .is-danger
    color: var(--danger) !important
  .is-warning
    color: var(--warning) !important
  &.is-ta-center,
  .is-ta-center
    text-align: center
  &.is-sm
    font-size: .8125rem
  &.has-no-headding
    h1,
    h2,
    h3,
    h4,
    h5,
    h6
      +text-block(1em 1.6 0 .625em, 700)
      border: none
      padding: 0

  .message
    padding: .875rem 1em
    border-radius: .25rem
    margin-block: 1em 1em
    background-color: var(--warning-tint)
    color: var(--warning-text)
    &.alert,
    &.danger
      background-color: var(--danger-tint)
      color: var(--danger-text)
    &.warning
      background-color: var(--warning-tint)
      color: var(--warning-text)
    &.info
      background-color: var(--info-tint)
      color: var(--info-text)
    &.primary
      background-color: var(--primary-tint)
      color: var(--primary-text)
    &.success
      background-color: var(--success-tint)
      color: var(--success-text)

  .a-help
    width: 1.25em
    height: 1.25em

  *:first-child
    margin-top: 0
  *:last-child
    margin-bottom: 0
