.plan
  display: none

  &__title
    color: get-color(raiz)
    font-size: 24px
    font-weight: 600
    text-align: center

  &__price
    color: get-color(rock)
    font-size: 14px
    text-align: center

    span
      color: get-color(gafieira)
      font-size: 24px
      font-weight: 600

  &__features
    list-style: none
    margin-left: 0
    margin-right: 0
    padding: 0

  &__feature
    align-items: flex-start
    background-color: get-color((color: raiz, opacity: .1))
    color: get-color((color: dark, opacity: .6))
    display: flex
    flex-direction: row
    font-size: 14px
    font-weight: 600
    padding: 15px

    &:nth-child(even)
      background-color: get-color(air)

    &--inactive
      color: get-color((color: dark, opacity: .3))

  &__check
    margin-right: 13px

  &__badge
    background-color: get-color(cancan)
    border-radius: 4px
    color: get-color(air)
    font-size: 12px
    font-weight: 700
    left: 50%
    margin: -36px auto 0
    padding: 7px 16px
    position: absolute
    text-align: left
    text-transform: uppercase
    transform: translate(-50%, -50%)

  &--unselected
    display: none

  &--selected
    display: flex
