/* =========================
   TITLE
========================= */
.projects-title{
  margin-bottom:50px;
}

.projects-title span{
  display:inline-block;
  padding:10px 22px;

  background:rgba(38,52,137,0.08);
  color:var(--primary-blue);

  border-radius:50px;

  font-size:13px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;

  margin-bottom:18px;
}

.projects-title h2{
  font-size:46px;
  font-weight:800;
  color:var(--primary-blue);
}

/* =========================
   CARD
========================= */
.project-card{
  background:#fff;

  padding:40px;
  border-radius:24px;

  margin-bottom:35px;

  box-shadow:
  0 12px 35px rgba(0,0,0,0.08);

  transition:0.4s ease;
}

.project-card:hover{
  transform:translateY(-6px);
}

/* =========================
   HEADER
========================= */
.project-header h3{
  color:var(--accent-red);
  font-size:18px;
  font-weight:700;
  margin-bottom:12px;
}

.project-header h4{
  color:var(--primary-blue);

  font-size:30px;
  line-height:1.5;
  font-weight:700;

  margin-bottom:30px;
}

/* =========================
   META SECTION
========================= */
.project-meta{
  display:flex;
  gap:25px;
  flex-wrap:wrap;

  margin-bottom:30px;
}

.meta-box{
  flex:1;
  min-width:280px;

  background:var(--bg-light);

  padding:24px;
  border-radius:18px;
}

.meta-box label{
  display:block;

  color:var(--accent-red);

  font-size:14px;
  font-weight:700;

  margin-bottom:10px;

  text-transform:uppercase;
}

.meta-box p{
  color:var(--text-black);
  line-height:1.8;
  margin:0;
}

/* =========================
   CONTENT
========================= */
.project-content h5{
  color:var(--primary-blue);

  font-size:24px;
  font-weight:700;

  margin-bottom:20px;
}

.project-content p{
  color:var(--text-black);

  font-size:16px;
  line-height:2;

  text-align:justify;
}

/* =========================
   RESPONSIVE
========================= */
@media(max-width:991px){

  .projects-title h2{
    font-size:34px;
  }

  .project-header h4{
    font-size:24px;
  }

  .project-card{
    padding:25px;
  }

}

@media(max-width:576px){

  .projects-modern{
    padding:60px 0;
  }

  .projects-title h2{
    font-size:28px;
  }

  .project-header h4{
    font-size:20px;
  }

  .project-content p{
    font-size:15px;
    line-height:1.9;
  }

}