.single-serv{
    position: relative;
    background-color: #FDFDFD;
    overflow: hidden;
    background: url(../../assets/img/singleservbg.svg) no-repeat top center;
    padding: 6.66rem 0 8.46rem;
}

.single-serv::before{
    content: '';
    position: absolute;
    z-index: -1;
    inset: auto 0 0 auto;
    width: clamp(10px,100%,252px);
    aspect-ratio: 1/1.36309;
    background-size: cover !important;
    mask-image: linear-gradient(to bottom,#fff,transparent);
    -webkit-mask-image: linear-gradient(to bottom,#fff,transparent);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-position: top center;
    -webkit-mask-position: top center;
    opacity: 50%;
    -webkit-opacity: 50%;
}

.single-serv .maintitle{
    position: relative;
    width: clamp(10px,100%,511px);
    text-transform: uppercase;
    text-align: center;
    color: var(--blue);
    font-family: var(--ibm);
    font-size: 38px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 auto 2.73rem;
}

.single-serv .maintitle::before{
    width: 148.33659%;
    position: absolute;
    inset: -20% auto auto -24%;
    text-transform: uppercase;
    text-align: center;
    -webkit-text-stroke: 1px #0000000a;
    color: transparent;
    font-family: var(--ibm);
    font-size: 60px;
    font-weight: 700;
    line-height: 60px;
}

.single-serv .text{
    width: clamp(10px,100%,780px);
    text-align: center;
    margin: 0 auto 6.4rem;
}

.single-serv .title{
    position: relative;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    width: clamp(10px,100%,378px);
    color: #FCFCFC;
    font-family: var(--rob);
    font-size: 28px;
    font-weight: 700;
    line-height: 40px;
    letter-spacing: 0.07px;
    margin-bottom: 2.26rem;
}

.single-serv .title .tile{
    position: absolute;
    z-index: -1;
    inset: auto auto auto -60px;
    width: calc(100% + 60px);
    height: 100%;
    background: var(--blue);
    clip-path: polygon(27px 0, 100% 0,100% 100%,32px 100%,32px calc(100% + 46px),0 calc(100% + 46px),0 100%);
    -webkit-clip-path: polygon(27px 0, 100% 0,100% 100%,32px 100%,32px calc(100% + 46px),0 calc(100% + 46px),0 100%);
}

.single-serv .title .tile::before{
    content: '';
    position: absolute;
    inset: 98% auto auto -2px;
    width: 32px;
    aspect-ratio: 1/1.4375;
    border-radius: 5px 0 0 0 / 105px;
    background: linear-gradient(to bottom,var(--blue),#0D3A5A);
    clip-path: polygon(0 0,100% 0,100% 100%,14px 25px);
    -webkit-clip-path: polygon(0 0,100% 0,100% 100%,14px 25px);
}

.single-serv .title::after{
    position: absolute;
    inset: auto auto auto -1%;
    text-transform: uppercase;
    white-space: nowrap;
    color: transparent;
    -webkit-text-stroke: 1px #ffffff1a;
    font-family: var(--rob);
    font-size: 35px;
    font-weight: 900;
    line-height: 41px;
    letter-spacing: 0.088px;
}

.single-serv .row{
    grid-gap: 40px 0;
}

.single-serv .row>*{
    display: flex;
    display: -webkit-flex;
    align-items: stretch;
    padding: 0 10px;
}

.single-serv .box{
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -ms-flex-direction: column;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    grid-gap: 1rem;
    width: 100%;
    border: 1px solid var(--line);
    background-color: #FFFFFF59;
    padding: 18px;
}

.single-serv .box img{
    width: 65px;
    height: 70px;
    object-fit: contain;
    -o-object-fit: contain;
}

.single-serv .box .tit{
    width: clamp(10px,100%,352px);
    text-align: center;
    color: var(--blue);
    font-family: var(--ibm);
    font-size: 20px;
    font-weight: 500;
    line-height: 26px;
}

@media(max-width:992px){
    .single-serv{
        padding: 2rem 0;
    }
    .single-serv .row{
        grid-gap: 10px 0;
    }
    .single-serv .title{
        background-color: var(--blue);
        padding: 1rem;
    }
    .single-serv .title::before{
        display: none;
        display: -webkit-none;
    }
}

@media(max-width:768px){
    .single-serv .box{
        background-color: var(--white);
    }
}