.locations-section {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0.72rem 0;
}
@media screen and (max-width: 768px) and (orientation: portrait) {
	.locations-section {
		padding: 0.4rem 0;
}
	}
.locations-section .container{
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		gap: 0.48rem;
	}
.locations-section .locations-list-wrap {
		position: relative;
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
		gap: 0.18rem;
	}
@media screen and (max-width: 768px) and (orientation: portrait) {
	.locations-section .locations-list-wrap {
			flex-direction: column;
			gap: 0.2rem;
	}
		}
:is(.locations-section .locations-list-wrap) .locations-item {
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			justify-content: center;
			width: 6.3rem;
		}
@media screen and (max-width: 768px) and (orientation: portrait) {
	:is(.locations-section .locations-list-wrap) .locations-item {
				width: 100%;
		}
			}
:is(:is(.locations-section .locations-list-wrap) .locations-item) .locations-item-image {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				aspect-ratio: 630/310;
				border-radius: 0.32rem;
				overflow: hidden;
			}
@media screen and (max-width: 768px) and (orientation: portrait) {
	:is(:is(.locations-section .locations-list-wrap) .locations-item) .locations-item-image {
					aspect-ratio: 353/310;
			}
				}
:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .locations-item-image) img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap {
				position: relative;
				display: flex;
				flex-direction: column;
				align-items: flex-start;
				justify-content: center;
				gap: 0.18rem;
				padding: 0.24rem;
				width: 100%;
			}
@media screen and (max-width: 768px) and (orientation: portrait) {
	:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap {
					padding: 0.24rem 0;
			}
				}
:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .locations-item-title {
					color: var(--orange);
				}
:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .text-wrap {
					color: var(--dark-grey);
				}
:is(:is(:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .text-wrap) p) a {
							color: var(--dark-grey);
							text-decoration: underline;
							transition: color 0.4s ease-in-out;
						}
:is(:is(:is(:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .text-wrap) p) a):hover {
								color: var(--orange);
							}
:is(:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .text-wrap) .modal-btn {
						display: inline-block;
						color: var(--dark-grey);
						text-decoration: underline;
						cursor: pointer;
						transition: color 0.4s ease-in-out;
					}
:is(:is(:is(:is(:is(.locations-section .locations-list-wrap) .locations-item) .location-info-wrap) .text-wrap) .modal-btn):hover {
							color: var(--orange);
						}