/*
 Theme Name:   PRIORISE
 Theme URI:    https://priorise.com
 Description:  Thème PRIORISE
 Author:       STUDIO WBM
 Author URI:   https://priorise.com
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light
 Text Domain:  priorise_theme
*/




/***********************
       RESPONSIVE
***********************/
section.block-join-us{
       padding-top: clamp(18vh, 20vh, 24vh);
       padding-bottom: clamp(18vh, 20vh, 24vh);
       background-position: center bottom;
       background-repeat: no-repeat;
       background-size: cover;
       overflow: hidden;
}
img#shape-join-us {
       position: absolute;
       right: 0;
       top: 40px;
       z-index: 1;
       height: 90%;
}   

.row-block-join-us{
       position: relative;
       display: flex;
       flex-direction: row;
       gap: 40px;
       align-items: center;
       justify-content: space-between;
       z-index: 2;
}
.col-join-us-content{
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       gap: 60px;
       max-width: 50%;    
}
.col-join-us-content > div {
       display: flex;
       flex-direction: column;
       gap: 40px;
}
.col-join-us-content > div h2, .col-join-us-content > div h3{
       font-size: 62px;
       font-style: normal;
       font-weight: 400;
       line-height: 130%; 
       background: linear-gradient(110deg, #FFF 17.75%, rgba(255, 255, 255, 0.60) 83.47%);
       background-clip: text;
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       margin-bottom: 0;
}
.col-join-us-content > div p, .col-join-us-content > div li{
       color: #FFF;
       font-size: 22px;
       font-style: normal;
       font-weight: 300;
       line-height: 160%;
}
.col-join-us-content > div ul{
       list-style-type: circle;
       margin-top: 5px;
       margin-bottom: 5px;
       margin-left: 15px;
}
.col-join-us-content > div a {
       color: #FFF;
       /* font-size: 18px;
       border: solid 1px rgba(255, 255, 255, 0.60);
       border-radius: 10px; */
       padding: 4px 6px;
       white-space: nowrap;
       font-style: normal;
       font-weight: 300;
       line-height: 160%;
}
.col-join-us-content button{
       width: fit-content;
}
.col-join-us-testimonials{
       position: relative;
       max-width: 45%;
       display: flex;
       justify-content: flex-end;
       align-items: flex-end;
}
.col-join-us-testimonials ul{
       position: relative;
       min-height: 260px;
       width: 100%;
       height: 100%;
       margin: 0;
       padding: 0;
       display: flex;
       justify-content: center;
       align-items: center;
}
.col-join-us-testimonials ul li.prev, .col-join-us-testimonials ul li.next {
       opacity: 0.85;
}

.col-join-us-testimonials ul li{
       list-style-type: none;
       display: flex;
       width: 480px;
       min-height: 260px;
       padding: 30px 30px 25px;
       flex-direction: column;
       justify-content: center;
       align-items: flex-start;
       gap: 20px;
       border-radius: 25px;
       background: rgba(255, 255, 255, 0.9);
       backdrop-filter: blur(20px);
       -webkit-backdrop-filter: blur(20px);
       box-shadow: 0px -4px 10px 0px rgba(28, 27, 31, 0.10);
       border-bottom: solid 1px rgba(99, 53, 241, 0.20);
       /* Animation */
       position: absolute;
       top: 0;
       right: 0;
       opacity: 1;
       transition: all 0.4s ease-out;
}
.col-join-us-testimonials ul li.slide--active {
       opacity: 1;
       z-index: 9;
}
.prev {
       transform: translate(0%, 40%) scale(0.8);
}
.next {
       transform: translate(0%, -40%) scale(0.8);
}
.controls {
       position: absolute;
       display: flex;
       flex-direction: column;
       justify-content: center;
       gap: 10px;
       top: 105px;
       right: -60px;
}
.controls button.disabled {
       opacity: 0;
       cursor: default;
}
.col-join-us-testimonials ul li p{
       color: var(--themeFontColor);
       font-size: 17px;
       font-style: normal;
       font-weight: 400;
       line-height: 150%;  
}

.employee-tag-testimonial{
       display: flex;
       padding: 1px 35px 1px 1px;
       align-items: center;
       gap: 10px;
       border-radius: 60px;
       /* background: linear-gradient(220deg, #FFF 17.78%, rgba(255, 255, 255, 0.80) 47.69%);
       backdrop-filter: blur(5px);
       -webkit-backdrop-filter: blur(5px);
       box-shadow: 0px 0px 8px 0px rgba(55, 5, 131, 0.10); */
       width: fit-content;    
}
.employee-tag-testimonial .employee-thumbnail{
       display: flex;
       width: 70px;
       height: 70px;
       overflow: hidden;
       border-radius: 228.31px;
       background: linear-gradient(161deg, #6A32FB 0%, #3D0089 100%);
       box-shadow: 0px 2px 5px 0px rgba(55, 5, 131, 0.15);
       border: solid 2px rgba(255, 255, 255, 0.80);
}
.employee-tag-testimonial .employee-thumbnail img{
       object-position: bottom;
       object-fit: contain;
}
.employee-testimonial-content {
       display: flex;
       flex-direction: column;
       justify-content: center;
}
.employee-testimonial-content h3{
       color: var(--themeMarine);
       font-size: 20px;
       font-style: normal;
       font-weight: 500;
       line-height: 100%;
       margin: 0;
}
.employee-testimonial-content .employee-cat img {
       height: 20px;
       object-fit: contain;
}
.employee-testimonial-content .employee-cat {
       display: flex;
       align-items: center;
       gap: 5px;
       color: var(--themePurple);
       font-size: 14px;
}


/***********************
       RESPONSIVE
***********************/


@media only screen and (max-width: 1600px) {
       .col-join-us-content {
              max-width: 47%;
       }
       .col-join-us-content > div h2, .col-join-us-content > div h3{
              font-size: 52px;
       }
       .col-join-us-content > div p {
              color: #FFF;
              font-size: 20px;
       }
}
@media only screen and (max-width: 1280px) {
       .col-join-us-content > div h2, .col-join-us-content > div h3 {
              font-size: 44px;
       }
       section.block-join-us {
              padding-top: clamp(24vh, 27vh, 30vh);
              padding-bottom: clamp(24vh, 24vh, 28vh);
       }
       .col-join-us-testimonials ul li{
              top: -40px;
              right: 80px;
              width: 440px;
       }
       .controls {
              gap: 10px;
              top: 60px;
              right: 10px;
       }
}
@media only screen and (max-width: 1200px) {
       .col-join-us-content > div h2, .col-join-us-content > div h3 {
              font-size: 36px;
       }
       .col-join-us-content > div p {
              font-size: 18px;
       }
       .controls {
              right: -10px;
              top: 40px;
       }
       .col-join-us-testimonials ul li {
              top: -30px;
              right: 60px;
       }
       .col-join-us-testimonials ul li p {
              font-size: 16px;
       }
       .employee-tag-testimonial .employee-thumbnail {
              display: flex;
              width: 60px;
              height: 60px;
       }
       .col-join-us-testimonials ul li {
              width: 400px;
              padding: 25px 20px 15px
       }
       .employee-testimonial-content h3 {
              font-size: 18px;
       }
}
@media only screen and (max-width: 992px) {
       section.block-join-us {
              padding-top: clamp(15vh, 18vh, 22vh);
              padding-bottom: clamp(15vh, 18vh, 22vh);
       }
       .row-block-join-us {
              gap: 80px;
       }
       .col-join-us-content, .col-join-us-testimonials{
              max-width: 100%;
       }
       .prev {
              transform: translate(40%, 0%) scale(0.8);
       }
       .next {
              transform: translate(-40%, 0%) scale(0.8);
       }
       .col-join-us-content > div {
              gap: 30px;
       }
       .col-join-us-content {
              gap: 40px;
       }
       .col-join-us-testimonials ul li {
              top: 0px;
              right: calc(50% - 200px);
       }
       .controls {
              right: -15px;
              top: 80px;
       }
       .col-join-us-content > div p {
              max-width: 60%;
       }
}
@media only screen and (max-width: 575px) {
       img#shape-join-us{
              display: none;
       }
       .row-block-join-us {
              padding: 0 10px;
              gap: 101px;
       }
       .col-join-us-content > div h2, .col-join-us-content > div h3 {
              font-size: 36px;
       }
       .col-join-us-content > div p {
              font-size: 17px;
              max-width: 100%;
       }
       .prev {
              transform: translate(0%, 30%) scale(0.8);
       }
       .next {
              transform: translate(0%, -30%) scale(0.8);
       }
       .col-join-us-testimonials ul li p {
              font-size: 15px;
       }
       .col-join-us-testimonials ul li {
              min-height: 240px;
              max-width: 350px;
              right: calc(50% - 175px);
       }
       .employee-tag-testimonial .employee-thumbnail {
              display: flex;
              width: 50px;
              height: 50px;
       }
       section.block-join-us {
              padding-top: clamp(22vh, 26vh, 30vh);
              padding-bottom: clamp(22vh, 26vh, 30vh);
       }
       .controls {
              right: 20px;
              top: 80px;
       }
}
@media only screen and (max-width: 420px) {
       section.block-join-us {
              padding-top: clamp(15vh, 20vh, 30vh);
              padding-bottom: clamp(15vh, 30vh, 45vh);
       }
       .controls {
              right: calc(50% - 30px);
              top: auto;
              gap: 5px;
              bottom: -150px;
       }
}