/** Shopify CDN: Minification failed

Line 50:12 Expected identifier but found whitespace
Line 50:13 Unexpected "linear-gradient("

**/
/* ==========================================================================
   SUPPLEMENTS · STACK  —  Figma "Sage Space - Supplements" @1920
   Cream section holding an inset rounded night-image band (bokeh + both
   bottles): eyebrow, two-tone headline, sub-line, price, CTA pill and note.
   Mobile-first; desktop (>=992px) is exact at a 1920 viewport.
   ========================================================================== */

.supp-stack {
	padding-top: clamp(13.93px, 4.352vw, 43.13px);
	padding-inline: clamp(15.7px, 4.907vw, 48.63px);
	--text-highlight-color: var(--text-highlight-color-bright);
}
.supp-stack__band {
	position: relative;
	isolation: isolate;
	overflow: clip;
	border-radius: clamp(11.85px, 3.704vw, 36.7px);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-block: clamp(32.3px, 10.093vw, 100.02px);
	padding-inline: clamp(22.22px, 6.944vw, 68.82px);
	color: #fff;
}
.supp-stack__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
}
.supp-stack__bg img {
    width: 100%;
	height: 100%;
	object-fit: cover;
}
/* .supp-stack__band::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	/* mobile: dark top fading down so the bottles show below the copy */
	background: linear-gradient(180deg, #F5F2EC 0%, rgba(0, 0, 0, 0) 100%);
} */
.supp-stack__eyebrow {
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	line-height: 0.905;
	white-space: nowrap;
	font-size: clamp(12.44px, 3.889vw, 38.54px);
	margin-bottom: clamp(2.67px, 0.833vw, 8.26px);
}
.supp-stack__heading {
	margin-bottom: clamp(7.41px, 2.315vw, 22.94px);
}
.supp-stack__sub {
	margin-bottom: clamp(10.37px, 3.241vw, 32.12px);
}
.supp-stack__price {
	font-weight: 700;
	line-height: 0.9;
	color: var(--text-highlight-color);
	font-size: clamp(18.96px, 5.926vw, 58.73px);
	margin-bottom: clamp(8.89px, 2.778vw, 27.53px);
	margin-top: 0;
}
.supp-stack__btn {
	min-width: clamp(91.85px, 28.704vw, 284.45px);
	padding-inline: 1em;
	margin-bottom: clamp(10.37px, 3.241vw, 32.12px);
}

/* ---- desktop (>=992px): exact at 1920 -------------------------------- */
@media (min-width: 992px) {
	.supp-stack {
		padding-top: clamp(49.6px, 5vw, 96px);
        padding-inline: clamp(67.2px, 6.77vw, 130px) clamp(88px, 8.924vw, 170px);
	}
	.supp-stack__band {
		border-radius: clamp(25px, 2.6247vw, 50px);
		padding-block: clamp(57px, 6.0367vw, 115px) clamp(64px, 6.7192vw, 128px);
		padding-inline: clamp(51.6px, 5.2vw, 100px);
	}
	/* .supp-stack__band::after {
		background: linear-gradient(90deg, #F5F2EC 0%, rgba(0, 0, 0, 0) 65%);
	} */
	.supp-stack__eyebrow {
		line-height: 1.357;
		font-size: clamp(14.5px, 1.458vw, 28px);
		margin-bottom: clamp(4.7px, 0.47vw, 9px);
	}
	.supp-stack__heading {
		margin-bottom: clamp(14.5px, 1.46vw, 28px);
		font-size: clamp(35px, 3.2vw, 68px);
	}
	.supp-stack__sub {
		margin-bottom: clamp(12.9px, 1.3vw, 25px);
		font-size: 24px;
	}
	.supp-stack__price {
		line-height: 0.867;
		font-size: clamp(46.5px, 4.6875vw, 90px);
		margin-bottom: clamp(18.1px, 1.82vw, 35px);
	}
	.supp-stack__btn {
		min-width: clamp(160.2px, 16.15vw, 310px);
		padding-inline: 1em;
		margin-bottom: clamp(10.9px, 1.1vw, 21px);
	}
    .supp-stack__bg--mobile {
        display: none;
    }
}
@media (max-width: 991.5px) {
    .supp-stack__band {
    	aspect-ratio: 980 / 1421;
    }
    .supp-stack__bg--desktop {
        display: none;
    }
	.supp-stack__band::after,
    .supp-stack__heading br {
        display: none;
    }
	
}
