.customers-reviews {
    color: var(--esas-reng2, #37383D);
    font-family: Urbanist;
    font-size: 2.22vw;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tabs {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.39vw;
    margin-top: 1.39vw;
    margin-bottom: 1.39vw;
}

.tab {
    background: var(--1, #EFEFEF);
    border-radius: 4.44vw;
    border: 2px solid var(--esas-reng1, #DF6545);
    width: 7.29vw;
    height: 2.48vw;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #37383D;
    font-family: Urbanist;
    font-size: 0.97vw;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.tab.active {
    border-radius: 4.44vw;
    border: 2px solid var(--esas-reng1, #DF6545);
    background: var(--esas-reng1, #DF6545);
    color: #FFF;
    font-family: Urbanist;
    font-size: 0.97vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.card-body {
    flex-shrink: 0;
    border-radius: 1.94vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card {
    margin-bottom: 3.47vw;
}

.card-body svg {
    width: 3.8vw;
    height: 3.8vw;
    flex-shrink: 0;
}

.customers {
    background-color: #FEFEFE;
    border-radius: 4.17vw;
    padding: 3.47vw 6.25vw;
    margin-bottom: 3.47vw;
}

.card-title {
    color: var(--esas-reng-4, #0F1014);
    font-family: Urbanist;
    font-size: 1.39vw;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.reviews,
.contact {
    display: none;
}

@media (max-width:768px) {
    .recs {
        position: relative;
        height: 275px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .rec1,
    .rec2,
    .rec3 {
        position: absolute;
        border-radius: 35px;
        box-shadow: 0px -10px 20px rgba(0, 0, 0, 0.1);
        transform-origin: bottom center;
        transition: all 0.3s ease;
    }

    .rec1 {
        top: 0;
        width: 80%;
        height: 275px;
        background: #DDDBDB;
        z-index: 1;
        transform: scale(1);
    }

    .rec2 {
        top: 10px;
        width: 90%;
        height: 260px;
        background: #EDEDED;
        z-index: 2;
        transform: scale(0.96);
    }

    .rec3 {
        top: 20px;
        width: 100%;
        background: #FFFFFF;
        z-index: 3;
        transform: scale(0.92);
        padding: 20px;
    }

    .rec-image {
        width: 79px;
        height: 75px;
        flex-shrink: 0;
        border-radius: 79px;
        background: url(../images/others/profile.png) lightgray 50% / cover no-repeat;
    }

    .rec-text h4 {
        color: var(--esas-reng-4, #0F1014);
        font-family: Urbanist;
        font-size: 24px;
        font-style: italic;
        font-weight: 600;
        line-height: normal;
    }

    .rec3 p {
        color: var(--esas-reng-4, #0F1014);
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .rec-text p {
        color: var(--esas-reng-4, #0F1014);
        font-family: Urbanist;
        font-size: 16px;
        font-style: italic;
        font-weight: 300;
        line-height: normal;
    }

    .row.rec-image-row {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        margin-bottom: 20px;
    }

    .reviews {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .contact {
        display: flex;
    }

    section.reviews>.row:last-child {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    section.contact {
        background-color: #FEFEFE;
        border-radius: 60px;
    }

    .contact h1.contact-title {
        color: #0F1014;
        font-family: Urbanist Arial, Helvetica, sans-serif;
        font-size: 36px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-bottom: 20px;
    }

    .contact-text-1 {
        color: #0F1014;
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        margin-bottom: 50px;
    }

    .contact-phone {
        color: #0F1014;
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        margin-bottom: 5px;
        display: inline-block;
    }

    .contact-text-2 {
        color: #0F1014;
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        margin-bottom: 5px;
    }

    .contact-mail {
        color: #0F1014;
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }

    .contact-info {
        height: 330px;
        flex-shrink: 0;
        border-radius: 26px;
        background: #F8F8F8;
        padding-left: 26px;
        padding-top: 44px;
    }

    .form-control {
        width: 100%;
        height: 45px;
        flex-shrink: 0;
        color: #BABABA;
        font-family: Urbanist;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
        border-radius: 10px;
        border-radius: 10px;
        border: 1px solid #BABABA;
        padding: 10px;
    }

    .form-control:focus,
    .form-textarea:focus {
        border: 1px solid #4194FF;
        outline: none;
        box-shadow: 0px 0px 10px rgba(65, 148, 255, 0.2);
    }

    .form-textarea {
        width: 100%;
        height: 166px;
        flex-shrink: 0;
        border-radius: 10px;
        border: 1px solid #BABABA;
        padding: 10px;
    }

    .option-row {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        background: var(--1, #EFEFEF);
        width: 200px;
        height: 60px;
        flex-shrink: 0;
        border-radius: 10px;
        border: 1px solid #BABABA;
        margin-bottom: 10px;
        padding-left: 10px;
    }

    .option-text h4 {
        color: #37383D;
        font-family: Urbanist;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }

    .option-text p {
        color: #BABABA;
        font-family: Urbanist;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }

    .selected-option svg {
        width: 21px;
        height: 21px;
        flex-shrink: 0;
        fill: var(--esas-reng1, #DF6545);
        stroke-width: 1px;
        stroke: var(--esas-reng1, #DF6545);
        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    }

    .unselected-option svg {
        width: 21px;
        height: 21px;
        flex-shrink: 0;
        stroke-width: 1px;
        stroke: #BABABA;
        filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    }

    .btn {
        width: 200px;
        height: 50px;
        flex-shrink: 0;
        border-radius: 50px;
        background: var(--esas-reng1, #DF6545);
        color: #FFF;
        font-family: Urbanist Arial, Helvetica, sans-serif;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        outline: none;
        border: none;
        cursor: pointer;
    }

    .contact>.row {
        flex-direction: column;
    }

    section.contact {
        background-color: #f8f8f8 !important;
        margin-top: 50px;
    }

    .row.align-items-start {
        flex-direction: column;
    }

    .reviews .nav-row {
        margin-top: 110px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .option-row,
    .btn {
        width: inherit;
    }

    .option-row {
        border: none;
        background: inherit;
    }

    .col-md-7.col-sm-12 {
        padding: 20px;
    }

    .customers {
        padding: 50px 20px;
    }

    h1.customers-reviews {
        color: var(--esas-reng2, #37383D);
        font-family: Urbanist Arial, Helvetica, sans-serif;
        font-size: 40px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }

    .customers {
        padding: 28px 30px;
    }

    .customers .row:nth-child(2) {
        display: none;
    }

    .card-body {
        height: 200px;
        flex-shrink: 0;
    }

    .card-body:first-child {
        margin-top: 56px;
    }

    .card-title {
        color: var(--esas-reng-4, #0F1014);
        font-family: Urbanist;
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin-top: 10px;
    }
}