.directions-cards {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 1.2rem;
}
.directions-card {
    padding: 1.2rem 1.6rem;
    background-color: var(--grey);
    font-size: 1.6rem;
    line-height: 120%;
    border-radius: .5rem;
    align-content: center;
}
.directions-card sup {
    color: var(--primary);
    font-size: 1rem;
    margin-left: .1rem;
}
@media (min-width: 768px) and (max-width: 1280px) {
    .directions-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 767px) {
    .directions-cards {
        grid-template-columns: repeat(1, 1fr);
        gap: .8rem;
    }
    .directions-card {
        min-height: 5.1rem;
    }
}