@media (width >= 1280px) and (width <= 1440px) {
  .work-section .grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (width >= 768px) and (width <= 1024px) {
  .work-section .grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
  }

    div.project-title-fixed{
    font-size: 14px;
  }

  div.pf-menu{
    width: 690px;
  }
}

@media (width < 768px) {

    section.work-section {
        padding: 100px 40px;
    }

  .work-section .grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 50px;
    column-gap: 25px;
  }

  .work-section .work-card {
    height: 250px;
  }

  .work-section .work-card .project-label {
    font-size: 11px;
  }

 .projects-filters-sticky .pf-menu button{
    padding: 8px 10px;
    font-size: 12px;
  }

  div.project-title-fixed{
    font-size: 8px;
  }

  div.pf-menu{
    width: 300px;
    padding: 30px 30px 70px;
  }

  .pf-trigger.has-selection{
        overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100px;
  }
}

@media (width <= 360px) {
  .work-section .work-card div.project-label {
    font-size: 9px;
  }
}