.locationimages--section {
	position: relative;
}

.locationimages--title {
	padding: 0 30px 1px;
	text-align: center;
	max-width: 1200px;
	margin: 0 auto 30px;
}

/* Two-column image grid (replaces the old Bootstrap container/row/col-6).
   Hidden on mobile; only shown at 992px+ (was d-none d-lg-block). */
.locationimages--container {
	display: none;
	max-width: var(--theme-content-width);
	margin: 0 auto;
	padding: 0 var(--theme-content-padding) 30px;
}

.locationimages--grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
}

.locationimages--grid .locationimages--image {
	aspect-ratio: 100 / 79;
}

@media (min-width: 992px) {
	.locationimages--grid {
		gap: 30px;
	}

	/* Hang the two images off the section's bottom edge so they overhang this
	   block and the following block 50/50 (instead of pulling up with a
	   negative margin). */
	.locationimages--container {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		transform: translateY(50%);
		z-index: 2;
		padding-bottom: 0;
	}
}
