.pricing_hero_revamped
  background: transparent linear-gradient(78deg, #1C0F1F 0%, #3A1745 48%, #92278F 100%) 0% 0% no-repeat padding-box
  padding: 6rem 0
  margin-bottom: 38rem
  @include tablet
    padding: 9rem 0 6rem 0 !important
    .custom_container_fluid
      width: 100% !important
  @include phone
    padding: 6rem 0 2rem 0
    .col-md-4
      margin-bottom: 1.5rem
  @include desktop
    padding: 4rem 0
  .col-lg-12
    margin-bottom: -34rem
    margin-top: 2.5rem
  .second_card
    background: linear-gradient(282deg, #8C0054, #DA448F, #8C0054) 0% 0% / 200% 200% no-repeat padding-box
    padding-left: 3px
    padding-right: 3px
    padding-bottom: 3px
    border-radius: 20px
    margin-top: -3rem
    animation: smoothBg 6s ease infinite
    @include phone
      margin-top: 0 !important
    p
      font-size: 1rem
      font-weight: 600
      color: #fff
      padding: 12px 0
      text-align: center
      margin: 0 !important
      .common_pricing_card
        border-top-left-radius: 0 !important
        border-top-right-radius: 0 !important
  .first_card
    a
      background: #F8EFF7 !important
      box-shadow: none !important
      color: #A33AA1 !important
      border: 0 !important
  .third_card
    a
      background: #F8EFF7 !important
      box-shadow: none !important
      color: #A33AA1 !important
      border: 0 !important
  .common_pricing_card
    background: #FFFFFF 0% 0% no-repeat padding-box
    box-shadow: 0px 13px 26px #00000019
    border-radius: 20px
    padding: 1.5rem
    a
      width: 100% !important
    h2
      font-size: 1.8rem
      font-weight: 600
      color: #14141F
      margin-top: 0 !important
      margin-bottom: 1rem
      @include desktop
        font-size: 1.5rem
        margin-block: .5rem
    p
      font-size: 1.2rem
      color: #14141F
      margin-top: 0
      margin-bottom: 1.5rem
      font-weight: 400
      @include desktop
        font-size: 1.1rem
    ul
      padding-left: 0
      list-style: none
      margin: 2rem 0
      li
        display: flex
        align-items: center
        justify-content: space-between
        margin-bottom: 1rem
        span
          width: 12px
          height: 12px
          border-radius: 50%
          display: inline-flex
          background-color: #B1D951
        p
          font-size: 1rem
          color: #14141F
          margin: 0 !important
          font-weight: 400
          width: calc( 100% - 24px )
          text-align: left
          padding: 0 !important
          @include desktop
            font-size: 1.1rem

  .pricing_hero_revamped_heading
    text-align: center
    margin-bottom: 6rem
    @include tablet
      width: 90% !important
      margin: 0 auto 6rem auto !important
    p
      font-size: 1.2rem
      color: #ffffff
      margin-bottom: 3rem !important
      @include phone
        margin-bottom: 1rem !important
      @include desktop
        margin-bottom: 2rem !important
    h1
      font-size: 2.875rem
      font-weight: 700
      color: #fff
      margin-top: 0 !important
      margin-bottom: 1rem
      @include phone
        font-size: 2.2rem
      @include desktop
        font-size: 2.5rem !important
.pricing_add_on_features_revamped
  .col-md-4
    margin-bottom: 1.5rem
  .pricing_add_on_features_common
    background: #F9F9FB 0% 0% no-repeat padding-box
    border-radius: 20px
    padding: 2rem
    height: 100%
    display: flex
    flex-direction: column
    justify-content: space-between
    a
      display: inline-flex
      align-items: center
      gap: 10px
      margin-top: 4rem
      margin-bottom: 2rem
      padding: 1.2rem 2rem
      color: #A33AA1
      text-decoration: none
      font-weight: 600
      transition: transform 0.3s ease, background-position 0.6s ease
      background: transparent
      border: 1px solid #CA67A3
      border-radius: 12px
      opacity: 1
      font-size: 1.325rem
      font-weight: 500
      width: 100%
      justify-content: center
      @include phone
        margin-top: 15px
      @include desktop
        font-size: 1.125rem
        margin-top: 1.5rem !important
      &:hover
        transform: translateY(-2px)
    h3
      font-size: 1.8rem
      font-weight: 600
      color: #14141F
      margin-top: 0 !important
      margin-bottom: 1rem
      @include tablet
        white-space: normal
        word-wrap: break-word
      @include desktop
        font-size: 1.5rem
        margin-block: .5rem
    p
      font-size: 1.2rem
      color: #14141F
      margin-top: 0
      margin-bottom: 1.5rem
      font-weight: 400
      @include desktop
        font-size: 1.1rem
  h2
    font-size: 2.2rem
    font-weight: 600
    color: #14141F
    text-align: center
    margin-bottom: 3rem


@keyframes smoothBg
  0%
    background-position: 0% 50%
  50%
    background-position: 100% 50%
  100%
    background-position: 0% 50%