@import 'partials';
.sec-title-block{
    .txt-blue{
        color: #014CB2;
    }
    h4{
        margin-bottom: 15px;
        font-size: 24px;
        font-weight: 600;
        color: #014CB2;
        @media ($sm-1679) {
            font-size: 22px;
        }
        @media ($sm-1441) {
            font-size: 20px;
        }
        @media ($sm-1199) { font-size: 18px;}
    }
    h2{
        font-size: 62px;
        font-weight: 500;
        margin-bottom: 15px;
        color: #00124D;
        @media ($sm-1679) {
            font-size: 50px;
        }
        @media ($sm-1441) {
            font-size: 44px;
        }
        @media($sm-1199){
            font-size: 32px;
        }
        @media($sm-991){
            font-size: 28px;
        }
        @media($sm-767){
            font-size: 24px;
        }
    }
    p{
        color: #313646;
        font-size: 20px;
        @media ($sm-1679) {
            font-size: 18px;
        }
        @media ($sm-1441) {
            font-size: 15px;
        }
    }
}
.review-sec{
    background: linear-gradient(180deg, rgba(85, 227, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%);
    padding: 150px 0;
    @media ($sm-1679) {
        padding: 90px 0;
    }
    @media ($sm-1441) {
        padding: 70px 0;
    }
    @media ($sm-991) { padding: 50px 0;}
    @media ($sm-767) { padding: 30px 0;}
    
    .sec-title-block{
        margin-bottom: 100px;
        @media ($sm-1679) {
            margin-bottom: 50px;
        }
        @media ($sm-1441) {
            margin-bottom: 40px;
        }
        @media ($sm-991) {margin-bottom: 20px;}
        p{
            max-width: 850px;
            margin: 0 auto;
            @media ($sm-1679) {
                max-width: 680px;
            }
            @media ($sm-1441) {
                max-width: 600px;
            }
        }
    }
    .review-slider-sec{
        .review-arrows-block{
            padding-top: 35px;
            text-align: right;
            padding-right: 15px;
            @media ($sm-1441) {
                padding-top: 25px;
            }
            .review-arrows{
                border: 1px solid #014CB2;
                border-radius: 45px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 0;
                background-color: #fff;
                width: 45px;
                height: 45px;
                transition: .3s;
                margin-left: 15px;
                @media ($sm-1679) {
                    width: 40px;
                    height: 40px;
                    img{
                        width: 15px;
                    }
                }
                @media ($sm-1441) {
                    width: 36px;
                    height: 36px;
                    img{
                        width: 13px;
                    }
                }
                &:hover{
                    background-color: #014CB2;
                    img{
                        filter: grayscale(1) brightness(5);
                    }
                }
            }
        }
    }
    .review-slider{
        .slick-track{
            display: flex !important;
        }
        .slick-slide{
            height: inherit !important;
        }
        .item{
            padding: 50px 17px 5px;
            @media ($sm-991) {padding: 30px 20px 20px 20px;}
            @media ($sm-767) {padding: 20px 4px 4px 4px;}
        }
        .review-slider-card{
            background-color: #fff;
            // border: solid 1px #023DFF;
            border-radius: 29px;
            width: 100%;
            height: 100%;
            position: relative;
            min-height: 450px;
            padding: 85px 35px 45px;
            display: flex;
            flex-direction: column;
            @media ($sm-1679) {
                padding: 70px 35px 40px;
                min-height: 380px;
            }
            @media ($sm-1441) {
                padding: 60px 35px 40px;
                min-height: 340px;
            }
            @media ($sm-767) {min-height: inherit;}
            @media ($sm-479) { padding: 40px 20px 20px;}
            &::before{
                content: '';
                position: absolute;
                width: 88px;
                height: 62px;
                background-image: url('../img/qts-Icon.svg');
                background-repeat: no-repeat;
                background-size: contain;
                top: -25px;
                left: 45px;
                z-index: 1;
                @media ($sm-1679) {
                    width: 78px;
                    height: 52px;
                }
                @media ($sm-1441) {
                    width: 68px;
                    height: 42px;
                    top: -18px;
                }
                @media ($sm-991) { left: 25px; width: 40px;}
            }
            &::after{
                content: '';
                position: absolute;
                width: calc(100% + 2px);
                height: calc(100% + 2px);
                top: -25px;
                left: 45px;
                z-index: -1;
                left: -1px;
                top: -1px;
                background: linear-gradient(90deg, #55E3FF 0%, #023DFF 100%);
                border-radius: 29px;
            }
            p{
                font-size: 20px;
                font-weight: 300;
                margin-bottom: 25px;
                @media ($sm-1679) {
                    font-size: 18px;
                }
                @media ($sm-1441) {
                    font-size: 16px;
                }
                @media ($sm-767) {margin-bottom: 15px; font-size: 14px;}
            }
            .logo-block{
                margin-top: auto;
                img{
                    @media ($sm-1679) {
                        max-height: 60px;
                    }
                    @media ($sm-1441) {
                        max-height: 50px;
                    }
                    @media ($sm-991) {max-height: 30px;}
                }
                .rating{
                    font-size: 16px;
                    font-weight: 600;
                    img{
                        margin-left: 3px;
                        width: 12px;
                    }
                }
            }
        }
    }
}