:root {
	--yellow: hsl(47, 88%, 63%);
	--white: hsl(0, 0%, 100%);
	--gray-500: hsl(0, 0%, 42%);
	--gray-950: hsl(0, 0%, 7%);

	font-size: 10px;
}


body {
	font-size: 1.6rem;
	font-family: Figtree, sans-serif;
	font-weight: 500;
	color: var(--gray-950);
	background: var(--yellow);
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.blog-preview-card {
	background: white;
	border: 0.1rem solid black;
	border-radius: 1em;
	max-width: 30rem;
	padding: 1.5em;
	box-shadow: 0.5em 0.5em var(--gray-950);
	margin: 0 0.5em;
}

.preview-image img {
	width: 100%;
	border-radius: 1em;
}

.category {
	font-weight: 800;
	background: var(--yellow);
	padding: 0.2em 0.5em;
	margin: 1em 0;
	width: fit-content;
	border-radius: 0.3em;
}


.blog-preview-card h1 {
	font-size: 1.5em;
	font-weight: 800;
}

.blog-preview-card h1:hover {
	color: var(--yellow);
	cursor: pointer;
}

.excerpt {
	color: var(--gray-500);
}

.author {
	display: flex;
	align-items: center;
	gap: 0.5em;
	font-weight: 800;
}

.author img {
	width: 3rem;
}