#home_p-grid {
    margin-top: 4rem;
    row-gap: 4rem;
}

@media only screen and (min-width: 768px) {
    #home_p-grid {row-gap: 0;}

    #home_p-grid li:nth-of-type(4n+1) .home_p-project.--vertical {grid-column: 2/7;}
    #home_p-grid li:nth-of-type(4n+2) .home_p-project.--vertical {grid-column: 8/-1;}
    #home_p-grid li:nth-of-type(4n+3) .home_p-project.--vertical {grid-column: 1/6;}
    #home_p-grid li:nth-of-type(4n+4) .home_p-project.--vertical {grid-column: 7/-2;}

    #home_p-grid li:nth-of-type(4n+1) .home_p-project.--horizontal {grid-column: 1/7;}
    #home_p-grid li:nth-of-type(4n+2) .home_p-project.--horizontal {grid-column: 7/-1;}
    #home_p-grid li:nth-of-type(4n+3) .home_p-project.--horizontal {grid-column: 1/7;}
    #home_p-grid li:nth-of-type(4n+4) .home_p-project.--horizontal {grid-column: 7/-1;}

    #home_p-grid li:not(:first-of-type) .home_p-project {margin-top: -4rem;}
}

@media only screen and (min-width: 1096px) {
    #home_p-grid {margin-top: 10rem;}

    #home_p-grid li:nth-of-type(4n+1) .home_p-project.--vertical {grid-column: 3/7;}
    #home_p-grid li:nth-of-type(4n+2) .home_p-project.--vertical {grid-column: 9/-1;}
    #home_p-grid li:nth-of-type(4n+3) .home_p-project.--vertical {grid-column: 1/5;}
    #home_p-grid li:nth-of-type(4n+4) .home_p-project.--vertical {grid-column: 7/-3;}
    
    #home_p-grid li:nth-of-type(4n+1) .home_p-project.--horizontal {grid-column: 2/7;}
    #home_p-grid li:nth-of-type(4n+2) .home_p-project.--horizontal {grid-column: 8/-1;}
    #home_p-grid li:nth-of-type(4n+3) .home_p-project.--horizontal {grid-column: 1/6;}
    #home_p-grid li:nth-of-type(4n+4) .home_p-project.--horizontal {grid-column: 7/-2;}

    #home_p-grid li:not(:first-of-type) .home_p-project {margin-top: -10rem;}
}

@media (hover: hover) {
    .home_p-project > * {transition: 500ms;}
    .home_p-project:hover > * {scale: 1.1;}
}



#home_p-projects {
    margin-top: 4rem;
}
@media only screen and (min-width: 768px) {
    #home_p-projects {margin-top: 6rem;}
}
@media only screen and (min-width: 1096px) {
    #home_p-projects {margin-top: 10rem;}
}

@media (hover: hover) {
    #home_p-projects a:hover {text-decoration: unset !important;}
}