.faq,
.faq h1,
.faq h4,
.faq button,
h5,
h6,
span {
  font-family: 'Cairo', sans-serif;
}
.service-img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 0.5rem;
}
/*** Project ***/
.project-items {
  margin: -0.75rem;
}

.project-item {
  position: relative;
  display: block;
  padding: 0.75rem;
  border-radius: 15px;
}
.project-item img {
  border-radius: 15px;
}
.project-item::after {
  position: absolute;
  content: '';
  width: 100%;
  height: 0;
  top: 0;
  left: 0;
  background: #ffffff;
  transition: 0.5s;
  z-index: -1;
  border-radius: 15px;
}

.project-item:hover::after {
  height: 100%;
  background: var(--primary);
  border-radius: 15px;
}

.project-item .project-text {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 20px !important;
  opacity: 1;
  transition: 0.5s;
}

.project-item:hover .project-text {
  background: rgba(255, 255, 255, 0.7);
  opacity: 1;
  padding-bottom: 20px !important;
}