@layer blocks {
	.column {
		align-content: start;
		display: grid;
		gap: 20px;
		isolation: isolate;
		position: relative;

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

		&.column-paddings {
			padding: 30px;

			@media (width >= 48em) {
				padding: 40px;
			}
		}

		&.image-fill-container {
			align-content: normal;

			& img {
				height: 100%;
				object-fit: cover;
			}
		}

		& .background {
			inset: 0;
			margin: 0;
			position: absolute;
			z-index: -1;

			& img {
				block-size: 100%;
				object-fit: cover;
				inline-size: 100%;
			}
		}

		.equal-columns-height & {
			height: 100%;
		}
	}
}