/*--------------------------------------------------------------
  31. Work Process
----------------------------------------------------------------*/
@media screen and (max-width: 991px) {
  .cs-wrap-q-p{
    .cs-section-height-half,
    .cs-height-65
    {
      display: none;
    }
  }
}

.cs-quote-process-wrap {
  .cs-content-wrap-quote-process {
    padding: 0px 100px;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    .cs-left-text-container {
      .cs-stroke-text {
        -webkit-text-stroke: 1px $white;
        h2{
          color: transparent;
          -webkit-text-stroke: 1px $white;
        }
      }
      .quote-title-text{
        text-transform: uppercase;
        color: $white;
        font-size: 61px;
        margin-bottom: 70px;
      }
    }
    .cs-proces-wrap {
      margin-left: 10px;
      max-width: 685px;
      background: rgba(255, 255, 255, 0.1);
      backdrop-filter: blur(125px);
      color: $white;
      .col-lg-6 {
        padding: 0px;
      }
      .process-item {
        padding: 40px 50px;
        border: 1px solid rgba(255, 255, 255, 0.164);
        p {
          margin: 0px;
        }
        h6{
          color: $white;
        }
      }
    }
    @media screen and (max-width: 991px) {
      background-repeat: repeat;
    }
  }
  .cs-quote-form-container{
    max-width: 658px;
    margin-top: -205px;
    .quote-form-content-in{
      background: $dark-bg;
      clip-path: polygon(10% 0%, 100% 0, 100% 10%, 100% 90%, 90% 100%, 0 100%, 0% 90%, 0% 10%);
      padding: 80px 80px;
      .cs-quote-title{
        margin-bottom: 40px;
        h4{
          color: $white;
        }
      }
      .cs-quote-form{
        input,
        select,
        textarea{
          background: transparent;
          border-radius: 0px;
          border: 1px solid #2F6263;
          color: rgba($color: #fff, $alpha: 0.8);
          padding-left: 20px;
        }
        :focus-visible,
        :focus-visible,
        :focus,
        :target{
          border: 1px solid $white;
        }
        :focus{
          box-shadow: none;
        }
        input,
        select{
          height: 60px;
        }
        ::placeholder{
          color: rgba($color: #fff, $alpha: 0.8);
        }
        button{
          i{
            line-height: 0px;
          }
          :focus{
            border: none;
          }
        }

      }
    }
  }
}

.cs-form-select{
  width: 100%;
  option{
    background-color: $dark-bg;
    padding-right: 20px
  }
  .cs-default-dropdown{
    background-color: $white;
  }
}

@media screen and (max-width: 1500px) {
  .cs-quote-process-wrap{
    .cs-content-wrap-quote-process{
      padding: 0px 3%;
    }
  }
}
@media screen and (max-width: 1300px) {
  .cs-quote-process-wrap{
    .cs-quote-form-container{
      .quote-form-content-in{
        padding: 50px;
      }
    }
  }
}
@media screen and (max-width: 1199px) {
  .cs-quote-process-wrap{
    .cs-quote-form-container{
      margin-top: 45px;
    }
    .cs-left-text-container {
      .quote-title-text{
        display: none;
      }
      .cs-stroke-text{
        margin-bottom: 40px;
      }
    }
  }
}
@media screen and (max-width: 991px) {
  .cs-quote-process-wrap{
    .cs-content-wrap-quote-process{
      padding: 100px 0px;
      .cs-left-text-container,
      .cs-quote-form-container{
        max-width: 720px;
        margin: auto;
      }
    }
  }
  .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-proces-wrap{
    max-width: 720px;
    height: auto;
    margin: auto;
  }
  .quote-flex-reverse{
    display: flex;
    flex-direction: column-reverse;
    gap: 45px;
  }
}
@media screen and (max-width: 750px) {
  .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-proces-wrap{
    margin: 0px 10px;
  }
  .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-left-text-container, .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-quote-form-container{
    width: 96vw;
    margin: auto;
  }
  .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-left-text-container .cs-stroke-text h2{
    font-size: 40px;
    color: $white;
  }
}
@media screen and (max-width: 525px) {
  .cs-quote-process-wrap .cs-content-wrap-quote-process .cs-proces-wrap{
    margin: 0px 10px;
  }
  .cs-stroke-text{
    padding: 0px 10px;
  }
  .cs-quote-form-container{
    .quote-form-content-in{
      padding: 30px !important;
    }
  }
}
// @media screen and (max-width: 400px) {


