.hc-grid {
    display: grid;
    gap: 20px;
    justify-content:start;
}

.hc-grid--cards {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.hc-grid--narrow {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 16px;
}

.hc-grid--wide {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.hc-grid--fixed {
    grid-template-columns: repeat(auto-fill, minmax(260px, 260px));
}

.hc-grid--equal{
    grid-template-columns:repeat(4,minmax(0,1fr));
}