.qmt-card,
.qmt-article-card,
.qmt-category-card,
.qmt-tool-card {
	background: var(--qmt-color-surface);
	border: 1px solid var(--qmt-color-border);
	border-radius: var(--qmt-radius-lg);
	box-shadow: var(--qmt-shadow-sm);
	padding: var(--qmt-space-5);
	transition: border-color var(--qmt-transition-fast), box-shadow var(--qmt-transition-fast), transform var(--qmt-transition-fast);
}

.qmt-article-card,
.qmt-tool-card {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.qmt-card:hover,
.qmt-article-card:hover,
.qmt-category-card:hover,
.qmt-tool-card:hover {
	border-color: hsl(221 83% 53% / 0.3);
	box-shadow: var(--qmt-shadow-md);
	transform: translateY(-2px);
}

.qmt-badge {
	align-items: center;
	background: hsl(221 83% 53% / 0.1);
	border: 1px solid hsl(221 83% 53% / 0.2);
	border-radius: var(--qmt-radius-full);
	color: var(--qmt-color-primary);
	display: inline-flex;
	font-size: var(--qmt-font-size-xs);
	font-weight: var(--qmt-weight-semibold);
	gap: var(--qmt-space-1);
	line-height: 1;
	padding: 0.375rem 0.625rem;
}

.qmt-article-card-image,
.qmt-article-card-placeholder {
	align-items: center;
	aspect-ratio: 16 / 9;
	background: var(--qmt-color-background-secondary);
	border-radius: var(--qmt-radius-lg);
	display: flex;
	justify-content: center;
	margin-bottom: var(--qmt-space-4);
	overflow: hidden;
}

.qmt-article-card-image img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.qmt-article-card-placeholder {
	color: var(--qmt-color-primary);
}

.qmt-article-card-body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--qmt-space-2);
}

.qmt-article-card h3,
.qmt-category-card h3,
.qmt-tool-card h3 {
	font-size: var(--qmt-font-size-lg);
	margin: 0;
}

.qmt-article-card h3 a,
.qmt-category-card h3 a {
	color: var(--qmt-color-heading);
	text-decoration: none;
}

.qmt-article-card h3 a:hover,
.qmt-category-card h3 a:hover {
	color: var(--qmt-color-primary);
}

.qmt-article-card p,
.qmt-category-card p,
.qmt-tool-card p {
	color: var(--qmt-color-muted);
	font-size: var(--qmt-font-size-sm);
	margin: 0;
}

.qmt-article-category {
	color: var(--qmt-color-primary);
	font-size: var(--qmt-font-size-xs);
	font-weight: var(--qmt-weight-semibold);
	text-decoration: none;
	text-transform: uppercase;
}

.qmt-article-meta {
	color: var(--qmt-color-muted);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--qmt-font-size-xs);
	gap: var(--qmt-space-2);
	margin-top: var(--qmt-space-4);
}

.qmt-read-link {
	align-items: center;
	color: var(--qmt-color-primary);
	display: inline-flex;
	font-size: var(--qmt-font-size-sm);
	font-weight: var(--qmt-weight-semibold);
	margin-top: var(--qmt-space-4);
	text-decoration: none;
}

.qmt-read-link:hover {
	color: var(--qmt-color-primary-hover);
}

.qmt-category-posts {
	display: grid;
	gap: var(--qmt-space-2);
	list-style: none;
	margin: var(--qmt-space-4) 0 0;
	padding: 0;
}

.qmt-category-posts a {
	color: var(--qmt-color-heading);
	font-size: var(--qmt-font-size-sm);
	text-decoration: none;
}

.qmt-tool-icon {
	align-items: center;
	background: hsl(221 83% 53% / 0.1);
	border-radius: var(--qmt-radius-lg);
	color: var(--qmt-color-primary);
	display: inline-flex;
	height: 2.75rem;
	justify-content: center;
	margin-bottom: var(--qmt-space-3);
	width: 2.75rem;
}

.qmt-svg-icon {
	height: 1.2rem;
	width: 1.2rem;
}
