/**
 * Testimonials Block - Frontend Styles
 * These styles are loaded on the frontend
 */

.testimonials-block { padding:120px 0; position: relative; }
.dot-top-image { position: absolute;left: 0;top: 8px; }
.dot-bottom-image { position: absolute;right: 0;bottom: 21px; z-index: 0; }
.testimonials-heading { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 80px; align-items: flex-end; }
.testimonials-block .heading h2 { color: var(--primary-color); margin-bottom: 16px; }
.testimonials-block .heading h2 span { color: var(--light-red-color); }
.testimonials-block .heading p { color: var(--primary-color); max-width: 496px; width: 100%; margin: 0; }
.testimonials-wrap { padding-left: calc((100% - 1200px)/2); position: relative; z-index: 1; }
.testimonials-item .testimonials-inner { background-color: var(--gray-color); padding: 32px; border-radius: 16px; height: 100%; display: flex; flex-direction: column; justify-content: space-between; margin-right: 48px; }
.testimonials-slider .slick-list { padding-right: 300px !important; }
.testimonials-item .testimonials-inner .icon { margin-bottom: 24px; }
.testimonials-item .testimonials-inner blockquote { font-size: 20px; font-weight: var(--font-weight-normal); line-height: 1.5; color: var(--primary-color); margin: 0; }
.testimonials-item .testimonials-inner .testimonials-title { margin-top: 85px; }
.testimonials-item .testimonials-inner .testimonials-title h6 { color: var(--primary-color); margin: 0; font-weight: var(--font-weight-semibold); }
.testimonials-item .testimonials-inner .testimonials-title p { color: var(--primary-color); margin: 0; font-size: 16px; }

.testimonials-slider .slick-track { display: flex !important; }
.testimonials-slider .slick-slide { height: inherit !important; display: flex !important; }
.custom-arrows { display: flex;flex-wrap: wrap;gap: 15px; height: 48px; }
.custom-arrows .slick-arrow { height: 48px; }
.custom-arrows .slick-arrow svg { cursor: pointer; }
.custom-arrows .slick-arrow svg:hover rect { fill: var(--light-red-color); }
.custom-arrows .slick-arrow svg:hover path { fill: var(--white-color); fill-opacity: 1; }
.custom-arrows .next.slick-arrow { transform: rotate(180deg); }
.testimonials-heading .heading { width: calc(100% - 130px); }
.testimonials-heading { position: relative;}
.dot-top-image svg, .dot-bottom-image svg { width: 100%; height: 100%; }


/*Responsive Css Start Here*/
@media only screen and (max-width: 1280px) {
   .testimonials-wrap { padding-left: 20px; }
   .testimonials-item .testimonials-inner { margin-right: 30px; }
   .testimonials-heading { margin-bottom: 60px; }
}
@media only screen and (max-width: 1200px) {
    .testimonials-block {padding: 80px 0;}
    .testimonials-item .testimonials-inner { padding: 24px; }
    .testimonials-item .testimonials-inner .testimonials-title { margin-top: 55px; }
    .testimonials-item .testimonials-inner blockquote { font-size: 18px; line-height: 1.4; }
    .testimonials-heading { margin-bottom: 40px; }
    .testimonials-slider .slick-list { padding-right: 240px !important; }
}
@media only screen and (max-width: 1024px) {
    .testimonials-block {padding: 60px 0;}
    .testimonials-slider .slick-list { padding-right: 180px !important; }
    .dot-bottom-image { bottom: -30px; }
    .testimonials-item .testimonials-inner .icon { margin-bottom: 15px; }
    .testimonials-item .testimonials-inner .testimonials-title { margin-top: 30px; }
    .testimonials-item .testimonials-inner blockquote { font-size: 16px; line-height: 30px; }
}
@media only screen and (max-width: 991px) {
    .testimonials-slider .slick-list { padding-right: 120px !important; }
    .testimonials-item .testimonials-inner { margin-right: 15px; }
}
@media only screen and (max-width: 767px) {
    .testimonials-block { padding: 50px 0; }
    .testimonials-slider .slick-list { padding-right: 30px !important; }
    .testimonials-item .testimonials-inner .icon { max-width: 32px; width: 100%; }
    .dot-top-image { left: inherit;right: 0;max-width: 80px;width: 100%; top: 60px; }
    .dot-bottom-image { right: 0;max-width: 80px;width: 100%; bottom: 0; }
    
    .custom-arrows { width: 100%; justify-content: flex-end; }
    .testimonials-item .testimonials-inner { padding: 28px 32px; }
    .testimonials-item .testimonials-inner { margin-right: 12px; }
}
@media only screen and (max-width: 575px) {
    .testimonials-heading .heading { width: 100%; margin-bottom: 0; }
    .testimonials-heading { justify-content: space-between; width: 100%; flex-wrap: wrap; gap: 32px; }
}
@media only screen and (max-width: 480px) {
    .testimonials-block .heading { max-width: 323px; width: 100%; }
}