@use "../../abstract" as *;
/*=========== Home 9 : Cta ==========*/

.cta-home-9 {
  background: $l9-secondary;
  position: relative;

  .cta-home-9-wrapper {
    padding-bottom: 80px;
    @media (min-width: 576px) {
      padding-bottom: 80px;
    }
    @media (min-width:992px){
    padding-bottom: 100px;
    }
  }

  &-shape {
    img {
      position: absolute;
      right: 0;
      bottom: 0;
      z-index: 1;
      width: 16%;
    }
  }

  .row--custom {
    justify-content: center;
    row-gap: 30px;

    @media (min-width: 768px) {
      align-items: center;
    }

    @media (min-width: 1200px) {
      justify-content: space-between;
    }
  }

  .cta-text-block {
    text-align: center;

    @media (min-width: 768px) {
      text-align: initial;
    }

    p {
      color: rgba( #221F1A, 0.8);
      max-width: 576px;
    }
  }

  .cta-home-9-button {
    display: flex;
    justify-content: center;
    position: relative;
    column-gap: 20px;

    a {
      display: flex;
      align-items: stretch;

      img {
        width: 100%;
      }
    }

    &__shape {
      display: none;
      position: absolute;
      right: -40%;
      bottom: 100%;
      width: 37.6%;

      @media (min-width:768px) {
        display: block;
      }
    }
  }
}