.project-filter-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 1.111vw;
    row-gap: 2.222vw;
    margin-top: 5.14vw;
}
.project-filter-container .project-filterCard a {
    display: block;
    text-decoration: none;
    margin-bottom: 1.111vw;
}
.project-filter-container .project-filterCard a img {
    width: 100%;
    height: auto;
}
.project-filter-container .project-filterCard .p-large {
    color: #4d4d4d;
}
.project-filter-container .project-filterCard .filter-tags {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.42vw;
    margin-bottom: 0.833vw;
}
.project-filter-container .project-filterCard .filter-tags .heading8 {
    font-weight: 700;
    white-space: normal;
    word-break: break-word;
    margin-right: auto;
    max-width: calc(100% - 7em); 
}
.project-filter-container .project-filterCard .filter-tags .p-small {
    text-align: center;
    border: 1px solid #F5F5F5;
    border-radius: 8.33vw;
    padding: 0.42vw 0.833vw;
    white-space: nowrap;
}
 
@media screen and (max-width: 1200px) {
    .project-filter-container {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 1.918vw;
    }
    .project-filter-container .project-filterCard .filter-tags {
        gap: 0.72vw;
        margin-bottom: 1.439vw;
    }
    .project-filter-container .project-filterCard .filter-tags .p-small {
        font-size: 1.2vw;
        line-height: 1.439vw;
        padding: 0.6vw 1.439vw
    }
}

@media screen and (max-width: 600px) {
    .project-filter-container {
        grid-template-columns: repeat(1, 1fr);
        column-gap: 0;
        row-gap: 24px;
    }
     .project-filter-container .project-filterCard a  {
        margin-bottom: 16px;
        
    }
    .project-filter-container .project-filterCard .filter-tags {
        column-gap: 1.4vw;
        row-gap: 6px;
        margin-bottom: 12px;
    }
    .project-filter-container .project-filterCard .filter-tags .heading8 {
        font-size: 16px;
        line-height: 24px;
        white-space: normal;
    }
    .project-filter-container .project-filterCard .filter-tags .p-small {
        font-size: 12px;
        line-height: 18px;
        padding: 2px 1.869vw;
    }
}

@media screen and (max-width: 428px) {
    .project-filter-container .project-filterCard .filter-tags .p-small {
        font-size: 2.8vw;
        line-height: 4.21vw;
    }
}