/* ==========================================
   Grid System
========================================== */

.grid {
    display: grid;
    gap: 2rem;
}

.grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    align-items: center;
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem;
}

.grid-center {
    align-items: center;
}

.grid-start {
    align-items: flex-start;
}

.grid-end {
    align-items: flex-end;
}

@media (max-width: 991px) {

    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr;
    }

}