/* ---------- Category Grid (Categories page) ---------- */
.category-grid {
	display: grid;
	gap: 20px;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	padding: 24px 0 64px;
}

.category-card {
	display: flex;
    background: var(--yc-surface);
    border: 1px solid var(--yc-border);
    border-radius: var(--yc-radius);
    overflow: hidden;
    transition: transform .18s ease, box-shadow .2s ease, border-color .2s;
    flex-direction: column;
    justify-content: center;
	align-items: center;
}

.category-card:hover {
	transform: translateY(-4px);
	border-color: var(--yc-primary);
	box-shadow: var(--yc-shadow-glow);
}

.category-card__media {
    position: relative;
    display: flex;
    justify-content: center;
    margin: 12px;
}

.category-card__img {
    width: 40px;
    height: auto;
    transition: transform .3s ease;
}

.category-card:hover .category-card__img {
	transform: scale(1.06);
}

.category-card__img--placeholder {
	display: grid;
	place-items: center;
	background: linear-gradient(135deg, var(--yc-surface-2), var(--yc-surface));
}

.category-card__img--placeholder span {
	font-family: var(--yc-font-head);
	font-size: 2.6rem;
	font-weight: 800;
	color: var(--yc-primary);
}

.category-card__count {
	position: absolute;
	bottom: 8px;
	right: 8px;
	font-family: var(--yc-font-head);
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: rgba(10,14,26,.65);
	border: 1px solid rgba(255,255,255,.15);
	padding: 4px 10px;
	border-radius: 999px;
}

.category-card__body {
	padding: 10px;
}

.category-card__title {
	font-size: 1.0rem;
	margin: 0 0 6px;
	color: var(--yc-text);
}

.category-card__desc {
	color: var(--yc-muted);
	font-size: 13px;
	line-height: 1.6;
	margin: 0;
}