/* @group Shop & Dine
------------------------------------ */
.shop-dine {
	position: relative;
	isolation: isolate;
}

.shop-dine .subtitle {
	color: var(--rose-gold);
	display: block;
	margin-bottom: 2rem;
	font: normal 700 2em / 1.6em var(--proxima-font);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.shop-dine h2 {
	color: var(--navy-blue);
	font: normal 700 3em / 1.6em var(--proxima-font);
	letter-spacing: 0.066em;
	text-transform: uppercase;
}
.shop-dine p {
	color: var(--navy-blue);
	font: normal 500 1.6em / 2.4em var(--proxima-font);
}
.shop-dine .bttn-outlined {
	margin-top: 3rem;
}

.shop-dine .bg {
	position: absolute;
	right: 0;
	z-index: -1;
}
/* Animations
----------------------*/
@media only screen
and (min-width : 961px) {
  .shop-dine {
		padding-bottom: 10rem;
	}
	.shop-dine p {
		font-size: 2em;
		line-height: 1.35em;
	}
	.shop-dine h2 {
		font-size: 4.5em;
		line-height: 1em;
		margin-bottom: 3rem;
	}
	.shop-dine .video-container {
		height: 77rem;
	}
	.shop-dine .bg {
		width: 82.4rem;
		height: 79.8rem;
		top: -8rem;
	}
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
  .shop-dine {
		margin-block: 10em;
	}
	.shop-dine header {
		margin-top: 8.4em;
		max-width: calc(70vw + 13em);
	}
	.shop-dine .video-container {
		width: calc(100% - 6.5em);
		margin-inline: auto;
		margin-bottom: 10em;
        order: -1;
        height: 26.4em;
	}
	.shop-dine .video-container::after {
		inset: 0 3.75em;
	}
	.shop-dine .bg {
		width: 22.5em;
		height: 26.4em;
		top: 3em;
		bottom: unset;
	}
}
/* @end */