/* 4 per row */
.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}
/* square image box */
.portfolio-grid div {
    width: 100%;
    padding-top: 100%;    /* forces 1:1 box */
    position: relative;
    overflow: hidden;
    border-radius: 20px;
}
/* image styling */
.portfolio-grid img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 991.98px) {
    .portfolio-grid { grid-template-columns: repeat(3,1fr);}
}
@media (max-width: 767.98px) {
    .portfolio-grid { grid-template-columns: repeat(2,1fr);}
}

h1 {
    font-size: 40px;
    line-height: 1.2;
}

h3 {
    font-size: 30px;
    line-height: 54px;
}