.services .box-container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(27rem, 1fr));
    gap:2rem;
}

.services .box-container .box{
    border:var(--border);
    box-shadow: var(--box-shadow);
    border-radius: .5rem;
    padding:2.5rem;
    background: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
    z-index: 0;
}

.services .box-container .box img{
    height: 30rem;
    width: 30rem;
    border-radius: 5%;
    object-fit: cover;
    border:.5rem solid #fff;
}

.services .box-container .box h3{
    color:#fff;
    font-size: 2.2rem;
    padding:.5rem 0;
}



.services .box-container .box .text{
    color:var(--light-color);
    line-height: 1.8;
    font-size: 1.6rem;
    padding-top: 4rem;
}

.services .box-container .box::before{
    content: '';
    position: absolute;
    top:-4rem; left: 50%;
    transform:translateX(-50%);
    background:var(--green);
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    height: 25rem;
    width: 120%;
    z-index: -1;
}
.services .box-container .box h3{
    color:var(--black);
    font-size: 2.5rem;
}

.services .box-container .box p{
    text-align:left !important;
    color: var(--light-color) !important;
    font-size: 1.8rem !important;
    line-height: 1.7 !important;
}

.services .box-container .box ul li{
    text-align:left !important;
    font-size: 1.6rem !important;
    line-height: 1.5 !important;
    
}