.editorial-gallery {
	--text-color: var(--black);
	padding: 0 var(--space-5);
	max-width: 1200px;
	margin: 0 auto var(--space-12);

	.content-section {

		p {
			font-size: var(--text-sm);

			@media (min-width: 64em) {
				& {
					font-size: var(--text-base);
				}
			}
		}
	}

	.slides {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 6px;
		margin-bottom: var(--space-2);

		.slide {
			width: 100%;

			.img-cont {
				width: 100%;
				height: 100%;
				position: relative;

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

				.index {
					position: absolute;
					bottom: 0;
					z-index: 1;
					padding: var(--space-px) var(--space-2);
					font-size: var(--text-sm);
					font-weight: 600;
					background: var(--beige);
					color: var(--black);
				}
			}
		}

		&[data-slides='3'] {
			.slide:last-child {
				grid-column-start: 2;
				grid-row-start: 1;
				grid-row-end: span 2;
			}
		}
		&[data-slides='5'] {
			grid-template-columns: minmax(0, 1fr) repeat(2, minmax(0, 0.5fr));
			grid-template-rows: minmax(0, 1fr) minmax(0, 0.25fr) minmax(0, 1fr);

			.slide {
				&:nth-child(1) {
					grid-column: 1 / 2;
					grid-row: 1 / 3;
				}

				&:nth-child(2) {
					grid-column: 1 / 2;
					grid-row: 3 / 4;
				}

				&:nth-child(5) {
					grid-column: 2 / 4;
					grid-row: 2 / 4;
				}
			}
		}
		&[data-slides='6'] {
			grid-template-columns: repeat(4, minmax(0, 0.5fr));
			grid-template-rows: minmax(0, 1fr) minmax(0, 0.25fr) minmax(0, 1fr);

			.slide {
				&:nth-child(1) {
					grid-column: span 2;
					grid-row: 1 / 3;
				}

				&:nth-child(4) {
					grid-column: 3 / 4;
					grid-row-start: 1;
				}

				&:nth-child(5) {
					grid-column: 4 / 5;
					grid-row-start: 1;
				}

				&:nth-child(6) {
					grid-column: 3 / 5;
					grid-row: 2 / 4;
				}
			}
		}

		@media (min-width: 64em) {
			& {
				gap: var(--space-5);
				margin-bottom: var(--space-4);
			}
		}
	}
}

.blog-detail .editorial-gallery { padding: 0; }