.herosrv{
    width: 100%;
    min-height: 80vh;
    display: flex;
    flex-direction: row-reverse;
    position: relative;
    margin-top: 100px !important;
    align-items: center;
    justify-content: center;
}
.herosrv .text{
    display: flex;
    flex-direction: column;
    gap:15px;
    padding:40px;
    color:#333;
    justify-content: center;
    z-index: 10;
}

.herosrv .text h1{
    font-size:2.5rem;
}
.herosrv .text h2{
    font-size: 1.2rem;
}
.herosrv img{
    width: 100%;
    max-width: 550px;
    height: auto;
    border-radius: 15px;
    margin:20px;
    z-index: 10;
}


.herosrv .bgc{
    position:absolute;
    width:800px;
    height: 800px;
    border-radius: 50%;
    background-color:#ffd3db;
    z-index: -10;
    left: -300px;
    top: -100px;
}


.clients-srv{
    width: 100%;
    height:fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.clients-srv h3{
    color: #d44e67;
}
.clients-srv h1{
    color: #333;
    font-size:3.5rem;
}
.clients-srv  .srv-clients-list{
   width: 100%;
   max-width: 1200px; 
   gap: 15px;
   display: grid; 
   margin-top: 20px;
   grid-template-columns:repeat(3,1fr);
   padding:10px;
}
.clients-srv  .srv-clients-list img{
    width: 100%;
    border-radius:25px;
    transition: .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.clients-srv  .srv-clients-list img:hover{
    transform: scale(1.05);
}

.clients-srv  .srv-clients-list video{
    width: 100%;
    border-radius:25px;
    transition: .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}




.splash-features{
    margin: 60px;
}

.text-centerj{
    text-align: center !important;
}
.bigtext{
    font-size:3.5rem;
}


.smalltext{
    font-size: 1.2rem !important;
}


.subtitle{
    color: #d44e67;
}
.title>h2{
    color: #333;
}
.services-grid{
    padding:20px 20px;
    border: 1px solid #3333 ;
    border-radius: 10px;
    margin: 8px 0;
}
.services-grid:hover{
    background:linear-gradient(to top , rgba(160, 174, 185, 0.192), #eee0);
}











.letsstart {
    padding: 1.5rem 3rem;
    font-size: 1.3rem;
    background: var(--primary);
    border: none;
    color: #fff;
    border-radius: 25px;
    cursor: pointer;
    transition: .3s;
    text-decoration: none;
    width: fit-content;
}

.letsstart:hover {
    background: var(--secondary);
    color: #fff;
}






.clients-srv-web{
    width: 100%;
    height:fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #444;
    padding: 50px;
    margin: 50px 0;
}
.clients-srv-web h3{
    color: #9e9e9e;
    font-size: 1rem;
}
.clients-srv-web h1{
    color: #eee;
    font-size:3.5rem;
}
.clients-srv-web  .srv-clients-list{
   width: 100%;
   max-width: 1200px; 
   gap: 15px;
   display: grid; 
   margin-top: 20px;
   grid-template-columns:repeat(3,1fr);
}
.clients-srv-web  .srv-clients-list img{
    width: 100%;
    border-radius:25px;
    transition: .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.clients-srv-web  .srv-clients-list img:hover{
    transform: scale(1.05);
}



.section{
    margin:40px 0;
}


.social-service-list{
    display: grid;
   grid-template-columns:repeat(5,1fr); 
   width: 100%;
   max-width:1000px;
   margin: 0 auto;
   gap:25px;
   padding:20px;
   align-items: center;
}

.social-service-list div{
    width:100% ;
    height:200px;
    background:red;
    border-radius: 15px;
    padding:10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 30px;
    color: #fff;
}
.social-service-list div i {
    font-size:2.5rem;
}
.social-service-list div:nth-child(5){
    background:#4267B2;
}

.social-service-list div:nth-child(4){
    background:#4267B2;
}

.social-service-list div:nth-child(3){
    background:#FFFC00;
    color:#333;
}


.social-service-list div:nth-child(2){
    background:#4285F4;
}

.social-service-list div:nth-child(1){
    background:#ff0050;
}

















@media screen and (max-width: 992px) {
.clients-srv-web  .srv-clients-list{
    grid-template-columns:repeat(2,1fr);
}

.herosrv{
    flex-direction: column;
}

.case-study-featured-thumb img{
    width: 100%;
}
.social-service-list{
   grid-template-columns:repeat(3,1fr); 
}

.herosrv .bgc{
    width:0px;
    height: 0px;
}


.clients-srv .srv-clients-list {
   grid-template-columns:repeat(2,1fr); 
}


}

@media screen and (max-width: 600px) {
.clients-srv-web  .srv-clients-list{
    grid-template-columns:repeat(1,1fr);
}
.case-study-featured-thumb img{
    width: 100%;
}

.herosrv .bgc{
    width:0px;
    height: 0px;
}
.herosrv{
    flex-direction: column;
}
.social-service-list{
   grid-template-columns:repeat(2,1fr); 
}


.clients-srv .srv-clients-list {
   grid-template-columns:repeat(1,1fr); 
}



}

.thumbnail{
    display: flex;
    align-items: center;
    justify-content: center;
}


.banner-content{
    display: flex;
    flex-direction: column;
    gap: 5px;
}



.services-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}