.cta-row
  position: relative
  background-color: $darkGreen

  .background
    position: absolute
    width: 100%
    height: 100%
    top: 0
    left: 0

    &:after
      content: ''
      position: absolute
      width: 50%
      height: 100%
      top: 0
      right: 0
      background: linear-gradient(270deg, $darkGreenGradient)

  .grid-row
    position: relative
    z-index: 2
    +flex(space-between, center)


  .cta-trigger
    text-align: right
    padding: 65px column(1, 24) 65px column(1, 12)

    h3
      color: white
      font-size: 1.5rem
      font-weight: semi-bold()
      margin: 0

    p
      color: white
      margin: 0

    .button
      margin-top: 30px
      padding: 18px 25px



  .person
    +flex(flex-start, center)
    padding: 65px column(1, 24)

    .image-placeholder
      width: column(4, 12)
      max-width: 246px


      figure
        position: relative
        width: 100%
        padding-bottom: 100%
        height: 0

        span
          position: absolute
          border-radius: 100%
          top: 0
          left: 0
          width: 100%
          height: 100%
          background-position: center
          background-size: cover

    .contact-info
      width: column(8, 12)
      padding-left: 25px

      p
        margin: 0 0 1.2rem
        color: white
        font-weight: bold()

      span
        display: block
        color: white
        font-size: 0.8rem

        &.margin-top
          margin-top: 20px

      a
        display: block
        color: $orange
        font-weight: semi-bold()
        text-decoration: none
        transition: color 0.2s

        &:hover
          color: $orangeRed

  +respond-to-width(900)
    .background
      position: absolute
      width: 100%
      height: 100%
      top: 0
      left: 0

      &:after
        width: 100%
        top: auto
        bottom: 0
        height: 275px
        background: linear-gradient(0deg, $darkGreenGradient)

    .grid-row
      display: block

    .cta-trigger
      text-align: center
      display: block
      width: 100%
      max-width: 420px
      margin: auto
      padding: 65px 0

      h3
        font-size: 1.2rem
      p
        font-size: 0.9rem

    .person
      +flex(center, center)
      width: 100%
      height: 275px
      max-width: 500px
      margin: auto
      padding: 0

      .contact-info
        .phone
          font-size: 0.85rem