@layer blocks {
	.blog-hero {
		& h1 {
			margin-block-end: 20px;

			@media (width >= 48em) {
				margin-block-end: 30px;
			}
		}

		& img {
			margin-block-start: 15px;
		}
	}

	.blog-time {
		color: var(--color-gray-3);
		font-size: var(--body-font-size-xs);
	}

	.blog-author {
		margin-block-start: 40px;
		text-align: center;

		@media (width >= 48em) {
			margin-block-start: 60px;
		}

		& p + p {
			margin-block-start: 0;
		}
	}

	.blog-jumplinks {
		margin-block-start: 15px;
	}
}