.mis-section{
  padding:70px 20px;
  background:#f7f7f7;
  font-family:'Poppins', Arial, sans-serif;
}

.mis-section *{
  box-sizing:border-box;
}

.mis-container{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:28px;
}

.mis-card{
  background:#fff;
  padding:38px;
  border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  position:relative;
  overflow:hidden;
  transition:.4s ease;
}

.mis-card::before{
  content:"";
  position:absolute;
  inset:0;
  width:0;
  background:linear-gradient(135deg,#f75151,#f75151);
  transition:.45s ease;
  z-index:0;
}

.mis-card:hover::before{
  width:100%;
}

.mis-card>*{
  position:relative;
  z-index:2;
}

.mis-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:24px;
}

.mis-icon{
  font-size:38px;
  line-height:1;
  flex-shrink:0;
  transition:.35s ease;
}

.mis-card:nth-child(1) .mis-icon{color:#ff6600;}
.mis-card:nth-child(2) .mis-icon{color:#ff1493;}
.mis-card:nth-child(3) .mis-icon{color:#00b7ff;}
.mis-card:nth-child(4) .mis-icon{color:#00c853;}

.mis-head h3{
  margin:0;
  font-size:32px;
  font-weight:500;
  color:#f75151;
  line-height:1.1;
  transition:.35s ease;
}

.mis-content{
  margin:0;
  padding:0;
}

.mis-content p{
  margin:0 0 13px;
  color:#666;
  font-size:17px;
  line-height:1.7;
  transition:.35s ease;
}

.mis-content p:last-child{
  margin-bottom:0;
}

.mis-card:hover{
  transform:translateY(-8px);
  box-shadow:0 20px 45px rgba(247,81,81,.25);
}

.mis-card:hover .mis-icon,
.mis-card:hover h3,
.mis-card:hover p{
  color:#fff;
}

@media(max-width:991px){
  .mis-container{
    grid-template-columns:1fr;
  }
}

@media(max-width:600px){
  .mis-section{
    padding:45px 15px;
  }

  .mis-card{
    padding:28px;
  }

  .mis-head{
    gap:10px;
    margin-bottom:18px;
  }

  .mis-icon{
    font-size:30px;
  }

  .mis-head h3{
    font-size:25px;
  }

  .mis-content p{
    font-size:15px;
    line-height:1.7;
  }
}