/* =====================
 Why SkyMaBiz
===================== */


.why-skymabiz-section{


padding:

100px 0;


background:

var(--bg-main);


}




.why-grid{


display:grid;


grid-template-columns:

repeat(4,1fr);


gap:25px;


}




.why-card{


padding:

35px 25px;


background:

var(--bg-card);


border:

1px solid

var(--border-color);


border-radius:

var(--radius-large);


text-align:center;


transition:

var(--transition);


}




.why-card:hover{


transform:

translateY(-10px);


box-shadow:

var(--shadow-blue);


border-color:

var(--sky-secondary);


}





.why-icon{


width:75px;


height:75px;


margin:

0 auto 25px;


display:flex;


align-items:center;


justify-content:center;


border-radius:50%;


background:

rgba(0,183,255,.12);


color:

var(--sky-secondary);


font-size:30px;


}




.why-card h3{


font-size:

22px;


margin-bottom:15px;


}



.why-card p{


font-size:

15px;


}
4) Responsive
به انتهای فایل اضافه شود:
@media(max-width:1100px){


.why-grid{


grid-template-columns:

repeat(2,1fr);


}


}



@media(max-width:600px){


.why-grid{


grid-template-columns:

1fr;


}



}