/* =========================================
SERVICES PAGE
========================================= */

.services-page {
  padding: 120px 0;
}

.services-page-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 30px;
}

.service-page-card {
  background: white;

  padding: 40px 30px;

  border-radius: 30px;

  box-shadow: 0 10px 30px rgba(0,0,0,0.06);

  transition: 0.4s ease;
}

.service-page-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.12);
}

.service-page-icon {
  width: 80px;
  height: 80px;

  border-radius: 22px;

  display: flex;
  justify-content: center;
  align-items: center;

  font-size: 30px;

  margin-bottom: 25px;
}

.service-page-card h3 {
  font-size: 22px;
  margin-bottom: 15px;
}

.service-page-card p {
  color: #666;
  line-height: 1.8;
}

/* COLORS */

.blue {
  background: #e9f1ff;
  color: #276cff;
}

.purple {
  background: #f0e9ff;
  color: #7b4dff;
}

.green {
  background: #e8fff1;
  color: #00b85c;
}

.orange {
  background: #fff3e5;
  color: #ff9800;
}

/* RESPONSIVE */

@media(max-width:1100px){

  .services-page-grid{
    grid-template-columns: repeat(2,1fr);
  }

}

@media(max-width:700px){

  .services-page-grid{
    grid-template-columns: 1fr;
  }

}