.services-sec{
text-align:center;
padding:60px 20px;
}

.services-sec h2 span{
color:var(--blue);
}

.services-cards{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:20px;
margin:40px;
}

.service-card{
border:2px solid var(--primaryColor);
border-radius:15px;
padding:25px 15px;
transition:.4s;
cursor:pointer;
}

.service-card img{
width:120px;
height:120px;
border-radius:50%;
box-shadow:0 0 12px rgba(30,136,229,0.7);
transition:.6s;
margin-bottom:15px;
}


.service-card:hover img{
transform: rotateY(360deg);

}

.service-card h4{
color:#1e88e5;
font-weight:600;
transition:.4s;
}

.service-card:hover h4{
transform:translateY(-10px);
}
/* ********* */
.services-cards-big{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin:40px;
}
.sec-blue h2{
color:var(--blue);
}

.service-card-big{
border:2px solid black;
border-radius:15px;
padding:25px 15px;
transition:.4s;
cursor:pointer;
}

.service-card-big{
  text-align:center;
}

.service-card-big i{
  width:100px;
  height:100px;
  border-radius:50%;
  box-shadow:0 0 12px rgba(0,0,0,0.2);
  margin:0 auto 15px;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:40px; 
  color:var(--primaryColor);
  transition:.6s;
}

.service-card-big:hover i{
  transform:rotateY(360deg) translateY(-10px);
  color:#1e88e5;
}

.service-card-big h4{
color:var(--primaryColor);
font-weight:600;
transition:.4s;
}


.service-card-big:hover h4{
transform:translateY(-10px);
}

.service-card-big ul {
  list-style-type: disc !important;
  list-style-position: outside;
  padding-right: 22px;
  margin-bottom: 25px;
   color: var(--primaryColor);
}

.service-card-big ul li {
  display: list-item !important;
  list-style-type: disc !important;
  margin-bottom: 10px;
  line-height: 1.6;
}



@media (max-width:992px){

.services-cards{
grid-template-columns:repeat(2,1fr);
}

}

/* Mobile */

@media (max-width:600px){

.services-cards{
grid-template-columns:1fr;
}

}
@media (max-width:992px){

.services-cards{
grid-template-columns:repeat(1fr);
}

}

/* Mobile */

@media (max-width:600px){

.services-cards-big{
grid-template-columns:1fr;
}

}
/* popup */

.service-popup{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}

.service-popup.active{
display:flex;
}

.popup-overlay{
position:absolute;
inset:0;
background:rgba(0,0,0,0.45);
}

.popup-box{
position:relative;
background:#fff;
padding:40px 30px;
border-radius:12px;
max-width:500px;
width:90%;
text-align:center;
z-index:2;
animation:popupFade .3s ease;
}

@keyframes popupFade{
from{
opacity:0;
transform:translateY(20px);
}
to{
opacity:1;
transform:translateY(0);
}
}

.popup-box h4{
color:#1e88e5;
margin-bottom:15px;
}

.popup-box p{

line-height:1.7;
margin-bottom:25px;
}

.popup-close{
position:absolute;
top:10px;
left:10px;
background:none;
border:none;
font-size:22px;
cursor:pointer;
}

.btn-serve{
display:inline-block;
background:#1e88e5;
color:#fff;
padding:10px 25px;
border-radius:6px;
text-decoration:none;
transition:.3s;
}

.btn-serve:hover{
background:#1565c0;
}
/*  */

.service-popup-big{
position:fixed;
inset:0;
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}

.service-popup-big.active{
display:flex;
}

.popup-overlay-big{
position:absolute;
inset:0;
background:rgba(0,0,0,0.45);
}

.popup-box-big{
position:relative;
background:#fff;
padding:40px 30px;
border-radius:12px;
max-width:500px;
width:90%;
text-align:center;
z-index:2;
animation:popupFade .3s ease;
}

@keyframes popupFade{
from{
opacity:0;
transform:translateY(20px);
}
to{
opacity:1;
transform:translateY(0);
}
}

.popup-box-big h4{
color:#1e88e5;
margin-bottom:15px;
}

.popup-box-big p{

line-height:1.7;
margin-bottom:25px;
}

.popup-close-big{
position:absolute;
top:10px;
left:10px;
background:none;
border:none;
font-size:22px;
cursor:pointer;
}


/*  */
