main {
  min-height: calc(100svh - var(--topbar-height, 0px));
}

.page-numbers {
		padding: var(--pad-xs) var(--pad-sm);
		border-radius: var(--corner-sm);
		color: var(--color-black);
		min-width: 4ch;
		text-align: center;
	}
	.page-numbers.current {
		background-color: var(--color-light-2);
	}
	.post-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		gap: var(--pad-sm)
	}
	.card {
		overflow: hidden;
		border-radius: var(--corner-md);
		padding: var(--pad-sm);
		position: relative;
	}
	@media (hover:hover) {
		.card {
			will-change: transform;
			transition: transform .3s ease-in-out, box-shadow .3s ease-in-out;
		}
		.card:hover {
			transform: translateY(-10px);
			box-shadow: var(--shadow-lg);
		}
	}
	.card-thumbnail {
		max-height: 150px;
		border-radius: var(--corner-sm);
		overflow: clip;
		display: flex;
		justify-content: center;
	}
	.card-thumbnail img {
		object-fit: cover;
		min-width: 100%;
		height: 150px;
	}
	.card-content {
		padding: var(--pad-sm);
	}

	@supports (interpolate-size: allow-keywords) {
		.card:hover .post-excerpt-wrapper {
			max-height: fit-content;
		}
	}