
.taxonomy-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.25rem; }
.taxonomy-card { position: relative; height: 150px; border-radius: var(--radius); overflow: hidden; background: var(--bg-elevated); background-size: cover; background-position: center; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease, filter 0.3s ease; border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25); }
.taxonomy-card:hover { transform: translateY(-5px) scale(1.02); box-shadow: 0 12px 35px rgba(0, 0, 0, 0.45); filter: brightness(1.08); border-color: rgba(255, 255, 255, 0.3); }

.taxonomy-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.2) 100%); display: flex; flex-direction: column; justify-content: flex-end; padding: 1.25rem; }
.taxonomy-overlay.vibrant-overlay { background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.15) 100%); }

.taxonomy-name { font-family: var(--font-heading); font-size: 1.25rem; font-weight: 800; color: #ffffff; text-shadow: 0 2px 10px rgba(0,0,0,0.5); letter-spacing: -0.01em; }
.taxonomy-count { font-size: 0.85rem; font-weight: 600; color: rgba(255, 255, 255, 0.88); margin-top: 0.2rem; text-shadow: 0 1px 4px rgba(0,0,0,0.4); }

.search-taxonomy-results { display: flex; flex-wrap: wrap; gap: 0.5rem; }

@media (max-width: 480px) {
    .taxonomy-grid { grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
    .taxonomy-card { height: 110px; }
    .taxonomy-overlay { padding: 0.75rem; }
    .taxonomy-name { font-size: 0.95rem; }
    .taxonomy-count { font-size: 0.75rem; }
}
