.tech-24 {
    padding: 100px 0 80px;
}
.tech-24-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px;
}
.tech-24 .title {
    font: 700 44px / 51px "Manrope";
    width: 520px;
}
.tech-24 .subtitle {
    font: 500 17px / 24px "Manrope";
    margin: 20px 0 40px;
}
.tech-24-btn {
    padding: 20px 25px;
    border-radius: 13px;
}
.tech-24-left {
    width: 50%;
}
.tech-24-right {
    width: 50%;
}
.tech-24-item {
    width: 336px;
    border-radius: 18px;
    position: relative;
}
.tech-24-item.tech-grey {
    background: #F6F6F8;
    height: 285px;
    box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.05);
}
.tech-24-item.tech-red {
    height: 220px;
    background: #F04259;
    background: -webkit-linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    background: linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#F04259", endColorstr="#AD3646", GradientType=0);
    box-shadow: inset 0 0 1px 1px rgba(173, 54, 70, 0.4);
}
.tech-24-right-flex {
    display: flex;
    gap: 25px;
}
.tech-24-right-l {
    display: flex;
    flex-direction: column;
    gap: 25px;
}
.tech-24-right-r {
    display: flex;
    flex-direction: column;
    gap: 25px;
}
.tech-24-left-txt-1 {
    font: 500 16px / 23px "Manrope";
    margin: 10px 30px;
    color: #292424;
}
.tech-24-left-txt-2 {
    font: 500 46px / 50px "Manrope";
    padding: 8px 10px;
    border-radius: 20px;
    color: #fff;
    margin: 0 30px;
    display: flex;
    align-content: center;
    justify-content: center;
    background: #F04259;
    background: -webkit-linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    background: linear-gradient(180deg, rgba(240, 66, 89, 1) 0%, rgba(240, 66, 89, 1) 50%, rgba(211,66,86, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#F04259", endColorstr="#AD3646", GradientType=0);
}
.tech-img-1 {
    text-align: center;
}
.tech-img-1 img {
    border-radius: 30px;
    width: 99%;
    margin: 2px auto;
}
.tech-24-item.tech-red {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 30px;
    color: #fff;
}
.tech-24-left-txt-3,
.tech-24-right-txt-1 {
    font: 300 20px / 26px "Manrope";
}
.tech-24-left-txt-4,
.tech-24-right-txt-2 {
    font: 500 48px / 55px "Manrope";
}
.tech-24-right-r .tech-grey {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px 0;
}
.tech-img-2 {
    text-align: center;
}
.tech-24-right-txt-3 {
    font: 400 16px / 22px "Manrope";
    color: #292424;
}
.tech-24-right-txt-4 {
    font: 600 22px / 27px "Manrope";
    margin-top: 10px;
    color: #292424;
}
.tech-img-2 + div {
    padding: 0 25px 15px 25px;
}

.images-bg-tech .tech-24-left-txt-2 {
    display: none;
}
.images-bg-tech .tech-24-right-l .tech-24-item.tech-grey {
    background: url(/wp-content/themes/unitalk/blocks/service-blocks/tech-24/tech1.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 440px;
    background-color: #f6f6f8;
}
.images-bg-tech .tech-24-right-r .tech-24-item.tech-grey {
    background: url(/wp-content/themes/unitalk/blocks/service-blocks/tech-24/tech2.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 440px;
    background-color: #f6f6f8;
}



@media (max-width: 1450px) {
    main .tech-24 .container:first-child {
        max-width: 1100px !important;
    }
    .tech-24-left .title {
        font: 700 34px / 38px "Manrope";
        width: 400px;
    }
    .tech-24-item {
        width: 247px;
    }
    .tech-24-left-txt-1 {
        font: 500 14px / 20px "Manrope";
        margin: 30px 15px 10px;
    }
    .tech-24-left-txt-2 {
        font: 500 30px / 40px "Manrope";
        padding: 8px 10px 11px;
        margin: 0 15px;
    }
    .tech-24-right-l .tech-24-item.tech-grey {
        height: 255px;
    }
    .tech-24-left-txt-3, .tech-24-right-txt-1 {
        font: 300 15px / 21px "Manrope";
    }
    .tech-24-left-txt-4, .tech-24-right-txt-2 {
        font: 500 33px / 40px "Manrope";
    }
    .tech-img-2 img {
        max-width: 210px;
    }
    .tech-24-right-txt-3 {
        font: 400 14px / 20px "Manrope";
    }
    .tech-24-right-txt-4 {
        font: 700 16px / 27px "Manrope";
    }
    .tech-img-2 + div {
        padding: 0 20px 15px 20px;
    }
}
@media (max-width: 1200px) {
    main .tech-24 .container:first-child {
        max-width: 990px !important;
    }
    .tech-24 .title {
        font: 700 30px / 36px "Manrope";
        width: 350px;
    }
    .tech-24 .subtitle br {
        display: none;
    }
    .tech-24-left {
        width: 40%;
    }
    .tech-24-right {
        width: 60%;
    }
    .tech-24-right-l .tech-24-item.tech-grey {
        height: 285px;
    }
}
@media (max-width: 991px) {
    .tech-24 {
        padding: 60px 0;
    }
    main .tech-24 .container:first-child {
        max-width: 100% !important;
    }
    .tech-24-box {
        flex-direction: column;
    }
    .tech-24-left {
        width: 100%;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 20px;
    }
    .tech-24-right {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .tech-24 .title {
        width: 100%;
    }
}
@media (max-width: 600px) {
    .tech-24 {
        padding: 40px 0;
    }
    .tech-24-right-flex {
        flex-direction: column;
    }
    .tech-24-item.tech-red,
    .tech-24-item.tech-grey {
        height: 220px;
    }
}