@charset "utf-8";
/* Offer Banner & Popup
 * see page_include/offer_banner.php
 * mobile menu width: 900px
 */

:root {
  --offer-bar-height: 34px;
  --offer-gold: #C9A24E;
  --offer-brown: #3A2418;
  --offer-cream: #FBF9F3; /* matches offer-curve.svg fill */
}

/*--- TOP BANNER ---*/
.offer-bar {
	z-index:5;
	height:var(--offer-bar-height);
	background:linear-gradient(90deg, #C9A24E 0%, #E6CC85 30%, #F6EBC0 50%, #E6CC85 70%, #C9A24E 100%);
	text-align:center;
	overflow:hidden;
}
.offer-bar a {
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0.35em;
	height:100%;
	padding:0 1em;
	color:#1A1A1A;
	font-family:'Montserrat', sans-serif;
	font-size:14px;
	font-weight:500;
	letter-spacing:0.5px;
	white-space:nowrap;
	text-decoration:none;
	transition:background 0.2s linear;
}
.offer-bar a:hover { background:rgba(255,255,255,0.25); color:#000; }
.offer-bar a u { text-underline-offset:3px; }
.offer-bar .sep { padding:0 0.2em; }


/*--- POPUP ---*/
/* backdrop - page blurred & darkened (body class set in pop_up_overlay.js) */
body.pop-open-offerPopup #blackOut {
	background:rgba(0,0,0,0.45);
	opacity:1;
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}

.pop-up-overlay-box.pop-offer {
	position:relative;
	max-width:1280px;
	width:92%;
	max-height:calc(100vh - 80px);
	padding:0 !important;
	border:2px solid #E9DDBF;
	border-radius:4px;
	/* inner gold line + drop shadow 
	box-shadow:inset 0 0 0 8px var(--offer-cream), inset 0 0 0 9px #D8BC7A, 0 10px 50px rgba(0,0,0,0.6);*/
	background:var(--offer-cream);
	overflow:auto;
}
.pop-offer .pop-up-overlay-content {
	display:grid;
	grid-template-columns:48% 52%;
	min-height:560px;
	color:var(--offer-brown);
	line-height:1.4;
	text-align:center;
}

/* left - text */
.pop-offer .offer-txt {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	/* roomy top/btm spacing that shrinks on short screens so the popup doesn't need to scroll */
	padding:clamp(2.5em, 7vh, 6.5em) 3em clamp(2.2em, 6.5vh, 6em);
}
.pop-offer .offer-txt p { margin:0; padding:0; }

.pop-offer .offer-eyebrow {
	font-family:'Montserrat', sans-serif;
	font-size:0.95em;
	font-weight:400;
	letter-spacing:6px;
	text-transform:uppercase;
	color:#2A2A2A;
}
.pop-offer .offer-eyebrow:after {
	content:"";
	display:block;
	width:60px;
	height:2px;
	margin:1.1em auto 0;
	background:var(--offer-gold);
}

.pop-up-overlay .pop-offer h2.offer-hd {
	margin:0.6em 0 0;
	padding:0;
	font-family:'Cormorant Garamond', Georgia, serif !important; /* overrides main.css Cinzel !important */
	font-size:4.8em;
	font-weight:700;
	line-height:0.95;
	letter-spacing:-0.5px;
	text-transform:none;
	white-space:nowrap;
	color:var(--offer-brown);
}
.pop-offer h2.offer-hd span {
	display:block;
	margin-top:0.15em;
	font-size:0.66em;
	font-weight:500;
	letter-spacing:0;
	white-space:normal;
	color:#2A1A10;
}

.pop-up-overlay .pop-offer p.offer-deal {
	margin-top:1.3em;
	font-family:'Montserrat', sans-serif;
	font-size:1.15em;
	line-height:1.5;
	color:#2A2A2A;
}
.pop-offer .offer-deal strong { font-weight:700; color:#6B3A1E; }

.pop-up-overlay .pop-offer p.offer-small {
	margin-top:1.3em;
	font-family:'Montserrat', sans-serif;
	font-size:0.85em;
	line-height:1.6;
	color:#555;
}

.pop-up-overlay .pop-offer p.offer-btn-row { margin-top:1.8em; }
.pop-offer a.btn.offer-btn {
	padding:0.9em 2.6em;
	border:1px solid #A8843E;
	border-radius:100px;
	font-family:'Montserrat', sans-serif;
	font-size:1.35em;
	font-weight:600;
	letter-spacing:0.5px;
	color:#1A1A1A;
	box-shadow:0 3px 8px rgba(120,90,30,0.25);
}
.pop-offer a.btn.offer-btn .arrow { display:inline-block; margin-left:0.4em; transition:transform 0.2s linear; }
.pop-offer a.btn.offer-btn:hover .arrow { transform:translateX(4px); }

.pop-up-overlay .pop-offer p.offer-link { margin-top:1.3em; }
.pop-offer .offer-link a {
	font-family:'Montserrat', sans-serif;
	font-size:0.95em;
	font-weight:500;
	color:#1A1A1A;
	text-decoration:underline;
	text-underline-offset:4px;
}
.pop-offer .offer-link a:hover { color:#6B3A1E; }

.pop-up-overlay .pop-offer p.offer-ft {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:1em;
	width:100%;
	margin-top:2.2em;
	font-family:'Montserrat', sans-serif;
	font-size:0.7em;
	letter-spacing:2.5px;
	text-transform:uppercase;
	white-space:nowrap;
	color:#555;
}
.pop-offer .offer-ft:before,
.pop-offer .offer-ft:after {
	content:"";
	flex:1;
	min-width:40px;
	max-width:70px;
	height:1px;
	background:var(--offer-gold);
}

/* right - image with curved gold edge */
.pop-offer .offer-img {
	position:relative;
	overflow:hidden;
	background:#D9D4CC;
}
.pop-offer .offer-img img {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:62% center;
}
.pop-offer .offer-img:before {
	content:"";
	position:absolute;
	top:-1px;
	bottom:-1px;
	left:-1px;
	width:30%;
	background:url(../images/offers/offer-curve.svg) no-repeat left top;
	background-size:auto 100%; /* keep svg proportions, scale to panel height */
	z-index:1;
}

/* close X */
.pop-offer .pop-up-overlay-close-x,
.pop-offer .pop-up-overlay-close-x:hover {
	top:18px;
	right:18px;
	width:44px;
	height:44px;
	font-size:1em;
	background:none;
	border-radius:50%;
	z-index:3;
}
.pop-offer .pop-up-overlay-close-x:hover { background:rgba(255,255,255,0.5); }
.pop-offer .pop-up-overlay-close-x:before,
.pop-offer .pop-up-overlay-close-x:after {
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:32px;
	height:1.5px;
	background:var(--offer-brown);
	transform:translate(-50%,-50%) rotate(45deg);
}
.pop-offer .pop-up-overlay-close-x:after { transform:translate(-50%,-50%) rotate(-45deg); }


/*--- RESPONSIVE ---*/
@media only screen and (max-width: 1150px) {
	.pop-offer .pop-up-overlay-content { min-height:520px; }
	.pop-offer .offer-txt { padding:clamp(2em, 5vh, 4em) 2.5em; }
	.pop-up-overlay .pop-offer h2.offer-hd { font-size:3.8em; }
}

@media only screen and (max-width: 900px) {
	:root { --offer-bar-height: 32px; }

	/* #header is fixed on mobile -> fix the bar above it & push the header/content down */
	.offer-bar { position:fixed; top:0; left:0; width:100%; z-index:101; }
	.offer-bar a { font-size:13px; }
	.has-offer-bar #header { top:var(--offer-bar-height); }
	.has-offer-bar #topSection,
	.has-offer-bar #header + #main { margin-top:calc(var(--header-height) + var(--offer-bar-height)); }

	/* popup - stacked, image on top */
	.pop-up-overlay-box.pop-offer { max-height:calc(100vh - 40px); }
	.pop-offer .pop-up-overlay-content { display:flex; flex-direction:column; min-height:0; }
	.pop-offer .offer-img { order:-1; flex:0 0 240px; height:240px; }
	.pop-offer .offer-img img { object-position:center 60%; }
	.pop-offer .offer-img:before {
		top:auto;
		bottom:-1px;
		/* wider than the panel so the steep ends of the arc sit off-screen */
		left:-40%;
		right:-40%;
		width:auto;
		height:44px;
		background:url(../images/offers/offer-curve-horz.svg) no-repeat center bottom;
		background-size:100% 100%;
		border-radius:0;
		box-shadow:none;
	}
	.pop-offer .offer-txt { padding:2em 1.5em 1.8em; }
	.pop-offer .pop-up-overlay-close-x,
	.pop-offer .pop-up-overlay-close-x:hover { top:10px; right:10px; background:rgba(255,255,255,0.7); }
	.pop-up-overlay .pop-offer p.offer-ft { margin-top:2em; }
}

@media only screen and (max-width: 650px) {
	.offer-bar .offer-bar-shop { display:none; }
	.offer-bar a { font-size:12px; letter-spacing:0.2px; }
	.pop-up-overlay-box.pop-offer { width:94%; }
	.pop-offer .offer-img { flex-basis:190px; height:190px; }
	.pop-up-overlay .pop-offer h2.offer-hd { font-size:3.6em; white-space:normal; }
	.pop-offer .offer-eyebrow { font-size:0.9em; letter-spacing:3px; }
	.pop-up-overlay .pop-offer p.offer-deal { font-size:1.2em; }
	.pop-up-overlay .pop-offer p.offer-ft { white-space:normal; letter-spacing:1.5px; }
	.pop-offer .offer-ft:before,
	.pop-offer .offer-ft:after { display:none; }
}

@media only screen and (max-width: 380px) {
	.offer-bar a { font-size:11px; }
	.pop-up-overlay .pop-offer h2.offer-hd { font-size:3.1em; }
}