#offer
  .photo-header
    .text-wrapper
      padding-bottom: calc(100vw / 12)

      +respond-to-width-beyond(1440)
        padding-bottom: 120px

  .form-contact-info-row
    .offer-cta
      padding: calc(100vw / 12) 0
      width: column(5, 12)

      +respond-to-width-beyond(1440)
        padding: 120px 0

      h2
        margin: 0
        font-size: 3rem
        line-height: 1.2
        color: white
        font-weight: bold()

    .form-placeholder
      width: column(7, 12)
      padding: calc(100vw / 12) column(1, 12) calc(100vw / 12)

      +respond-to-width-beyond(1440)
        padding: 120px column(1, 12) 120px

      .form
        max-width: none

      +respond-to-width(1200)
        padding-right: 0

    .background
      background-color: $darkerBrown

      .fill-out
        width: calc(100vw / 14 * 8)
        background-color: $darkBrown

        +respond-to-width-beyond(1680)
          width: calc( (1440px / 12 * 7) + ((100% - 1440px) / 2 ))

        &:before
          left: -50px
          background: linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.2) 35%, rgba(0,0,0,0) 100%)

    +respond-to-width(1000)
      .form-placeholder, .offer-cta
        width: 100%
        padding: calc(100vw / 12) column(1, 12)

      .offer-cta
        padding-bottom: 0

    +respond-to-width(700)
      .form-placeholder, .offer-cta
        padding: calc(100vw / 12) 20px

      .offer-cta
        padding-bottom: 0

        h2
          font-size: 2rem