.site-main {
	padding-left: var(--space-md);
	padding-right: var(--space-md);
	padding-top: calc(var(--space-xxl) * 2);
	.container {
		max-width: 960px;
		figure {
			width: calc(100% + 4rem);
			transform: translateX(-2rem);
			margin: var(--space-md) auto;

			img {
				border-radius: var(--border-radius-xl);
				display: block;
				width: 100%;
				height: auto;
				transition: transform 0.2s ease-in;
				margin: 0 auto;

				&:hover {
					transform: scale(1.01);
				}
			}

			figcaption {
				text-align: center;
				font-size: var(--font-text);
				margin: 0;
				padding: var(--space-md) 0;
			}
		}

		.post-header {
			.cat-chips {
				display: flex;
				gap: var(--space-lg);
				.chip {
					font-size: var(--font-size-base);
					color: var(--smx-color-text);
					text-decoration: none;
					text-transform: uppercase;
					font-weight: bold;
				}
			}

			h1 {
				font-size: var(--font-title-main);
				color: var(--smx-color-black);
				margin: var(--space-md) 0;

				strong {
					color: var(--smx-primary);
				}
			}

			.excerpt {
				h2 {
					margin: var(--space-sm) 0;
					font-size: var(--font-subtitle);
					color: var(--smx-color-text-bold);
					margin-top: 0;
					line-height: 1.21;
				}
			}

			.datetime {
				font-size: var(--font-size-lg);
				color: var(--smx-color-text-bold);
			}
		}

		.content {
			font-size: 17px;
			line-height: 1.4705882353;
			font-weight: 400;
			letter-spacing: -0.022em;
			font-family:
				'Open Sans', 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica', 'Arial',
				sans-serif;
			p {
				margin-bottom: 1.4211026316em;
			}
			a {
				text-decoration: none;
				color: var(--smx-color-primary-contrast);
			}

			.is-layout-grid,
			.is-layout-flex {
				@media (max-width: 768px) {
					diplay: grid;
					gap: var(--space-md);
					grid-template-columns: 1fr;
				}
			}

			.card {
				background-color: var(--smx-color-white);
				border-radius: var(--border-radius-lg);
				color: var(--smx-color-text);
				display: flex;
				flex-direction: column;
				height: 100%;
				overflow: hidden;
				text-align: left;
				padding: var(--space-lg);
				h3 {
					font-size: var(--font-size-lg);
					color: var(--smx-color-text-bold);
					padding-bottom: 0;
					@media (max-width: 768px) {
						font-size: var(--font-title-md);
						padding: var(--space-lg);
					}
				}
				p {
					flex: auto;
					margin-top: var(--space-sm);
					font-size: var(--font-text);
					@media (max-width: 768px) {
						font-size: var(--font-size-base);
					}
				}
			}

			a.wp-block-button__link {
				background: linear-gradient(
					0deg,
					var(--smx-color-primary-contrast) 0%,
					var(--smx-color-primary) 100%
				);
				border-radius: var(--border-radius-md);
				color: var(--smx-color-white);
			}
		}
	}
}
