.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));grid-gap:var(--hafo-space-3);gap:var(--hafo-space-3)}.card{align-items:center;background:var(--hafo-color-bg-secondary);border:.5px solid var(--hafo-color-border-default);border-radius:var(--hafo-radius-lg);cursor:pointer;display:flex;flex-direction:column;padding:var(--hafo-space-2) var(--hafo-space-3) var(--hafo-space-3);text-align:center;transition:transform var(--hafo-transition-fast),box-shadow var(--hafo-transition-fast)}.card--active,.card:focus-within,.card:hover{transform:translateY(-4px)}.card__image{align-items:center;display:flex;height:160px;justify-content:center;margin-bottom:var(--hafo-space-2);width:160px}.card__image img{height:100%;-o-object-fit:contain;object-fit:contain;width:100%}.card__label{color:var(--hafo-color-primary-900);font-size:var(--hafo-font-size-base);letter-spacing:.01em;line-height:var(--hafo-space-4);margin:0}.card__count{color:var(--hafo-color-text-secondary);font-size:13px;font-weight:var(--hafo-font-weight-normal);line-height:20px;margin:var(--hafo-space-half) 0 0 0}@media (max-width:991px){.cards{grid-template-columns:repeat(2,1fr)}}@media (max-width:767px){.card{padding:0}.card__image{border-radius:var(--hafo-radius-lg) var(--hafo-radius-lg) 0 0;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.card__image img{border-radius:var(--hafo-radius-lg) var(--hafo-radius-lg) 0 0!important}p.card__label{padding:var(--hafo-space-2)}}
