.categories__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.category-tile {
	position: relative; display: flex; align-items: flex-end; aspect-ratio: 4 / 3; padding: 18px; overflow: hidden; color: #fff;
	border-radius: var(--r-lg); background: var(--accent); box-shadow: var(--shadow-sm);
	transition: transform var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.category-tile--g1 { background: #1b1b2e; } .category-tile--g2 { background: #3b2a5c; } .category-tile--g3 { background: #0f2a44; }
.category-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.category-tile::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,8,30,.55), transparent 60%); }
.category-tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.category-tile:hover img { transform: scale(1.06); }
.category-tile:active { transform: scale(.98); }
.category-tile__name { position: relative; z-index: 1; font-size: 18px; font-weight: 700; letter-spacing: -.02em; }
.category-tile__count { position: absolute; z-index: 1; top: 14px; right: 14px; min-width: 28px; height: 28px; padding: 0 9px; display: grid; place-items: center; font-size: 12px; font-weight: 600; background: rgba(255,255,255,.9); color: var(--ink); border-radius: var(--r-pill); }
@media (min-width: 768px) { .categories__grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }